/* ============================================================
   TOKENS : source unique des valeurs de design (couleurs, polices,
   échelle typographique). Modifier ici = modifier tout le site.
   Les valeurs de MOUVEMENT sont dans motion.config.js (une seule source).
   ============================================================ */
:root{
  /* PALETTE OFFICIELLE (ne pas modifier sans décision) :
     pétrole #284D5C (fondatrice) · corail terre cuite #D16C67 · ivoire chaleureux #F4EDE2 ·
     sable minéral #B6A184 · sauge grisée #81978A.  Répartition indicative : ivoire 48 %,
     pétrole 30 %, blanc 12 %, sauge et sable 7 %, corail 3 %. */
  /* Couleurs de marque */
  --petrol:#284D5C; --petrol-deep:#1E3B47; --coral:#B3433E; --coral-soft:#D16C67; /* corail officiel = #D16C67 ; #B3433E = version AA pour le texte */
  --ivory:#F4EDE2; --sand:#B6A184; --sage:#566F62; --sage-brand:#81978A; --ink:#333C35;
  /* Polices */
  --font-title:'Cormorant Garamond',Georgia,serif;
  --font-body:'Montserrat',system-ui,sans-serif;
  /* Échelle typographique (bureau, puis mobile en dessous) */
  --fs-h1:clamp(34px,4.1vw,54px);
  --fs-h2:clamp(27px,2.8vw,38px);
  --fs-h2-xl:clamp(28px,3.3vw,44px);
  --fs-h3:clamp(20px,1.6vw,23px);
  --fs-h3-card:clamp(24px,2.1vw,29px);
  --fs-body:15px;
  --fs-lead:clamp(16px,1.2vw,17px);
  --fs-quote:clamp(19px,1.7vw,23px);
  --fs-eyebrow:clamp(15.5px,1.2vw,17px);
  --fs-small:13.5px;
  --fs-btn:13.5px;
  --lh-body:1.7; --lh-title:1.15;
}
@media(max-width:640px){
  :root{--fs-h1:clamp(31px,9vw,38px);--fs-h2:clamp(25px,7vw,30px);--fs-h2-xl:clamp(25px,7vw,30px);--fs-body:15.5px;--fs-lead:16.5px}
}