:root{--surface:#212121;--surface-raised:#282828;--surface-line:#323232;--accent:#f44336;--accent-deep:#e2273d;--accent-light:#f44663;--boost-accent:#ffb300;--text:#fff;--text-muted:#bbb;--text-dim:#969696;--radius:10px;--radius-lg:14px;--radius-xl:22px;--pill:999px;--s1:.25rem;--s2:.5rem;--s3:.75rem;--s4:1rem;--s5:1.5rem;--s6:2rem;--s7:3rem;--s8:4.5rem;--s9:7rem;--brand:linear-gradient(135deg, var(--accent-light), var(--accent-deep));--shadow-1:0 1px 2px #0000004d;--shadow-2:0 12px 32px #00000059;--shadow-3:0 24px 60px #00000073;--ease:cubic-bezier(.2, .7, .2, 1);--ease-soft:cubic-bezier(.4, 0, .2, 1);--t-fast:.15s;--t-mid:.3s;--t-slow:.6s;--measure:1080px}*,:before,:after{box-sizing:border-box}html,body{height:100%}html{scroll-behavior:smooth}body{background:var(--surface);color:var(--text);-webkit-font-smoothing:antialiased;margin:0;font-family:Open Sans,Segoe UI,system-ui,-apple-system,sans-serif;line-height:1.5}a{color:var(--accent)}button{font:inherit}:focus-visible{outline:2px solid var(--accent-light);outline-offset:3px;border-radius:var(--s1)}@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,:before,:after{scroll-behavior:auto!important;transition-duration:.12s!important;animation-duration:.01ms!important;animation-iteration-count:1!important}}:root{--hero-orb-a:#f44663;--hero-orb-b:#7b3ff2;--hero-orb-c:#ff8a3d}body{overflow-x:hidden}.wrap{width:min(100% - 2.5rem, var(--measure));margin-inline:auto}.skip{left:var(--s4);z-index:10;padding:var(--s2) var(--s4);border-radius:var(--pill);background:var(--surface-raised);color:var(--text);transition:top var(--t-mid) var(--ease);text-decoration:none;position:absolute;top:-4rem}.skip:focus-visible{top:var(--s4)}.progress{z-index:9;background:var(--brand);height:3px;transform:scaleX(var(--sp,0));transform-origin:0;will-change:transform;position:fixed;inset:0 0 auto}.hero{isolation:isolate;min-height:min(92svh,900px);padding:var(--s9) 0 var(--s8);text-align:center;place-items:center;display:grid;position:relative;overflow:hidden}.orb{z-index:-2;filter:blur(90px);opacity:.5;will-change:transform;border-radius:50%;position:absolute}.orb-a{background:var(--hero-orb-a);width:44vw;min-width:320px;height:44vw;min-height:320px;animation:drift-a 26s var(--ease-soft) infinite alternate;top:-8vw;left:-6vw}.orb-b{background:var(--hero-orb-b);opacity:.38;width:38vw;min-width:280px;height:38vw;min-height:280px;animation:drift-b 32s var(--ease-soft) infinite alternate;top:4vw;right:-8vw}.orb-c{background:var(--hero-orb-c);opacity:.28;width:30vw;min-width:220px;height:30vw;min-height:220px;animation:drift-c 38s var(--ease-soft) infinite alternate;bottom:-12vw;left:40vw}.hero:after{content:"";z-index:-1;background:linear-gradient(to bottom, transparent, var(--surface) 92%);pointer-events:none;height:260px;position:absolute;inset:auto 0 0}.hero:before{content:"";z-index:-1;transform:translate3d(calc(var(--px,0) * -14px), calc(var(--py,0) * -14px), 0);background:linear-gradient(#ffffff0a 1px,#0000 1px) 0 0/64px 64px,linear-gradient(90deg,#ffffff0a 1px,#0000 1px) 0 0/64px 64px;position:absolute;inset:-10%;-webkit-mask-image:radial-gradient(70% 60% at 50% 40%,#000 30%,#0000 75%);mask-image:radial-gradient(70% 60% at 50% 40%,#000 30%,#0000 75%)}.hero-logo{width:clamp(88px,12vw,128px);transform:translate3d(calc(var(--px,0) * 10px), calc(var(--py,0) * 10px), 0);margin-inline:auto;position:relative}.hero-logo svg{filter:drop-shadow(0 10px 26px #f4433673);width:100%;height:auto;display:block}.hero-logo:after{content:"";z-index:-1;animation:halo 5s var(--ease-soft) infinite alternate;background:radial-gradient(circle,#f446638c,#0000 68%);border-radius:50%;position:absolute;inset:-18%}.hero h1{margin:var(--s5) 0 0;letter-spacing:-.02em;background:linear-gradient(#fff 30%,#ffb9c0);color:#0000;-webkit-background-clip:text;background-clip:text;font-size:clamp(2.6rem,7vw,4.6rem);line-height:1.05}.tagline{margin:var(--s4) auto 0;max-width:42ch;color:var(--text-muted);font-size:clamp(1.05rem,2.2vw,1.3rem)}.actions{gap:var(--s3);margin-top:var(--s6);flex-wrap:wrap;justify-content:center;display:flex}.note{margin-top:var(--s5);color:var(--text-dim);font-size:.9rem}.btn{--lift:0;align-items:center;gap:var(--s2);border-radius:var(--pill);transform:translateY(var(--lift));transition:transform var(--t-fast) var(--ease), box-shadow var(--t-fast) var(--ease), background-color var(--t-fast) var(--ease), border-color var(--t-fast) var(--ease);border:1px solid #0000;padding:.8rem 1.5rem;font-weight:600;text-decoration:none;display:inline-flex;position:relative;overflow:hidden}.btn:hover{--lift:-2px}.btn:active{--lift:0}.btn-primary{background:var(--brand);color:#fff;box-shadow:var(--shadow-2)}.btn-primary:hover{box-shadow:var(--shadow-3)}.btn-primary:after{content:"";width:40%;transition:left var(--t-slow) var(--ease);background:linear-gradient(90deg,#0000,#ffffff59,#0000);position:absolute;inset:0 auto 0 -60%;transform:skew(-20deg)}.btn-primary:hover:after{left:120%}.btn-secondary{border-color:var(--surface-line);color:var(--text);background:#ffffff0a}.btn-secondary:hover{border-color:var(--text-dim);background:#ffffff14}main{z-index:1;position:relative}section{padding-block:var(--s8)}h2{margin:0 0 var(--s6);letter-spacing:-.01em;font-size:clamp(1.7rem,3.6vw,2.4rem)}h2:after{content:"";width:72px;height:3px;margin-top:var(--s3);border-radius:var(--pill);background:var(--brand);transform-origin:0;transition:transform var(--t-slow) var(--ease) .15s;display:block;transform:scaleX(0)}.in h2:after{transform:scaleX(1)}.lede{max-width:62ch;margin:calc(var(--s6) * -1) 0 var(--s6);color:var(--text-muted)}.grid{gap:var(--s4);grid-template-columns:repeat(auto-fit,minmax(min(100%,260px),1fr));display:grid}.card{--lift:0;isolation:isolate;padding:var(--s5);border:1px solid var(--surface-line);border-radius:var(--radius-lg);background:var(--surface-raised);transform:translateY(var(--lift));transition:transform var(--t-mid) var(--ease), border-color var(--t-mid) var(--ease), box-shadow var(--t-mid) var(--ease);position:relative;overflow:hidden}.card:hover{--lift:-4px;box-shadow:var(--shadow-2);border-color:#4a4a4a}.card:before{content:"";z-index:-1;opacity:0;background:radial-gradient(320px circle at var(--mx,50%) var(--my,50%), #f4466329, transparent 70%);transition:opacity var(--t-mid) var(--ease);position:absolute;inset:0}.card:hover:before{opacity:1}.card:after{content:"";background:var(--brand);transform-origin:0;height:2px;transition:transform var(--t-mid) var(--ease);position:absolute;inset:auto 0 0;transform:scaleX(0)}.card:hover:after{transform:scaleX(1)}.card h3{margin:0 0 var(--s2);align-items:center;gap:var(--s2);font-size:1.05rem;display:flex}.card p{color:var(--text-muted);margin:0;font-size:.95rem}.card svg{width:20px;height:20px;color:var(--accent-light);flex:none}.highlight{gap:var(--s7);padding:var(--s7);border:1px solid var(--surface-line);border-radius:var(--radius-xl);background:radial-gradient(120% 100% at 0% 0%, #f446631f, transparent 60%), var(--surface-raised);grid-template-columns:repeat(auto-fit,minmax(min(100%,320px),1fr));align-items:center;display:grid}.highlight h2{margin-top:0}.highlight p{color:var(--text-muted)}.demo{padding:var(--s5);border:1px solid var(--surface-line);border-radius:var(--radius-lg);background:#00000040}.demo-track{border-radius:var(--pill);background:var(--surface-line);height:6px;overflow:hidden}.demo-fill{border-radius:inherit;background:var(--brand);width:8%;height:100%;animation:24s linear infinite advance}.chips{gap:var(--s2);margin-top:var(--s4);flex-wrap:wrap;display:flex}.chip{align-items:center;gap:var(--s2);border:1px solid var(--surface-line);border-radius:var(--pill);color:var(--text-muted);background:#ffffff0a;padding:.3rem .7rem;font-size:.8rem;display:inline-flex}.chip.host{border-color:var(--accent-deep);color:var(--text)}.dot{background:var(--accent);width:7px;height:7px;animation:beat 2s var(--ease-soft) infinite;border-radius:50%}.chip:nth-child(2) .dot{animation-delay:.4s}.chip:nth-child(3) .dot{animation-delay:.8s}.caption{margin:var(--s4) 0 0;color:var(--text-dim);font-size:.85rem}.boost-demo{gap:var(--s3);padding:var(--s5);border:1px solid var(--surface-line);border-radius:var(--radius-lg);background:#00000040;display:grid}.boost-scale{color:var(--text-dim);justify-content:space-between;font-size:.75rem;display:flex}.boost-track{border-radius:var(--pill);background:linear-gradient(90deg, var(--accent) 0 50%, var(--boost-accent) 50% 100%);height:8px;position:relative;overflow:hidden}.boost-fill{background:var(--surface-line);transform-origin:100%;animation:boost-sweep 7s var(--ease-soft) infinite;position:absolute;inset:0}.boost-mark{background:#ffffff73;width:2px;position:absolute;inset:-4px auto -4px 50%}footer{padding-block:var(--s7) var(--s8);border-top:1px solid var(--surface-line);color:var(--text-dim);font-size:.9rem}footer p{margin:0 0 var(--s2)}.js .rv{opacity:0}.js .rv.in{opacity:1;animation:rv-up var(--t-slow) var(--ease) backwards;animation-delay:calc(var(--i,0) * 70ms)}.js .rv-l.in{animation-name:rv-left}.js .rv-r.in{animation-name:rv-right}.js .rv-s.in{animation-name:rv-scale}@keyframes rv-up{0%{opacity:0;transform:translateY(26px)}}@keyframes rv-left{0%{opacity:0;transform:translate(-28px)}}@keyframes rv-right{0%{opacity:0;transform:translate(28px)}}@keyframes rv-scale{0%{opacity:0;transform:scale(.94)}}.rise{animation:rise .75s var(--ease) both;animation-delay:calc(var(--i,0) * 90ms)}@keyframes rise{0%{opacity:0;transform:translateY(20px)}}@keyframes drift-a{to{transform:translate(6rem,3rem)scale(1.18)}}@keyframes drift-b{to{transform:translate(-7rem,-2rem)scale(.9)}}@keyframes drift-c{to{transform:translate(-4rem,-5rem)scale(1.12)}}@keyframes halo{0%{opacity:.55;transform:scale(1)}to{opacity:1;transform:scale(1.16)}}@keyframes advance{0%{width:8%}to{width:96%}}@keyframes beat{50%{opacity:.5;transform:scale(.62)}}@keyframes boost-sweep{0%,8%{transform:scaleX(.68)}55%,70%{transform:scaleX(.15)}to{transform:scaleX(.68)}}@supports (animation-timeline:view()){@media (prefers-reduced-motion:no-preference){.hero-inner{animation:linear both hero-out;animation-timeline:view();animation-range:exit 10% exit 90%}@keyframes hero-out{to{opacity:.15;transform:translateY(-40px)scale(.97)}}}}@media (prefers-reduced-motion:reduce){.js .rv,.js .rv.in{opacity:1;animation:none}.orb{animation:none}.progress{display:none}.hero:before,.hero-logo{transform:none}.demo-fill,.boost-fill,.dot,.hero-logo:after{animation:none}.boost-fill{transform:scaleX(.15)}}
