/* ============================================================
   DESIGN TOKENS — The single source of truth for all styling.
   Change these values to transform the entire site aesthetic.
   ============================================================ */

:root {
    /* ── Colors ─── */
    --bg-color: #F9F7F2;
    --bg-alt: #F0EDE5;
    --text-color: #1A1A1A;
    --text-muted: #555555;
    --text-light: #888888;
    --gold: #C5A059;
    --gold-dark: #A68648;
    --gold-light: #E0BA6E;
    --gold-glow: rgba(197, 160, 89, 0.25);
    --white: #FFFFFF;
    --glass-bg: rgba(249, 247, 242, 0.85);
    --glass-border: #E0E0E0;
    --overlay-dark: rgba(0, 0, 0, 0.6);
    --overlay-light: rgba(249, 247, 242, 0.9);

    /* ── Semantic Colors ─── */
    --success: #2ecc71;
    --success-bg: rgba(46, 204, 113, 0.1);
    --error: #e74c3c;
    --error-bg: rgba(231, 76, 60, 0.1);
    --info: #3498db;
    --info-bg: rgba(52, 152, 219, 0.1);
    --warning: #f39c12;
    --warning-bg: rgba(243, 156, 18, 0.1);

    /* ── Typography ─── */
    --font-heading: 'Playfair Display', 'Georgia', serif;
    --font-body: 'Inter', 'Lato', -apple-system, sans-serif;
    --font-mono: 'JetBrains Mono', monospace;

    /* ── Spacing Scale ─── */
    --space-xs: 0.5rem;
    --space-sm: 1rem;
    --space-md: 2rem;
    --space-lg: 4rem;
    --space-xl: 6rem;
    --space-2xl: 8rem;
    --space-section: 120px;

    /* ── Sizing ─── */
    --container-max: 1280px;
    --container-width: 90%;
    --border-radius: 12px;
    --border-radius-sm: 6px;
    --border-radius-lg: 20px;
    --border-radius-full: 50%;

    /* ── Shadows ─── */
    --shadow-sm: 0 2px 8px rgba(0, 0, 0, 0.04);
    --shadow-md: 0 4px 20px rgba(0, 0, 0, 0.08);
    --shadow-lg: 0 8px 40px rgba(0, 0, 0, 0.12);
    --shadow-gold: 0 4px 30px rgba(197, 160, 89, 0.2);
    --shadow-card: 0 2px 16px rgba(0, 0, 0, 0.06);

    /* ── Transitions ─── */
    --ease-out: cubic-bezier(0.25, 0.46, 0.45, 0.94);
    --ease-spring: cubic-bezier(0.68, -0.55, 0.265, 1.55);
    --transition: all 0.6s cubic-bezier(0.25, 0.46, 0.45, 0.94);
    --transition-fast: all 0.3s ease;
    --transition-slow: all 1.2s cubic-bezier(0.25, 0.46, 0.45, 0.94);

    /* ── Z-Index Scale ─── */
    --z-base: 1;
    --z-above: 10;
    --z-nav: 1000;
    --z-modal: 2000;
    --z-toast: 3000;
}