:root {
            --c-primary: #0b1c2d;
            --c-primary-2: #143553;
            --c-accent: #d4af37;
            --c-accent-2: #b8962e;
            --c-bg: #f5f7fb;
            --c-surface: #ffffff;
            --c-text: #0f172a;
            --c-text-inv: #ffffff;
            --c-muted: #64748b;
            --c-border: #e5e7eb;
        }

        .topbar {
            background: #3d1807;
        }

        .btn-cta {
            background: linear-gradient(135deg, var(--c-accent), var(--c-accent-2));
            border: none;
            color: #0b0f14;
            font-weight: 800;
        }

        .btn-cta:hover {
            background: linear-gradient(135deg, var(--c-accent-2), var(--c-accent));
            color: #0b0f14;
        }

        .hero {
            background: linear-gradient(135deg, #713f02, #000000);
            color: var(--c-text-inv);
            position: relative;
            overflow: hidden;
        }

        .hero .lead,
        .hero h1,
        .hero h2,
        .hero h3,
        .hero h4,
        .hero h5 {
            color: var(--c-text-inv);
        }

        .hero::before {
            content: "";
            position: absolute;
            width: 520px;
            height: 520px;
            top: -220px;
            right: -180px;
            background: radial-gradient(circle, rgba(212, 175, 55, 0.25), transparent 60%);
            filter: blur(2px);
            pointer-events: none;
        }

        .theme-card {
            background: var(--c-surface);
            border: 1px solid var(--c-border);
            border-left: 6px solid var(--c-accent);
            border-radius: 16px;
        }

        .theme-card .icon-badge {
            width: 48px;
            height: 48px;
            border-radius: 14px;
            display: inline-flex;
            align-items: center;
            justify-content: center;
            background: rgba(212, 175, 55, 0.15);
            color: var(--c-accent-2);
            font-size: 22px;
        }

        .theme-card.active {
            background: linear-gradient(135deg, #572107, #532514);
            color: #fff;
            border-color: rgba(255, 255, 255, 0.12);
        }

        .theme-card.active h5,
        .theme-card.active p {
            color: #fff;
        }

        .theme-card.active .icon-badge {
            background: rgba(255, 255, 255, 0.12);
            color: var(--c-accent);
        }

        .section-title {
            color: var(--c-primary);
            font-weight: 900;
        }

        footer {
            background: linear-gradient(135deg, var(--c-primary), var(--c-primary-2));
            color: rgba(255, 255, 255, 0.9);
        }

        footer .brand {
            color: var(--c-accent);
            font-weight: 900;
        }