/* ==========================================================================
   Faseeh — Design tokens (issus 1:1 de la maquette Figma)
   ========================================================================== */
:root {
  /* ---- Couleurs : surfaces claires ---- */
  --c-page:        #F1F1F1; /* fond global de la page */
  --c-white:       #FFFFFF;
  --c-surface:     #F5F5F5; /* sections claires */
  --c-line:        #DEDEDE; /* bordures cartes claires */
  --c-line-2:      #E8E8E8; /* bordures fines / pills */

  /* ---- Couleurs : texte ---- */
  --c-ink:         #131313; /* titres / texte fort */
  --c-muted:       #606060; /* texte secondaire (fond clair) */

  /* ---- Couleurs : or (accent) ---- */
  --c-gold:        #C38F3F; /* accent principal (boutons, mic) */
  --c-gold-border: #DFB066; /* bordure/halo or */
  --c-gold-bright: #F5B73F; /* icônes accent vives */

  /* ---- Couleurs : surfaces sombres ---- */
  --c-dark:        #1F1F1F; /* sections/visuels sombres */
  --c-dark-card:   #262626; /* cartes sombres */
  --c-dark-raised: #303030; /* éléments surélevés dans le sombre */
  --c-dark-border: #484848; /* bordures sur sombre */
  --c-dark-100:    #D8D8D8; /* texte clair sur sombre (fort) */
  --c-dark-200:    #DEDEDE; /* texte clair sur sombre */
  --c-dark-300:    #A1A1A1; /* texte atténué sur sombre */

  /* ---- Divers ---- */
  --c-error:       #F82225; /* lettre erronée (versets) */

  /* ---- Typographies ---- */
  --font-display: 'PP Mori', 'Inter', system-ui, -apple-system, 'Segoe UI', sans-serif;
  --font-sans:    'Inter', system-ui, -apple-system, 'Segoe UI', Roboto, sans-serif;
  --font-arabic:  'Scheherazade New', 'Amiri', serif;
  --font-mono:    'Poppins', 'Inter', sans-serif;

  /* ---- Échelle de titres (fluide, basée sur la maquette 1440px) ---- */
  --fs-h1:      clamp(2.25rem, 1.6rem + 2.9vw, 2.895rem); /* 46.31px @1440 */
  --fs-h2:      clamp(2rem, 1.45rem + 2.45vw, 2.65rem);   /* 42.38px @1440 */
  --fs-h2-dark: clamp(2.1rem, 1.5rem + 2.7vw, 3.03rem);   /* 48.52px @1440 */
  --fs-card-title: clamp(1.15rem, 1.05rem + 0.4vw, 1.236rem); /* ~19.77px */
  --fs-lead:    1.125rem; /* 18px */
  --fs-body:    1rem;     /* 16px */
  --fs-sm:      0.875rem; /* 14px */

  /* ---- Layout ---- */
  --container:      1216px; /* contenu principal */
  --container-wide: 1392px; /* grande section arrondie */
  --gutter:         clamp(1.25rem, 0.5rem + 3.6vw, 7rem); /* 112px @1440 */
  --gutter-sm:      clamp(1.25rem, 0.7rem + 2.7vw, 1.5rem);

  /* ---- Rayons ---- */
  --r-sm: 8px;
  --r:    12px;
  --r-lg: 16px;
  --r-xl: 24px;
  --r-pill: 100px;

  /* ---- Ombres ---- */
  --shadow-nav: 0px 10px 10px -3.75px rgba(0,0,0,0.02),
                0px 2.29px 2.29px -2.5px rgba(0,0,0,0.04),
                0px 0.6px 0.6px -1.25px rgba(0,0,0,0.05);
  --shadow-card: 0px 0px 9px rgba(0,0,0,0.10);
}