/* Ajouts de production (dist/ uniquement) : sélecteur de langue FR/EN du menu. */
.nav__lang { padding: 8px 10px; margin-right: 4px; border-radius: 8px; letter-spacing: .04em; }
.nav__lang:hover { background: rgba(255, 255, 255, .08); }
.nav-mobile__lang {
  display: flex; align-items: center; justify-content: space-between; width: 100%;
  margin-top: 24px; padding: 12px 18px 12px 22px; border-radius: 10px;
  border: 1px solid rgba(255, 255, 255, .28); color: #fff;
}
@media (max-width: 1024px) { .nav__lang { display: none; } }
.nav-mobile__lang + .nav-mobile__cta { margin-top: 12px; }

/* Titres équilibrés : pas de mot isolé en fin de titre */
h1, h2, .t-display, .t-h2 { text-wrap: balance; }

/* Lien d'évitement : visible seulement au clavier */
.skip-link { position: fixed; top: 12px; left: 12px; z-index: 10000; padding: 12px 16px; border-radius: 10px; background: #fff; color: #0c0c0d; transform: translateY(-160%); transition: transform .2s ease; }
.skip-link:focus { transform: none; outline: 2px solid #e8a33d; outline-offset: 2px; }

/* Images avec dimensions (ajoutées au build contre les décalages de mise en page) : garder les proportions.
   :where() = spécificité nulle, toute règle existante (height: 100%, aspect-ratio…) reste prioritaire. */
:where(img[width][height]) { height: auto; }

/* Étiquette du cas mis en avant (accueil) : passe à la ligne sur petit écran au lieu d'être tronquée */
@media (max-width: 420px) { .resultats__tag { white-space: normal; } }

/* Tableaux d'articles : ombre au bord qui signale le défilement horizontal, largeur minimale réduite sur mobile */
.ar-table__scroll {
  background:
    linear-gradient(to right, #fff 30%, rgba(255, 255, 255, 0)) left / 40px 100% no-repeat local,
    linear-gradient(to left, #fff 30%, rgba(255, 255, 255, 0)) right / 40px 100% no-repeat local,
    radial-gradient(farthest-side at 0 50%, rgba(12, 12, 13, .2), transparent) left / 14px 100% no-repeat scroll,
    radial-gradient(farthest-side at 100% 50%, rgba(12, 12, 13, .2), transparent) right / 14px 100% no-repeat scroll;
}
@media (max-width: 640px) {
  .ar-table table { min-width: 520px; }
  .ar-table th, .ar-table td { padding: 14px 12px; }
}

/* Petits écrans : un bouton ne dépasse jamais la largeur disponible, son libellé passe à la ligne si besoin */
@media (max-width: 480px) {
  .btn { max-width: 100%; white-space: normal; text-align: left; }
}
