:root{
  --void:#0B0705; --void-2:#120B07; --ember:#1C120A; --ember-2:#241609;
  --gold:#EFC670; --gold-hi:#FFF2CF; --gold-deep:#C9871F; --gold-dark:#8A5A12;
  --cream:#F7EEDF;
  --dim:rgba(240,228,210,.70);
  --faint:rgba(240,228,210,.44);
  --ghost:rgba(240,228,210,.13);
  --display:"Cormorant Garamond",Georgia,"Times New Roman",serif;
  --body:"Jost","Helvetica Neue",Arial,sans-serif;
  --gut:clamp(22px,6vw,88px);
  --maxw:1280px;
  --E:cubic-bezier(.16,.84,.3,1);
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}}
body{margin:0;background:var(--void);color:var(--cream);font-family:var(--body);font-weight:300;
  font-size:17px;line-height:1.72;-webkit-font-smoothing:antialiased;overflow-x:hidden}
img{max-width:100%;display:block}
::selection{background:var(--gold);color:var(--void)}
a{color:inherit;text-decoration:none}
:focus-visible{outline:1px solid var(--gold);outline-offset:5px;border-radius:2px}

h1,h2,h3{font-family:var(--display);font-weight:300;margin:0;letter-spacing:-.01em;text-wrap:balance}
h1{font-size:clamp(46px,8.2vw,120px);line-height:.94}
h2{font-size:clamp(34px,5.4vw,76px);line-height:1.02}
h3{font-size:clamp(22px,2.2vw,30px);line-height:1.18;font-weight:400}
em{font-style:italic;color:var(--gold)}
p{margin:0}
.lede{font-size:clamp(16px,1.35vw,19.5px);line-height:1.78;color:var(--dim);max-width:48ch;font-weight:300}
.copy{color:var(--dim);max-width:46ch;font-size:16.5px}
.label{font-size:11px;letter-spacing:.34em;text-transform:uppercase;color:var(--gold);font-weight:400}
.label-dim{font-size:11px;letter-spacing:.34em;text-transform:uppercase;color:var(--faint);font-weight:400}
.fine{font-size:12.5px;line-height:1.9;color:var(--faint);max-width:52ch;margin-top:26px;font-weight:200}

/* ── pointer light ── */
#glow{position:fixed;width:620px;height:620px;left:0;top:0;margin:-310px 0 0 -310px;pointer-events:none;z-index:2;
  background:radial-gradient(circle,rgba(239,198,112,.11),rgba(239,198,112,.04) 38%,rgba(239,198,112,0) 68%);
  opacity:0;transition:opacity .6s ease;mix-blend-mode:screen}
@media(hover:none){#glow{display:none}}

/* ── thread ── */
.thread{position:fixed;left:clamp(12px,2.2vw,30px);top:14vh;bottom:14vh;width:1px;z-index:40;
  background:linear-gradient(to bottom,transparent,var(--ghost) 12%,var(--ghost) 88%,transparent)}
.thread .fill{position:absolute;left:0;top:0;width:1px;height:0;
  background:linear-gradient(to bottom,rgba(239,198,112,0),var(--gold));transition:height .12s linear}
.thread .bead{position:absolute;left:-3px;width:7px;height:7px;border-radius:50%;background:var(--gold);
  box-shadow:0 0 14px 3px rgba(239,198,112,.55);transition:top .12s linear}
@media(max-width:1080px){.thread{display:none}}

/* ── nav ── */
.nav{position:fixed;top:0;left:0;right:0;z-index:95;display:flex;align-items:center;justify-content:space-between;
  padding:26px var(--gut);transition:background .5s ease,padding .5s ease}
.nav.stuck{background:rgba(11,7,5,.74);backdrop-filter:blur(16px);padding-top:15px;padding-bottom:15px}
.brand{display:inline-flex;align-items:center;gap:11px;font-family:var(--display);font-size:20px;
  letter-spacing:.2em;font-weight:400;color:var(--cream)}
.brand img{width:26px;height:26px;display:block;flex:none}
.nav-links{display:flex;align-items:center;gap:clamp(18px,2.6vw,36px)}
.nav-links a:not(.pill){font-size:12px;letter-spacing:.14em;color:var(--faint);transition:color .35s;font-weight:300}
.nav-links a:not(.pill):hover{color:var(--cream)}
@media(max-width:880px){.nav-links a.hide{display:none}}

.pill{display:inline-flex;align-items:center;justify-content:center;font-size:11.5px;letter-spacing:.2em;
  text-transform:uppercase;color:var(--void);background:var(--gold);padding:14px 30px;border-radius:100px;
  font-weight:400;transition:background .4s ease,box-shadow .4s ease,transform .18s ease,color .4s ease;will-change:transform}
.pill:hover{background:var(--gold-hi);color:var(--void);box-shadow:0 0 44px rgba(239,198,112,.4)}
.pill-ghost{background:transparent;color:var(--gold);box-shadow:inset 0 0 0 1px rgba(239,198,112,.34)}
.pill-ghost:hover{background:rgba(239,198,112,.09);color:var(--gold-hi);box-shadow:inset 0 0 0 1px var(--gold),0 0 44px rgba(239,198,112,.18)}

main{position:relative;z-index:3}
section{padding:clamp(96px,12vw,180px) var(--gut);position:relative;scroll-margin-top:78px}
.inner{max-width:var(--maxw);margin:0 auto;position:relative}
.dv{height:1px;margin:0 var(--gut);background:linear-gradient(90deg,transparent,rgba(239,198,112,.30),transparent);
  transform:scaleX(.06);transform-origin:50% 50%;transition:transform 1.5s var(--E)}
.dv.in{transform:scaleX(1)}
.head{text-align:center;max-width:min(940px,100%);margin:0 auto clamp(44px,6vw,80px)}
.head .label{display:block;margin-bottom:26px}
.head h2{margin:0 auto;max-width:17ch}
.head p{margin:26px auto 0}

/* ── reveal ── */
.mask{display:block;overflow:hidden}
.js .mask>*{display:block;transform:translateY(105%)}
.js .mask.in>*{transform:translateY(0);transition:transform 1.05s var(--E)}
.js .rv{opacity:0;transform:translateY(22px)}
.js .rv.in{opacity:1;transform:none;transition:opacity 1.05s var(--E),transform 1.05s var(--E)}
.ph{display:block;overflow:hidden;position:relative;background:var(--ember)}
.ph img{width:100%;height:100%;object-fit:cover;transform:scale(1.14);transition:transform 1.6s var(--E)}
.js .ph{clip-path:inset(0 0 100% 0);transition:clip-path 1.3s var(--E)}
.js .ph.in{clip-path:inset(0 0 0 0)}
.js .ph.in img{transform:scale(1)}
@media(prefers-reduced-motion:reduce){
  .js .mask>*,.js .rv{transform:none!important;opacity:1!important;transition:none!important}
  .js .ph{clip-path:none!important}.js .ph img{transform:none!important}
  .dv{transform:scaleX(1)!important}
}

/* ── hero ── */
.hero{padding-top:clamp(132px,19vh,210px);padding-bottom:clamp(70px,8vw,110px);overflow:hidden}
.hero-bg{position:absolute;inset:0;z-index:0;overflow:hidden}
#shader{position:absolute;inset:0;width:100%;height:100%}
.fallback{position:absolute;inset:0;z-index:-1}
.fallback i{position:absolute;border-radius:50%;filter:blur(52px);display:block}
.fb1{width:46%;height:78%;left:52%;top:-16%;background:radial-gradient(circle at 40% 40%,#FFD98A,#C9871F 46%,rgba(120,70,10,0) 72%);animation:drift 21s ease-in-out infinite}
.fb2{width:38%;height:64%;left:66%;top:32%;background:radial-gradient(circle at 50% 50%,#FFF2CF,#E0A233 40%,rgba(90,50,8,0) 74%);animation:drift 27s ease-in-out infinite reverse}
@keyframes drift{0%,100%{transform:translate3d(0,0,0) scale(1)}33%{transform:translate3d(6%,-7%,0) scale(1.14)}66%{transform:translate3d(-5%,5%,0) scale(.9)}}
.hero-veil{position:absolute;inset:0;z-index:1;
  background:linear-gradient(100deg,rgba(11,7,5,.97) 24%,rgba(11,7,5,.68) 48%,rgba(11,7,5,.06) 72%,rgba(11,7,5,.32) 100%)}
.hero .inner{z-index:3}
.hero-grid{display:grid;grid-template-columns:minmax(0,1.4fr) minmax(0,.6fr);gap:clamp(28px,4vw,64px);align-items:center}
@media(max-width:960px){.hero-grid{grid-template-columns:1fr;gap:48px}}
.hero h1{margin:26px 0 30px}
.cta-row{display:flex;flex-wrap:wrap;gap:16px;margin-top:38px}
.scroll-cue{display:flex;align-items:center;gap:14px;margin-top:clamp(44px,6vw,78px);color:var(--faint);
  font-size:11px;letter-spacing:.3em;text-transform:uppercase}
.scroll-cue .line{width:56px;height:1px;background:linear-gradient(90deg,var(--gold),transparent);position:relative;overflow:hidden}
.scroll-cue .line::after{content:"";position:absolute;inset:0;width:18px;background:var(--gold-hi);animation:sweep 2.6s ease-in-out infinite}
@keyframes sweep{0%{transform:translateX(-20px);opacity:0}40%{opacity:1}100%{transform:translateX(60px);opacity:0}}
@media(prefers-reduced-motion:reduce){.scroll-cue .line::after,.fb1,.fb2{animation:none}}
.vial-wrap{display:flex;justify-content:center}
.vial{width:min(230px,54vw);height:auto;overflow:visible;display:block}
@keyframes bob{0%,100%{transform:translateY(0) rotate(0deg)}50%{transform:translateY(-14px) rotate(1.2deg)}}
@keyframes shine{0%,100%{opacity:.22}50%{opacity:.7}}
.vf{animation:bob 9s ease-in-out infinite;transform-origin:50% 40%}
.vs{animation:shine 5.5s ease-in-out infinite}
@media(prefers-reduced-motion:reduce){.vf,.vs{animation:none}}

/* ── figures: symmetric 4-up ── */
.figures{display:grid;grid-template-columns:repeat(4,1fr);gap:clamp(20px,3vw,48px);margin-top:clamp(56px,7vw,92px)}
@media(max-width:780px){.figures{grid-template-columns:repeat(2,1fr);gap:36px}}
.fig b{display:block;font-family:var(--display);font-size:clamp(42px,5.2vw,70px);font-weight:300;line-height:.9;
  color:var(--gold);font-variant-numeric:tabular-nums}
.fig>span{display:block;margin-top:14px;font-size:11px;letter-spacing:.24em;text-transform:uppercase;
  color:rgba(240,228,210,.60);line-height:1.9}

/* ── symmetric splits ── */
.duo{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:clamp(34px,5vw,96px);align-items:center}
@media(max-width:900px){.duo{grid-template-columns:1fr;gap:46px}}
.duo-top{align-items:start}

/* ── gauge ── */
.gauge-top{display:flex;justify-content:space-between;align-items:baseline;gap:20px}
#ageOut{font-family:var(--display);font-size:clamp(46px,5.6vw,72px);font-weight:300;color:var(--cream);
  line-height:.9;font-variant-numeric:tabular-nums}
input[type=range]{-webkit-appearance:none;appearance:none;width:100%;height:1px;background:var(--ghost);
  outline:none;margin:32px 0 44px;cursor:pointer}
input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;width:26px;height:26px;border-radius:50%;
  background:radial-gradient(circle at 38% 34%,var(--gold-hi),var(--gold-deep));cursor:grab;box-shadow:0 0 26px rgba(239,198,112,.55)}
input[type=range]::-moz-range-thumb{width:22px;height:22px;border:0;border-radius:50%;
  background:radial-gradient(circle at 38% 34%,var(--gold-hi),var(--gold-deep));cursor:grab;box-shadow:0 0 26px rgba(239,198,112,.55)}
.gbar{margin-bottom:28px}
.gbar-h{display:flex;justify-content:space-between;align-items:baseline;margin-bottom:12px}
.gbar-h b{font-family:var(--display);font-size:28px;font-weight:400;font-variant-numeric:tabular-nums;color:var(--faint)}
.gbar-t{height:3px;background:rgba(240,228,210,.08);position:relative;overflow:hidden;border-radius:3px}
.gbar-f{position:absolute;inset:0 auto 0 0;border-radius:3px;transition:width .8s var(--E)}
.g-paper .gbar-f{background:rgba(240,228,210,.25)}
.g-obj .gbar-f{background:linear-gradient(90deg,var(--gold-dark),var(--gold),var(--gold-hi));box-shadow:0 0 22px rgba(239,198,112,.5)}
.g-obj b{color:var(--gold)}
.delta-line{display:flex;align-items:baseline;gap:20px;margin-top:12px}
.delta-line strong{font-family:var(--display);font-size:clamp(60px,8vw,108px);font-weight:300;line-height:.82;
  color:var(--gold);font-variant-numeric:tabular-nums}

/* ── canvases ── */
.canvas-hold{position:relative;margin-top:clamp(44px,6vw,78px)}
#telo{display:block;width:100%}
.cap-row{display:flex;flex-wrap:wrap;justify-content:center;gap:clamp(20px,3vw,42px);margin-top:26px}
.cap{display:flex;align-items:center;gap:11px;font-size:11.5px;letter-spacing:.16em;text-transform:uppercase;color:rgba(240,228,210,.62)}
.cap i{width:9px;height:9px;border-radius:50%;display:block}
.swarm-hold{position:relative;aspect-ratio:1/1;max-width:520px;margin:0 auto;width:100%}
#swarm{position:absolute;inset:0;width:100%;height:100%}
.swarm-mid{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;
  pointer-events:none;text-align:center}
#swarmN{font-family:var(--display);font-size:clamp(66px,10vw,132px);font-weight:300;line-height:.85;color:var(--gold-hi);
  font-variant-numeric:tabular-nums;text-shadow:0 0 60px rgba(239,198,112,.55)}
.swarm-mid span{margin-top:16px;font-size:10.5px;letter-spacing:.3em;text-transform:uppercase;color:var(--faint)}

/* ── pairs ── */
.pairs{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:clamp(34px,5vw,84px);margin-top:clamp(40px,5vw,72px)}
@media(max-width:820px){.pairs{grid-template-columns:1fr}}
.pair h3{margin-bottom:20px}
.pair h3 .n{font-family:var(--body);font-size:11px;letter-spacing:.3em;color:var(--gold);display:block;
  margin-bottom:16px;font-weight:400}
.pair p{color:var(--dim);font-size:16px;max-width:none}
.pair ul{list-style:none;padding:0;margin:24px 0 0}
.pair li{color:var(--dim);font-size:15px;padding:15px 0;line-height:1.6;
  border-bottom:1px solid rgba(239,198,112,.14)}
.pair li:first-child{border-top:1px solid rgba(239,198,112,.14)}

/* ── domain rows: identical, aligned, symmetric ── */
.dlist{margin-top:clamp(36px,4.5vw,64px)}
.drow{display:grid;grid-template-columns:46px 150px minmax(0,1fr) minmax(0,1.2fr);
  gap:clamp(16px,2.6vw,40px);align-items:center;padding:clamp(16px,1.8vw,22px) clamp(10px,1.4vw,22px);
  position:relative;transition:background .55s ease}
.drow+.drow{border-top:1px solid rgba(239,198,112,.12)}
.drow:hover{background:linear-gradient(90deg,rgba(239,198,112,.10),rgba(239,198,112,.02) 52%,transparent)}
.drow .n{font-family:var(--display);font-size:16px;color:var(--gold);font-weight:400;transition:transform .55s var(--E)}
.drow:hover .n{transform:translateX(5px)}
.drow .ph{aspect-ratio:3/2;border-radius:2px}
.drow .ph img{filter:brightness(.82) contrast(1.02);transition:transform 1.1s var(--E),filter .6s ease}
.drow:hover .ph img{transform:scale(1.07);filter:brightness(1.05) contrast(1.04)}
.drow h3{transition:color .5s}
.drow:hover h3{color:var(--gold-hi)}
.drow p{color:var(--faint);font-size:15.5px;line-height:1.66;max-width:none;transition:color .5s}
.drow:hover p{color:var(--dim)}
@media(max-width:900px){
  .drow{grid-template-columns:40px 108px minmax(0,1fr);gap:16px;align-items:start}
  .drow p{grid-column:2/-1;margin-top:8px}
  .drow .ph{grid-row:span 2}
}
@media(max-width:560px){
  .drow{grid-template-columns:34px minmax(0,1fr)}
  .drow .ph{grid-column:1/-1;grid-row:auto;aspect-ratio:16/7;margin-bottom:14px}
  .drow p{grid-column:1/-1}
}

/* ── triptych ── */
.tript{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(12px,1.6vw,24px) clamp(12px,1.6vw,24px);margin-top:clamp(48px,6vw,84px)}
@media(max-width:760px){.tript{grid-template-columns:1fr;max-width:420px;margin-left:auto;margin-right:auto}}
.tript .ph{aspect-ratio:3/4;border-radius:2px}
.tript figure{margin:0;position:relative;will-change:transform}
.tript figcaption{margin-top:18px;text-align:center;font-size:12px;letter-spacing:.2em;
  text-transform:uppercase;color:var(--gold);font-weight:400}

/* ── ember band ── */
.ember{background:
  radial-gradient(120% 90% at 82% 18%,rgba(201,135,31,.20),transparent 58%),
  radial-gradient(90% 80% at 12% 88%,rgba(138,90,18,.16),transparent 60%),
  linear-gradient(180deg,var(--void),var(--ember) 44%,var(--void))}
.quad{display:grid;grid-template-columns:repeat(4,1fr);gap:clamp(24px,3.4vw,56px);margin-top:clamp(44px,5.5vw,80px)}
@media(max-width:900px){.quad{grid-template-columns:repeat(2,1fr);gap:38px}}
@media(max-width:480px){.quad{grid-template-columns:1fr}}
.seal{margin-top:clamp(46px,5.5vw,78px);display:grid;grid-template-columns:repeat(4,1fr);
  border-top:1px solid rgba(239,198,112,.22);border-bottom:1px solid rgba(239,198,112,.22);
  background:linear-gradient(180deg,rgba(239,198,112,.055),rgba(239,198,112,.012))}
.seal div{padding:clamp(26px,3vw,40px) clamp(14px,1.8vw,26px);text-align:center;position:relative}
.seal div+div::before{content:"";position:absolute;left:0;top:20%;bottom:20%;width:1px;
  background:linear-gradient(180deg,transparent,rgba(239,198,112,.24),transparent)}
.seal b{display:block;font-family:var(--display);font-size:clamp(23px,2.5vw,33px);font-weight:300;
  color:var(--gold);margin-bottom:11px;line-height:1;letter-spacing:.01em}
.seal span{display:block;font-size:12.5px;line-height:1.75;color:rgba(240,228,210,.62);font-weight:300;max-width:23ch;margin:0 auto}
@media(max-width:820px){
  .seal{grid-template-columns:repeat(2,1fr)}
  .seal div:nth-child(3)::before{display:none}
  .seal div:nth-child(n+3){border-top:1px solid rgba(239,198,112,.14)}}
@media(max-width:460px){
  .seal{grid-template-columns:1fr}
  .seal div+div::before{display:none}
  .seal div+div{border-top:1px solid rgba(239,198,112,.14)}}

.vnav{display:flex;align-items:center;justify-content:center;gap:clamp(16px,2.6vw,30px);
  margin-top:clamp(28px,3.4vw,44px)}
.vnav .dots{margin-top:0}
.varr{width:44px;height:44px;border-radius:50%;border:1px solid rgba(239,198,112,.28);
  background:transparent;color:var(--gold);display:grid;place-items:center;cursor:pointer;padding:0;
  transition:background .35s ease,border-color .35s ease,transform .22s ease}
.varr:hover{background:rgba(239,198,112,.11);border-color:var(--gold);transform:scale(1.07)}
.varr:active{transform:scale(.96)}
.varr svg{width:13px;height:13px;display:block;fill:none;stroke:currentColor;stroke-width:1.6;
  stroke-linecap:round;stroke-linejoin:round}
.stage{touch-action:pan-y}
.stp .n{font-size:11px;letter-spacing:.3em;color:var(--gold);display:block;margin-bottom:18px}
.stp h3{font-size:22px;margin-bottom:12px}
.stp p{color:var(--faint);font-size:15px;line-height:1.68}

/* ── voices: grid-stacked so height follows the tallest ── */
.stage{display:grid;margin-top:clamp(36px,4.5vw,64px)}
.vq{grid-area:1/1;margin:0;opacity:0;transform:translateY(18px);pointer-events:none;
  transition:opacity 1.1s var(--E),transform 1.1s var(--E)}
.vq.on{opacity:1;transform:none;pointer-events:auto}
.vq p{font-family:var(--display);font-size:clamp(24px,3.2vw,44px);line-height:1.26;font-weight:300;
  color:var(--cream);max-width:26ch;margin:0 auto}
.vq footer{margin-top:clamp(22px,2.6vw,36px);display:flex;justify-content:center;align-items:baseline;gap:18px;
  font-size:11px;letter-spacing:.26em;text-transform:uppercase;color:var(--faint)}
.vq footer b{color:var(--gold);font-weight:400}
.dots{display:flex;justify-content:center;gap:12px;margin-top:clamp(28px,3.4vw,44px)}
.dots button{width:34px;height:2px;border:0;padding:0;background:rgba(240,228,210,.18);cursor:pointer;
  transition:background .5s ease;border-radius:2px}
.dots button.on{background:var(--gold);box-shadow:0 0 14px rgba(239,198,112,.6)}

/* ── faq ── */
.faq{margin-top:clamp(36px,4.5vw,64px);max-width:900px;margin-left:auto;margin-right:auto}
details{border-bottom:1px solid rgba(239,198,112,.16)}
summary{list-style:none;cursor:pointer;padding:clamp(22px,2.6vw,32px) 56px clamp(22px,2.6vw,32px) 0;
  position:relative;font-family:var(--display);font-size:clamp(21px,2.4vw,31px);font-weight:300;
  color:var(--cream);transition:color .45s}
summary::-webkit-details-marker{display:none}
summary:hover{color:var(--gold)}
summary .x{position:absolute;right:8px;top:50%;width:16px;height:16px;margin-top:-8px}
summary .x::before,summary .x::after{content:"";position:absolute;left:0;top:7px;width:16px;height:1px;
  background:var(--gold);transition:transform .45s ease,opacity .45s}
summary .x::after{transform:rotate(90deg)}
details[open] summary .x::after{transform:rotate(0);opacity:0}
details .ans{padding:0 0 clamp(26px,3vw,38px);max-width:62ch;color:var(--dim);font-size:16.5px}

/* ── contact ── */
.addr{display:flex;flex-direction:column;gap:clamp(24px,3vw,40px)}
.addr span{display:block;font-size:10.5px;letter-spacing:.3em;text-transform:uppercase;color:var(--gold);margin-bottom:12px}
.addr p,.addr a{font-size:17px;color:var(--dim);line-height:1.7;font-weight:300}
.addr a{transition:color .4s}
.addr a:hover{color:var(--gold)}

/* ── enquiry modal ── */
.scrim{position:fixed;inset:0;z-index:200;background:rgba(6,4,2,.74);backdrop-filter:blur(9px);
  opacity:0;pointer-events:none;transition:opacity .5s var(--E)}
.scrim.open{opacity:1;pointer-events:auto}
.modal{position:fixed;inset:0;z-index:201;display:grid;place-items:center;padding:22px;
  pointer-events:none;overflow-y:auto}
.modal.open{pointer-events:auto}
.sheet{width:min(500px,100%);background:linear-gradient(168deg,#1A1008,#0D0805 62%);
  border:1px solid rgba(239,198,112,.24);border-radius:3px;padding:clamp(28px,4vw,46px);
  box-shadow:0 40px 120px rgba(0,0,0,.7),0 0 90px rgba(239,198,112,.09);position:relative;
  opacity:0;transform:translateY(26px) scale(.97);transition:opacity .55s var(--E),transform .55s var(--E)}
.modal.open .sheet{opacity:1;transform:none}
@media(prefers-reduced-motion:reduce){.sheet,.scrim{transition:none}}
.sheet h3{font-size:clamp(27px,3.4vw,38px);margin:16px 0 12px}
.sheet .intro{color:var(--dim);font-size:15px;line-height:1.65;max-width:38ch}
.x-btn{position:absolute;top:16px;right:16px;width:38px;height:38px;border-radius:50%;padding:0;
  border:1px solid rgba(239,198,112,.22);background:transparent;color:var(--gold);cursor:pointer;
  display:grid;place-items:center;transition:background .35s,border-color .35s,transform .2s}
.x-btn:hover{background:rgba(239,198,112,.10);border-color:var(--gold);transform:rotate(90deg)}
.x-btn svg{width:13px;height:13px;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round}
.fields{display:flex;flex-direction:column;gap:4px;margin-top:30px}
.field{position:relative;padding-top:20px}
.field label{position:absolute;top:20px;left:0;font-size:15px;color:var(--faint);font-weight:300;
  pointer-events:none;transition:transform .35s var(--E),font-size .35s var(--E),color .35s,letter-spacing .35s}
.field input{width:100%;background:transparent;border:0;border-bottom:1px solid rgba(239,198,112,.20);
  color:var(--cream);font-family:var(--body);font-size:16px;font-weight:300;padding:6px 0 12px;
  border-radius:0;transition:border-color .4s}
.field input:focus{outline:none;border-bottom-color:var(--gold)}
.field input:focus+label,.field input:not(:placeholder-shown)+label{
  transform:translateY(-21px);font-size:10px;letter-spacing:.22em;text-transform:uppercase;color:var(--gold)}
.field .err{display:block;min-height:15px;font-size:11.5px;color:#E8A07A;margin-top:6px;opacity:0;transition:opacity .3s}
.field.bad input{border-bottom-color:#E8A07A}
.field.bad .err{opacity:1}
.sheet .pill{width:100%;margin-top:26px;padding:16px 30px}
.sheet .pill[disabled]{opacity:.55;cursor:not-allowed}
.sheet .note{margin-top:18px;font-size:11.5px;line-height:1.7;color:rgba(240,228,210,.36);font-weight:200}
.done{text-align:center;padding:14px 0 6px}
.done .tick{width:60px;height:60px;margin:0 auto 24px;border-radius:50%;
  border:1px solid rgba(239,198,112,.34);display:grid;place-items:center}
.done .tick svg{width:24px;height:24px;fill:none;stroke:var(--gold);stroke-width:1.4;
  stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:40;stroke-dashoffset:40;
  animation:draw .7s var(--E) .15s forwards}
@keyframes draw{to{stroke-dashoffset:0}}
@media(prefers-reduced-motion:reduce){.done .tick svg{stroke-dashoffset:0;animation:none}}
.done h3{margin-bottom:14px}
.done p{color:var(--dim);font-size:15px;line-height:1.7;max-width:34ch;margin:0 auto}

/* ══════════ MOBILE ══════════ */
.burger{display:none;width:44px;height:44px;padding:0;border:0;background:transparent;
  cursor:pointer;position:relative;z-index:2;flex:none}
.burger span{position:absolute;left:11px;width:22px;height:1.5px;background:var(--cream);
  border-radius:2px;transition:transform .45s var(--E),opacity .3s ease}
.burger span:nth-child(1){top:18px}
.burger span:nth-child(2){top:25px}
.burger[aria-expanded="true"] span:nth-child(1){transform:translateY(3.5px) rotate(45deg)}
.burger[aria-expanded="true"] span:nth-child(2){transform:translateY(-3.5px) rotate(-45deg)}

.mnav{position:fixed;inset:0;z-index:90;display:flex;flex-direction:column;justify-content:center;
  padding:96px clamp(26px,7vw,44px) 40px;
  background:radial-gradient(120% 70% at 88% 8%,rgba(201,135,31,.26),transparent 60%),
             linear-gradient(170deg,#170E07,#0B0705 68%);
  opacity:0;pointer-events:none;visibility:hidden;
  transition:opacity .5s var(--E),visibility .5s;overflow-y:auto}
.mnav.open{opacity:1;pointer-events:auto;visibility:visible}
.mnav nav{display:flex;flex-direction:column}
.mnav nav a{font-family:var(--display);font-size:clamp(29px,8.4vw,40px);font-weight:300;
  color:var(--cream);padding:11px 0;line-height:1.12;
  opacity:0;transform:translateY(18px);transition:opacity .5s var(--E),transform .5s var(--E),color .3s}
.mnav.open nav a{opacity:1;transform:none}
.mnav nav a:active{color:var(--gold)}
.mnav .pill{margin-top:34px;width:100%;padding:18px 30px;font-size:12px;
  opacity:0;transform:translateY(18px);transition:opacity .5s var(--E) .34s,transform .5s var(--E) .34s}
.mnav.open .pill{opacity:1;transform:none}
.mnav-foot{margin-top:32px;font-size:13px;line-height:1.9;color:var(--faint);
  opacity:0;transition:opacity .5s var(--E) .42s}
.mnav.open .mnav-foot{opacity:1}
.mnav-foot a{color:var(--gold)}
body.menu-on .nav{background:transparent;backdrop-filter:none}
body.menu-on .nav-links .pill{opacity:0;pointer-events:none}
.nav-links .pill{transition:background .4s ease,box-shadow .4s ease,transform .18s ease,color .4s ease,opacity .3s ease}

@media(max-width:880px){
  .burger{display:block}
  .nav{padding-top:14px;padding-bottom:14px}
  .nav.stuck{padding-top:10px;padding-bottom:10px}
  .brand{font-size:15px;letter-spacing:.16em;position:relative;z-index:2;gap:8px}
  .brand img{width:21px;height:21px}
  .nav-links{gap:10px}
  .nav-links .pill{padding:11px 18px;font-size:10px;letter-spacing:.14em}
  main{padding-left:0}

  /* the shader is the hero's whole point — give it room, and lift the veil */
  .hero{padding-top:104px;padding-bottom:52px}
  .hero-veil{background:linear-gradient(178deg,rgba(11,7,5,.90) 6%,rgba(11,7,5,.42) 34%,
    rgba(11,7,5,.60) 62%,rgba(11,7,5,.94) 92%)}
  .hero-grid{gap:30px}
  .vial-wrap{order:-1}
  .vial{width:min(150px,40vw)}
  .hero h1{margin:16px 0 20px}
  .lede{font-size:16px;line-height:1.68}
  .cta-row{margin-top:26px;gap:11px;flex-direction:column;align-items:stretch}
  .cta-row .pill{width:100%;padding:17px 26px}
  .scroll-cue{margin-top:34px}

  section{padding:74px var(--gut);scroll-margin-top:64px}
  .head{margin-bottom:34px}
  .head h2{max-width:none}
  .figures{margin-top:44px;gap:28px 20px}
  .fig b{font-size:clamp(36px,11vw,50px)}
  .fig>span{font-size:10px;letter-spacing:.18em;margin-top:10px}

  .pair li{font-size:14.5px;padding:13px 0}
  .stp h3{font-size:20px}
  .canvas-hold{margin-top:34px}
  .cap-row{gap:14px}
  .cap{font-size:10px;letter-spacing:.14em}
  .swarm-hold{max-width:330px}
  .delta-line strong{font-size:clamp(56px,17vw,84px)}
  .vq p{font-size:clamp(22px,6vw,30px);max-width:none}
  summary{font-size:20px;padding-right:44px}
  details .ans{font-size:15.5px}
  .varr{width:48px;height:48px}
  .dots button{width:26px;height:3px}
  .foot{flex-direction:column;gap:20px}
}

@media(max-width:560px){
  .drow{padding:18px 0}
  .drow h3{font-size:21px}
  .drow p{font-size:14.5px}
  .tript{gap:40px}
  .tript figcaption{font-size:12.5px;margin-top:16px}
}

/* the modal becomes a bottom sheet on phones */
@media(max-width:620px){
  .modal{padding:0;place-items:end center}
  .sheet{width:100%;border-radius:20px 20px 0 0;border-bottom:0;
    padding:30px 24px calc(30px + env(safe-area-inset-bottom));
    transform:translateY(100%);max-height:92vh;overflow-y:auto}
  .modal.open .sheet{transform:none}
  .sheet::before{content:"";position:absolute;top:10px;left:50%;transform:translateX(-50%);
    width:38px;height:4px;border-radius:4px;background:rgba(240,228,210,.24)}
  .sheet h3{font-size:29px}
  .x-btn{top:18px;right:16px}
  .field input{font-size:16px}   /* 16px stops iOS zooming the page on focus */
}

footer.site{padding:clamp(40px,5vw,64px) var(--gut) clamp(48px,6vw,76px)}
.foot{max-width:var(--maxw);margin:0 auto;display:flex;flex-wrap:wrap;gap:30px;justify-content:space-between;align-items:flex-start}
.foot p{max-width:62ch;font-size:12px;line-height:1.95;color:rgba(240,228,210,.32);font-weight:200}
.foot .mk{font-family:var(--display);font-size:15px;letter-spacing:.2em;color:var(--faint)}

/* ══════════════════════════════════════════════════════════
   MULTI-PAGE ADDITIONS
   ══════════════════════════════════════════════════════════ */

/* ── current page marker ── */
.nav-links a[aria-current="page"]{color:var(--gold)}
.mnav nav a[aria-current="page"]{color:var(--gold)}

/* ── interior page header ── */
.phead{padding:clamp(146px,19vh,224px) var(--gut) clamp(58px,7.5vw,104px);position:relative;overflow:hidden;
  background:
    radial-gradient(120% 100% at 78% 0%,rgba(201,135,31,.19),transparent 60%),
    radial-gradient(90% 90% at 8% 100%,rgba(138,90,18,.13),transparent 62%),
    linear-gradient(180deg,var(--ember-2),var(--void))}
.phead .inner{max-width:var(--maxw);margin:0 auto}
.phead .label{display:block;margin-bottom:clamp(20px,2.4vw,30px)}
.phead h1{font-size:clamp(40px,6.6vw,92px);max-width:15ch}
.phead .lede{margin-top:clamp(24px,3vw,36px);max-width:56ch;font-size:clamp(16px,1.4vw,19.5px)}

/* ── hub index cards ── */
.hub{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1px;
  margin-top:clamp(44px,5.5vw,80px);background:rgba(239,198,112,.15);
  border:1px solid rgba(239,198,112,.15)}
@media(max-width:900px){.hub{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:560px){.hub{grid-template-columns:1fr}}
.hub a{display:flex;flex-direction:column;padding:clamp(26px,3.2vw,42px);background:var(--void);
  transition:background .55s ease}
.hub a:hover{background:var(--ember)}
.hub .n{font-size:11px;letter-spacing:.3em;color:var(--gold);font-weight:400}
.hub h3{margin:clamp(18px,2vw,26px) 0 14px;font-size:clamp(21px,2vw,27px)}
.hub p{color:var(--faint);font-size:15px;line-height:1.66;flex:1}
.hub .go{display:inline-flex;align-items:center;gap:10px;margin-top:clamp(20px,2.4vw,28px);
  font-size:10.5px;letter-spacing:.24em;text-transform:uppercase;color:var(--gold)}
.hub .go::after{content:"";width:16px;height:1px;background:var(--gold);transition:width .45s var(--E)}
.hub a:hover .go::after{width:30px}

/* ── record rows (patents, trials) ── */
.recs{margin-top:clamp(38px,4.6vw,66px);border-top:1px solid rgba(239,198,112,.18)}
.rec{display:grid;grid-template-columns:168px minmax(0,1fr) 132px;gap:clamp(16px,2.8vw,42px);
  padding:clamp(24px,2.8vw,34px) 0;border-bottom:1px solid rgba(239,198,112,.16);align-items:start}
@media(max-width:840px){.rec{grid-template-columns:1fr;gap:12px}}
.rec .num{font-family:var(--display);font-size:clamp(17px,1.6vw,20px);color:var(--gold);
  letter-spacing:.02em;font-variant-numeric:tabular-nums;line-height:1.35}
.rec .num small{display:block;font-family:var(--body);font-size:10px;letter-spacing:.26em;
  text-transform:uppercase;color:var(--faint);margin-top:8px}
.rec h3{font-size:clamp(17.5px,1.7vw,22px);line-height:1.34;font-weight:400}
.rec .meta{font-size:13.5px;color:var(--faint);line-height:1.7;margin-top:12px;max-width:62ch}
.rec .when{font-size:12px;letter-spacing:.14em;text-transform:uppercase;color:var(--faint);
  text-align:right;line-height:1.9}
@media(max-width:840px){.rec .when{text-align:left}}
.rec .core{display:inline-block;margin-top:12px;font-size:10px;letter-spacing:.22em;text-transform:uppercase;
  color:var(--gold);border:1px solid rgba(239,198,112,.34);border-radius:100px;padding:5px 13px}

/* ── publications ── */
.pubgrp{margin-top:clamp(44px,5vw,72px)}
.pubgrp>.label{display:block;margin-bottom:6px}
.pubs{border-top:1px solid rgba(239,198,112,.16);margin-top:22px}
.pub{display:grid;grid-template-columns:34px minmax(0,1fr) auto;gap:clamp(14px,2.2vw,32px);
  padding:clamp(19px,2.1vw,26px) 0;border-bottom:1px solid rgba(239,198,112,.12);align-items:baseline;
  transition:background .5s ease}
.pub:hover{background:linear-gradient(90deg,rgba(239,198,112,.07),transparent 60%)}
@media(max-width:700px){.pub{grid-template-columns:26px minmax(0,1fr);gap:12px}}
.pub .n{font-family:var(--display);font-size:14px;color:var(--gold);font-variant-numeric:tabular-nums}
.pub h4{margin:0;font-family:var(--display);font-size:clamp(17px,1.65vw,21px);font-weight:400;
  line-height:1.36;color:var(--cream)}
.pub .src{display:block;margin-top:9px;font-size:12.5px;letter-spacing:.04em;color:var(--faint);font-style:italic}
.pub .doc{font-size:10px;letter-spacing:.2em;text-transform:uppercase;color:var(--gold);white-space:nowrap;
  border-bottom:1px solid rgba(239,198,112,.3);padding-bottom:3px;transition:border-color .4s,color .4s}
.pub .doc:hover{color:var(--gold-hi);border-color:var(--gold)}
@media(max-width:700px){.pub .doc{grid-column:2;margin-top:12px;justify-self:start}}

/* ── callout / disclosure ── */
.callout{margin-top:clamp(48px,6vw,84px);padding:clamp(28px,3.6vw,50px);
  border:1px solid rgba(239,198,112,.24);
  background:linear-gradient(180deg,rgba(239,198,112,.055),rgba(239,198,112,.012))}
.callout .label{display:block;margin-bottom:clamp(18px,2vw,24px)}
.callout h3{font-size:clamp(22px,2.4vw,32px);margin-bottom:20px}
.callout p{color:var(--dim);font-size:16px;line-height:1.78;max-width:78ch}
.callout p+p{margin-top:15px}

/* ── team ── */
.team{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1px;
  background:rgba(239,198,112,.13);border:1px solid rgba(239,198,112,.13);
  margin-top:clamp(38px,4.6vw,66px)}
@media(max-width:900px){.team{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:560px){.team{grid-template-columns:1fr}}
.team div{background:var(--void);padding:clamp(24px,2.8vw,36px)}
.team b{display:block;font-family:var(--display);font-size:clamp(19px,1.8vw,23px);font-weight:400;
  color:var(--cream);line-height:1.3}
.team .role{display:block;margin:11px 0 16px;font-size:10.5px;letter-spacing:.24em;
  text-transform:uppercase;color:var(--gold)}
.team p{color:var(--faint);font-size:14.5px;line-height:1.7}

/* ── offices ── */
.offices{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(28px,3.6vw,56px);
  margin-top:clamp(38px,4.6vw,66px)}
@media(max-width:820px){.offices{grid-template-columns:repeat(2,minmax(0,1fr));gap:36px}}
@media(max-width:520px){.offices{grid-template-columns:1fr}}
.offices div span{display:block;font-size:10.5px;letter-spacing:.3em;text-transform:uppercase;
  color:var(--gold);margin-bottom:14px}
.offices div p{font-size:15.5px;color:var(--dim);line-height:1.75}
.offices div a{color:var(--dim);transition:color .4s}
.offices div a:hover{color:var(--gold)}

/* ── plain symptom / marker grid ── */
.syms{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:1px;
  background:rgba(239,198,112,.13);border:1px solid rgba(239,198,112,.13);
  margin-top:clamp(38px,4.6vw,66px)}
@media(max-width:820px){.syms{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:440px){.syms{grid-template-columns:1fr}}
.syms div{background:var(--void);padding:clamp(22px,2.6vw,32px)}
.syms b{display:block;font-family:var(--display);font-size:clamp(18px,1.7vw,22px);font-weight:400;
  color:var(--cream);margin-bottom:12px}
.syms p{color:var(--faint);font-size:14.5px;line-height:1.68}

/* ── prose column ── */
.prose{max-width:70ch;margin:0 auto}
.prose p{color:var(--dim);font-size:17px;line-height:1.82}
.prose p+p{margin-top:22px}
.prose h3{margin:clamp(40px,4.6vw,64px) 0 20px}

/* ── next-page pager ── */
.pager{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1px;
  background:rgba(239,198,112,.15);border-top:1px solid rgba(239,198,112,.15)}
@media(max-width:640px){.pager{grid-template-columns:1fr}}
.pager a{background:var(--void);padding:clamp(30px,3.6vw,52px) var(--gut);transition:background .55s ease}
.pager a:hover{background:var(--ember)}
.pager span{display:block;font-size:10.5px;letter-spacing:.28em;text-transform:uppercase;color:var(--gold);
  margin-bottom:16px}
.pager b{font-family:var(--display);font-size:clamp(24px,2.6vw,34px);font-weight:300;color:var(--cream)}
.pager p{margin-top:12px;color:var(--faint);font-size:15px;max-width:44ch}

/* ── footer navigation ── */
.foot-nav{max-width:var(--maxw);margin:0 auto clamp(38px,4.6vw,60px);display:grid;
  grid-template-columns:1.5fr repeat(3,minmax(0,1fr));gap:clamp(26px,3.8vw,58px)}
@media(max-width:900px){.foot-nav{grid-template-columns:repeat(2,minmax(0,1fr));gap:36px}}
@media(max-width:480px){.foot-nav{grid-template-columns:1fr;gap:32px}}
.foot-nav h4{font-size:10.5px;letter-spacing:.3em;text-transform:uppercase;color:var(--gold);
  font-family:var(--body);font-weight:400;margin:0 0 18px}
.foot-nav a{display:block;font-size:14.5px;color:var(--faint);padding:6px 0;transition:color .4s;font-weight:300}
.foot-nav a:hover{color:var(--cream)}
.foot-nav p{font-size:14.5px;color:var(--faint);line-height:1.8;font-weight:300}
.foot-brand{display:inline-flex;align-items:center;gap:11px;font-family:var(--display);font-size:19px;
  letter-spacing:.2em;color:var(--cream);margin-bottom:20px}
.foot-brand img{width:24px;height:24px;display:block;flex:none}
.foot-sep{height:1px;max-width:var(--maxw);margin:0 auto clamp(28px,3.4vw,42px);
  background:linear-gradient(90deg,transparent,rgba(239,198,112,.24),transparent)}
.rec h3 a{border-bottom:1px solid rgba(239,198,112,.30);padding-bottom:2px;
  transition:color .4s ease,border-color .4s ease}
.rec h3 a:hover{color:var(--gold);border-color:var(--gold)}