*{box-sizing:border-box}
body{margin:0;background:#fff;color:#0f172a;font-family:ui-monospace,SFMono-Regular,Menlo,monospace;-webkit-font-smoothing:antialiased}
a{color:inherit;text-decoration:none}
.scanwrap{position:relative;min-height:100vh;overflow:hidden}
.grid-bg{position:absolute;inset:0;background-image:linear-gradient(rgba(16,185,129,.12) 1px,transparent 1px),linear-gradient(90deg,rgba(16,185,129,.12) 1px,transparent 1px);background-size:40px 40px;animation:grid 12s linear infinite;opacity:.6;pointer-events:none}
@keyframes grid{to{background-position:40px 40px,40px 40px}}
.vignette{position:absolute;inset:0;background:radial-gradient(ellipse at center,transparent 55%,rgba(255,255,255,.9));pointer-events:none}
.orb{position:absolute;width:24rem;height:24rem;border-radius:9999px;filter:blur(60px);pointer-events:none}
.orb-a{top:-8rem;left:-8rem;background:rgba(52,211,153,.25);animation:orb 9s ease-in-out infinite}
.orb-b{bottom:-8rem;right:-8rem;background:rgba(56,189,248,.2);animation:orb 14s ease-in-out infinite reverse}
@keyframes orb{50%{transform:translate(40px,30px) scale(1.15)}}
.wrap{position:relative;z-index:1;max-width:768px;margin:0 auto;padding:40px 20px;display:flex;flex-direction:column;align-items:center}
.pill{display:inline-flex;align-items:center;gap:8px;border:1px solid rgba(16,185,129,.6);background:#ecfdf5;color:#047857;padding:6px 12px;font-size:11px;letter-spacing:.25em;border-radius:6px;margin-bottom:32px;box-shadow:0 0 20px rgba(16,185,129,.15)}
.dot{position:relative;width:8px;height:8px}
.dot span{position:absolute;inset:0;background:#10b981;border-radius:9999px}
.dot span:first-child{animation:ping 1s cubic-bezier(0,0,.2,1) infinite;opacity:.75}
@keyframes ping{75%,100%{transform:scale(2);opacity:0}}
h1.glitch{position:relative;font-size:clamp(32px,6vw,60px);font-weight:900;text-transform:uppercase;letter-spacing:.08em;text-align:center;line-height:1.1;margin:0}
h1.glitch::before,h1.glitch::after{content:attr(data-text);position:absolute;inset:0;pointer-events:none}
h1.glitch::before{color:rgba(6,182,212,.7);transform:translate(2px,0);mix-blend-mode:multiply;animation:gl 3.5s infinite steps(2,end)}
h1.glitch::after{color:rgba(244,63,94,.6);transform:translate(-2px,0);mix-blend-mode:multiply;animation:gl 2.7s infinite reverse steps(2,end)}
@keyframes gl{0%,90%,100%{clip-path:inset(0);transform:translate(0)}92%{clip-path:inset(20% 0 60% 0);transform:translate(3px,-2px)}94%{clip-path:inset(60% 0 10% 0);transform:translate(-3px,2px)}96%{clip-path:inset(40% 0 40% 0);transform:translate(2px,1px)}}
.accent{color:#059669}
.sub{margin:16px 0 0;letter-spacing:.2em;color:#475569;font-size:14px;text-align:center}
.video-frame{position:relative;width:100%;margin-top:40px}
.glow{position:absolute;inset:-2px;border-radius:12px;background:linear-gradient(90deg,#34d399,#38bdf8,#34d399);opacity:.7;filter:blur(10px);animation:pulse 2s ease-in-out infinite}
@keyframes pulse{50%{opacity:.4}}
.video-inner{position:relative;background:#fff;border:1px solid #e2e8f0;border-radius:8px;padding:8px;box-shadow:0 10px 60px rgba(15,23,42,.15)}
.video-inner video{display:block;width:100%;border-radius:4px}
.badge{position:absolute;left:16px;top:16px;z-index:2;border:1px solid rgba(16,185,129,.7);background:rgba(255,255,255,.85);padding:4px 8px;font-size:10px;letter-spacing:.2em;color:#047857;border-radius:4px;backdrop-filter:blur(6px)}
#sound-btn{position:absolute;right:16px;bottom:16px;z-index:2;border:1px solid #cbd5e1;background:rgba(255,255,255,.9);padding:4px 12px;font-size:10px;letter-spacing:.2em;color:#334155;border-radius:4px;cursor:pointer;font-family:inherit}
#sound-btn:hover{background:#ecfdf5}
.corner{position:absolute;width:18px;height:18px;border-color:#10b981;border-style:solid;border-width:0;z-index:3}
.tl{top:-2px;left:-2px;border-top-width:2px;border-left-width:2px}
.tr{top:-2px;right:-2px;border-top-width:2px;border-right-width:2px}
.bl{bottom:-2px;left:-2px;border-bottom-width:2px;border-left-width:2px}
.br{bottom:-2px;right:-2px;border-bottom-width:2px;border-right-width:2px}
.scanbox{position:absolute;inset:8px;overflow:hidden;border-radius:4px;pointer-events:none}
.scanline{position:absolute;left:0;right:0;height:2px;background:linear-gradient(90deg,transparent,rgba(16,185,129,.7),transparent);animation:scan 3s linear infinite}
@keyframes scan{from{top:0}to{top:100%}}
.cta{position:relative;display:block;width:100%;margin-top:40px;border-radius:12px;overflow:hidden}
.shine{position:absolute;inset:0;background:linear-gradient(90deg,#0ea5e9,#3b82f6,#0ea5e9);background-size:200% 100%;animation:shine 3s linear infinite}
@keyframes shine{from{background-position:200% 0}to{background-position:-200% 0}}
.cta-inner{position:relative;display:flex;flex-direction:column;align-items:center;padding:20px;color:#fff;gap:4px}
.cta-title{display:flex;align-items:center;gap:12px;font-size:20px;font-weight:700}
.cta-sub{font-size:12px;opacity:.9}
.bounce,.cta-title svg{animation:bounce 1.6s ease-in-out infinite}
@keyframes bounce{50%{transform:translateY(-6px)}}
.section-label{margin-top:64px;font-size:11px;letter-spacing:.5em;color:#047857}
.section-title{margin:12px 0 0;font-size:clamp(22px,3.5vw,28px);font-weight:900;text-transform:uppercase;text-align:center}
.section-title mark{background:#fef3c7;color:#b45309;padding:0 8px;border-radius:4px}
.stats{margin-top:40px;display:grid;grid-template-columns:repeat(3,1fr);gap:12px;width:100%}
.stat{border:1px solid #e2e8f0;background:#fff;padding:20px 12px;text-align:center;border-radius:6px;transition:.25s}
.stat:hover{transform:translateY(-4px);border-color:#34d399;box-shadow:0 10px 25px rgba(16,185,129,.2)}
.stat .n{font-size:clamp(22px,3vw,28px);font-weight:900;color:#059669}
.stat .l{margin-top:4px;font-size:10px;letter-spacing:.2em;text-transform:uppercase;color:#64748b}
.foot{margin-top:64px;padding-top:24px;border-top:1px solid #e2e8f0;text-align:center;font-size:11px;color:#64748b;width:100%}
.foot-links{display:flex;justify-content:center;gap:24px;margin-bottom:12px}
.foot-links a:hover{color:#059669}
@media (min-width:640px){.stats{gap:24px}}