/* ============================================================
   UTILITIES
============================================================ */

.container {
  width: 100%;
  max-width: var(--container-max);
  margin-inline: auto;
  padding-inline: var(--container-px);
  box-sizing: border-box;
}

.full-bleed {
  width: 100vw;
  margin-left: calc(50% - 50vw);
}

.stack {
  display: flex;
  flex-direction: column;
}

.stack > * + * { margin-top: var(--stack-gap, var(--space-4)); }

.sr-only {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}

.display-italic {
  font-style: italic;
  color: var(--gold);
}

.section-title em,
.apt-teaser__title em,
.location-section__title em {
  font-style: italic;
  color: var(--terracotta-600);
}

.title-accent {
  font-style: italic;
  font-weight: 400;
  color: var(--mangue-600);
}

.section-cta {
  display: flex;
  justify-content: flex-start;
  padding-top: var(--space-4);
}

.has-grain { position: relative; }

.has-grain::after {
  content: '';
  position: absolute;
  inset: 0;
  pointer-events: none;
  opacity: 0.04;
  background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 200 200' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.65' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
  background-repeat: repeat;
  background-size: 200px;
  mix-blend-mode: overlay;
}