:root{--pointer-x:50vw;--pointer-y:32vh;--motion-x:0px;--motion-y:0px}
html{scroll-padding-top:84px;overflow-x:hidden}
body{width:100%;max-width:100vw;overflow-x:hidden;isolation:isolate}
.experience-ambient{position:fixed;inset:0;z-index:-2;overflow:hidden;pointer-events:none;background:linear-gradient(180deg,#f8fbff 0%,#fff 34%,#f7fbff 100%)}
.experience-ambient::after{content:"";position:absolute;inset:0;background-image:linear-gradient(rgba(37,99,235,.026) 1px,transparent 1px),linear-gradient(90deg,rgba(37,99,235,.026) 1px,transparent 1px);background-size:54px 54px;mask-image:linear-gradient(to bottom,#000,transparent 78%)}
.experience-orb{position:absolute;width:46vw;aspect-ratio:1;border-radius:50%;filter:blur(80px);opacity:.2;will-change:transform}
.experience-orb.one{left:-18vw;top:-18vw;background:#3b82f6;animation:orb-one 18s ease-in-out infinite alternate}
.experience-orb.two{right:-19vw;top:16vh;background:#14b8a6;animation:orb-two 22s ease-in-out infinite alternate}
.experience-orb.three{left:34vw;top:58vh;width:32vw;background:#8b5cf6;opacity:.1;animation:orb-three 20s ease-in-out infinite alternate}
#experienceCanvas{position:absolute;inset:0;width:100%;height:100%;opacity:.7}
.pointer-aura{position:fixed;left:0;top:0;width:460px;height:460px;border-radius:50%;z-index:-1;pointer-events:none;background:radial-gradient(circle,rgba(37,99,235,.105),rgba(20,184,166,.035) 42%,transparent 70%);transform:translate3d(calc(var(--pointer-x) - 230px),calc(var(--pointer-y) - 230px),0);will-change:transform}
.scroll-progress{position:fixed;left:0;top:0;width:100%;height:3px;z-index:180;pointer-events:none;transform:scaleX(0);transform-origin:left;background:linear-gradient(90deg,#2563eb,#14b8a6,#8b5cf6);box-shadow:0 0 18px rgba(37,99,235,.6)}
.header{background:rgba(248,251,255,.72)!important;border-bottom-color:rgba(203,213,225,.45);box-shadow:0 1px 0 rgba(255,255,255,.85) inset}
.header.scrolled{background:rgba(255,255,255,.86)!important;box-shadow:0 16px 45px -30px rgba(15,23,42,.45)}
.logo svg{filter:drop-shadow(0 8px 14px rgba(37,99,235,.25));transition:transform .5s cubic-bezier(.2,.8,.2,1)}
.logo:hover svg{transform:rotate(-8deg) scale(1.08)}
.hero{min-height:calc(100svh - 68px);display:grid;align-items:center;padding:82px 0 64px}
.hero::before{inset:-30% -12% auto;height:760px;background:radial-gradient(45% 48% at 22% 25%,rgba(37,99,235,.18),transparent 72%),radial-gradient(36% 42% at 78% 12%,rgba(20,184,166,.16),transparent 72%),radial-gradient(28% 35% at 58% 72%,rgba(139,92,246,.08),transparent 72%);animation:hero-breathe 9s ease-in-out infinite alternate}
.hero::after{content:"";position:absolute;width:68vw;height:68vw;right:-35vw;top:-38vw;border:1px solid rgba(37,99,235,.11);border-radius:44% 56% 62% 38%;animation:halo-spin 32s linear infinite;pointer-events:none}
.hero h1{font-size:clamp(42px,5.2vw,68px);line-height:1.02;max-width:690px;text-wrap:balance}
.hero h1 .accent{color:transparent;background:linear-gradient(100deg,#1d4ed8 0%,#2563eb 36%,#14b8a6 58%,#2563eb 78%,#1d4ed8 100%);background-size:240% auto;background-clip:text;-webkit-background-clip:text;animation:accent-flow 6s linear infinite;filter:drop-shadow(0 10px 24px rgba(37,99,235,.16))}
.hero .eyebrow,.hero h1,.hero .sub,.hero-ctas,.hero-points{opacity:0;transform:translateY(26px);filter:blur(8px)}
.experience-ready .hero .eyebrow,.experience-ready .hero h1,.experience-ready .hero .sub,.experience-ready .hero-ctas,.experience-ready .hero-points{opacity:1;transform:none;filter:none;transition:opacity .9s var(--ease),transform .9s var(--ease),filter .9s var(--ease)}
.experience-ready .hero h1{transition-delay:.08s}.experience-ready .hero .sub{transition-delay:.18s}.experience-ready .hero-ctas{transition-delay:.28s}.experience-ready .hero-points{transition-delay:.38s}
.dashboard-capture{opacity:0;transform:translate3d(50px,20px,0) scale(.94);filter:blur(12px)}
.experience-ready .dashboard-capture{opacity:1;transform:none;filter:none;transition:opacity 1.1s .28s var(--ease),transform 1.1s .28s var(--ease),filter 1.1s .28s var(--ease)}
.hero-dashboard-tilt{border-radius:var(--r-lg)}
.hero-dashboard-tilt::before{content:"";position:absolute;inset:-2px;z-index:-1;border-radius:24px;background:conic-gradient(from var(--shine-angle,0deg),transparent 0 28%,rgba(37,99,235,.78),rgba(20,184,166,.72),transparent 45% 100%);filter:blur(5px);opacity:.42;animation:panel-ring 7s linear infinite}
.hero-dashboard-tilt img{box-shadow:0 35px 85px -32px rgba(30,64,175,.38),0 16px 38px -24px rgba(15,23,42,.32)}
.eyebrow{position:relative;overflow:hidden;box-shadow:0 9px 25px -18px rgba(37,99,235,.5)}
.eyebrow::after{content:"";position:absolute;inset:0;background:linear-gradient(105deg,transparent 25%,rgba(255,255,255,.9) 48%,transparent 70%);transform:translateX(-130%);animation:eyebrow-sheen 5.5s ease-in-out infinite}
.btn{position:relative;overflow:hidden;transform:translate3d(var(--motion-x),var(--motion-y),0);will-change:transform}
.btn::after{content:"";position:absolute;inset:-2px;background:linear-gradient(110deg,transparent 25%,rgba(255,255,255,.42) 48%,transparent 70%);transform:translateX(-140%);transition:transform .7s var(--ease);pointer-events:none}
.btn:hover::after{transform:translateX(140%)}
.btn-primary:hover{transform:translate3d(var(--motion-x),calc(var(--motion-y) - 2px),0);box-shadow:0 18px 34px -16px rgba(37,99,235,.72)}
.card{position:relative;overflow:hidden;transform:perspective(900px) rotateX(var(--card-rx,0deg)) rotateY(var(--card-ry,0deg)) translateY(var(--card-lift,0px));will-change:transform}
.card::before{content:"";position:absolute;inset:0;pointer-events:none;background:radial-gradient(420px circle at var(--card-x,50%) var(--card-y,50%),rgba(37,99,235,.095),transparent 48%);opacity:0;transition:opacity .35s ease}
.card:hover{--card-lift:-7px;box-shadow:0 28px 60px -38px rgba(30,64,175,.52);border-color:rgba(37,99,235,.23)}
.card:hover::before{opacity:1}
.icon{transition:transform .5s var(--ease),box-shadow .5s var(--ease);box-shadow:0 10px 24px -18px rgba(37,99,235,.8)}
.card:hover .icon{transform:translateY(-3px) rotate(-4deg) scale(1.08);box-shadow:0 16px 28px -15px rgba(37,99,235,.55)}
.reveal{opacity:0;transform:translateY(38px) scale(.985);filter:blur(8px);transition:opacity .9s var(--ease),transform .9s var(--ease),filter .9s var(--ease);transition-delay:var(--reveal-delay,0ms)}
.reveal.in{opacity:1;transform:none;filter:none}
section{position:relative}
section:not(.hero)::before{content:"";position:absolute;left:50%;top:0;width:min(720px,78vw);height:1px;transform:translateX(-50%);background:linear-gradient(90deg,transparent,rgba(37,99,235,.16),transparent)}
.strip-list li{animation:module-float 5s ease-in-out infinite;animation-delay:calc(var(--item-index,0) * -420ms)}
.nav-links a{position:relative}.nav-links a::after{content:"";position:absolute;left:12px;right:12px;bottom:4px;height:2px;border-radius:2px;background:linear-gradient(90deg,#2563eb,#14b8a6);transform:scaleX(0);transition:transform .35s var(--ease)}.nav-links a:hover::after,.nav-links a.active::after{transform:scaleX(1)}
@property --shine-angle{syntax:"<angle>";initial-value:0deg;inherits:false}
@keyframes panel-ring{to{--shine-angle:360deg}}
@keyframes accent-flow{to{background-position:240% center}}
@keyframes hero-breathe{to{transform:translate3d(1.5%,2%,0) scale(1.04)}}
@keyframes halo-spin{to{transform:rotate(360deg)}}
@keyframes orb-one{to{transform:translate3d(16vw,12vh,0) scale(1.18)}}
@keyframes orb-two{to{transform:translate3d(-18vw,18vh,0) scale(.82)}}
@keyframes orb-three{to{transform:translate3d(12vw,-16vh,0) scale(1.22)}}
@keyframes eyebrow-sheen{0%,55%{transform:translateX(-130%)}80%,100%{transform:translateX(130%)}}
@keyframes module-float{0%,100%{transform:translateY(0)}50%{transform:translateY(-4px)}}
@media(max-width:860px){.hero{min-height:auto;padding-top:58px}.pointer-aura{display:none}.experience-orb{width:80vw}.card{transform:none!important}.hero-dashboard-tilt::before{opacity:.25}.tbl-wrap{width:100%;max-width:calc(100vw - 48px);overflow-x:auto}}
@media(prefers-reduced-motion:reduce){.experience-orb,.hero::after,.hero::before,.hero h1 .accent,.eyebrow::after,.strip-list li,.hero-dashboard-tilt::before{animation:none!important}.hero .eyebrow,.hero h1,.hero .sub,.hero-ctas,.hero-points,.dashboard-capture,.reveal{opacity:1!important;transform:none!important;filter:none!important;transition:none!important}.pointer-aura,#experienceCanvas{display:none}.btn,.card{transform:none!important}}