:root{
      --ink:#0E1F17; --forest:#15543a; --forest-deep:#10422d;
      --emerald:#008a4f; --emerald-bright:#1fb85f; --teal:#1fb0a6;
      --cream:#f7f5ee; --cream-2:#efece1; --paper:#ffffff;
      --line:#e3e0d4; --muted:#5d6b62; --muted-2:#8a9389;
      --y:#FFEC01; --b:#00B3FE; --p:#A259AE; --r:#FF4D59; --o:#FF952F; --lime:#78D156;
      --maxw:1180px; --radius:22px; --shadow:0 18px 50px -20px rgba(14,31,23,.28);
      --shadow-sm:0 8px 24px -12px rgba(14,31,23,.22);
      --c-red:#ff4d59; --c-orange:#ff952f; --c-yellow:#ffec01; --c-lime:#78d156;
      --c-green:#008a4f; --c-blue:#00b3fe; --c-purple:#a259ae; --c-teal:#1fb0a6;
      --cell-color:var(--c-green);
    }
    *{box-sizing:border-box;margin:0;padding:0}
    html{scroll-behavior:smooth}
    body{font-family:Inter,system-ui,sans-serif;color:var(--ink);background:var(--cream);line-height:1.6;-webkit-font-smoothing:antialiased;overflow-x:hidden}
    h1,h2,h3,h4,.display{font-family:Fustat,system-ui,sans-serif;line-height:1.08;letter-spacing:-.02em;font-weight:700}
    a{color:inherit;text-decoration:none}
    img{display:block;max-width:100%}
    section{position:relative}
    .wrap{max-width:var(--maxw);margin:0 auto;padding:0 24px}
    .eyebrow{font-size:.78rem;font-weight:700;letter-spacing:.18em;text-transform:uppercase;color:var(--emerald)}
    .eyebrow.on-dark{color:var(--emerald-bright)}
    .lead{font-size:1.18rem;color:var(--muted);max-width:46ch}
    .btn{display:inline-flex;align-items:center;gap:.5rem;font-weight:600;font-size:.97rem;padding:.85rem 1.5rem;border-radius:999px;border:1.5px solid transparent;transition:.22s ease;cursor:pointer;white-space:nowrap}
    .btn-primary{background:var(--emerald);color:#fff;box-shadow:0 10px 24px -10px rgba(0,138,79,.7)}
    .btn-primary:hover{background:var(--emerald-bright);transform:translateY(-2px)}
    .btn-ghost{border-color:rgba(255,255,255,.45);color:#fff}
    .btn-ghost:hover{background:rgba(255,255,255,.12)}
    .btn-dark{background:var(--ink);color:#fff}
    .btn-dark:hover{background:var(--forest);transform:translateY(-2px)}
    .btn-line{border-color:var(--line);color:var(--ink);background:#fff}
    .btn-line:hover{border-color:var(--emerald);color:var(--emerald)}

    /* reveal */
    .reveal{opacity:0;transform:translateY(26px);transition:opacity .7s cubic-bezier(.2,.7,.2,1),transform .7s cubic-bezier(.2,.7,.2,1)}
    .reveal.in{opacity:1;transform:none}
    .reveal.d1{transition-delay:.08s}.reveal.d2{transition-delay:.16s}.reveal.d3{transition-delay:.24s}.reveal.d4{transition-delay:.32s}

    /* NAV */
    header.nav{position:fixed;top:0;left:0;right:0;z-index:50;transition:.3s}
    .nav-inner{display:flex;align-items:center;justify-content:space-between;gap:1.5rem;padding:16px 24px;max-width:1280px;margin:0 auto}
    .nav.scrolled{background:rgba(247,245,238,.86);backdrop-filter:blur(14px);box-shadow:0 1px 0 var(--line)}
    .brand{display:flex;align-items:center;gap:.6rem;font-family:Fustat;font-weight:800;font-size:1.22rem;letter-spacing:-.02em}
    .brand svg{width:30px;height:30px}
    .nav-links{display:flex;align-items:center;gap:2rem;font-size:1.05rem;font-weight:500}
    .nav-links a{color:var(--ink);opacity:.82;transition:.2s}
    .nav-links a:hover{opacity:1;color:var(--emerald)}
    .nav-cta{display:flex;align-items:center;gap:.7rem}
    .burger{display:none;flex-direction:column;gap:5px;background:none;border:0;cursor:pointer;padding:6px}
    .burger span{width:24px;height:2px;background:var(--ink);border-radius:2px}

    /* HERO */
    .hero{min-height:100vh;display:flex;align-items:flex-end;position:relative;color:#fff;padding-bottom:64px}
    .hero-bg{position:absolute;inset:0;z-index:-2}
    .hero-bg img{width:100%;height:100%;object-fit:cover;object-position:center 38%}
    .hero-bg::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(14,31,23,.42) 0%,rgba(14,31,23,.12) 38%,rgba(14,31,23,.78) 100%)}
    .hero-content{max-width:var(--maxw);margin:0 auto;width:100%;padding:0 24px}
    .hero h1{font-size:clamp(2.7rem,6.4vw,5.3rem);font-weight:800;max-width:15ch;text-shadow:0 2px 30px rgba(0,0,0,.25)}
    .hero p.sub{font-size:clamp(1.05rem,1.6vw,1.32rem);max-width:52ch;margin-top:1.2rem;color:rgba(255,255,255,.92)}
    .hero-actions{display:flex;gap:.9rem;margin-top:2rem;flex-wrap:wrap}
    .hero-pill{display:inline-flex;align-items:center;gap:.55rem;background:rgba(255,255,255,.14);border:1px solid rgba(255,255,255,.28);backdrop-filter:blur(6px);padding:.5rem 1rem;border-radius:999px;font-size:.85rem;font-weight:600;margin-bottom:1.4rem}
    .hero-pill .dot{width:8px;height:8px;border-radius:50%;background:var(--emerald-bright);box-shadow:0 0 0 4px rgba(31,184,95,.3)}

    /* HERO 2 — restored animated-cell hero (light) */
    .hero2{position:relative;overflow-x:clip;overflow-y:visible;z-index:5;background:radial-gradient(100% 56% at 82% 4%,#e9f6ee 0%,rgba(238,244,248,.5) 30%,transparent 56%),linear-gradient(to bottom,#f3f7f3 0%,#f5f8f4 42%,#ffffff 72%);padding:98px 0 0}
    .hero2 .grid{display:grid;grid-template-columns:1.05fr .95fr;gap:36px;align-items:center;min-height:430px}
    .hero2 .orb{max-width:380px;position:relative;z-index:2}
    .hero2 .pill{display:inline-flex;align-items:center;gap:.55rem;background:rgba(255,255,255,.6);border:1px solid rgba(0,0,0,.05);backdrop-filter:blur(20px);box-shadow:inset 0 2px 3px rgba(255,255,255,.6),0 10px 30px -14px rgba(15,84,58,.25);padding:.5rem 1rem .5rem .85rem;border-radius:999px;font-size:.9rem;font-weight:500;color:var(--ink)}
    .hero2 .pill .chk{width:18px;height:18px;border-radius:50%;background:var(--forest);display:grid;place-items:center}
    .hero2 .pill .chk svg{width:11px;height:11px}
    .hero2 h1{font-size:clamp(34px,4.4vw,56px);font-weight:800;line-height:1.05;letter-spacing:-1.4px;color:var(--ink);margin-top:1.1rem}
    .hero2 h1 .grad{background:linear-gradient(to right,var(--forest-deep),var(--emerald),var(--b));-webkit-background-clip:text;background-clip:text;color:transparent;white-space:nowrap}
    .hero2 .sub{margin-top:.95rem;max-width:540px;font-size:17px;line-height:1.6;letter-spacing:-.2px;color:#475569}
    .hero2 .acts{display:flex;flex-wrap:wrap;gap:1rem;margin-top:1.5rem}
    .hero2 .stats{display:flex;flex-wrap:wrap;gap:2.2rem;margin-top:1.7rem}
    .hero2 .stats .n{font-family:Fustat;font-weight:800;font-size:2rem;letter-spacing:-.03em;color:var(--forest)}
    .hero2 .stats .l{font-size:.84rem;color:var(--muted);margin-top:.1rem}
    /* molecular cell-network backdrop (science feel) */
    @keyframes node-drift{0%,100%{transform:translate(0,0)}50%{transform:translate(var(--dx,10px),var(--dy,-12px))}}
    .molecules{position:absolute;inset:0;z-index:0;pointer-events:none;overflow:hidden}
    .molecules .ln{position:absolute;inset:0;width:100%;height:100%}
    .molecules .nd{position:absolute;width:7px;height:7px;border-radius:50%;background:var(--emerald-bright);opacity:.5;box-shadow:0 0 12px 2px rgba(31,184,95,.45);animation:node-drift 9s ease-in-out infinite}
    .hero2 .wrap{position:relative;z-index:2}
    .hero2 .orbcol{position:relative;display:grid;place-items:center}
    /* research credentials strip (mono / technical) */
    .techbar{margin-top:30px;display:flex;flex-wrap:wrap;gap:10px 26px;align-items:center;font-family:'JetBrains Mono','SF Mono',ui-monospace,monospace;font-size:.74rem;letter-spacing:.04em;color:var(--muted);border-top:1px solid var(--line);padding-top:18px;max-width:620px}
    .techbar b{color:var(--forest);font-weight:600}
    .techbar .sep{color:var(--emerald);opacity:.6}
    /* mono technical eyebrow */
    .eyebrow.tech{font-family:'JetBrains Mono','SF Mono',ui-monospace,monospace;letter-spacing:.12em}
    /* comparison table */
    .ctable-wrap{overflow-x:auto;margin-top:28px;border:1px solid var(--line);border-radius:var(--radius)}
    .comptable{width:100%;border-collapse:collapse;font-size:.95rem;min-width:640px}
    .comptable th,.comptable td{padding:15px 18px;text-align:left;border-bottom:1px solid var(--line)}
    .comptable tbody tr:last-child td{border-bottom:0}
    .comptable thead th{font-family:Fustat;font-weight:700;font-size:.92rem;color:var(--muted);background:var(--paper)}
    .comptable thead th.us{color:var(--forest);background:rgba(0,138,79,.08)}
    .comptable td:first-child,.comptable th:first-child{color:var(--ink);font-weight:600}
    .comptable td.us{background:rgba(0,138,79,.05);color:var(--forest-deep);font-weight:600}
    .comptable .x{color:var(--muted-2)}
    /* reference / citation note */
    .refnote{margin-top:22px;font-size:.82rem;color:var(--muted-2);line-height:1.65;max-width:80ch}
    .refnote a{color:var(--emerald);text-decoration:none}
    .refnote a:hover{text-decoration:underline}
    /* stat row for prevalence */
    .bigfact{display:flex;align-items:baseline;gap:.6rem;margin:.2rem 0 .6rem}
    .bigfact .v{font-family:Fustat;font-weight:800;font-size:2.4rem;color:var(--emerald);letter-spacing:-.02em;line-height:1}
    .bigfact .u{font-size:.9rem;color:var(--muted)}
    @keyframes pet-drift{0%,100%{transform:translate(0,0) scale(1)}25%{transform:translate(48px,-52px) scale(1.09)}50%{transform:translate(12px,-82px) scale(1)}75%{transform:translate(-40px,-30px) scale(.94)}}
    .hero-pet-wrap{position:absolute;bottom:0;left:0;width:24%;max-width:112px;aspect-ratio:1;z-index:1;will-change:transform;pointer-events:none}
    .hero-pet{width:100%;height:100%;object-fit:cover;border-radius:50%;border:5px solid #fff;box-shadow:0 24px 55px -16px rgba(14,31,23,.32);animation:pet-drift 7s ease-in-out infinite;display:block}
    .hero2 .petsrow{position:relative;width:100vw;margin-left:calc(50% - 50vw);background:#fff;margin-top:20px;padding:8px 24px 0;display:flex;justify-content:center}
    .hero2 .petsrow img{width:100%;max-width:840px;height:auto;object-fit:contain}

    /* STAT BAR */
    .statbar{background:var(--ink);color:#fff}
    .statbar .grid{display:grid;grid-template-columns:repeat(4,1fr);gap:1px;background:rgba(255,255,255,.1)}
    .statbar .cell{padding:34px 24px;background:var(--ink)}
    .statbar .num{font-family:Fustat;font-weight:800;font-size:clamp(2rem,3.6vw,2.9rem);letter-spacing:-.03em;color:var(--emerald-bright)}
    .statbar .lab{font-size:.86rem;color:rgba(255,255,255,.66);margin-top:.25rem;line-height:1.4}

    /* SECTION SHELL */
    .sec{padding:80px 0}
    .sec-head{max-width:62ch}
    .sec-head h2{font-size:clamp(2rem,4vw,3.05rem);margin:.7rem 0 1rem}
    .sec-head .lead{font-size:1.18rem}
    /* section head with a small accompanying image on the right */
    .head-split{display:grid;grid-template-columns:1fr 380px;gap:48px;align-items:center;margin-bottom:8px}
    .head-split .sec-head{margin:0}
    .head-split .head-img{aspect-ratio:4/3;width:100%}
    @media(max-width:880px){.head-split{grid-template-columns:1fr;gap:26px}.head-split .head-img{aspect-ratio:16/9;max-width:480px}}
    section.on-dark{background:var(--ink);color:#fff}
    .on-dark .lead{color:rgba(255,255,255,.72)}
    .on-dark .sec-head h2{color:#fff}
    .on-forest{background:var(--forest);color:#fff}
    .on-forest .lead{color:rgba(255,255,255,.8)}
    .alt{background:var(--cream-2)}

    /* CARDS */
    .cards{display:grid;gap:22px;margin-top:48px}
    .c3{grid-template-columns:repeat(3,1fr)}
    .c4{grid-template-columns:repeat(4,1fr)}
    .c2{grid-template-columns:repeat(2,1fr)}
    .card{background:var(--paper);border:1px solid var(--line);border-radius:var(--radius);padding:32px;transition:.28s;box-shadow:var(--shadow-sm);position:relative;transform-style:preserve-3d}
    .card:hover{transform:translateY(-4px);box-shadow:var(--shadow);border-color:#d7d3c4}
    .card.is-tilting{transition:transform .1s ease-out,box-shadow .28s,border-color .28s}
    .card::after{content:"";position:absolute;inset:0;border-radius:inherit;pointer-events:none;opacity:0;transition:opacity .35s ease;background:radial-gradient(440px circle at var(--mx,50%) var(--my,50%),rgba(31,184,95,.15),transparent 60%)}
    .card:hover::after{opacity:1}
    .on-dark .card::after{background:radial-gradient(440px circle at var(--mx,50%) var(--my,50%),rgba(91,227,154,.18),transparent 60%)}
    /* button shine sweep */
    .btn-primary,.btn-dark{position:relative;overflow:hidden}
    .btn-primary::after,.btn-dark::after{content:"";position:absolute;top:0;left:-75%;width:50%;height:100%;background:linear-gradient(100deg,transparent,rgba(255,255,255,.42),transparent);transform:skewX(-20deg);transition:left .6s ease;pointer-events:none}
    .btn-primary:hover::after,.btn-dark:hover::after{left:140%}
    .card .ico{width:50px;height:50px;border-radius:14px;display:grid;place-items:center;margin-bottom:18px;background:rgba(0,138,79,.1);color:var(--emerald)}
    .card h3{font-size:1.28rem;margin-bottom:.5rem}
    .card p{color:var(--muted);font-size:.97rem}
    .card .step-no{font-family:Fustat;font-weight:800;font-size:1.05rem;color:#fff;width:38px;height:38px;border-radius:50%;display:grid;place-items:center;background:var(--emerald);margin-bottom:16px}
    .on-dark .card{background:rgba(255,255,255,.04);border-color:rgba(255,255,255,.1)}
    .on-dark .card h3{color:#fff}
    .on-dark .card p{color:rgba(255,255,255,.66)}
    .on-dark .card .ico{background:rgba(31,184,95,.16);color:var(--emerald-bright)}

    .ico svg{width:26px;height:26px;stroke-width:1.7}

    /* SPLIT */
    .split{display:grid;grid-template-columns:1.05fr 1fr;gap:60px;align-items:center}
    .split.rev{grid-template-columns:1fr 1.05fr}
    .split .media{border-radius:var(--radius);overflow:hidden;box-shadow:var(--shadow);position:relative}
    .split .media img{width:100%;height:100%;object-fit:cover}

    /* PROBLEM list */
    .prob{display:grid;grid-template-columns:repeat(3,1fr);gap:22px;margin-top:48px}
    .prob .item{padding:30px;border-radius:var(--radius);background:var(--paper);border:1px solid var(--line)}
    .prob .item h3{font-size:1.18rem;margin:.4rem 0 .5rem;display:flex;align-items:center;gap:.5rem}
    .prob .item p{color:var(--muted);font-size:.96rem}
    .prob .tag{font-size:.72rem;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--r)}

    /* CONDITIONS */
    .cond-grid{display:grid;grid-template-columns:1fr 1fr;gap:24px;margin-top:40px}
    .cond-col{background:#fff;border:1px solid var(--line);border-radius:var(--radius);overflow:hidden;box-shadow:var(--shadow-sm)}
    .cond-col .head{display:flex;align-items:center;gap:16px;padding:20px 24px;border-bottom:1px solid var(--line);background:linear-gradient(180deg,rgba(0,138,79,.055),transparent)}
    .cond-col .head .pic{width:56px;height:56px;border-radius:50%;object-fit:cover;border:3px solid #fff;box-shadow:0 6px 18px -6px rgba(14,31,23,.35);flex:none}
    .cond-col .head h3{font-size:1.3rem;margin:0}
    .cond-col .head .cnt{margin-left:auto;font-size:.74rem;font-weight:600;color:var(--emerald);background:rgba(0,138,79,.1);padding:.34rem .74rem;border-radius:999px;white-space:nowrap}
    .cond-item{display:flex;align-items:center;gap:14px;padding:15px 24px;border-bottom:1px solid var(--line);text-decoration:none;transition:background .2s}
    .cond-item:last-child{border-bottom:0}
    .cond-item:hover{background:var(--paper)}
    .cond-item .ic{width:40px;height:40px;border-radius:12px;background:rgba(0,138,79,.09);color:var(--emerald);display:grid;place-items:center;flex:none;transition:.2s}
    .cond-item:hover .ic{background:var(--emerald);color:#fff}
    .cond-item .ic svg{width:20px;height:20px}
    .cond-item .tx{min-width:0}
    .cond-item .tx b{display:block;font-family:Fustat;font-weight:700;font-size:1.02rem;color:var(--ink);line-height:1.25}
    .cond-item .tx span{font-size:.84rem;color:var(--muted)}
    .cond-item .arr{margin-left:auto;color:var(--muted-2);flex:none;transition:.2s}
    .cond-item:hover .arr{color:var(--emerald);transform:translateX(3px)}

    /* CLINIC */
    .clinic-hero{border-radius:var(--radius);overflow:hidden;position:relative;box-shadow:var(--shadow);margin-top:44px}
    .clinic-hero img{width:100%;height:520px;object-fit:cover}
    .clinic-hero .badge{position:absolute;top:24px;left:24px;background:rgba(255,255,255,.92);backdrop-filter:blur(6px);border-radius:14px;padding:10px 18px;font-weight:700;font-size:.9rem;display:flex;align-items:center;gap:.5rem}
    .clinic-hero .coming-soon{position:absolute;top:24px;right:24px;z-index:2;font-family:Fustat;font-weight:800;font-size:.82rem;letter-spacing:.12em;text-transform:uppercase;color:#fff;background:linear-gradient(135deg,var(--emerald),var(--emerald-bright));padding:10px 18px;border-radius:999px;box-shadow:0 10px 28px -8px rgba(0,138,79,.7);animation:cs-pulse 2.4s ease-in-out infinite}
    @keyframes cs-pulse{0%,100%{transform:scale(1);box-shadow:0 10px 28px -8px rgba(0,138,79,.7)}50%{transform:scale(1.06);box-shadow:0 14px 34px -6px rgba(0,138,79,.9)}}
    .clinic-specs{display:grid;grid-template-columns:repeat(4,1fr);gap:18px;margin-top:24px}
    .spec{background:var(--paper);border:1px solid var(--line);border-radius:18px;padding:24px}
    .spec .big{font-family:Fustat;font-weight:800;font-size:1.9rem;color:var(--emerald);letter-spacing:-.02em}
    .spec .lab{font-size:.88rem;color:var(--muted);margin-top:.2rem}
    .facilities{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-top:18px}
    .facility{display:flex;align-items:flex-start;gap:.8rem;background:var(--paper);border:1px solid var(--line);border-radius:16px;padding:18px 20px}
    .facility .fi{color:var(--emerald);flex:none;margin-top:2px}
    .facility .fi svg{width:22px;height:22px}
    .facility b{font-size:.98rem;display:block}
    .facility span{font-size:.85rem;color:var(--muted)}

    /* 7 glass "cell" spheres in the brand-logo colours — translucent, glowing core (look like a stem cell), gently floating, spaced apart */
    /* 7 distinct drift paths so each cell moves in its own direction (small amplitude → never collide) */
    @keyframes bm1{0%,100%{transform:translate(0,0)}25%{transform:translate(-11px,-9px)}50%{transform:translate(-14px,3px)}75%{transform:translate(-5px,11px)}}     /* left / down-left */
    @keyframes bm2{0%,100%{transform:translate(0,0)}25%{transform:translate(11px,-8px)}50%{transform:translate(14px,6px)}75%{transform:translate(3px,12px)}}        /* clockwise */
    @keyframes bm3{0%,100%{transform:translate(0,0)}25%{transform:translate(10px,-11px)}50%{transform:translate(2px,-15px)}75%{transform:translate(-9px,-8px)}}     /* up / up-right */
    @keyframes bm4{0%,100%{transform:translate(0,0)}33%{transform:translate(5px,-14px)}66%{transform:translate(-5px,-6px)}}                                         /* mostly vertical */
    @keyframes bm5{0%,100%{transform:translate(0,0)}25%{transform:translate(-11px,8px)}50%{transform:translate(-14px,-4px)}75%{transform:translate(-6px,-12px)}}    /* counter-clockwise */
    @keyframes bm6{0%,100%{transform:translate(0,0)}25%{transform:translate(-9px,11px)}50%{transform:translate(5px,14px)}75%{transform:translate(12px,5px)}}        /* down / down-right */
    @keyframes bm7{0%,100%{transform:translate(0,0)}25%{transform:translate(12px,8px)}50%{transform:translate(7px,-9px)}75%{transform:translate(-7px,-12px)}}       /* diagonal sweep */
    @keyframes orb-glow-breathe{0%,100%{transform:scale(1);opacity:.5}50%{transform:scale(1.12);opacity:.8}}
    @keyframes core-pulse{0%,100%{opacity:.28}50%{opacity:.44}}
    .orb{position:relative;width:100%;max-width:480px;aspect-ratio:1;margin:0 auto}
    .orb .orb-glow{position:absolute;inset:6%;border-radius:50%;background:radial-gradient(circle,rgba(120,209,86,.20),rgba(0,138,79,.08) 55%,transparent 72%);filter:blur(40px);animation:orb-glow-breathe 6s ease-in-out infinite}
    .orb .balls{position:absolute;inset:0}
    .orb .ball{position:absolute;border-radius:50%;overflow:hidden;
      background-color:#0c3a2b;
      background-image:linear-gradient(var(--bc),var(--bc)),url(../img/cell-fast.png);
      background-size:cover,142%;
      background-position:center,center;
      background-repeat:no-repeat,no-repeat;
      background-blend-mode:color,normal;
      box-shadow:0 14px 30px -16px rgba(15,45,35,.42);
      filter:saturate(1.05) brightness(.9);
      animation:var(--bk,bob-a) var(--bd,6s) ease-in-out var(--bdelay,0s) infinite;will-change:transform}
    /* glassy water-bead overlay: refractive rim + top specular highlight */
    .orb .ball::after{content:"";position:absolute;inset:0;border-radius:50%;pointer-events:none;
      background:
        radial-gradient(circle at 38% 28%, rgba(255,255,255,.6) 0%, rgba(255,255,255,0) 22%),
        radial-gradient(circle at 68% 76%, rgba(255,255,255,.25) 0%, rgba(255,255,255,0) 20%),
        radial-gradient(circle at 50% 50%, rgba(255,255,255,0) 58%, rgba(255,255,255,.10) 78%, rgba(255,255,255,.42) 91%, rgba(255,255,255,.12) 97%, rgba(255,255,255,0) 100%);
      box-shadow:inset 0 0 16px rgba(255,255,255,.28),inset -5px -7px 16px rgba(0,0,0,.10)}
    .orb .b-yellow{left:24%;top:8%;width:24%;height:24%;--bc:#F4D63A;--bk:bm1;--bd:9s;--bdelay:-2s}
    .orb .b-blue{left:52%;top:8%;width:24%;height:24%;--bc:#43AEEA;--bk:bm2;--bd:11s;--bdelay:-5s}
    .orb .b-lime{left:10%;top:38%;width:24%;height:24%;--bc:#7AC24E;--bk:bm3;--bd:10s;--bdelay:-8s}
    .orb .b-green{left:38%;top:38%;width:24%;height:24%;--bc:#2F9A4E;--bk:bm4;--bd:11.5s;--bdelay:-3s;z-index:2}
    .orb .b-purple{left:66%;top:38%;width:24%;height:24%;--bc:#A24FB4;--bk:bm5;--bd:10.5s;--bdelay:-6s}
    .orb .b-orange{left:24%;top:68%;width:24%;height:24%;--bc:#F0922E;--bk:bm6;--bd:9.5s;--bdelay:-9s}
    .orb .b-red{left:52%;top:68%;width:24%;height:24%;--bc:#E94E4E;--bk:bm7;--bd:9s;--bdelay:-11s}
    /* HOME ONLY: cat-dog circle centred inside the orb, the 7 full-size cells ringed around it (same layer, no overlap) */
    .hero2 .orb .hero-pet-wrap{position:absolute;left:50%;top:50%;right:auto;bottom:auto;transform:translate(-50%,-50%);width:34%;max-width:none;z-index:1}
    .hero2 .b-yellow{left:38%;top:0%}
    .hero2 .b-blue{left:67.7%;top:14.3%}
    .hero2 .b-purple{left:75.1%;top:46.4%}
    .hero2 .b-red{left:54.5%;top:72.2%}
    .hero2 .b-orange{left:21.5%;top:72.2%}
    .hero2 .b-lime{left:0.9%;top:46.4%}
    .hero2 .b-green{left:8.3%;top:14.3%;z-index:auto}
    /* science: orb + paired pet */
    .sci-orb{position:relative;display:grid;place-items:center;min-height:420px}
    .sci-orb .orb{max-width:400px}
    .sci-pet{position:absolute;right:4%;bottom:4%;width:38%;max-width:172px;aspect-ratio:1;object-fit:cover;border-radius:50%;border:5px solid rgba(255,255,255,.14);box-shadow:0 22px 55px -16px rgba(0,0,0,.65)}
    .sci-link{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);font-family:Fustat;font-weight:700;font-size:.78rem;letter-spacing:.14em;text-transform:uppercase;color:rgba(255,255,255,.0)}

    /* CLINIC gallery */
    .gallery{display:grid;grid-template-columns:repeat(6,1fr);grid-auto-rows:200px;gap:16px;margin-top:24px}
    .gtile{position:relative;border-radius:18px;overflow:hidden;box-shadow:var(--shadow-sm)}
    .gtile img{width:100%;height:100%;object-fit:cover;transition:transform .5s ease}
    .gtile:hover img{transform:scale(1.06)}
    .gtile::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,transparent 45%,rgba(14,31,23,.72))}
    .gtile .cap{position:absolute;left:18px;bottom:16px;z-index:2;color:#fff}
    .gtile .cap b{font-family:Fustat;font-weight:700;font-size:1.05rem;display:block;line-height:1.2}
    .gtile .cap span{font-size:.8rem;opacity:.85}
    .gtile.wide{grid-column:span 3}.gtile.tall{grid-row:span 2}.gtile.span2{grid-column:span 2}

    /* EVIDENCE */
    .evid{display:grid;grid-template-columns:repeat(4,1fr);gap:20px;margin-top:48px}
    .evid .e{background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.12);border-radius:var(--radius);padding:30px}
    .evid .e .v{font-family:Fustat;font-weight:800;font-size:2.6rem;color:var(--emerald-bright);letter-spacing:-.03em}
    .evid .e h4{font-size:1.05rem;margin:.4rem 0 .35rem;color:#fff}
    .evid .e p{font-size:.88rem;color:rgba(255,255,255,.6)}

    /* PUBLICATION feature */
    .pub-feature{display:grid;grid-template-columns:.9fr 1.4fr;gap:0;border-radius:var(--radius);overflow:hidden;border:1px solid var(--line);box-shadow:var(--shadow);margin-top:44px;background:var(--paper)}
    .pub-feature .left{background:linear-gradient(155deg,var(--forest),var(--ink));color:#fff;padding:44px}
    .pub-feature .left .j{font-size:.78rem;letter-spacing:.14em;text-transform:uppercase;color:var(--emerald-bright);font-weight:700}
    .pub-feature .left h3{font-size:1.55rem;margin:1rem 0;line-height:1.2}
    .pub-feature .right{padding:44px}
    .pub-feature .right p.auth{color:var(--muted);font-style:italic;margin-bottom:1rem}
    .pub-feature .right .meta{font-size:.85rem;color:var(--muted-2);font-family:ui-monospace,Menlo,monospace;margin-top:1.2rem;padding-top:1.2rem;border-top:1px solid var(--line)}
    .pub-list{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin-top:24px}
    .pub-item{background:var(--paper);border:1px solid var(--line);border-radius:16px;padding:22px}
    .pub-item .src{font-size:.72rem;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--emerald)}
    .pub-item h4{font-size:1.02rem;margin:.4rem 0;line-height:1.3}
    .pub-item p{font-size:.85rem;color:var(--muted)}

    /* TEAM */
    .team{display:grid;grid-template-columns:repeat(4,1fr);gap:20px;margin-top:48px}
    .member{background:var(--paper);border:1px solid var(--line);border-radius:var(--radius);padding:28px;text-align:center;box-shadow:var(--shadow-sm);transition:.25s}
    .member:hover{transform:translateY(-4px);box-shadow:var(--shadow)}
    .member .av{width:74px;height:74px;border-radius:50%;margin:0 auto 16px;display:grid;place-items:center;font-family:Fustat;font-weight:800;font-size:1.5rem;color:#fff;background:linear-gradient(145deg,var(--emerald),var(--teal))}
    .member h4{font-size:1.1rem}
    .member .role{color:var(--emerald);font-weight:600;font-size:.86rem;margin:.2rem 0 .7rem}
    .member p{font-size:.85rem;color:var(--muted)}
    .adv .member .av{background:linear-gradient(145deg,var(--forest),var(--emerald))}

    /* PETS strip */
    .petstrip{background:var(--paper);padding:30px 0;border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
    .petstrip img{margin:0 auto;max-height:170px;width:auto}

    /* CTA */
    .cta{background:linear-gradient(150deg,var(--forest) 0%,var(--ink) 70%);color:#fff;text-align:center;overflow:hidden}
    .cta .wrap{position:relative;z-index:2}
    .cta h2{font-size:clamp(2.1rem,4.4vw,3.4rem);max-width:18ch;margin:0 auto 1rem}
    .cta p{color:rgba(255,255,255,.78);font-size:1.15rem;max-width:48ch;margin:0 auto 2rem}
    .cta-actions{display:flex;gap:1rem;justify-content:center;flex-wrap:wrap}
    .cells-bg{position:absolute;inset:0;z-index:1;opacity:.5}

    /* FOOTER */
    footer{background:var(--ink);color:rgba(255,255,255,.6);padding:64px 0 36px}
    .foot-grid{display:grid;grid-template-columns:1.6fr 1fr 1fr 1fr;gap:40px}
    footer .brand{color:#fff;margin-bottom:1rem}
    footer h5{color:#fff;font-size:.82rem;letter-spacing:.12em;text-transform:uppercase;margin-bottom:1rem;font-weight:700}
    footer a{display:block;padding:.3rem 0;font-size:.92rem;transition:.2s}
    footer a:hover{color:var(--emerald-bright)}
    .foot-bot{margin-top:48px;padding-top:24px;border-top:1px solid rgba(255,255,255,.12);display:flex;justify-content:space-between;flex-wrap:wrap;gap:1rem;font-size:.84rem}

    /* RESPONSIVE */
    @media(max-width:980px){
      .nav-links,.nav-cta .btn{display:none}
      .burger{display:flex}
      .nav-cta .btn.show-m{display:inline-flex}
      .statbar .grid{grid-template-columns:repeat(2,1fr)}
      .hero2{padding-top:104px}
      .hero2 .grid{grid-template-columns:1fr;gap:8px;min-height:auto}
      .hero2 .orbcol{order:-1}
      .hero2 .orb{max-width:315px}
      .hero2 .stats{gap:1.6rem}
      .sci-orb{min-height:340px}
      .c4,.c3{grid-template-columns:repeat(2,1fr)}
      .split,.split.rev{grid-template-columns:1fr;gap:32px}
      .prob{grid-template-columns:1fr}
      .cond-grid{grid-template-columns:1fr}
      .clinic-specs{grid-template-columns:repeat(2,1fr)}
      .facilities{grid-template-columns:1fr 1fr}
      .gallery{grid-template-columns:repeat(2,1fr);grid-auto-rows:170px}
      .gtile.span2,.gtile.wide{grid-column:span 1}
      .gtile.wide:last-child{grid-column:span 2}
      .evid{grid-template-columns:repeat(2,1fr)}
      .pub-feature{grid-template-columns:1fr}
      .pub-list{grid-template-columns:1fr 1fr!important}
      .steps{grid-template-columns:1fr 1fr!important}
      .team{grid-template-columns:repeat(2,1fr)}
      .foot-grid{grid-template-columns:1fr 1fr}
    }
    @media(max-width:560px){
      .sec{padding:64px 0}
      .c4,.c3,.c2,.facilities,.evid,.team,.clinic-specs{grid-template-columns:1fr}
      .statbar .grid{grid-template-columns:1fr 1fr}
      .clinic-hero img{height:300px}
      .gallery{grid-template-columns:1fr;grid-auto-rows:200px}
      .gtile.span2,.gtile.wide,.gtile.wide:last-child{grid-column:span 1}
      .foot-grid{grid-template-columns:1fr}
      /* override inline grid styles that don't collapse on phones */
      .pub-list{grid-template-columns:1fr!important}
      .steps{grid-template-columns:1fr!important}
    }
    .mobile-menu{display:none;position:fixed;inset:0;z-index:60;background:var(--ink);color:#fff;flex-direction:column;align-items:center;justify-content:center;gap:1.6rem;font-size:1.4rem;font-family:Fustat;font-weight:700}
    .mobile-menu.open{display:flex}
    .mobile-menu .close{position:absolute;top:24px;right:28px;font-size:2rem;background:none;border:0;color:#fff;cursor:pointer}

    /* ============ MULTI-PAGE additions ============ */
    /* nav active state */
    .nav-links a.active{color:var(--emerald);opacity:1;font-weight:600}
    /* sub-page header band */
    .subhero{position:relative;overflow:hidden;background:radial-gradient(120% 100% at 80% 0%,#e9f6ee 0%,#eef4f8 42%,#f7f5ee 78%);padding:124px 0 60px}
    .subhero .eyebrow{margin-bottom:.8rem}
    .subhero h1{font-size:clamp(2.1rem,4.2vw,3.3rem);font-weight:800;letter-spacing:-.02em;color:var(--ink);max-width:18ch}
    .subhero .orb{max-width:380px}
    .subhero .orbcol{min-height:auto!important}
    .subhero p{font-size:1.2rem;color:var(--muted);max-width:60ch;margin-top:1.1rem}
    .subhero .crumb{font-size:.85rem;color:var(--muted-2);font-weight:600;letter-spacing:.04em;margin-bottom:1rem}
    .subhero .crumb a{color:var(--emerald)}
    /* image that must not clash with bg — wrap in white rounded card */
    .imgcard{background:#fff;border:1px solid var(--line);border-radius:var(--radius);padding:18px;box-shadow:var(--shadow-sm)}
    .imgcard img{width:100%;border-radius:14px;display:block}
    /* full-bleed cover photo */
    .photo{border-radius:var(--radius);overflow:hidden;box-shadow:var(--shadow);position:relative;transition:transform .4s cubic-bezier(.2,.7,.2,1),box-shadow .4s ease}
    .photo img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .7s cubic-bezier(.2,.7,.2,1)}
    .split .photo{aspect-ratio:3/2;align-self:center}
    .photo.tall img{height:520px}
    .photo:hover{transform:translateY(-13px);box-shadow:0 32px 70px -24px rgba(14,31,23,.42)}
    .photo:hover img{transform:scale(1.13)}
    @media(hover:none){.photo:hover{transform:none}.photo:hover img{transform:none}}
    .photo .cap{position:absolute;left:20px;bottom:18px;color:#fff;z-index:2;font-weight:600;text-shadow:0 2px 12px rgba(0,0,0,.5)}
    .photo.shade::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,transparent 50%,rgba(14,31,23,.55))}
    /* prose / depth content */
    .prose{max-width:70ch}
    .prose p{color:var(--muted);font-size:1.05rem;margin-bottom:1.1rem}
    .prose h3{font-size:1.5rem;margin:1.6rem 0 .7rem}
    /* condition detail block */
    .cond-detail{display:grid;grid-template-columns:1.1fr 1fr;gap:40px;align-items:center;padding:40px 0;border-bottom:1px solid var(--line);scroll-margin-top:90px}
    .cond-detail:last-child{border-bottom:0}
    .cond-detail.rev{grid-template-columns:1fr 1.1fr}
    .cond-detail .tagrow{display:flex;gap:.5rem;flex-wrap:wrap;margin:.6rem 0 1rem}
    .pill-tag{font-size:.78rem;font-weight:600;padding:.3rem .8rem;border-radius:999px;background:rgba(0,138,79,.1);color:var(--emerald)}
    /* steps / what to expect */
    .steps{display:grid;grid-template-columns:repeat(4,1fr);gap:22px;margin-top:40px;counter-reset:s}
    .step{position:relative;padding:28px;background:var(--paper);border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow-sm)}
    .step .sn{font-family:Fustat;font-weight:800;font-size:1rem;color:#fff;width:36px;height:36px;border-radius:50%;background:var(--emerald);display:grid;place-items:center;margin-bottom:16px}
    .step h3{font-size:1.2rem;margin-bottom:.4rem}
    .step p{color:var(--muted);font-size:.95rem}
    /* simple feature split reused on pages */
    .pagewrap{padding-top:0}
    /* CTA strip reusable */
    .ctaband{background:linear-gradient(150deg,var(--forest),var(--ink));color:#fff;text-align:center;border-radius:var(--radius);padding:60px 24px;margin-top:24px}
    .ctaband h2{font-size:clamp(1.7rem,3.4vw,2.6rem);max-width:20ch;margin:0 auto 1rem}
    .ctaband p{color:rgba(255,255,255,.78);max-width:46ch;margin:0 auto 1.6rem}
    @media(max-width:980px){
      .cond-detail,.cond-detail.rev{grid-template-columns:1fr;gap:24px}
      .steps{grid-template-columns:repeat(2,1fr)}
      .subhero{padding:120px 0 56px}
    }
    @media(max-width:560px){ .steps{grid-template-columns:1fr} }

    /* ===== Phase 2: background motion (floating cells + aurora) ===== */
    .fx-layer{position:absolute;inset:0;overflow:hidden;pointer-events:none}
    .fx-aurora{position:absolute;inset:-25%;filter:blur(34px);background:
      radial-gradient(38% 38% at 28% 30%,rgba(31,184,95,.20),transparent 70%),
      radial-gradient(34% 34% at 74% 58%,rgba(0,179,254,.15),transparent 70%),
      radial-gradient(40% 40% at 58% 82%,rgba(120,209,86,.15),transparent 70%);
      animation:aurora-drift 11s ease-in-out infinite alternate}
    .fx-layer.dark .fx-aurora{opacity:.95;background:
      radial-gradient(38% 38% at 28% 30%,rgba(31,184,95,.30),transparent 70%),
      radial-gradient(34% 34% at 74% 58%,rgba(0,179,254,.18),transparent 70%),
      radial-gradient(40% 40% at 58% 82%,rgba(91,227,154,.20),transparent 70%)}
    @keyframes aurora-drift{0%{transform:translate(0,0) scale(1)}100%{transform:translate(9%,-7%) scale(1.25)}}
    .fx-cell{position:absolute;border-radius:50%;filter:blur(.5px);opacity:0;will-change:transform,opacity;
      background:radial-gradient(circle at 34% 30%,rgba(31,184,95,.45),rgba(31,184,95,.06) 70%);
      animation-name:cell-rise;animation-timing-function:ease-in-out;animation-iteration-count:infinite}
    .fx-layer.dark .fx-cell{background:radial-gradient(circle at 34% 30%,rgba(91,227,154,.5),rgba(91,227,154,.05) 70%)}
    @keyframes cell-rise{0%{opacity:0;transform:translate(0,30px) scale(.8)}15%{opacity:.7}50%{transform:translate(20px,-48px) scale(1.18)}85%{opacity:.55}100%{opacity:0;transform:translate(-14px,-128px) scale(.85)}}
    @media (prefers-reduced-motion: reduce){.fx-layer{display:none}}

    /* ===== Phase 2: hero text entrance + gradient flow ===== */
    @keyframes blur-rise{from{opacity:0;transform:translateY(18px);filter:blur(9px)}to{opacity:1;transform:none;filter:blur(0)}}
    .hero2 h1{animation:blur-rise .85s .05s both}
    .hero2 .sub{animation:blur-rise .85s .2s both}
    .hero2 .acts{animation:blur-rise .85s .34s both}
    .hero2 .stats{animation:blur-rise .85s .46s both}
    @keyframes grad-flow{0%,100%{background-position:0% 50%}50%{background-position:100% 50%}}
    .hero2 h1 .grad{background-size:220% 100%;animation:grad-flow 3.5s ease-in-out infinite}
    @media (prefers-reduced-motion: reduce){.hero2 h1,.hero2 .sub,.hero2 .acts,.hero2 .stats{animation:none}.hero2 h1 .grad{animation:none}}

    /* ===== reactbits-style: Glare Hover on images ===== */
    .photo::before,.gtile::before{content:"";position:absolute;inset:0;z-index:3;pointer-events:none;border-radius:inherit;
      background:linear-gradient(115deg,transparent 32%,rgba(255,255,255,.40) 48%,transparent 64%);
      transform:translateX(-130%) skewX(-12deg);transition:transform .85s cubic-bezier(.2,.7,.2,1)}
    .photo:hover::before,.gtile:hover::before{transform:translateX(130%) skewX(-12deg)}
    @media (prefers-reduced-motion: reduce){.photo::before,.gtile::before{display:none}}

    /* ===== reactbits-style: Star Border on primary CTA ===== */
    @property --sb{syntax:"<angle>";inherits:false;initial-value:0deg}
    .btn-primary::before{content:"";position:absolute;inset:0;border-radius:inherit;padding:1.7px;pointer-events:none;opacity:0;transition:opacity .35s;
      background:conic-gradient(from var(--sb),transparent 0 60%,#7bf0b0 76%,#ffffff 84%,#7bf0b0 92%,transparent 100%);
      -webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask-composite:exclude}
    .btn-primary:hover::before{opacity:1;animation:sb-rot 1.4s linear infinite}
    @keyframes sb-rot{to{--sb:360deg}}
    @media (prefers-reduced-motion: reduce){.btn-primary::before{display:none}}

    /* ===== reactbits-style: credential marquee (Logo Loop) ===== */
    .marquee{overflow:hidden;background:var(--ink);padding:15px 0;white-space:nowrap;position:relative}
    .marquee::before,.marquee::after{content:"";position:absolute;top:0;bottom:0;width:90px;z-index:2;pointer-events:none}
    .marquee::before{left:0;background:linear-gradient(90deg,var(--ink),transparent)}
    .marquee::after{right:0;background:linear-gradient(270deg,var(--ink),transparent)}
    .marquee-track{display:inline-flex;animation:marquee 18s linear infinite;will-change:transform}
    .marquee:hover .marquee-track{animation-play-state:paused}
    .marquee .item{display:inline-flex;align-items:center;gap:14px;padding:0 30px;font-family:'JetBrains Mono','SF Mono',ui-monospace,monospace;font-size:.82rem;letter-spacing:.1em;text-transform:uppercase;color:rgba(255,255,255,.82)}
    .marquee .item b{color:#fff;font-weight:600}
    .marquee .item .d{color:var(--emerald-bright);font-size:1.1em}
    @keyframes marquee{to{transform:translateX(-50%)}}
    @media (prefers-reduced-motion: reduce){.marquee-track{animation:none}}

    /* ===== devraj-style: big scrolling CTA marquee (above footer) ===== */
    .bigcta{display:block;overflow:hidden;white-space:nowrap;text-decoration:none;background:linear-gradient(180deg,#ffffff,#eef3ee);border-top:1px solid var(--line);padding:clamp(16px,2.2vw,26px) 0}
    .bigcta-track{display:inline-flex;align-items:center;animation:marquee 26s linear infinite;will-change:transform}
    .bigcta:hover .bigcta-track{animation-play-state:paused}
    .bigcta .t{font-family:Fustat;font-weight:800;font-size:clamp(1.05rem,2vw,1.7rem);letter-spacing:-.03em;line-height:1;padding:0 .12em;color:var(--ink);transition:color .35s ease;display:inline-flex;align-items:center}
    .bigcta .s{color:var(--emerald);font-weight:400;padding:0 .25em;transition:transform .35s ease}
    .bigcta:hover .t{color:var(--emerald)}
    .bigcta:hover .s{color:var(--emerald-bright)}
    @media (prefers-reduced-motion:reduce){.bigcta-track{animation:none}}

    /* ===== React Bits: BorderGlow (vanilla port, brand-colored) ===== */
    .border-glow-card{
      --edge-proximity:0; --cursor-angle:45deg; --edge-sensitivity:30;
      --color-sensitivity:calc(var(--edge-sensitivity) + 20);
      --border-radius:22px; --glow-padding:40px; --cone-spread:25; --fill-opacity:.5;
      --card-bg:#0e1f17;
      --glow-color:hsl(150deg 80% 55% / 100%);--glow-color-60:hsl(150deg 80% 55% / 60%);--glow-color-50:hsl(150deg 80% 55% / 50%);--glow-color-40:hsl(150deg 80% 55% / 40%);--glow-color-30:hsl(150deg 80% 55% / 30%);--glow-color-20:hsl(150deg 80% 55% / 20%);--glow-color-10:hsl(150deg 80% 55% / 10%);
      --gradient-one:radial-gradient(at 80% 55%,#1fb85f 0px,transparent 50%);
      --gradient-two:radial-gradient(at 69% 34%,#00b3fe 0px,transparent 50%);
      --gradient-three:radial-gradient(at 8% 6%,#5be39a 0px,transparent 50%);
      --gradient-four:radial-gradient(at 41% 38%,#1fb85f 0px,transparent 50%);
      --gradient-five:radial-gradient(at 86% 85%,#00b3fe 0px,transparent 50%);
      --gradient-six:radial-gradient(at 82% 18%,#5be39a 0px,transparent 50%);
      --gradient-seven:radial-gradient(at 51% 4%,#00b3fe 0px,transparent 50%);
      --gradient-base:linear-gradient(#1fb85f 0 100%);
      position:relative;border-radius:var(--border-radius);isolation:isolate;transform:translate3d(0,0,.01px);display:grid;border:1px solid rgb(255 255 255 / 12%);background:var(--card-bg);overflow:visible}
    .border-glow-card::before,.border-glow-card::after,.border-glow-card>.edge-light{content:"";position:absolute;inset:0;border-radius:inherit;transition:opacity .25s ease-out;z-index:-1}
    .border-glow-card:not(:hover)::before,.border-glow-card:not(:hover)::after,.border-glow-card:not(:hover)>.edge-light{opacity:0;transition:opacity .75s ease-in-out}
    .border-glow-card::before{border:1px solid transparent;background:
      linear-gradient(var(--card-bg) 0 100%) padding-box,
      linear-gradient(rgb(255 255 255 / 0%) 0 100%) border-box,
      var(--gradient-one) border-box,var(--gradient-two) border-box,var(--gradient-three) border-box,var(--gradient-four) border-box,var(--gradient-five) border-box,var(--gradient-six) border-box,var(--gradient-seven) border-box,var(--gradient-base) border-box;
      opacity:calc((var(--edge-proximity) - var(--color-sensitivity)) / (100 - var(--color-sensitivity)));
      -webkit-mask-image:conic-gradient(from var(--cursor-angle) at center,black calc(var(--cone-spread)*1%),transparent calc((var(--cone-spread) + 15)*1%),transparent calc((100 - var(--cone-spread) - 15)*1%),black calc((100 - var(--cone-spread))*1%));
      mask-image:conic-gradient(from var(--cursor-angle) at center,black calc(var(--cone-spread)*1%),transparent calc((var(--cone-spread) + 15)*1%),transparent calc((100 - var(--cone-spread) - 15)*1%),black calc((100 - var(--cone-spread))*1%))}
    .border-glow-card>.edge-light{inset:calc(var(--glow-padding)*-1);pointer-events:none;z-index:1;
      -webkit-mask-image:conic-gradient(from var(--cursor-angle) at center,black 2.5%,transparent 10%,transparent 90%,black 97.5%);
      mask-image:conic-gradient(from var(--cursor-angle) at center,black 2.5%,transparent 10%,transparent 90%,black 97.5%);
      opacity:calc((var(--edge-proximity) - var(--edge-sensitivity)) / (100 - var(--edge-sensitivity)));mix-blend-mode:plus-lighter}
    .border-glow-card>.edge-light::before{content:"";position:absolute;inset:var(--glow-padding);border-radius:inherit;
      box-shadow:inset 0 0 0 1px var(--glow-color),inset 0 0 1px 0 var(--glow-color-60),inset 0 0 3px 0 var(--glow-color-50),inset 0 0 6px 0 var(--glow-color-40),inset 0 0 15px 0 var(--glow-color-30),inset 0 0 25px 2px var(--glow-color-20),inset 0 0 50px 2px var(--glow-color-10),0 0 1px 0 var(--glow-color-60),0 0 3px 0 var(--glow-color-50),0 0 6px 0 var(--glow-color-40),0 0 15px 0 var(--glow-color-30),0 0 25px 2px var(--glow-color-20),0 0 50px 2px var(--glow-color-10)}
    .border-glow-inner{display:flex;flex-direction:column;position:relative;z-index:1}
    /* CTA band → border-glow look */
    .ctaband.border-glow-card{background:#0e1f17;padding:0}
    .ctaband.border-glow-card .border-glow-inner{padding:clamp(44px,5vw,62px) 24px;align-items:center;text-align:center}

    /* Prism WebGL background layer */
    .prism-bg{position:absolute;inset:0;z-index:0;pointer-events:none;overflow:hidden}
    /* dark scrim over the prism so headings/cards stay readable */
    .prism-bg::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(7,20,13,.62),rgba(7,20,13,.5) 45%,rgba(7,20,13,.66));pointer-events:none}
    .has-prism{position:relative}
    .has-prism>.wrap{position:relative;z-index:1}
    /* solid-ish backing on the glass panels that sit over a prism */
    .has-prism .card{background:rgba(9,22,15,.66);backdrop-filter:blur(3px);-webkit-backdrop-filter:blur(3px)}
    .has-prism .evid .e{background:rgba(9,22,15,.62);backdrop-filter:blur(3px);-webkit-backdrop-filter:blur(3px)}

    /* ===== team/member tech-feel: spotlight + tilt + avatar ring ===== */
    .member{position:relative;transform-style:preserve-3d}
    .member.is-tilting{transition:transform .1s ease-out,box-shadow .25s}
    .member::after{content:"";position:absolute;inset:0;border-radius:inherit;pointer-events:none;opacity:0;transition:opacity .35s ease;background:radial-gradient(380px circle at var(--mx,50%) var(--my,50%),rgba(31,184,95,.14),transparent 60%)}
    .member:hover::after{opacity:1}
    .member .av{position:relative;isolation:isolate}
    .member .av::before{content:"";position:absolute;inset:-3px;border-radius:50%;z-index:-1;background:conic-gradient(from var(--sb,0deg),#1fb85f,#00b3fe,#5be39a,#1fb85f);opacity:.4;transition:opacity .35s ease;animation:sb-rot 2.2s linear infinite}
    .member:hover .av::before{opacity:1}
    @media (prefers-reduced-motion: reduce){.member .av::before{animation:none}}

    /* ===== React Bits: Magic Bento (vanilla) ===== */
    .magic-bento{position:relative}
    .magic-bento .card{background:#0e1f17;border:1px solid rgba(255,255,255,.10);color:#fff;position:relative;overflow:hidden;z-index:1}
    .magic-bento .card h3{color:#fff}
    .magic-bento .card p{color:rgba(255,255,255,.66)}
    .magic-bento .card .ico{background:rgba(31,184,95,.18);color:var(--emerald-bright)}
    .magic-bento .card:hover{border-color:rgba(31,184,95,.4)}
    .magic-bento .card::before{content:"";position:absolute;inset:0;border-radius:inherit;padding:1.5px;pointer-events:none;opacity:var(--glow,0);transition:opacity .4s ease;
      background:radial-gradient(340px circle at var(--gx,50%) var(--gy,50%),rgba(31,184,95,.95),transparent 60%);
      -webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask-composite:exclude;z-index:2}
    .magic-bento .card::after{content:"";position:absolute;inset:0;border-radius:inherit;pointer-events:none;opacity:var(--glow,0);transition:opacity .4s ease;
      background:radial-gradient(340px circle at var(--gx,50%) var(--gy,50%),rgba(31,184,95,.16),transparent 60%);z-index:0}
    .bento-spotlight{position:absolute;width:560px;height:560px;border-radius:50%;pointer-events:none;z-index:3;opacity:0;transform:translate(-50%,-50%);transition:opacity .4s ease;mix-blend-mode:screen;background:radial-gradient(circle,rgba(31,184,95,.12),transparent 62%);will-change:transform,opacity}
    .bento-particle{position:absolute;width:4px;height:4px;border-radius:50%;background:var(--emerald-bright);box-shadow:0 0 7px var(--emerald-bright);pointer-events:none;z-index:4}
    .bento-ripple{position:absolute;border-radius:50%;pointer-events:none;z-index:4;background:radial-gradient(circle,rgba(31,184,95,.4),transparent 70%);transform:translate(-50%,-50%)}
    @media (prefers-reduced-motion: reduce){.bento-spotlight{display:none}}

    /* Magic Bento — generic (works on any card grid, keeps card bg) */
    .magic-bento > *{position:relative;overflow:hidden;z-index:1}
    .magic-bento > *::before{content:"";position:absolute;inset:0;border-radius:inherit;padding:1.5px;pointer-events:none;opacity:var(--glow,0);transition:opacity .4s ease;background:radial-gradient(340px circle at var(--gx,50%) var(--gy,50%),rgba(31,184,95,.85),transparent 60%);-webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask-composite:exclude;z-index:3}
    .magic-bento > *::after{content:"";position:absolute;inset:0;border-radius:inherit;pointer-events:none;opacity:calc(var(--glow,0)*.65);transition:opacity .4s ease;background:radial-gradient(340px circle at var(--gx,50%) var(--gy,50%),rgba(31,184,95,.11),transparent 60%);z-index:0}
    .magic-bento .bento-spotlight{mix-blend-mode:normal;background:radial-gradient(circle,rgba(31,184,95,.10),transparent 62%)}

    /* ===== on-dark content overrides (for converting light sections to dark) ===== */
    .on-dark .eyebrow{color:var(--emerald-bright)}
    .on-dark h2,.on-dark h3,.on-dark h4{color:#fff}
    .on-dark .lead,.on-dark .sec-head p,.on-dark p.lead{color:rgba(255,255,255,.74)}
    .on-dark .prose p{color:rgba(255,255,255,.74)}
    .on-dark .prose h3,.on-dark .prose b{color:#fff}
    .on-dark .step{background:rgba(255,255,255,.05);border-color:rgba(255,255,255,.12)}
    .on-dark .step h3{color:#fff}.on-dark .step p{color:rgba(255,255,255,.66)}
    .on-dark .item{background:rgba(255,255,255,.05);border-color:rgba(255,255,255,.12)}
    .on-dark .item h3{color:#fff}.on-dark .item p{color:rgba(255,255,255,.68)}
    .on-dark .bigfact .v{color:var(--emerald-bright)}.on-dark .bigfact .u{color:rgba(255,255,255,.6)}
    .on-dark .pill-tag{background:rgba(31,184,95,.2);color:#7bf0b0}
    /* dark subhero variant */
    .subhero.dark{background:radial-gradient(115% 95% at 80% 0%,#15402e 0%,#0e2a1e 45%,#0b1712 80%)}
    .subhero.dark h1{color:#fff}
    .subhero.dark p{color:rgba(255,255,255,.74)}
    .subhero.dark .eyebrow{color:var(--emerald-bright)}
    .subhero.dark .crumb{color:rgba(255,255,255,.5)}.subhero.dark .crumb a{color:var(--emerald-bright)}
    /* dark hero under the nav → make nav legible (white) until the nav gains its light background on scroll */
    .dark-top .nav:not(.scrolled) .brand{color:#fff}
    .dark-top .nav:not(.scrolled) .nav-links a{color:#fff;opacity:.92}
    .dark-top .nav:not(.scrolled) .nav-links a:hover{color:var(--emerald-bright);opacity:1}
    .dark-top .nav:not(.scrolled) .nav-links a.active{color:var(--emerald-bright);opacity:1}
    .dark-top .nav:not(.scrolled) .burger span{background:#fff}
    .on-dark .refnote{color:rgba(255,255,255,.5)}
    .on-dark .refnote em{color:rgba(255,255,255,.72)}
    .on-dark .refnote a{color:var(--emerald-bright)}
    /* fix: keep bento spotlight out of grid flow (was overridden to relative) */
    .magic-bento .bento-spotlight{position:absolute}
    .magic-bento > .bento-spotlight::before,.magic-bento > .bento-spotlight::after{display:none}