/* Design tokens — palette téléphone rose haut de gamme, dark mode par défaut */
:root {
  /* Surfaces */
  --bg:           #0a0608;
  --surface:      #1a1216;
  --surface-2:    #241820;
  --surface-3:    #2e2128;
  --surface-glow: radial-gradient(ellipse at top, rgba(255,45,111,0.12), transparent 60%);

  /* Brand */
  --primary:        #ff2d6f;
  --primary-hover:  #ff4d85;
  --primary-soft:   #f8b3c5;
  --primary-glow:   0 0 32px rgba(255,45,111,0.45);
  --accent-gold:    #d4af37;
  --accent-gold-2:  #f0d57a;

  /* Text */
  --text:           #fff5f0;
  --text-secondary: #c9b8be;
  --text-muted:     #8a7780;

  /* Status */
  --online:  #00e676;
  --busy:    #ffab00;
  --offline: #6b5560;
  --danger:  #ff1744;

  /* Borders */
  --border:        rgba(255,255,255,0.08);
  --border-strong: rgba(255,255,255,0.16);
  --border-primary: rgba(255,45,111,0.4);

  /* Typography */
  --font-sans: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
  --font-display: "Marcellus", Georgia, "Times New Roman", serif;

  --fs-xs:   clamp(0.75rem, 0.7rem + 0.2vw, 0.85rem);
  --fs-sm:   clamp(0.875rem, 0.8rem + 0.3vw, 1rem);
  --fs-base: clamp(1rem, 0.95rem + 0.3vw, 1.0625rem);
  --fs-lg:   clamp(1.0625rem, 1rem + 0.4vw, 1.25rem);
  --fs-xl:   clamp(1.125rem, 1.05rem + 0.4vw, 1.375rem);
  --fs-2xl:  clamp(1.3125rem, 1.2rem + 0.5vw, 1.625rem);
  --fs-3xl:  clamp(1.625rem, 1.45rem + 0.9vw, 2.125rem);

  --lh-tight: 1.15;
  --lh-base:  1.55;
  --lh-loose: 1.75;

  /* Spacing — 4px base scale */
  --sp-1: 0.25rem;
  --sp-2: 0.5rem;
  --sp-3: 0.75rem;
  --sp-4: 1rem;
  --sp-5: 1.5rem;
  --sp-6: 2rem;
  --sp-7: 3rem;
  --sp-8: 4rem;
  --sp-9: 6rem;

  /* Radius */
  --r-sm:   8px;
  --r-md:   12px;
  --r-lg:   16px;
  --r-xl:   24px;
  --r-2xl:  32px;
  --r-full: 9999px;

  /* Touch target minimum (Apple HIG / Material) */
  --touch: 48px;

  /* Animation */
  --ease:     cubic-bezier(0.4, 0, 0.2, 1);
  --ease-out: cubic-bezier(0.22, 1, 0.36, 1);
  --ease-spring: cubic-bezier(0.5, 1.6, 0.4, 1);
  --t-fast:  150ms;
  --t-base:  250ms;
  --t-slow:  400ms;

  /* Z-index scale */
  --z-base:     1;
  --z-sticky:   100;
  --z-overlay:  500;
  --z-modal:    1000;
  --z-popunder: 1500;
  --z-age-gate: 2000;

  /* Shadows */
  --shadow-sm: 0 1px 2px rgba(0,0,0,0.4);
  --shadow-md: 0 4px 12px rgba(0,0,0,0.5);
  --shadow-lg: 0 12px 32px rgba(0,0,0,0.6);
  --shadow-xl: 0 24px 60px rgba(0,0,0,0.7);
  --shadow-glow: 0 0 32px rgba(255,45,111,0.45);

  /* Layout */
  --container-max:    480px;  /* mobile uniquement */
  --container-md:     760px;  /* tablette / contenu textuel */
  --container-prose:  680px;  /* lecture confortable (FAQ, texte long) */
  --container-lg:     1120px; /* desktop large */
  --container-xl:     1320px; /* desktop XL */
  --safe-bottom:   env(safe-area-inset-bottom, 0px);
  --safe-top:      env(safe-area-inset-top, 0px);

  /* Hauteur barre call sticky bas (utilisée pour padding bas du body) */
  --sticky-call-h: 72px;
}