/* Ternary Cosmos — ternarycosmos.com
   System: two dark grounds (black, dark grey) with terracotta as the single accent.
   Type: Fraunces at a regular weight for display, Barlow for reading, DM Mono for lab labels.
   Motif: three bodies sharing one figure-eight orbit; a small terracotta square marks every label. */
@font-face{font-family:"Fraunces";src:url("fonts/fraunces.woff2") format("woff2");font-weight:300 900;font-style:normal;font-display:swap}
@font-face{font-family:"Fraunces";src:url("fonts/fraunces-italic.woff2") format("woff2");font-weight:600 900;font-style:italic;font-display:swap}
@font-face{font-family:"Barlow";src:url("fonts/barlow-400.woff2") format("woff2");font-weight:400;font-style:normal;font-display:swap}
@font-face{font-family:"Barlow";src:url("fonts/barlow-500.woff2") format("woff2");font-weight:500;font-style:normal;font-display:swap}
@font-face{font-family:"Barlow";src:url("fonts/barlow-600.woff2") format("woff2");font-weight:600;font-style:normal;font-display:swap}
@font-face{font-family:"DM Mono";src:url("fonts/dm-mono-400.woff2") format("woff2");font-weight:400;font-style:normal;font-display:swap}
@font-face{font-family:"DM Mono";src:url("fonts/dm-mono-500.woff2") format("woff2");font-weight:500;font-style:normal;font-display:swap}

:root{
  color-scheme:dark;
  --black:#111110;
  --grey:#1B1A19;
  --raise:#252422;
  --text:#F3F0EC;
  --body:#CCC7C1;
  --sub:#9B958E;
  --rule:rgba(255,255,255,.13);
  --terra:#CA6544;
  --terra-text:#DD7E5F;
  --display:"Fraunces",Georgia,"Times New Roman",serif;
  --sans:"Barlow","Helvetica Neue",Arial,sans-serif;
  --mono:"DM Mono",ui-monospace,Menlo,monospace;
  --gut:clamp(20px,4.6vw,68px);
  --max:1320px;
  --edge:max(var(--gut),calc((100vw - var(--max)) / 2 + var(--gut)));
  --hdr:clamp(80px,8.4vw,104px);
  --mk:clamp(42px,3.6vw,48px);
  --ease:cubic-bezier(.2,.7,.1,1);
}
@view-transition{navigation:auto}

*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}
body{margin:0;background:var(--black);color:var(--body);font-family:var(--sans);font-size:17.5px;line-height:1.7;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}
h1,h2,h3,p,ol,ul,dl,dd,figure{margin:0}
ol,ul{padding:0;list-style:none}
a{color:inherit;text-decoration:none}
button{font:inherit;color:inherit;background:none;border:0;padding:0;cursor:pointer}
svg{display:block}
:focus-visible{outline:1.5px solid var(--terra-text);outline-offset:4px}
::selection{background:var(--terra);color:#fff}

[data-tone="black"]{background:var(--black)}
[data-tone="grey"]{background:var(--grey)}
.wrap{max-width:var(--max);margin-inline:auto;padding-inline:var(--gut)}
.sec{padding-block:clamp(80px,10vw,152px)}
.split{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:32px clamp(40px,7vw,112px)}
.split>.label{align-self:start;padding-top:.7em}
.split.even{grid-template-columns:minmax(0,6fr) minmax(0,6fr)}

/* type */
.d-xl,.d-l,.d-m,.serif{font-family:var(--display);font-variation-settings:"SOFT" 100,"WONK" 0;font-optical-sizing:auto;color:var(--text);text-wrap:balance}
.d-xl{font-weight:400;font-size:clamp(2.7rem,6.2vw,5.6rem);line-height:1.04;letter-spacing:-.024em}
.d-l{font-weight:400;font-size:clamp(2.05rem,3.9vw,3.5rem);line-height:1.1;letter-spacing:-.02em}
.d-m{font-weight:450;font-size:clamp(1.4rem,2.1vw,1.8rem);line-height:1.25;letter-spacing:-.012em}
.label{font-family:var(--mono);font-size:.7rem;line-height:1.5;font-weight:400;letter-spacing:.14em;text-transform:uppercase;color:var(--sub);display:flex;align-items:center;gap:.95em}
.label::before{content:"";flex:none;width:.62em;height:.62em;background:var(--terra)}
.lede{font-size:clamp(1.06rem,1.3vw,1.2rem);line-height:1.7;max-width:34em}
.btn{display:inline-flex;align-items:center;gap:.9em;font-weight:500;font-size:.95rem;line-height:1;letter-spacing:.01em;padding:1em 1.4em;color:var(--text);box-shadow:inset 0 0 0 1px rgba(255,255,255,.34);transition:box-shadow .3s,background .3s,gap .35s var(--ease)}
.btn::after{content:"\2192";font-family:var(--mono);font-weight:400;color:var(--terra-text)}
.btn:hover{box-shadow:inset 0 0 0 1px var(--terra);gap:1.2em}
.btn.solid{background:var(--terra);box-shadow:none;color:#fff}
.btn.solid::after{color:#fff}
.btn.solid:hover{background:#B85A3B}
.more{display:inline-flex;gap:.7em;align-items:center;font-family:var(--mono);font-size:.72rem;letter-spacing:.13em;text-transform:uppercase;color:var(--text);padding-bottom:6px;border-bottom:1px solid rgba(255,255,255,.34);transition:border-color .3s}
.more::after{content:"\2192";color:var(--terra-text)}
.more:hover{border-color:var(--terra)}

/* header */
.hdr{position:absolute;inset:0 0 auto 0;z-index:5;padding-top:env(safe-area-inset-top,0px)}
.hdr .wrap{display:flex;align-items:center;justify-content:space-between;height:var(--hdr)}
.logo{display:block;color:var(--text)}
.logo svg{height:clamp(32px,3vw,38px);width:auto;fill:currentColor}
.nav{display:flex;gap:clamp(22px,2.8vw,40px);margin-right:calc(var(--mk) + clamp(22px,2.8vw,40px))}
.nav a{font-family:var(--mono);font-size:.72rem;letter-spacing:.14em;text-transform:uppercase;color:var(--sub);padding-block:.5em;transition:color .25s}
.nav a:hover,.nav a[aria-current="page"]{color:var(--text)}
.nav a[aria-current="page"]{box-shadow:0 1px 0 var(--terra)}

/* fixed mark = menu */
.mark{position:fixed;z-index:60;top:calc(env(safe-area-inset-top,0px) + (var(--hdr) - var(--mk)) / 2);right:var(--edge);width:var(--mk);aspect-ratio:1;background:var(--terra);transition:transform .4s var(--ease);view-transition-name:tc-mark}
.mark svg{width:100%;height:100%;fill:#fff}
.mark:hover{transform:scale(1.05)}
.mark-hint{position:fixed;z-index:60;top:calc(env(safe-area-inset-top,0px) + var(--hdr) / 2 - .7em);right:calc(var(--edge) + var(--mk) + 14px);font-family:var(--mono);font-size:.68rem;letter-spacing:.14em;text-transform:uppercase;color:var(--sub);opacity:0;pointer-events:none;transition:opacity .3s}
.menu-open .mark-hint{opacity:1}
.menu{position:fixed;inset:0;z-index:50;background:var(--black);display:flex;flex-direction:column;justify-content:flex-end;padding:calc(env(safe-area-inset-top,0px) + var(--hdr) + 24px) var(--edge) calc(env(safe-area-inset-bottom,0px) + clamp(28px,4vw,48px));opacity:0;visibility:hidden;transition:opacity .4s var(--ease),visibility 0s .4s;overflow:auto}
.menu-open .menu{opacity:1;visibility:visible;transition:opacity .4s var(--ease),visibility 0s}
.menu li a{display:flex;align-items:baseline;gap:clamp(16px,2.4vw,32px);border-top:1px solid var(--rule);padding-block:clamp(14px,2vw,24px);transition:padding-left .45s var(--ease)}
.menu li:last-child a{border-bottom:1px solid var(--rule)}
.menu li a span{font-family:var(--mono);font-size:.72rem;letter-spacing:.12em;color:var(--sub)}
.menu li a b{font-family:var(--display);font-weight:400;font-variation-settings:"SOFT" 100,"WONK" 0;font-size:clamp(2.2rem,5.4vw,4.2rem);line-height:1.05;letter-spacing:-.022em;color:var(--text)}
.menu li a:hover{padding-left:clamp(8px,1.4vw,20px)}
.menu li a[aria-current="page"] span{color:var(--terra-text)}
.menu-foot{display:flex;flex-wrap:wrap;justify-content:space-between;gap:8px 32px;margin-top:clamp(24px,3vw,36px);font-family:var(--mono);font-size:.7rem;letter-spacing:.12em;text-transform:uppercase;color:var(--sub)}

/* hero */
.hero{position:relative;overflow:hidden;min-height:min(100svh,940px);display:flex;flex-direction:column}
.hero-cv{position:absolute;inset:0;width:100%;height:100%}
.hero-in{position:relative;flex:1;width:100%;display:flex;flex-direction:column;padding-top:calc(var(--hdr) + clamp(48px,9vw,132px));padding-bottom:clamp(28px,3.2vw,44px)}
.hero h1{margin-top:clamp(20px,2.4vw,32px)}
.hero .lede{margin-top:clamp(22px,2.6vw,36px);max-width:min(27em,41vw)}
.hero-foot{margin-top:auto;padding-top:clamp(56px,9vw,120px);display:flex;flex-wrap:wrap;justify-content:space-between;align-items:flex-end;gap:20px 48px;border-top:0}
.fig{font-family:var(--mono);font-size:.7rem;line-height:1.7;letter-spacing:.12em;text-transform:uppercase;color:var(--sub)}
.fig b{font-weight:400;color:var(--text)}

/* position */
.pos p.serif{font-weight:400;font-size:clamp(1.55rem,2.9vw,2.5rem);line-height:1.24;letter-spacing:-.016em}
.pos-body{display:flex;flex-direction:column;gap:1.2em;margin-top:clamp(28px,3.4vw,44px);max-width:35em}

/* lab */
.lab-top{display:grid;grid-template-columns:minmax(0,6fr) minmax(0,6fr);gap:32px clamp(40px,7vw,112px);align-items:end}
.lab-top h2{margin-top:clamp(18px,2.2vw,28px)}
.lab-copy{display:flex;flex-direction:column;gap:1.1em}
.scope{position:relative;margin-top:clamp(40px,5vw,68px);border:1px solid var(--rule);background:var(--black);aspect-ratio:16/8;min-height:320px;width:100%}
.scope canvas{position:absolute;inset:0;width:100%;height:100%}
.ro{position:absolute;font-family:var(--mono);font-size:.68rem;letter-spacing:.12em;text-transform:uppercase;color:var(--sub);line-height:1.5;pointer-events:none}
.ro-tl{top:16px;left:18px}.ro-tr{top:16px;right:18px;text-align:right}.ro-bl{bottom:14px;left:18px}.ro-br{bottom:14px;right:18px}
.ro b{font-weight:400;color:var(--text)}
.ro-tr b[data-s="shaken"]{color:#E9A68E}.ro-tr b[data-s="broken"]{color:var(--terra-text)}
.legend{display:flex;gap:18px}
.legend li{display:flex;align-items:center;gap:8px}
.legend li::before{content:"";width:8px;height:8px;border-radius:50%;background:#fff}
.legend .b2::before{background:var(--terra)}
.legend .b3::before{background:transparent;box-shadow:inset 0 0 0 1.5px #fff}
.ctl{display:grid;grid-template-columns:minmax(0,6fr) minmax(0,6fr);gap:20px clamp(40px,7vw,112px);align-items:start;margin-top:clamp(24px,3vw,36px)}
.ctl-l label{display:flex;justify-content:space-between;align-items:baseline;gap:16px;font-weight:500;color:var(--text)}
.ctl-l output{font-family:var(--mono);font-weight:400;font-size:1.15rem;font-variant-numeric:tabular-nums;color:var(--terra-text)}
.ctl-ends{display:flex;justify-content:space-between;font-family:var(--mono);font-size:.66rem;letter-spacing:.12em;text-transform:uppercase;color:var(--sub);margin-top:4px}
input[type="range"]{-webkit-appearance:none;appearance:none;width:100%;height:32px;background:transparent;margin:8px 0 0;cursor:pointer;--p:0%}
input[type="range"]::-webkit-slider-runnable-track{height:1px;background:linear-gradient(to right,var(--terra) var(--p),rgba(255,255,255,.32) var(--p))}
input[type="range"]::-moz-range-track{height:1px;background:rgba(255,255,255,.32)}
input[type="range"]::-moz-range-progress{height:1px;background:var(--terra)}
input[type="range"]::-webkit-slider-thumb{-webkit-appearance:none;width:16px;height:16px;background:var(--terra);border:0;border-radius:0;margin-top:-8px;box-shadow:0 0 0 6px var(--grey)}
input[type="range"]::-moz-range-thumb{width:16px;height:16px;background:var(--terra);border:0;border-radius:0}
.ctl-r{display:flex;flex-direction:column;gap:18px;align-items:flex-start}
.ctl-r p{min-height:3.4em;color:var(--text)}
.ctl-r p b{font-family:var(--mono);font-weight:400;font-size:.68rem;letter-spacing:.14em;text-transform:uppercase;color:var(--terra-text);display:block;margin-bottom:.35em}
.note{margin-top:clamp(32px,4vw,52px);padding-top:18px;border-top:1px solid var(--rule);font-size:.86rem;line-height:1.65;color:var(--sub);max-width:64em}

/* phase rows */
.sec-head{display:grid;grid-template-columns:minmax(0,6fr) minmax(0,6fr);gap:24px clamp(40px,7vw,112px);align-items:end;margin-bottom:clamp(36px,4.4vw,60px)}
.sec-head h2{margin-top:clamp(18px,2.2vw,28px)}
.rows{border-bottom:1px solid var(--rule)}
.row{display:grid;grid-template-columns:3.4rem minmax(0,5fr) minmax(0,6fr) 2rem;gap:0 clamp(16px,2.4vw,36px);align-items:baseline;padding:clamp(24px,2.8vw,36px) 0;border-top:1px solid var(--rule);transition:background .35s,padding .45s var(--ease)}
.row:hover,.row:focus-visible{background:rgba(255,255,255,.028);padding-inline:clamp(10px,1.4vw,20px)}
.row-n{font-family:var(--mono);font-size:.74rem;letter-spacing:.12em;color:var(--sub)}
.row-t{display:flex;flex-direction:column;gap:.5em}
.row-t em{font-style:normal;font-family:var(--mono);font-size:.68rem;letter-spacing:.14em;text-transform:uppercase;color:var(--sub);display:flex;flex-wrap:wrap;gap:.6em 1.2em;align-items:center}
.core{font-family:var(--mono);font-size:.62rem;letter-spacing:.14em;text-transform:uppercase;line-height:1;padding:.5em .65em;color:var(--terra-text);box-shadow:inset 0 0 0 1px var(--terra)}
.row-d{max-width:32em}
.row-a{font-family:var(--mono);justify-self:end;color:var(--sub);transition:color .3s,transform .45s var(--ease)}
.row:hover .row-a{color:var(--terra-text);transform:translateX(4px)}
.result{display:flex;flex-wrap:wrap;align-items:baseline;gap:10px 28px;margin-top:clamp(26px,3vw,40px)}

/* decline */
.plain li{border-top:1px solid var(--rule);padding-block:clamp(14px,1.6vw,20px);display:grid;grid-template-columns:3.4rem minmax(0,1fr);align-items:baseline}
.plain li:last-child{border-bottom:1px solid var(--rule)}
.plain li span{font-family:var(--mono);font-size:.72rem;letter-spacing:.12em;color:var(--sub)}
.plain li b{font-family:var(--display);font-weight:400;font-variation-settings:"SOFT" 100,"WONK" 0;font-size:clamp(1.25rem,1.9vw,1.6rem);letter-spacing:-.012em;line-height:1.3;color:var(--text)}
.decline-l{display:flex;flex-direction:column;align-items:flex-start;gap:clamp(20px,2.4vw,32px)}

/* contact + card */
.reach-copy{display:flex;flex-direction:column;align-items:flex-start;gap:clamp(20px,2.4vw,30px)}
.mail{display:flex;flex-wrap:wrap;align-items:center;gap:12px 18px}
.addr{font-family:var(--display);font-weight:400;font-variation-settings:"SOFT" 100,"WONK" 0;font-size:clamp(1.2rem,1.9vw,1.6rem);letter-spacing:-.01em;color:var(--text);user-select:all;overflow-wrap:anywhere;min-width:0;border-bottom:1px solid var(--terra)}
.copy{font-family:var(--mono);font-size:.68rem;letter-spacing:.13em;text-transform:uppercase;padding:.8em 1em;box-shadow:inset 0 0 0 1px rgba(255,255,255,.34);color:var(--text);transition:box-shadow .25s}
.copy:hover{box-shadow:inset 0 0 0 1px var(--terra)}
.card-stage{container-type:inline-size;width:100%;max-width:600px;justify-self:end;align-self:center}
.bcard{position:relative;display:block;width:100%;aspect-ratio:1270/700;background:#fff;border-radius:1.4cqw;color:#393939}
.bcard-mark{position:absolute;top:4.6%;right:2.6%;width:14.2%;aspect-ratio:1;background:var(--terra)}
.bcard-mark svg{width:100%;height:100%;fill:#fff}
.bcard-wm{position:absolute;left:5.6%;top:41.5%;display:inline-flex;flex-direction:column;align-items:flex-end;font-family:var(--display);font-weight:900;font-variation-settings:"SOFT" 100,"WONK" 0;font-size:8.05cqw;line-height:1;letter-spacing:-.045em;color:var(--terra);white-space:nowrap}
.bcard-wm span{font-weight:300;font-size:.3em;letter-spacing:-.02em;color:#393939;margin-top:-.02em}
.bcard-ct{position:absolute;right:5.2%;bottom:8%;display:flex;flex-direction:column;align-items:flex-end;font-family:var(--display);font-variation-settings:"SOFT" 100,"WONK" 0;line-height:1.35;white-space:nowrap}
.bcard-ct b{font-weight:500;font-size:2.55cqw;color:#111}
.bcard-ct span{font-weight:400;font-size:2.05cqw}

/* signature footer */
.sig{padding-block:clamp(96px,12vw,176px) calc(env(safe-area-inset-bottom,0px) + 28px);border-top:1px solid var(--rule)}
.sig-stage{display:flex;flex-direction:column;align-items:center;text-align:center}
.sig-play{width:clamp(64px,6vw,80px);aspect-ratio:1;background:var(--terra);transition:transform .5s var(--ease)}
.sig-play svg{width:100%;height:100%;fill:#fff}
.sig-play:hover{transform:scale(1.04)}
.sig-play.playing{animation:sigin 2.1s var(--ease)}
@keyframes sigin{0%{transform:scale(.82);opacity:0}22%{transform:scale(1);opacity:1}100%{transform:scale(1)}}
.sig-line{margin-top:20px;font-family:var(--display);font-weight:400;font-variation-settings:"SOFT" 100,"WONK" 0;font-size:1rem;color:var(--text)}
.sig-line b{font-weight:800;letter-spacing:-.03em}
.sig-hint{margin-top:clamp(32px,4vw,48px);font-family:var(--mono);font-size:.66rem;letter-spacing:.13em;text-transform:uppercase;color:var(--sub)}
.sig-foot{margin-top:clamp(80px,10vw,144px);padding-top:22px;border-top:1px solid var(--rule);display:flex;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:14px 32px;font-family:var(--mono);font-size:.68rem;letter-spacing:.12em;text-transform:uppercase;color:var(--sub)}
.sig-foot nav{display:flex;flex-wrap:wrap;gap:8px 24px}
.sig-foot a:hover{color:var(--text)}

/* inner page heads */
.phead{position:relative;padding-block:calc(var(--hdr) + clamp(48px,8vw,120px)) clamp(64px,8vw,112px)}
.phead h1{margin-top:clamp(20px,2.4vw,32px)}
.phead-foot{display:grid;grid-template-columns:minmax(0,6fr) minmax(0,6fr);gap:24px clamp(40px,7vw,112px);margin-top:clamp(36px,5vw,64px)}
.fig8{width:100%;height:auto;margin-top:clamp(40px,6vw,80px);overflow:visible}
.fig8 .p{fill:none;stroke:rgba(255,255,255,.3);stroke-width:1;vector-effect:non-scaling-stroke}
.fig8 circle{fill:#fff}
.fig8 .c2{fill:var(--terra)}
.fig8 .c3{fill:var(--black);stroke:#fff;stroke-width:1.5;vector-effect:non-scaling-stroke}
.fig8-k{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));margin-top:16px;font-family:var(--mono);font-size:.7rem;letter-spacing:.13em;text-transform:uppercase;color:var(--sub)}
.fig8-k span:nth-child(2){text-align:center;color:var(--terra-text)}
.fig8-k span:nth-child(3){text-align:right}

/* approach bands */
.band{padding-block:clamp(72px,9vw,128px);border-top:1px solid var(--rule)}
.band-n{font-family:var(--mono);font-size:.72rem;letter-spacing:.14em;text-transform:uppercase;color:var(--sub);display:flex;flex-wrap:wrap;align-items:center;gap:.6em 1.2em}
.band h2{margin-top:clamp(16px,2vw,24px)}
.band-en{margin-top:14px;font-family:var(--mono);font-size:.7rem;letter-spacing:.14em;text-transform:uppercase;color:var(--sub)}
.band-body{display:flex;flex-direction:column;gap:1.2em}
.band-body>p:first-child{font-family:var(--display);font-weight:400;font-variation-settings:"SOFT" 100,"WONK" 0;font-size:clamp(1.3rem,2vw,1.7rem);line-height:1.32;letter-spacing:-.012em;color:var(--text)}
.items{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0 clamp(24px,3vw,48px);margin-top:clamp(14px,1.8vw,24px);border-top:1px solid rgba(255,255,255,.34)}
.items div{padding-block:18px;border-bottom:1px solid var(--rule)}
.items dt{font-weight:600;font-size:1.02rem;color:var(--text)}
.items dd{font-size:.95rem;line-height:1.55;color:var(--sub);margin-top:4px}
.cta{display:grid;grid-template-columns:minmax(0,6fr) minmax(0,6fr);gap:32px clamp(40px,7vw,112px);align-items:end}
.cta h2{margin-top:clamp(18px,2.2vw,28px)}
.cta-r{display:flex;flex-direction:column;align-items:flex-start;gap:24px}

/* standard */
.shead{display:grid;grid-template-columns:minmax(0,7fr) minmax(0,5fr);gap:40px clamp(40px,7vw,112px);align-items:end}
.shead h1{margin-top:clamp(20px,2.4vw,32px)}
.shead .lede{margin-top:clamp(22px,2.6vw,36px)}
.toc{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));border-top:1px solid var(--rule);border-left:1px solid var(--rule)}
.toc a{display:flex;flex-direction:column;justify-content:space-between;gap:clamp(18px,2.6vw,36px);padding:clamp(10px,1.1vw,14px);border-right:1px solid var(--rule);border-bottom:1px solid var(--rule);transition:background .3s}
.toc a b{font-family:var(--mono);font-weight:400;font-size:.7rem;letter-spacing:.12em;color:var(--terra-text)}
.toc a span{font-size:.9rem;line-height:1.3;color:var(--body);transition:color .3s}
.toc a:hover,.toc a:focus-visible{background:rgba(255,255,255,.04)}
.toc a:hover span{color:var(--text)}
.preamble{padding-bottom:clamp(56px,7vw,96px)}
.preamble div p{font-family:var(--display);font-weight:400;font-variation-settings:"SOFT" 100,"WONK" 0;font-size:clamp(1.35rem,2.3vw,1.95rem);line-height:1.3;letter-spacing:-.014em;color:var(--text)}
.preamble div p+p{margin-top:.8em}
.chapter{border-top:1px solid rgba(255,255,255,.34);padding-block:clamp(32px,3.6vw,52px) clamp(48px,6vw,88px)}
.ch-head{position:sticky;top:calc(env(safe-area-inset-top,0px) + 32px);align-self:start;display:flex;flex-direction:column;gap:14px}
.arts li{display:grid;grid-template-columns:clamp(4rem,7vw,6rem) minmax(0,1fr);gap:0 clamp(12px,2vw,24px);align-items:baseline;padding-block:clamp(20px,2.4vw,30px);border-bottom:1px solid var(--rule);scroll-margin-top:28px}
.arts li:first-child{padding-top:0}
.arts li:last-child{border-bottom:0;padding-bottom:0}
.art-n{font-family:var(--mono);font-size:.72rem;letter-spacing:.12em;text-transform:uppercase;color:var(--terra-text)}
.art p{margin-top:.45em;max-width:36em}
.addendum{border-top:1px solid rgba(255,255,255,.34);padding-top:24px}
.addendum p:not(.label){color:var(--text);max-width:36em}
.facts{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:0 clamp(24px,3vw,48px);margin-top:clamp(48px,6vw,80px)}
.facts div{border-top:1px solid rgba(255,255,255,.34);padding-top:16px;display:flex;flex-direction:column;gap:8px}
.facts dt{font-family:var(--mono);font-size:.68rem;letter-spacing:.14em;text-transform:uppercase;color:var(--sub)}
.facts dd{font-family:var(--display);font-weight:400;font-variation-settings:"SOFT" 100,"WONK" 0;font-size:clamp(1.15rem,1.7vw,1.4rem);line-height:1.3;color:var(--text);overflow-wrap:anywhere}

/* contact page */
.asks{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(28px,3.4vw,52px);margin-top:clamp(32px,4vw,56px)}
.asks li{border-top:1px solid rgba(255,255,255,.34);padding-top:18px;display:flex;flex-direction:column;gap:10px}
.ask-n{font-family:var(--mono);font-size:.72rem;letter-spacing:.12em;color:var(--terra-text)}

/* 404 */
.lost{min-height:100svh}
.lost .hero-in{justify-content:center;align-items:flex-start;gap:clamp(18px,2.2vw,28px)}
.lost h1,.lost .lede{margin-top:0}

@media (max-width:900px){
  body{font-size:16.5px}
  .nav{display:none}
  .hero .lede{max-width:34em}
  .hero-foot{padding-top:clamp(150px,44vw,300px)}
  .lost .hero-in{justify-content:flex-start}
  .split,.split.even,.lab-top,.ctl,.sec-head,.phead-foot,.shead,.cta{grid-template-columns:minmax(0,1fr)}
  .split>.label{padding-top:0}
  .scope{aspect-ratio:auto;height:min(54svh,340px);min-height:0}
  .ro-tl{display:none}
  .ro-br{left:18px;right:auto;bottom:38px}
  .row{grid-template-columns:2.6rem minmax(0,1fr) 1.4rem;row-gap:12px}
  .row-d{grid-column:2/-1;grid-row:2}
  .row-a{grid-column:3;grid-row:1}
  .ch-head{position:static}
  .card-stage{justify-self:start}
  .asks,.facts{grid-template-columns:minmax(0,1fr)}
  .facts div{margin-bottom:26px}
  .toc{max-width:520px}
}
@media (max-width:560px){
  .items{grid-template-columns:minmax(0,1fr)}
  .legend{gap:12px}
}
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *,*::before,*::after{transition-duration:.01ms!important;animation-duration:.01ms!important}
}

/* home: name-led hero, pillars */
.hero{min-height:0}
.hero-in{padding-bottom:clamp(72px,9vw,128px)}
.hero-wm{margin-top:clamp(28px,3.4vw,48px)}
.hero-wm svg{width:min(100%,clamp(240px,36vw,500px));height:auto;fill:var(--text)}
.hero-tag{margin-top:clamp(32px,4vw,56px)}
.hero .lede{max-width:34em;margin-top:14px}
.pillars{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(36px,4vw,64px);margin-top:clamp(64px,8vw,112px)}
.pillar h3{margin-top:14px}
.items.one{grid-template-columns:minmax(0,1fr);margin-top:clamp(20px,2.4vw,30px)}
.ask-n{text-transform:uppercase;letter-spacing:.14em}
@media (max-width:900px){.pillars{grid-template-columns:minmax(0,1fr)}}

/* pillars v2: stacked, title-led */
.pillars{display:block;margin-top:clamp(56px,7vw,96px);border-bottom:1px solid var(--rule)}
.pillar{display:grid;grid-template-columns:3.4rem minmax(0,1fr);gap:0 clamp(16px,2.4vw,36px);padding-block:clamp(32px,4vw,52px);border-top:1px solid var(--rule)}
.pillar .row-n{padding-top:clamp(.9rem,1.6vw,1.6rem)}
.pillar-t{font-family:var(--display);font-weight:600;font-variation-settings:"SOFT" 100,"WONK" 0;font-size:clamp(3rem,7.4vw,6.4rem);line-height:.98;letter-spacing:-.03em;color:var(--text)}
.pillar-s{font-family:var(--display);font-style:italic;font-weight:700;font-size:clamp(1.5rem,3.2vw,2.7rem);line-height:1.1;color:var(--terra);margin-top:.15em}
.pillar-i{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px clamp(32px,5vw,80px);margin-top:clamp(22px,2.6vw,34px)}
.pillar-i dt{font-weight:600;color:var(--text);font-size:1.02rem}
.pillar-i dd{color:var(--sub);font-size:.95rem;line-height:1.5;margin-top:2px}
.plain-foot{padding-top:0;border-top:1px solid var(--rule)}
.plain-foot .sig-foot{margin-top:0;border-top:0;padding-top:26px}
@media (max-width:560px){.pillar-i{grid-template-columns:minmax(0,1fr)}.pillar{grid-template-columns:2.4rem minmax(0,1fr)}}

/* ================= design pass: atmosphere, motion, interaction ================= */
body::after{content:"";position:fixed;inset:0;z-index:70;pointer-events:none;opacity:.055;mix-blend-mode:overlay;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='220' height='220'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='220' height='220' filter='url(%23n)'/%3E%3C/svg%3E")}
.progress{position:fixed;top:0;left:0;right:0;height:2px;background:var(--terra);transform:scaleX(0);transform-origin:0 50%;z-index:80;pointer-events:none}

/* hero */
.hero.cosmos{min-height:min(100svh,960px);background:#0B0B0A}
.hero.cosmos .hero-cv{z-index:0;opacity:0;transition:opacity 2.4s ease}
.hero.cosmos .hero-cv.on{opacity:1}
.hero.cosmos::after{content:"";position:absolute;inset:0;z-index:1;pointer-events:none;
  background:linear-gradient(90deg,rgba(11,11,10,.96) 0%,rgba(11,11,10,.82) 30%,rgba(11,11,10,.38) 62%,rgba(11,11,10,.55) 100%),linear-gradient(180deg,rgba(11,11,10,.55) 0%,rgba(11,11,10,0) 22%,rgba(11,11,10,0) 62%,var(--grey) 100%)}
.hero.cosmos .hero-in{z-index:2;justify-content:center;padding-top:calc(var(--hdr) + 24px);will-change:transform,opacity}
.hero.cosmos .hero-in::after{content:"";position:absolute;left:var(--gut);bottom:0;width:1px;height:clamp(44px,7vh,72px);background:linear-gradient(var(--terra),transparent);transform-origin:top;animation:cue 2.6s var(--ease) infinite}
@keyframes cue{0%{transform:scaleY(0);opacity:0}35%{transform:scaleY(1);opacity:1}100%{transform:scaleY(1);opacity:0}}
.hdr{z-index:6}

/* sections: a soft light from above, so the two darks read as depth */
main>section{position:relative}
main>section[data-tone="grey"]::before,main>section[data-tone="black"]:not(.hero)::before{content:"";position:absolute;inset:0 0 auto 0;height:min(60%,520px);pointer-events:none;background:radial-gradient(ellipse 70% 100% at 50% 0%,rgba(255,255,255,.035),transparent 70%)}
main>section>.wrap{position:relative}

/* scope: instrument frame */
.scope{box-shadow:0 40px 80px -40px rgba(0,0,0,.7)}
.scope::before,.scope::after{content:"";position:absolute;width:12px;height:12px;border:solid var(--terra);z-index:2;pointer-events:none}
.scope::before{top:-1px;left:-1px;border-width:1.5px 0 0 1.5px}
.scope::after{bottom:-1px;right:-1px;border-width:0 1.5px 1.5px 0}

/* pillars: hover focus */
.pillar{position:relative;transition:background .5s}
.pillar .row-n{transition:color .4s}
.pillar-t{transition:letter-spacing .7s var(--ease)}
.pillar-s{transition:transform .7s var(--ease)}
.pillar-i>div{padding-left:14px;border-left:1px solid var(--rule);transition:border-color .4s}
@media (hover:hover){
  .pillars:hover .pillar{opacity:.42}
  .pillars .pillar{transition:opacity .5s,background .5s}
  .pillars .pillar:hover{opacity:1}
  .pillar:hover .row-n{color:var(--terra-text)}
  .pillar:hover .pillar-s{transform:translateX(10px)}
  .pillar:hover .pillar-i>div{border-left-color:var(--terra)}
}

/* who we are / asks: panels */
.asks{gap:clamp(16px,1.8vw,24px)}
.asks li{position:relative;border:1px solid var(--rule);border-top-color:var(--rule);padding:clamp(24px,2.6vw,36px);background:rgba(255,255,255,.014);overflow:hidden;transition:transform .6s var(--ease),border-color .5s,background .5s}
.asks li::before{content:"";position:absolute;inset:0 0 auto 0;height:2px;background:var(--terra);transform:scaleX(0);transform-origin:0 50%;transition:transform .7s var(--ease)}
.asks li h3{margin-top:clamp(20px,3vw,44px)}
@media (hover:hover){
  .asks li:hover{transform:translateY(-6px);border-color:rgba(255,255,255,.26);background:rgba(255,255,255,.03)}
  .asks li:hover::before{transform:scaleX(1)}
}

/* decline list */
.plain li{transition:padding-left .5s var(--ease)}
.plain li span{transition:color .4s}
@media (hover:hover){.plain li:hover{padding-left:12px}.plain li:hover span{color:var(--terra-text)}}

/* links */
.addr{background:linear-gradient(var(--terra),var(--terra)) no-repeat 0 100%/100% 1px;border-bottom:0;padding-bottom:4px;transition:background-size .6s var(--ease),color .3s}
.addr:hover{background-size:100% 100%;color:#fff}
.nav a{position:relative}
.toc a{position:relative;overflow:hidden}

/* motion: only when the script has confirmed it can reveal */
.anim .rv{opacity:0;transform:translate3d(0,22px,0);filter:blur(6px);transition:opacity 1s var(--ease),transform 1.1s var(--ease),filter 1s var(--ease);transition-delay:calc(var(--d,0) * 80ms)}
.anim .rv.in{opacity:1;transform:none;filter:none}
.anim .scope.rv{filter:none;transform:translate3d(0,32px,0) scale(.985)}
.anim .scope.rv.in{transform:none}
.anim .hero-wm.rv{clip-path:inset(0 0 100% 0);filter:none;transform:translate3d(0,26px,0);transition:clip-path 1.5s var(--ease) .15s,transform 1.5s var(--ease) .15s,opacity .6s .15s}
.anim .hero-wm.rv.in{clip-path:inset(0 0 -10% 0);transform:none}
.anim .hero-tag.rv{transition-delay:.75s}
.anim .hero .lede.rv{transition-delay:.9s}
.w{display:inline-block;overflow:hidden;vertical-align:bottom;padding:.14em .04em .16em 0;margin:-.14em -.04em -.16em 0}
.wi{display:inline-block}
.anim .wh .wi{transform:translate3d(0,112%,0);transition:transform 1.05s var(--ease);transition-delay:calc(var(--i,0) * 60ms)}
.anim .wh.in .wi{transform:none}
.anim .ln{border-top-color:transparent}
.ln::before{content:"";position:absolute;top:-1px;left:0;right:0;height:1px;background:var(--rule)}
.chapter.ln{position:relative}
.chapter.ln::before{background:rgba(255,255,255,.34)}
.anim .ln::before{transform:scaleX(0);transform-origin:0 50%;transition:transform 1.4s var(--ease)}
.anim .ln.in::before{transform:scaleX(1)}
.asks li.rv.in,.pillar .rv.in{transition-delay:0s}
@media (max-width:900px){
  .hero.cosmos::after{background:linear-gradient(180deg,rgba(11,11,10,.8) 0%,rgba(11,11,10,.62) 45%,rgba(11,11,10,.3) 70%,var(--grey) 100%)}
}