/* =========================================================================
   NEYLUMA — neyluma.com
   Palette taken from the mattress itself: undyed cotton, wool, natural
   latex (amber), hemp felt (olive), pocket-spring steel, and the navy of
   the engineering documents.
   ========================================================================= */

:root{
  --night:      #0F1A22;
  --night-2:    #17252F;
  --night-3:    #22333E;

  --bone:       #FAF8F4;
  --calico:     #EFE9DD;
  --calico-2:   #E5DDCD;
  --render-bg:  #F5EFE8;

  --ink:        #16232E;
  --body:       #3A4A53;
  --muted:      #6C7B84;

  --latex:      #B8842B;
  --latex-lit:  #E0B366;
  --hemp:       #5B6A4C;
  --steel:      #8A9299;

  --line:       rgba(22,35,46,.13);
  --line-soft:  rgba(22,35,46,.07);
  --line-dark:  rgba(238,231,218,.16);

  --on-dark:    #EFE9DE;
  --on-dark-mu: #9EAEB7;

  --ff-display: "Instrument Serif", Georgia, "Times New Roman", serif;
  --ff-body:    "Archivo", -apple-system, BlinkMacSystemFont, "Segoe UI", Helvetica, Arial, sans-serif;
  --ff-mono:    "IBM Plex Mono", ui-monospace, SFMono-Regular, Menlo, monospace;

  --pad:        clamp(20px, 5vw, 48px);
  --sec-y:      clamp(88px, 12vw, 176px);
  --ease:       cubic-bezier(.19,.72,.19,1);
}

/* ── reset ─────────────────────────────────────────────────────────────── */
*,*::before,*::after{ box-sizing:border-box }
html{ -webkit-text-size-adjust:100%; scroll-behavior:smooth }
body{
  margin:0;
  background:var(--bone);
  color:var(--body);
  font-family:var(--ff-body);
  font-size:clamp(1rem,.96rem + .18vw,1.075rem);
  font-weight:350;
  line-height:1.68;
  letter-spacing:.002em;
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
  overflow-x:hidden;
}
img{ max-width:100%; height:auto; display:block }
h1,h2,h3,h4,p,ul,ol,dl,dd,figure{ margin:0 }
ul,ol{ padding:0; list-style:none }
a{ color:inherit; text-decoration:none }
button,input{ font:inherit; color:inherit }

::selection{ background:var(--latex-lit); color:var(--night) }

:focus-visible{
  outline:2px solid var(--latex);
  outline-offset:3px;
  border-radius:2px;
}

.sr,.skip{
  position:absolute; width:1px; height:1px; padding:0; margin:-1px;
  overflow:hidden; clip:rect(0 0 0 0); white-space:nowrap; border:0;
}
.skip:focus{
  position:fixed; top:12px; left:12px; z-index:200;
  width:auto; height:auto; clip:auto; margin:0;
  padding:10px 16px; background:var(--night); color:var(--on-dark);
  border-radius:2px;
}
.hp{ display:none !important }

/* ── type ──────────────────────────────────────────────────────────────── */
.mono{
  font-family:var(--ff-mono);
  font-size:.68rem;
  font-weight:400;
  letter-spacing:.16em;
  text-transform:uppercase;
}

.eyebrow{
  display:flex; align-items:flex-start; gap:.6em;
  font-family:var(--ff-mono);
  font-size:.685rem;
  letter-spacing:.18em;
  text-transform:uppercase;
  color:var(--latex);
  margin-bottom:1.35em;
}
.eyebrow--light{ color:var(--latex-lit) }
.eyebrow .dot{
  width:5px; height:5px; border-radius:50%;
  background:currentColor; flex:none; margin-top:.5em;
  box-shadow:0 0 0 4px rgba(224,179,102,.16);
}

.h2{
  font-family:var(--ff-display);
  font-weight:400;
  font-size:clamp(2.15rem,1.35rem + 3.3vw,4.1rem);
  line-height:1.02;
  letter-spacing:-.018em;
  color:var(--ink);
}
.h2 em{ font-style:italic }

.h4{
  font-family:var(--ff-body);
  font-weight:500;
  font-size:1.03rem;
  line-height:1.35;
  letter-spacing:-.005em;
  color:var(--ink);
  margin-bottom:.6em;
}

.lede{
  font-size:clamp(1.05rem,1rem + .3vw,1.2rem);
  line-height:1.62;
  color:var(--body);
  max-width:60ch;
}

.link-arrow{
  font-family:var(--ff-mono);
  font-size:.72rem; letter-spacing:.14em; text-transform:uppercase;
  color:var(--ink);
  border-bottom:1px solid var(--line);
  padding-bottom:.35em;
  transition:border-color .35s var(--ease), color .35s var(--ease);
}
.link-arrow span{ display:inline-block; transition:transform .35s var(--ease) }
.link-arrow:hover{ border-color:currentColor }
.link-arrow:hover span{ transform:translateX(5px) }
.link-arrow--light{ color:var(--on-dark); border-color:var(--line-dark) }

/* ── layout ────────────────────────────────────────────────────────────── */
.wrap{ width:100%; max-width:1240px; margin-inline:auto; padding-inline:var(--pad) }
.sec{ padding-block:var(--sec-y); position:relative }
.sec__head{ margin-bottom:clamp(48px,6vw,86px) }
.sec__head .h2{ max-width:34ch }
.sec__head .lede{ max-width:62ch }
.sec__head--center{ margin-inline:auto; text-align:center; max-width:none }
.sec__head--center .eyebrow{ justify-content:center }
.sec__head--center .h2,
.sec__head--center .lede{ margin-inline:auto }
.sec__head .h2 + .lede{ margin-top:1.1em }
/* Manual line breaks in display headings; let short screens reflow. */
@media (max-width:880px){ .brk{ display:none } }

/* ── buttons ───────────────────────────────────────────────────────────── */
.btn{
  --btn-bg:var(--ink); --btn-fg:var(--bone);
  display:inline-flex; align-items:center; justify-content:center;
  background:var(--btn-bg); color:var(--btn-fg);
  font-family:var(--ff-mono); font-size:.71rem;
  letter-spacing:.15em; text-transform:uppercase;
  padding:1.05em 1.9em; border:0; border-radius:2px; cursor:pointer;
  position:relative; overflow:hidden; isolation:isolate;
  transition:transform .4s var(--ease), box-shadow .4s var(--ease);
}
.btn::after{
  content:""; position:absolute; inset:0; z-index:-1;
  background:var(--latex);
  transform:translateY(101%);
  transition:transform .45s var(--ease);
}
.btn:hover::after{ transform:translateY(0) }
.btn:hover{ box-shadow:0 10px 26px -14px rgba(22,35,46,.6) }
.btn:active{ transform:translateY(1px) }
.btn--light{ --btn-bg:var(--bone); --btn-fg:var(--night) }
.btn--sm{ padding:.78em 1.35em; font-size:.665rem }

/* ── nav ───────────────────────────────────────────────────────────────── */
.nav{
  position:fixed; top:0; left:0; right:0; z-index:100;
  transition:background .5s var(--ease), box-shadow .5s var(--ease);
}
.nav__in{
  max-width:1240px; margin-inline:auto;
  padding:clamp(16px,2.2vw,26px) var(--pad);
  display:flex; align-items:center; gap:24px;
}
.brand{ display:flex; align-items:center; gap:.55em; color:var(--on-dark); flex:none; transition:color .5s var(--ease) }
.brand__mark{ width:21px; height:21px; flex:none; color:var(--latex-lit); transition:color .5s var(--ease) }
.brand__word{
  font-family:var(--ff-display); font-size:1.42rem; letter-spacing:-.005em; line-height:1;
  padding-top:.06em;
}
.nav__links{ display:flex; gap:clamp(14px,2vw,30px); margin-left:auto }
.nav__links a{
  font-family:var(--ff-mono); font-size:.685rem; letter-spacing:.13em; text-transform:uppercase;
  color:var(--on-dark-mu); position:relative; padding-block:.4em;
  transition:color .35s var(--ease);
}
.nav__links a::after{
  content:""; position:absolute; left:0; bottom:.1em; height:1px; width:100%;
  background:currentColor; transform:scaleX(0); transform-origin:left;
  transition:transform .4s var(--ease);
}
.nav__links a:hover{ color:var(--on-dark) }
.nav__links a:hover::after{ transform:scaleX(1) }
.nav__cta{ --btn-bg:transparent; --btn-fg:var(--on-dark); box-shadow:inset 0 0 0 1px var(--line-dark); flex:none }
.nav__cta::after{ background:var(--on-dark) }
.nav__cta:hover{ --btn-fg:var(--night) }

.nav.is-solid{
  background:rgba(250,248,244,.82);
  backdrop-filter:saturate(160%) blur(14px);
  -webkit-backdrop-filter:saturate(160%) blur(14px);
  box-shadow:0 1px 0 var(--line-soft);
}
.nav.is-solid .brand{ color:var(--ink) }
.nav.is-solid .brand__mark{ color:var(--latex) }
.nav.is-solid .nav__links a{ color:var(--muted) }
.nav.is-solid .nav__links a:hover{ color:var(--ink) }
.nav.is-solid .nav__cta{ --btn-fg:var(--ink); box-shadow:inset 0 0 0 1px var(--line) }
.nav.is-solid .nav__cta::after{ background:var(--ink) }
.nav.is-solid .nav__cta:hover{ --btn-fg:var(--bone) }
.nav.is-solid .nav__toggle span{ background:var(--ink) }

/* Over a dark section the bar goes dark instead of light. */
.nav.is-solid.is-dark{ background:rgba(15,26,34,.78); box-shadow:0 1px 0 var(--line-dark) }
.nav.is-solid.is-dark .brand{ color:var(--on-dark) }
.nav.is-solid.is-dark .brand__mark{ color:var(--latex-lit) }
.nav.is-solid.is-dark .nav__links a{ color:var(--on-dark-mu) }
.nav.is-solid.is-dark .nav__links a:hover{ color:var(--on-dark) }
.nav.is-solid.is-dark .nav__cta{ --btn-fg:var(--on-dark); box-shadow:inset 0 0 0 1px var(--line-dark) }
.nav.is-solid.is-dark .nav__cta::after{ background:var(--on-dark) }
.nav.is-solid.is-dark .nav__cta:hover{ --btn-fg:var(--night) }
.nav.is-solid.is-dark .nav__toggle span{ background:var(--on-dark) }

.nav__toggle{
  display:none; background:none; border:0; padding:10px; margin-left:auto; cursor:pointer;
  flex-direction:column; gap:5px;
}
.nav__toggle span{ display:block; width:22px; height:1.5px; background:var(--on-dark); transition:transform .35s var(--ease), opacity .3s }
.nav__toggle[aria-expanded="true"] span:first-child{ transform:translateY(3.25px) rotate(45deg) }
.nav__toggle[aria-expanded="true"] span:last-child{ transform:translateY(-3.25px) rotate(-45deg) }

.nav__drawer{
  display:none; flex-direction:column; gap:2px;
  padding:8px var(--pad) 26px;
  background:rgba(250,248,244,.97);
  backdrop-filter:blur(14px); -webkit-backdrop-filter:blur(14px);
  border-top:1px solid var(--line-soft);
}
.nav__drawer a{
  font-family:var(--ff-mono); font-size:.78rem; letter-spacing:.13em; text-transform:uppercase;
  color:var(--ink); padding:.85em 0; border-bottom:1px solid var(--line-soft);
}
.nav__drawer-cta{ color:var(--latex) !important; border-bottom:0 !important }

/* ── grain ─────────────────────────────────────────────────────────────── */
.grain{
  position:absolute; inset:0; pointer-events:none; z-index:1; opacity:.32;
  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='3'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.42'/%3E%3C/svg%3E");
  mix-blend-mode:overlay;
}

/* ── hero ──────────────────────────────────────────────────────────────── */
.hero{
  position:relative; overflow:hidden;
  background:var(--night);
  color:var(--on-dark);
  min-height:100svh;
  display:flex; flex-direction:column; justify-content:flex-end;
  padding:clamp(120px,16vh,180px) 0 0;
}
.hero__glow{
  position:absolute; left:50%; bottom:-34%; transform:translateX(-50%);
  width:min(170vw,2100px); aspect-ratio:2/1; z-index:0;
  background:
    radial-gradient(ellipse at 50% 100%, rgba(228,183,105,.42) 0%, rgba(184,132,43,.15) 32%, rgba(15,26,34,0) 64%);
  animation:breathe 14s ease-in-out infinite;
}
@keyframes breathe{ 0%,100%{opacity:.85} 50%{opacity:1} }

.hero__in{
  position:relative; z-index:2;
  width:100%; max-width:1240px; margin-inline:auto;
  padding-inline:var(--pad);
  padding-bottom:clamp(52px,7vw,92px);
}
/* Blueprint of the stack, ambient, right of the headline. */
.hero__profile{
  position:absolute; right:var(--pad); top:50%;
  transform:translateY(-50%);
  width:min(24vw,300px);
  display:none; flex-direction:column; gap:5px;
  pointer-events:none;
  -webkit-mask-image:linear-gradient(180deg,transparent,#000 18%,#000 74%,transparent);
  mask-image:linear-gradient(180deg,transparent,#000 18%,#000 74%,transparent);
}
.hero__profile i{
  display:block; height:var(--h);
  border:1px solid rgba(224,179,102,.24);
  border-radius:2px;
  opacity:0; transform:translateY(9px);
  animation:profileIn .9s var(--ease) forwards;
}
.hero__profile i.is-core{
  background:repeating-linear-gradient(90deg,
    rgba(224,179,102,.10) 0 1px, transparent 1px 7px);
}
.hero__profile i:nth-child(1){ animation-delay:.55s }
.hero__profile i:nth-child(2){ animation-delay:.62s }
.hero__profile i:nth-child(3){ animation-delay:.69s }
.hero__profile i:nth-child(4){ animation-delay:.76s }
.hero__profile i:nth-child(5){ animation-delay:.83s }
.hero__profile i:nth-child(6){ animation-delay:.90s }
.hero__profile i:nth-child(7){ animation-delay:.97s }
.hero__profile i:nth-child(8){ animation-delay:1.04s }
.hero__profile i:nth-child(9){ animation-delay:1.11s }
@keyframes profileIn{ to{ opacity:1; transform:none } }

.hero__h{
  font-family:var(--ff-display);
  font-weight:400;
  font-size:clamp(2.9rem,1.4rem + 7.4vw,6.6rem);
  line-height:.98;
  letter-spacing:-.026em;
  color:#F6F1E8;
  margin:.06em 0 0;
  max-width:16ch;
}
@media (min-width:1200px){
  .hero__profile{ display:flex }
  .hero__in{ padding-right:calc(var(--pad) + 340px) }
}
.hero__h .line{ display:block; overflow:hidden; padding-bottom:.04em }
.hero__h .line__in{ display:block }
.hero__h em{ font-style:italic; color:var(--latex-lit) }

.hero__sub{
  margin-top:clamp(24px,3vw,34px);
  max-width:52ch;
  color:var(--on-dark-mu);
  font-size:clamp(1rem,.95rem + .34vw,1.16rem);
  line-height:1.68;
}
.hero__cta{
  margin-top:clamp(30px,3.6vw,44px);
  display:flex; align-items:center; gap:clamp(18px,3vw,34px); flex-wrap:wrap;
}

.hero__foot{
  position:relative; z-index:2;
  border-top:1px solid var(--line-dark);
}
.ticker{
  max-width:1240px; margin-inline:auto; padding:22px var(--pad);
  display:grid; grid-template-columns:repeat(3,1fr); gap:20px;
}
.ticker div{ display:flex; flex-direction:column; gap:.35em }
.ticker dt{
  font-family:var(--ff-mono); font-size:.63rem; letter-spacing:.19em; text-transform:uppercase;
  color:var(--latex-lit);
}
.ticker dd{ margin:0; font-size:.92rem; color:var(--on-dark-mu); line-height:1.4 }

/* ── dawn ──────────────────────────────────────────────────────────────── */
.dawn{
  height:clamp(90px,14vw,190px);
  background:linear-gradient(180deg,var(--night) 0%, #2E3A3A 26%, #7C7362 58%, #C8BCA6 78%, var(--bone) 100%);
}

/* ── thesis ────────────────────────────────────────────────────────────── */
.sec--thesis{ padding-top:clamp(56px,7vw,96px) }
.thesis .h2{ max-width:19ch }
.thesis__cols{
  margin-top:clamp(46px,6vw,80px);
  display:grid; gap:clamp(28px,4vw,54px);
  grid-template-columns:repeat(3,1fr);
}
.thesis__cols > div{ border-top:1px solid var(--line); padding-top:1.5em }
.thesis__cols p{ font-size:.98rem }

/* ── architecture ──────────────────────────────────────────────────────── */
.sec--arch{
  background:
    linear-gradient(180deg, var(--bone) 0%, var(--calico) 22%, var(--calico) 78%, var(--bone) 100%);
}
.arch{
  display:grid;
  grid-template-columns:minmax(0,.82fr) minmax(0,1.18fr);
  gap:clamp(36px,6vw,86px);
  align-items:start;
}

.arch__draw{ position:sticky; top:clamp(96px,14vh,150px) }
.arch__label-top,.arch__label-bot{
  color:var(--muted); font-size:.6rem; letter-spacing:.2em;
  padding-left:34px;
}
.arch__label-top{ margin-bottom:14px }
.arch__label-bot{ margin-top:14px }

.stack{
  position:relative;
  padding:46px 0 46px 34px;   /* room for the layers to travel */
  display:flex; flex-direction:column;
  --ex:0;
}
.stack::before{
  content:""; position:absolute; left:12px; top:10px; bottom:10px; width:1px;
  background:linear-gradient(180deg,transparent,var(--line) 8%,var(--line) 92%,transparent);
}
.slab{
  height:var(--h);
  border-radius:2px;
  background:linear-gradient(178deg,var(--c) 0%,var(--c) 46%,var(--c2) 100%);
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.55),
    inset 0 -1px 0 rgba(20,30,36,.08),
    0 1px 3px rgba(20,30,36,.10);
  position:relative;
  transform:translate3d(var(--tx,0px), calc((var(--i) - 4) * var(--ex) * 1px), 0);
  transition:transform .55s var(--ease), box-shadow .4s var(--ease), filter .4s var(--ease);
}
.slab--coil{
  background:
    repeating-linear-gradient(90deg,
      rgba(255,255,255,.42) 0 3px,
      rgba(118,126,131,.16) 3px 5px,
      rgba(255,255,255,.06) 5px 8px),
    linear-gradient(178deg,var(--c),var(--c2));
}
.slab__k{
  position:absolute; left:-34px; top:50%; transform:translateY(-50%);
  font-size:.6rem; letter-spacing:.1em; color:var(--muted);
  width:22px; text-align:center;
  transition:color .3s var(--ease);
}
.slab__k::after{
  content:""; position:absolute; right:-11px; top:50%; width:9px; height:1px;
  background:var(--line);
  transition:background .3s var(--ease), width .4s var(--ease);
}
.slab.is-on{
  --tx:12px;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.7),
    0 0 0 1.5px var(--latex),
    0 10px 24px -12px rgba(20,30,36,.55);
  z-index:2;
}
.stack.has-on .slab:not(.is-on){ filter:saturate(.55) opacity(.7) }
.slab.is-on .slab__k{ color:var(--latex) }
.slab.is-on .slab__k::after{ background:var(--latex); width:18px }

.arch__list{ display:flex; flex-direction:column }
.arch__list li{
  display:grid; grid-template-columns:34px 1fr; gap:0 14px;
  padding:1.35em 0;
  border-top:1px solid var(--line-soft);
  cursor:default;
  transition:background .35s var(--ease);
}
.arch__list li:last-child{ border-bottom:1px solid var(--line-soft) }
.arch__list li.is-on{ background:linear-gradient(90deg, rgba(184,132,43,.09), rgba(184,132,43,0) 72%) }
.arch__key{ color:var(--latex); padding-top:.42em; font-size:.66rem }
.arch__list h3{
  font-family:var(--ff-body); font-weight:500; font-size:1.02rem; color:var(--ink);
  letter-spacing:-.004em; margin-bottom:.35em;
}
.arch__list p{ font-size:.95rem; line-height:1.6; max-width:52ch }

.note{
  margin-top:clamp(40px,5vw,64px);
  font-family:var(--ff-mono); font-size:.68rem; letter-spacing:.055em; line-height:1.9;
  color:var(--muted); text-transform:none;
  max-width:74ch; border-left:1px solid var(--line); padding-left:1.4em;
}

/* ── object ────────────────────────────────────────────────────────────── */
.sec--object{ background:var(--render-bg) }
.object{
  display:grid; grid-template-columns:minmax(0,1.12fr) minmax(0,.88fr);
  gap:clamp(32px,5vw,74px); align-items:center;
}
.object__fig{ margin:0 }
/* The render carries its own cream field; the section matches it and the
   edges are feathered so there is no visible frame. */
.object__fig img{
  width:100%;
  -webkit-mask-image:radial-gradient(ellipse 70% 72% at 45% 50%, #000 36%, transparent 88%);
  mask-image:radial-gradient(ellipse 70% 72% at 45% 50%, #000 36%, transparent 88%);
}
.object__fig figcaption{ color:var(--muted); font-size:.6rem; letter-spacing:.17em; margin-top:.6em }
.object__txt .h2{ margin-bottom:.7em }
.facts{ margin-top:2.2em; display:flex; flex-direction:column; gap:1.05em }
.facts li{
  display:grid; grid-template-columns:34px 1fr; gap:10px;
  font-size:.95rem; line-height:1.55;
  border-top:1px solid var(--line); padding-top:1.05em;
}
.facts span{ color:var(--latex); font-size:.64rem; padding-top:.3em }

/* ── two sides ─────────────────────────────────────────────────────────── */
.sides{
  display:grid; grid-template-columns:repeat(3,1fr); gap:clamp(16px,2vw,26px);
}
.sides__card{
  background:var(--bone);
  border:1px solid var(--line-soft);
  border-radius:3px;
  padding:clamp(24px,2.6vw,34px);
  position:relative; overflow:hidden;
  transition:transform .5s var(--ease), box-shadow .5s var(--ease), border-color .5s var(--ease);
}
.sides__card::before{
  content:""; position:absolute; left:0; top:0; height:2px; width:100%;
  background:linear-gradient(90deg,var(--latex),var(--hemp));
  transform:scaleX(0); transform-origin:left;
  transition:transform .6s var(--ease);
}
.sides__card:hover{
  transform:translateY(-4px);
  border-color:var(--line);
  box-shadow:0 22px 44px -30px rgba(22,35,46,.55);
}
.sides__card:hover::before{ transform:scaleX(1) }
.sides__card p{ font-size:.95rem }

/* ── principles ────────────────────────────────────────────────────────── */
.sec--refuse{ background:var(--calico) }
.refuse{
  display:grid; grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr);
  gap:clamp(34px,5vw,80px); align-items:start;
}
.refuse__head{ position:sticky; top:clamp(96px,14vh,150px) }
.refuse__head .h2{ margin-bottom:.7em }
.refuse__list{ display:grid; grid-template-columns:repeat(2,1fr); gap:0 clamp(24px,3vw,42px) }
.refuse__list li{ padding:1.5em 0; border-top:1px solid var(--line) }
.refuse__list h3{
  font-family:var(--ff-body); font-weight:500; font-size:1rem; color:var(--ink);
  margin-bottom:.45em; position:relative; padding-left:1.5em;
}
.refuse__list h3::before{
  content:""; position:absolute; left:0; top:.62em; width:11px; height:1.5px;
  background:var(--latex);
}
.refuse__list p{ font-size:.93rem; line-height:1.62; padding-left:1.5em }

/* ── standard of proof (dark) ──────────────────────────────────────────── */
.sec--honest{ background:var(--night); color:var(--on-dark-mu) }
.sec--honest .h2{ color:#F6F1E8 }
.sec--honest .lede{ color:var(--on-dark-mu) }
.honest{
  display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr);
  gap:clamp(38px,5vw,86px); align-items:start;
}
.honest__l{ position:sticky; top:clamp(96px,14vh,150px) }
.honest__l .h2{ margin-bottom:.65em }
.wont{ display:flex; flex-direction:column }
.wont li{
  font-family:var(--ff-display);
  font-size:clamp(1.15rem,1rem + .7vw,1.6rem);
  line-height:1.35; color:#E6DFD2;
  padding:.85em 0 .85em 1.7em;
  border-bottom:1px solid var(--line-dark);
  position:relative;
}
.wont li:first-child{ border-top:1px solid var(--line-dark) }
.wont li::before{
  content:""; position:absolute; left:0; top:1.42em; width:15px; height:1px;
  background:#8A5F5A;
}
.wont li::after{
  content:""; position:absolute; left:0; top:1.42em; width:15px; height:1px;
  background:#C97C6E; transform:scaleX(0); transform-origin:left;
  transition:transform .5s var(--ease);
}
.wont li:hover::after{ transform:scaleX(1) }
.will{
  margin-top:2.4em; padding:clamp(22px,2.6vw,32px);
  background:var(--night-2); border-radius:3px;
  border-left:2px solid var(--latex);
}
.will__tag{ color:var(--latex-lit); margin-bottom:.9em; font-size:.64rem }
.will p:last-child{ color:#D6CDBE; font-size:.98rem; line-height:1.68 }

/* ── process ───────────────────────────────────────────────────────────── */
.gates{ display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:0 clamp(30px,4vw,64px) }
.gates li{
  display:grid; grid-template-columns:56px 1fr; gap:0 16px;
  padding:1.75em 0; border-top:1px solid var(--line);
  position:relative;
}
.gates__n{
  font-size:.72rem; color:var(--muted); letter-spacing:.1em; padding-top:.3em;
  transition:color .35s var(--ease);
}
.gates li:hover .gates__n{ color:var(--latex) }
.gates h3{
  font-family:var(--ff-body); font-weight:500; font-size:1.05rem; color:var(--ink);
  margin-bottom:.4em;
}
.gates p{ font-size:.94rem; line-height:1.6; max-width:46ch }
.gates li[data-state="now"]{ border-top-color:var(--latex) }
.gates li[data-state="now"] .gates__n{ color:var(--latex) }
.gates__tag{
  display:inline-block; margin-top:.9em; padding:.42em .8em;
  background:rgba(184,132,43,.12); color:var(--latex);
  border-radius:2px; font-size:.6rem;
}

/* ── partners ──────────────────────────────────────────────────────────── */
.sec--partners{ background:var(--calico) }
.partners{
  display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr);
  gap:clamp(36px,5vw,80px); align-items:start;
}
.partners__l .h2{ margin-bottom:.65em }
.partners__l p{ max-width:48ch }
.partners__l .btn{ margin-top:2em }
.partners__tag{ color:var(--muted); margin-bottom:1.3em }
.reqs{ display:flex; flex-direction:column }
.reqs li{
  padding:1.15em 0 1.15em 2.1em; border-top:1px solid var(--line);
  font-size:.95rem; line-height:1.6; position:relative; color:var(--body);
}
.reqs li:last-child{ border-bottom:1px solid var(--line) }
.reqs li::before{
  content:""; position:absolute; left:0; top:1.72em;
  width:7px; height:7px; border:1px solid var(--hemp); border-radius:50%;
}

/* ── list (dark) ───────────────────────────────────────────────────────── */
.sec--list{
  background:var(--night); color:var(--on-dark-mu);
  position:relative; overflow:hidden;
  text-align:center;
}
.sec--list::before{
  content:""; position:absolute; left:50%; top:-30%; transform:translateX(-50%);
  width:min(120vw,1400px); aspect-ratio:2/1;
  background:radial-gradient(ellipse at 50% 50%, rgba(224,179,102,.16), rgba(15,26,34,0) 62%);
}
.list{ position:relative; z-index:2; max-width:720px }
.list .eyebrow{ justify-content:center }
.list .h2{ color:#F6F1E8 }
.list .lede{ color:var(--on-dark-mu); margin:1.1em auto 0 }

.form{
  margin-top:clamp(32px,4vw,46px);
  display:flex; gap:10px; flex-wrap:wrap; justify-content:center;
}
.form__in{
  flex:1 1 300px; max-width:400px;
  background:transparent; color:var(--on-dark);
  border:1px solid var(--line-dark); border-radius:2px;
  padding:1.05em 1.2em; font-size:.95rem;
  transition:border-color .35s var(--ease), background .35s var(--ease);
}
.form__in::placeholder{ color:#6E7E88 }
.form__in:focus{ border-color:var(--latex-lit); background:rgba(255,255,255,.03) }
.form__in.is-bad{ border-color:#C97C6E }
.form__msg{ flex-basis:100%; margin-top:.9em; min-height:1.2em; letter-spacing:.09em; color:var(--latex-lit) }
.form__msg.is-bad{ color:#C97C6E }
.form__note{ margin-top:1.4em; color:#6E7E88; font-size:.62rem; letter-spacing:.13em }

/* ── faq ───────────────────────────────────────────────────────────────── */
.faq{ max-width:900px; border-top:1px solid var(--line) }
.faq details{ border-bottom:1px solid var(--line) }
.faq summary{
  list-style:none; cursor:pointer;
  display:flex; align-items:center; justify-content:space-between; gap:20px;
  padding:1.5em 0;
  font-family:var(--ff-display); font-size:clamp(1.15rem,1rem + .55vw,1.5rem);
  line-height:1.3; color:var(--ink);
  transition:color .3s var(--ease);
}
.faq summary::-webkit-details-marker{ display:none }
.faq summary:hover{ color:var(--latex) }
.faq__ic{ position:relative; width:13px; height:13px; flex:none }
.faq__ic::before,.faq__ic::after{
  content:""; position:absolute; inset:50% 0 auto 0; height:1.5px; background:currentColor;
}
.faq__ic::after{ transform:rotate(90deg); transition:transform .4s var(--ease) }
.faq details[open] .faq__ic::after{ transform:rotate(0deg) }
.faq details > div{ padding-bottom:1.9em; max-width:66ch }
.faq details > div p{ font-size:.98rem }
.faq details[open] > div{ animation:fadein .5s var(--ease) both }
@keyframes fadein{ from{opacity:0; transform:translateY(-6px)} to{opacity:1; transform:none} }

/* ── footer ────────────────────────────────────────────────────────────── */
.foot{ background:var(--night); color:var(--on-dark-mu); padding-block:clamp(52px,6vw,80px) }
.foot__in{ display:grid; gap:clamp(30px,4vw,52px) }
.foot__brand{ display:flex; align-items:center; gap:.55em; color:var(--on-dark) }
.foot__brand .brand__mark{ color:var(--latex-lit) }
.foot__brand p{ color:#68787F; font-size:.62rem; margin-left:.4em }
.foot__nav{ display:flex; flex-wrap:wrap; gap:14px clamp(20px,3vw,38px) }
.foot__nav a{
  font-family:var(--ff-mono); font-size:.67rem; letter-spacing:.13em; text-transform:uppercase;
  color:var(--on-dark-mu); transition:color .3s var(--ease);
}
.foot__nav a:hover{ color:var(--latex-lit) }
.foot__legal{
  border-top:1px solid var(--line-dark); padding-top:1.9em;
  font-size:.62rem; letter-spacing:.055em; line-height:2; text-transform:none;
  color:#68787F; max-width:78ch;
}
.foot__legal span{ display:block; margin-top:1em; letter-spacing:.15em; text-transform:uppercase }

/* ── reveal ────────────────────────────────────────────────────────────── */
.rv{
  opacity:0; transform:translateY(20px);
  transition:opacity .85s var(--ease), transform .85s var(--ease);
}
.rv.in{ opacity:1; transform:none }
.hero__h .line__in{ opacity:0; transform:translateY(102%); transition:opacity .1s linear .1s, transform 1.05s var(--ease) }
.hero__h .line__in.in{ opacity:1; transform:none }

/* ── responsive ────────────────────────────────────────────────────────── */
@media (max-width:1060px){
  .nav__links{ display:none }
  .nav__cta{ display:none }
  .nav__toggle{ display:flex }
  .nav.is-open .nav__drawer{ display:flex }
  .nav.is-open{ background:rgba(250,248,244,.97); backdrop-filter:blur(14px); -webkit-backdrop-filter:blur(14px) }
  .nav.is-open .brand{ color:var(--ink) }
  .nav.is-open .brand__mark{ color:var(--latex) }
  .nav.is-open .nav__toggle span{ background:var(--ink) }

  .arch{ grid-template-columns:1fr }
  .arch__draw{ position:static; max-width:420px; margin-inline:auto }
  .refuse,.honest,.partners,.object{ grid-template-columns:1fr }
  .refuse__head,.honest__l{ position:static }
  .object__fig{ order:-1; max-width:600px; margin-inline:auto }
  .gates{ grid-template-columns:1fr }
}
@media (max-width:760px){
  .thesis__cols{ grid-template-columns:1fr }
  .sides{ grid-template-columns:1fr }
  .refuse__list{ grid-template-columns:1fr }
  .ticker{ grid-template-columns:1fr; gap:14px; padding-block:18px }
  .ticker div{ flex-direction:row; align-items:baseline; gap:12px }
  .ticker dt{ min-width:74px }
  .ticker dd{ font-size:.86rem }
  .hero{ min-height:92svh }
  .form{ flex-direction:column; align-items:stretch }
  .form__in{ max-width:none }
  .arch__list li{ grid-template-columns:26px 1fr }
}
@media (max-width:420px){
  .hero__h{ font-size:clamp(2.6rem,10.5vw,3.4rem) }
}

/* ── reduced motion ────────────────────────────────────────────────────── */
@media (prefers-reduced-motion:reduce){
  html{ scroll-behavior:auto }
  *,*::before,*::after{
    animation-duration:.01ms !important; animation-iteration-count:1 !important;
    transition-duration:.01ms !important;
  }
  .rv,.hero__h .line__in{ opacity:1 !important; transform:none !important }
  .stack{ --ex:9 }
}