/**
 * Cabinet – Design Tokens
 */

:root {
  /* ── Brand palette ──────────────────────────────────────── */
  --color-teal:        #3ABFBF;
  --color-teal-dark:   #2A9494;
  --color-teal-light:  #E6F7F7;
  --color-coral:       #F0826A;
  --color-coral-dark:  #D96A52;
  --color-yellow:      #F5C842;
  --color-yellow-text: #8A6A00;  /* readable on a --color-yellow tint — 4.6:1 */
  --color-navy:        #1E4A5C;
  --color-text:        #2D3748;
  --color-muted:       #5A7080;
  --color-bg:          #F7FAFA;
  --color-white:       #FFFFFF;
  --color-border:      #CBD5E0;
  --color-top-bar-bg:  #E8EDEF;
  --color-top-bar-border: #D0DADF;
  --color-footer-bg:   #1E3A47;

  /* Aliases for backward compat with old variable names */
  --color-dark:       #1E4A5C;
  --color-red:        #F0826A;
  --color-turquoise:  #E6F7F7;
  --color-light-gray: #F7FAFA;
  --color-mid-gray:   #5A7080;
  --color-top-bar:    #E8EDEF;

  /* ── Typography ─────────────────────────────────────────── */
  --font-family-base:    'Nunito', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
  --font-family-heading: 'Lora', Georgia, serif;

  --font-size-sm:   0.875rem;
  --font-size-base: 1rem;
  --font-size-md:   1.125rem;
  --font-size-lg:   1.25rem;
  --font-size-xl:   1.5rem;
  --font-size-2xl:  2rem;
  --font-size-3xl:  2.5rem;
  --font-size-4xl:  3rem;

  --font-weight-normal:    400;
  --font-weight-medium:    500;
  --font-weight-semibold:  600;
  --font-weight-bold:      700;
  --font-weight-extrabold: 800;
  --font-weight-black:     900;

  --line-height-tight:  1.2;
  --line-height-snug:   1.3;
  --line-height-normal: 1.6;

  /* ── Spacing ─────────────────────────────────────────────── */
  --space-1:  0.25rem;
  --space-2:  0.5rem;
  --space-3:  0.75rem;
  --space-4:  1rem;
  --space-5:  1.25rem;
  --space-6:  1.5rem;
  --space-8:  2rem;
  --space-10: 2.5rem;
  --space-12: 3rem;
  --space-16: 4rem;
  --space-20: 5rem;
  --space-24: 6rem;

  /* Bande réservée au CTA « Demande de soin » collant quand il s'ancre au-dessus
     du footer en mobile : sa hauteur (~44 px) plus une marge au-dessus et en
     dessous. Voir .cabinet-sticky-care-cta dans global.css. */
  --sticky-care-cta-clearance: var(--space-12);

  /* ── Layout ──────────────────────────────────────────────── */
  --content-width: 760px;
  --wide-width:    1200px;
  --site-padding:  1.5rem;  /* minimum gutter on narrow viewports; auto-margins grow on wide ones */

  /* ── Borders ─────────────────────────────────────────────── */
  --radius-sm:   4px;
  --radius-md:   8px;
  --radius-lg:   14px;
  --radius-xl:   20px;
  --radius-full: 9999px;
  --radius-pill: 30px;

  /* ── Shadows ─────────────────────────────────────────────── */
  --shadow-card: 0 4px 20px rgba(30, 74, 92, 0.08);
  --shadow-sm:   0 1px 3px rgba(0, 0, 0, 0.06);
  --shadow-md:   0 4px 12px rgba(30, 74, 92, 0.10);
  --shadow-lg:   0 8px 24px rgba(30, 74, 92, 0.14);
  --shadow-teal: 0 8px 30px rgba(58, 191, 191, 0.18);

  /* ── Transitions ─────────────────────────────────────────── */
  --transition-fast:   150ms ease;
  --transition-normal: 250ms ease;
}