*{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth}
body{background:#08061A}
.site{
  --ph:305;--ph2:262;--ac:.16;               /* palette hue / secondary hue / chroma */
  --al:.74;--al2:.70;--lineA:.35;            /* accent lightness (per look) / line alpha */
  --bgL:.11;--bg2L:.15;--fieldC:.07;         /* base lightness + flood chroma (color-field) */
  --accent:oklch(var(--al) var(--ac) var(--ph));
  --accent2:oklch(var(--al2) var(--ac) var(--ph2));
  --line:oklch(var(--al) var(--ac) var(--ph) / var(--lineA));
  --bg:#08061A;--bg2:#0E0A2A;--surface:rgba(255,255,255,.04);--brd:rgba(200,180,255,.14);
  --ink:#F3EEFF;--ink2:#C9C0E6;--ink3:#8F86B5;
  --radius:4px;--blur:0px;
  --fh:'Cormorant Garamond',serif;--fb:'Spectral',serif;--fm:'IBM Plex Mono',monospace;
  --hw:600;--ht:-0.01em;--h1:clamp(3rem,7vw,6.4rem);--h2:clamp(2rem,4vw,3.4rem);--h3:clamp(1.3rem,2vw,1.7rem);
  --lead:clamp(1.15rem,1.7vw,1.5rem);--pad:clamp(70px,9vw,150px);--measure:66ch;
  --art:.16;--img:block;--eyeT:uppercase;--eyeLS:.24em;--eyeF:var(--fm);
  position:relative;min-height:100vh;background:var(--bg);color:var(--ink);
  font-family:var(--fb);font-size:18px;line-height:1.65;overflow-x:hidden;
  transition:background .5s ease,color .5s ease;
}
.site[data-theme="cosmos"]{--al:.75;--al2:.70;--lineA:.4;--bgL:.11;--bg2L:.15;--fieldC:.085;
  background:radial-gradient(1200px 700px at 70% -10%,oklch(.30 .11 var(--ph)) 0%,oklch(.13 .06 var(--ph)) 45%,var(--bg) 100%)}

.site[data-palette="purple"]{--ph:305;--ph2:262;--ac:.16}

/* ---------- ambient framework art ---------- */
.art{position:fixed;inset:0;z-index:0;pointer-events:none;opacity:var(--art);color:var(--line);transition:opacity .5s ease}
.art svg{position:absolute}
.art .a1{top:-6%;right:-8%;width:60vmax;height:60vmax}
.art .a2{bottom:-10%;left:-12%;width:70vmax;height:42vmax;opacity:.8}
@keyframes drift{from{transform:translate(0,0) rotate(0deg)}to{transform:translate(-3%,2%) rotate(9deg)}}
@keyframes tw{0%,100%{opacity:.4}50%{opacity:1}}
@keyframes fade{from{opacity:0;transform:translateY(18px)}to{opacity:1;transform:none}}

/* ---------- layout primitives ---------- */
.wrap{position:relative;z-index:1}
.container{max-width:1180px;margin:0 auto;padding:0 clamp(20px,4vw,56px)}
.section{padding:var(--pad) 0}
.section.alt{background:var(--bg2);transition:background .5s ease}
.measure{max-width:var(--measure)}
.eyebrow{font-family:var(--eyeF);font-size:.74rem;letter-spacing:var(--eyeLS);text-transform:var(--eyeT);color:var(--accent);font-weight:500;display:inline-block;margin-bottom:1.1rem}
h1,h2,h3{font-family:var(--fh);font-weight:var(--hw);letter-spacing:var(--ht);line-height:1.04;color:var(--ink);text-wrap:balance}
.h1{font-size:var(--h1)}
.h2{font-size:var(--h2);line-height:1.08}
.h3{font-size:var(--h3);line-height:1.2}
p{color:var(--ink2);text-wrap:pretty}
.lead{font-size:var(--lead);color:var(--ink);line-height:1.5}
.dim{color:var(--ink3)}
a{color:var(--accent);text-decoration:none}
a:hover{color:var(--ink)}
.stack>*+*{margin-top:1.2rem}
.stack-lg>*+*{margin-top:1.8rem}

/* ---------- nav ---------- */
.nav{position:sticky;top:0;z-index:40;display:flex;align-items:center;justify-content:space-between;gap:24px;
  padding:16px clamp(20px,4vw,56px);background:color-mix(in srgb,var(--bg) 82%,transparent);backdrop-filter:blur(14px);
  border-bottom:1px solid var(--brd)}
.brand{display:flex;align-items:center;gap:14px;cursor:pointer}
.brand .mark{width:60px;height:60px;flex:none}
@media(max-width:820px){.brand .mark{width:48px;height:48px}}
.brand b{font-family:var(--fh);font-weight:var(--hw);font-size:1.12rem;letter-spacing:var(--ht);color:var(--ink);line-height:1}
.brand small{display:block;font-family:var(--fm);font-size:.58rem;letter-spacing:.22em;text-transform:uppercase;color:var(--ink3);margin-top:3px}
.navlinks{display:flex;gap:4px;align-items:center}
.navlinks a{display:block;font-family:var(--fb);font-size:.9rem;color:var(--ink2);background:none;border:0;padding:8px 12px;cursor:pointer;border-radius:var(--radius);transition:color .2s,background .2s;letter-spacing:.01em}
.navlinks a:hover{color:var(--ink)}
.navlinks a[aria-current="page"]{color:var(--ink)}
.navlinks a[aria-current="page"]::after{content:"";display:block;height:2px;background:var(--accent);margin-top:5px;border-radius:2px}
.navcta{display:none}
@media(min-width:1000px){.navcta{display:inline-flex}}
.menu-btn{display:none}

/* ---------- buttons ---------- */
.btn{display:inline-flex;align-items:center;gap:.5em;font-family:var(--fb);font-weight:500;font-size:.98rem;
  padding:.85em 1.5em;border-radius:var(--radius);cursor:pointer;border:1px solid transparent;transition:all .2s;letter-spacing:.01em}
.btn.pri{background:var(--accent);color:var(--bg);border-color:var(--accent)}
.btn.pri:hover{filter:brightness(1.12);transform:translateY(-1px)}
.btn.gho{background:transparent;color:var(--ink);border-color:var(--brd)}
.btn.gho:hover{border-color:var(--accent);color:var(--accent)}
.link-arrow{color:var(--accent);font-family:var(--fb);font-weight:500;display:inline-flex;gap:.4em;cursor:pointer}
.link-arrow:hover{gap:.7em;color:var(--ink)}

/* ---------- hero ---------- */
.hero{position:relative;padding:clamp(80px,13vw,190px) 0 clamp(60px,8vw,120px)}
.hero .measure,.hero .h1{max-width:none}
.site[data-theme="cosmos"] .hero{padding-top:clamp(60px,10vw,150px)}

/* ---------- cards / grids ---------- */
.grid{display:grid;gap:22px}
.g3{grid-template-columns:repeat(auto-fit,minmax(260px,1fr))}
.g2{grid-template-columns:repeat(auto-fit,minmax(320px,1fr))}
.card{background:var(--surface);border:1px solid var(--brd);border-radius:var(--radius);padding:clamp(22px,2.4vw,34px);
  backdrop-filter:blur(var(--blur));transition:transform .25s,border-color .25s,background .25s}
.card:hover{transform:translateY(-3px);border-color:var(--accent)}
.card .num{font-family:var(--fm);font-size:.8rem;color:var(--accent);letter-spacing:.1em}
.pnum{font-family:var(--fh);font-size:2.6rem;color:var(--accent);line-height:1;font-weight:var(--hw);opacity:.85}

/* pills / meta rows */
.pill{display:inline-flex;align-items:center;gap:.5em;font-family:var(--fm);font-size:.72rem;letter-spacing:.08em;text-transform:uppercase;
  color:var(--ink2);border:1px solid var(--brd);border-radius:100px;padding:.4em .9em}
.tag{font-family:var(--fm);font-size:.7rem;letter-spacing:.1em;text-transform:uppercase;color:var(--accent)}
.rule{height:1px;background:var(--brd);border:0;margin:0}
.figure-cap{font-family:var(--fm);font-size:.7rem;letter-spacing:.12em;text-transform:uppercase;color:var(--ink3);margin-top:14px;text-align:center}

/* footer */
.foot{border-top:1px solid var(--brd);padding:clamp(50px,7vw,90px) 0 60px;background:var(--bg2)}
.foot-grid{display:grid;gap:36px;grid-template-columns:1.4fr 1fr 1fr}
@media(max-width:760px){.foot-grid{grid-template-columns:1fr 1fr}}
.foot a,.foot button{display:block;color:var(--ink2);background:none;border:0;text-align:left;padding:5px 0;cursor:pointer;font-family:var(--fb);font-size:.95rem}
.foot a:hover,.foot button:hover{color:var(--accent)}
.foot h4{font-family:var(--fm);font-size:.72rem;letter-spacing:.16em;text-transform:uppercase;color:var(--ink3);margin-bottom:14px;font-weight:500}

@media(max-width:820px){
  .navlinks{display:none}
  .foot-grid{grid-template-columns:1fr 1fr}
}

/* ---------- additions: copy-only rebuild ---------- */
a.brand,button.brand{background:none;border:0;padding:0;color:inherit;text-align:left;font:inherit}
button.link-arrow{background:none;border:0;padding:0;font-size:inherit;line-height:inherit;text-align:left}
.phead{display:flex;align-items:baseline;gap:16px}
.cohort-head{display:flex;align-items:baseline;gap:14px;margin-bottom:14px}
.cardlink{display:block;color:var(--ink)}
.cardlink:hover{color:var(--ink)}
.comm{scroll-margin-top:80px}
.hero.container{max-width:none;padding-left:clamp(20px,6vw,120px);padding-right:clamp(20px,6vw,120px)}
.hero .h1{text-wrap:pretty}
.plain{list-style:none;padding:0}
.plain li{padding:.55rem 0;border-bottom:1px solid var(--brd);color:var(--ink)}
.plain li:last-child{border-bottom:0}
.launch{display:flex;flex-wrap:wrap;gap:.8em;align-items:baseline;color:var(--ink);padding-top:.6rem}
.flabel{font-family:var(--fm);font-size:.72rem;letter-spacing:.16em;text-transform:uppercase;color:var(--ink3);font-weight:500;min-width:11rem}
.frow{display:flex;flex-wrap:wrap;gap:8px;align-items:center}
.fpill{font-family:var(--fm);font-size:.72rem;letter-spacing:.08em;text-transform:uppercase;color:var(--ink2);border:1px solid var(--brd);border-radius:100px;padding:.5em 1em;background:none;cursor:pointer;transition:all .18s}
.fpill:hover{border-color:var(--accent);color:var(--ink)}
.fpill[data-active="true"]{background:var(--accent);color:var(--bg);border-color:var(--accent)}
.fpill:disabled{opacity:.55;cursor:not-allowed}
.fpill:disabled:hover{border-color:var(--brd);color:var(--ink2)}
.note{font-family:var(--fm);font-size:.78rem;line-height:1.5;color:var(--ink3);border:1px dashed var(--brd);padding:.8em 1em;border-radius:var(--radius)}
.field{display:flex;flex-direction:column;gap:.4rem}
.inp{width:100%;padding:.8em 1em;border-radius:var(--radius);border:1px solid var(--brd);background:var(--bg);color:var(--ink);font-family:var(--fb);font-size:1rem}
.inp:focus{outline:2px solid var(--accent);outline-offset:1px}

/* ---------- production additions ---------- */
a.brand{text-decoration:none}
a.link-arrow{display:inline-flex}
.skip{position:absolute;left:-9999px;top:0;z-index:100;background:var(--accent);color:var(--bg);padding:8px 14px}
.skip:focus{left:12px;top:12px}
a:focus-visible,button:focus-visible{outline:2px solid var(--accent);outline-offset:3px}
@media(max-width:820px){
  .nav{flex-wrap:wrap;row-gap:6px}
  .navlinks{display:flex;flex-wrap:wrap;width:100%;gap:0;margin-left:-12px}
  .navlinks a{font-size:.85rem;padding:6px 12px}
}
