
        :root { --bg: #080b12; --surface: #0e1220; }
        * { box-sizing: border-box; }
        body { font-family: 'Inter', sans-serif; background: var(--bg); color: #fff; margin: 0; overflow-x: hidden; }
        .font-display { font-family: 'Space Grotesk', sans-serif; }
        .gradient-bg {
            position: fixed; inset: 0; z-index: -2;
            background:
                radial-gradient(ellipse 80% 50% at 50% -5%, rgba(124,58,237,0.22) 0%, transparent 70%),
                radial-gradient(ellipse 50% 40% at 15% 80%, rgba(76,29,149,0.15) 0%, transparent 60%),
                linear-gradient(180deg, #080b12 0%, #0c0f1e 50%, #080b12 100%);
        }
        .grid-pattern {
            position: fixed; inset: 0; z-index: -1; pointer-events: none; opacity: 0.03;
            background-image: linear-gradient(rgba(255,255,255,0.12) 1px, transparent 1px), linear-gradient(90deg, rgba(255,255,255,0.12) 1px, transparent 1px);
            background-size: 64px 64px;
        }
        .noise {
            position: fixed; inset: 0; z-index: 9998; pointer-events: none; opacity: 0.025;
            background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 200 200' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.75' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
        }
        nav {
            position: sticky; top: 0; z-index: 50; padding: 1rem 1.5rem;
            background: rgba(8,11,18,0.8); backdrop-filter: blur(20px); -webkit-backdrop-filter: blur(20px);
            border-bottom: 1px solid rgba(255,255,255,0.06);
        }
        .nav-inner { max-width: 860px; margin: 0 auto; display: flex; align-items: center; justify-content: space-between; }
        .content-card {
            background: rgba(255,255,255,0.025);
            border: 1px solid rgba(255,255,255,0.07);
            backdrop-filter: blur(12px);
            border-radius: 1.25rem;
        }
        .section-block { border-left: 2px solid rgba(124,58,237,0.4); padding-left: 1.25rem; }
        a.nav-link { font-size: 0.8rem; color: rgba(255,255,255,0.35); text-decoration: none; transition: color 0.2s; }
        a.nav-link:hover { color: #fff; }
        ::-webkit-scrollbar { width: 5px; }
        ::-webkit-scrollbar-track { background: #080b12; }
        ::-webkit-scrollbar-thumb { background: #3b1f7a; border-radius: 3px; }
        ::-webkit-scrollbar-thumb:hover { background: #7c3aed; }
        /* ── Footer ── */
.site-footer { border-top: 1px solid rgba(255,255,255,.06); padding: 4rem 2rem 0; position: relative; }
.site-footer::before { content: ''; position: absolute; inset: 0; background: radial-gradient(ellipse 60% 50% at 50% 0%, rgba(76,29,149,0.12) 0%, transparent 70%); pointer-events: none; z-index: 0; }
.footer-top { max-width: 1080px; margin: 0 auto; display: grid; grid-template-columns: 1fr 1fr; gap: 3rem 2rem; padding-bottom: 3.5rem; position: relative; z-index: 1; }
.footer-brand-name { font-family: 'Space Grotesk', sans-serif; font-size: 1.6rem; font-weight: 800; color: #fff; margin-bottom: .85rem; letter-spacing: -.02em; }
.footer-brand-desc { font-size: .95rem; color: rgba(167,139,250,.45); line-height: 1.65; max-width: 320px; }
.footer-cols { display: grid; grid-template-columns: 1fr 1fr; gap: 2rem; }
.footer-col-title { font-size: .65rem; font-weight: 700; letter-spacing: .2em; text-transform: uppercase; color: rgba(167,139,250,.4); margin-bottom: 1.1rem; }
.footer-col-links { display: flex; flex-direction: column; gap: .65rem; }
.footer-col-link { font-size: .95rem; color: rgba(255,255,255,.4); text-decoration: none; transition: color .2s; }
.footer-col-link:hover { color: #fff; }
.footer-bottom { max-width: 1080px; margin: 0 auto; border-top: 1px solid rgba(255,255,255,.06); padding: 1.5rem 0 2rem; display: flex; flex-direction: column; gap: .4rem; position: relative; z-index: 1; }
.footer-copy { font-size: .82rem; color: rgba(255,255,255,.2); }
.footer-disclaimer { font-size: .82rem; color: rgba(124,58,237,.6); }

@media (max-width: 640px) { .footer-top { grid-template-columns: 1fr; gap: 2rem; } .footer-brand-name { font-size: 1.3rem; } .footer-brand-desc { font-size: .85rem; } .footer-col-link { font-size: .88rem; } }
    
