:root{--primary:#001736;--primary-container:#002b5b;--primary-fixed-dim:#a9c7ff;--on-primary:#fff;--secondary:#5f5e5e;--on-secondary:#fff;--secondary-container:#e4e2e1;--on-secondary-container:#656464;--background:#faf9fe;--on-background:#1a1c1f;--surface:#faf9fe;--on-surface:#1a1c1f;--surface-container-lowest:#fff;--surface-container-low:#f4f3f8;--surface-container:#eeedf2;--surface-container-high:#e8e7ec;--surface-container-highest:#e3e2e7;--outline:#747780;--outline-variant:#c4c6d0;--accent:#007bff;--accent-hover:#0056b3;--accent-light:#007bff1a;--error:#ba1a1a;--on-error:#fff;--error-container:#ffdad6;--radius-sm:2px;--radius-md:4px;--radius-lg:8px;--radius-xl:12px;--radius-2xl:16px;--radius-3xl:24px;--radius-full:9999px;--spacing-unit:8px;--container-max:1280px;--margin-mobile:20px;--margin-desktop:64px;--gutter:24px;--font-display:"Hanken Grotesk", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;--font-body:"Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;--font-mono:"JetBrains Mono", monospace;--shadow-sm:0px 2px 8px #00000005;--shadow-md:0px 10px 30px #00000008;--shadow-lg:0px 15px 35px #0000000f;--shadow-xl:0px 20px 50px #00000014;--shadow-glow:0px 0px 40px #007bff26;--transition-fast:.2s cubic-bezier(.4, 0, .2, 1);--transition-normal:.3s cubic-bezier(.4, 0, .2, 1);--transition-slow:.5s cubic-bezier(.4, 0, .2, 1)}:root.dark{--primary:#d6e3ff;--primary-container:#002b5b;--primary-fixed-dim:#a9c7ff;--on-primary:#001b3d;--secondary:#c8c6c6;--on-secondary:#2f2f2f;--background:#0a0e17;--on-background:#e3e2e6;--surface:#0a0e17;--on-surface:#e3e2e6;--surface-container-lowest:#0d121f;--surface-container-low:#121827;--surface-container:#161e30;--surface-container-high:#1d273d;--surface-container-highest:#232f4a;--outline:#8e9099;--outline-variant:#43474e;--accent:#3b82f6;--accent-hover:#60a5fa;--accent-light:#3b82f626;--surface-tint:#a9c7ff;--shadow-sm:0px 2px 8px #0003;--shadow-md:0px 10px 30px #0000004d;--shadow-lg:0px 15px 35px #0006;--shadow-xl:0px 20px 50px #00000080;--shadow-glow:0px 0px 40px #3b82f633}.container-max{max-width:var(--container-max);padding-left:var(--margin-mobile);padding-right:var(--margin-mobile);margin-left:auto;margin-right:auto}@media (min-width:768px){.container-max{padding-left:var(--margin-desktop);padding-right:var(--margin-desktop)}}.glass-panel{-webkit-backdrop-filter:blur(20px);box-shadow:var(--shadow-md);transition:var(--transition-normal);background:#ffffffb3;border:1px solid #ffffff80}.dark .glass-panel{background:#161e30b3;border:1px solid #ffffff0d}.premium-card{background:linear-gradient(180deg, var(--surface-container-lowest) 0%, #002b5b05 100%);border:1px solid var(--outline-variant);box-shadow:var(--shadow-sm);transition:all var(--transition-normal)}.dark .premium-card{background:linear-gradient(180deg, var(--surface-container-lowest) 0%, #3b82f608 100%);border:1px solid #ffffff12}.hover-lift{transition:transform var(--transition-normal), box-shadow var(--transition-normal), border-color var(--transition-normal)}.hover-lift:hover{box-shadow:var(--shadow-lg);border-color:var(--accent);transform:translateY(-6px)}.text-gradient{background:linear-gradient(135deg, var(--primary) 0%, var(--primary-container) 50%, var(--accent) 100%);-webkit-text-fill-color:transparent;-webkit-background-clip:text;background-clip:text}.dark .text-gradient{background:linear-gradient(135deg, #fff 0%, var(--accent) 100%);-webkit-text-fill-color:transparent;-webkit-background-clip:text;background-clip:text}.subtle-bg-glow{border-radius:var(--radius-full);filter:blur(100px);z-index:-1;pointer-events:none;opacity:.6;position:absolute}.gap-gutter{gap:var(--gutter)}.btn{font-family:var(--font-body);border-radius:var(--radius-lg);cursor:pointer;transition:all var(--transition-fast);white-space:nowrap;border:1px solid #0000;justify-content:center;align-items:center;gap:8px;padding:12px 24px;font-size:15px;font-weight:600;text-decoration:none;display:inline-flex}.btn:active{transform:scale(.97)}.btn-sm{border-radius:var(--radius-md);padding:8px 16px;font-size:13px}.btn-lg{border-radius:var(--radius-xl);padding:16px 32px;font-size:16px}.btn-primary{background-color:var(--primary-container);color:var(--on-primary);border-color:var(--primary-container)}.btn-primary:hover{background-color:var(--accent);border-color:var(--accent);color:#fff;box-shadow:var(--shadow-glow)}.btn-secondary{background-color:var(--surface-container-lowest);color:var(--primary-container);border-color:var(--outline-variant)}.btn-secondary:hover{background-color:var(--surface-container-low);border-color:var(--outline)}.btn-accent{background-color:var(--accent);color:#fff;border-color:var(--accent)}.btn-accent:hover{background-color:var(--accent-hover);border-color:var(--accent-hover);box-shadow:var(--shadow-glow)}.hero-gradient{background:linear-gradient(135deg,#001736 0%,#002b5b 25%,#003d8f 50%,#007bff 100%) 0 0/200% 200%;animation:8s infinite gradientShift}@keyframes gradientShift{0%{background-position:0%}50%{background-position:100%}to{background-position:0%}}.mesh-gradient{background:radial-gradient(at 20% 20%, #007bff26 0%, transparent 50%), radial-gradient(at 80% 40%, #002b5b1a 0%, transparent 50%), radial-gradient(at 50% 80%, #007bff14 0%, transparent 50%), var(--background)}.dark .mesh-gradient{background:radial-gradient(at 20% 20%, #3b82f61a 0%, transparent 50%), radial-gradient(at 80% 40%, #002b5b26 0%, transparent 50%), radial-gradient(at 50% 80%, #3b82f60d 0%, transparent 50%), var(--background)}.code-block{background:var(--surface-container-lowest);border:1px solid var(--outline-variant);border-radius:var(--radius-lg);font-family:var(--font-mono);padding:16px 20px;font-size:13px;overflow-x:auto}.dark .code-block{background:var(--surface-container-low);border-color:#ffffff12}.badge{font-family:var(--font-mono);text-transform:uppercase;letter-spacing:.06em;border-radius:var(--radius-full);border:1px solid var(--accent);color:var(--accent);background-color:var(--accent-light);align-items:center;gap:6px;padding:6px 14px;font-size:11px;font-weight:600;display:inline-flex}.divider{background:linear-gradient(90deg, var(--accent), var(--primary-container));border-radius:var(--radius-full);width:60px;height:3px}.stat-number{font-family:var(--font-display);background:linear-gradient(135deg, var(--accent) 0%, var(--primary-container) 100%);-webkit-text-fill-color:transparent;-webkit-background-clip:text;background-clip:text;font-size:2.5rem;font-weight:800;line-height:1}
