/* ============================================================
   TERRENE 1.1.2 — REFERENCE-STRUCTURE OVERRIDES
   Original grocery content, contour-paper system, reference-like
   section choreography and isolated product gallery.
   ============================================================ */

:root {
  --ref-paper: #f7f6f2;
  --ref-ink: #171715;
  --ref-muted: #797a76;
  --ref-line: rgba(35, 35, 31, .15);
}

/* Header: compact, floating navigation over the portal and light pages. */
.home .site-header {
  background: linear-gradient(180deg, rgba(245,244,240,.72), rgba(245,244,240,0));
  border-bottom-color: transparent;
  color: var(--ref-ink);
}
.home .site-header.is-scrolled {
  background: rgba(247,246,242,.94);
  border-bottom-color: rgba(30,30,27,.12);
  backdrop-filter: blur(16px);
  -webkit-backdrop-filter: blur(16px);
}
.home .site-header .header-inner {
  max-width: none;
  width: 100%;
  padding: .95rem clamp(1.1rem, 3.2vw, 3.8rem);
  gap: 1.5rem;
}
.home .site-header .site-title,
.home .site-header .main-navigation a,
.home .site-header .header-icon,
.home .site-header .menu-toggle {
  color: #272722;
}
.home .site-header .site-title {
  font-family: var(--font-display);
  font-size: 1.18rem;
  font-weight: 600;
  letter-spacing: -.015em;
  text-transform: none;
}
.home .site-header .custom-logo { max-height: 35px; }
.home .site-header .main-navigation .menu { gap: clamp(.9rem, 1.8vw, 2rem); }
.home .site-header .main-navigation a {
  color: #35352f;
  font-size: .61rem;
  font-weight: 600;
  letter-spacing: .11em;
}
.home .site-header .main-navigation a::after {
  background: #37372f;
  bottom: -5px;
}
.home .site-header .header-actions { gap: .9rem; }
.home .site-header .header-icon svg { width: 17px; height: 17px; }
.home .site-header .terrene-cart-count {
  background: #25251f;
  color: #fff;
}

/* Opening portal: oversized left headline, restrained copy and long pin. */
.terrain-entry--grocery { background: #d8d8d6; color: #fff; }
.terrain-entry--grocery .terrain-camera { background: #dededb; }
.terrain-entry--grocery .terrain-cover {
  object-fit: cover;
  object-position: 54% 43%;
  filter: saturate(1.02) contrast(1.02);
}
.terrain-entry--grocery .terrain-camera__shade {
  background: linear-gradient(90deg, rgba(24,24,22,.1), transparent 58%),
              linear-gradient(0deg, rgba(25,25,22,.2), transparent 42%);
}
.terrain-entry--grocery .terrain-invitation {
  left: clamp(1.1rem, 1.2vw, 1.7rem);
  bottom: clamp(2.4rem, 8.2vh, 6rem);
  max-width: min(57vw, 900px);
  text-shadow: 0 2px 15px rgba(0,0,0,.22);
}
.terrain-entry--grocery .terrain-invitation .terrain-eyebrow,
.terrain-entry--grocery .terrain-description { display: none; }
.terrain-entry--grocery .terrain-invitation h1 {
  max-width: 8.8ch;
  margin: 0;
  color: #fff;
  font-family: var(--font-display);
  font-size: clamp(4.2rem, 8vw, 9.8rem);
  font-weight: 500;
  letter-spacing: -.055em;
  line-height: .87;
  text-wrap: balance;
}
.terrain-entry--grocery .terrain-enter-link {
  position: absolute;
  right: clamp(-48vw, -38vw, -18rem);
  bottom: .15rem;
  display: flex;
  align-items: center;
  gap: .65rem;
  border: 1px solid rgba(255,255,255,.58);
  border-radius: 99px;
  padding: .7rem 1rem;
  color: #fff;
  font-size: .62rem;
  font-weight: 600;
  letter-spacing: .14em;
}
.terrain-entry--grocery .terrain-scroll-label {
  display: block;
  margin-top: 1.2rem;
  color: rgba(255,255,255,.85);
  font-size: .58rem;
  letter-spacing: .2em;
}
.terrain-entry--grocery .terrain-chapter {
  color: #fff;
  font-size: clamp(2.2rem, 4.7vw, 5.6rem);
  letter-spacing: -.035em;
  line-height: .98;
  text-transform: none;
}
.terrain-entry--grocery .terrain-arrival {
  background: var(--ref-paper);
  color: var(--ref-ink);
  padding-inline: clamp(1.2rem, 9vw, 10rem);
}
.terrain-entry--grocery .terrain-arrival .terrain-eyebrow { color: #77776f; }
.terrain-entry--grocery .terrain-arrival h2 {
  max-width: 11ch;
  color: var(--ref-ink);
  font-size: clamp(3.6rem, 7vw, 8rem);
  line-height: .85;
  letter-spacing: -.055em;
}
.terrain-entry--grocery .terrain-arrival p {
  max-width: 36ch;
  color: #55564f;
}

/* Light editorial ethos section: headline left, copy/actions right. */
.brand-story.reference-ethos {
  padding: clamp(7rem, 12vw, 11rem) 0 clamp(2.4rem, 4vw, 3.7rem);
  color: var(--ref-ink);
  background-color: var(--ref-paper);
  background-image: url('../images/topographic-paper.svg');
  background-position: center 37%;
  background-size: cover;
  border: 0;
}
.reference-ethos .brand-story__top {
  display: grid;
  grid-template-columns: minmax(0, 1.05fr) minmax(320px, .95fr);
  gap: clamp(3rem, 8vw, 9rem);
  align-items: center;
  margin: 0;
}
.reference-ethos .brand-story__headline .eyebrow {
  color: #55564f;
  font-size: .62rem;
  letter-spacing: .16em;
}
.reference-ethos .brand-story__headline .section-h2 {
  max-width: 10ch;
  margin: .55rem 0 0;
  color: var(--ref-ink);
  font-family: var(--font-display);
  font-size: clamp(3.8rem, 6.3vw, 7.4rem);
  font-weight: 600;
  line-height: .82;
  letter-spacing: -.055em;
  text-transform: uppercase;
}
.reference-ethos .brand-story__intro {
  max-width: 58ch;
  padding-top: 1.15rem;
  border-top: 1px solid rgba(30,30,27,.22);
}
.reference-ethos .brand-story__body {
  margin: 0 0 1.6rem;
  color: #242420;
  font-family: var(--font-display);
  font-size: clamp(1.15rem, 1.55vw, 1.65rem);
  line-height: 1.42;
}
.reference-ethos .brand-story__actions {
  display: flex;
  flex-wrap: wrap;
  gap: .8rem;
}
.reference-ethos .editorial-link {
  display: inline-flex;
  align-items: center;
  gap: .55rem;
  min-width: 132px;
  padding: .7rem .9rem;
  border: 1px solid transparent;
  border-radius: 0;
  color: #242420;
  background: transparent;
  font-size: .58rem;
  font-weight: 700;
  letter-spacing: .12em;
  text-transform: uppercase;
}
.reference-ethos .editorial-link::before,
.reference-ethos .editorial-link::after {
  content: '';
  width: 7px;
  height: 7px;
  border-color: currentColor;
  border-style: solid;
  opacity: .72;
}
.reference-ethos .editorial-link::before { border-width: 1px 0 0 1px; }
.reference-ethos .editorial-link::after { border-width: 0 1px 1px 0; }
.reference-ethos .editorial-link:hover {
  color: #111;
  background: rgba(255,255,255,.48);
  transform: translateY(-2px);
}

/* Four tall benefit tiles, including the expandable first panel. */
.benefits.reference-benefits {
  padding: 0 0 clamp(6rem, 10vw, 9rem);
  color: var(--ref-ink);
  background-color: var(--ref-paper);
  background-image: url('../images/topographic-paper.svg');
  background-position: center 61%;
  background-size: cover;
  border: 0;
}
.benefit-panels {
  display: grid;
  grid-template-columns: repeat(4, minmax(0,1fr));
  align-items: start;
  gap: clamp(.65rem, 1.1vw, 1.1rem);
}
.benefit-panel {
  min-width: 0;
  min-height: 370px;
  overflow: hidden;
  border: 0;
  border-radius: 18px;
  box-shadow: 0 18px 45px rgba(24,25,22,.06);
  transition: transform .35s ease, box-shadow .35s ease;
}
.benefit-panel:hover { transform: translateY(-4px); box-shadow: 0 22px 52px rgba(24,25,22,.1); }
.benefit-panel summary {
  position: relative;
  display: flex;
  min-height: 370px;
  flex-direction: column;
  align-items: center;
  padding: 1.5rem 1.15rem 1.1rem;
  cursor: pointer;
  list-style: none;
  text-align: center;
}
.benefit-panel summary::-webkit-details-marker { display: none; }
.benefit-panel__index {
  align-self: flex-start;
  font-family: var(--font-body);
  font-size: .55rem;
  letter-spacing: .16em;
  opacity: .65;
}
.benefit-panel__title {
  display: grid;
  place-items: center;
  width: 100%;
  min-height: 68px;
  margin-top: .2rem;
  padding: .7rem .6rem;
  border: 1px solid rgba(255,255,255,.38);
  border-radius: 12px;
  background: rgba(255,255,255,.14);
  box-shadow: 0 7px 20px rgba(0,0,0,.12);
  font-family: var(--font-display);
  font-size: clamp(1.1rem, 1.5vw, 1.55rem);
  font-weight: 600;
  line-height: .98;
  text-transform: uppercase;
}
.benefit-panel__art {
  display: grid;
  flex: 1 1 auto;
  width: 100%;
  min-height: 160px;
  place-items: center;
  padding: .5rem 0;
  opacity: .85;
}
.benefit-panel__art svg { display: block; width: min(100%, 190px); height: 205px; }
.benefit-panel__toggle {
  display: inline-flex;
  justify-content: center;
  align-items: center;
  min-height: 39px;
  padding: .55rem 1.05rem;
  border: 1px solid currentColor;
  border-radius: 99px;
  font-size: .54rem;
  font-weight: 600;
  letter-spacing: .15em;
}
.benefit-panel__toggle--open { display: none; }
.benefit-panel[open] .benefit-panel__toggle--closed { display: none; }
.benefit-panel[open] .benefit-panel__toggle--open { display: inline-flex; }
.benefit-panel__detail {
  margin: 0 .85rem .85rem;
  padding: 1.1rem 1rem;
  border: 1px solid rgba(255,255,255,.2);
  border-radius: 11px;
  background: rgba(0,0,0,.16);
  font-family: var(--font-body);
  font-size: .82rem;
  line-height: 1.6;
}
.benefit-panel__detail p { margin: 0; }
.benefit-panel--ink { color: #f4f2ec; background: linear-gradient(145deg,#171817,#080908); }
.benefit-panel--blue { color: #142b30; background: #76aeb5; }
.benefit-panel--coral { color: #351b0e; background: #f17643; }
.benefit-panel--cream { color: #262722; background: #f7f6f2; }
.benefit-panel--cream .benefit-panel__title { border-color: rgba(30,30,27,.16); background: rgba(255,255,255,.68); }
.benefit-panel--cream .benefit-panel__detail { background: rgba(255,255,255,.64); border-color: rgba(30,30,27,.12); }

/* The reference's very thin full-width black image strip. */
.marquee.reference-ticker {
  position: relative;
  width: 100%;
  height: clamp(76px, 7vw, 112px);
  padding: .7rem 0;
  overflow: hidden;
  border: 0;
  background: #050505;
  color: #fff;
}
.reference-ticker__track {
  display: flex;
  align-items: center;
  gap: clamp(2rem, 4vw, 4.5rem);
  width: max-content;
  height: 100%;
  padding-inline: 1.5rem;
  will-change: transform;
}
.reference-ticker__item {
  display: flex;
  flex: 0 0 auto;
  width: clamp(76px, 6.2vw, 112px);
  height: 100%;
  align-items: center;
  justify-content: center;
}
.reference-ticker__item img {
  display: block;
  max-width: 100%;
  max-height: 100%;
  width: auto;
  height: auto;
  object-fit: contain;
  filter: drop-shadow(0 4px 8px rgba(255,255,255,.08));
  animation: reference-ticker-float 3.8s ease-in-out infinite;
}
.reference-ticker__item:nth-child(3n) img { animation-delay: -1.1s; }
.reference-ticker__item:nth-child(4n) img { animation-delay: -2.2s; }
@keyframes reference-ticker-float {
  0%,100% { transform: translateY(2px) rotate(-2deg); }
  50% { transform: translateY(-4px) rotate(2deg); }
}

/* Numbered, editorial category gallery with isolated product imagery. */
.categories.reference-categories {
  padding: clamp(6.5rem, 11vw, 10.5rem) 0 clamp(7rem, 11vw, 10rem);
  color: var(--ref-ink);
  background-color: var(--ref-paper);
  background-image: url('../images/topographic-paper.svg');
  background-position: center 42%;
  background-size: cover;
}
.reference-categories__header {
  margin: 0 auto clamp(4rem, 7vw, 6.8rem);
  text-align: center;
}
.reference-categories__header .eyebrow {
  color: #7b7b73;
  font-size: .58rem;
  letter-spacing: .17em;
}
.reference-categories__header h2 {
  margin: .35rem 0 .4rem;
  color: #171715;
  font-family: var(--font-display);
  font-size: clamp(3.6rem, 7vw, 8.4rem);
  font-weight: 500;
  line-height: .96;
  letter-spacing: -.045em;
}
.reference-categories__header p {
  margin: .9rem 0 0;
  color: #898980;
  font-size: .58rem;
  letter-spacing: .19em;
}
.reference-category-grid {
  display: grid;
  grid-template-columns: repeat(3,minmax(0,1fr));
  border-top: 1px solid rgba(30,30,27,.12);
}
.reference-category {
  min-width: 0;
  border-right: 1px solid rgba(30,30,27,.12);
  border-bottom: 1px solid rgba(30,30,27,.12);
}
.reference-category:nth-child(3n+1) { border-left: 1px solid rgba(30,30,27,.12); }
.reference-category__link {
  display: block;
  min-height: 510px;
  padding: 1.4rem clamp(1rem, 2.1vw, 2rem) 1.2rem;
  color: inherit;
}
.reference-category__top {
  display: flex;
  align-items: baseline;
  gap: .7rem;
  color: #383832;
  font-size: .68rem;
  letter-spacing: .1em;
  text-transform: uppercase;
}
.reference-category__number { color: #88887f; }
.reference-category__name { font-weight: 600; }
.reference-category__object {
  position: relative;
  display: grid;
  width: 100%;
  height: clamp(300px, 30vw, 430px);
  margin: .7rem 0 .5rem;
  place-items: center;
  perspective: 1000px;
  transform-style: preserve-3d;
  cursor: grab;
  touch-action: pan-y;
}
.reference-category__object:active { cursor: grabbing; }
.reference-category__image {
  display: block;
  max-width: 94%;
  max-height: 94%;
  width: auto;
  height: auto;
  object-fit: contain;
  transform: translate3d(0,var(--ref-object-y,0),35px) rotateZ(var(--ref-object-rot,-2deg));
  filter: drop-shadow(0 24px 24px rgba(36,36,29,.13));
  animation: reference-category-float 5.8s ease-in-out infinite;
  transition: transform .35s ease, filter .35s ease;
  mix-blend-mode: multiply;
}
.reference-category:nth-child(3n+2) .reference-category__image { animation-delay: -2s; }
.reference-category:nth-child(3n+3) .reference-category__image { animation-delay: -3.6s; }
.reference-category__object:hover .reference-category__image {
  filter: drop-shadow(0 32px 26px rgba(36,36,29,.18));
}
.reference-category__object.is-360-ready .reference-category__image {
  animation: reference-category-float 5.8s ease-in-out infinite;
  user-select: none;
  -webkit-user-drag: none;
}
.reference-category__hint {
  position: absolute;
  left: 50%;
  bottom: .2rem;
  transform: translateX(-50%);
  color: #8a8a82;
  font-size: .5rem;
  font-weight: 600;
  letter-spacing: .16em;
  white-space: nowrap;
  opacity: .85;
}
@keyframes reference-category-float {
  0%,100% { transform: translate3d(0,8px,30px) rotateZ(-2deg) rotateY(-4deg); }
  50% { transform: translate3d(0,-12px,54px) rotateZ(2deg) rotateY(4deg); }
}

/* Isolated product photos on catalog cards; no hard crop. */
.product-card__media[data-product-tilt] {
  overflow: visible;
  background: transparent;
  perspective: 1100px;
}
.product-card__stage {
  overflow: visible;
  transform-style: preserve-3d;
}
.product-card__stage img {
  object-fit: contain !important;
  mix-blend-mode: multiply;
  filter: drop-shadow(0 14px 15px rgba(20,20,17,.1));
}
.product-card__media.is-360-ready,
.product-card__stage.is-360-ready { cursor: grab; touch-action: pan-y; }
.product-card__media.is-360-ready:active,
.product-card__stage.is-360-ready:active { cursor: grabbing; }

/* Product gallery frames: unobtrusive drag affordance. */
[data-product-360-frames] { cursor: grab; touch-action: pan-y; }
[data-product-360-frames]:active { cursor: grabbing; }

@media (max-width: 1024px) {
  .benefit-panels { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .reference-category__link { min-height: 460px; }
  .reference-category__object { height: clamp(260px, 38vw, 360px); }
}
@media (max-width: 767px) {
  .home .site-header .header-inner { padding: .75rem 1rem; }
  .home .site-header .site-title { font-size: .9rem; }
  .home .site-header .main-navigation { display: none; }
  .terrain-entry--grocery .terrain-invitation {
    left: 1rem;
    bottom: 13vh;
    max-width: calc(100vw - 2rem);
  }
  .terrain-entry--grocery .terrain-invitation h1 {
    max-width: 8.5ch;
    font-size: clamp(3.25rem, 14vw, 5.8rem);
  }
  .terrain-entry--grocery .terrain-enter-link {
    position: static;
    width: fit-content;
    margin-top: 1rem;
  }
  .terrain-entry--grocery .terrain-scroll-label { margin-top: .7rem; }
  .brand-story.reference-ethos { padding: 5rem 0 2.6rem; }
  .reference-ethos .brand-story__top { grid-template-columns: 1fr; gap: 2rem; }
  .reference-ethos .brand-story__headline .section-h2 { font-size: clamp(3.1rem, 13vw, 5.5rem); }
  .reference-ethos .brand-story__intro { padding-top: 1rem; }
  .benefit-panels { grid-template-columns: 1fr 1fr; gap: .7rem; }
  .benefit-panel, .benefit-panel summary { min-height: 300px; }
  .benefit-panel summary { padding: 1rem .75rem .8rem; }
  .benefit-panel__title { min-height: 58px; font-size: .98rem; }
  .benefit-panel__art { min-height: 135px; }
  .benefit-panel__art svg { height: 150px; }
  .benefit-panel__detail { margin: 0 .6rem .6rem; padding: .85rem; font-size: .76rem; }
  .marquee.reference-ticker { height: 70px; }
  .reference-ticker__item { width: 66px; }
  .categories.reference-categories { padding: 5.5rem 0 6rem; }
  .reference-categories__header { margin-bottom: 3rem; }
  .reference-categories__header h2 { font-size: clamp(3rem, 12vw, 5rem); }
  .reference-category-grid { grid-template-columns: 1fr 1fr; }
  .reference-category:nth-child(3n+1) { border-left: 0; }
  .reference-category:nth-child(2n+1) { border-left: 1px solid rgba(30,30,27,.12); }
  .reference-category__link { min-height: 360px; padding: 1rem .7rem; }
  .reference-category__top { flex-wrap: wrap; gap: .4rem; font-size: .59rem; }
  .reference-category__object { height: 260px; }
  .reference-category__hint { font-size: .42rem; }
}
@media (max-width: 420px) {
  .benefit-panels { grid-template-columns: 1fr; }
  .benefit-panel, .benefit-panel summary { min-height: 340px; }
  .benefit-panel__art { min-height: 155px; }
  .reference-category-grid { grid-template-columns: 1fr; }
  .reference-category:nth-child(n) { border-left: 1px solid rgba(30,30,27,.12); }
  .reference-category__link { min-height: 390px; }
  .reference-category__object { height: 290px; }
}
@media (prefers-reduced-motion: reduce) {
  .reference-ticker__item img,
  .reference-category__image { animation: none !important; }
  .benefit-panel,
  .reference-category__image { transition: none !important; }
}


.reference-category__depth {
  position: relative;
  display: grid;
  width: 100%;
  height: 100%;
  place-items: center;
  transform-style: preserve-3d;
  transform: translate3d(0,calc(var(--scroll-y,0px) + var(--hover-shift,0px)),0) rotateX(var(--tilt-x,0deg)) rotateY(calc(var(--tilt-y,0deg) + var(--scroll-turn,0deg)));
  transition: transform .35s ease;
}
.benefit-panel__detail { animation: reference-benefit-detail .32s ease both; }
@keyframes reference-benefit-detail {
  from { opacity:0; transform:translateY(8px); }
  to { opacity:1; transform:translateY(0); }
}


.home .site-header .main-navigation li:nth-child(6n+1) a::before,
.home .site-header .main-navigation li:nth-child(6n+2) a::before,
.home .site-header .main-navigation li:nth-child(6n+3) a::before,
.home .site-header .main-navigation li:nth-child(6n+4) a::before,
.home .site-header .main-navigation li:nth-child(6n+5) a::before,
.home .site-header .main-navigation li:nth-child(6n) a::before {
  display: inline-block;
  margin-right: .42rem;
  font-size: .76rem;
  line-height: 1;
  vertical-align: -1px;
}
.home .site-header .main-navigation li:nth-child(6n+1) a::before { content: '✦'; color: #c67fc0; }
.home .site-header .main-navigation li:nth-child(6n+2) a::before { content: '◈'; color: #63aeb7; }
.home .site-header .main-navigation li:nth-child(6n+3) a::before { content: '✧'; color: #89a86b; }
.home .site-header .main-navigation li:nth-child(6n+4) a::before { content: '♡'; color: #db8fa7; }
.home .site-header .main-navigation li:nth-child(6n+5) a::before { content: '✺'; color: #b18ac9; }
.home .site-header .main-navigation li:nth-child(6n) a::before { content: '⌁'; color: #8e9aa9; }


/* ============================================================
   1.1.1 PRECISION OVERRIDES — VECTOR RABBIT-HOLE + ETHOS LANDING
   Original contour artwork and grocery copy; no photograph inside hero hole.
   ============================================================ */

/* Reference-style compact navigation: logo left; icon-led links and utility icons right. */
.home .site-header {
  position: fixed;
  inset: 0 0 auto;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none;
  color: #fff;
  transition: background-color .35s ease, color .35s ease, backdrop-filter .35s ease;
}
.home .site-header .header-inner {
  max-width: none;
  width: 100%;
  padding: .9rem clamp(1rem, 2.6vw, 2.8rem);
  gap: 1.5rem;
}
.home .site-header .site-title,
.home .site-header .main-navigation a,
.home .site-header .header-icon,
.home .site-header .menu-toggle { color: #fff; text-shadow: 0 1px 10px rgba(0,0,0,.22); }
.home .site-header .site-title {
  font-size: clamp(.9rem, 1.15vw, 1.15rem);
  letter-spacing: -.02em;
  font-weight: 600;
  text-transform: none;
}
.home .site-header .custom-logo { max-height: 34px; width: auto; }
.home .site-header .main-navigation { margin-left: auto; }
.home .site-header .main-navigation .menu { gap: clamp(.65rem, 1.35vw, 1.45rem); }
.home .site-header .main-navigation a {
  display: inline-flex;
  align-items: center;
  color: rgba(255,255,255,.94);
  font-size: clamp(.53rem, .61vw, .64rem);
  font-weight: 700;
  letter-spacing: .075em;
  text-transform: uppercase;
  white-space: nowrap;
}
.home .site-header .main-navigation a::after { display: none; }
.home .site-header .main-navigation li:nth-child(6n+1) a::before,
.home .site-header .main-navigation li:nth-child(6n+2) a::before,
.home .site-header .main-navigation li:nth-child(6n+3) a::before,
.home .site-header .main-navigation li:nth-child(6n+4) a::before,
.home .site-header .main-navigation li:nth-child(6n+5) a::before,
.home .site-header .main-navigation li:nth-child(6n) a::before {
  display: inline-block;
  margin-right: .38rem;
  font-size: .78rem;
  line-height: 1;
  vertical-align: -1px;
}
.home .site-header .main-navigation li:nth-child(6n+1) a::before { content: '✦'; color: #c77dc4; }
.home .site-header .main-navigation li:nth-child(6n+2) a::before { content: '◈'; color: #61b5c0; }
.home .site-header .main-navigation li:nth-child(6n+3) a::before { content: '✧'; color: #7ac8bd; }
.home .site-header .main-navigation li:nth-child(6n+4) a::before { content: '♡'; color: #ef8fbb; }
.home .site-header .main-navigation li:nth-child(6n+5) a::before { content: '✺'; color: #b68bd4; }
.home .site-header .main-navigation li:nth-child(6n) a::before { content: '⌁'; color: #a7aabc; }
.home .site-header .header-actions { gap: clamp(.65rem, 1.25vw, 1.2rem); }
.home .site-header .header-icon svg { width: 17px; height: 17px; }
.home .site-header .terrene-cart-count { background: #fff; color: #222; }
.home .site-header .menu-toggle span { background: #fff; }
.home .site-header.is-scrolled {
  background: rgba(247,246,242,.94) !important;
  border-bottom: 1px solid rgba(30,30,27,.11) !important;
  box-shadow: none;
  backdrop-filter: blur(16px);
  -webkit-backdrop-filter: blur(16px);
}
.home .site-header.is-scrolled .site-title,
.home .site-header.is-scrolled .main-navigation a,
.home .site-header.is-scrolled .header-icon,
.home .site-header.is-scrolled .menu-toggle { color: #252522; text-shadow: none; }
.home .site-header.is-scrolled .menu-toggle span { background: #252522; }
.home .site-header.is-scrolled .terrene-cart-count { background: #252522; color: #fff; }

/* Opening scene: a vector-only hole; all photographic reveal uploads are removed. */
.terrain-entry--grocery { position: relative; z-index: 1; color: #fff; background: #f7f6f2; isolation: isolate; }
.terrain-entry--grocery .terrain-stage {
  position: relative; height: 100svh; min-height: 620px; overflow: hidden;
  background: #f7f6f2 url('../images/topographic-paper.svg') center/cover no-repeat;
}
.terrain-entry--grocery .terrain-camera {
  position: absolute; inset: 0; z-index: 0; overflow: hidden;
  background: #f7f6f2 url('../images/topographic-paper.svg') center/cover no-repeat;
}
.terrain-camera__reveal {
  position: absolute; inset: -2%; z-index: 1; opacity: 0;
  background: radial-gradient(ellipse 44% 49% at 58% 42%, #010102 0%, #030407 34%, #0b0c10 58%, #1a1b20 72%, rgba(18,19,23,0) 100%);
  transform-origin: 58% 42%; will-change: transform, opacity;
}
.terrain-entry--grocery .terrain-cover {
  position: absolute; inset: 0; z-index: 2; display: block; width: 100%; height: 100%; max-width: none;
  object-fit: cover; object-position: 54% 43%; transform-origin: 58% 42%; will-change: transform, opacity;
  filter: saturate(1.08) contrast(1.03);
}
.terrain-invitation {
  position: absolute; z-index: 4; inset: 0; display: flex; flex-direction: column;
  align-items: flex-start; justify-content: flex-end;
  padding: 0 0 clamp(4.5rem, 7.6vh, 6.6rem) clamp(1.2rem, 1.25vw, 1.7rem);
  pointer-events: none; text-align: left;
}
.terrain-invitation h1 {
  max-width: 8.7ch; margin: 0; color: #fff;
  font-family: var(--font-display); font-size: clamp(4.7rem, 8.3vw, 10rem);
  font-weight: 500; letter-spacing: -.055em; line-height: .84; text-wrap: balance;
  text-shadow: 0 2px 7px rgba(0,0,0,.25);
}
.terrain-enter-link {
  position: absolute; right: clamp(1.3rem, 2.4vw, 2.7rem); bottom: 1.1rem;
  display: inline-flex; align-items: center; gap: .55rem; padding: .65rem .95rem;
  border: 1px solid rgba(255,255,255,.5); border-radius: 6px; color: #fff;
  background: rgba(20,20,20,.12); backdrop-filter: blur(10px);
  font-size: .57rem; font-weight: 700; letter-spacing: .13em; pointer-events: auto;
}
.terrain-enter-arrow { display: inline-block; width: auto; height: auto; border: 0; font-size: .95rem; }
.terrain-chapter {
  position: absolute; inset: 0; z-index: 5; display: flex; align-items: center; justify-content: center;
  padding: 1rem; color: #fff; font-family: var(--font-display);
  font-size: clamp(2.7rem, 5vw, 5.9rem); font-weight: 500; line-height: .98;
  letter-spacing: -.03em; text-align: center; text-shadow: 0 2px 22px rgba(0,0,0,.45);
  opacity: 0; visibility: hidden; pointer-events: none;
}
.terrain-chapter span { max-width: 12ch; }
.terrain-entry--grocery.is-enhanced .terrain-stage { height: 100svh; overflow: hidden; }
.terrain-entry--grocery.is-enhanced .terrain-camera { position: absolute; inset: 0; }
.terrain-entry--grocery.is-enhanced .terrain-invitation,
.terrain-entry--grocery.is-enhanced .terrain-chapter { position: absolute; inset: 0; display: flex; }

/* The first post-hole viewport is one combined editorial + cards composition. */
.home .brand-story.reference-ethos.benefits.reference-benefits {
  position: relative; padding: clamp(6.5rem, 11vw, 9.3rem) 0 clamp(5rem, 8vw, 7rem);
  color: #171715; background: #f7f6f2 url('../images/topographic-paper.svg') center 40%/cover no-repeat;
  border: 0;
}
.home .reference-ethos .brand-story__top {
  display: grid; grid-template-columns: minmax(0,1.05fr) minmax(320px,.95fr);
  gap: clamp(3rem, 8vw, 8.5rem); align-items: center; margin: 0;
}
.home .reference-ethos .brand-story__headline .eyebrow { color: #55564f; font-size: .62rem; letter-spacing: .16em; }
.home .reference-ethos .brand-story__headline .section-h2 {
  max-width: 10ch; margin: .55rem 0 0; color: #171715; font-family: var(--font-display);
  font-size: clamp(3.8rem, 6.3vw, 7.25rem); font-weight: 600; line-height: .82; letter-spacing: -.055em; text-transform: uppercase;
}
.home .reference-ethos .brand-story__intro { max-width: 58ch; padding-top: 1.15rem; border-top: 1px solid rgba(30,30,27,.22); }
.home .reference-ethos .brand-story__body {
  margin: 0 0 1.55rem; color: #242420; font-family: var(--font-display);
  font-size: clamp(1.1rem, 1.48vw, 1.58rem); line-height: 1.42;
}
.home .reference-ethos .brand-story__actions { display: flex; flex-wrap: wrap; gap: .8rem; }
.home .reference-ethos .editorial-link {
  display: inline-flex; align-items: center; gap: .55rem; min-width: 132px; padding: .7rem .9rem;
  border: 1px solid transparent; border-radius: 0; color: #242420; background: transparent;
  font-size: .58rem; font-weight: 700; letter-spacing: .12em; text-transform: uppercase;
}
.home .reference-ethos .editorial-link::before,
.home .reference-ethos .editorial-link::after { content: ''; width: 7px; height: 7px; border-color: currentColor; border-style: solid; opacity: .72; }
.home .reference-ethos .editorial-link::before { border-width: 1px 0 0 1px; }
.home .reference-ethos .editorial-link::after { border-width: 0 1px 1px 0; }
.home .reference-ethos .benefit-panels { margin-top: clamp(2.8rem, 5vw, 4.35rem); }
.home .reference-ethos .benefit-panel { min-height: clamp(440px, 39vw, 565px); border-radius: 18px; }
.home .reference-ethos .benefit-panel summary { min-height: clamp(440px, 39vw, 565px); padding: 1.6rem 1.15rem 1.1rem; }
.home .reference-ethos .benefit-panel__art { min-height: 205px; }
.home .reference-ethos .benefit-panel__art svg { width: min(100%, 205px); height: 230px; }
.home .reference-ethos .benefit-panel__detail { font-size: .82rem; line-height: 1.55; }

/* Ticker remains a narrow black band; the next category stage is a numbered gallery. */
.home .marquee.reference-ticker { height: clamp(76px, 6.2vw, 104px); background: #050505; }
.home .reference-ticker__item { width: clamp(72px, 5.8vw, 104px); }
.home .reference-ticker__item img { max-height: 88%; }
.home .categories.reference-categories { background: #f7f6f2 url('../images/topographic-paper.svg') center 42%/cover no-repeat; }
.home .reference-categories__header h2 { font-size: clamp(3.8rem, 7.2vw, 8.7rem); }

/* Mobile preserves the same order but relaxes the pin for touch usability. */
@media (max-width: 1024px) {
  .home .site-header .main-navigation .menu { gap: .65rem; }
  .home .site-header .main-navigation a { font-size: .52rem; }
  .home .reference-ethos .brand-story__top { gap: 3rem; }
}
@media (max-width: 767px) {
  .home .site-header .header-inner { padding: .75rem 1rem; }
  .home .site-header .main-navigation { display: none; }
  .home .site-header .site-title { font-size: .9rem; }
  .terrain-entry--grocery .terrain-stage { min-height: 100svh; }
  .terrain-invitation { padding: 0 1rem 5.2rem; }
  .terrain-invitation h1 { max-width: 8.5ch; font-size: clamp(3.3rem, 13.5vw, 5.4rem); }
  .terrain-enter-link { right: 1rem; bottom: 1rem; }
  .terrain-chapter { font-size: clamp(2.45rem, 9vw, 4rem); }
  .home .brand-story.reference-ethos.benefits.reference-benefits { padding: 5rem 0 4.5rem; }
  .home .reference-ethos .brand-story__top { grid-template-columns: 1fr; gap: 2rem; }
  .home .reference-ethos .brand-story__headline .section-h2 { font-size: clamp(3.1rem, 13vw, 5.3rem); }
  .home .reference-ethos .brand-story__intro { padding-top: 1rem; }
  .home .reference-ethos .benefit-panels { margin-top: 2.5rem; grid-template-columns: 1fr 1fr; gap: .7rem; }
  .home .reference-ethos .benefit-panel,
  .home .reference-ethos .benefit-panel summary { min-height: 310px; }
  .home .reference-ethos .benefit-panel summary { padding: 1rem .75rem .8rem; }
  .home .reference-ethos .benefit-panel__title { min-height: 58px; font-size: .9rem; }
  .home .reference-ethos .benefit-panel__art { min-height: 140px; }
  .home .reference-ethos .benefit-panel__art svg { height: 150px; }
  .home .marquee.reference-ticker { height: 70px; }
  .home .reference-ticker__item { width: 64px; }
}
@media (max-width: 420px) {
  .home .reference-ethos .benefit-panels { grid-template-columns: 1fr; }
  .home .reference-ethos .benefit-panel,
  .home .reference-ethos .benefit-panel summary { min-height: 340px; }
}
@media (prefers-reduced-motion: reduce) {
  .terrain-cover, .terrain-camera__reveal, .terrain-chapter { transition: none !important; }
}


/* Mobile menu: full-screen editorial overlay with the same icon-led navigation. */
.home .mobile-menu {
  position: fixed; inset: 0; z-index: 110; display: flex; align-items: center;
  padding: 5rem clamp(1.5rem, 7vw, 4rem); background: rgba(247,246,242,.985);
  color: #171715; backdrop-filter: blur(18px); -webkit-backdrop-filter: blur(18px);
}
.home .mobile-menu[hidden] { display: none !important; }
.home .mobile-menu-inner { width: min(100%, 780px); margin-inline: auto; }
.home .mobile-menu .menu { display: grid; grid-template-columns: 1fr 1fr; gap: .4rem 2rem; list-style: none; margin: 0; padding: 0; }
.home .mobile-menu a {
  display: inline-flex; align-items: center; padding: .55rem 0; color: #171715;
  font-family: var(--font-display); font-size: clamp(2rem, 8vw, 4rem); line-height: 1;
  text-transform: none; letter-spacing: -.025em;
}
.home .mobile-menu li:nth-child(6n+1) a::before,
.home .mobile-menu li:nth-child(6n+2) a::before,
.home .mobile-menu li:nth-child(6n+3) a::before,
.home .mobile-menu li:nth-child(6n+4) a::before,
.home .mobile-menu li:nth-child(6n+5) a::before,
.home .mobile-menu li:nth-child(6n) a::before { margin-right: .65rem; font-family: var(--font-body); font-size: .85rem; }
.home .mobile-menu li:nth-child(6n+1) a::before { content: '✦'; color: #c77dc4; }
.home .mobile-menu li:nth-child(6n+2) a::before { content: '◈'; color: #61b5c0; }
.home .mobile-menu li:nth-child(6n+3) a::before { content: '✧'; color: #7ac8bd; }
.home .mobile-menu li:nth-child(6n+4) a::before { content: '♡'; color: #ef8fbb; }
.home .mobile-menu li:nth-child(6n+5) a::before { content: '✺'; color: #b68bd4; }
.home .mobile-menu li:nth-child(6n) a::before { content: '⌁'; color: #a7aabc; }
@media (max-width: 420px) {
  .home .mobile-menu .menu { grid-template-columns: 1fr; gap: .15rem; }
  .home .mobile-menu a { font-size: clamp(2.2rem, 10vw, 3.2rem); }
}


/* ============================================================
   1.1.2 — Opaque portal aperture + reference hero/menu polish.
   The central hole is part of the vector artwork and is filled in
   SVG, so no image, background, or uploaded photo can show through.
   ============================================================ */
.terrain-entry--grocery .terrain-camera {
  background: #f7f6f2 url('../images/topographic-paper.svg') center/cover no-repeat !important;
}
.terrain-entry--grocery .terrain-camera__reveal {
  background: radial-gradient(ellipse 45% 48% at 58% 42%, #000 0%, #020305 46%, #090b0e 70%, rgba(9,11,14,0) 100%) !important;
}
.terrain-entry--grocery .terrain-camera__reveal img,
.terrain-entry--grocery .terrain-camera__reveal picture,
.terrain-entry--grocery .terrain-camera__reveal video { display: none !important; }
.terrain-entry--grocery .terrain-cover {
  background: transparent !important;
  filter: none !important;
  object-fit: cover !important;
  object-position: center center !important;
}
.home .site-header .main-navigation .menu {
  display: flex; align-items: center; justify-content: flex-end;
  gap: clamp(.7rem, 1.45vw, 1.55rem);
}
.home .site-header .main-navigation li { margin: 0; padding: 0; }
.home .site-header .main-navigation a {
  min-height: 26px; font-size: clamp(.52rem, .59vw, .64rem);
  letter-spacing: .075em; font-weight: 700; text-transform: uppercase;
}
.home .site-header .main-navigation li:nth-child(6n+1) a::before,
.home .site-header .main-navigation li:nth-child(6n+2) a::before,
.home .site-header .main-navigation li:nth-child(6n+3) a::before,
.home .site-header .main-navigation li:nth-child(6n+4) a::before,
.home .site-header .main-navigation li:nth-child(6n+5) a::before,
.home .site-header .main-navigation li:nth-child(6n) a::before {
  width: 15px; height: 15px; display: inline-flex; align-items: center; justify-content: center;
  margin-right: .34rem; border-radius: 50%; font-size: .74rem;
  text-shadow: none;
}
.home .site-header .main-navigation li:nth-child(6n+1) a::before {
  background: radial-gradient(circle at 35% 35%, #f5b9e5, #a85caf 72%); color: #17121a;
}
.home .site-header .main-navigation li:nth-child(6n+2) a::before {
  background: radial-gradient(circle at 35% 35%, #a8e6e5, #4e9cae 72%); color: #102126;
}
.home .site-header .main-navigation li:nth-child(6n+3) a::before {
  background: radial-gradient(circle at 35% 35%, #b9ead9, #65a99a 72%); color: #14251f;
}
.home .site-header .main-navigation li:nth-child(6n+4) a::before {
  background: radial-gradient(circle at 35% 35%, #ffd2e7, #dd77a5 72%); color: #2b1520;
}
.home .site-header .main-navigation li:nth-child(6n+5) a::before {
  background: radial-gradient(circle at 35% 35%, #e9d5ff, #9e77bd 72%); color: #21182a;
}
.home .site-header .main-navigation li:nth-child(6n) a::before {
  background: radial-gradient(circle at 35% 35%, #d9dded, #85899f 72%); color: #171821;
}
@media (max-width: 767px) {
  .home .site-header .main-navigation { display: none; }
}


/* ============================================================
   TERRENE 1.1.4 — living animated benefit illustrations.
   Original grocery copy/art only; the oval is a pure vector void.
   ============================================================ */
:root {
  --ref-paper: #f7f6f2;
  --ref-ink: #171715;
  --ref-muted: #777872;
  --container: 1440px;
}

/* Keep the compact icon-led header above the pinned hero. */
.home .site-header { z-index: 1200; }
.home .site-header .header-inner { min-height: 54px; }
.home .site-header .site-branding { flex: 0 0 auto; }
.home .site-header .main-navigation { display: block; margin-left: auto; }
.home .site-header .main-navigation .menu { align-items: center; }
.home .site-header .main-navigation a { gap: .34rem; }
.home .site-header .header-actions { flex: 0 0 auto; }
.home .site-header .header-icon { width: 22px; height: 26px; }
.home .site-header .header-icon svg { width: 16px; height: 16px; }
.home .site-header .header-icon.header-cart { position: relative; }
.home .site-header .terrene-cart-count { min-width: 12px; height: 12px; line-height: 12px; font-size: 8px; }

/* Vector-only start: no uploaded product photograph can be shown inside the hole. */
.terrain-entry--grocery,
.terrain-entry--grocery .terrain-stage { background: #f7f6f2; }
.terrain-entry--grocery .terrain-camera {
  background: #f7f6f2 url('../images/topographic-paper.svg') center/cover no-repeat !important;
  isolation: isolate;
}
.terrain-entry--grocery .terrain-cover {
  position: absolute; inset: 0; z-index: 2; display: block;
  width: 100%; height: 100%; max-width: none;
  object-fit: cover !important; object-position: center center !important;
  background: transparent !important; border: 0; box-shadow: none;
  filter: none !important; mix-blend-mode: normal;
  transform-origin: 58.2% 41.7%; will-change: transform, opacity;
}
.terrain-entry--grocery .terrain-camera__reveal { display: none !important; }
.terrain-entry--grocery .terrain-invitation {
  left: 0; right: 0; bottom: 0; z-index: 4;
  padding: 0 0 clamp(4.6rem, 7vh, 6.4rem) clamp(1.15rem, 1.2vw, 1.65rem);
  justify-content: flex-end; align-items: flex-start; pointer-events: none;
}
.terrain-entry--grocery .terrain-invitation h1 {
  display: flex; flex-direction: column; gap: 0;
  max-width: none; margin: 0; color: #fff;
  font-family: var(--font-display); font-size: clamp(4.6rem, 8vw, 9.6rem);
  font-weight: 500; letter-spacing: -.055em; line-height: .81;
  text-shadow: 0 2px 12px rgba(0,0,0,.13);
}
.terrain-entry--grocery .terrain-invitation h1 span { display: block; }
.terrain-entry--grocery .terrain-enter-link {
  right: clamp(1rem, 2.3vw, 2.6rem); bottom: 1.1rem;
  border: 1px solid rgba(255,255,255,.54); border-radius: 6px;
  padding: .65rem .9rem; background: rgba(24,24,24,.14);
  color: #fff; font-size: .57rem; letter-spacing: .1em;
  pointer-events: auto;
}
.terrain-entry--grocery .terrain-chapter {
  z-index: 5; color: #fff; text-shadow: 0 2px 20px rgba(0,0,0,.28);
  font-family: var(--font-display); font-size: clamp(2.5rem, 4.4vw, 5rem);
  font-weight: 500; line-height: .95; letter-spacing: -.025em;
}
.terrain-entry--grocery .terrain-chapter span { max-width: 11ch; }
.terrain-entry--grocery.is-enhanced .terrain-camera { position: absolute; inset: 0; }
.terrain-entry--grocery.is-enhanced .terrain-cover { transform-origin: 58.2% 41.7%; }

/* First section after descent: match the reference's editorial proportions. */
.home .brand-story.reference-ethos.benefits.reference-benefits {
  padding-top: clamp(7.2rem, 11.7vw, 10.8rem);
  padding-bottom: clamp(5.6rem, 8.6vw, 8.2rem);
  background: #f7f6f2 url('../images/topographic-paper.svg') center 39%/cover no-repeat;
}
.home .reference-ethos .brand-story__top {
  grid-template-columns: minmax(0, 1.04fr) minmax(350px, .96fr);
  align-items: start;
  gap: clamp(3rem, 7.4vw, 8rem);
}
.home .reference-ethos .brand-story__headline .section-h2 {
  max-width: 8.7ch;
  font-size: clamp(3.7rem, 6.15vw, 7.15rem);
  line-height: .81;
  letter-spacing: -.052em;
  font-weight: 600;
}
.home .reference-ethos .brand-story__intro {
  max-width: 57ch; margin-top: .15rem; padding-top: 1.15rem;
}
.home .reference-ethos .brand-story__body {
  max-width: 56ch; margin-bottom: 1.5rem;
  font-size: clamp(1.08rem, 1.35vw, 1.48rem); line-height: 1.43;
}
.home .reference-ethos .brand-story__actions { gap: .55rem; }
.home .reference-ethos .editorial-link { min-width: 130px; padding: .65rem .85rem; }
.home .reference-ethos .benefit-panels {
  margin-top: clamp(2.8rem, 4.8vw, 4.25rem);
  grid-template-columns: repeat(4, minmax(0,1fr));
  gap: clamp(.7rem, 1.15vw, 1.2rem);
  align-items: start;
}
.home .reference-ethos .benefit-panel,
.home .reference-ethos .benefit-panel summary {
  min-height: clamp(390px, 31vw, 485px);
}
.home .reference-ethos .benefit-panel summary { padding: 1.45rem 1rem 1.05rem; }
.home .reference-ethos .benefit-panel__index { display: none; }
.home .reference-ethos .benefit-panel__title {
  min-height: 62px; max-width: 100%; padding: .65rem .5rem;
  font-size: clamp(.95rem, 1.25vw, 1.28rem); line-height: .98;
  border-radius: 12px;
}
.home .reference-ethos .benefit-panel__art { min-height: 175px; margin-top: .7rem; }
.home .reference-ethos .benefit-panel__art svg { width: min(100%, 195px); height: 205px; }
.home .reference-ethos .benefit-panel__toggle {
  min-height: 36px; padding: .5rem .95rem; font-size: .52rem; letter-spacing: .12em;
}
.home .reference-ethos .benefit-panel__detail { margin: 0 .7rem .7rem; padding: .9rem; font-size: .78rem; }

/* The product strip is a thin black band, not a row of shop cards. */
.home .marquee.reference-ticker {
  height: clamp(68px, 5.7vw, 96px); padding: .55rem 0;
  background: #050505; border: 0;
}
.home .reference-ticker__track { gap: clamp(2.4rem, 4vw, 4rem); padding-inline: 1.7rem; }
.home .reference-ticker__item { width: clamp(58px, 4.3vw, 78px); }
.home .reference-ticker__item img { max-height: 88%; max-width: 100%; }

/* Ref-style category area: white space, oversized title and numbered columns. */
.home .categories.reference-categories {
  padding: clamp(5.5rem, 8vw, 7.7rem) 0 clamp(6rem, 9vw, 8.5rem);
  background: #f7f6f2 url('../images/topographic-paper.svg') center 45%/cover no-repeat;
}
.home .reference-categories__header { margin-bottom: clamp(3.6rem, 6vw, 5.8rem); }
.home .reference-categories__header h2 {
  font-size: clamp(3.7rem, 6.9vw, 8rem); line-height: .92; letter-spacing: -.045em;
}
.home .reference-category-grid { grid-template-columns: repeat(3, minmax(0,1fr)); }
.home .reference-category__link { min-height: clamp(430px, 39vw, 560px); }
.home .reference-category__object { height: clamp(290px, 29vw, 415px); }
.home .reference-category__image { max-width: 95%; max-height: 95%; }

@media (max-width: 1024px) {
  .home .site-header .main-navigation { display: none; }
  .home .site-header .header-actions { margin-left: auto; }
  .home .reference-ethos .brand-story__top { grid-template-columns: 1fr 1fr; gap: 2.3rem; }
  .home .reference-ethos .benefit-panel,
  .home .reference-ethos .benefit-panel summary { min-height: 360px; }
}
@media (max-width: 767px) {
  .terrain-entry--grocery .terrain-stage { min-height: 100svh; }
  .terrain-entry--grocery .terrain-invitation { padding: 0 1rem 5rem; }
  .terrain-entry--grocery .terrain-invitation h1 { font-size: clamp(3.2rem, 13vw, 5.2rem); }
  .terrain-entry--grocery .terrain-enter-link { right: 1rem; bottom: 1rem; }
  .home .brand-story.reference-ethos.benefits.reference-benefits { padding: 5.2rem 0 4.6rem; }
  .home .reference-ethos .brand-story__top { grid-template-columns: 1fr; gap: 2rem; }
  .home .reference-ethos .brand-story__headline .section-h2 { max-width: 9ch; font-size: clamp(3.2rem, 13vw, 5.1rem); }
  .home .reference-ethos .benefit-panels { grid-template-columns: 1fr 1fr; gap: .7rem; margin-top: 2.4rem; }
  .home .reference-ethos .benefit-panel,
  .home .reference-ethos .benefit-panel summary { min-height: 300px; }
  .home .reference-ethos .benefit-panel summary { padding: .9rem .7rem .8rem; }
  .home .reference-ethos .benefit-panel__title { min-height: 55px; font-size: .88rem; }
  .home .reference-ethos .benefit-panel__art { min-height: 132px; }
  .home .reference-ethos .benefit-panel__art svg { height: 148px; }
  .home .reference-category-grid { grid-template-columns: 1fr 1fr; }
  .home .reference-category__link { min-height: 360px; }
  .home .reference-category__object { height: 260px; }
  .home .marquee.reference-ticker { height: 66px; }
}
@media (max-width: 420px) {
  .home .reference-ethos .benefit-panels { grid-template-columns: 1fr; }
  .home .reference-category-grid { grid-template-columns: 1fr; }
}


/* Living SVG illustration suite: independently animated botanical / wave / orbit / route art. */
.home .benefit-panel { isolation: isolate; transform-style: preserve-3d; }
.home .benefit-panel__art { overflow: visible; perspective: 900px; }
.home .benefit-illustration { overflow: visible; transform-style: preserve-3d; will-change: transform; }
.home .benefit-illustration [data-pop-dot] { transform-box: fill-box; transform-origin: center; will-change: transform, opacity; }
.home .benefit-illustration [data-draw-path],
.home .benefit-illustration [data-flow-path],
.home .benefit-illustration [data-ray-path],
.home .benefit-illustration [data-sun-ring],
.home .benefit-illustration [data-route-path] { vector-effect: non-scaling-stroke; will-change: stroke-dashoffset, opacity; }
.home .benefit-illustration__limb { transform-box: fill-box; transform-origin: center bottom; }
.home .benefit-illustration__branch-dots { transform-box: fill-box; transform-origin: center; }
.home .benefit-illustration__wave-field { transform-box: fill-box; transform-origin: center; }
.home .benefit-illustration__sun-rings,
.home .benefit-illustration__sun-rays { transform-box: fill-box; transform-origin: 50% 100%; }
.home .benefit-illustration__route-particles circle { filter: drop-shadow(0 0 3px currentColor); }
.home .benefit-panel summary:focus-visible .benefit-panel__art { filter: drop-shadow(0 0 10px currentColor); }
@media (prefers-reduced-motion: reduce) {
  .home .benefit-illustration, .home .benefit-illustration * { animation: none !important; transition: none !important; }
}