/* =====================================================================
 * EMPLACEMENT DE PHOTO — composant partagé
 * =====================================================================
 *
 * EXTRAIT DE styles/site.css LE 23/09/2026, pour une seule raison : la
 * page d'accueil en a besoin et ne charge pas site.css.
 *
 * L'accueil est le CLONE de reference/index.html (SPEC §0). Il ne charge
 * que tokens/cogemob-tokens.css et styles/reference.css — sa mise en page
 * reste celle de la maquette, à l'identique, et lui servir site.css
 * restylerait le clone. Depuis que la section Actualités de l'accueil
 * affiche les vrais articles, dont les photos ne sont pas encore
 * fournies, elle a besoin du même cadre hachuré que le reste du site.
 *
 * UNE SEULE DÉFINITION, DEUX GABARITS : ce fichier est chargé par
 * partials/tete.njk (pages intérieures, avant site.css) et par clone.njk
 * (accueil, après reference.css). Recopier le composant dans les deux
 * feuilles aurait produit deux hachures qui divergent au premier réglage.
 *
 * IL N'EMPLOIE QUE DES JETONS DE LA CHARTE, présents dans
 * tokens/cogemob-tokens.css : c'est la condition pour qu'il fonctionne
 * sur l'accueil, qui ne charge rien d'autre.
 *
 * DEUX PROPRIÉTÉS RESTENT DANS site.css et ne s'appliquent donc qu'aux
 * pages intérieures — le rayon de 10 px (dérogation documentée en §0 de
 * site.css) et la marge basse. Sur l'accueil, les cartes de la maquette
 * sont à angles vifs et leur gouttière est déjà donnée par .m56 : le
 * composant n'a ni rayon ni marge à y ajouter.
 * ------------------------------------------------------------------- */

/* L221 de la maquette : cadre hachuré à 135°, 10 px de trait, 10 px de
   fond. C'est la trame qui signale « visuel non fourni » sur tout le
   site. */
.emplacement-photo {
  position: relative;
  aspect-ratio: 4 / 3;
  overflow: hidden;
  display: grid;
  place-items: center;
  padding: var(--space-4);
  border: var(--border-hairline);
  margin: 0;
  background: repeating-linear-gradient(
    135deg,
    var(--neutral-trait) 0 10px,
    var(--neutral-papier) 10px 20px
  );
}

/* L222 : font:500 10.5px/1 'IBM Plex Mono'; letter-spacing:.12em. */
.emplacement-photo__legende {
  font-family: var(--font-mono);
  font-size: 10.5px;
  /* Plex Mono n'est servie qu'en 400 et 600 (arbitrage H). */
  font-weight: var(--weight-semibold);
  line-height: 1.4;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  text-align: center;
  color: var(--neutral-ardoise);
  background: var(--neutral-papier);
  border: var(--border-hairline);
  padding: 9px 12px;
  margin: 0;
}