:root{--p:0;--night:#0c0a1e;--plum:#4d1f3d;--ground:color-mix(in srgb,var(--plum) calc(var(--p)*100%),var(--night));--ember:#ff5b2e;--gold:#ffc23d;--paper:#fff4e6;--mut:rgba(255,244,230,.76);--line:rgba(255,244,230,.18)}
*{box-sizing:border-box;margin:0}html{scroll-behavior:smooth}
body{background:var(--ground);color:var(--paper);font:400 1.0625rem/1.65 'Hanken Grotesk',system-ui,sans-serif;overflow-x:hidden;-webkit-font-smoothing:antialiased}
h1,h2,h3{font-family:'Bricolage Grotesque','Hanken Grotesk',sans-serif;letter-spacing:-.035em;line-height:1.02;font-weight:800}
a{color:inherit;text-decoration:none}img,svg{display:block;max-width:100%}
:focus-visible{outline:3px solid var(--gold);outline-offset:3px;border-radius:6px}
::selection{background:var(--gold);color:#24102a}
.glow{position:fixed;inset:auto 0 0;height:45vh;background:radial-gradient(ellipse 70% 100% at 50% 130%,rgba(255,91,46,.45),transparent 70%);opacity:var(--p);pointer-events:none;z-index:0}
main,footer{position:relative;z-index:1}
/* nav */
.nav{position:fixed;z-index:50;top:14px;left:50%;transform:translateX(-50%);width:min(1100px,calc(100% - 28px));display:flex;align-items:center;justify-content:space-between;padding:8px 8px 8px 18px;border-radius:999px;border:1px solid transparent;transition:background .3s,border-color .3s,backdrop-filter .3s}
.nav.solid,.nav.open{background:rgba(12,10,30,.72);border-color:var(--line);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px)}
.brand{display:flex;align-items:center;gap:.6rem;font:800 1.15rem 'Bricolage Grotesque',sans-serif;letter-spacing:-.02em}.brand img,.brand svg{height:40px;width:auto}
.links{display:flex;align-items:center;gap:1.7rem;font-weight:500;font-size:.95rem}.links a:not(.btn):hover{color:var(--gold)}
.menu{display:none;background:none;border:1px solid var(--line);color:inherit;border-radius:999px;padding:.55em 1.1em;font:inherit;cursor:pointer}
.btn{display:inline-flex;align-items:center;gap:.5em;padding:.85em 1.55em;border-radius:999px;font-weight:600;border:1px solid var(--line);transition:transform .2s,box-shadow .2s,background .2s;cursor:pointer}
.btn:hover{transform:translateY(-2px)}.btn.fire{background:linear-gradient(135deg,var(--gold),var(--ember));color:#2a0d05;border:0}
.btn.fire:hover{box-shadow:0 10px 40px -8px rgba(255,120,50,.75)}.btn.ghost:hover{background:rgba(255,244,230,.1)}.btn.sm{padding:.6em 1.2em}
/* hero */
.hero{position:relative;min-height:100svh;overflow:hidden;display:grid;align-items:center;background:linear-gradient(#060714 0%,#15103f 48%,#5b2358 78%,#e0602f 100%)}
.hero>*{position:absolute}.hero .hero-copy{position:relative;z-index:5;padding:18vh 6vw 36vh;max-width:1250px;will-change:transform}
.hero h1{font-size:clamp(3.3rem,10.5vw,9.2rem);max-width:11ch}.hero p{font-size:1.25rem;max-width:34rem;color:var(--mut);margin:1.6rem 0 2rem}
.hero small{display:block;margin-top:1rem;color:var(--mut);font-size:.85rem}.cta{display:flex;flex-wrap:wrap;gap:.8rem}
.stars{inset:0 0 40%;background-image:radial-gradient(1.5px 1.5px at 20px 30px,#fff,transparent),radial-gradient(1px 1px at 90px 120px,#fff,transparent),radial-gradient(1.6px 1.6px at 160px 60px,#ffe9b0,transparent),radial-gradient(1px 1px at 130px 20px,#fff,transparent);background-size:210px 170px;animation:tw 4s ease-in-out infinite alternate;-webkit-mask-image:linear-gradient(#000 40%,transparent);mask-image:linear-gradient(#000 40%,transparent)}
@keyframes tw{from{opacity:.45}to{opacity:1}}
.sun{left:62%;bottom:19%;width:min(34vw,430px);aspect-ratio:1;border-radius:50%;background:radial-gradient(circle at 40% 35%,#fff1b8,var(--gold) 40%,var(--ember) 82%);box-shadow:0 0 140px 50px rgba(255,110,50,.45);z-index:1}
.ridge{position:absolute;max-width:none;left:-2%;width:104%;bottom:0;height:46%}.r1{z-index:2;fill:#6b2d5c;bottom:12%}.r2{z-index:3;fill:#43204f;bottom:6%}.r3{z-index:4;fill:#26133c}.r4{z-index:6;fill:var(--ground);height:17%;bottom:-1px}
.finch{z-index:4;left:7vw;top:12%;width:clamp(60px,8vw,110px);will-change:transform}.wing{transform-origin:50% 70%;animation:flap .5s ease-in-out infinite alternate}
@keyframes flap{from{transform:rotate(-14deg)}to{transform:rotate(16deg)}}
.page-top{position:relative;overflow:hidden;padding:11rem 6vw 7rem;background:linear-gradient(#060714,#15103f 55%,#5b2358 100%)}
.page-top .ridge{height:60%}.page-top .wrap{position:relative;z-index:5}.page-top h1{font-size:clamp(2.6rem,7vw,6rem);max-width:16ch}.page-top p{max-width:42rem;color:var(--mut);margin-top:1.4rem;font-size:1.15rem}
/* sections */
section{padding:clamp(4.5rem,11vw,9rem) 6vw}.wrap{max-width:1180px;margin:auto}h2{font-size:clamp(2.2rem,5.2vw,4.4rem)}.lead{color:var(--mut);max-width:34rem;margin-top:1.4rem}
.svc-grid{display:grid;grid-template-columns:5fr 7fr;gap:6vw}.svc-head{position:sticky;top:18vh;align-self:start}
.svc{padding:2.6rem 0;border-top:1px solid var(--line)}.svc-top{display:flex;justify-content:space-between;align-items:baseline;gap:1rem;flex-wrap:wrap}
.svc h3{font-size:clamp(1.6rem,2.8vw,2.2rem);max-width:15ch}.fig{font:800 clamp(1.3rem,2.4vw,1.9rem) 'Bricolage Grotesque',sans-serif;color:var(--gold);letter-spacing:-.02em}
.svc p{color:var(--mut);margin:1rem 0;max-width:36rem}.tags{display:flex;flex-wrap:wrap;gap:.5rem;list-style:none;padding:0}.tags li{border:1px solid var(--line);border-radius:999px;padding:.25em .9em;font-size:.88rem}
.stats{display:grid;grid-template-columns:repeat(4,1fr);gap:2rem;margin-top:4rem}.stat{border-top:1px solid var(--line);padding-top:1.4rem}
.stat b{display:block;font:800 clamp(2.4rem,4.6vw,4rem) 'Bricolage Grotesque',sans-serif;letter-spacing:-.04em;line-height:1;color:var(--gold)}.stat h3{font-size:1.15rem;margin:.8rem 0 .4rem;letter-spacing:-.01em}.stat p{color:var(--mut);font-size:.95rem}
.offer{display:grid;grid-template-columns:1.25fr 1fr;gap:4vw;padding:clamp(2rem,5vw,4.5rem);border-radius:32px;border:1px solid rgba(255,194,61,.45);background:linear-gradient(160deg,rgba(255,91,46,.2),rgba(255,194,61,.06)),rgba(12,10,30,.55)}
.checks{list-style:none;padding:0;margin-top:2rem;display:grid;gap:.7rem}.checks li{padding-left:1.9rem;position:relative}.checks li:before{content:"";position:absolute;left:0;top:.5em;width:.9rem;height:.9rem;border-radius:50%;background:radial-gradient(circle,var(--gold),var(--ember))}
.price-box{align-self:end;padding:2rem;border-radius:22px;background:var(--paper);color:#24102a}.price-box h3{font-size:2.4rem}.price-box p{margin:.6rem 0 1.4rem;color:#4a3550}.price-box .btn{width:100%;justify-content:center;background:#24102a;color:var(--paper);border:0}
.dots{display:flex;gap:.45rem;margin-top:1.2rem;align-items:center;font-size:.9rem;color:#4a3550}.dots i{width:.8rem;height:.8rem;border-radius:50%;background:#d9c9bd}.dots i.on{background:var(--ember)}
.contact{text-align:center}.contact h2{font-size:clamp(2.6rem,8vw,7rem);margin:auto;max-width:12ch}.mail{display:inline-block;margin:2rem 0 2.2rem;font:700 clamp(1.3rem,3.6vw,2.6rem) 'Bricolage Grotesque',sans-serif;border-bottom:3px solid var(--ember);padding-bottom:.2rem;word-break:break-all}.mail:hover{color:var(--gold)}.contact .cta{justify-content:center}.contact small{display:block;margin-top:2rem;color:var(--mut)}
/* pricing */
.plans{display:grid;grid-template-columns:repeat(3,1fr);gap:1.4rem;align-items:stretch}.plan{display:flex;flex-direction:column;padding:2.2rem;border:1px solid var(--line);border-radius:24px;background:rgba(255,244,230,.04)}
.plan h3{font-size:1.5rem;letter-spacing:-.02em}.plan .sub{color:var(--mut);font-size:.95rem;margin:.6rem 0 1.4rem}.price{font:800 3.6rem 'Bricolage Grotesque',sans-serif;letter-spacing:-.04em;line-height:1}.price small{font:500 1rem 'Hanken Grotesk',sans-serif;letter-spacing:0;opacity:.75}
.setup{margin:.6rem 0 1.6rem;font-size:.92rem;opacity:.8}.plan .checks{margin:0 0 2rem;font-size:.97rem}.plan .btn{margin-top:auto;justify-content:center}
.plan.hot{background:var(--paper);color:#24102a;border:0;transform:translateY(-18px);box-shadow:0 30px 80px -20px rgba(255,91,46,.55)}.plan.hot .sub{color:#4a3550}.plan.hot .btn{background:#24102a;color:var(--paper);border:0}.badge{align-self:flex-start;background:linear-gradient(135deg,var(--gold),var(--ember));color:#2a0d05;font-weight:700;font-size:.82rem;padding:.25em .9em;border-radius:999px;margin-bottom:1rem}
.incl{display:grid;grid-template-columns:repeat(4,1fr);gap:2rem;margin-top:3.5rem}.incl div{border-top:1px solid var(--line);padding-top:1.2rem}.incl h3{font-size:1.2rem;letter-spacing:-.01em}.incl p{color:var(--mut);font-size:.95rem;margin-top:.5rem}
.note{margin-top:4rem;padding:1.4rem 1.8rem;border-left:3px solid var(--gold);background:rgba(255,244,230,.05);color:var(--mut);border-radius:0 14px 14px 0;max-width:46rem}
.threed{display:flex;align-items:center;justify-content:space-between;gap:2rem;flex-wrap:wrap;margin-top:4rem;padding:clamp(1.8rem,4vw,3rem);border-radius:28px;border:1px solid rgba(255,194,61,.45);background:linear-gradient(160deg,rgba(255,91,46,.2),rgba(255,194,61,.06)),rgba(12,10,30,.55)}.threed h2{font-size:clamp(1.8rem,4vw,3rem);max-width:18ch}.threed p{color:var(--mut);max-width:36rem;margin-top:.8rem}
/* legal */
.doc{max-width:760px;margin:auto;padding:4rem 6vw 7rem}.doc h2{font-size:1.9rem;margin:3.2rem 0 1rem}.doc h3{font-size:1.25rem;margin:2rem 0 .6rem;letter-spacing:-.01em}.doc p,.doc li{color:var(--mut);margin-bottom:1rem}.doc ul{padding-left:1.3rem}.doc a{color:var(--gold);text-decoration:underline}.doc strong{color:var(--paper)}
/* 404 */
.big404{position:absolute;z-index:2;left:50%;top:14%;translate:-50% 0;font:800 clamp(10rem,34vw,32rem)/.9 'Bricolage Grotesque',sans-serif;letter-spacing:-.06em;color:transparent;-webkit-text-stroke:2px rgba(255,194,61,.7)}
.lost{justify-content:center;text-align:center}.lost .hero-copy{margin:auto;padding-top:34vh;padding-bottom:28vh}.lost h1{font-size:clamp(2.2rem,5vw,4rem);max-width:18ch;margin:auto}.lost p{margin:1.2rem auto 2rem}.lost .cta{justify-content:center}
footer{border-top:1px solid var(--line);padding:3rem 6vw;background:rgba(12,10,30,.5)}footer .wrap{display:flex;justify-content:space-between;gap:2rem;flex-wrap:wrap;align-items:center;color:var(--mut);font-size:.92rem}footer nav{display:flex;gap:1.5rem;flex-wrap:wrap}footer a:hover{color:var(--gold)}
@media(max-width:900px){.svc-grid,.offer,.plans{grid-template-columns:1fr}.svc-head{position:static}.stats,.incl{grid-template-columns:1fr 1fr}.plan.hot{transform:none}.sun{left:45%;width:60vw}
.menu{display:block}.links{display:none;position:absolute;top:calc(100% + 8px);left:0;right:0;flex-direction:column;align-items:stretch;gap:0;padding:.8rem;border-radius:24px;background:rgba(12,10,30,.95);border:1px solid var(--line)}.nav.open .links{display:flex}.links a{padding:.8rem 1rem}}
@media(max-width:520px){.stats,.incl{grid-template-columns:1fr}}
@media(prefers-reduced-motion:reduce){*{animation:none!important;scroll-behavior:auto!important;transition:none!important}}
/* active menu */
.links a.on:not(.btn){color:var(--gold);text-decoration:underline;text-decoration-color:var(--gold);text-decoration-thickness:2px;text-underline-offset:9px}.links .btn.on{box-shadow:0 0 0 3px rgba(255,194,61,.5)}
/* embers */
.embers{inset:0;z-index:5;pointer-events:none}.embers span{position:absolute;bottom:-10px;left:var(--x);width:var(--s);height:var(--s);border-radius:50%;background:var(--gold);box-shadow:0 0 10px 3px rgba(255,130,50,.8);opacity:0;animation:rise var(--t) linear var(--d) infinite}
@keyframes rise{0%{transform:translate(0,0);opacity:0}12%{opacity:.95}100%{transform:translate(40px,-85vh);opacity:0}}
/* scroll showcase */
.tall{height:560vh;padding:0;position:relative}.stick{position:sticky;top:0;height:100vh;overflow:hidden;display:grid;place-items:center}
.persp{position:absolute;inset:0;perspective:1800px}.laptop{position:absolute;width:min(86vw,760px)}
.lid{aspect-ratio:16/10;background:#0a0a14;border:2px solid #34344a;border-radius:20px 20px 4px 4px;padding:2.2%;transform-origin:50% 100%;transform:rotateX(-90deg);will-change:transform}
.screen{height:100%;border-radius:8px;overflow:hidden;container-type:inline-size;background:radial-gradient(120% 90% at 50% 120%,#8a3350,#1a1038 55%,#0c0a1e)}
.mock{height:100%;opacity:0;display:flex;flex-direction:column}.bar{display:flex;gap:5px;padding:2.4cqw 3cqw;background:rgba(255,255,255,.06)}.bar i{width:1.6cqw;height:1.6cqw;border-radius:50%;background:rgba(255,244,230,.4)}
.mh{flex:1;display:grid;place-content:center;text-align:center;padding:0 var(--pad,8cqw);background:linear-gradient(#15103f,#5b2358 70%,#e0602f)}.mh h3{font-size:var(--fs,7.4cqw);line-height:1.05}
.sk{display:flex;gap:2.5cqw;padding:3cqw}.sk b{flex:1;height:7cqw;border-radius:1.4cqw;background:rgba(255,244,230,.14)}
.base{height:16px;margin:0 -4%;border-radius:0 0 24px 24px;background:linear-gradient(#d9dae2,#8d8e9c);box-shadow:0 30px 60px -10px rgba(0,0,0,.6)}
.feat{position:absolute;inset:0;display:grid;place-content:center;text-align:center;padding:0 8vw;opacity:0;pointer-events:none}.feat h3{font-size:clamp(2.6rem,7.5vw,6.5rem);max-width:15ch;margin:auto}.feat em{font-style:normal;background:linear-gradient(135deg,var(--gold),var(--ember));-webkit-background-clip:text;background-clip:text;color:transparent}.feat p{color:var(--mut);font-size:clamp(1.05rem,2vw,1.4rem);max-width:34rem;margin:1.4rem auto 0}
.cue{position:absolute;bottom:2rem;left:0;right:0;text-align:center;color:var(--mut);font-size:.85rem;letter-spacing:.08em;text-transform:uppercase}
.tall.static{height:auto;padding:5rem 6vw}.static .stick{position:static;height:auto;display:block}.static .persp,.static .cue{display:none}.static .feat{position:static;opacity:1;margin:3rem 0}
/* auth */
.authcard{max-width:520px;margin:auto;padding:2rem;border-radius:28px;border:1px solid var(--line);background:rgba(12,10,30,.6)}
.tabs{display:grid;grid-template-columns:1fr 1fr;gap:.4rem;padding:.3rem;border-radius:999px;background:rgba(255,244,230,.08);margin-bottom:1.6rem}.tabs button{border:0;background:none;color:var(--mut);font:600 1rem 'Hanken Grotesk',sans-serif;padding:.7em;border-radius:999px;cursor:pointer}.tabs button[aria-selected=true]{background:var(--paper);color:#24102a}
.field{display:block;margin-bottom:1.1rem;font-weight:500;font-size:.95rem}.field input{display:block;width:100%;margin-top:.4rem;padding:.9rem 1rem;border-radius:14px;border:1px solid var(--line);background:rgba(255,244,230,.07);color:var(--paper);font:inherit}.field input:focus{border-color:var(--gold);outline:0;box-shadow:0 0 0 3px rgba(255,194,61,.3)}
.authcard form .btn{width:100%;justify-content:center}.err{min-height:1.4rem;color:#ffb4a6;font-size:.92rem;margin-bottom:.8rem}.link{display:block;margin:1.1rem auto 0;background:none;border:0;color:var(--gold);font:inherit;text-decoration:underline;cursor:pointer}
.live{display:flex;align-items:center;gap:.6rem;color:var(--mut);margin-bottom:1.6rem;font-size:.95rem}.live i{width:.7rem;height:.7rem;border-radius:50%;background:#3ddc84;box-shadow:0 0 0 0 rgba(61,220,132,.7);animation:pl 1.8s infinite}@keyframes pl{to{box-shadow:0 0 0 12px rgba(61,220,132,0)}}
.dgrid{display:grid;grid-template-columns:1fr 1.4fr;gap:1.4rem}.plan.big{transform:none}dl{display:grid;gap:.2rem;margin-top:1.2rem}dl div{display:flex;justify-content:space-between;gap:1rem;padding:.75rem 0;border-top:1px solid var(--line)}dt{color:var(--mut)}dd{font-weight:600;text-align:right;overflow-wrap:anywhere}
.badge[data-s=active]{background:#3ddc84}.badge[data-s=pending]{background:var(--gold)}.badge[data-s=expired],.badge[data-s=cancelled]{background:#ff8a7a}
@media(max-width:900px){.dgrid{grid-template-columns:1fr}}

@media(min-width:901px){.plans.two{grid-template-columns:repeat(2,1fr)}}

.plans>*,.dgrid>*{min-width:0}@media(max-width:520px){.price{font-size:2.8rem}.plan{padding:1.6rem}.threed{padding:1.6rem}}

/* faq */
.faq{margin-top:2.5rem;max-width:860px}.faq details{border-top:1px solid var(--line);padding:1.3rem 0}.faq details:last-child{border-bottom:1px solid var(--line)}
.faq summary{cursor:pointer;list-style:none;display:flex;justify-content:space-between;align-items:center;gap:1.5rem;font:700 clamp(1.1rem,2vw,1.35rem) 'Bricolage Grotesque',sans-serif;letter-spacing:-.01em}
.faq summary::-webkit-details-marker{display:none}.faq summary:after{content:"+";flex:none;color:var(--gold);font-size:1.8rem;line-height:1;transition:transform .25s}
.faq details[open] summary:after{transform:rotate(45deg)}.faq summary:hover{color:var(--gold)}.faq details p{color:var(--mut);margin-top:1rem;max-width:46rem}
