/* ===================================================
   Theme: Charcoal & Crimson (Default)
   Grey + Red + Warm Ivory harmonized palette
   =================================================== */

:root {
    /* --- Core palette --- */
    --grey-50: #FAFAFA;
    --grey-100: #F5F5F5;
    --grey-200: #EEEEEE;
    --grey-300: #E0E0E0;
    --grey-400: #BDBDBD;
    --grey-500: #9E9E9E;
    --grey-600: #757575;
    --grey-700: #616161;
    --grey-800: #424242;
    --grey-900: #212121;

    --red-400: #EF5350;
    --red-500: #E53935;
    --red-600: #D32F2F;
    --red-700: #C62828;

    --ivory: #FFF8F0;
    --warm-100: #FFF3E8;

    /* --- Semantic tokens --- */
    --accent: var(--red-500);
    --accent-hover: var(--red-700);
    --accent-contrast: #FFFFFF;

    /* Backgrounds */
    --bg-primary: var(--grey-50);
    --bg-secondary: var(--grey-100);

    /* Text */
    --text-primary: var(--grey-900);
    --text-secondary: var(--grey-700);
    --text-heading: var(--grey-900);
    --text-muted: var(--grey-500);

    /* Navigation */
    --nav-bg: rgba(33, 33, 33, 0.97);
    --nav-text: var(--grey-200);
    --nav-hover-bg: rgba(255, 255, 255, 0.08);

    /* Hero */
    --hero-bg: linear-gradient(135deg, var(--grey-900) 0%, var(--grey-800) 60%, var(--red-700) 100%);
    --hero-text: #FFFFFF;
    --hero-subtext: var(--grey-300);
    --hero-glow: var(--red-500);

    /* Cards */
    --card-bg: #FFFFFF;
    --card-border: var(--grey-200);

    /* Footer */
    --footer-bg: var(--grey-900);
    --footer-text: var(--grey-400);
    --footer-heading: var(--grey-100);
    --footer-border: var(--grey-800);
}