/* OF Conform — menu du site public (mêmes onglets que la page d'accueil), commun aux pages Veille,
 * articles, FAQ, Tarifs et pages de présentation. Balisage : <nav class="ofc-nav"> (voir
 * ofconform_menu_site.js pour l'ouverture du menu sur mobile). Le panneau mobile (.ofc-nav-mobile) est placé
 * juste après la balise nav, pas dedans : le flou d'arrière-plan de la barre enfermerait un élément « fixed ».
 * Sélecteurs « nav.ofc-nav » : ils l'emportent sur les règles « nav { … } » propres à chaque page. */
nav.ofc-nav {
  position: sticky; top: 0; z-index: 200; display: block; margin: 0; padding: 0; gap: 0;
  background: rgba(27, 58, 75, .97); -webkit-backdrop-filter: blur(10px); backdrop-filter: blur(10px);
  border-bottom: 1px solid rgba(255, 255, 255, .08);
  font-family: 'DM Sans', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
}
.ofc-nav-in {
  max-width: 1160px; margin: 0 auto; height: 60px; padding: 0 1.5rem;
  display: flex; align-items: center; gap: 1.5rem;
}
.ofc-nav-logo {
  font-family: 'DM Serif Display', Georgia, serif; font-size: 1.35rem; color: #fff; text-decoration: none;
  letter-spacing: -.3px; margin-right: auto; white-space: nowrap;
}
.ofc-nav-logo em { font-style: normal; color: #E07830; }
.ofc-nav-liens { display: flex; align-items: center; gap: 1.5rem; }
.ofc-nav-liens a {
  font-size: .875rem; font-weight: 500; color: rgba(255, 255, 255, .72); text-decoration: none;
  letter-spacing: .01em; white-space: nowrap; transition: color .18s;
}
.ofc-nav-liens a:hover, .ofc-nav-liens a[aria-current="page"] { color: #fff; }
.ofc-nav-liens a[aria-current="page"] { box-shadow: 0 2px 0 #E07830; padding-bottom: 2px; }
.ofc-nav-cta {
  padding: .45rem 1.2rem; background: #E07830; color: #fff; border-radius: 7px; font-size: .875rem;
  font-weight: 600; text-decoration: none; white-space: nowrap; transition: background .18s;
}
.ofc-nav-cta:hover { background: #C8601A; color: #fff; }
.ofc-nav-burger {
  display: none; align-items: center; justify-content: center; width: 40px; height: 40px; margin: 0 -.5rem 0 0;
  background: none; border: none; color: #fff; cursor: pointer; padding: 0; border-radius: 8px;
}
.ofc-nav-burger:focus-visible { outline: 2px solid #E07830; outline-offset: 2px; }
.ofc-nav-burger svg { width: 24px; height: 24px; }
.ofc-nav-burger .ofc-x { display: none; }
.ofc-nav.ouvert .ofc-nav-burger .ofc-trois { display: none; }
.ofc-nav.ouvert .ofc-nav-burger .ofc-x { display: block; }
.ofc-nav-mobile {
  display: none; position: fixed; top: 60px; left: 0; right: 0; bottom: 0; z-index: 199; overflow-y: auto;
  background: #142637; flex-direction: column; align-items: center; justify-content: center;
  gap: 1.6rem; padding: 2rem 1rem;
}
.ofc-nav-mobile.ouvert { display: flex; }
.ofc-nav-mobile a { font-size: 1.25rem; font-weight: 700; color: rgba(255, 255, 255, .85); text-decoration: none; }
.ofc-nav-mobile a:hover, .ofc-nav-mobile a[aria-current="page"] { color: #E07830; }
.ofc-nav-mobile .ofc-nav-cta { font-size: 1.05rem; padding: .7rem 2rem; border-radius: 10px; margin-top: .4rem; color: #fff; }

@media (max-width: 1080px) {
  .ofc-nav-liens { display: none; }
  .ofc-nav-burger { display: flex; }
  .ofc-nav-in { gap: 1rem; }
}
@media (max-width: 420px) {
  .ofc-nav-in { padding: 0 1rem; }
  .ofc-nav-in > .ofc-nav-cta { padding: .45rem .8rem; font-size: .8rem; }
  .ofc-nav-in > .ofc-nav-cta .ofc-long { display: none; }
}
