/**
 * Reference homepage layout — matches home-page.tsx
 */

body.reference-home {
  background: #fff;
}

body.reference-home .container {
  margin-inline: auto;
  max-width: var(--container-page, 82.5rem);
  padding-inline: clamp(1.25rem, 4vw, 2rem);
  width: 100%;
}

body.reference-home .section {
  padding-block: clamp(2.75rem, 4.5vw, 3.75rem);
}

body.reference-home .tone-stone {
  background: #fff;
}

body.reference-home .tone-espresso {
  background: var(--espresso);
  color: color-mix(in srgb, var(--ivory) 88%, transparent);
  position: relative;
}

body.reference-home .tone-espresso h2,
body.reference-home .tone-espresso h3 {
  color: var(--ivory);
}

body.reference-home .font-display-italic {
  font-family: var(--font-display);
  font-style: italic;
  font-variation-settings: "SOFT" 100, "WONK" 1;
}

body.reference-home .text-clay { color: var(--clay); }
body.reference-home .text-brass { color: var(--brass); }

/* Hero */
body.reference-home .ref-hero {
  height: min(52rem, calc(100svh - 12rem));
  margin-top: -4.5rem;
  max-height: 57.5rem;
  min-height: 38rem;
  overflow: hidden;
  position: relative;
}

/* The reference slider supplies its own controlled overlay element. */
body.reference-home .ref-hero::after {
  content: none;
}

@media (min-width: 64rem) {
  body.reference-home .ref-hero {
    margin-top: -6.75rem;
  }
}

@media (max-width: 767px) {
  body.reference-home .ref-hero {
    height: min(48rem, calc(100svh - 10rem));
    min-height: 34rem;
  }
}

body.reference-home .ref-hero .hero-slide {
  inset: 0;
  opacity: 0;
  position: absolute;
  transition: opacity 1s cubic-bezier(.16, 1, .3, 1);
}

body.reference-home .ref-hero .hero-slide.is-active {
  opacity: 1;
  z-index: 1;
}

/* The global YouTube layer must sit behind a full-height slide stack.  A
 * relative, zero-height stack makes the copy flow below the hero and causes
 * the Elementor padding controls to appear ineffective. */
body.reference-home .ref-hero.hero--global-video .hero-slides {
  inset: 0;
  position: absolute;
  z-index: 1;
}

body.reference-home .ref-hero__image {
  filter: brightness(1.06) contrast(1.04) saturate(1.14);
  height: 100%;
  inset: 0;
  object-fit: cover;
  position: absolute;
  width: 100%;
}

body.reference-home .ref-hero__overlay {
  background:
    linear-gradient(to top, color-mix(in srgb, var(--espresso) 62%, transparent), color-mix(in srgb, var(--espresso) 14%, transparent) 48%, color-mix(in srgb, var(--espresso) 8%, transparent)),
    linear-gradient(to right, color-mix(in srgb, var(--espresso) 28%, transparent), transparent 58%);
  inset: 0;
  pointer-events: none;
  position: absolute;
  z-index: 1;
}

body.reference-home .ref-hero__content-wrap {
  align-items: flex-end;
  display: flex;
  height: 100%;
  padding-bottom: clamp(6.5rem, 12vw, 10rem);
  position: relative;
  z-index: 2;
}

body.reference-home .ref-hero__content {
  color: var(--ivory);
  flex: 0 0 min(62vw, 48rem);
  margin-inline-start: clamp(1rem, 5vw, 3.5rem);
  max-width: 44rem;
  min-width: min(62vw, 48rem);
  width: min(62vw, 44rem);
}

body.reference-home .ref-hero__content h1,
body.reference-home .ref-hero__content h2 {
  color: var(--ivory);
  font-family: var(--font-display);
  font-size: clamp(3.75rem, 7vw, 6.5rem);
  font-weight: 600;
  letter-spacing: -.03em;
  line-height: .94;
  margin-top: 1rem;
  overflow-wrap: normal;
  text-wrap: balance;
  word-break: normal;
}

body.reference-home .ref-hero__eyebrow {
  font-size: .6875rem;
  letter-spacing: .24em;
}

body.reference-home .ref-hero__eyebrow[data-accent="clay"] { color: var(--clay); }
body.reference-home .ref-hero__eyebrow[data-accent="bush"] { color: var(--bush); }
body.reference-home .ref-hero__eyebrow[data-accent="brass"] { color: var(--brass); }
body.reference-home .ref-hero__eyebrow[data-accent="acacia"] { color: var(--acacia); }

body.reference-home .ref-hero__content .lede {
  color: color-mix(in srgb, var(--ivory) 85%, transparent);
  font-size: clamp(.96875rem, 1.6vw, 1.0625rem);
  line-height: 1.6;
  margin-top: 1.25rem;
  max-width: 36rem;
}

body.reference-home .ref-hero__actions {
  display: flex;
  flex-wrap: wrap;
  gap: .75rem;
  margin-top: 1.75rem;
}

body.reference-home .btn--lg {
  min-height: 3.25rem;
  padding-inline: 2rem;
}

body.reference-home .ref-hero__controls {
  position: absolute;
  z-index: 3;
}

body.reference-home .ref-hero__controls--arrows {
  bottom: 2rem;
  display: flex;
  gap: .75rem;
  right: clamp(1rem, 4vw, 2rem);
}

body.reference-home .ref-hero__arrow {
  backdrop-filter: blur(6px);
  background: color-mix(in srgb, var(--espresso) 20%, transparent);
  border: 1px solid color-mix(in srgb, var(--ivory) 30%, transparent);
  border-radius: 9999px;
  height: 2.5rem;
  width: 2.5rem;
}

body.reference-home .ref-hero__controls--lines {
  align-items: center;
  bottom: 2rem;
  display: flex;
  gap: .75rem;
  left: 50%;
  transform: translateX(-50%);
}

@media (min-width: 48rem) {
  body.reference-home .ref-hero__controls--lines {
    left: clamp(1rem, 4vw, 2rem);
    transform: none;
  }
}

body.reference-home .ref-hero__lines {
  display: flex;
  gap: .375rem;
}

body.reference-home .ref-hero__line {
  background: color-mix(in srgb, var(--ivory) 35%, transparent);
  border: 0;
  border-radius: 9999px;
  cursor: pointer;
  height: 2px;
  padding: 0;
  transition: all .5s cubic-bezier(.16, 1, .3, 1);
  width: 1.25rem;
}

body.reference-home .ref-hero__line.is-active {
  background: var(--ivory);
  width: 2.5rem;
}

body.reference-home .ref-hero__counter {
  color: color-mix(in srgb, var(--ivory) 70%, transparent);
  display: none;
  font-family: var(--font-body);
  font-size: .71875rem;
  letter-spacing: .18em;
  text-transform: uppercase;
}

@media (min-width: 48rem) {
  body.reference-home .ref-hero__counter {
    display: inline;
  }
}

/* Journey finder overlap */
body.reference-home .ref-journey-finder {
  margin-top: -4rem;
  position: relative;
  z-index: 20;
}

@media (min-width: 48rem) {
  body.reference-home .ref-journey-finder {
    margin-top: -5rem;
  }
}

body.reference-home .ref-journey-finder .journey-finder-section {
  margin-top: 0;
  padding-inline: 0;
}

body.reference-home .ref-journey-finder .journey-finder {
  border-radius: 1rem;
  max-width: none;
}

/* Quick services */
body.reference-home .ref-quick-services__grid {
  display: grid;
  gap: .75rem;
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

@media (min-width: 48rem) {
  body.reference-home .ref-quick-services__grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}

@media (min-width: 64rem) {
  body.reference-home .ref-quick-services__grid {
    grid-template-columns: repeat(4, minmax(0, 1fr));
  }
}

body.reference-home .ref-quick-services.section {
  padding-block: clamp(2.5rem, 4vw, 3.25rem);
}

body.reference-home .ref-quick-card {
  background: var(--card, color-mix(in srgb, white 72%, var(--ivory)));
  border: 1px solid color-mix(in srgb, var(--sand) 75%, transparent);
  border-radius: .75rem;
  color: inherit;
  display: block;
  padding: 1.25rem;
  text-decoration: none;
  transition: transform .3s cubic-bezier(.16, 1, .3, 1), box-shadow .3s cubic-bezier(.16, 1, .3, 1), border-color .3s;
}

body.reference-home .ref-quick-card:hover {
  border-color: color-mix(in srgb, var(--clay) 30%, transparent);
  box-shadow: 0 1px 2px -1px rgba(31, 26, 20, .04), 0 8px 24px -8px rgba(31, 26, 20, .08);
  transform: translateY(-2px);
}

body.reference-home .ref-quick-card__top {
  align-items: flex-start;
  display: flex;
  justify-content: space-between;
}

body.reference-home .ref-quick-card__icon {
  align-items: center;
  background: color-mix(in srgb, var(--clay) 7%, transparent);
  border-radius: 9999px;
  color: var(--clay);
  display: inline-flex;
  font-size: 1.1rem;
  height: 2.75rem;
  justify-content: center;
  transition: background .3s, color .3s;
  width: 2.75rem;
}

body.reference-home .ref-quick-card:hover .ref-quick-card__icon {
  background: var(--clay);
  color: var(--ivory);
}

body.reference-home .ref-quick-card__arrow {
  color: var(--muted);
  opacity: 0;
  transform: translateX(-4px);
  transition: opacity .3s, transform .3s, color .3s;
}

body.reference-home .ref-quick-card:hover .ref-quick-card__arrow {
  color: var(--clay);
  opacity: 1;
  transform: translateX(0);
}

body.reference-home .ref-quick-card__label {
  font-size: .875rem;
  font-weight: 500;
  margin-top: 1rem;
}

body.reference-home .ref-quick-card__blurb {
  color: var(--muted-foreground, var(--muted));
  font-size: .75rem;
  line-height: 1.4;
  margin-top: .25rem;
}

/* Section headers */
body.reference-home .ref-section-header {
  align-items: flex-end;
  display: flex;
  flex-wrap: wrap;
  gap: 1.5rem;
  justify-content: space-between;
  margin-bottom: 2.5rem;
}

body.reference-home .ref-section-header--center {
  flex-direction: column;
  text-align: center;
}

body.reference-home .ref-section-header--center .ref-section-header__copy {
  margin-inline: auto;
  max-width: 48rem;
}

body.reference-home .ref-section-header h2 {
  font-family: var(--font-display);
  font-size: clamp(1.85rem, 3vw, 2.75rem);
  font-weight: 400;
  letter-spacing: -.015em;
  line-height: 1.08;
  margin-top: .75rem;
}

body.reference-home .ref-section-header__intro {
  color: var(--muted-foreground, var(--muted));
  font-size: .9375rem;
  line-height: 1.6;
  margin-top: 1rem;
  max-width: 36rem;
}

body.reference-home .ref-section-header__link {
  border-radius: 9999px;
  font-size: .84375rem;
  letter-spacing: .04em;
  white-space: nowrap;
}

body.reference-home .ref-section-header--center .ref-section-header__intro {
  margin-inline: auto;
}

/* Safari grid */
body.reference-home .ref-safari-grid .safari-card__media img,
body.reference-home .ref-safari-grid .tour-card__media img,
body.reference-home .ref-safari-grid .tour-card__media .image-fallback {
  aspect-ratio: auto !important;
  height: 100% !important;
  inset: 0;
  max-height: none !important;
  min-height: 100%;
  object-fit: cover;
  position: absolute;
  width: 100%;
}

body.reference-home .ref-safari-grid .safari-card__media,
body.reference-home .ref-safari-grid .tour-card__media {
  aspect-ratio: 4 / 5;
  position: relative;
  width: 100%;
}

body.reference-home .ref-safari-grid .grid-4,
body.reference-home .ref-safari-grid .tour-scroll,
body.reference-home .ref-safari-grid > div {
  display: grid;
  gap: 1.25rem;
  grid-template-columns: 1fr;
}

@media (min-width: 40rem) {
  body.reference-home .ref-safari-grid .grid-4,
  body.reference-home .ref-safari-grid .tour-scroll,
  body.reference-home .ref-safari-grid > div {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (min-width: 64rem) {
  body.reference-home .ref-safari-grid .grid-4,
  body.reference-home .ref-safari-grid .tour-scroll,
  body.reference-home .ref-safari-grid > div {
    grid-template-columns: repeat(4, minmax(0, 1fr));
  }
}

/* Holidays */
body.reference-home .ref-holiday-grid {
  display: grid;
  gap: 1.25rem;
  grid-template-columns: 1fr;
}

@media (max-width: 767px) {
  body.reference-home .ref-hero__content {
    flex-basis: 100%;
    max-width: 34rem;
    min-width: 0;
    width: 100%;
    margin-inline-start: 0;
  }

  body.reference-home .ref-hero__content h1,
  body.reference-home .ref-hero__content h2 {
    font-size: clamp(2.7rem, 12vw, 3.5rem);
    line-height: .98;
  }
}

.hero__video-wrap{position:absolute;inset:0;background-size:cover;background-position:center;overflow:hidden}.hero__video{position:absolute;left:50%;top:50%;width:177.78vh;min-width:100%;height:56.25vw;min-height:100%;transform:translate(-50%,-50%);border:0;pointer-events:none}@media(max-width:767px),(prefers-reduced-motion:reduce){.hero__video{display:none}}

@media (min-width: 48rem) {
  body.reference-home .ref-holiday-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  body.reference-home .ref-holiday-grid--2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  body.reference-home .ref-holiday-grid--4 { grid-template-columns: repeat(4, minmax(0, 1fr)); }
}

body.reference-home .holiday-card__media {
  aspect-ratio: 3 / 2;
  display: block;
  overflow: hidden;
  position: relative;
}

body.reference-home .holiday-card__media img {
  height: 100%;
  object-fit: cover;
  width: 100%;
}

body.reference-home .holiday-card__overlay {
  background: linear-gradient(to top, color-mix(in srgb, var(--espresso) 34%, transparent), transparent 52%);
  display: flex;
  flex-direction: column;
  inset: 0;
  justify-content: flex-end;
  padding: 1rem;
  position: absolute;
}

body.reference-home .holiday-card__type {
  color: color-mix(in srgb, var(--ivory) 85%, transparent);
  font-size: .65625rem;
  letter-spacing: .16em;
  text-transform: uppercase;
}

body.reference-home .holiday-card__destination {
  color: var(--ivory);
  font-family: var(--font-display);
  font-size: 1.375rem;
  margin-top: .125rem;
}

body.reference-home .ref-holiday-empty {
  border: 1px solid color-mix(in srgb, var(--sand) 75%, transparent);
  border-radius: .75rem;
  color: inherit;
  display: flex;
  flex-direction: column;
  overflow: hidden;
  text-decoration: none;
  transition: border-color .3s, box-shadow .3s, transform .3s;
}

body.reference-home .ref-holiday-empty:hover {
  border-color: color-mix(in srgb, var(--clay) 30%, transparent);
  box-shadow: 0 8px 24px -8px rgba(31, 26, 20, .08);
  transform: translateY(-2px);
}

body.reference-home .ref-holiday-empty .holiday-card__media {
  display: block;
}

body.reference-home .ref-holiday-empty__footer {
  background: var(--card, color-mix(in srgb, white 72%, var(--ivory)));
  padding: 1rem 1.25rem;
}

body.reference-home .ref-holiday-empty__cta {
  color: var(--clay);
  font-size: .8125rem;
  font-weight: 500;
}

/* Destination hub */
body.reference-home .ref-destination-hub__grid {
  display: grid;
  gap: 3rem;
}

@media (min-width: 64rem) {
  body.reference-home .ref-destination-hub__grid {
    align-items: center;
    grid-template-columns: 1fr 1fr;
  }
}

body.reference-home .ref-destination-hub__copy h2 {
  font-family: var(--font-display);
  font-size: clamp(2.25rem, 4vw, 3.75rem);
  line-height: 1.05;
  margin-top: .75rem;
}

body.reference-home .ref-destination-hub__copy > p:not(.eyebrow) {
  color: color-mix(in srgb, var(--espresso) 72%, transparent);
  font-size: .96875rem;
  line-height: 1.6;
  margin-top: 1.25rem;
  max-width: 32rem;
}

body.reference-home .ref-destination-hub.tone-espresso .ref-destination-hub__copy > p:not(.eyebrow) {
  color: color-mix(in srgb, var(--ivory) 75%, transparent);
}

body.reference-home .ref-destination-hub__features {
  display: grid;
  gap: 1rem;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  list-style: none;
  margin: 1.75rem 0 0;
  max-width: 28rem;
  padding: 0;
}

body.reference-home .ref-destination-hub__features li {
  align-items: center;
  color: var(--espresso);
  display: flex;
  font-size: .84375rem;
  font-weight: 500;
  gap: .625rem;
  padding-left: 0;
  position: relative;
}

body.reference-home .ref-destination-hub.tone-espresso .ref-destination-hub__features li {
  color: color-mix(in srgb, var(--ivory) 88%, transparent);
}

body.reference-home .ref-destination-hub__features li::before {
  content: none;
}

body.reference-home .ref-destination-hub__feature-icon {
  align-items: center;
  background: color-mix(in srgb, var(--espresso) 8%, transparent);
  border-radius: 9999px;
  color: var(--clay);
  display: inline-flex;
  flex-shrink: 0;
  font-size: .75rem;
  height: 2rem;
  justify-content: center;
  width: 2rem;
}

body.reference-home .ref-destination-hub.tone-espresso .ref-destination-hub__feature-icon {
  background: color-mix(in srgb, var(--ivory) 10%, transparent);
  color: var(--brass);
}

body.reference-home .ref-destination-hub .eyebrow--light {
  color: var(--clay);
}

body.reference-home .ref-destination-hub.tone-espresso .eyebrow--light {
  color: var(--brass);
}

body.reference-home .ref-destination-hub__actions {
  display: flex;
  flex-wrap: wrap;
  gap: .75rem;
  margin-top: 2rem;
}

body.reference-home .ref-destination-hub__cards {
  display: grid;
  gap: .75rem;
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

body.reference-home .ref-destination-card {
  aspect-ratio: 4 / 5;
  background: color-mix(in srgb, var(--espresso) 80%, var(--bush));
  border-radius: .75rem;
  display: block;
  overflow: hidden;
  position: relative;
}

body.reference-home .ref-destination-card img {
  height: 100%;
  object-fit: cover;
  width: 100%;
}

body.reference-home .ref-destination-card__overlay {
  background: linear-gradient(to top, color-mix(in srgb, var(--espresso) 58%, transparent), transparent 52%);
  inset: 0;
  padding: 1rem;
  position: absolute;
}

body.reference-home .ref-destination-card__region {
  color: color-mix(in srgb, var(--brass) 90%, transparent);
  font-size: .65625rem;
  letter-spacing: .18em;
  text-transform: uppercase;
}

body.reference-home .ref-destination-card__name {
  color: var(--ivory);
  font-family: var(--font-display);
  font-size: 1.125rem;
  margin-top: .25rem;
}

/* MICE */
body.reference-home .ref-mice__grid {
  display: grid;
  gap: .75rem;
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

@media (min-width: 48rem) {
  body.reference-home .ref-mice__grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}

@media (min-width: 64rem) {
  body.reference-home .ref-mice__grid {
    grid-template-columns: repeat(6, minmax(0, 1fr));
  }
}

body.reference-home .ref-mice-card__image {
  height: 100%;
  inset: 0;
  object-fit: cover;
  position: absolute;
  width: 100%;
}

body.reference-home .ref-mice-card {
  aspect-ratio: 3 / 4;
  background: linear-gradient(160deg, color-mix(in srgb, var(--stone) 30%, var(--espresso)), var(--espresso));
  border: 1px solid color-mix(in srgb, var(--sand) 30%, transparent);
  border-radius: .75rem;
  color: inherit;
  display: block;
  overflow: hidden;
  position: relative;
  text-decoration: none;
}

body.reference-home .ref-mice-card:nth-child(6n+1) {
  background: linear-gradient(160deg, color-mix(in srgb, var(--bush) 35%, var(--espresso)), var(--espresso));
}

body.reference-home .ref-mice-card:nth-child(6n+2) {
  background: linear-gradient(160deg, color-mix(in srgb, var(--clay) 28%, var(--espresso)), color-mix(in srgb, var(--bush) 40%, var(--espresso)));
}

body.reference-home .ref-mice-card:nth-child(6n+3) {
  background: linear-gradient(160deg, color-mix(in srgb, var(--brass) 22%, var(--espresso)), var(--espresso));
}

body.reference-home .ref-mice-card:nth-child(6n+4) {
  background: linear-gradient(160deg, color-mix(in srgb, var(--stone) 35%, var(--espresso)), color-mix(in srgb, var(--bush) 25%, var(--espresso)));
}

body.reference-home .ref-mice-card:nth-child(6n+5) {
  background: linear-gradient(160deg, color-mix(in srgb, var(--acacia) 18%, var(--espresso)), var(--espresso));
}

body.reference-home .ref-mice-card:nth-child(6n+6) {
  background: linear-gradient(160deg, color-mix(in srgb, var(--sand) 30%, var(--espresso)), color-mix(in srgb, var(--clay) 20%, var(--espresso)));
}

body.reference-home .ref-mice-card:has(.ref-mice-card__image) {
  background: var(--espresso);
}

body.reference-home .ref-mice-card__overlay {
  background: linear-gradient(to top, color-mix(in srgb, var(--espresso) 58%, transparent), color-mix(in srgb, var(--espresso) 5%, transparent) 62%);
  display: flex;
  flex-direction: column;
  inset: 0;
  justify-content: flex-end;
  padding: 1rem;
  position: absolute;
}

body.reference-home .ref-mice-card__overlay p {
  color: var(--ivory);
  font-family: var(--font-display);
  font-size: 1rem;
  line-height: 1.2;
}

body.reference-home .ref-mice-card__overlay span {
  color: var(--brass);
  font-size: .6875rem;
  margin-top: .25rem;
  opacity: 0;
  transform: translateX(-4px);
  transition: opacity .3s, transform .3s;
}

body.reference-home .ref-mice-card:hover .ref-mice-card__overlay span {
  opacity: 1;
  transform: translateX(0);
}

/* Confidence */
body.reference-home .ref-confidence__grid {
  display: grid;
  gap: 2.5rem;
}

@media (min-width: 64rem) {
  body.reference-home .ref-confidence__grid {
    gap: 4rem;
    grid-template-columns: minmax(0, 1fr) minmax(0, 2fr);
  }
}

body.reference-home .ref-confidence__grid h2 {
  font-family: var(--font-display);
  font-size: clamp(2rem, 3.5vw, 2.75rem);
  line-height: 1.08;
  margin-top: .75rem;
}

body.reference-home .ref-confidence__intro {
  color: var(--muted);
  font-size: .9375rem;
  line-height: 1.6;
  margin-top: 1rem;
}

body.reference-home .ref-confidence__cards {
  display: grid;
  gap: .75rem;
  grid-template-columns: 1fr;
}

@media (min-width: 40rem) {
  body.reference-home .ref-confidence__cards {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

body.reference-home .ref-confidence-card {
  background: var(--card, color-mix(in srgb, white 72%, var(--ivory)));
  border: 1px solid color-mix(in srgb, var(--sand) 75%, transparent);
  border-radius: .75rem;
  color: inherit;
  display: block;
  padding: 1.25rem;
  text-decoration: none;
  transition: box-shadow .3s, border-color .3s;
}

body.reference-home .ref-confidence-card:hover {
  border-color: color-mix(in srgb, var(--clay) 30%, transparent);
  box-shadow: 0 8px 24px -8px rgba(31, 26, 20, .08);
}

body.reference-home .ref-confidence-card__label {
  font-size: .90625rem;
  font-weight: 500;
  margin-top: .5rem;
}

body.reference-home .ref-confidence-card__body {
  color: var(--muted);
  font-size: .8125rem;
  line-height: 1.55;
  margin-top: .375rem;
}

/* Trust */
body.reference-home .ref-trust__grid {
  display: grid;
  gap: 1.25rem;
  grid-template-columns: 1fr;
  margin-top: 3rem;
}

@media (min-width: 40rem) {
  body.reference-home .ref-trust__grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (min-width: 64rem) {
  body.reference-home .ref-trust__grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}

body.reference-home .ref-trust-card {
  background: var(--card, color-mix(in srgb, white 72%, var(--ivory)));
  border: 1px solid color-mix(in srgb, var(--sand) 75%, transparent);
  border-radius: .75rem;
  padding: 1.5rem;
}

body.reference-home .ref-trust-card__index {
  color: color-mix(in srgb, var(--brass) 85%, transparent);
  font-family: var(--font-body);
  font-size: .6875rem;
}

body.reference-home .ref-trust-card h3 {
  font-family: var(--font-display);
  font-size: 1.1875rem;
  margin-top: .5rem;
}

body.reference-home .ref-trust-card p {
  color: var(--muted);
  font-size: .84375rem;
  line-height: 1.55;
  margin-top: .625rem;
}

/* Global */
body.reference-home .ref-global__intro {
  margin-inline: auto;
  max-width: 48rem;
  text-align: center;
}

body.reference-home .ref-global__intro h2 {
  font-family: var(--font-display);
  font-size: clamp(2.25rem, 4.5vw, 4rem);
  line-height: 1.02;
  margin-top: .75rem;
}

body.reference-home .ref-global__intro p {
  color: color-mix(in srgb, var(--espresso) 70%, transparent);
  font-size: .96875rem;
  line-height: 1.6;
  margin-top: 1rem;
}

body.reference-home .ref-global.tone-espresso .ref-global__intro p {
  color: color-mix(in srgb, var(--ivory) 75%, transparent);
}

body.reference-home .ref-global__offices {
  display: grid;
  gap: 1rem;
  grid-template-columns: 1fr;
  margin-top: 2rem;
}

@media (min-width: 48rem) {
  body.reference-home .ref-global__offices {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}

body.reference-home .ref-global-card {
  aspect-ratio: 4 / 5;
  background: linear-gradient(160deg, color-mix(in srgb, var(--bush) 40%, var(--espresso)), var(--espresso));
  border: 1px solid color-mix(in srgb, var(--ivory) 15%, transparent);
  border-radius: .75rem;
  overflow: hidden;
  position: relative;
}

body.reference-home .ref-global-card__image {
  height: 100%;
  inset: 0;
  object-fit: cover;
  position: absolute;
  width: 100%;
}

body.reference-home .ref-global-card__overlay {
  background: linear-gradient(to top, color-mix(in srgb, var(--espresso) 66%, transparent), color-mix(in srgb, var(--espresso) 12%, transparent) 58%, transparent);
  display: flex;
  flex-direction: column;
  inset: 0;
  justify-content: flex-end;
  padding: 1.25rem;
  position: absolute;
  z-index: 1;
}

body.reference-home .ref-global-card__region {
  color: color-mix(in srgb, var(--brass) 90%, transparent);
  font-size: .65625rem;
  letter-spacing: .18em;
  text-transform: uppercase;
}

body.reference-home .ref-global-card__city {
  color: var(--ivory);
  font-family: var(--font-display);
  font-size: 1.625rem;
  margin-top: .25rem;
}

body.reference-home .ref-global-card__role {
  color: color-mix(in srgb, var(--ivory) 65%, transparent);
  font-size: .75rem;
  margin-top: .25rem;
}

body.reference-home .ref-global-card__detail {
  color: color-mix(in srgb, var(--ivory) 75%, transparent);
  font-size: .78125rem;
  line-height: 1.5;
  margin-top: .75rem;
}

body.reference-home .ref-global__stats {
  border-top: 1px solid color-mix(in srgb, var(--ivory) 10%, transparent);
  display: grid;
  gap: 1.5rem;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  margin-top: 3rem;
  padding-top: 2.5rem;
}

@media (min-width: 48rem) {
  body.reference-home .ref-global__stats {
    grid-template-columns: repeat(4, minmax(0, 1fr));
  }
}

body.reference-home .ref-stat strong {
  color: var(--ivory);
  display: block;
  font-family: var(--font-display);
  font-size: 2rem;
  font-weight: 500;
}

body.reference-home .ref-stat span {
  color: color-mix(in srgb, var(--ivory) 85%, transparent);
  display: block;
  font-size: .875rem;
  margin-top: .25rem;
}

body.reference-home .ref-stat small {
  color: color-mix(in srgb, var(--ivory) 60%, transparent);
  display: block;
  font-size: .75rem;
  margin-top: .25rem;
}

/* Partner */
body.reference-home .ref-partner__grid {
  align-items: center;
  display: grid;
  gap: 2.5rem;
}

@media (min-width: 64rem) {
  body.reference-home .ref-partner__grid {
    grid-template-columns: 1fr 1fr;
  }
}

body.reference-home .ref-partner__grid h2 {
  font-family: var(--font-display);
  font-size: clamp(2.25rem, 4vw, 3.5rem);
  line-height: 1.05;
  margin-top: .75rem;
}

body.reference-home .ref-partner__grid > div > p {
  color: var(--muted);
  font-size: .96875rem;
  line-height: 1.6;
  margin-top: 1.25rem;
  max-width: 32rem;
}

body.reference-home .ref-partner__list {
  display: grid;
  gap: .75rem;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  list-style: none;
  margin: 1.75rem 0 0;
  max-width: 32rem;
  padding: 0;
}

body.reference-home .ref-partner__list li {
  align-items: center;
  background: var(--card, color-mix(in srgb, white 72%, var(--ivory)));
  border: 1px solid color-mix(in srgb, var(--sand) 75%, transparent);
  border-radius: .75rem;
  display: flex;
  font-size: .8125rem;
  gap: .625rem;
  padding: .75rem 1rem;
}

body.reference-home .ref-partner__list li::before {
  color: var(--clay);
  content: "✓";
  flex-shrink: 0;
  font-size: .875rem;
  font-weight: 700;
  line-height: 1;
}

body.reference-home .ref-partner__actions {
  display: flex;
  flex-wrap: wrap;
  gap: .75rem;
  margin-top: 2rem;
}

body.reference-home .ref-partner__visual {
  aspect-ratio: 4 / 3;
  background: linear-gradient(135deg, color-mix(in srgb, var(--stone) 60%, var(--ivory)), color-mix(in srgb, var(--sand) 40%, var(--ivory)));
  border: 1px solid color-mix(in srgb, var(--sand) 75%, transparent);
  border-radius: 1rem;
  overflow: hidden;
  position: relative;
}

body.reference-home .ref-partner__image {
  height: 100%;
  object-fit: cover;
  width: 100%;
}

body.reference-home .ref-partner__platform-card {
  background: var(--card, color-mix(in srgb, white 72%, var(--ivory)));
  border: 1px solid color-mix(in srgb, var(--sand) 75%, transparent);
  border-radius: .75rem;
  bottom: -1.5rem;
  box-shadow:
    0 1px 2px -1px rgba(31, 26, 20, .04),
    0 8px 24px -8px rgba(31, 26, 20, .08),
    0 24px 48px -24px rgba(31, 26, 20, .06);
  display: none;
  left: -1.5rem;
  max-width: 17.5rem;
  padding: 1.25rem;
  position: absolute;
  z-index: 2;
}

@media (min-width: 48rem) {
  body.reference-home .ref-partner__platform-card {
    display: block;
  }
}

body.reference-home .ref-partner__platform-label {
  color: var(--clay);
  font-size: .6875rem;
  font-weight: 500;
  letter-spacing: .16em;
  text-transform: uppercase;
}

body.reference-home .ref-partner__platform-card > p:last-child {
  color: color-mix(in srgb, var(--espresso) 85%, transparent);
  font-size: .8125rem;
  line-height: 1.5;
  margin-top: .5rem;
}

/* Testimonials + articles */
body.reference-home .ref-testimonials__grid,
body.reference-home .ref-articles__grid {
  display: grid;
  gap: 1.25rem;
  grid-template-columns: 1fr;
}

@media (min-width: 40rem) {
  body.reference-home .ref-testimonials__grid,
  body.reference-home .ref-articles__grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (min-width: 64rem) {
  body.reference-home .ref-testimonials__grid,
  body.reference-home .ref-articles__grid {
    grid-template-columns: repeat(4, minmax(0, 1fr));
  }
}

body.reference-home .ref-testimonial-card,
body.reference-home .article-card {
  background: var(--card, color-mix(in srgb, white 72%, var(--ivory)));
  border: 1px solid color-mix(in srgb, var(--sand) 75%, transparent);
  border-radius: .75rem;
  padding: 1.25rem;
}

body.reference-home .article-card__media {
  aspect-ratio: 3 / 2;
  display: block;
  margin: -1.25rem -1.25rem 1rem;
  overflow: hidden;
  position: relative;
}

body.reference-home .article-card__media img {
  height: 100%;
  object-fit: cover;
  width: 100%;
}

body.reference-home .article-card h3 {
  font-family: var(--font-display);
  font-size: 1.125rem;
  margin-top: .5rem;
}

/* Final CTA */
body.reference-home .ref-final-cta {
  overflow: hidden;
  padding-block: clamp(6rem, 10vw, 8rem);
  position: relative;
}

body.reference-home .ref-final-cta__bg {
  background: linear-gradient(135deg, color-mix(in srgb, var(--espresso) 88%, var(--bush)), color-mix(in srgb, var(--espresso) 72%, var(--clay)));
  inset: 0;
  position: absolute;
}

body.reference-home .ref-final-cta__bg::after {
  background: color-mix(in srgb, var(--espresso) 75%, transparent);
  content: "";
  inset: 0;
  position: absolute;
  z-index: 1;
}

body.reference-home .ref-final-cta__image {
  height: 100%;
  inset: 0;
  object-fit: cover;
  position: absolute;
  width: 100%;
}

body.reference-home .ref-final-cta__content {
  color: var(--ivory);
  position: relative;
  text-align: center;
  z-index: 1;
}

body.reference-home .ref-final-cta__content h2 {
  color: var(--ivory);
  font-family: var(--font-display);
  font-size: clamp(2.5rem, 5vw, 4.5rem);
  line-height: 1.02;
  margin-inline: auto;
  margin-top: .75rem;
  max-width: 48rem;
}

body.reference-home .ref-final-cta__content > p {
  color: color-mix(in srgb, var(--ivory) 80%, transparent);
  font-size: 1rem;
  line-height: 1.6;
  margin-inline: auto;
  margin-top: 1.25rem;
  max-width: 36rem;
}

body.reference-home .ref-final-cta__actions {
  display: flex;
  flex-wrap: wrap;
  gap: .75rem;
  justify-content: center;
  margin-top: 2rem;
}

body.reference-home .ref-final-cta .btn--ghost-light {
  background: color-mix(in srgb, var(--ivory) 14%, transparent);
  border-color: color-mix(in srgb, var(--ivory) 78%, transparent);
  color: var(--ivory);
}

body.reference-home .ref-final-cta__contact {
  color: color-mix(in srgb, var(--ivory) 70%, transparent);
  display: flex;
  flex-wrap: wrap;
  font-size: .8125rem;
  gap: 1.25rem;
  justify-content: center;
  margin-top: 3rem;
}

body.reference-home .ref-final-cta__contact a {
  color: inherit;
  text-decoration: none;
}

body.reference-home .ref-final-cta__contact a:hover {
  color: var(--ivory);
}

@media (max-width: 47.99rem) {
  body.reference-home .ref-hero__controls--arrows {
    display: none;
  }

  body.reference-home .ref-partner__list,
  body.reference-home .ref-confidence__cards,
  body.reference-home .ref-global__stats {
    grid-template-columns: 1fr;
  }
}
