/**
 * ALBAB SARTORIAL ATELIER - DESIGN TOKENS & SYSTEM VARIABLES
 * Inspired by Italian Quiet Luxury (Pini Parma, Loro Piana, Brunello Cucinelli)
 */

:root {
    /* 1. Typography (Italian High Luxury Brand Aesthetic) */
    --font-heading: 'Playfair Display', 'Bodoni Moda', 'Cormorant Garamond', Georgia, serif;
    --font-italic-luxury: 'Playfair Display', 'Bodoni Moda', 'Cormorant Garamond', Georgia, serif;
    --font-bodoni: 'Bodoni Moda', 'Playfair Display', Georgia, serif;
    --font-sans: 'Outfit', 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
    --font-mono: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace;

    /* 2. Color Palette (Light Taupe & Espresso Brown Standards) */
    --color-espresso: #2e180d;         /* Rich Italian Espresso Brown */
    --color-espresso-dark: #1b0d07;    /* Deep Roasted Espresso */
    --color-espresso-light: #523423;   /* Warm Roasted Mocha */

    --color-primary: #2e180d;          /* Espresso Brown Primary */
    --color-primary-dark: #1b0d07;     /* Deep Espresso */
    --color-primary-light: #5a4234;    /* Muted Espresso Slate */
    
    --color-bg: #ffffff;               /* Kept as it was: Pure Crisp White */
    --color-bg-secondary: #f6f5f3;     /* Warm Off-White Linen */
    --color-bg-tertiary: #fbfbfa;      /* Alabaster */
    
    --color-border: #e9e9e8;           /* Whisper Gray Divider */
    --color-border-dark: #d3d3d1;      /* Crisp Border */
    --color-border-light: #f0f0ef;
    
    --color-taupe: #8C7A6B;            /* Master Taupe */
    --color-taupe-light: #c2b5a8;      /* Light Taupe (Matching Top Banner) */
    --color-taupe-soft: #d7cdbf;       /* Very Soft Light Taupe */
    
    --color-accent: #9F2626;           /* Sartorial Burgundy / Wine Red */
    --color-accent-hover: #801e1e;
    --color-gold: #D4AF37;             /* Approved Master Gold */
    --color-success: #2e7d32;          /* Forest Green */
    --color-warning: #e65100;          /* Warm Ochre */
    --color-info: #1565c0;             /* Sapphire Navy */

    /* 3. Spacing System */
    --spacing-xxs: 4px;
    --spacing-xs: 8px;
    --spacing-sm: 12px;
    --spacing-md: 20px;
    --spacing-lg: 32px;
    --spacing-xl: 48px;
    --spacing-2xl: 72px;
    --spacing-3xl: 104px;

    /* 4. Layout Dimensions */
    --container-max-width: 1440px;
    --container-narrow: 920px;
    --header-height: 98px;
    --announcement-height: 36px;
    --product-card-aspect-ratio: 2 / 3;

    /* 5. Transitions & Animations */
    --transition-fast: 0.2s cubic-bezier(0.25, 1, 0.5, 1);
    --transition-normal: 0.35s cubic-bezier(0.25, 1, 0.5, 1);
    --transition-slow: 0.6s cubic-bezier(0.16, 1, 0.3, 1);

    /* 6. Shadows (Restrained, Editorial) */
    --shadow-subtle: 0 4px 20px rgba(34, 34, 27, 0.04);
    --shadow-hover: 0 10px 30px rgba(34, 34, 27, 0.07);
    --shadow-drawer: -5px 0 40px rgba(34, 34, 27, 0.12);
    --shadow-modal: 0 20px 50px rgba(34, 34, 27, 0.18);

    /* 7. Border Radii */
    --radius-none: 0;
    --radius-sm: 2px;
    --radius-md: 4px;
    --radius-pill: 999px;
}