/**
 * Pure Planning - Design Tokens
 * Dark Mode: Bordeaux + Schwarz + Gold
 */

:root {
    /* ===== Brand Colors ===== */
    --primary: #1A1A1A;
    --primary-light: #333333;
    --primary-dark: #111111;
    --accent: #990100;
    --accent-light: #B52A2A;
    --accent-dark: #7A0100;
    --warm: #C9A96E;
    --warm-light: #DCC49A;
    --warm-dark: #A8874A;

    /* ===== Backgrounds (Dark Mode) ===== */
    --bg-cream: #141414;
    --bg-white: #1C1C1C;
    --bg-light: #181818;
    --bg-dark: #0D0D0D;
    --bg-dark-alt: #080808;
    --bg-overlay: rgba(0, 0, 0, 0.7);
    --bg-overlay-light: rgba(0, 0, 0, 0.4);

    /* ===== Text (Dark Mode) ===== */
    --text-dark: #F0EDE8;
    --text-body: #B5B0A8;
    --text-muted: #7A7672;
    --text-light: #FEFDFB;
    --text-accent: var(--accent);

    /* ===== Semantic ===== */
    --success: #34D058;
    --error: #F85149;
    --warning: #D4A017;
    --info: var(--accent);

    /* ===== Borders (Dark Mode) ===== */
    --border-light: rgba(255, 255, 255, 0.06);
    --border-medium: rgba(255, 255, 255, 0.12);
    --border-warm: rgba(201, 169, 110, 0.2);

    /* ===== Shadows (Dark Mode) ===== */
    --shadow-sm: 0 2px 8px rgba(0, 0, 0, 0.3);
    --shadow-md: 0 4px 20px rgba(0, 0, 0, 0.4);
    --shadow-lg: 0 12px 40px rgba(0, 0, 0, 0.5);
    --shadow-xl: 0 24px 60px rgba(0, 0, 0, 0.6);
    --shadow-glow: 0 0 40px rgba(153, 1, 0, 0.25);

    /* ===== Typography ===== */
    --font-serif: 'Playfair Display', 'Georgia', serif;
    --font-sans: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
    --font-mono: 'JetBrains Mono', 'Fira Code', monospace;

    --text-xs: clamp(0.7rem, 0.8vw, 0.75rem);
    --text-sm: clamp(0.8rem, 0.9vw, 0.875rem);
    --text-base: clamp(0.95rem, 1vw, 1.05rem);
    --text-lg: clamp(1.1rem, 1.2vw, 1.25rem);
    --text-xl: clamp(1.25rem, 1.5vw, 1.5rem);
    --text-2xl: clamp(1.5rem, 2vw, 2rem);
    --text-3xl: clamp(2rem, 3vw, 2.75rem);
    --text-4xl: clamp(2.5rem, 4vw, 3.5rem);
    --text-5xl: clamp(3rem, 5vw, 4.5rem);
    --text-hero: clamp(3.5rem, 7vw, 6rem);

    --leading-tight: 1.15;
    --leading-snug: 1.3;
    --leading-normal: 1.6;
    --leading-relaxed: 1.9;

    --tracking-tight: -0.02em;
    --tracking-normal: 0;
    --tracking-wide: 0.08em;
    --tracking-wider: 0.15em;
    --tracking-widest: 0.25em;

    /* ===== Spacing ===== */
    --space-xs: 0.25rem;
    --space-sm: 0.5rem;
    --space-md: 1rem;
    --space-lg: 1.5rem;
    --space-xl: 2rem;
    --space-2xl: 3rem;
    --space-3xl: 4rem;
    --space-4xl: 6rem;
    --space-5xl: 8rem;
    --space-section: clamp(5rem, 10vh, 8rem);

    /* ===== Layout ===== */
    --container-max: 1200px;
    --container-wide: 1400px;
    --container-narrow: 800px;
    --nav-height: 80px;

    /* ===== Borders ===== */
    --radius-sm: 4px;
    --radius-md: 8px;
    --radius-lg: 12px;
    --radius-xl: 20px;
    --radius-full: 9999px;

    /* ===== Transitions ===== */
    --ease-out: cubic-bezier(0.16, 1, 0.3, 1);
    --ease-in-out: cubic-bezier(0.65, 0, 0.35, 1);
    --ease-bounce: cubic-bezier(0.34, 1.56, 0.64, 1);
    --duration-fast: 0.2s;
    --duration-normal: 0.4s;
    --duration-slow: 0.6s;
    --duration-slower: 1s;

    /* ===== Z-Index ===== */
    --z-base: 1;
    --z-dropdown: 100;
    --z-sticky: 200;
    --z-overlay: 500;
    --z-modal: 1000;
    --z-nav: 900;
}