/* ============================================================
   PRÉPARATEUR.E46 — TYPOGRAPHIE
   ============================================================

   Constat de départ : la boutique chargeait CINQ polices d'affichage qui se
   battaient — Barlow Condensed, Rajdhani, Bebas Neue, Barlow, Inter — l'une
   par couche de code empilée. C'est une des causes du « tout chamboulé ».

   On en garde DEUX, prises dans ce qui était déjà chargé, donc rien de nouveau
   à télécharger et rien de dépaysant à l'œil :

     · BARLOW CONDENSED — les titres. Barlow est dessiné d'après les grotesques
       américaines et la signalétique routière : c'est une police de PANNEAU,
       techniquement proche des DIN utilisées par l'industrie automobile. Elle
       porte l'autorité sans avoir l'air d'un jeu vidéo, ce qui est le piège des
       polices « techno ».
     · BARLOW — le corps de texte. Même famille, donc harmonie garantie : les
       titres et le texte se ressemblent sans se confondre.

   Et BEBAS NEUE survit à UN seul endroit : les badges de motorisation
   (318 · 330 · M3). Des capitales plates et étroites pour des chiffres, c'est
   exactement son emploi ; l'utiliser ailleurs recréerait le désordre.
   ============================================================ */

body,
p, li, td,
.woocommerce-Price-amount,
.wc-block-components-product-name{
  font-family:'Barlow', system-ui, sans-serif;
  font-weight:400;
  line-height:1.62;
  letter-spacing:.002em;
}

h1, h2, h3, h4, h5,
.pe-titre,
.product_title,
.woocommerce-loop-product__title{
  font-family:'Barlow Condensed', 'Barlow', sans-serif;
  font-weight:600;
  line-height:1.06;
  letter-spacing:.005em;
  text-wrap:balance;         /* évite le mot orphelin en fin de titre */
}

/* ── L'échelle. Une seule, respectée partout ──
   clamp() plutôt que des media queries : le titre se règle en continu entre
   mobile et desktop, ce qui évite les sauts de taille aux points de rupture
   (et les réglages « au chausse-pied » qu'ils obligent à faire). */
h1, .pe-t1{ font-size:clamp(2.5rem, 7vw, 4.6rem); }
h2, .pe-t2{ font-size:clamp(1.9rem, 4.4vw, 3rem); }
h3, .pe-t3{ font-size:clamp(1.35rem, 2.6vw, 1.8rem); }
.pe-texte{ font-size:clamp(1rem, 1.15vw, 1.09rem); }

/* ── L'ŒIL-DE-BŒUF : le petit intitulé qui annonce une zone ──
   Il dit où l'on est dans la voiture, en lettres espacées, discret et doré. */
.pe-oeil{
  font-family:'Barlow Condensed', sans-serif;
  font-size:.8rem;
  font-weight:600;
  letter-spacing:.26em;
  text-transform:uppercase;
  color:var(--pe-or);
}

/* ── LES BADGES DE MOTORISATION — le seul emploi de Bebas Neue ── */
.pe-modele{
  font-family:'Bebas Neue', 'Barlow Condensed', sans-serif;
  font-size:clamp(1.15rem, 2.6vw, 1.65rem);
  letter-spacing:.05em;
  line-height:1;
  font-variant-numeric:tabular-nums;  /* les chiffres s'alignent en colonne */
}

/* ── LES PRIX ──
   Chiffres à largeur fixe : dans une grille de produits, des prix qui ne
   s'alignent pas se remarquent immédiatement et font bricolé. */
.woocommerce-Price-amount,
.pe-prix{
  font-family:'Barlow Condensed', sans-serif;
  font-weight:600;
  font-variant-numeric:tabular-nums;
  color:var(--pe-or-clair);
  letter-spacing:.01em;
}

/* ── LE NOM DE LA MAISON ──
   « Préparateur » en blanc, « .E46 » en or : le point sépare le métier du
   modèle, et l'or tombe sur le modèle. C'est déjà l'esprit de son hero.  */
.pe-marque{
  font-family:'Barlow Condensed', sans-serif;
  font-weight:700;
  letter-spacing:.01em;
  text-transform:none;
}
.pe-marque-modele{ color:var(--pe-or); }

/* ── Confort de lecture ──
   Les colonnes de texte long ne dépassent pas ~68 caractères : au-delà, l'œil
   perd sa ligne au retour. */
.pe-lecture{ max-width:34em; }

/* Les liens du corps de texte se signalent par un souligné doré fin, qui
   s'épaissit au survol — pas par un changement de couleur seul, invisible pour
   une partie des lecteurs. */
.pe-zone a:not(.pe-bouton):not(.pe-carte-lien){
  color:inherit;
  text-decoration:underline;
  text-decoration-color:var(--pe-or);
  text-decoration-thickness:1px;
  text-underline-offset:.18em;
  transition:text-decoration-thickness .15s ease;
}
.pe-zone a:not(.pe-bouton):not(.pe-carte-lien):hover{
  text-decoration-thickness:2px;
}