/* ============================================
   Saxho.net — CSS Custom Properties
   ============================================ */

:root {
    /* --- Couleurs --- */
    --c-primary: #1B3A9E;
    --c-primary-light: #3A7DFF;
    --c-primary-dark: #122970;
    --c-secondary: #D94F70;
    --c-secondary-light: #E2758E;
    --c-tertiary: #F5A623;
    --c-tertiary-light: #F7BD5A;
    --c-accent: #D94F70;
    --c-accent-light: #E2758E;
    --c-dark: #0D0D1A;
    --c-dark-soft: #1A1A2E;
    --c-medium: #4A5568;
    --c-muted: #718096;
    --c-light: #F8F7F4;
    --c-surface: #EDEAE5;
    --c-surface-hover: #E2DFD8;
    --c-white: #FFFFFF;
    --c-success: #10B981;
    --c-error: #EF4444;
    --c-warning: #F59E0B;
    --c-info: #3B82F6;

    /* --- Typographie --- */
    --ff-display: 'Space Grotesk', system-ui, -apple-system, sans-serif;
    --ff-body: 'Inter', system-ui, -apple-system, sans-serif;
    --ff-mono: 'JetBrains Mono', 'Fira Code', monospace;

    --fs-hero: clamp(2.5rem, 5vw, 4.5rem);
    --fs-h1: clamp(2rem, 4vw, 3.5rem);
    --fs-h2: clamp(1.5rem, 3vw, 2.5rem);
    --fs-h3: clamp(1.25rem, 2vw, 1.75rem);
    --fs-h4: clamp(1.1rem, 1.5vw, 1.35rem);
    --fs-body: 1rem;
    --fs-body-lg: 1.125rem;
    --fs-small: 0.875rem;
    --fs-xs: 0.75rem;

    --fw-regular: 400;
    --fw-medium: 500;
    --fw-semibold: 600;
    --fw-bold: 700;

    --lh-tight: 1.2;
    --lh-normal: 1.6;
    --lh-relaxed: 1.8;

    --ls-tight: -0.02em;
    --ls-normal: 0;
    --ls-wide: 0.05em;
    --ls-wider: 0.1em;

    /* --- Espacements --- */
    --sp-2xs: 0.125rem;  /* 2px */
    --sp-xs: 0.25rem;    /* 4px */
    --sp-sm: 0.5rem;     /* 8px */
    --sp-md: 1rem;       /* 16px */
    --sp-lg: 1.5rem;     /* 24px */
    --sp-xl: 2rem;       /* 32px */
    --sp-2xl: 3rem;      /* 48px */
    --sp-3xl: 4rem;      /* 64px */
    --sp-4xl: 6rem;      /* 96px */
    --sp-5xl: 8rem;      /* 128px */

    /* --- Layout --- */
    --container-max: 1200px;
    --container-narrow: 800px;
    --container-wide: 1400px;
    --container-padding: var(--sp-lg);
    --header-height: 72px;
    --section-padding: var(--sp-4xl) 0;

    /* --- Bordures & Rayons --- */
    --radius-sm: 6px;
    --radius-md: 12px;
    --radius-lg: 20px;
    --radius-xl: 32px;
    --radius-full: 9999px;

    /* --- Ombres --- */
    --shadow-sm: 0 1px 3px rgba(13, 13, 26, 0.08);
    --shadow-md: 0 4px 12px rgba(13, 13, 26, 0.1);
    --shadow-lg: 0 8px 30px rgba(13, 13, 26, 0.12);
    --shadow-xl: 0 16px 50px rgba(13, 13, 26, 0.15);
    --shadow-glow-primary: 0 0 30px rgba(27, 58, 158, 0.3);
    --shadow-glow-secondary: 0 0 30px rgba(217, 79, 112, 0.3);

    /* --- Transitions --- */
    --transition-fast: 150ms ease;
    --transition-normal: 300ms ease;
    --transition-slow: 500ms ease;
    --transition-spring: 500ms cubic-bezier(0.34, 1.56, 0.64, 1);
    --transition-masonry: 900ms cubic-bezier(0.16, 1, 0.3, 1);

    /* --- Z-index --- */
    --z-behind: -1;
    --z-base: 0;
    --z-above: 10;
    --z-header: 100;
    --z-overlay: 200;
    --z-modal: 300;
    --z-toast: 400;
}