
/* ── Immersive scroll helix (GSAP + CSS 3D, no WebGL) ── */
.helix-sec{height:500vh;position:relative}
.helix-stage{height:100vh;overflow:hidden;position:relative;background:#06060a}
.helix-bg{position:absolute;inset:-25%;background:radial-gradient(55% 45% at 72% 28%,rgba(247,144,7,.16),transparent 60%),radial-gradient(45% 40% at 22% 72%,rgba(255,106,61,.10),transparent 60%),#06060a}
.helix-bg::before{content:"";position:absolute;inset:0;background-image:radial-gradient(1px 1px at 39.5% 4.8%,#fff,transparent),radial-gradient(1px 1px at 58.3% 91.0%,#fff,transparent),radial-gradient(1px 1px at 8.6% 41.8%,#fff,transparent),radial-gradient(1px 1px at 55.1% 5.9%,#fff,transparent),radial-gradient(1px 1px at 63.1% 58.3%,#fff,transparent),radial-gradient(1px 2px at 5.0% 22.1%,#fff,transparent),radial-gradient(1px 1px at 41.9% 54.1%,#fff,transparent),radial-gradient(1px 1px at 10.3% 57.1%,#fff,transparent),radial-gradient(1px 1px at 9.7% 71.2%,#fff,transparent),radial-gradient(1px 1px at 49.6% 53.2%,#fff,transparent),radial-gradient(1px 2px at 58.6% 45.3%,#fff,transparent),radial-gradient(1px 1px at 79.4% 69.9%,#fff,transparent),radial-gradient(1px 1px at 57.4% 52.5%,#fff,transparent),radial-gradient(1px 2px at 28.8% 98.0%,#fff,transparent),radial-gradient(1px 2px at 16.5% 34.2%,#fff,transparent),radial-gradient(2px 2px at 3.9% 66.8%,#fff,transparent),radial-gradient(1px 1px at 69.5% 59.4%,#fff,transparent),radial-gradient(2px 1px at 84.0% 94.5%,#fff,transparent),radial-gradient(2px 1px at 6.1% 70.1%,#fff,transparent),radial-gradient(2px 1px at 71.7% 88.7%,#fff,transparent),radial-gradient(1px 1px at 94.1% 35.5%,#fff,transparent),radial-gradient(1px 2px at 5.9% 76.8%,#fff,transparent),radial-gradient(1px 1px at 39.8% 91.7%,#fff,transparent),radial-gradient(2px 1px at 16.6% 40.2%,#fff,transparent),radial-gradient(1px 1px at 81.9% 86.4%,#fff,transparent),radial-gradient(1px 2px at 98.6% 68.3%,#fff,transparent),radial-gradient(2px 1px at 15.1% 17.6%,#fff,transparent),radial-gradient(1px 1px at 1.2% 83.1%,#fff,transparent),radial-gradient(1px 1px at 28.2% 14.6%,#fff,transparent),radial-gradient(1px 1px at 95.3% 69.0%,#fff,transparent),radial-gradient(1px 2px at 90.0% 78.0%,#fff,transparent),radial-gradient(2px 2px at 39.9% 10.4%,#fff,transparent),radial-gradient(2px 1px at 19.1% 98.5%,#fff,transparent),radial-gradient(2px 1px at 11.0% 60.1%,#fff,transparent),radial-gradient(1px 1px at 56.7% 53.7%,#fff,transparent),radial-gradient(1px 1px at 7.0% 20.8%,#fff,transparent),radial-gradient(2px 1px at 63.4% 95.5%,#fff,transparent),radial-gradient(1px 2px at 12.3% 84.9%,#fff,transparent),radial-gradient(2px 2px at 48.4% 8.6%,#fff,transparent),radial-gradient(1px 1px at 74.0% 47.9%,#fff,transparent),radial-gradient(1px 1px at 20.5% 95.2%,#fff,transparent),radial-gradient(1px 1px at 69.0% 91.4%,#fff,transparent),radial-gradient(1px 1px at 69.6% 26.1%,#fff,transparent),radial-gradient(1px 1px at 35.6% 22.3%,#fff,transparent),radial-gradient(1px 1px at 61.3% 78.8%,#fff,transparent),radial-gradient(1px 1px at 81.8% 74.0%,#fff,transparent),radial-gradient(1px 1px at 51.8% 35.6%,#fff,transparent),radial-gradient(1px 1px at 79.0% 47.2%,#fff,transparent),radial-gradient(1px 1px at 44.7% 93.7%,#fff,transparent),radial-gradient(1px 1px at 8.1% 10.2%,#fff,transparent),radial-gradient(2px 1px at 33.8% 48.3%,#fff,transparent),radial-gradient(1px 2px at 90.9% 34.4%,#fff,transparent),radial-gradient(1px 1px at 91.0% 78.2%,#fff,transparent),radial-gradient(1px 2px at 88.9% 43.4%,#fff,transparent),radial-gradient(1px 1px at 80.1% 97.2%,#fff,transparent),radial-gradient(2px 2px at 40.1% 94.7%,#fff,transparent),radial-gradient(1px 1px at 99.3% 2.8%,#fff,transparent),radial-gradient(2px 1px at 61.2% 59.6%,#fff,transparent),radial-gradient(2px 1px at 15.6% 54.8%,#fff,transparent),radial-gradient(1px 1px at 79.9% 72.6%,#fff,transparent),radial-gradient(1px 1px at 43.4% 87.2%,#fff,transparent),radial-gradient(1px 1px at 25.2% 29.3%,#fff,transparent),radial-gradient(1px 1px at 25.9% 41.9%,#fff,transparent),radial-gradient(1px 1px at 91.0% 35.4%,#fff,transparent),radial-gradient(2px 2px at 82.7% 87.8%,#fff,transparent),radial-gradient(1px 1px at 52.4% 1.9%,#fff,transparent),radial-gradient(2px 1px at 60.9% 77.6%,#fff,transparent),radial-gradient(1px 1px at 14.2% 61.9%,#fff,transparent),radial-gradient(1px 1px at 32.6% 51.8%,#fff,transparent),radial-gradient(2px 1px at 88.3% 5.7%,#fff,transparent);opacity:.55}
.helix-bg::after{content:"";position:absolute;inset:0;background-image:radial-gradient(1px 1px at 39.5% 4.8%,#fff,transparent),radial-gradient(1px 1px at 58.3% 91.0%,#fff,transparent),radial-gradient(1px 1px at 8.6% 41.8%,#fff,transparent),radial-gradient(1px 1px at 55.1% 5.9%,#fff,transparent),radial-gradient(1px 1px at 63.1% 58.3%,#fff,transparent),radial-gradient(1px 2px at 5.0% 22.1%,#fff,transparent),radial-gradient(1px 1px at 41.9% 54.1%,#fff,transparent),radial-gradient(1px 1px at 10.3% 57.1%,#fff,transparent),radial-gradient(1px 1px at 9.7% 71.2%,#fff,transparent),radial-gradient(1px 1px at 49.6% 53.2%,#fff,transparent),radial-gradient(1px 2px at 58.6% 45.3%,#fff,transparent),radial-gradient(1px 1px at 79.4% 69.9%,#fff,transparent),radial-gradient(1px 1px at 57.4% 52.5%,#fff,transparent),radial-gradient(1px 2px at 28.8% 98.0%,#fff,transparent),radial-gradient(1px 2px at 16.5% 34.2%,#fff,transparent),radial-gradient(2px 2px at 3.9% 66.8%,#fff,transparent),radial-gradient(1px 1px at 69.5% 59.4%,#fff,transparent),radial-gradient(2px 1px at 84.0% 94.5%,#fff,transparent),radial-gradient(2px 1px at 6.1% 70.1%,#fff,transparent),radial-gradient(2px 1px at 71.7% 88.7%,#fff,transparent),radial-gradient(1px 1px at 94.1% 35.5%,#fff,transparent),radial-gradient(1px 2px at 5.9% 76.8%,#fff,transparent),radial-gradient(1px 1px at 39.8% 91.7%,#fff,transparent),radial-gradient(2px 1px at 16.6% 40.2%,#fff,transparent),radial-gradient(1px 1px at 81.9% 86.4%,#fff,transparent),radial-gradient(1px 2px at 98.6% 68.3%,#fff,transparent),radial-gradient(2px 1px at 15.1% 17.6%,#fff,transparent),radial-gradient(1px 1px at 1.2% 83.1%,#fff,transparent),radial-gradient(1px 1px at 28.2% 14.6%,#fff,transparent),radial-gradient(1px 1px at 95.3% 69.0%,#fff,transparent),radial-gradient(1px 2px at 90.0% 78.0%,#fff,transparent),radial-gradient(2px 2px at 39.9% 10.4%,#fff,transparent),radial-gradient(2px 1px at 19.1% 98.5%,#fff,transparent),radial-gradient(2px 1px at 11.0% 60.1%,#fff,transparent),radial-gradient(1px 1px at 56.7% 53.7%,#fff,transparent),radial-gradient(1px 1px at 7.0% 20.8%,#fff,transparent),radial-gradient(2px 1px at 63.4% 95.5%,#fff,transparent),radial-gradient(1px 2px at 12.3% 84.9%,#fff,transparent),radial-gradient(2px 2px at 48.4% 8.6%,#fff,transparent),radial-gradient(1px 1px at 74.0% 47.9%,#fff,transparent),radial-gradient(1px 1px at 20.5% 95.2%,#fff,transparent),radial-gradient(1px 1px at 69.0% 91.4%,#fff,transparent),radial-gradient(1px 1px at 69.6% 26.1%,#fff,transparent),radial-gradient(1px 1px at 35.6% 22.3%,#fff,transparent),radial-gradient(1px 1px at 61.3% 78.8%,#fff,transparent),radial-gradient(1px 1px at 81.8% 74.0%,#fff,transparent),radial-gradient(1px 1px at 51.8% 35.6%,#fff,transparent),radial-gradient(1px 1px at 79.0% 47.2%,#fff,transparent),radial-gradient(1px 1px at 44.7% 93.7%,#fff,transparent),radial-gradient(1px 1px at 8.1% 10.2%,#fff,transparent),radial-gradient(2px 1px at 33.8% 48.3%,#fff,transparent),radial-gradient(1px 2px at 90.9% 34.4%,#fff,transparent),radial-gradient(1px 1px at 91.0% 78.2%,#fff,transparent),radial-gradient(1px 2px at 88.9% 43.4%,#fff,transparent),radial-gradient(1px 1px at 80.1% 97.2%,#fff,transparent),radial-gradient(2px 2px at 40.1% 94.7%,#fff,transparent),radial-gradient(1px 1px at 99.3% 2.8%,#fff,transparent),radial-gradient(2px 1px at 61.2% 59.6%,#fff,transparent),radial-gradient(2px 1px at 15.6% 54.8%,#fff,transparent),radial-gradient(1px 1px at 79.9% 72.6%,#fff,transparent),radial-gradient(1px 1px at 43.4% 87.2%,#fff,transparent),radial-gradient(1px 1px at 25.2% 29.3%,#fff,transparent),radial-gradient(1px 1px at 25.9% 41.9%,#fff,transparent),radial-gradient(1px 1px at 91.0% 35.4%,#fff,transparent),radial-gradient(2px 2px at 82.7% 87.8%,#fff,transparent),radial-gradient(1px 1px at 52.4% 1.9%,#fff,transparent),radial-gradient(2px 1px at 60.9% 77.6%,#fff,transparent),radial-gradient(1px 1px at 14.2% 61.9%,#fff,transparent),radial-gradient(1px 1px at 32.6% 51.8%,#fff,transparent),radial-gradient(2px 1px at 88.3% 5.7%,#fff,transparent);opacity:.3;transform:scale(1.6)}
.helix-scene{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;perspective:1050px}
.helix-core{position:relative;transform-style:preserve-3d;width:1px;height:1px;will-change:transform}
.helix-node{position:absolute;left:-115px;top:-42px;width:230px;padding:16px 20px;border-radius:15px;background:rgba(16,16,22,.82);border:1px solid rgba(247,144,7,.42);backdrop-filter:blur(7px);-webkit-backdrop-filter:blur(7px);box-shadow:0 0 34px -8px rgba(247,144,7,.55),inset 0 1px 0 rgba(255,255,255,.06);text-decoration:none;color:#fff;display:flex;flex-direction:column;gap:5px;transform-style:preserve-3d;will-change:transform}
.helix-node .hn-num{color:#ff8a1f;font-weight:700;font-size:.78rem;letter-spacing:.1em}
.helix-node .hn-name{font-size:1.18rem;font-weight:600;line-height:1.1}
.helix-node .hn-sub{font-size:.82rem;color:#aab0bd}
.helix-hud{position:absolute;left:0;right:0;top:8%;text-align:center;z-index:6;pointer-events:none;padding:0 20px}
.helix-hud h2{margin:10px 0 0}
.helix-hud .eyebrow{justify-content:center;display:flex}
.helix-scroll-cue{position:absolute;left:50%;bottom:6%;transform:translateX(-50%);z-index:6;color:var(--muted);font-size:.8rem;letter-spacing:.14em;animation:cuePulse 2s ease infinite}
@keyframes cuePulse{0%,100%{opacity:.4}50%{opacity:1}}
html[data-theme="light"] .helix-stage,html[data-theme="light"] .helix-bg{background:#070a14}
/* fallback: no GSAP -> clean stacked list */
.helix-sec.no-gsap{height:auto}
.helix-sec.no-gsap .helix-stage{height:auto;padding:70px 0}
.helix-sec.no-gsap .helix-scene{position:static;perspective:none;display:block}
.helix-sec.no-gsap .helix-core{width:auto;height:auto;transform:none!important;display:grid;gap:14px;max-width:560px;margin:0 auto;padding:0 20px}
.helix-sec.no-gsap .helix-node{position:relative!important;left:auto!important;top:auto!important;width:auto;transform:none!important}
@media(max-width:700px){.helix-node{width:190px;left:-95px}.helix-sec{height:440vh}}

/* ── helix vignette fog (nodes dissolve into dark at the rim) ── */
.helix-vignette{position:absolute;inset:0;z-index:4;pointer-events:none;background:radial-gradient(ellipse 64% 58% at 50% 50%,transparent 38%,rgba(6,6,10,.75) 82%,#06060a 100%)}
html[data-theme="light"] .helix-vignette{background:radial-gradient(ellipse 64% 58% at 50% 50%,transparent 42%,rgba(7,10,20,.6) 85%,#070a14 100%)}
.helix-node{transition:box-shadow .25s ease,border-color .25s ease}

/* ── perf: compositor-only helix (no backdrop-filter; blur/shadow bucketed to classes, not per-frame inline) ── */
.helix-node{backdrop-filter:none!important;-webkit-backdrop-filter:none!important;background:rgba(16,16,22,.93)!important;filter:none;transition:box-shadow .3s ease,border-color .3s ease,filter .3s ease}
.helix-node.b-far{filter:blur(3px) saturate(.6)}
.helix-node.b-front{box-shadow:0 0 54px -4px rgba(247,144,7,.8),inset 0 1px 0 rgba(255,255,255,.08);border-color:rgba(255,138,31,.9)}
html.vx-lite .helix-node{filter:none!important}
html.vx-lite .helix-bg::after{display:none}
