/* =========================================================
   THÈME CLIENT — TF Formation (CQP Instructeur Fitness, Marseille)
   Seul fichier CSS « client » avec skin-tf.css :
   couleurs, polices, arrondis. lp.css ne contient aucune couleur en dur.
   Reprise fidèle du site tf-formation.fr : fond #f5f5f5, marine #0a1444, bleu #0766ec,
   titres Anybody 700, texte Poppins 300, chiffres Outfit 700, arrondis 16 / 32 / 64 px, boutons pilule.
   ========================================================= */

@font-face { font-family: "Anybody"; font-style: normal; font-weight: 400 900; font-stretch: 50% 150%; font-display: swap; src: url("../fonts/anybody-400-900.woff2") format("woff2"); }
@font-face { font-family: "Poppins"; font-style: normal; font-weight: 300; font-display: swap; src: url("../fonts/poppins-300.woff2") format("woff2"); }
@font-face { font-family: "Poppins"; font-style: normal; font-weight: 400; font-display: swap; src: url("../fonts/poppins-400.woff2") format("woff2"); }
@font-face { font-family: "Poppins"; font-style: normal; font-weight: 700; font-display: swap; src: url("../fonts/poppins-700.woff2") format("woff2"); }
@font-face { font-family: "Outfit"; font-style: normal; font-weight: 400 700; font-display: swap; src: url("../fonts/outfit-400-700.woff2") format("woff2"); }
/* Polices de repli calibrées : évitent le décalage de mise en page (CLS) au chargement */
@font-face { font-family: "Poppins Fallback"; src: local("Arial"); size-adjust: 112%; ascent-override: 93%; descent-override: 31%; line-gap-override: 0%; }
@font-face { font-family: "Anybody Fallback"; src: local("Arial Black"), local("Arial"); size-adjust: 104%; ascent-override: 90%; descent-override: 24%; line-gap-override: 0%; }

:root {
  --font: "Poppins", "Poppins Fallback", system-ui, -apple-system, "Segoe UI", sans-serif;
  --font-head: "Anybody", "Anybody Fallback", sans-serif;
  --font-num: "Outfit", "Poppins", sans-serif;

  --marine: #0a1444;         /* --dark-blue du site */
  --bleu: #0766ec;           /* --light-blue du site : boutons, surlignage */
  --bleu-fonce: #0553c2;
  --gris-bouton: #8e94a8;    /* bouton secondaire « Demander un devis » */
  --fond: #f5f5f5;           /* fond des pages du site */
  --rond-icone: #eef0f4;     /* rond gris derrière les icônes des champs */

  --brand: var(--marine);
  --brand-dark: #060d30;
  --brand-2: #121e57;
  --brand-soft: #e7f0fe;
  --brand-soft-2: #d3e3fd;
  --accent: var(--bleu);
  --accent-hover: var(--bleu-fonce);
  --accent-text: var(--bleu);
  --accent-light: #79adff;
  --accent-soft: #e7f0fe;

  --text: var(--marine);
  --muted: #5b6283;
  --bg: var(--fond);
  --bg-alt: #ffffff;
  --line: #e3e5ec;
  --error: #c62828;

  --radius-s: 16px;          /* --radius__medium */
  --radius: 32px;            /* --radius__large : cartes, champs, photos */
  --radius-l: 64px;          /* --radius__huge : hero, bloc avis */
  --radius-btn: 32px;
}
