/* Styles communs à toutes les pages.
   Chargé AVANT le <style> de chaque page : les règles spécifiques
   d'une page restent prioritaires à spécificité égale. */

/* Lien d'évitement : masqué hors focus, visible dès la tabulation. */
.skip-link {
  position: absolute;
  left: -9999px;
  top: 0;
  z-index: 1001;
  background: #e00;
  color: #fff;
  padding: 14px 22px;
  min-height: 44px;
  font-family: 'Barlow Condensed', sans-serif;
  font-size: 15px;
  letter-spacing: 1px;
  text-transform: uppercase;
  text-decoration: none;
}
.skip-link:focus {
  left: 0;
}

/* Indicateur de focus visible au clavier (aucun effet à la souris). */
:focus-visible {
  outline: 2px solid #e00;
  outline-offset: 2px;
}

/* Le bouton du menu mobile ne mesure que 32x24 dans les pages, sous le minimum
   tactile de 44px. On agrandit via min-width/min-height, propriétés que les
   pages ne déclarent pas : leur `padding` inline gagnerait sur cette feuille. */
.hamburger {
  min-width: 44px;
  min-height: 44px;
  align-items: center;
  justify-content: center;
}

/* Fil d'Ariane. Doit rester aligné sur le BreadcrumbList JSON-LD de chaque
   page : Google compare le balisage au contenu réellement affiché. */
.breadcrumb {
  margin-bottom: 28px;
  font-family: 'Barlow Condensed', sans-serif;
  font-size: 12px;
  letter-spacing: 2px;
  text-transform: uppercase;
  color: rgba(255, 255, 255, .4);
}
.breadcrumb ol {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px;
  list-style: none;
  margin: 0;
  padding: 0;
}
.breadcrumb li {
  display: flex;
  align-items: center;
  gap: 8px;
}
.breadcrumb li + li::before {
  content: '›';
  opacity: .6;
}
.breadcrumb a {
  color: inherit;
  text-decoration: none;
  transition: .2s;
}
.breadcrumb a:hover {
  color: #e00;
}
.breadcrumb [aria-current='page'] {
  color: rgba(255, 255, 255, .75);
}
/* Au doigt, le lien ne fait que 14px de haut. Le padding agrandit la zone
   tactile à 44px et la marge négative annule son effet sur la mise en page. */
@media (max-width: 768px) {
  .breadcrumb a {
    display: inline-block;
    padding-block: 15px;
    margin-block: -15px;
  }
}
/* Les pages à en-tête centré (.page-hero) centrent aussi leur fil d'Ariane. */
.page-hero .breadcrumb ol {
  justify-content: center;
}

/* iOS Safari zoome sur tout champ dont la police est < 16px. */
@media (max-width: 768px) {
  input,
  select,
  textarea {
    font-size: 16px;
  }
}