
/* =========================================================
   HEADER
   ========================================================= */

.ma-header{
  position: relative;
  z-index: var(--z-header);
}

.ma-header__logo-text,
.ma-header__logo-mark{
  transition:
    opacity var(--dur-base) ease,
    transform var(--dur-base) ease;
}

.ma-header__logo-text{
  opacity: 1;
  transform: translateX(0);
}

.ma-header__logo-mark{
  opacity: 0;
  transform: translateX(-200px);
}

.elementor-sticky--effects .ma-header__logo-text{
  opacity: 0;
  transform: translateX(-200px);
}

.elementor-sticky--effects .ma-header__logo-mark{
  opacity: 1;
  transform: translateX(0);
}

/* effet verre */
.ma-header--glass{
  background: rgba(255,255,255,.78);
  -webkit-backdrop-filter: blur(10px);
  backdrop-filter: blur(10px);
}

/* =========================================================
   STACKING CONTEXT : HEADER / CONTENT / FOOTER
   ========================================================= */

.elementor-location-header{
  position: relative;
  z-index: var(--z-header);
  isolation: isolate;
}

.elementor-sticky--effects{
  z-index: var(--z-header) !important;
}

footer.elementor-location-footer{
  position: fixed;
  inset: auto 0 0;
  z-index: var(--z-footer);
/*  pointer-events: none;*/
}

body.ma-footer-visible footer.elementor-location-footer{
/*  pointer-events: auto;*/
}

/* le contenu doit rester au-dessus du footer fixe */
:where(
  .elementor-location-archive,
  .elementor-location-single,
  [data-elementor-type="wp-page"],
  [data-elementor-type="single"],
  [data-elementor-type="wp-post"],
  [data-elementor-type="archive"],
  .site-main,
  #content
){
  position: relative;
  z-index: var(--z-content);
  background: transparent;
}

/* réserve footer */
:where(
  .elementor-location-archive,
  .elementor-location-single,
  [data-elementor-type="wp-page"],
  [data-elementor-type="single"],
  [data-elementor-type="wp-post"],
  [data-elementor-type="archive"],
  body.single .site-main,
  body.single #content,
  body.single main.site-main
){
  margin-bottom: var(--ma-footer-h);
}

.ma-footer-sentinel{
  height: 1px;
  margin-top: calc(var(--ma-footer-h) * -1);
}

/* pas de réserve footer sur les templates injectés via widget template */
.elementor-widget-template :is(
  .elementor-location-single,
  .elementor-location-archive,
  .elementor-location-header,
  .elementor-location-footer
){
  margin-bottom: 0 !important;
}
/* =========================================================
   HEADER
   liens menu bleus + boutons via classes dédiées
   ========================================================= */

.elementor-location-header,
.ma-header{
  background: transparent !important;
}

/* liens / textes normaux du header */
.elementor-location-header :is(
  .elementor-item,
  .elementor-item-active,
  .elementor-sub-item,
  a:not(.elementor-button),
  .elementor-icon-list-text,
  .elementor-heading-title,
  .elementor-icon,
  .elementor-icon svg,
  .elementor-widget-text-editor,
  .elementor-widget-text-editor p,
  .elementor-widget-text-editor span
),
.ma-header :is(
  .elementor-item,
  .elementor-item-active,
  .elementor-sub-item,
  a:not(.elementor-button),
  .elementor-icon-list-text,
  .elementor-heading-title,
  .elementor-icon,
  .elementor-icon svg
){
  color: var(--color-accent);
  fill: var(--color-accent);
}

/* on ne force plus les boutons globalement */
.elementor-location-header .elementor-button,
.ma-header .elementor-button{
  transition:
    background-color var(--dur-base) ease,
    border-color var(--dur-base) ease,
    color var(--dur-base) ease,
    opacity var(--dur-base) ease;
}

.elementor-location-header .elementor-button .elementor-button-text,
.elementor-location-header .elementor-button .elementor-button-icon,
.elementor-location-header .elementor-button .elementor-button-icon svg,
.ma-header .elementor-button .elementor-button-text,
.ma-header .elementor-button .elementor-button-icon,
.ma-header .elementor-button .elementor-button-icon svg{
  color: inherit;
  fill: currentColor;
}

.elementor-sticky--effects .ma-header--glass{
  background: rgba(255,255,255,.78) !important;
}
/* =========================================================
   HERO
   ========================================================= */

.ma-hero{
  position: relative !important;
  display: block !important;
  width: 100% !important;
  min-height: 200vh !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow: visible !important;
  z-index: 1 !important;
}

.ma-hero__stage{
  position: sticky !important;
  top: var(--ma-header-h) !important;
  left: 0 !important;
  width: 100% !important;
  height: calc(100vh - var(--ma-header-h)) !important;
  min-height: 0 !important;
  overflow: hidden !important;
  margin: 0 !important;
  padding: 0 !important;
  background: transparent !important;
  isolation: isolate !important;
}

.ma-hero__content{
  position: absolute !important;
  inset: 0 auto 0 0 !important;
  width: calc(100% - var(--ma-hero-media-w)) !important;
  height: 100% !important;
  z-index: 1 !important;
  display: flex !important;
  align-items: flex-end !important;
  justify-content: flex-start !important;
  box-sizing: border-box !important;
  padding: clamp(75px, 4vw, 150px) !important;
  margin: 0 !important;
  pointer-events: none !important;
}

.ma-hero__media{
  position: absolute !important;
  inset: 0 0 0 auto !important;
  width: var(--ma-hero-media-w) !important;
  height: 100% !important;
  min-height: 0 !important;
  z-index: 2 !important;
  overflow: hidden !important;
  margin: 0 !important;
  padding: 0 !important;
  background: transparent !important;
}

/* wrappers Elementor */
.ma-hero > .e-con-inner,
.ma-hero__stage > .e-con-inner,
.ma-hero__content > .e-con-inner,
.ma-hero__media > .e-con-inner{
  display: contents !important;
}

/* carousel plein format */
.ma-hero__media > .elementor-widget,
.ma-hero__media > .elementor-widget-image-carousel,
.ma-hero__media > .elementor-widget-image-carousel > .elementor-widget-container{
  width: 100% !important;
  max-width: none !important;
  height: 100% !important;
  min-height: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
}

.ma-hero__media :is(
  .elementor-image-carousel-wrapper,
  .swiper,
  .elementor-image-carousel,
  .swiper-wrapper,
  .swiper-slide,
  .swiper-slide-inner,
  figure
){
  width: 100% !important;
  height: 100% !important;
  min-height: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
}

.ma-hero__media .swiper-slide{
  display: flex !important;
  align-items: stretch !important;
}

.ma-hero__media :is(img, .swiper-slide-image){
  display: block !important;
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  object-position: center center !important;
}

.ma-hero__content .elementor-heading-title{
  position: relative !important;
  z-index: 1 !important;
  margin: 0 !important;
}

.ma-hero + .ma-section,
.ma-after-hero{
  position: relative !important;
  z-index: var(--z-content) !important;
}

/* =========================================================
   MOBILE / TABLET
   ========================================================= */

@media (max-width: 1024px){
  .ma-hero{
    min-height: 0 !important;
  }

  .ma-hero__stage{
    position: relative !important;
    top: auto !important;
    height: auto !important;
  }

  .ma-hero__content,
  .ma-hero__media{
    position: relative !important;
    inset: auto !important;
    width: 100% !important;
    height: auto !important;
  }

  .ma-hero__content{
    padding: 24px !important;
    pointer-events: auto !important;
  }

  .ma-hero__media{
    aspect-ratio: 16 / 9 !important;
  }
}

/* =========================================================
   THEME INVERSE — HEADER BLEU / FOOTER NOIR
   ========================================================= */

.elementor-location-header,
.ma-header{
  background: transparent !important;
}

.elementor-location-header :is(
/*  a,*/
  .elementor-item,
  .elementor-item-active,
  .elementor-sub-item,

  .elementor-icon-list-text,
  .elementor-heading-title,
  .elementor-icon,
  .elementor-icon svg,
  .elementor-widget-text-editor,
  .elementor-widget-text-editor p,
  .elementor-widget-text-editor span
),
.ma-header :is(
/*  a,*/
  .elementor-item,
  .elementor-item-active,
  .elementor-sub-item,

  .elementor-icon-list-text,
  .elementor-heading-title,
  .elementor-icon,
  .elementor-icon svg
){
  color: var(--color-accent);
  fill: var(--color-accent);
}
.elementor-location-header :is(
  a,
    .elementor-button,
    .elementor-button-text,
    .elementor-button-icon,
    .elementor-button-active

),
.ma-header :is(
  a,
    .elementor-button,
    .elementor-button-text,
    .elementor-button-icon,
    .elementor-button-active

){
  color: var(--color-text-dark);
  fill: var(--color-accent);
}

.elementor-location-header :is(a:hover, .elementor-item:hover, .elementor-sub-item:hover),
.ma-header :is(a:hover, .elementor-item:hover, .elementor-sub-item:hover){
  opacity: 1;
}

.elementor-sticky--effects .ma-header--glass{
  background: rgba(255,255,255,.78) !important;
}

footer.elementor-location-footer,
footer.elementor-location-footer > div,
footer.elementor-location-footer .elementor-section,
footer.elementor-location-footer .elementor-container,
footer.elementor-location-footer .e-con,
footer.elementor-location-footer .e-con-inner,
footer.elementor-location-footer .elementor-widget,
footer.elementor-location-footer .elementor-widget-container{
  background: #000000 !important;
  background-color: #000000 !important;
  color: #FFFFFF !important;
}

footer.elementor-location-footer :is(
  h1,h2,h3,h4,h5,h6,
  p,li,span,strong,em,
  a,
  .elementor-heading-title,
  .elementor-icon-list-text,
  .elementor-button-text,
  .elementor-widget-text-editor,
  .elementor-widget-text-editor p,
  .elementor-widget-text-editor span,
  .elementor-item,
  .elementor-sub-item,
  .elementor-icon,
  .elementor-icon svg
){
  color: #FFFFFF !important;
  fill: #FFFFFF !important;
}

footer.elementor-location-footer a:hover{
  opacity: .82;
}
/* =========================================================
   BOUTON HEADER — style par défaut, modifiable dans Elementor
   Ajouter la classe :  ma-btn-theme
   ========================================================= */

/* liens menu normaux */
.elementor-location-header .elementor-item,
.elementor-location-header .elementor-item:link,
.elementor-location-header .elementor-item:visited{
  color: var(--color-accent);
}

/* bouton header par défaut */
.elementor-location-header .ma-btn-theme .elementor-button{
  background-color: var(--ma-btn-bg, var(--color-accent));
  border: 1px solid var(--ma-btn-border, var(--color-accent));
  color: var(--ma-btn-color, #FFFFFF);
  transition:
    background-color var(--dur-base) ease,
    border-color var(--dur-base) ease,
    color var(--dur-base) ease,
    opacity var(--dur-base) ease;
}

/* texte + icône héritent du bouton */
.elementor-location-header .ma-btn-theme .elementor-button .elementor-button-text,
.elementor-location-header .ma-btn-theme .elementor-button .elementor-button-icon,
.elementor-location-header .ma-btn-theme .elementor-button .elementor-button-icon svg{
  color: inherit;
  fill: currentColor;
}

/* hover par défaut */
.elementor-location-header .ma-btn-theme .elementor-button:hover,
.elementor-location-header .ma-btn-theme .elementor-button:focus{
  background-color: var(--ma-btn-bg-hover, #000000);
  border-color: var(--ma-btn-border-hover, #000000);
  color: var(--ma-btn-color-hover, #FFFFFF);
  opacity: 1;
}