:root{--bg-main:#08080a;--bg-surface:#101014;--bg-surface-secondary:#16161c;--bg-glass:#121218bf;--bg-glass-card:#1a1a22a6;--bg-glass-hover:#242430d9;--border-subtle:#ffffff14;--border-medium:#ffffff26;--border-glow:#00f0ff59;--text-primary:#fff;--text-secondary:#a1a1aa;--text-muted:#71717a;--text-inverted:#08080a;--accent-cyan:#00f0ff;--accent-cyan-glow:#00f0ff66;--accent-amber:#ff7a00;--accent-amber-glow:#ff7a0059;--accent-purple:#a855f7;--radius-sm:8px;--radius-md:14px;--radius-lg:22px;--radius-full:9999px;--font-display:"Outfit", -apple-system, BlinkMacSystemFont, "SF Pro Display", sans-serif;--font-body:"Inter", -apple-system, BlinkMacSystemFont, "SF Pro Text", sans-serif;--shadow-sm:0 4px 12px #0000004d;--shadow-md:0 10px 30px #00000080;--shadow-lg:0 20px 50px #000000b3;--shadow-cyan:0 0 35px #00f0ff40;--shadow-amber:0 0 35px #ff7a0040}*{box-sizing:border-box;margin:0;padding:0}html,body{max-width:100vw;position:relative;overflow-x:hidden}html{scroll-behavior:smooth;--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark}body{font-family:var(--font-body);background-color:var(--bg-main);color:var(--text-primary);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;background-image:radial-gradient(circle at 50% 0,#00f0ff14 0%,#0000 50%),radial-gradient(circle at 80% 30%,#ff7a000d 0%,#0000 40%),radial-gradient(circle at 10% 70%,#a855f70d 0%,#0000 50%);background-attachment:fixed;line-height:1.6}h1,h2,h3,h4,h5,h6{font-family:var(--font-display);letter-spacing:-.02em;word-break:break-word;font-weight:700;line-height:1.15}.gradient-text{background:linear-gradient(135deg,#fff 0%,#a1a1aa 100%);-webkit-text-fill-color:transparent;-webkit-background-clip:text}.gradient-text-cyan{background:linear-gradient(135deg, #fff 20%, var(--accent-cyan) 100%);-webkit-text-fill-color:transparent;-webkit-background-clip:text}.gradient-text-amber{background:linear-gradient(135deg, #fff 20%, var(--accent-amber) 100%);-webkit-text-fill-color:transparent;-webkit-background-clip:text}.container{width:100%;max-width:1200px;margin:0 auto;padding:0 24px}.glass-panel{background:var(--bg-glass);-webkit-backdrop-filter:blur(20px);border:1px solid var(--border-subtle);border-radius:var(--radius-lg)}.glass-card{background:var(--bg-glass-card);-webkit-backdrop-filter:blur(16px);border:1px solid var(--border-subtle);border-radius:var(--radius-md);transition:all .3s cubic-bezier(.16,1,.3,1)}.glass-card:hover{background:var(--bg-glass-hover);border-color:var(--border-medium);box-shadow:var(--shadow-md);transform:translateY(-4px)}.btn{font-family:var(--font-body);border-radius:var(--radius-full);cursor:pointer;white-space:nowrap;border:none;outline:none;justify-content:center;align-items:center;gap:10px;padding:14px 28px;font-size:15px;font-weight:600;text-decoration:none;transition:all .25s cubic-bezier(.16,1,.3,1);display:inline-flex}.btn-primary{color:var(--text-inverted);background:#fff;box-shadow:0 4px 20px #ffffff40}.btn-primary:hover{background:#f0f0f5;transform:translateY(-2px);box-shadow:0 8px 30px #fff6}.btn-secondary{color:#fff;border:1px solid var(--border-medium);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);background:#ffffff14}.btn-secondary:hover{background:#ffffff26;border-color:#ffffff4d;transform:translateY(-2px)}.badge-pill{border-radius:var(--radius-full);color:var(--text-secondary);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);background:#ffffff0d;border:1px solid #ffffff1f;align-items:center;gap:8px;max-width:100%;padding:6px 14px;font-size:13px;font-weight:500;display:inline-flex}.badge-pill-cyan{color:var(--accent-cyan);background:#00f0ff14;border-color:#00f0ff40}.comparison-wrapper{border-radius:var(--radius-lg);width:100%;max-width:960px;box-shadow:var(--shadow-lg);border:1px solid var(--border-subtle);-webkit-user-select:none;user-select:none;touch-action:pan-y;background:#000;margin:0 auto;position:relative;overflow:hidden}.comparison-image-container{aspect-ratio:16/10;width:100%;position:relative;overflow:hidden}.comparison-image{object-fit:cover;width:100%;height:100%;position:absolute;top:0;left:0}.comparison-image-after{width:100%;height:100%;position:absolute;top:0;left:0;overflow:hidden}.comparison-slider-handle{cursor:ew-resize;z-index:10;background:#fff;width:3px;position:absolute;top:0;bottom:0;box-shadow:0 0 16px #fffc}.comparison-slider-button{color:#000;background:#fff;border-radius:50%;justify-content:center;align-items:center;width:40px;height:40px;font-size:15px;display:flex;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);box-shadow:0 4px 20px #0009}.photon-range-input{appearance:none;border-radius:var(--radius-full);background:#ffffff1f;outline:none;width:100%;height:8px;transition:background .2s}.photon-range-input::-webkit-slider-thumb{appearance:none;cursor:pointer;background:#fff;border-radius:50%;width:22px;height:22px;transition:transform .1s,box-shadow .2s;box-shadow:0 2px 8px #0006}.photon-range-input::-webkit-slider-thumb:hover{transform:scale(1.15);box-shadow:0 0 12px #fffc}.phone-mockup-container{background:#000;border:8px solid #222228;border-radius:44px;width:310px;max-width:100%;height:620px;position:relative;overflow:hidden;box-shadow:0 0 0 1px #ffffff1a,0 25px 60px #000c,0 0 80px #00f0ff26}.phone-island{z-index:30;background:#000;border-radius:12px;width:84px;height:22px;position:absolute;top:10px;left:50%;transform:translate(-50%)}.easter-egg-toast{border-radius:var(--radius-full);z-index:9999;-webkit-backdrop-filter:blur(20px);text-align:center;background:#0f0f14f2;border:1px solid #ff649680;justify-content:center;align-items:center;gap:10px;width:calc(100% - 32px);max-width:520px;padding:14px 20px;animation:.4s cubic-bezier(.16,1,.3,1) forwards slideUpFade;display:flex;position:fixed;bottom:24px;left:50%;transform:translate(-50%);box-shadow:0 10px 40px #ff326459}@keyframes slideUpFade{0%{opacity:0;transform:translate(-50%,40px)scale(.95)}to{opacity:1;transform:translate(-50%)scale(1)}}@keyframes pulseGlow{0%,to{opacity:.4;transform:scale(1)}50%{opacity:.8;transform:scale(1.05)}}.pulse-glow{animation:6s ease-in-out infinite pulseGlow}@media (width<=768px){.container{padding:0 16px}.btn{padding:12px 20px;font-size:14px}.comparison-image-container{aspect-ratio:4/3}.phone-mockup-container{border-width:6px;border-radius:38px;width:290px;height:580px}.glass-panel{border-radius:var(--radius-md)}}@media (width<=480px){.btn{width:100%}.phone-mockup-container{border-radius:34px;width:270px;height:540px}}
