/* ═══════════════════════════ L'affiche marathon ═══════════════════════════
 *
 * Servie **seulement** sur sa fiche (`views/product-affiche.liquid`), comme les feuilles des
 * autres affiches : une mise en page et une police de plus n'ont rien à faire dans le chemin
 * critique du reste du site.
 *
 * La course en tête, comme sur un dossard : son nom en Anton, une capitale étroite et grasse
 * — la voix des affiches de course —, sa date dessous. La carte au milieu, en retrait des
 * bords, puis le coureur dans la couleur du tracé, la bande de chiffres et le profil.
 *
 * **Les couleurs sont celles du style choisi** (`--fond`, `--texte`, `--trace`, posées par
 * `affiche-trajet.js` depuis les styles de la carte) : ce sont des couleurs de produit, pas de
 * charte (point 6 quater). La seule écrite ici est le rouge du tracé par défaut, celui du
 * style Papier, pour une page sans script.
 */
@font-face {
  font-family: "Anton";
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url("/fonts/anton-latin-ext.woff2") format("woff2");
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: "Anton";
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url("/fonts/anton-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;
}

.affiche__affiche--marathon { --trace: #d7263d; }

/* ── La course ── */
.ma__tete { padding: 7% 7% 3%; text-align: left; }
/* L'interlettrage est fixé : l'ajustement commun du titre (`ajusterLigne`) resserre des
   capitales espacées à .32em, et l'Anton n'en a pas — il élargirait au lieu de resserrer. */
.affiche__affiche--marathon .ma__course {
  font-family: "Anton", "Roboto Condensed", sans-serif;
  /* La taille suit la longueur (`--ma-n`, posée par le serveur et l'éditeur) : un nom de course de
     quarante signes tient en deux lignes au lieu de manger la carte en trois. */
  font-size: calc(min(10.5cqw, 300cqw / var(--ma-n, 20)) * var(--titre-echelle, 1));
  line-height: 1.02;
  letter-spacing: .01em;
  padding-left: 0;
  text-wrap: balance;
  overflow-wrap: anywhere;
}
.affiche__affiche--marathon .ma__date {
  font-family: "Roboto Condensed", sans-serif;
  font-weight: 700;
  font-size: calc(2.6cqw * var(--sous-echelle, 1));
  letter-spacing: var(--sous-espace, .22em);
  padding-left: 0;
  margin-top: .7em;
  opacity: 1;
}

/* ── La carte, en retrait des bords ── */
.affiche__affiche--marathon .affiche__carte { margin: 0 7%; }

/* Les bornes kilométriques : des pastilles posées par l'éditeur (`maplibregl.Marker`), en
   `cqw` pour garder la même taille relative à l'aperçu et à 300 dpi. */
.ma__borne {
  display: grid;
  place-items: center;
  min-width: 3.4cqw;
  height: 3.4cqw;
  padding: 0 .5cqw;
  box-sizing: border-box;
  border-radius: 1.7cqw;
  border: .3cqw solid var(--trace);
  background: var(--fond);
  color: var(--trace);
  font: 700 1.7cqw/1 "Roboto Condensed", sans-serif;
  pointer-events: none;
}

/* ── Le coureur et ses chiffres ── */
.ma__pied { padding: 3.5% 7% 5.5%; text-align: left; }
.ma__coureur {
  margin: 0;
  font-family: "Roboto Condensed", sans-serif;
  font-weight: 700;
  font-size: min(5cqw, 140cqw / var(--ma-nc, 20));
  line-height: 1.1;
  letter-spacing: .04em;
  text-transform: uppercase;
  color: var(--trace);
  overflow-wrap: anywhere;
}
.ma__bande {
  display: grid;
  grid-auto-flow: column;
  grid-auto-columns: minmax(0, 1fr);
  gap: 3%;
  margin: 2.6cqw 0 0;
  padding: 2cqw 0;
  border-top: .25cqw solid currentColor;
  border-bottom: .25cqw solid currentColor;
}
.ma__case[hidden] { display: none; }
.ma__case dt {
  font-family: "Roboto Condensed", sans-serif;
  font-size: 1.8cqw;
  letter-spacing: .18em;
  text-transform: uppercase;
  opacity: .75;
}
.ma__case dd {
  margin: .4cqw 0 0;
  font-family: "Anton", "Roboto Condensed", sans-serif;
  font-size: calc(4.6cqw * var(--ma-chiffres, 1));
  line-height: 1.1;
  white-space: nowrap;
}

/* Le profil d'altitude : l'aire teintée du tracé, sa crête en trait plein. */
.ma__profil { display: block; width: 100%; height: 7cqw; margin-top: 2.6cqw; overflow: visible; }
.ma__profil[hidden] { display: none; }
.ma__aire { fill: var(--trace); opacity: .16; }
/* Le trait en `cqw` : 2 px fixes sortaient 2,2 fois plus fins à l'impression qu'à l'aperçu. */
.ma__crete { fill: none; stroke: var(--trace); stroke-width: .45cqw; vector-effect: non-scaling-stroke; stroke-linejoin: round; }

.affiche__affiche--marathon .affiche__dedicace { margin-top: 2.2cqw; text-align: left; }
.affiche__affiche--marathon .affiche__trait { display: none; }

/* L'exemple se lit en pleine couleur (Fred, 8 oct. 2026, sur « Nos voyages » et « Le Bilan » :
   à 40 %, l'affiche paraissait délavée). La classe reste : c'est elle que la fabrication masque. */
.affiche__affiche--marathon .ma__case.affiche-exemple { opacity: 1; }
.affiche__affiche--marathon .affiche__dedicace.affiche-exemple { opacity: .6; }

/* Les boutons de la carte sur la carte, pas sur le nom de la course. */
.affiche__affiche--marathon .affiche__outils-carte { top: 36%; right: calc(7% + 8px); }
