/* ===================================================================
   FactureX — En-tête & pied de page (header-footer-elementor)
   Reproduit le chrome soigné du site Next par-dessus le markup HFE.
   Chargé sur TOUT le site. HFE enveloppe le header dans .ehf-header et le
   pied dans .ehf-footer (sélecteurs stables, le _css_classes de la section
   de tête HFE n'est pas rendu).
   =================================================================== */

/* --- En-tête : sticky, translucide, fin --- */
.ehf-header {
  position: sticky;
  top: 0;
  z-index: 99;
  background: rgba(255, 255, 255, 0.9);
  -webkit-backdrop-filter: blur(16px);
  backdrop-filter: blur(16px);
  border-bottom: 1px solid #e7e2d4;
}

/* Logo compact */
.ehf-header .elementor-widget-image img {
  width: auto !important;
  height: 42px;
}

/* Navigation : alignée à droite, sur une seule ligne, compacte, Inter */
.ehf-header .hfe-nav-menu__layout-horizontal .hfe-nav-menu {
  justify-content: flex-end;
  flex-wrap: nowrap;
}
.ehf-header .hfe-nav-menu .menu-item > a {
  font-family: "Inter", Arial, sans-serif;
  font-size: 14px;
  font-weight: 600;
  color: #6b6862;
  padding: 8px 12px;
  white-space: nowrap;
  transition: color 160ms ease;
}
.ehf-header .hfe-nav-menu .menu-item > a:hover,
.ehf-header .hfe-nav-menu .menu-item.current-menu-item > a {
  color: #8c7430;
}

/* CTA à droite */
.ehf-header .elementor-widget-button { text-align: right; }
.ehf-header .elementor-button {
  font-family: "Inter", Arial, sans-serif;
  font-weight: 800;
  letter-spacing: 0;
}

/* Toggle mobile (hamburger) */
.ehf-header .hfe-nav-menu__toggle .hfe-nav-menu-icon { color: #14110d; }

/* --- Pied de page ---------------------------------------------------
   Reproduit le SiteFooter du site Next (.site-footer*). HFE enveloppe le
   pied dans .ehf-footer. Les classes fx-foot-* sont posées par
   scripts/build-footer.php sur des COLONNES Elementor (jamais la section
   racine), rendues comme .elementor-column.fx-foot-*. Les zones sont
   séparées par des border-top, comme dans globals.css.
   ------------------------------------------------------------------- */
.ehf-footer {
  background: rgba(255, 255, 255, 0.54);
  border-top: 1px solid #e7e2d4;
}

/* Liens : couleur de base + survol prune (cf. --color-brand-plum-700) */
.ehf-footer a { color: #6b6862; }
.ehf-footer a:hover { color: #8c7430; }

/* Neutralise les marges Elementor entre zones (espacements gérés ici) */
.ehf-footer .elementor-widget:not(:last-child) { margin-bottom: 0; }

/* ---- Zone 1 : footer-top (marque | navigation) ---- */
.ehf-footer .fx-foot-top { padding-block: 40px 24px; }

/* Inner-section : 1 colonne pleine -> 2 colonnes dès 768px (1fr auto) */
.ehf-footer .fx-foot-top .elementor-inner-section > .elementor-container {
  flex-wrap: wrap;
  gap: 28px;
}
@media (min-width: 768px) {
  .ehf-footer .fx-foot-top .elementor-inner-section > .elementor-container {
    flex-wrap: nowrap;
    align-items: flex-start;
    gap: 48px;
  }
  .ehf-footer .fx-foot-nav { flex: 0 0 auto; }
}

/* Marque : logo + accroche */
.ehf-footer .fx-foot-brand { max-width: 360px; }
.ehf-footer .elementor-widget-image img { width: auto !important; height: 36px; }
.ehf-footer .fx-foot-tagline {
  margin: 14px 0 0;
  color: #6b6862;
  font-size: 15px;
  line-height: 1.6;
}

/* Navigation pied : flex qui s'enroule (gap 14/24), pas une liste serrée */
.ehf-footer .fx-foot-nav .hfe-nav-menu,
.ehf-footer .fx-foot-nav .hfe-nav-menu__layout-horizontal .hfe-nav-menu {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-start;
  gap: 14px 24px;
}
.ehf-footer .fx-foot-nav .menu-item { margin: 0; }
.ehf-footer .fx-foot-nav .hfe-nav-menu .menu-item > a {
  font-family: "Inter", Arial, sans-serif;
  font-size: 14px;
  font-weight: 700;
  color: #6b6862;
  padding: 0;
  transition: color 160ms ease;
}
.ehf-footer .fx-foot-nav .hfe-nav-menu .menu-item > a:hover,
.ehf-footer .fx-foot-nav .hfe-nav-menu .menu-item.current-menu-item > a { color: #8c7430; }

/* ---- Zone 2 : footer-partners (libellé + logos) ---- */
.ehf-footer .fx-foot-partners {
  border-top: 1px solid #e7e2d4;
  padding-block: 24px;
}
.ehf-footer .fx-foot-partners > .elementor-element-populated > .elementor-widget-wrap,
.ehf-footer .fx-foot-partners > .elementor-widget-wrap {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 20px 32px;
}
.ehf-footer .fx-foot-partners > .elementor-element-populated > .elementor-widget-wrap > .elementor-widget,
.ehf-footer .fx-foot-partners > .elementor-widget-wrap > .elementor-widget { width: auto; }

/* Libellé « Technologie & partenaires » : eyebrow mono */
.ehf-footer .fx-foot-partners-label .elementor-heading-title {
  font-family: "IBM Plex Mono", ui-monospace, monospace;
  font-size: 11px;
  font-weight: 800;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: #9a958c;
  margin: 0;
}

/* Bande de logos : hauteur homogène ~30px + atténuation */
.ehf-footer .fx-foot-logos {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 18px 28px;
}
.ehf-footer .fx-foot-logos img {
  height: 30px !important;
  width: auto !important;
  object-fit: contain;
  opacity: 0.85;
  transition: opacity 180ms ease;
}
.ehf-footer .fx-foot-logos a:hover img,
.ehf-footer .fx-foot-logos img:hover { opacity: 1; }

/* ---- Zone 3 : footer-legal (liens légaux + gérer cookies) ---- */
.ehf-footer .fx-foot-legal {
  border-top: 1px solid #e7e2d4;
  padding-block: 18px;
}
.ehf-footer .fx-foot-legal-row {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 10px 22px;
}
.ehf-footer .fx-foot-legal-row a,
.ehf-footer .fx-cookie-manage {
  color: #6b6862;
  font-size: 13px;
  font-weight: 700;
}
.ehf-footer .fx-foot-legal-row a:hover,
.ehf-footer .fx-cookie-manage:hover { color: #8c7430; }
.ehf-footer .fx-cookie-manage {
  cursor: pointer;
  border: 0;
  background: transparent;
  padding: 0;
  font-family: "Inter", Arial, sans-serif;
  line-height: inherit;
}

/* ---- Zone 4 : footer-bottom (marque + copyright) ---- */
.ehf-footer .fx-foot-bottom {
  border-top: 1px solid #e7e2d4;
  padding-block: 20px 32px;
}
.ehf-footer .fx-foot-bottom .hfe-copyright-wrapper {
  display: flex;
  flex-direction: column;
  gap: 8px;
  color: #9a958c;
  font-size: 13px;
}
.ehf-footer .fx-foot-bottom .hfe-copyright-wrapper p { margin: 0; }
.ehf-footer .fx-foot-bottom .fx-foot-brandname { color: #6b6862; font-weight: 700; }
@media (min-width: 768px) {
  .ehf-footer .fx-foot-bottom .hfe-copyright-wrapper {
    flex-direction: row;
    align-items: center;
    justify-content: space-between;
  }
}