/* GenetixBay HQ shared system.
   Layout: light botanical-editorial canvas (cream), Night Garden bands for data. One accent per headline.
   Radius scale is fixed: sm 8 / md 14 / lg 22 / pill. Two shadow kinds only: soft and sticker. */
:root{
  --cream:#F5F2E9; --paper:#FBFAF5; --ink:#1C2016; --ink-2:#464B3E; --ink-3:#5E6254;
  --line:#DCD7C6; --line-2:#E8E4D6;
  --green:#8FBD2C; --green-deep:#263D12; --green-text:#3F6614; --green-wash:#E6EFCF;
  --seed:#351B1D; --seed-2:#5A3436; --gold:#E8A65D; --gold-deep:#8A5418; --gold-wash:#F7E6CF;
  --night:#191D18; --night-2:#222820; --night-3:#2D3529; --night-line:#3A4434; --night-ink:#EEF0E6; --night-ink-2:#B3BAA8;
  --ok:#3F8F4A; --ok-text:#2F6B38; --warn:#B9771E; --warn-text:#7F4F14; --crit:#B23A2E;
  --shadow:0 1px 2px rgba(53,27,29,.06),0 8px 28px -12px rgba(53,27,29,.18);
  --sticker-border:1.5px solid var(--ink); --sticker-shadow:4px 4px 0 var(--ink);
  --f-display:"Fraunces",Georgia,"Times New Roman",serif;
  --f-ui:"Space Grotesk",system-ui,-apple-system,"Segoe UI",sans-serif;
  --f-mono:"IBM Plex Mono",ui-monospace,Consolas,monospace;
  --f-hand:"Gochi Hand","Comic Sans MS",cursive;
  --fs-label:.6875rem; --fs-read:.75rem;
  --r-sm:8px; --r:14px; --r-lg:22px; --r-pill:999px;
  --wrap:1240px;
}
@media (prefers-color-scheme: dark){:root:not([data-theme="light"]){
  --cream:#14170F; --paper:#1B1F17; --ink:#ECEEE2; --ink-2:#C2C8B5; --ink-3:#9AA28E;
  --line:#343C2E; --line-2:#2A3125;
  --green-text:#A9D453; --green-wash:#26331A; --gold-wash:#3A2C1A; --gold-deep:#F0B978; --seed-2:#C9A6A4;
  --night:#0E110C; --night-2:#171B14; --night-3:#20261C;
  --ok-text:#8CD19A; --warn-text:#F0B978;
  --shadow:0 1px 2px rgba(0,0,0,.3),0 10px 30px -12px rgba(0,0,0,.6);
  --sticker-shadow:4px 4px 0 #000;
  color-scheme:dark}}
:root[data-theme="dark"]{
  --cream:#14170F; --paper:#1B1F17; --ink:#ECEEE2; --ink-2:#C2C8B5; --ink-3:#9AA28E;
  --line:#343C2E; --line-2:#2A3125;
  --green-text:#A9D453; --green-wash:#26331A; --gold-wash:#3A2C1A; --gold-deep:#F0B978; --seed-2:#C9A6A4;
  --night:#0E110C; --night-2:#171B14; --night-3:#20261C;
  --ok-text:#8CD19A; --warn-text:#F0B978;
  --shadow:0 1px 2px rgba(0,0,0,.3),0 10px 30px -12px rgba(0,0,0,.6);
  --sticker-shadow:4px 4px 0 #000;
  color-scheme:dark}

/* Alternative theme: Seed. Warm seed-brown ground, gold accents, lime kept for fills. */
:root[data-theme="seed"]{
  --cream:#24130F; --paper:#2F1A17; --ink:#F6EDE4; --ink-2:#DCC9BE; --ink-3:#B39E93;
  --line:#4A2F29; --line-2:#3A231F;
  --green-text:#B5DB5E; --green-wash:#2E3519; --gold-wash:#45301B; --gold-deep:#F2BF80; --seed-2:#E8C7B9;
  --night:#170C0A; --night-2:#21120F; --night-3:#2C1814; --night-line:#4A2F29; --night-ink:#F6EDE4; --night-ink-2:#CDB7AB;
  --ok-text:#9BD6A6; --warn-text:#F2BF80;
  --shadow:0 1px 2px rgba(0,0,0,.35),0 10px 30px -12px rgba(0,0,0,.65);
  --sticker-border:1.5px solid #F2BF80; --sticker-shadow:4px 4px 0 #E8A65D;
  color-scheme:dark}
/* Greenleaf's near-black outline needs a soft halo on dark grounds. */
:root{--gl-halo:none}
:root[data-theme="dark"],:root[data-theme="seed"]{--gl-halo:drop-shadow(0 0 1.5px rgba(245,242,233,.55))}
@media (prefers-color-scheme: dark){:root:not([data-theme="light"]){--gl-halo:drop-shadow(0 0 1.5px rgba(245,242,233,.55))}}
.gl-live svg,img[src*="greenleaf/"]{filter:var(--gl-halo)}
.tp{position:relative;display:inline-flex}
.tp-btn{display:inline-flex;align-items:center;gap:7px;font:600 .84rem var(--f-ui);padding:7px 11px;border-radius:var(--r-pill);border:1px solid var(--line);background:var(--paper);color:var(--ink);cursor:pointer;white-space:nowrap}
.tp-btn:hover,.tp-btn[aria-expanded="true"]{border-color:var(--ink)}
.tp-chev{opacity:.6}
.tp-menu{position:absolute;right:0;top:calc(100% + 8px);z-index:60;min-width:230px;background:var(--paper);border:1px solid var(--line);border-radius:var(--r);box-shadow:var(--shadow);padding:6px;display:grid;gap:2px}
.tp-head{font-family:var(--f-mono);font-size:var(--fs-label);letter-spacing:.12em;text-transform:uppercase;color:var(--ink-3);padding:6px 10px 4px}
.tp-opt{display:grid;grid-template-columns:auto minmax(0,1fr) 14px;gap:10px;align-items:center;text-align:left;width:100%;padding:9px 10px;border:0;border-radius:10px;background:transparent;color:var(--ink);font:inherit;cursor:pointer}
.tp-opt:hover,.tp-opt:focus-visible{background:var(--line-2);outline:none}
.tp-opt b{display:block;font-size:.92rem}
.tp-opt small{display:block;font-size:.78rem;color:var(--ink-3)}
.tp-opt .tp-check{visibility:hidden;color:var(--green-text)}
.tp-opt[aria-checked="true"] .tp-check{visibility:visible}
.tp-sw{display:inline-flex;border-radius:7px;overflow:hidden;border:1px solid var(--line);width:36px;height:22px}
.tp-sw i{flex:1}
@media(max-width:520px){.tp-btn .tl,.tp-chev{display:none}.tp-btn{padding:8px}}
*{box-sizing:border-box}
[hidden]{display:none!important}
html{scroll-behavior:smooth}
body{margin:0;overflow-wrap:break-word;background:var(--cream);color:var(--ink);font-family:var(--f-ui);font-size:16px;line-height:1.6;-webkit-font-smoothing:antialiased}
body::before{content:"";position:fixed;inset:0 0 auto;height:env(safe-area-inset-top,0px);z-index:30;background:var(--cream)}
img{max-width:100%}
.wrap{max-width:var(--wrap);margin:0 auto;padding-left:max(20px,env(safe-area-inset-left,0px));padding-right:max(20px,env(safe-area-inset-right,0px))}
h1,h2,h3{font-family:var(--f-display);font-weight:500;letter-spacing:-.02em;line-height:1.05;text-wrap:balance;margin:0;font-variation-settings:"SOFT" 50,"WONK" 0}
h1,h2{font-variation-settings:"SOFT" 50,"WONK" 1}
h2{font-size:clamp(2.1rem,4.6vw,3.6rem)}
h3{font-size:clamp(1.3rem,2.1vw,1.6rem);line-height:1.15}
p{margin:0}
a{color:inherit}
.lede{font-size:clamp(1.05rem,1.4vw,1.2rem);color:var(--ink-2);max-width:62ch}
.eyebrow{font-family:var(--f-mono);font-size:var(--fs-read);letter-spacing:.12em;text-transform:uppercase;color:var(--ink-3);display:flex;gap:.6em;align-items:center;flex-wrap:wrap}
.eyebrow b{color:var(--green-text);font-weight:600}
.mono{font-family:var(--f-mono)}
.hand{font-family:var(--f-hand);font-size:1.3rem;line-height:1.25}
:focus-visible{outline:2px solid var(--green);outline-offset:3px;border-radius:6px}
section{padding-block:clamp(64px,9vw,112px)}
.sec-head{display:grid;grid-template-columns:minmax(0,1fr);gap:18px;margin-bottom:clamp(32px,5vw,56px)}
@media(min-width:900px){.sec-head{grid-template-columns:minmax(0,7fr) minmax(0,5fr);align-items:end;gap:48px}}

/* nav */
.nav{position:sticky;top:env(safe-area-inset-top,0px);z-index:20;background:color-mix(in srgb,var(--cream) 90%,transparent);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);border-bottom:1px solid var(--line-2)}
.nav .wrap{display:flex;align-items:center;gap:16px;height:64px}
.brand{display:flex;align-items:center;gap:10px;text-decoration:none}
.brand img{width:32px;height:auto}
.brand b{font-size:1.02rem;letter-spacing:.01em}
.brand small{display:block;font-family:var(--f-mono);font-size:var(--fs-label);letter-spacing:.14em;color:var(--ink-3);line-height:1}
.nav-links{display:none;list-style:none;margin:0 0 0 auto;padding:0;gap:4px}
.nav-links a{display:block;padding:8px 12px;border-radius:var(--r-pill);text-decoration:none;font-size:.92rem;color:var(--ink-2)}
.nav-links a:hover{background:var(--line-2);color:var(--ink)}
.nav-links a[aria-current="page"]{background:var(--ink);color:var(--cream)}
.menu-btn{margin-left:auto;display:inline-flex;align-items:center;gap:8px;font:600 .9rem var(--f-ui);background:transparent;color:var(--ink);border:1.5px solid var(--ink);border-radius:var(--r-pill);padding:8px 14px;cursor:pointer}
.sheet{position:fixed;inset:0;z-index:40;background:color-mix(in srgb,var(--night) 50%,transparent);display:flex;justify-content:flex-end}
.sheet nav{background:var(--paper);width:min(320px,86vw);height:100%;padding:calc(20px + env(safe-area-inset-top,0px)) max(20px,env(safe-area-inset-right,0px)) 20px 20px;display:grid;align-content:start;gap:6px}
.sheet a{display:block;padding:12px 14px;border-radius:var(--r-sm);text-decoration:none;font-size:1.1rem}
.sheet a[aria-current="page"]{background:var(--green-wash);color:var(--green-text);font-weight:600}
.sheet button{justify-self:end;font:600 .9rem var(--f-ui);background:none;border:1.5px solid var(--ink);color:var(--ink);border-radius:var(--r-pill);padding:6px 12px;cursor:pointer;margin-bottom:8px}
.nav .tp{margin-left:auto}
.nav .menu-btn{margin-left:8px}
@media(min-width:900px){.nav-links{display:flex}.menu-btn{display:none}.nav .tp{margin-left:8px}}

/* buttons, pills */
.btn{display:inline-flex;align-items:center;gap:.5em;padding:13px 20px;border-radius:12px;font:600 .98rem var(--f-ui);text-decoration:none;border:1.5px solid transparent;cursor:pointer;transition:transform .18s ease,box-shadow .18s ease,background .18s}
.btn-primary{background:var(--green);color:#16200A;box-shadow:0 2px 0 var(--green-deep)}
.btn-primary:hover{transform:translateY(-2px);box-shadow:0 4px 0 var(--green-deep)}
.btn-ghost{border-color:var(--ink);color:var(--ink);background:transparent}
.btn-ghost:hover{background:var(--ink);color:var(--cream)}
.pill{display:inline-flex;align-items:center;gap:6px;font-family:var(--f-mono);font-size:var(--fs-read);letter-spacing:.06em;text-transform:uppercase;padding:4px 10px;border-radius:var(--r-pill);white-space:normal;max-width:100%}
.pill::before{content:"";width:6px;height:6px;border-radius:50%;background:currentColor}
.pill.ok{background:color-mix(in srgb,var(--ok) 14%,transparent);color:var(--ok-text)}
.pill.gold{background:var(--gold-wash);color:var(--gold-deep)}
.pill.warn{background:color-mix(in srgb,var(--warn) 14%,transparent);color:var(--warn-text)}
.pill.plain{background:var(--line-2);color:var(--ink-2)}
.sticker{border:var(--sticker-border);box-shadow:var(--sticker-shadow)}
.card{color:var(--ink);background:var(--paper);border:1px solid var(--line);border-radius:var(--r-lg);padding:clamp(20px,2.6vw,30px);min-width:0}

/* heritage timeline strip */
.timeline-strip{background:var(--seed);color:#F5F2E9}
.timeline-strip .wrap{display:flex;gap:0;overflow-x:auto;padding-block:18px;scrollbar-width:thin}
.ts-item{flex:1 0 180px;padding:4px 20px;border-left:1px solid rgba(245,242,233,.22)}
.ts-item:first-child{border-left:0;padding-left:0}
.ts-item .y{font-family:var(--f-mono);font-size:var(--fs-read);letter-spacing:.12em;color:var(--green)}
.ts-item .e{font-family:var(--f-display);font-size:1.12rem;line-height:1.25;margin-top:2px}

/* footer */
footer.site{background:var(--seed);color:#EADFD6;padding-block:48px}
footer.site .wrap{display:grid;grid-template-columns:minmax(0,1fr);gap:24px;align-items:center}
@media(min-width:800px){footer.site .wrap{grid-template-columns:auto minmax(0,1fr) auto}}
footer.site img{width:84px;height:auto}
footer.site .big{font-family:var(--f-display);font-size:clamp(1.8rem,4vw,3rem);line-height:1;color:#F5F2E9;font-variation-settings:"WONK" 1}
footer.site .big em{color:var(--green)}
footer.site .small{font-size:.82rem;color:#CDB9B6;max-width:52ch;margin-top:8px}
footer.site .lockup{font-family:var(--f-mono);font-size:var(--fs-label);letter-spacing:.16em;color:#CDB9B6}

.scroll-x{overflow-x:auto}
table.data{width:100%;border-collapse:collapse;font-size:.92rem}
table.data th{text-align:left;font-family:var(--f-mono);font-size:var(--fs-label);letter-spacing:.1em;text-transform:uppercase;color:var(--ink-3);font-weight:500;padding:10px 12px;border-bottom:1px solid var(--line)}
table.data td{padding:10px 12px;border-bottom:1px solid var(--line-2);vertical-align:top;color:var(--ink-2)}
table.data td:first-child{color:var(--ink);font-weight:500}
table.data .num{text-align:right;font-family:var(--f-mono);font-variant-numeric:tabular-nums}

.paused, .paused *{animation-play-state:paused!important}
@media (prefers-reduced-motion:reduce){*,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}html{scroll-behavior:auto}}

/* ==========================================================================
   Atmosphere + motion layer (2026 refresh).
   Rules: decorative layers live in pseudo-elements or aria-hidden nodes, never inside
   a scroll container; motion animates transform/opacity only; every element is complete
   at rest and under prefers-reduced-motion. Scroll-driven animations use view()/scroll()
   where supported; assets/motion.js supplies the IntersectionObserver fallback.
   ========================================================================== */
:root{
  --ease-out:cubic-bezier(.2,.75,.25,1); --ease-spring:cubic-bezier(.34,1.5,.64,1);
  --accent-text:linear-gradient(100deg,#3F6614 0%,#5D7A12 45%,#8A5418 100%);
  --accent-fill:linear-gradient(115deg,#8FBD2C 0%,#C2C443 52%,#E8A65D 100%);
  --sky-a:rgba(143,189,44,.30); --sky-b:rgba(232,166,93,.26); --sky-c:rgba(143,189,44,.14);
  --band-a:rgba(143,189,44,.20); --band-b:rgba(232,166,93,.13);
  --glow-btn:0 10px 28px -14px rgba(63,102,20,.55);
  --glow-card:0 18px 40px -22px rgba(53,27,29,.35);
  --card-edge:rgba(255,255,255,.7);
  --grain:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='180' height='180'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='2' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 .1 0 0 0 0 .1 0 0 0 0 .05 0 0 0 1.1 -.35'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
  --grain-op:.10;
}
@media (prefers-color-scheme: dark){:root:not([data-theme="light"]){
  --accent-text:linear-gradient(100deg,#C4EA6A 0%,#DCD775 50%,#F0B978 100%);
  --sky-a:rgba(143,189,44,.22); --sky-b:rgba(143,189,44,.10); --sky-c:rgba(232,166,93,.10);
  --band-a:rgba(143,189,44,.16); --band-b:rgba(143,189,44,.07);
  --glow-btn:0 0 0 1px rgba(169,212,83,.25),0 10px 34px -10px rgba(143,189,44,.55);
  --glow-card:0 0 0 1px rgba(169,212,83,.22),0 20px 50px -24px rgba(143,189,44,.35);
  --card-edge:rgba(169,212,83,.10);
  --grain:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='180' height='180'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='2' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 1 0 0 0 0 1 0 0 0 0 .95 0 0 0 1.1 -.35'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
  --grain-op:.06}}
:root[data-theme="dark"]{
  --accent-text:linear-gradient(100deg,#C4EA6A 0%,#DCD775 50%,#F0B978 100%);
  --sky-a:rgba(143,189,44,.22); --sky-b:rgba(143,189,44,.10); --sky-c:rgba(232,166,93,.10);
  --band-a:rgba(143,189,44,.16); --band-b:rgba(143,189,44,.07);
  --glow-btn:0 0 0 1px rgba(169,212,83,.25),0 10px 34px -10px rgba(143,189,44,.55);
  --glow-card:0 0 0 1px rgba(169,212,83,.22),0 20px 50px -24px rgba(143,189,44,.35);
  --card-edge:rgba(169,212,83,.10);
  --grain:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='180' height='180'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='2' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 1 0 0 0 0 1 0 0 0 0 .95 0 0 0 1.1 -.35'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
  --grain-op:.06}
:root[data-theme="seed"]{
  --accent-text:linear-gradient(100deg,#FFD99A 0%,#F2BF80 45%,#C6E27A 100%);
  --accent-fill:linear-gradient(115deg,#E8A65D 0%,#F2C46E 50%,#B5DB5E 100%);
  --sky-a:rgba(232,166,93,.24); --sky-b:rgba(181,219,94,.09); --sky-c:rgba(242,191,128,.12);
  --band-a:rgba(232,166,93,.18); --band-b:rgba(181,219,94,.07);
  --glow-btn:0 0 0 1px rgba(242,191,128,.30),0 10px 34px -10px rgba(232,166,93,.6);
  --glow-card:0 0 0 1px rgba(242,191,128,.25),0 20px 50px -24px rgba(232,166,93,.4);
  --card-edge:rgba(242,191,128,.12);
  --grain:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='180' height='180'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='2' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 1 0 0 0 0 .92 0 0 0 0 .8 0 0 0 1.1 -.35'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
  --grain-op:.07}

/* Gradient accent text: every stop meets AA on its theme ground; falls back to solid colour. */
.grad{color:var(--green-text)}
@supports ((-webkit-background-clip:text) or (background-clip:text)){
  .grad,h1 em{background:var(--accent-text);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;padding-right:.08em;margin-right:-.04em}
}
:root[data-theme="seed"] .eyebrow b{color:var(--gold-deep)}

/* Sky: botanical blobs + grain behind the top of each page (injected by motion.js, aria-hidden). */
body{position:relative}
.gb-sky{position:absolute;inset:0 0 auto;height:min(1100px,140vh);z-index:-1;overflow:hidden;pointer-events:none;
  -webkit-mask-image:linear-gradient(#000 55%,transparent);mask-image:linear-gradient(#000 55%,transparent)}
.gb-sky i{position:absolute;display:block;border-radius:42% 58% 63% 37%/45% 39% 61% 55%}
.gb-sky i:nth-child(1){width:62vmax;height:52vmax;right:-18vmax;top:-20vmax;background:radial-gradient(closest-side,var(--sky-a),transparent)}
.gb-sky i:nth-child(2){width:44vmax;height:40vmax;left:-16vmax;top:12vmax;background:radial-gradient(closest-side,var(--sky-b),transparent);border-radius:61% 39% 45% 55%/52% 61% 39% 48%}
.gb-sky i:nth-child(3){width:30vmax;height:26vmax;left:38%;top:30vmax;background:radial-gradient(closest-side,var(--sky-c),transparent)}
.gb-sky::after{content:"";position:absolute;inset:0;background-image:var(--grain);opacity:var(--grain-op)}

/* Bands with depth: glows + grain on pseudo layers; the band keeps its solid colour behind text. */
.band,.timeline-strip,footer.site,section.dark,.depth{position:relative;isolation:isolate}
.band::before,section.dark::before,.depth::before{content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;
  background:radial-gradient(60% 70% at 88% 8%,var(--band-a),transparent 70%),radial-gradient(50% 60% at 6% 96%,var(--band-b),transparent 70%)}
.band::after,section.dark::after,.timeline-strip::after,footer.site::after,.depth::after{content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;background-image:var(--grain);opacity:var(--grain-op)}
.band,section.dark{--band-a:rgba(143,189,44,.18);--band-b:rgba(232,166,93,.12)}
:root[data-theme="seed"] .band,:root[data-theme="seed"] section.dark{--band-a:rgba(232,166,93,.20);--band-b:rgba(181,219,94,.08)}
footer.site::before{content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;background:radial-gradient(70% 120% at 100% 0%,rgba(232,166,93,.16),transparent 60%)}

/* Cards: soft top highlight, lift on hover, theme glow. */
.card{box-shadow:inset 0 1px 0 var(--card-edge);transition:transform .25s var(--ease-out),box-shadow .25s var(--ease-out),border-color .25s}
a.card:hover,.card.lift:hover{transform:translateY(-4px);box-shadow:inset 0 1px 0 var(--card-edge),var(--glow-card);border-color:color-mix(in srgb,var(--green) 55%,var(--line))}

/* Buttons: magnetic offset (set by motion.js), light sweep, theme glow. */
.btn{position:relative;isolation:isolate;overflow:hidden;translate:var(--mx,0px) var(--my,0px);transition:transform .18s ease,box-shadow .25s ease,background .18s,color .18s,translate .35s var(--ease-spring)}
.btn::after{content:"";position:absolute;inset:-2px;z-index:-1;pointer-events:none;background:linear-gradient(105deg,transparent 30%,rgba(255,255,255,.45) 50%,transparent 70%);transform:translateX(-120%);transition:transform .7s var(--ease-out)}
.btn:hover::after,.btn:focus-visible::after{transform:translateX(120%)}
.btn-ghost::after{background:linear-gradient(105deg,transparent 30%,color-mix(in srgb,var(--green) 30%,transparent) 50%,transparent 70%)}
.btn-primary{box-shadow:0 2px 0 var(--green-deep),var(--glow-btn)}
.btn-primary:hover{box-shadow:0 4px 0 var(--green-deep),var(--glow-btn)}
.btn-fund{background-color:#E8A65D;background-image:var(--accent-fill);color:#1A1405;border-color:transparent;box-shadow:0 2px 0 #6B4A12,var(--glow-btn)}
.btn-fund:hover{transform:translateY(-2px);box-shadow:0 4px 0 #6B4A12,var(--glow-btn)}
.btn:focus-visible{outline-offset:4px}

/* Fund the Bay call-to-action block (HQ brief, waitlist, blog). Fixed seed palette in every theme. */
.fund-cta{position:relative;isolation:isolate;overflow:hidden;border-radius:var(--r-lg);padding:clamp(24px,4vw,44px);display:grid;gap:18px;align-items:center;
  background-color:#351B1D;color:#F6EDE4;border:1px solid #5A3436}
.fund-cta::before{content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;background:radial-gradient(60% 90% at 100% 0%,rgba(232,166,93,.34),transparent 65%),radial-gradient(50% 80% at 0% 100%,rgba(143,189,44,.24),transparent 70%)}
.fund-cta::after{content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;background-image:var(--grain);opacity:.07}
.fund-cta .eyebrow{color:#E3D2C8}.fund-cta .eyebrow b{color:#F2BF80}
.fund-cta h2,.fund-cta h3{color:#FFF8EF}
.fund-cta h2 em,.fund-cta h3 em{font-style:italic;color:#C9EC72}
.fund-cta p{color:#E8DAD1;max-width:58ch}
.fund-cta .ctas{display:flex;flex-wrap:wrap;gap:10px;margin-top:4px}
.fund-cta .btn-ghost{border-color:#F6EDE4;color:#F6EDE4}
.fund-cta .btn-ghost:hover{background:#F6EDE4;color:#351B1D}
.fund-cta :focus-visible{outline-color:#C9EC72}
@media(min-width:860px){.fund-cta.has-art{grid-template-columns:minmax(0,1fr) 230px}}
.fund-cta .fc-art{width:min(220px,52vw);justify-self:center}

/* Nav: the Fund entry carries the accent ring. */
.nav-links a[href="fund.html"]:not([aria-current]){color:var(--ink);border:1.5px solid transparent;background:linear-gradient(var(--cream),var(--cream)) padding-box,var(--accent-fill) border-box}
.nav{view-transition-name:gb-nav}
.gb-vt-title{view-transition-name:gb-title}

/* View transitions between HQ pages. */
@view-transition{navigation:auto}
::view-transition-old(root){animation:gb-vt-out .2s ease-in both}
::view-transition-new(root){animation:gb-vt-in .42s var(--ease-out) both}
::view-transition-group(gb-title){animation-duration:.45s;animation-timing-function:var(--ease-out)}
@keyframes gb-vt-out{to{opacity:0;transform:translateY(-10px)}}
@keyframes gb-vt-in{from{opacity:0;transform:translateY(14px)}}

/* Page-load choreography: children of .gb-enter rise in sequence (CSS only, done in < 1 s). */
@keyframes gb-rise{from{opacity:0;transform:translateY(22px)}}
@keyframes gb-reveal{from{opacity:0;translate:0 36px;scale:.98}to{opacity:1;translate:none;scale:none}}
@keyframes gb-drift-a{50%{transform:translate(-3vmax,2vmax) rotate(12deg) scale(1.05)}}
@keyframes gb-drift-b{50%{transform:translate(2vmax,-2vmax) rotate(-10deg) scale(.96)}}
@keyframes gb-par{to{transform:translateY(calc(var(--depth,.2) * -160px))}}

@media (prefers-reduced-motion:no-preference){
  .gb-enter>*{animation:gb-rise .8s var(--ease-out) both;animation-delay:calc(var(--i,0) * 85ms + 60ms)}
  .gb-enter>:nth-child(2){--i:1}.gb-enter>:nth-child(3){--i:2}.gb-enter>:nth-child(4){--i:3}.gb-enter>:nth-child(5){--i:4}.gb-enter>:nth-child(6){--i:5}.gb-enter>:nth-child(n+7){--i:6}
  .gb-sky i:nth-child(1){animation:gb-drift-a 26s ease-in-out infinite}
  .gb-sky i:nth-child(2){animation:gb-drift-b 32s ease-in-out infinite}
  .gb-sky i:nth-child(3){animation:gb-drift-a 38s ease-in-out infinite reverse}
  @supports (animation-timeline: view()){
    .sec-head,section .card,[data-reveal],[data-stagger]>*{animation:gb-reveal linear both;animation-timeline:view();animation-range:entry 0% entry 65%}
    [data-stagger]>:nth-child(2){animation-range:entry 8% entry 75%}
    [data-stagger]>:nth-child(3){animation-range:entry 16% entry 85%}
    [data-stagger]>:nth-child(n+4){animation-range:entry 22% entry 95%}
    [data-depth]{animation:gb-par linear both;animation-timeline:scroll(root);animation-range:0 100vh}
  }
  /* IntersectionObserver fallback: motion.js adds .gb-io to <html> and .gb-pre only to elements below the fold. */
  .gb-io .gb-pre{opacity:0;translate:0 32px;transition:opacity .7s var(--ease-out),translate .7s var(--ease-out)}
  .gb-io .gb-pre.gb-in{opacity:1;translate:none}
}
@media (prefers-reduced-motion:reduce){
  ::view-transition-group(*),::view-transition-old(*),::view-transition-new(*){animation:none!important}
  .btn{translate:none}
  .btn::after{display:none}
  .card,a.card:hover,.card.lift:hover{transform:none}
}

/* Count-ups keep their final width so nothing shifts while digits roll. */
[data-count]{font-variant-numeric:tabular-nums;display:inline-block}

/* 3D tilt cards (motion.js sets --rx/--ry/--gx/--gy on fine pointers only). */
[data-tilt]{position:relative;transform:perspective(900px) rotateX(var(--rx,0deg)) rotateY(var(--ry,0deg));transition:transform .5s var(--ease-out),box-shadow .3s,border-color .3s}
[data-tilt].tilting{transition:transform .08s linear,box-shadow .3s,border-color .3s}
[data-tilt]::after{content:"";position:absolute;inset:0;border-radius:inherit;pointer-events:none;opacity:0;transition:opacity .3s;
  background:radial-gradient(420px circle at var(--gx,50%) var(--gy,50%),rgba(255,255,255,.14),transparent 45%)}
[data-tilt].tilting::after{opacity:1}

/* Accent text sitting on always-dark grounds (bands, dark heroes, Fund block) uses the night gradient. */
@supports ((-webkit-background-clip:text) or (background-clip:text)){
  .band .grad,.band h1 em,section.dark .grad,header.dark h1 em,header.dark .grad,.fund-cta .grad{background-image:linear-gradient(100deg,#C4EA6A 0%,#DCD775 50%,#F0B978 100%)}
}
header.dark{position:relative;isolation:isolate}
header.dark::before{content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;background:radial-gradient(55% 60% at 85% 20%,rgba(143,189,44,.22),transparent 70%),radial-gradient(45% 50% at 0% 100%,rgba(232,166,93,.12),transparent 70%)}
header.dark::after{content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;background-image:var(--grain);opacity:.06}
.hero-render{position:relative;margin-top:28px;border-radius:var(--r-lg);isolation:isolate}
.hero-render::before{content:"";position:absolute;inset:8% 10% -4%;z-index:-1;border-radius:50%;background:radial-gradient(closest-side,rgba(143,189,44,.35),transparent);}
.hero-render img{display:block;width:100%;height:auto;border-radius:var(--r-lg);border:1px solid var(--night-line)}