body{margin:0}
/* hero */
.hx{position:relative;overflow:hidden;background:#0f1530;color:#fff;padding:56px 0 120px;isolation:isolate}
.hx-glow{position:absolute;inset:-20% -10% auto;height:140%;z-index:-1;background:radial-gradient(42% 50% at 18% 30%,rgba(47,79,224,.55),transparent 70%),radial-gradient(38% 45% at 85% 20%,rgba(125,149,255,.35),transparent 70%),radial-gradient(50% 40% at 70% 100%,rgba(47,79,224,.35),transparent 70%)}
.hx::after{content:"";position:absolute;inset:0;z-index:-1;background-image:linear-gradient(rgba(255,255,255,.045) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.045) 1px,transparent 1px);background-size:56px 56px;-webkit-mask-image:radial-gradient(70% 70% at 50% 40%,#000,transparent);mask-image:radial-gradient(70% 70% at 50% 40%,#000,transparent)}
.hx-in{display:grid;grid-template-columns:.9fr 1.1fr;gap:44px;align-items:center}
.hx .kicker{color:#9fb0ff}
.hx h1{color:#fff;font-size:clamp(46px,6vw,84px);line-height:.95;letter-spacing:-.035em;margin-top:16px}
.hx h1 em{background:linear-gradient(90deg,#7d95ff,#b8c6ff 60%,#fff);-webkit-background-clip:text;background-clip:text;color:transparent}
.hx-copy>p{color:#c3cae6;font-size:19px;max-width:42ch;margin:24px 0 32px}
.hx .btns{gap:14px}
.btn.ghost{background:rgba(255,255,255,.06);color:#fff;box-shadow:inset 0 0 0 1.5px rgba(255,255,255,.28);padding:18px 24px;font-size:16px;border-radius:12px}
.btn.ghost:hover{background:rgba(255,255,255,.12)}
.hx .btn.big{box-shadow:0 14px 34px -12px rgba(47,79,224,.9)}
.hx-facts{list-style:none;padding:0;margin:30px 0 0;display:flex;flex-wrap:wrap;gap:10px 22px;font-size:15px;color:#c3cae6}
.hx-facts li{display:flex;align-items:center;gap:8px}
.hx-facts li::before{content:"";width:18px;height:18px;border-radius:50%;flex:none;background:rgba(125,149,255,.22) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M4.5 8.2l2.3 2.3 4.7-4.9' fill='none' stroke='%23b8c6ff' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center/16px no-repeat}
.hx-dev .devices{margin-top:0;padding-right:11%}
.hx .laptop .scr{border-color:#232a45;background:#232a45;box-shadow:0 50px 90px -40px rgba(0,0,0,.8),0 0 0 1px rgba(255,255,255,.08)}
.hx .laptop .base{background:linear-gradient(#cfd4e6,#8f96ad)}
.hx .phone .scr{border-color:#232a45;box-shadow:0 0 0 1px rgba(255,255,255,.1)}
.hx .devices .phone{filter:drop-shadow(0 30px 40px rgba(0,0,0,.55))}
.hx-cap{display:flex;align-items:center;gap:10px;margin:34px 0 0;font-size:14px;color:#9aa3c7}
.hx-cap .dot{width:8px;height:8px;border-radius:50%;background:#4ade80;box-shadow:0 0 0 0 rgba(74,222,128,.6);animation:pulse 2s infinite}
@keyframes pulse{70%{box-shadow:0 0 0 10px rgba(74,222,128,0)}100%{box-shadow:0 0 0 0 rgba(74,222,128,0)}}
@media (prefers-reduced-motion:no-preference){.hx .devices .phone{animation:float 6s ease-in-out infinite}@keyframes float{50%{transform:translateY(-12px)}}}
/* site-check card overlapping hero */
.chkband{padding:0 0 24px;position:relative;z-index:2}
.audit.wide{margin-top:-78px;display:grid;grid-template-columns:.9fr 1.1fr;gap:6px 40px;align-items:center;padding:28px 32px;border-radius:22px;box-shadow:0 40px 80px -40px rgba(15,21,48,.45),0 0 0 1px rgba(15,21,48,.05);border:0}
.audit.wide .aw-l h2.ah{font-size:24px;line-height:1.2}
.audit.wide .intro{font-size:15px;margin-top:6px}
.audit.wide form.chk{margin:0 0 6px}
.audit.wide .chk-sub{margin:0}
.audit.wide .ex-wrap,.audit.wide .chk-res{grid-column:1/-1}
.audit.wide .ex-wrap .aslides{max-width:620px}
/* dark process */
section.dark{background:#0f1530;color:#fff;position:relative;overflow:hidden}
section.dark::before{content:"";position:absolute;inset:auto -10% -50% 30%;height:120%;background:radial-gradient(closest-side,rgba(47,79,224,.35),transparent);pointer-events:none}
section.dark .kicker{color:#9fb0ff}
section.dark h2{color:#fff}
.vsteps{list-style:none;padding:0;margin:44px 0 0;display:grid;grid-template-columns:repeat(3,1fr);gap:22px;position:relative}
.vsteps::before{content:"";position:absolute;top:34px;left:8%;right:8%;height:2px;background:linear-gradient(90deg,rgba(125,149,255,.1),rgba(125,149,255,.6),rgba(125,149,255,.1))}
.vsteps li{position:relative;background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.1);border-radius:20px;padding:26px 24px 24px;backdrop-filter:blur(4px)}
.vi{width:68px;height:68px;border-radius:18px;display:grid;place-items:center;background:linear-gradient(145deg,#3b5bff,#2f4fe0);color:#fff;box-shadow:0 14px 30px -12px rgba(47,79,224,.9);position:relative;z-index:1}
.vn{position:absolute;top:22px;right:24px;font:800 44px/1 var(--display);color:rgba(255,255,255,.08);letter-spacing:-.03em}
.vsteps h3{font-size:22px;margin:20px 0 8px;color:#fff}
.vsteps p{margin:0;color:#b3bbdc;font-size:15.5px}
.vcta{display:flex;align-items:center;gap:24px;flex-wrap:wrap;margin-top:36px;position:relative}
.vlink{color:#c3cae6;font-weight:600;text-decoration:none}
.vlink:hover{color:#fff}
/* card polish + hover */
.pain,.cat{transition:transform .25s ease,box-shadow .25s ease,border-color .25s}
.pain:hover,.cat:hover{transform:translateY(-6px);box-shadow:0 26px 50px -30px rgba(15,21,48,.4)}
.pain .pn{display:inline-grid;place-items:center;width:40px;height:40px;border-radius:12px;background:var(--soft);margin-bottom:18px}
.cat .ph{transition:transform .6s ease}
.cat:hover .ph{transform:scale(1.04)}
/* scroll reveal */
.js-rv .rvl{opacity:0;transform:translateY(28px);transition:opacity .7s cubic-bezier(.2,.7,.2,1),transform .7s cubic-bezier(.2,.7,.2,1);transition-delay:var(--d,0s)}
.js-rv .rvl.in{opacity:1;transform:none}
.hx-copy>*{animation:rise .8s cubic-bezier(.2,.7,.2,1) both}
.hx-copy>*:nth-child(2){animation-delay:.08s}.hx-copy>*:nth-child(3){animation-delay:.16s}.hx-copy>*:nth-child(4){animation-delay:.24s}.hx-copy>*:nth-child(5){animation-delay:.32s}
.hx-dev{animation:rise 1s .2s cubic-bezier(.2,.7,.2,1) both}
@keyframes rise{from{opacity:0;transform:translateY(26px)}to{opacity:1;transform:none}}
@media (prefers-reduced-motion:reduce){.js-rv .rvl{opacity:1;transform:none;transition:none}.hx-copy>*,.hx-dev{animation:none}}
/* responsive */
@media (max-width:900px){.hx{padding:28px 0 104px}.hx-in{grid-template-columns:1fr;gap:40px}.audit.wide{grid-template-columns:1fr;padding:22px}.vsteps{grid-template-columns:1fr}.vsteps::before{display:none}}
@media (max-width:640px){.hx h1{font-size:44px}.hx-copy>p{font-size:17px}.hx .btns .btn{width:100%;text-align:center}.hx-dev .devices{padding-right:0}.hx-facts{gap:8px 16px;font-size:14px}.audit.wide{margin-top:-64px}}

/* ---------- realistic devices ---------- */
.devices .laptop .scr{position:relative;border:0;padding:1.4% 1.4% 1.8%;border-radius:18px 18px 0 0;background:#0a0b0f;box-shadow:0 0 0 1.5px #9ea3b2,0 0 0 3px #4a4e5b,0 50px 90px -40px rgba(0,0,0,.75)}
.devices .laptop .scr::before{content:"";position:absolute;top:.55%;left:50%;width:6px;height:6px;margin-left:-3px;border-radius:50%;background:#1d2029;box-shadow:inset 0 0 0 1.5px #343846;z-index:3}
.devices .laptop .scr::after{content:"";position:absolute;inset:1.4% 1.4% 1.8%;border-radius:4px;background:linear-gradient(118deg,rgba(255,255,255,.13) 0,rgba(255,255,255,.04) 30%,rgba(255,255,255,0) 42%);pointer-events:none;z-index:3}
.devices .laptop .live{border-radius:4px}
.devices .laptop .base{height:18px;margin:0 -7%;border-radius:3px 3px 18px 18px/3px 3px 12px 12px;background:linear-gradient(180deg,#f1f2f6 0,#d5d8e0 35%,#a9adba 80%,#8a8f9c 100%);box-shadow:0 22px 34px -14px rgba(0,0,0,.65),inset 0 1px 0 #fff}
.devices .laptop .base::before{top:0;width:16%;height:6px;background:linear-gradient(#9da1ae,#c8cbd4);border-radius:0 0 10px 10px}
.devices .phone .scr{position:relative;border:0;padding:3.2%;border-radius:17%/8.4%;background:#07080b;box-shadow:0 0 0 1.5px #6c7180,0 0 0 3.5px #2c2f38,inset 0 0 0 1px #000}
.devices .phone .scr::before{content:"";position:absolute;top:2.6%;left:50%;width:30%;height:2.9%;transform:translateX(-50%);border-radius:999px;background:#000;z-index:3}
.devices .phone .scr::after{content:"";position:absolute;inset:3.2%;border-radius:14%/7%;background:linear-gradient(125deg,rgba(255,255,255,.14) 0,rgba(255,255,255,0) 35%);pointer-events:none;z-index:3}
.devices .phone .live{border-radius:14%/7%}
.devices .phone::before,.devices .phone::after{content:"";position:absolute;width:3px;background:#3a3e4a;border-radius:2px}
.devices .phone::before{right:-4px;top:26%;height:13%}
.devices .phone::after{left:-4px;top:19%;height:7%;box-shadow:0 calc(100% + 34px) 0 #3a3e4a}
.hx .devices .live iframe{background:transparent}
/* ---------- dark page headers ---------- */
.dhead{position:relative;overflow:hidden;background:#0f1530;color:#fff;isolation:isolate}
.dhead::after{content:"";position:absolute;inset:0;z-index:-1;background-image:linear-gradient(rgba(255,255,255,.045) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.045) 1px,transparent 1px);background-size:56px 56px;-webkit-mask-image:radial-gradient(70% 80% at 30% 40%,#000,transparent);mask-image:radial-gradient(70% 80% at 30% 40%,#000,transparent)}
.dhead .phead{padding-block:64px 84px}
.dhead.pull .phead{padding-bottom:132px}
.dhead .kicker{color:#9fb0ff}
.dhead h1{color:#fff;font-size:clamp(40px,5.4vw,72px);line-height:1;letter-spacing:-.03em;max-width:17ch}
.dhead h1 em{font-style:normal;background:linear-gradient(90deg,#7d95ff,#b8c6ff 60%,#fff);-webkit-background-clip:text;background-clip:text;color:transparent}
.dhead .phead p,.dhead .lede{color:#c3cae6}
.dhead .btn.line,.dcta .btn.line,.article-cta.dark .btn.line{background:rgba(255,255,255,.06);color:#fff;box-shadow:inset 0 0 0 1.5px rgba(255,255,255,.28)}
.dhead .btn{box-shadow:0 14px 34px -14px rgba(47,79,224,.9)}
.dhead .phead>*{animation:rise .8s cubic-bezier(.2,.7,.2,1) both}
.dhead .phead>*:nth-child(2){animation-delay:.08s}.dhead .phead>*:nth-child(3){animation-delay:.16s}.dhead .phead>*:nth-child(4){animation-delay:.24s}
.pulled{position:relative;z-index:2;margin-top:-96px}
.roi-page.after-dark{padding-top:0}
.book-page.after-dark{padding-top:0}
/* ---------- dark closing call-to-action ---------- */
section.dcta{background:#0f1530;color:#fff;position:relative;overflow:hidden;isolation:isolate;padding-block:88px}
section.dcta::before{content:"";position:absolute;z-index:-1;inset:-40% -10% -40% 35%;background:radial-gradient(closest-side,rgba(47,79,224,.45),transparent)}
.dcta h2{color:#fff}.dcta .kicker{color:#9fb0ff}.dcta .lede{color:#c3cae6}
.dcta .btn{box-shadow:0 14px 34px -14px rgba(47,79,224,.9)}
.article-cta.dark{background:#0f1530;border:0;color:#fff;position:relative;overflow:hidden}
.article-cta.dark h2{color:#fff}.article-cta.dark p{color:#c3cae6}
/* ---------- hover lift on cards site-wide ---------- */
.pkg,.lp-card,.aud,.feat>div,.frame{transition:transform .25s ease,box-shadow .25s ease,border-color .25s}
.pkg:hover,.lp-card:hover,.aud:hover,.feat>div:hover{transform:translateY(-5px);box-shadow:0 26px 50px -30px rgba(15,21,48,.4)}
@media (max-width:640px){.dhead .phead{padding-block:36px 56px}.dhead.pull .phead{padding-bottom:110px}.dhead h1{font-size:40px}.dhead .btns .btn{width:100%;text-align:center}.pulled{margin-top:-80px}section.dcta{padding-block:64px}.dcta .btns .btn{width:100%;text-align:center}}
@media (prefers-reduced-motion:reduce){.dhead .phead>*{animation:none}}
#calc .calc.pulled{margin-top:-96px}
@media (max-width:640px){#calc .calc.pulled{margin-top:-80px}}
.dhead + .wrap .banner{margin:64px 0}
@media (max-width:640px){.dhead + .wrap .banner{margin:40px 0}}
