:root {
  /* ==========================================================================
     COULEURS BRUTES — ZMN HOME
     ========================================================================== */
  --zmn-black: #090807;
  --zmn-black-soft: #11100d;
  --zmn-ivory: #f8f1e7;
  --zmn-champagne: #eadcc4;
  --zmn-gold: #d8c19a;
  --zmn-gold-deep: #a98655;
  --zmn-bronze: #5b4228;

  --zmn-black-rgb: 9, 8, 7;
  --zmn-ivory-rgb: 248, 241, 231;
  --zmn-champagne-rgb: 234, 220, 196;
  --zmn-gold-rgb: 216, 193, 154;
  --zmn-gold-deep-rgb: 169, 134, 85;
  --zmn-bronze-rgb: 91, 66, 40;

  /* ==========================================================================
     COULEURS SÉMANTIQUES
     ========================================================================== */
  --zmn-color-bg: var(--zmn-ivory);
  --zmn-color-bg-alt: #f3eadf;
  --zmn-color-surface: #fffdf9;
  --zmn-color-surface-soft: #f9f3eb;
  --zmn-color-surface-dark: var(--zmn-black-soft);

  --zmn-color-text: var(--zmn-black);
  --zmn-color-text-soft: rgba(var(--zmn-black-rgb), 0.72);
  --zmn-color-text-muted: rgba(var(--zmn-black-rgb), 0.56);
  --zmn-color-text-inverse: var(--zmn-ivory);
  --zmn-color-text-inverse-soft: rgba(var(--zmn-ivory-rgb), 0.82);

  --zmn-color-border: rgba(var(--zmn-black-rgb), 0.12);
  --zmn-color-border-strong: rgba(var(--zmn-black-rgb), 0.22);
  --zmn-color-border-inverse: rgba(var(--zmn-ivory-rgb), 0.18);

  --zmn-color-accent: var(--zmn-gold-deep);
  --zmn-color-accent-soft: var(--zmn-gold);
  --zmn-color-accent-hover: #8f6e45;
  --zmn-color-secondary: var(--zmn-bronze);

  --zmn-color-success: #5a7456;
  --zmn-color-warning: #9a6d2f;
  --zmn-color-danger: #8c4e46;

  /* ==========================================================================
     SURFACES / OVERLAYS / GLASS
     ========================================================================== */
  --zmn-glass-dark: rgba(17, 16, 13, 0.68);
  --zmn-glass-dark-soft: rgba(17, 16, 13, 0.48);
  --zmn-glass-light: rgba(248, 241, 231, 0.72);
  --zmn-glass-line: rgba(234, 220, 196, 0.22);

  /* ==========================================================================
     DÉGRADÉS
     ========================================================================== */
  --zmn-gradient-accent: linear-gradient(
    135deg,
    var(--zmn-champagne) 0%,
    var(--zmn-gold) 52%,
    var(--zmn-gold-deep) 100%
  );

  --zmn-gradient-dark: linear-gradient(
    180deg,
    rgba(9, 8, 7, 0.92) 0%,
    rgba(17, 16, 13, 0.96) 100%
  );

  /* ==========================================================================
     TYPOGRAPHIE
     ========================================================================== */
  --zmn-font-body: Inter, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
  --zmn-font-heading: "Cormorant Garamond", Georgia, "Times New Roman", serif;
  --zmn-font-ui: Inter, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;

  --zmn-font-size-xs: 0.75rem;
  --zmn-font-size-sm: 0.875rem;
  --zmn-font-size-base: 1rem;
  --zmn-font-size-md: 1.125rem;
  --zmn-font-size-lg: 1.375rem;
  --zmn-font-size-xl: 1.75rem;
  --zmn-font-size-2xl: 2.25rem;
  --zmn-font-size-3xl: 3rem;
  --zmn-font-size-hero: clamp(2.75rem, 5vw, 5.5rem);

  --zmn-line-height-tight: 1.1;
  --zmn-line-height-snug: 1.25;
  --zmn-line-height-normal: 1.6;
  --zmn-line-height-relaxed: 1.85;

  --zmn-letter-spacing-ui: 0.02em;
  --zmn-letter-spacing-kicker: 0.18em;

  /* ==========================================================================
     LARGEURS
     ========================================================================== */
  --zmn-container: 1240px;
  --zmn-container-wide: 1440px;
  --zmn-container-narrow: 860px;

  /* ==========================================================================
     ESPACEMENTS
     ========================================================================== */
  --zmn-space-1: 0.25rem;
  --zmn-space-2: 0.5rem;
  --zmn-space-3: 0.75rem;
  --zmn-space-4: 1rem;
  --zmn-space-5: 1.5rem;
  --zmn-space-6: 2rem;
  --zmn-space-7: 3rem;
  --zmn-space-8: 4rem;
  --zmn-space-9: 5rem;
  --zmn-space-10: 6rem;

  --zmn-section-space-y: clamp(4rem, 8vw, 7rem);
  --zmn-section-space-y-tight: clamp(2.5rem, 5vw, 4rem);

  /* ==========================================================================
     RAYONS / OMBRES
     ========================================================================== */
  --zmn-radius-sm: 10px;
  --zmn-radius-md: 18px;
  --zmn-radius-lg: 28px;
  --zmn-radius-xl: 40px;
  --zmn-radius-pill: 999px;

  --zmn-shadow-sm: 0 8px 20px rgba(0, 0, 0, 0.08);
  --zmn-shadow-md: 0 18px 40px rgba(0, 0, 0, 0.12);
  --zmn-shadow-lg: 0 28px 70px rgba(0, 0, 0, 0.16);
  --zmn-shadow-dark: 0 30px 80px rgba(0, 0, 0, 0.35);

  /* ==========================================================================
     BOUTONS / CHAMPS
     ========================================================================== */
  --zmn-button-height: 52px;
  --zmn-button-padding-x: 1.4rem;

  --zmn-input-height: 52px;
  --zmn-input-radius: 16px;
  --zmn-input-border: rgba(var(--zmn-black-rgb), 0.14);
  --zmn-input-border-focus: rgba(var(--zmn-gold-deep-rgb), 0.55);
  --zmn-input-bg: rgba(var(--zmn-ivory-rgb), 0.96);

  /* ==========================================================================
     TRANSITIONS
     ========================================================================== */
  --zmn-transition-fast: 180ms ease;
  --zmn-transition-base: 280ms ease;
  --zmn-transition-slow: 420ms ease;

  /* ==========================================================================
     BREAKPOINTS (référence design)
     ========================================================================== */
  --zmn-breakpoint-sm: 640px;
  --zmn-breakpoint-md: 768px;
  --zmn-breakpoint-lg: 1024px;
  --zmn-breakpoint-xl: 1280px;
}