/* ============================================================
   AMBIZ — Header V2
   Topbar discrète + main header avec logo SVG + nav +
   lang switcher dropdown + CTA avec flèche animée + mobile menu
   ============================================================ */


/* ===== Skip link (accessibilité) ===== */
.ambiz-skip-link {
  position: absolute;
  left: -9999px;
  top: 0;
  z-index: var(--z-modal);
  background: var(--ambiz-navy);
  color: var(--ambiz-text-inverse);
  padding: var(--space-2xs) var(--space-sm);
  text-decoration: none;
  border-radius: var(--radius-sm);
  font-size: var(--text-sm);
}
.ambiz-skip-link:focus {
  left: var(--space-sm);
  top: var(--space-sm);
}


/* ============================================================
   1. TOPBAR
   ============================================================ */

.ambiz-topbar {
  background: var(--ambiz-navy-dark);
  color: rgba(255, 255, 255, 0.75);
  padding: var(--space-2xs) 0;
  font-size: var(--text-xs);
}

.ambiz-topbar__inner {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--space-md);
}

.ambiz-topbar__contact {
  display: flex;
  align-items: center;
  gap: var(--space-md);
}

.ambiz-topbar__item {
  display: inline-flex;
  align-items: center;
  gap: var(--space-3xs);
  color: rgba(255, 255, 255, 0.75) !important;
  text-decoration: none;
  transition: color var(--duration-fast) var(--ease-out);
}

.ambiz-topbar__item:hover {
  color: var(--ambiz-text-inverse) !important;
}

.ambiz-topbar__item svg {
  width: 13px;
  height: 13px;
  opacity: 0.7;
}

.ambiz-topbar__sep {
  opacity: 0.3;
}

.ambiz-topbar__badge {
  display: inline-flex;
  align-items: center;
  gap: var(--space-3xs);
  color: var(--ambiz-red-light);
  font-weight: var(--font-medium);
}

.ambiz-topbar__badge svg {
  width: 13px;
  height: 13px;
}

.ambiz-topbar__badge-text-short {
  display: none;
}

@media (max-width: 768px) {
  .ambiz-topbar__email,
  .ambiz-topbar__sep {
    display: none;
  }
  .ambiz-topbar__badge-text-long {
    display: none;
  }
  .ambiz-topbar__badge-text-short {
    display: inline;
  }
}


/* ============================================================
   2. MAIN HEADER
   ============================================================ */

.ambiz-main-header {
  background: var(--ambiz-bg);
  border-bottom: 1px solid var(--ambiz-border-light);
  position: relative;
  z-index: var(--z-sticky);
  transition: box-shadow var(--duration-base) var(--ease-out);
}

.ambiz-site-header.is-scrolled .ambiz-main-header {
  box-shadow: var(--shadow-md);
  border-bottom-color: transparent;
}

.ambiz-main-header__inner {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--space-lg);
  /* padding-block uniquement : préserve les padding-left/right hérités de .ambiz-container */
  padding-top: var(--space-sm);
  padding-bottom: var(--space-sm);
}


/* ============================================================
   3. LOGO
   Le PNG est composé : emblème (chapeau + visage) + "AMBIZ" en lettres
   stylisées drapeau US + tagline. Ratio natif ≈ 1.28:1 (640×500).
   ============================================================ */

.ambiz-logo {
  display: inline-flex;
  align-items: center;
  text-decoration: none;
  flex-shrink: 0;
  line-height: 0;
}

.ambiz-logo__img {
  height: 68px;
  width: auto;
  display: block;
  max-width: 100%;
}

@media (max-width: 1023px) {
  .ambiz-logo__img {
    height: 56px;
  }
}

@media (max-width: 480px) {
  .ambiz-logo__img {
    height: 48px;
  }
}


/* ============================================================
   4. NAV PRINCIPALE
   ============================================================ */

.ambiz-nav__list,
ul.ambiz-nav__list {
  display: flex;
  align-items: center;
  gap: var(--space-md);
  list-style: none !important;
  margin: 0 !important;
  padding: 0 !important;
}

.ambiz-nav__list li,
.ambiz-nav__list > li {
  list-style: none !important;
  margin: 0;
  padding: 0;
  position: relative;
}

.ambiz-nav__list li::marker {
  content: none;
}

.ambiz-nav__list a,
.ambiz-nav__list > li > a {
  display: inline-block;
  padding: var(--space-2xs) 0;
  font-family: var(--font-sans);
  font-size: var(--text-sm);
  font-weight: var(--font-medium);
  color: var(--ambiz-text) !important;
  text-decoration: none;
  transition: color var(--duration-fast) var(--ease-out);
  position: relative;
}

.ambiz-nav__list a::after,
.ambiz-nav__list > li > a::after {
  content: '';
  position: absolute;
  left: 0;
  right: 0;
  bottom: -4px;
  height: 2px;
  background: var(--ambiz-red);
  transform: scaleX(0);
  transform-origin: center;
  transition: transform var(--duration-base) var(--ease-out);
}

.ambiz-nav__list a:hover,
.ambiz-nav__list > li > a:hover,
.ambiz-nav__list .current-menu-item > a,
.ambiz-nav__list .current-page-ancestor > a {
  color: var(--ambiz-navy) !important;
}

.ambiz-nav__list a:hover::after,
.ambiz-nav__list > li > a:hover::after,
.ambiz-nav__list .current-menu-item > a::after,
.ambiz-nav__list .current-page-ancestor > a::after {
  transform: scaleX(1);
}

/* État actif renforcé : la page courante (ou son ancêtre) reste lisible
   même sans hover — couleur navy + poids semi-bold + soulignement rouge. */
.ambiz-nav__list .current-menu-item > .ambiz-nav__link,
.ambiz-nav__list .current-page-ancestor > .ambiz-nav__link {
  color: var(--ambiz-navy) !important;
  font-weight: var(--font-semibold);
}


/* ============================================================
   4bis. SOUS-MENU « À propos »
   Design calqué sur le switcher de langue (.ambiz-lang-dropdown) :
   carte blanche, radius-xl, double ombre douce, flèche popover,
   lignes avec hover bleu tinté. « À propos » reste du texte de nav
   simple (pas de pilule/bouton encadré).
   ============================================================ */

/* « À propos » + chevron = une unité compacte (pas d'espace parasite,
   pas de pilule encadrée). Le <li> devient un flex inline serré. */
.ambiz-nav__item--has-children {
  position: relative;
  display: inline-flex;
  align-items: center;
  gap: 4px;
}

.ambiz-nav__item--has-children > .ambiz-nav__link {
  flex: 0 0 auto;
}

/* Chevron : bouton totalement neutralisé (jamais de fond/bordure
   parasites), couleur explicite pour rester visible en toute langue. */
.ambiz-nav__submenu-toggle {
  -webkit-appearance: none;
  appearance: none;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex: 0 0 auto;
  width: 18px;
  height: 18px;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  padding: 0;
  margin: 0;
  color: var(--ambiz-text);
  cursor: pointer;
}

.ambiz-nav__submenu-toggle:hover {
  color: var(--ambiz-navy);
}

.ambiz-nav__submenu-toggle:focus-visible {
  outline: 2px solid var(--ambiz-navy);
  outline-offset: 2px;
  border-radius: 3px;
}

.ambiz-nav__submenu-toggle svg {
  width: 14px;
  height: 14px;
  display: block;
  transition: transform var(--duration-fast) var(--ease-out);
}

/* ----- Carte déroulante (desktop) ----- */
.ambiz-nav .ambiz-nav__submenu {
  position: absolute;
  top: calc(100% + 14px);
  left: 50%;
  transform: translateX(-50%) translateY(-6px);
  min-width: 230px;
  list-style: none !important;
  margin: 0 !important;
  padding: var(--space-2xs) !important;
  background: var(--ambiz-bg);
  border: 1px solid var(--ambiz-border-light);
  border-radius: var(--radius-xl);
  box-shadow:
    0 12px 32px rgba(15, 31, 61, 0.12),
    0 2px 8px rgba(15, 31, 61, 0.06);
  display: flex;
  flex-direction: column;
  gap: 2px;
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  transition:
    opacity var(--duration-base) var(--ease-out),
    transform var(--duration-base) var(--ease-out),
    visibility 0s linear var(--duration-base);
  z-index: var(--z-dropdown);
}

/* Flèche popover pointant vers « À propos » (comme le dropdown langue) */
.ambiz-nav .ambiz-nav__submenu::before {
  content: '';
  position: absolute;
  top: -6px;
  left: 50%;
  margin-left: -6px;
  width: 12px;
  height: 12px;
  background: var(--ambiz-bg);
  border-top: 1px solid var(--ambiz-border-light);
  border-left: 1px solid var(--ambiz-border-light);
  transform: rotate(45deg);
}

/* Pont invisible : évite la fermeture quand la souris passe du label
   au menu (espace de 14px entre les deux). */
.ambiz-nav .ambiz-nav__item--has-children::after {
  content: '';
  position: absolute;
  top: 100%;
  left: 0;
  right: 0;
  height: 16px;
}

.ambiz-nav .ambiz-nav__item--has-children:hover .ambiz-nav__submenu,
.ambiz-nav .ambiz-nav__item--has-children:focus-within .ambiz-nav__submenu {
  opacity: 1;
  visibility: visible;
  pointer-events: auto;
  transform: translateX(-50%) translateY(0);
  transition:
    opacity var(--duration-base) var(--ease-out),
    transform var(--duration-base) var(--ease-out),
    visibility 0s linear 0s;
}

.ambiz-nav .ambiz-nav__item--has-children:hover .ambiz-nav__submenu-toggle svg,
.ambiz-nav .ambiz-nav__item--has-children:focus-within .ambiz-nav__submenu-toggle svg {
  transform: rotate(180deg);
}

.ambiz-nav__subitem {
  list-style: none !important;
  margin: 0;
  padding: 0;
  position: static;
}

.ambiz-nav__subitem::marker {
  content: none;
}

.ambiz-nav__sublink {
  display: flex;
  align-items: center;
  padding: 10px 12px;
  border-radius: var(--radius-lg);
  font-family: var(--font-sans);
  font-size: var(--text-sm);
  font-weight: var(--font-medium);
  color: var(--ambiz-text) !important;
  text-decoration: none;
  white-space: nowrap;
  transition:
    background var(--duration-fast) var(--ease-out),
    color var(--duration-fast) var(--ease-out);
}

/* Neutralise l'animation de soulignement générique sur les sous-liens */
.ambiz-nav__sublink::after {
  display: none !important;
}

.ambiz-nav__sublink:hover {
  background: var(--ambiz-bg-blue-tint);
  color: var(--ambiz-navy) !important;
}

.ambiz-nav__subitem.current-menu-item .ambiz-nav__sublink {
  background: var(--ambiz-bg-blue-tint);
  color: var(--ambiz-navy) !important;
  font-weight: var(--font-semibold);
}


/* ============================================================
   5. HEADER ACTIONS (lang + CTA + burger)
   ============================================================ */

.ambiz-header-actions {
  display: flex;
  align-items: center;
  gap: var(--space-sm);
  flex-shrink: 0;
}


/* ============================================================
   6. LANG SWITCHER
   ============================================================ */

.ambiz-lang-switcher {
  position: relative;
}

.ambiz-lang-pill {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 6px 12px;
  background: var(--ambiz-bg);
  border: 1px solid var(--ambiz-border);
  border-radius: 20px;
  font-family: var(--font-sans);
  font-size: var(--text-xs);
  font-weight: var(--font-semibold);
  color: var(--ambiz-navy);
  cursor: pointer;
  transition: all var(--duration-fast) var(--ease-out);
}

.ambiz-lang-pill:hover {
  border-color: var(--ambiz-navy);
  background: var(--ambiz-bg-light);
}

.ambiz-lang-pill svg {
  width: 14px;
  height: 14px;
}

.ambiz-lang-pill__chevron {
  transition: transform var(--duration-fast) var(--ease-out);
}

.ambiz-lang-pill[aria-expanded="true"] .ambiz-lang-pill__chevron {
  transform: rotate(180deg);
}

.ambiz-lang-dropdown {
  position: absolute;
  top: calc(100% + 10px);
  right: 0;
  min-width: 220px;
  background: var(--ambiz-bg);
  border: 1px solid var(--ambiz-border-light);
  border-radius: var(--radius-xl);
  box-shadow: 0 12px 32px rgba(15, 31, 61, 0.12), 0 2px 8px rgba(15, 31, 61, 0.06);
  padding: var(--space-2xs);
  z-index: var(--z-dropdown);
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  transform: translateY(-6px);
  transition: opacity var(--duration-base) var(--ease-out),
              transform var(--duration-base) var(--ease-out),
              visibility 0s linear var(--duration-base);
}

/* Flèche pointant vers le bouton (effet popover) */
.ambiz-lang-dropdown::before {
  content: '';
  position: absolute;
  top: -6px;
  right: 22px;
  width: 12px;
  height: 12px;
  background: var(--ambiz-bg);
  border-top: 1px solid var(--ambiz-border-light);
  border-left: 1px solid var(--ambiz-border-light);
  transform: rotate(45deg);
}

/* Graceful degradation : sans JS, l'attribut [hidden] cache le dropdown */
.ambiz-lang-dropdown[hidden] {
  display: none;
}

/* État ouvert (piloté par JS via .is-open) */
.ambiz-lang-dropdown.is-open {
  opacity: 1;
  visibility: visible;
  pointer-events: auto;
  transform: translateY(0);
  transition: opacity var(--duration-base) var(--ease-out),
              transform var(--duration-base) var(--ease-out),
              visibility 0s linear 0s;
}


/* ============================================================
   6.b. LANG LIST — desktop dropdown + mobile horizontal
   ============================================================ */

.ambiz-lang-list,
ul.ambiz-lang-list {
  list-style: none !important;
  margin: 0 !important;
  padding: 0 !important;
}

.ambiz-lang-list--desktop {
  display: flex;
  flex-direction: column;
  gap: 2px;
}

.ambiz-lang-item,
.ambiz-lang-list .ambiz-lang-item {
  list-style: none !important;
  margin: 0;
  padding: 0;
}

.ambiz-lang-item::marker {
  content: none;
}

.ambiz-lang-item a,
.ambiz-lang-list a {
  display: flex;
  align-items: center;
  gap: var(--space-2xs);
  padding: 10px 12px;
  border-radius: var(--radius-lg);
  text-decoration: none;
  font-family: var(--font-sans);
  color: var(--ambiz-text) !important;
  transition: background var(--duration-fast) var(--ease-out),
              color var(--duration-fast) var(--ease-out);
  position: relative;
}

.ambiz-lang-item a:hover {
  background: var(--ambiz-bg-blue-tint);
  color: var(--ambiz-navy) !important;
}

.ambiz-lang-item__code {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 32px;
  height: 22px;
  padding: 0 6px;
  background: var(--ambiz-bg-subtle);
  color: var(--ambiz-text-muted);
  border-radius: var(--radius-sm);
  font-size: 11px;
  font-weight: var(--font-bold);
  letter-spacing: 0.04em;
  font-feature-settings: 'tnum';
  transition: background var(--duration-fast) var(--ease-out),
              color var(--duration-fast) var(--ease-out);
}

.ambiz-lang-item__name {
  font-size: var(--text-sm);
  font-weight: var(--font-medium);
  flex: 1;
}

.ambiz-lang-item__check {
  width: 16px;
  height: 16px;
  color: var(--ambiz-red);
  flex-shrink: 0;
}

/* État actif */
.ambiz-lang-item.is-current a {
  background: var(--ambiz-red-tint);
}

.ambiz-lang-item.is-current a:hover {
  background: var(--ambiz-red-tint);
}

.ambiz-lang-item.is-current .ambiz-lang-item__code {
  background: var(--ambiz-red);
  color: var(--ambiz-text-inverse);
}

.ambiz-lang-item.is-current .ambiz-lang-item__name {
  color: var(--ambiz-navy);
  font-weight: var(--font-semibold);
}

/* Langue sans traduction de la page courante : visuellement atténuée */
.ambiz-lang-item.is-no-translation a {
  opacity: 0.55;
}
.ambiz-lang-item.is-no-translation a:hover {
  opacity: 1;
}


/* ============================================================
   7. CTA HEADER (avec flèche slide)
   ============================================================ */

.ambiz-cta-header {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  background: var(--ambiz-red);
  color: var(--ambiz-text-inverse) !important;
  padding: 9px 18px;
  border: none;
  border-radius: var(--radius-md);
  font-family: var(--font-sans);
  font-size: var(--text-sm);
  font-weight: var(--font-semibold);
  letter-spacing: 0.02em;
  text-decoration: none;
  transition: background var(--duration-base) var(--ease-out);
  white-space: nowrap;
}

.ambiz-cta-header:hover {
  background: var(--ambiz-red-dark);
  color: var(--ambiz-text-inverse) !important;
}

.ambiz-cta-header__arrow {
  width: 14px;
  height: 14px;
  transition: transform var(--duration-base) var(--ease-out);
}

.ambiz-cta-header:hover .ambiz-cta-header__arrow {
  transform: translateX(3px);
}


/* ============================================================
   8. BURGER (mobile)
   ============================================================ */

.ambiz-burger {
  width: 40px;
  height: 40px;
  background: var(--ambiz-bg-light);
  border: 1px solid var(--ambiz-border);
  border-radius: var(--radius-md);
  cursor: pointer;
  display: none;
  flex-direction: column;
  gap: 4px;
  align-items: center;
  justify-content: center;
  padding: 0;
  transition: all var(--duration-fast) var(--ease-out);
}

.ambiz-burger:hover {
  border-color: var(--ambiz-navy);
}

.ambiz-burger__line {
  width: 18px;
  height: 2px;
  background: var(--ambiz-navy);
  border-radius: 2px;
  transition: all var(--duration-base) var(--ease-out);
}

.ambiz-burger__line--accent {
  background: var(--ambiz-red);
}

.ambiz-burger[aria-expanded="true"] .ambiz-burger__line:nth-child(1) {
  transform: translateY(6px) rotate(45deg);
}
.ambiz-burger[aria-expanded="true"] .ambiz-burger__line:nth-child(2) {
  opacity: 0;
}
.ambiz-burger[aria-expanded="true"] .ambiz-burger__line:nth-child(3) {
  transform: translateY(-6px) rotate(-45deg);
  background: var(--ambiz-navy);
}


/* ============================================================
   9. MOBILE MENU OVERLAY
   ============================================================ */

.ambiz-mobile-menu {
  position: fixed;
  top: 0;
  right: 0;
  width: 100%;
  max-width: 380px;
  /* Fallback 100vh + 100dvh moderne pour s'adapter à la barre URL mobile */
  height: 100vh;
  height: 100dvh;
  background: var(--ambiz-bg);
  box-shadow: var(--shadow-2xl);
  transform: translateX(100%);
  transition: transform var(--duration-slow) var(--ease-out);
  z-index: var(--z-modal);
  /* Pas de scroll du wrapper : le scroll est délégué à .ambiz-mobile-menu__nav
     pour garder le header en haut et le CTA + langues en bas toujours visibles. */
  overflow: hidden;
  display: flex;
  flex-direction: column;
}

.ambiz-mobile-menu.is-open {
  transform: translateX(0);
}

.ambiz-mobile-menu__header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: var(--space-sm) var(--space-md);
  border-bottom: 1px solid var(--ambiz-border-light);
  flex-shrink: 0;
}

.ambiz-mobile-menu__close {
  width: 36px;
  height: 36px;
  background: transparent;
  border: none;
  cursor: pointer;
  position: relative;
  padding: 0;
  border-radius: var(--radius-md);
  transition: background var(--duration-fast) var(--ease-out);
}

.ambiz-mobile-menu__close:hover {
  background: var(--ambiz-bg-light);
}

.ambiz-mobile-menu__close::before,
.ambiz-mobile-menu__close::after {
  content: '';
  position: absolute;
  top: 50%;
  left: 50%;
  width: 20px;
  height: 2px;
  background: var(--ambiz-navy);
  border-radius: 2px;
  transform-origin: center;
}
.ambiz-mobile-menu__close::before {
  transform: translate(-50%, -50%) rotate(45deg);
}
.ambiz-mobile-menu__close::after {
  transform: translate(-50%, -50%) rotate(-45deg);
}

.ambiz-mobile-menu__nav {
  padding: var(--space-2xs) var(--space-md);
  /* flex: 1 + min-height: 0 → permet à la zone nav de rétrécir sous la taille
     de son contenu et de gérer son propre scroll vertical, libérant l'espace
     pour le CTA et le bloc langues en bas (toujours visibles). */
  flex: 1 1 auto;
  min-height: 0;
  overflow-y: auto;
  -webkit-overflow-scrolling: touch;
  overscroll-behavior: contain;
}

.ambiz-mobile-menu__list,
ul.ambiz-mobile-menu__list {
  list-style: none !important;
  margin: 0 !important;
  padding: 0 !important;
  display: flex;
  flex-direction: column;
}

.ambiz-mobile-menu__list li {
  list-style: none !important;
  margin: 0;
  padding: 0;
}

.ambiz-mobile-menu__list li::marker {
  content: none;
}

.ambiz-mobile-menu__list a,
.ambiz-mobile-menu__list > li > a {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: var(--space-sm) 0;
  font-family: var(--font-serif);
  font-size: var(--text-lg);
  font-weight: var(--font-bold);
  color: var(--ambiz-navy) !important;
  text-decoration: none;
  border-bottom: 1px solid var(--ambiz-border-light);
  transition: color var(--duration-fast) var(--ease-out);
}

.ambiz-mobile-menu__list a:hover {
  color: var(--ambiz-red) !important;
}

.ambiz-mobile-menu__list .current-menu-item > a,
.ambiz-mobile-menu__list .current-page-ancestor > a {
  color: var(--ambiz-red) !important;
}

.ambiz-mobile-menu__list .current-menu-item > a::after {
  content: '';
  width: 6px;
  height: 6px;
  background: var(--ambiz-red);
  border-radius: 50%;
  display: inline-block;
  flex-shrink: 0;
}

.ambiz-mobile-menu__cta {
  margin: var(--space-md);
  width: calc(100% - 2 * var(--space-md));
  justify-content: center;
  padding: 14px 24px;
  font-size: var(--text-base);
  flex-shrink: 0;
}

.ambiz-mobile-menu__lang {
  padding: var(--space-md);
  /* Respect de la safe area iOS (barre du bas / encoche) */
  padding-bottom: max( var(--space-md), env(safe-area-inset-bottom, var(--space-md)) );
  border-top: 1px solid var(--ambiz-border-light);
  flex-shrink: 0;
}

.ambiz-mobile-menu__lang-label {
  font-family: var(--font-sans);
  font-size: 10px;
  font-weight: var(--font-semibold);
  color: var(--ambiz-text-subtle);
  text-transform: uppercase;
  letter-spacing: var(--tracking-widest);
  margin: 0 0 var(--space-2xs);
}

/* Version mobile : pills horizontaux compacts */
.ambiz-lang-list--mobile {
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-2xs);
}

.ambiz-lang-list--mobile .ambiz-lang-item a {
  padding: 6px 10px;
  border: 1px solid var(--ambiz-border-light);
  border-radius: var(--radius-full);
  gap: 6px;
}

.ambiz-lang-list--mobile .ambiz-lang-item__name {
  display: none;
}

.ambiz-lang-list--mobile .ambiz-lang-item__code {
  background: transparent;
  min-width: auto;
  height: auto;
  padding: 0;
  font-size: var(--text-xs);
  color: var(--ambiz-navy);
}

.ambiz-lang-list--mobile .ambiz-lang-item.is-current a {
  background: var(--ambiz-red);
  border-color: var(--ambiz-red);
}

.ambiz-lang-list--mobile .ambiz-lang-item.is-current .ambiz-lang-item__code {
  background: transparent;
  color: var(--ambiz-text-inverse);
}

.ambiz-lang-list--mobile .ambiz-lang-item__check {
  width: 12px;
  height: 12px;
  color: var(--ambiz-text-inverse);
}


/* ============================================================
   10. BREAKPOINTS — Bascule desktop / mobile
   ============================================================ */

/* Mobile (< 1024px) */
@media (max-width: 1023px) {
  .ambiz-nav,
  .ambiz-lang-switcher,
  .ambiz-cta-header:not(.ambiz-mobile-menu__cta) {
    display: none;
  }
  .ambiz-burger {
    display: flex;
  }
}

/* Sous-menu « À propos » dans l'overlay mobile (accordéon)
   Le fallback rend toujours .ambiz-nav__list ; dans le contexte mobile on
   le repasse en colonne et on transforme le sous-menu en accordéon piloté
   par .is-open (toggle JS). */
@media (max-width: 1023px) {
  .ambiz-mobile-menu__nav .ambiz-nav__list {
    flex-direction: column;
    align-items: stretch;
    gap: 0;
  }

  .ambiz-mobile-menu__nav .ambiz-nav__item {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    border-bottom: 1px solid var(--ambiz-border-light);
  }

  .ambiz-mobile-menu__nav .ambiz-nav__link {
    flex: 1 1 auto;
    display: block;
    padding: var(--space-sm) 0;
    font-family: var(--font-serif);
    font-size: var(--text-lg);
    font-weight: var(--font-bold);
    color: var(--ambiz-navy) !important;
  }

  .ambiz-mobile-menu__nav .ambiz-nav__link::after {
    display: none !important;
  }

  .ambiz-mobile-menu__nav .ambiz-nav__submenu-toggle {
    flex: 0 0 auto;
    padding: var(--space-sm);
    margin: 0;
    color: var(--ambiz-navy);
  }

  .ambiz-mobile-menu__nav .ambiz-nav__submenu-toggle svg {
    width: 20px;
    height: 20px;
  }

  .ambiz-mobile-menu__nav .ambiz-nav__submenu {
    flex: 1 1 100%;
    list-style: none !important;
    margin: 0 !important;
    padding: 0 !important;
    max-height: 0;
    overflow: hidden;
    transition: max-height var(--duration-slow, 0.3s) var(--ease-out);
  }

  .ambiz-mobile-menu__nav .ambiz-nav__item--has-children.is-open .ambiz-nav__submenu {
    max-height: 360px;
  }

  .ambiz-mobile-menu__nav .ambiz-nav__item--has-children.is-open .ambiz-nav__submenu-toggle svg {
    transform: rotate(180deg);
  }

  .ambiz-mobile-menu__nav .ambiz-nav__sublink {
    display: block;
    padding: var(--space-sm) 0 var(--space-sm) var(--space-md);
    font-family: var(--font-sans);
    font-size: var(--text-base);
    font-weight: var(--font-medium);
    color: var(--ambiz-text) !important;
    text-decoration: none;
    border-top: 1px solid var(--ambiz-border-light);
  }

  .ambiz-mobile-menu__nav .ambiz-nav__sublink::after {
    display: none !important;
  }

  .ambiz-mobile-menu__nav .current-menu-item > .ambiz-nav__link,
  .ambiz-mobile-menu__nav .current-page-ancestor > .ambiz-nav__link,
  .ambiz-mobile-menu__nav .ambiz-nav__subitem.current-menu-item .ambiz-nav__sublink {
    color: var(--ambiz-red) !important;
  }
}

/* Desktop (≥ 1024px) */
@media (min-width: 1024px) {
  .ambiz-burger,
  .ambiz-mobile-menu {
    display: none;
  }
}


/* ============================================================
   11. RTL — Préparation pour la langue arabe (Polylang)
   ============================================================ */

[dir="rtl"] .ambiz-mobile-menu {
  right: auto;
  left: 0;
  transform: translateX(-100%);
}

[dir="rtl"] .ambiz-mobile-menu.is-open {
  transform: translateX(0);
}

[dir="rtl"] .ambiz-lang-dropdown {
  right: auto;
  left: 0;
}

[dir="rtl"] .ambiz-lang-dropdown::before {
  right: auto;
  left: 22px;
}

[dir="rtl"] .ambiz-cta-header__arrow {
  transform: scaleX(-1);
}

[dir="rtl"] .ambiz-cta-header:hover .ambiz-cta-header__arrow {
  transform: scaleX(-1) translateX(3px);
}