/* ============================================================
   FC PATRIMOINE — DESIGN TOKENS
   Repris de la démo, alignés avec project-brain/04-design-system.md
============================================================ */

:root {
  /* ---- Couleurs : fonds cool (navy) ---- */
  --c-bg:          #080c15;
  --c-bg-2:        #0d1220;
  --c-bg-3:        #141928;

  /* ---- Couleurs : fonds warm (dorés sombres) ---- */
  --c-bg-warm:     #0f0c08;
  --c-bg-warm-2:   #14100b;

  /* ---- Or (accent) ---- */
  --c-gold:        #c8a050;
  --c-gold-light:  #e2c878;
  --c-gold-dim:    #7a6030;
  --c-gold-glow:   rgba(200, 160, 80, 0.18);
  --c-gold-fade:   rgba(200, 160, 80, 0.06);
  --c-gold-soft:   rgba(200, 160, 80, 0.12);

  /* ---- Texte ---- */
  --c-text:        #ece6da;
  --c-text-2:      #b0a898;
  --c-text-3:      #7a7268;

  /* ---- Bordures ---- */
  --c-border:      #1e2436;
  --c-border-warm: #2a201a;
  --c-border-soft: rgba(236, 230, 218, 0.08);

  /* ---- Typographies ---- */
  --f-display: 'Cormorant Garamond', Georgia, 'Times New Roman', serif;
  --f-body:    'DM Sans', system-ui, -apple-system, 'Segoe UI', Roboto, sans-serif;

  /* ---- Espacements (grille 8px) ---- */
  --s-xs:  4px;
  --s-sm:  8px;
  --s-md:  16px;
  --s-lg:  32px;
  --s-xl:  48px;
  --s-2xl: 64px;
  --s-3xl: 96px;
  --s-4xl: 120px;

  /* ---- Border radius ---- */
  --r-xs: 2px;
  --r-sm: 3px;
  --r-md: 4px;
  --r-lg: 6px;
  --r-pill: 999px;

  /* ---- Shadows ---- */
  --shadow-sm: 0 2px 8px rgba(0, 0, 0, 0.4);
  --shadow-md: 0 4px 24px rgba(0, 0, 0, 0.6);
  --shadow-lg: 0 16px 48px rgba(0, 0, 0, 0.7);
  --shadow-gold-glow: 0 8px 40px rgba(200, 160, 80, 0.35);

  /* ---- Motion ---- */
  --motion-fast:   150ms;
  --motion-medium: 300ms;
  --motion-slow:   500ms;

  /* ---- Easings ---- */
  --ease-out:   cubic-bezier(0.16, 1, 0.3, 1);
  --ease-quart: cubic-bezier(0.76, 0, 0.24, 1);

  /* ---- Z-index ---- */
  --z-loader:  10000;
  --z-nav:     100;
  --z-overlay: 90;
  --z-modal:   200;

  /* ---- Layout ---- */
  --container-max: 1200px;
  --container-pad-desktop: 64px;
  --container-pad-tablet:  40px;
  --container-pad-mobile:  24px;

  --nav-height: 76px;
}