/* ✳ Test typographique de l'accueil (référence : spoagency.com) — chargé uniquement par index.html
   Titres : Inter Tight 700–800, lettres resserrées · Textes : Manrope 400–500 · Menu, boutons, filtres : Manrope 500–600
   Retour arrière : retirer les 2 lignes « typo-accueil » de index.html (préchargement + feuille), rien d'autre à défaire.
   Non concernés : cartes de la galerie, lecteur, espace admin, autres pages. */
@font-face {
  font-family: 'Inter Tight';
  font-style: normal;
  font-weight: 100 900;
  font-display: swap;
  src: url(fonts/InterTight-var-latin.woff2) format('woff2-variations'), url(fonts/InterTight-var-latin.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: 'Manrope';
  font-style: normal;
  font-weight: 200 800;
  font-display: swap;
  src: url(fonts/Manrope-var-latin.woff2) format('woff2-variations'), url(fonts/Manrope-var-latin.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
:root {
  --ta-title: "Inter Tight", "Helvetica Neue", Arial, sans-serif;
  --ta-text: "Manrope", "Helvetica Neue", Arial, sans-serif;
}

/* ---------- Grands titres : Inter Tight, plus large que Barlow Condensed → tailles réduites d'autant ---------- */
.approach-head h2,
.sc-head h3,
.type-name,
.mm-link {
  font-family: var(--ta-title);
  letter-spacing: -.04em;
}
.type-name { font-weight: 800; font-size: clamp(26px, 3.7vw, 60px); line-height: .95 }
.sc-head h3 { font-weight: 700; font-size: clamp(20px, 1.9vw, 30px); line-height: 1 }
.approach-head h2 { font-weight: 800; font-size: clamp(30px, 3.6vw, 58px); line-height: .98 }
.mm-link { font-weight: 800; font-size: clamp(26px, 7.5vw, 40px); line-height: 1.05 }

/* ---------- Descriptions et paragraphes : Manrope 400–500 ---------- */
.hero-note p,
.types-title,
.type-sect,
.type-desc,
.approach-lead,
.sc-head p,
.approach-foot p {
  font-family: var(--ta-text);
}
.hero-note p { font-weight: 500; letter-spacing: -.005em }
.types-title, .type-sect, .approach-lead, .sc-head p, .approach-foot p { font-weight: 400 }
.type-desc { font-weight: 400; letter-spacing: -.005em }

/* ---------- Menu, boutons et filtres : Manrope 500–600 ---------- */
header .nav-link,
header .pill,
header .share,
.mm-cta,
#filters button,
.toolbar .pill,
.toolbar .search input,
.type-see,
.type-badge,
.sc-all,
.approach-cta a,
.footer-links a {
  font-family: var(--ta-text);
}
header .nav-link { font-weight: 600; letter-spacing: -.01em }
header .pill, header .share, .toolbar .pill, .toolbar .search input, .footer-links a { font-weight: 500 }
#filters button, .type-see, .type-badge, .sc-all, .mm-cta, .approach-cta a { font-weight: 600 }
#filters button sup { font-weight: 500 } /* compteurs : police mono d'origine conservée par style.css */

/* ---------- Tablette et mobile ---------- */
@media (max-width: 1000px) {
  .type-name { font-size: clamp(26px, 4.6vw, 44px) }
  .approach-head h2 { font-size: clamp(28px, 4.6vw, 44px) }
}
@media (max-width: 700px) {
  .type-name { font-size: clamp(24px, 7.2vw, 34px); line-height: 1 }
  .sc-head h3 { font-size: clamp(20px, 6vw, 26px) }
  .approach-head h2 { font-size: 26px; line-height: 1.02 }
}