/* ═══════════════════════════════════════════════════════════
   Studio ESEO — Typographie commune à tout le site (typo.css)

   Source unique pour la police, les tailles, les graisses et
   les espacements de texte. Toutes les feuilles de style
   (accueil.css, impression.css, style.css, contact.css,
   admin.css, nav.css) y puisent via var(--…).

   Pour modifier le texte de tout le site : changer ici.

   ── TAILLE DU TEXTE : --zoom, réglé PAGE PAR PAGE ──────────────
   --zoom: 1    → tailles d'origine
   --zoom: 1.3  → équivalent d'un zoom navigateur à 130 % (TEXTE
                  uniquement : marges et largeurs ne changent pas)
   Les tailles et l'espacement des lettres sont multipliés par cette
   valeur.

   Réglage actuel :  Accueil + Contact .......... 1.3
                     Impression, Catalogue, Admin  1   (taille d'origine)
   Voir le bloc « --zoom par page » juste après :root.
   À charger dans chaque page, AVANT la feuille de style de la page.
═══════════════════════════════════════════════════════════ */

:root {
    --zoom: 1;      /* valeur par défaut : taille d'origine */

    /* Police (Open Sans est chargée par Google Fonts dans le <head> de chaque page) */
    --font: "Open Sans", "Helvetica Neue", Helvetica, Arial, sans-serif;

    /* Graisses */
    --fw-body: 400;
    --fw-medium: 500;
    --fw-semibold: 600;
    --fw-bold: 700;

    /* Tailles */
    --fs-eyebrow: calc(11px * var(--zoom));                     /* petites étiquettes en majuscules (« 01 — Mission », « Module 01 ») */
    --fs-xs: calc(12px * var(--zoom));                          /* légendes, étiquettes de formulaire, pied de page */
    --fs-sm: calc(13px * var(--zoom));                          /* texte secondaire, liens du menu */
    --fs-ui: calc(14px * var(--zoom));                          /* champs, boutons, tableaux, messages */
    --fs-base: calc(15px * var(--zoom));                        /* texte courant */
    --fs-lead: calc(16px * var(--zoom));                        /* texte d'introduction sous un grand titre */
    --fs-logo: calc(20px * var(--zoom));                        /* logo « Studio ESEO » (menu et pied de page) */
    --fs-h3: calc(22px * var(--zoom));                          /* titres de cartes et de blocs */
    --fs-num: calc(40px * var(--zoom));                         /* grands numéros (01, 02…) */
    --fs-h1: clamp(calc(22px * var(--zoom)), 2.6vw, calc(32px * var(--zoom)));      /* titre d'en-tête de page (catalogue, admin) */
    --fs-h2: clamp(calc(30px * var(--zoom)), 4.5vw, calc(48px * var(--zoom)));      /* titres de section */
    --fs-hero: clamp(calc(52px * var(--zoom)), 9vw, calc(112px * var(--zoom)));     /* grand titre d'ouverture */

    /* Interlignes */
    --lh-body: 1.7;
    --lh-title: 1.1;
    --lh-hero: 1;

    /* Espacement des lettres */
    --ls-eyebrow: calc(3px * var(--zoom));
    --ls-nav: calc(1.5px * var(--zoom));
    --ls-label: calc(1px * var(--zoom));
    --ls-logo: calc(2px * var(--zoom));
    --ls-title: -0.02em;
}

/* ── --zoom par page ─────────────────────────────────────────────
   Chaque page est reconnue grâce à un élément qui lui est propre.
   Pour agrandir une autre page, ajouter son élément dans la liste
   (avec une virgule) :
       catalogue .. .wishlist-container      impression .. .form-section
       admin ...... .tabs
   Pour changer la valeur d'une seule page :  <html style="--zoom: 1.15"> */
:root:has(.Presentation, .contact-hero) { --zoom: 1.3; }     /* accueil + contact */

/* Les champs et boutons reprennent la police de la page (sinon le navigateur impose la sienne) */
button, input, select, textarea { font-family: inherit; }