/* =========================================================================
   Une Histoire de Pixel — corrections d'accessibilité et de navigation
   (chargé sur toutes les pages ; n'altère pas la mise en page existante)
   ========================================================================= */

/* ---------- Lien d'évitement : invisible jusqu'au focus clavier ---------- */
.skip-link{
  position:fixed;top:12px;left:12px;z-index:10050;
  background:var(--dark);color:var(--text-on-dark);
  padding:10px 16px;font-family:var(--sans);font-size:13px;letter-spacing:.5px;
  transform:translateY(-250%);transition:transform .25s ease;
}
.skip-link:focus{transform:none;outline:2px solid var(--accent-2);outline-offset:2px;}
main:focus{outline:none;}

/* ---------- Sans JavaScript : contenu et accès toujours visibles ---------- */
html:not(.js) #uhpiFrame{display:none !important;}

/* ---------- Navigation lisible dès l'arrivée sur les pages à fond clair ---------- */
header.site-nav.uhp-light-top{
  background:rgba(247,243,236,0.92);
  -webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);
  box-shadow:0 1px 0 var(--line);
}
header.site-nav.uhp-light-top .logo{color:var(--text);}
header.site-nav.uhp-light-top .logo .mark img{filter:invert(1);}
header.site-nav.uhp-light-top nav.links a{color:var(--text-muted);}
header.site-nav.uhp-light-top nav.links a:hover{color:var(--text);}
header.site-nav.uhp-light-top .cta{color:var(--text);}
header.site-nav.uhp-light-top .lang-switch{color:var(--text);}
header.site-nav.uhp-light-top .burger span{background:var(--text);}

/* ---------- Menu mobile ouvert : le bouton de fermeture reste au-dessus du panneau ---------- */
body.uhp-menu-open header.site-nav{
  z-index:1100;background:transparent;box-shadow:none;
  -webkit-backdrop-filter:none;backdrop-filter:none;
}
body.uhp-menu-open header.site-nav .logo{color:var(--text-on-dark);}
body.uhp-menu-open header.site-nav .logo .mark img{filter:none;}
body.uhp-menu-open header.site-nav .lang-switch{color:var(--text-on-dark);}
body.uhp-menu-open header.site-nav .burger span{background:var(--text-on-dark);}

/* ---------- FAQ : boutons natifs, apparence identique à l'existant ---------- */
.faq-heading{margin:0;font:inherit;letter-spacing:normal;}
button.faq-q{
  display:flex;justify-content:space-between;align-items:center;gap:20px;
  width:100%;margin:0;padding:24px 0;border:0;border-radius:0;background:none;
  color:inherit;text-align:left;cursor:pointer;
  font-family:var(--sans);font-size:17px;font-weight:500;letter-spacing:0.2px;line-height:1.6;
  -webkit-appearance:none;appearance:none;
}
button.faq-q .faq-q-label{text-wrap:balance;}
.faq-a{visibility:hidden;transition:max-height .5s ease, visibility 0s linear .5s;}
.faq-item.open .faq-a{visibility:visible;transition:max-height .5s ease, visibility 0s;}

/* ---------- Carrousel : commande de pause discrète ---------- */
.carousel-pause{
  display:flex;align-items:center;justify-content:center;gap:8px;
  margin:18px auto 0;padding:6px 12px;border:0;background:none;cursor:pointer;
  font-family:var(--sans);font-size:11px;letter-spacing:1.5px;text-transform:uppercase;
  color:var(--text-muted);
}
.carousel-pause:hover{color:var(--text);}
.carousel-pause svg{width:10px;height:10px;flex:none;}

/* Longs textes : évite un mot isolé en dernière ligne (navigateurs compatibles ; sinon retour à la ligne normal) */
@supports (text-wrap: pretty){
  .vision-body p, .vision-body li, .faq-a p, .faq-a li, .testi-quote{text-wrap:pretty;}
}
/* Petits intitulés et liens-boutons sur deux lignes : répartition équilibrée (sinon retour à la ligne normal) */
.eyebrow, .cta{text-wrap:balance;}

/* En-tête : le menu complet ne tient sans chevauchement qu'à partir de 1340 px (FR et EN) ; en dessous, menu compact existant */
@media (min-width:981px) and (max-width:1339px){
  nav.links{display:none;}
  header.site-nav>a.cta{display:none;}
  .burger{display:flex;}
}