/* Fluxx Tech full-page 3D home (preview at /home-3d) */
/* Fluxx Tech cinematic 3D layer — only loaded with ?fx3d=1 (or cookie). Safe to delete. */
html.s3d{--ink:#fff;--mute:#aebbd8;--paper:rgba(255,255,255,.04);--line:rgba(140,190,255,.16);--w:rgba(255,255,255,.05);--fxbg:#030719;scroll-behavior:smooth}
html.s3d body{background:var(--fxbg);color:#e8eefc}
html.s3d body::before{content:"";position:fixed;inset:0;z-index:-1;background:radial-gradient(900px 600px at 82% 8%,rgba(34,160,220,.22),transparent 60%),radial-gradient(800px 600px at 8% 90%,rgba(37,64,154,.45),transparent 62%),var(--fxbg)}

html.s3d main,html.s3d footer.ft{position:relative;z-index:1}
html.s3d .dk,html.s3d .stats,html.s3d .cta,html.s3d .ft,html.s3d .plan.hot,html.s3d .dash,html.s3d .code,html.s3d .ic{--ink:#060b1f}
html.s3d .ic{background:linear-gradient(135deg,#0c1a44,#08122e);box-shadow:0 0 0 1px rgba(34,160,220,.35),0 10px 30px -10px rgba(34,160,220,.7)}
/* transparent sections so the 3D world shows through; soft scrim keeps text readable */
html.s3d .dk,html.s3d .stats,html.s3d .cta,html.s3d .alt,html.s3d .strip,html.s3d .s3,html.s3d section{background:transparent}
html.s3d main>section,html.s3d main>.dk,html.s3d main>.stats,html.s3d main>.strip,html.s3d main>div{position:relative}
html.s3d main>*::before{content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;background:linear-gradient(90deg,rgba(3,7,25,.82),rgba(3,7,25,.5) 55%,rgba(3,7,25,.82))}
html.s3d main>.hero::before,html.s3d main>.ph::before{background:linear-gradient(90deg,rgba(3,7,25,.7),rgba(3,7,25,.18) 60%,rgba(3,7,25,.5))}
html.s3d .strip{border-color:var(--line);backdrop-filter:blur(8px)}
html.s3d .strip b{color:#fff}
html.s3d .hd p,html.s3d .ph p,html.s3d .hero p.l{color:#b9c6e4}
/* nav */
html.s3d .nav{background:rgba(3,7,25,.62);backdrop-filter:blur(16px) saturate(140%);border-color:var(--line)}
html.s3d .nv nav a:not(.btn){color:#aebbd8}
html.s3d .nv nav a:not(.btn):hover,html.s3d .nv nav a.act{color:#fff;background:rgba(34,160,220,.16)}
html.s3d .btn{border-color:rgba(255,255,255,.35);color:#fff}
html.s3d .btn.g{color:#fff;box-shadow:0 10px 30px -8px rgba(34,160,220,.8),0 0 0 1px rgba(255,255,255,.12) inset}
@media(max-width:900px){html.s3d .nv nav{background:rgba(3,7,25,.96)}}
/* glass cards */
html.s3d .card,html.s3d .plan,html.s3d .uc,html.s3d .pf-card,html.s3d .dcard,html.s3d .bcard,html.s3d .pc,html.s3d .pr div,html.s3d .vals .card,html.s3d .fr ul,html.s3d form,html.s3d .blog-toc,html.s3d .pf-empty{
 background:radial-gradient(320px circle at var(--mx,50%) var(--my,0%),rgba(124,200,245,.17),transparent 62%),rgba(12,22,52,.55);
 border:1px solid rgba(140,190,255,.2);backdrop-filter:blur(10px);box-shadow:0 30px 60px -34px rgba(0,0,0,.9),0 0 0 1px rgba(255,255,255,.02) inset;color:#e8eefc}
html.s3d .card h3,html.s3d .plan h3,html.s3d .pf-card h3,html.s3d .bcard h3,html.s3d .pc h3,html.s3d .dcard h3,html.s3d .fr h3,html.s3d .ci h3{color:#fff}
html.s3d .card p,html.s3d .pf-card p,html.s3d .bcard p,html.s3d .pc p,html.s3d .dcard p,html.s3d .pr p{color:#aebbd8}
html.s3d .plan.hot{background:linear-gradient(160deg,rgba(34,160,220,.3),rgba(37,64,154,.35)),rgba(8,16,42,.7);border-color:#22a0dc}
html.s3d input,html.s3d select,html.s3d textarea{background:rgba(255,255,255,.07);border-color:rgba(140,190,255,.25);color:#fff}
html.s3d input:focus,html.s3d select:focus,html.s3d textarea:focus{background:rgba(255,255,255,.12)}
html.s3d select option{color:#111}html.s3d ::placeholder{color:#7f8fb3}
html.s3d details{border-color:var(--line)}
html.s3d .ci p,html.s3d .ci a{color:#aebbd8}
html.s3d .msg.ok{background:rgba(40,160,80,.2);color:#9be9b3}html.s3d .msg.bad{background:rgba(220,60,60,.2);color:#ffb4b4}
html.s3d .pf-chip{background:rgba(255,255,255,.06);color:#dbe6fb;border-color:rgba(140,190,255,.3)}
html.s3d .ft{background:rgba(3,7,25,.7);backdrop-filter:blur(12px);border-top:1px solid var(--line)}
html.s3d .fn::before{background:#08122e;box-shadow:0 0 24px rgba(34,160,220,.7)}
.hero.h3{position:relative;z-index:1;background:transparent;min-height:calc(100svh - 68px);display:flex;align-items:flex-end;padding:40px 0 96px;overflow:visible}
.hero.h3::before{content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;background:linear-gradient(90deg,rgba(3,7,25,.88) 0,rgba(3,7,25,.5) 38%,rgba(3,7,25,0) 62%),linear-gradient(0deg,rgba(3,7,25,.7),transparent 35%)}
.hero.h3 .w{display:block;width:100%}.hero.h3 .w>div{max-width:640px}
.hero.h3 h1{text-shadow:0 6px 40px rgba(0,0,0,.8)}.hero.h3 p.l{text-shadow:0 2px 20px #000;color:#d3dcf2}
.hero.h3 h1 .wd{display:inline-block;opacity:0;transform:translateY(34px);animation:wd .9s cubic-bezier(.2,.8,.2,1) forwards;animation-delay:calc(var(--i)*70ms + .5s)}
@keyframes wd{to{opacity:1;transform:none}}

/* page-level */
#gl{position:fixed;left:0;top:0;width:100vw;height:100vh;height:100lvh;z-index:0;display:block;background:#030719}
html.s3d main>*{position:relative;z-index:2}
html.s3d main>.hero.h3{z-index:1;background:transparent}
html.s3d .ft{position:relative;z-index:2;background:#04081a;backdrop-filter:none}
html.s3d main{perspective:none}
html.s3d .rv{opacity:0;transform:translateY(34px);transition:opacity .8s,transform .9s cubic-bezier(.2,.8,.2,1)}
html.s3d .rv.in{opacity:1;transform:none}
html.s3d main>*::before{display:block}
html.s3d main>.hero.h3::before{background:linear-gradient(90deg,rgba(3,7,25,.88) 0,rgba(3,7,25,.5) 38%,rgba(3,7,25,0) 62%),linear-gradient(0deg,rgba(3,7,25,.7),transparent 35%)}
html.s3d .fgrid .card{cursor:pointer}
html.s3d .nav{background:rgba(3,7,25,.7)}
html.s3d .brand img{background:#fff;border-radius:6px}
.nogl #gl{display:none}
.nogl .hero.h3{background:radial-gradient(900px 500px at 85% 0,rgba(34,160,220,.22),transparent 60%),#060b1f}