/* ============================================================
   MelaSil — bio-activated silicon care for melanin-rich skin
   Aesthetic: warm luxury-editorial · melanin-aware · clinical-calm
   ============================================================ */

:root{
  /* warm near-blacks */
  --ink:        #100D0A;
  --ink-2:      #16110C;
  --ink-soft:   #211A12;
  /* warm ivory / bone */
  --ivory:      #EFE7D7;
  --ivory-2:    #E7DCC7;
  --bone:       #EDE4D3;
  --bone-dim:   #B9AC96;
  /* deep browns */
  --espresso:   #33251A;
  --cocoa:      #4A3626;
  /* accent — clay / terracotta / copper (NOT medical red) */
  --clay:       #B56A48;
  --clay-soft:  #C98863;
  --oxblood:    #7C3A2A;
  /* utility */
  --line-dark:  rgba(237,228,211,.16);
  --line-light: rgba(51,37,26,.18);

  --ff-display: "Fraunces", Georgia, "Times New Roman", serif;
  --ff-ui: "Jost", system-ui, sans-serif;

  --pad: clamp(1.25rem, 5vw, 6rem);
  --maxw: 1560px;
  --ease: cubic-bezier(.22,1,.36,1);
}

*{ margin:0; padding:0; box-sizing:border-box; }
html{ -webkit-text-size-adjust:100%; }
html.lenis, html.lenis body{ height:auto; }
.lenis.lenis-smooth{ scroll-behavior:auto !important; }
.lenis.lenis-stopped{ overflow:hidden; }

body{
  background:var(--ink);
  color:var(--bone);
  font-family:var(--ff-display);
  font-weight:340;
  font-optical-sizing:auto;
  line-height:1.5;
  overflow-x:hidden;
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
}
img{ display:block; width:100%; height:100%; object-fit:cover; }
a{ color:inherit; text-decoration:none; }
::selection{ background:var(--clay); color:var(--ink); }

/* ---------- shared type ---------- */
.eyebrow{
  font-family:var(--ff-ui);
  font-weight:400;
  font-size:.72rem;
  letter-spacing:.32em;
  text-transform:uppercase;
  color:var(--clay-soft);
  display:flex; align-items:center; gap:.7em;
}
.eyebrow--dark{ color:var(--clay); }
.eyebrow .dot, .aud__dot{ width:6px; height:6px; border-radius:50%; background:var(--clay); display:inline-block; }

section{ position:relative; }

/* ============================================================
   GRAIN + ATMOSPHERE
   ============================================================ */
.grain{
  position:fixed; inset:-50%; z-index:9000; pointer-events:none;
  opacity:.05; mix-blend-mode:overlay;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='140' height='140'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
  animation:grain 6s steps(6) infinite;
}
@keyframes grain{
  0%,100%{ transform:translate(0,0) } 20%{ transform:translate(-4%,3%) }
  40%{ transform:translate(3%,-4%) } 60%{ transform:translate(-2%,2%) } 80%{ transform:translate(4%,1%) }
}

/* ============================================================
   CURSOR
   ============================================================ */
.cursor{ position:fixed; top:0; left:0; z-index:9500; pointer-events:none; mix-blend-mode:difference; display:none; }
.cursor__dot{ position:absolute; width:6px; height:6px; border-radius:50%; background:var(--bone); transform:translate(-50%,-50%); }
.cursor__ring{
  position:absolute; width:38px; height:38px; border-radius:50%;
  border:1px solid rgba(237,228,211,.55); transform:translate(-50%,-50%);
  transition:width .3s var(--ease), height .3s var(--ease), background .3s var(--ease);
}
.cursor.is-hover .cursor__ring{ width:64px; height:64px; background:rgba(237,228,211,.12); }
@media(hover:hover) and (pointer:fine){ .cursor{ display:block; } body{ cursor:none; } }

/* ============================================================
   LOADER
   ============================================================ */
.loader{
  position:fixed; inset:0; z-index:9200; background:var(--ink);
  display:flex; align-items:center; justify-content:center; flex-direction:column;
}
.loader__inner{ text-align:center; padding:2rem; }
.loader__mark{ font-family:var(--ff-display); font-size:clamp(2.4rem,7vw,5rem); font-weight:340; letter-spacing:.01em; }
.loader__line{ height:1px; width:min(240px,50vw); margin:1.4rem auto 1.1rem; background:var(--line-dark); overflow:hidden; }
.loader__line span{ display:block; height:100%; width:100%; background:var(--clay); transform:scaleX(0); transform-origin:left; }
.loader__tag{ font-family:var(--ff-ui); font-size:.72rem; letter-spacing:.24em; text-transform:uppercase; color:var(--bone-dim); }
.loader__count{ position:absolute; bottom:var(--pad); right:var(--pad); font-family:var(--ff-ui); font-size:.8rem; letter-spacing:.2em; color:var(--bone-dim); }

/* ============================================================
   NAV
   ============================================================ */
.nav{
  position:fixed; top:0; left:0; width:100%; z-index:8000;
  display:flex; align-items:center; justify-content:space-between;
  padding:1.5rem var(--pad); mix-blend-mode:difference;
  transition:transform .5s var(--ease);
}
.nav.is-hidden{ transform:translateY(-105%); }
.nav__logo{ font-family:var(--ff-display); font-size:1.55rem; letter-spacing:.01em; color:var(--bone); }
.nav__links{ display:flex; gap:2.4rem; }
.nav__links a{
  font-family:var(--ff-ui); font-size:.76rem; letter-spacing:.18em; text-transform:uppercase; color:var(--bone);
  position:relative; padding:.3em 0;
}
.nav__links a::after{ content:""; position:absolute; left:0; bottom:0; width:0; height:1px; background:var(--bone); transition:width .4s var(--ease); }
.nav__links a:hover::after{ width:100%; }
.nav__cta{ font-family:var(--ff-ui); font-size:.74rem; letter-spacing:.16em; text-transform:uppercase; color:var(--bone); border:1px solid rgba(237,228,211,.5); border-radius:100px; padding:.62em 1.35em; transition:background .4s var(--ease), color .4s var(--ease); }
.nav__cta:hover{ background:var(--bone); color:var(--ink); }
.nav__burger{ display:none; background:none; border:0; width:34px; height:24px; position:relative; }
.nav__burger span{ position:absolute; left:0; width:100%; height:1.5px; background:var(--bone); transition:.3s var(--ease); }
.nav__burger span:nth-child(1){ top:6px; } .nav__burger span:nth-child(2){ bottom:6px; }

/* ============================================================
   REVEAL PRIMITIVES
   ============================================================ */
.line{ display:block; overflow:hidden; }
.line>span{ display:block; transform:translateY(110%); will-change:transform; }
.reveal-fade{ opacity:0; transform:translateY(14px); }
[data-reveal], [data-reveal-lines] .rl-line>span{ will-change:transform, opacity; }
[data-reveal]{ opacity:0; transform:translateY(20px); }
.rl-line{ display:block; overflow:hidden; }
.rl-line>span{ display:block; transform:translateY(110%); }

@media (prefers-reduced-motion:reduce){
  .line>span,.rl-line>span{ transform:none !important; }
  .reveal-fade,[data-reveal]{ opacity:1 !important; transform:none !important; }
  .grain{ animation:none; }
}
/* motion libraries unavailable — never leave content hidden */
.no-motion .line>span,.no-motion .rl-line>span{ transform:none !important; }
.no-motion .reveal-fade,.no-motion [data-reveal]{ opacity:1 !important; transform:none !important; }
.no-motion #loader{ display:none !important; }
.no-motion .evo__bar i{ transform:scaleX(1) !important; }

/* ============================================================
   HERO
   ============================================================ */
.hero{ min-height:100svh; display:flex; flex-direction:column; justify-content:flex-end; padding:var(--pad); overflow:hidden; }
.hero__media{ position:absolute; inset:0; z-index:-1; will-change:transform; }
.hero__media img{ transform:scale(1.08); }
.hero__scrim{
  position:absolute; inset:0;
  background:
    linear-gradient(180deg, rgba(16,13,10,.55) 0%, rgba(16,13,10,.08) 32%, rgba(16,13,10,.35) 68%, rgba(16,13,10,.92) 100%),
    radial-gradient(120% 90% at 70% 30%, transparent 40%, rgba(16,13,10,.5) 100%);
}
.hero__grid{ position:relative; z-index:2; max-width:var(--maxw); width:100%; margin:0 auto; }
.hero__eyebrow{ margin-bottom:clamp(1.2rem,3vw,2.2rem); }
.hero__title{
  font-family:var(--ff-display); font-weight:300;
  font-size:clamp(3.1rem, 11.5vw, 12rem);
  line-height:.92; letter-spacing:-.02em;
}
.hero__title .line--it em{ font-style:italic; font-weight:300; color:var(--clay-soft); }
.hero__foot{ display:flex; flex-wrap:wrap; align-items:flex-end; justify-content:space-between; gap:2rem; margin-top:clamp(1.6rem,4vw,3rem); }
.hero__sub{ font-family:var(--ff-display); font-size:clamp(1rem,1.5vw,1.3rem); max-width:34ch; color:var(--bone); line-height:1.45; }
.hero__actions{ display:flex; gap:.9rem; flex-wrap:wrap; }
.hero__meta{ position:absolute; top:calc(var(--pad) + 3.5rem); right:var(--pad); z-index:2; display:flex; flex-direction:column; gap:.25rem; text-align:right; font-family:var(--ff-ui); font-size:.68rem; letter-spacing:.18em; text-transform:uppercase; color:var(--bone-dim); }

.btn{ font-family:var(--ff-ui); font-size:.76rem; letter-spacing:.16em; text-transform:uppercase; padding:1em 1.9em; border-radius:100px; display:inline-flex; align-items:center; gap:.6em; transition:transform .4s var(--ease), background .4s var(--ease), color .4s var(--ease); }
.btn--solid{ background:var(--bone); color:var(--ink); }
.btn--solid:hover{ background:var(--clay); color:var(--ink); transform:translateY(-2px); }
.btn--ghost{ border:1px solid rgba(237,228,211,.45); color:var(--bone); }
.btn--ghost:hover{ background:rgba(237,228,211,.1); transform:translateY(-2px); }

.scroll-cue{ position:absolute; bottom:var(--pad); left:50%; transform:translateX(-50%); z-index:2; display:flex; flex-direction:column; align-items:center; gap:.6rem; font-family:var(--ff-ui); font-size:.62rem; letter-spacing:.3em; text-transform:uppercase; color:var(--bone-dim); }
.scroll-cue i{ width:1px; height:44px; background:linear-gradient(var(--bone-dim),transparent); position:relative; overflow:hidden; }
.scroll-cue i::after{ content:""; position:absolute; top:0; left:0; width:100%; height:40%; background:var(--clay); animation:cue 2.2s var(--ease) infinite; }
@keyframes cue{ 0%{ transform:translateY(-100%) } 60%,100%{ transform:translateY(260%) } }
@media(max-width:760px){ .scroll-cue,.hero__meta{ display:none; } }

/* ============================================================
   MANIFESTO
   ============================================================ */
.manifesto{ padding:clamp(6rem,15vw,13rem) var(--pad); max-width:var(--maxw); margin:0 auto; text-align:center; }
.manifesto__mark{ font-family:var(--ff-display); font-size:clamp(6rem,22vw,20rem); line-height:1; color:var(--ink-soft); opacity:.5; position:absolute; top:8%; left:50%; transform:translateX(-50%); pointer-events:none; font-style:italic; }
.manifesto .eyebrow{ justify-content:center; margin-bottom:2rem; position:relative; }
.manifesto__head{ font-family:var(--ff-display); font-weight:300; font-size:clamp(2.4rem,8vw,7rem); line-height:.98; letter-spacing:-.02em; position:relative; }
.manifesto__head .line--accent>span{ color:var(--clay); font-style:italic; }
.manifesto__body{ margin:clamp(2rem,4vw,3.2rem) auto 0; max-width:52ch; font-size:clamp(1.05rem,1.7vw,1.45rem); line-height:1.6; color:var(--bone); position:relative; }

/* ============================================================
   TRUTH (overlooked)
   ============================================================ */
.truth{ display:grid; grid-template-columns:1fr 1fr; gap:clamp(2rem,5vw,6rem); align-items:center; padding:clamp(4rem,9vw,9rem) var(--pad); max-width:var(--maxw); margin:0 auto; }
.truth__media{ aspect-ratio:4/5; overflow:hidden; border-radius:2px; }
.truth__media img{ transform:scale(1.06); will-change:transform; }
.truth__head{ font-family:var(--ff-display); font-weight:300; font-size:clamp(1.9rem,3.6vw,3.4rem); line-height:1.06; letter-spacing:-.01em; margin:1.4rem 0 2.4rem; }
.concerns{ list-style:none; border-top:1px solid var(--line-dark); }
.concerns li{ display:flex; align-items:baseline; gap:1.2rem; padding:1rem 0; border-bottom:1px solid var(--line-dark); font-size:clamp(1.1rem,1.7vw,1.4rem); color:var(--bone); transition:color .3s var(--ease), padding-left .4s var(--ease); }
.concerns li:hover{ color:var(--clay-soft); padding-left:.6rem; }
.concerns__n{ font-family:var(--ff-ui); font-size:.7rem; letter-spacing:.15em; color:var(--bone-dim); }
.truth__note{ margin-top:2.2rem; font-size:1.05rem; color:var(--bone-dim); max-width:40ch; font-style:italic; }

/* ============================================================
   FOUNDER
   ============================================================ */
.founder{ background:var(--ivory); color:var(--espresso); padding:clamp(6rem,14vw,12rem) var(--pad); text-align:center; }
.founder .eyebrow--dark{ justify-content:center; margin-bottom:2.6rem; }
.founder__quote{ max-width:24ch; margin:0 auto; font-family:var(--ff-display); font-weight:300; font-size:clamp(2rem,5.5vw,4.6rem); line-height:1.08; letter-spacing:-.015em; }
.founder__quote em, .founder__quote b{ font-style:italic; font-weight:300; color:var(--clay); }
.founder__sign{ margin-top:clamp(2.4rem,5vw,4rem); display:flex; flex-direction:column; gap:.4rem; }
.founder__name{ font-family:var(--ff-display); font-style:italic; font-size:1.9rem; color:var(--oxblood); }
.founder__role{ font-family:var(--ff-ui); font-size:.72rem; letter-spacing:.22em; text-transform:uppercase; color:var(--cocoa); }

/* ============================================================
   SCIENCE
   ============================================================ */
.science{ padding:clamp(5rem,11vw,10rem) var(--pad); max-width:var(--maxw); margin:0 auto; }
.science__head{ max-width:56ch; }
.science__title{ font-family:var(--ff-display); font-weight:300; font-size:clamp(2.6rem,7vw,6rem); line-height:1; letter-spacing:-.02em; margin:1.2rem 0 1rem; }
.science__sub{ font-size:clamp(1.05rem,1.7vw,1.4rem); color:var(--bone-dim); max-width:40ch; }
.science__stage{ display:grid; grid-template-columns:1.35fr .65fr; gap:clamp(2rem,5vw,5rem); align-items:center; margin-top:clamp(2.5rem,6vw,5rem); }
.science__viz{ position:relative; border:1px solid var(--line-dark); border-radius:3px; overflow:hidden; background:#0a0806; aspect-ratio:1500/1410; }
.science__viz img{ object-fit:contain; opacity:.96; }
.science__particles{ position:absolute; inset:0; width:100%; height:100%; }
.science__labels span{ position:absolute; right:1rem; top:var(--t); transform:translateY(-50%); font-family:var(--ff-ui); font-size:.6rem; letter-spacing:.16em; text-transform:uppercase; color:var(--bone-dim); }
.science__tags{ list-style:none; display:flex; flex-direction:column; gap:1.4rem; }
.science__tags li{ display:flex; align-items:center; gap:1rem; font-family:var(--ff-display); font-size:clamp(1.15rem,1.8vw,1.5rem); padding-bottom:1.2rem; border-bottom:1px solid var(--line-dark); }
.science__tags i{ width:34px; height:1px; background:var(--clay); flex:none; }
.science__caption{ margin-top:2.6rem; font-family:var(--ff-ui); font-size:.7rem; letter-spacing:.22em; text-transform:uppercase; color:var(--bone-dim); }

/* ============================================================
   MECHANISM
   ============================================================ */
.mech{ background:var(--ivory); color:var(--espresso); padding:clamp(5rem,11vw,10rem) var(--pad); }
.mech__intro{ max-width:var(--maxw); margin:0 auto; }
.mech__head{ font-family:var(--ff-display); font-weight:300; font-size:clamp(1.9rem,4.4vw,3.6rem); line-height:1.05; letter-spacing:-.015em; margin-top:1.2rem; max-width:20ch; }
.mech__grid{ max-width:var(--maxw); margin:clamp(2.5rem,6vw,5rem) auto 0; display:grid; grid-template-columns:repeat(4,1fr); gap:1px; background:var(--line-light); border:1px solid var(--line-light); }
.mech__card{ background:var(--ivory); padding:clamp(1.6rem,2.4vw,2.6rem); display:flex; flex-direction:column; gap:1rem; min-height:340px; transition:background .4s var(--ease); }
.mech__card:hover{ background:var(--ivory-2); }
.mech__n{ font-family:var(--ff-ui); font-size:.72rem; letter-spacing:.2em; color:var(--clay); }
.mech__icon{ width:44px; height:44px; margin:.4rem 0; }
.mech__icon path,.mech__icon circle{ stroke:var(--espresso); stroke-width:1.3; }
.mech__card h3{ font-family:var(--ff-display); font-weight:400; font-size:clamp(1.15rem,1.5vw,1.45rem); line-height:1.12; margin-top:auto; }
.mech__card p{ font-size:.95rem; line-height:1.5; color:var(--cocoa); }

/* ============================================================
   EVOLUTION / BIOAVAILABILITY
   ============================================================ */
.evo{ padding:clamp(5rem,11vw,10rem) var(--pad); max-width:var(--maxw); margin:0 auto; display:grid; grid-template-columns:1fr 1fr; gap:clamp(2.5rem,6vw,6rem); align-items:center; }
.evo__head{ font-family:var(--ff-display); font-weight:300; font-size:clamp(2rem,4.6vw,4rem); line-height:1.02; letter-spacing:-.02em; margin:1.2rem 0 1.6rem; }
.evo__head, .manifesto__head{ text-wrap:balance; }
.evo__body{ font-size:clamp(1rem,1.4vw,1.2rem); color:var(--bone-dim); max-width:46ch; margin-bottom:1.1rem; line-height:1.6; }
.evo__body--accent{ color:var(--bone); }
.evo__body--accent{ border-left:2px solid var(--clay); padding-left:1.1rem; }
.evo__ladder{ display:flex; flex-direction:column; gap:1.1rem; }
.evo__row{ display:flex; align-items:center; gap:1rem; }
.evo__gen{ font-family:var(--ff-ui); font-size:.7rem; letter-spacing:.15em; color:var(--bone-dim); width:1.6em; flex:none; }
.evo__bar{ position:relative; flex:1; height:58px; border:1px solid var(--line-dark); border-radius:2px; display:flex; align-items:center; padding:0 1.2rem; overflow:hidden; }
.evo__bar i{ position:absolute; inset:0; transform-origin:left; transform:scaleX(0); background:linear-gradient(90deg, var(--ink-soft), rgba(181,106,72,.28)); z-index:0; }
.evo__row--peak .evo__bar{ border-color:var(--clay); }
.evo__row--peak .evo__bar i{ background:linear-gradient(90deg, rgba(124,58,42,.5), var(--clay)); }
.evo__name{ position:relative; z-index:1; font-family:var(--ff-display); font-size:clamp(.95rem,1.3vw,1.2rem); }
.evo__val{ position:relative; z-index:1; margin-left:auto; font-family:var(--ff-ui); font-size:.66rem; letter-spacing:.16em; text-transform:uppercase; color:var(--bone-dim); }
.evo__row--peak .evo__val{ color:var(--bone); }
.evo__axis{ font-family:var(--ff-ui); font-size:.64rem; letter-spacing:.22em; text-transform:uppercase; color:var(--bone-dim); margin-top:.4rem; text-align:right; }

/* ============================================================
   SYSTEM
   ============================================================ */
.system{ background:var(--ink-2); padding:clamp(5rem,11vw,10rem) var(--pad); text-align:center; }
.system .eyebrow--dark{ justify-content:center; margin-bottom:1.6rem; }
.system__head{ font-family:var(--ff-display); font-weight:300; font-size:clamp(2.4rem,7vw,6rem); line-height:1; letter-spacing:-.02em; }
.system__cols{ max-width:1100px; margin:clamp(3rem,7vw,5.5rem) auto 0; display:grid; grid-template-columns:1fr auto 1fr; gap:clamp(1.5rem,4vw,4rem); align-items:center; }
.system__col{ text-align:left; }
.system__tag{ font-family:var(--ff-ui); font-size:.68rem; letter-spacing:.24em; text-transform:uppercase; color:var(--clay-soft); }
.system__col h3{ font-family:var(--ff-display); font-weight:400; font-size:clamp(1.4rem,2.4vw,2.1rem); line-height:1.1; margin:.8rem 0 1rem; }
.system__col p{ color:var(--bone-dim); font-size:1rem; line-height:1.55; max-width:32ch; }
.system__plus{ font-family:var(--ff-display); font-size:clamp(2rem,4vw,3.4rem); color:var(--clay); font-style:italic; }

/* ============================================================
   RANGE
   ============================================================ */
.range{ padding:clamp(5rem,11vw,10rem) var(--pad); max-width:var(--maxw); margin:0 auto; }
.range__head{ max-width:60ch; }
.range__title{ font-family:var(--ff-display); font-weight:300; font-size:clamp(1.9rem,4.4vw,3.6rem); line-height:1.05; letter-spacing:-.015em; margin-top:1.2rem; }
.range__showcase{ margin:clamp(2.5rem,6vw,4.5rem) 0; aspect-ratio:2000/1498; overflow:hidden; border-radius:3px; background:var(--ivory-2); }
.range__showcase img{ transform:scale(1.05); will-change:transform; }
.range__grid{ display:grid; grid-template-columns:repeat(4,1fr); gap:1px; background:var(--line-dark); border:1px solid var(--line-dark); }
.prod{ background:var(--ink); padding:clamp(1.6rem,2.4vw,2.4rem); min-height:280px; display:flex; flex-direction:column; transition:background .4s var(--ease); }
.prod:hover{ background:var(--ink-soft); }
.prod--dark{ background:var(--ink-2); }
.prod__top{ display:flex; justify-content:space-between; font-family:var(--ff-ui); font-size:.68rem; letter-spacing:.16em; color:var(--bone-dim); }
.prod__idx{ color:var(--clay); }
.prod__name{ font-family:var(--ff-display); font-weight:400; font-size:clamp(1.3rem,1.8vw,1.7rem); line-height:1.05; margin-top:auto; }
.prod__active{ font-family:var(--ff-ui); font-size:.74rem; letter-spacing:.04em; color:var(--bone-dim); margin-top:.9rem; line-height:1.5; }
.prod__use{ font-size:1rem; color:var(--clay-soft); margin-top:.7rem; font-style:italic; }
.range__note{ margin-top:2.6rem; font-size:1.05rem; color:var(--bone-dim); font-style:italic; max-width:52ch; }

/* ============================================================
   RITUAL
   ============================================================ */
.ritual{ display:grid; grid-template-columns:1fr 1fr; align-items:stretch; min-height:88vh; }
.ritual__media{ overflow:hidden; }
.ritual__media img{ transform:scale(1.08); will-change:transform; }
.ritual__copy{ display:flex; flex-direction:column; justify-content:center; padding:clamp(3rem,8vw,8rem); background:var(--ink-2); }
.ritual__head{ font-family:var(--ff-display); font-weight:300; font-size:clamp(2rem,4vw,3.6rem); line-height:1.05; letter-spacing:-.015em; margin:1.2rem 0 1.6rem; max-width:16ch; }
.ritual__copy p{ color:var(--bone-dim); font-size:clamp(1rem,1.4vw,1.2rem); line-height:1.6; max-width:40ch; }

/* ============================================================
   AUDIENCE
   ============================================================ */
.aud{ background:var(--ivory); color:var(--espresso); padding:clamp(6rem,13vw,11rem) var(--pad); text-align:center; }
.aud__row{ display:flex; align-items:center; justify-content:center; gap:clamp(1rem,3vw,2.4rem); flex-wrap:wrap; }
.aud__pillar{ font-family:var(--ff-display); font-style:italic; font-weight:300; font-size:clamp(1.8rem,5vw,4rem); }
.aud__dot{ background:var(--clay); }
.aud__body{ max-width:44ch; margin:2.4rem auto 0; font-size:clamp(1.05rem,1.6vw,1.35rem); line-height:1.55; color:var(--cocoa); }

/* ============================================================
   CLOSING / JOIN
   ============================================================ */
.close{ padding:clamp(6rem,14vw,12rem) var(--pad) clamp(4rem,8vw,7rem); text-align:center; }
.close .eyebrow{ justify-content:center; margin-bottom:2rem; }
.close__word{ font-family:var(--ff-display); font-weight:300; font-size:clamp(4rem,22vw,20rem); line-height:.9; letter-spacing:-.03em; }
.close__word span{ display:inline-block; }
.close__line{ font-family:var(--ff-display); font-style:italic; font-size:clamp(1.2rem,2.4vw,2rem); color:var(--clay-soft); margin-top:1rem; }
.join{ display:flex; gap:.6rem; max-width:460px; margin:clamp(2.6rem,5vw,4rem) auto 0; border-bottom:1px solid var(--line-dark); padding-bottom:.7rem; }
.join input{ flex:1; background:none; border:0; color:var(--bone); font-family:var(--ff-display); font-size:1.05rem; padding:.5rem 0; }
.join input::placeholder{ color:var(--bone-dim); }
.join input:focus{ outline:none; }
.join button{ font-family:var(--ff-ui); font-size:.72rem; letter-spacing:.16em; text-transform:uppercase; background:none; border:0; color:var(--clay-soft); white-space:nowrap; transition:color .3s var(--ease); }
.join button:hover{ color:var(--bone); }

/* ============================================================
   FOOTER
   ============================================================ */
.foot{ padding:clamp(3rem,6vw,5rem) var(--pad); border-top:1px solid var(--line-dark); }
.foot__top{ display:flex; align-items:baseline; justify-content:space-between; flex-wrap:wrap; gap:1rem; padding-bottom:2.4rem; }
.foot__logo{ font-family:var(--ff-display); font-size:clamp(2rem,5vw,3.4rem); }
.foot__tag{ font-family:var(--ff-ui); font-size:.72rem; letter-spacing:.2em; text-transform:uppercase; color:var(--bone-dim); }
.foot__bottom{ display:flex; justify-content:space-between; flex-wrap:wrap; gap:.6rem; font-family:var(--ff-ui); font-size:.68rem; letter-spacing:.1em; color:var(--bone-dim); }

/* ============================================================
   RESPONSIVE
   ============================================================ */
@media(max-width:960px){
  .nav__links{ display:none; }
  .nav__cta{ display:none; }
  .nav__burger{ display:block; }
  .truth{ grid-template-columns:1fr; }
  .truth__media{ max-height:70vh; }
  .science__stage{ grid-template-columns:1fr; }
  .evo{ grid-template-columns:1fr; }
  .mech__grid{ grid-template-columns:repeat(2,1fr); }
  .range__grid{ grid-template-columns:repeat(2,1fr); }
  .ritual{ grid-template-columns:1fr; }
  .ritual__media{ min-height:70vh; }
}
@media(max-width:600px){
  .system__cols{ grid-template-columns:1fr; }
  .system__plus{ transform:rotate(90deg); }
  .mech__grid{ grid-template-columns:1fr; }
  .range__grid{ grid-template-columns:1fr; }
  .hero__foot{ flex-direction:column; align-items:flex-start; }
  .foot__bottom{ flex-direction:column; }
}