/* ==========================================================================
   charte-tokens.css — SOURCE UNIQUE de la charte La Boîte de Photos
   --------------------------------------------------------------------------
   Direction : « album de famille » — creme papier, sepia, terracotta.
   Public reel : des parents et grands-parents, souvent sur mobile, parfois
   avec une vue fatiguee -> contrastes AA, corps de texte 17px minimum.
   Toujours utiliser var(--xxx) plutot que de re-taper un hexa en dur :
   le .stylelintrc.json signale tout hexa hors de ce fichier.
   ========================================================================== */

:root {
  /* --- Palette ---------------------------------------------------------- */
  --c-fond:           #faf6f0;   /* creme papier — fond de page */
  --c-surface:        #ffffff;   /* cartes, formulaires */
  --c-surface-douce:  #f3ece2;   /* zones secondaires, entete */
  --c-texte:          #2b2119;   /* brun encre — texte courant */
  --c-texte-doux:     #6b5a4a;   /* texte secondaire (AA sur creme) */
  --c-primaire:       #a4552f;   /* terracotta — actions, liens, marque */
  --c-primaire-fonce: #83421f;   /* survol / focus des boutons */
  --c-primaire-clair: #f0dcd0;   /* fonds doux, etats selectionnes */
  --c-accent:         #c98b3a;   /* ambre dore — DECORATIF et gros titres */
  --c-bordure:        #e6dcd0;   /* bordures, separateurs */
  --c-succes:         #3f7d4e;   /* confirmation, photo publiee */
  --c-erreur:         #b3261e;   /* erreurs de formulaire */
  --c-impression:     #000000;   /* noir franc — uniquement pour @media print */
  /* Genre : deux teintes assez sourdes pour cohabiter avec le sepia, et
     assez contrastees pour se distinguer d'un coup d'oeil. */
  --c-homme:          #4a7fa8;   /* bleu ardoise */
  --c-homme-clair:    #dcebf5;
  --c-femme:          #b5688a;   /* rose ancien */
  --c-femme-clair:    #f7dfe8;

  /* --- Typographie ------------------------------------------------------ */
  --f-titre: "Fraunces", Georgia, "Times New Roman", serif;
  --f-corps: "Inter", system-ui, -apple-system, "Segoe UI", sans-serif;
  --taille-corps: 1.0625rem;   /* 17px : lisible par un lecteur age */
  --hauteur-corps: 1.65;

  /* --- Layout ----------------------------------------------------------- */
  --largeur-max: 1100px;
  --largeur-texte: 42rem;
  --pad-xl: 100px;   /* desktop large */
  --pad-l:  64px;
  --pad-m:  32px;
  --pad-s:  16px;    /* mobile */
  --rayon: 14px;
  --rayon-s: 8px;

  /* --- Effets signature ------------------------------------------------- */
  --ombre-carte: 0 2px 10px rgba(43, 33, 25, 0.06);
  --ombre-relief: 0 12px 30px rgba(43, 33, 25, 0.14);
  --hover-translate: translateY(-4px);
  --tag-letter-spacing: 3px;
  --transition: 160ms ease;
}

/* --------------------------------------------------------------------------
   Polices auto-hebergees (RGPD : aucun CDN, aucune fuite d'IP vers un tiers).
   Deposer les .woff2 dans _font/ ; tant qu'ils sont absents, les polices
   systeme de secours s'appliquent et le site reste correct.
   -------------------------------------------------------------------------- */
@font-face {
  font-family: "Fraunces";
  src: url("../_font/fraunces-variable.woff2") format("woff2");
  font-weight: 400 700;
  font-display: swap;
}

@font-face {
  font-family: "Inter";
  src: url("../_font/inter-variable.woff2") format("woff2");
  font-weight: 300 700;
  font-display: swap;
}