:root {
    color-scheme: light dark;

    /* ================= PRIMARY ================= */
    --vc-primary: #2563eb;
    --vc-primary-hover: #1d4ed8;
    --vc-primary-soft: rgba(37, 99, 235, 0.12);
    --vc-primary-glow: rgba(37, 99, 235, 0.35);

    /* ================= LIGHT ================= */
    --vc-bg: #f6f8fc;
    --vc-surface: #ffffff;
    --vc-surface-soft: #f1f5f9;

    --vc-text: #0f172a;
    --vc-text-soft: #475569;
    --vc-text-muted: #64748b;

    --vc-border: #e2e8f0;
    --vc-border-strong: #cbd5e1;

    --vc-shadow: 0 20px 50px rgba(15, 23, 42, 0.08);
    --vc-shadow-soft: 0 10px 30px rgba(15, 23, 42, 0.05);

    /* ================= UI ================= */
    --vc-radius-sm: 10px;
    --vc-radius-md: 16px;
    --vc-radius-lg: 24px;

    --vc-container: 1180px;

    /* ================= STABILITY TOKENS ================= */
    --vc-navbar-height: 76px;
    --vc-logo-size: 42px;
    --vc-icon-size: 44px;
    --vc-btn-min-height: 46px;
    --vc-card-min-height: 1px;

    --vc-font-family: "Poppins", system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;

    --vc-transition-fast: 0.18s ease;
    --vc-transition-normal: 0.25s ease;
}

/* ================= PAGE STABILITY ================= */

html {
    scrollbar-gutter: stable;
    -webkit-text-size-adjust: 100%;
    text-size-adjust: 100%;
}

html,
body {
    min-width: 320px;
}

/* ================= LIGHT ================= */

html[data-theme="light"] {
    color-scheme: light;

    --vc-bg: #f6f8fc;
    --vc-surface: #ffffff;
    --vc-surface-soft: #f1f5f9;

    --vc-text: #0f172a;
    --vc-text-soft: #475569;
    --vc-text-muted: #64748b;

    --vc-border: #e2e8f0;
    --vc-border-strong: #cbd5e1;

    --vc-shadow: 0 20px 50px rgba(15, 23, 42, 0.08);
    --vc-shadow-soft: 0 10px 30px rgba(15, 23, 42, 0.05);

    --vc-primary-soft: rgba(37, 99, 235, 0.12);
    --vc-primary-glow: rgba(37, 99, 235, 0.35);
}

/* ================= DARK ================= */

html[data-theme="dark"] {
    color-scheme: dark;

    --vc-bg: #020617;
    --vc-surface: #0b1220;
    --vc-surface-soft: #0f172a;

    --vc-text: #f8fafc;
    --vc-text-soft: #cbd5e1;
    --vc-text-muted: #94a3b8;

    --vc-border: rgba(148, 163, 184, 0.18);
    --vc-border-strong: rgba(148, 163, 184, 0.35);

    --vc-shadow: 0 30px 90px rgba(0, 0, 0, 0.65);
    --vc-shadow-soft: 0 18px 50px rgba(0, 0, 0, 0.45);

    --vc-primary-soft: rgba(37, 99, 235, 0.18);
    --vc-primary-glow: rgba(37, 99, 235, 0.45);
}

/* ================= SYSTEM ================= */

html[data-theme="system"] {
    color-scheme: light dark;
}

/* ================= AUTO DARK ================= */

@media (prefers-color-scheme: dark) {
    html[data-theme="system"] {
        --vc-bg: #020617;
        --vc-surface: #0b1220;
        --vc-surface-soft: #0f172a;

        --vc-text: #f8fafc;
        --vc-text-soft: #cbd5e1;
        --vc-text-muted: #94a3b8;

        --vc-border: rgba(148, 163, 184, 0.18);
        --vc-border-strong: rgba(148, 163, 184, 0.35);

        --vc-shadow: 0 30px 90px rgba(0, 0, 0, 0.65);
        --vc-shadow-soft: 0 18px 50px rgba(0, 0, 0, 0.45);

        --vc-primary-soft: rgba(37, 99, 235, 0.18);
        --vc-primary-glow: rgba(37, 99, 235, 0.45);
    }
}

/* ================= REDUCED MOTION SAFETY ================= */

@media (prefers-reduced-motion: reduce) {
    :root {
        --vc-transition-fast: 0.01ms linear;
        --vc-transition-normal: 0.01ms linear;
    }
}