/* ==========================================================================
   ECI — Compatibilité Elementor
   Neutralise les quelques règles d'Elementor qui modifieraient le design ECI.
   Chargée après la feuille d'Elementor, uniquement si Elementor est actif.
   ========================================================================== */

/* Elementor retire le soulignement des liens : on rétablit la charte ECI */
.elementor a{text-decoration:underline;text-underline-offset:3px;text-decoration-thickness:1px;text-decoration-color:var(--orange)}
.elementor a:hover{color:var(--orange-700)}
.elementor a.card,.elementor .btn,.elementor .crumb a,.elementor .lb-close,
.elementor .utility a,.elementor .nav a,.elementor footer.site a{text-decoration:none}
.elementor .sec--navy a,.elementor .hero a,.elementor .page-head a,.elementor .cta-band a{color:#fff}
.elementor .sec--navy .btn-main,.elementor .hero .btn-main,.elementor .page-head .btn-main,.elementor .cta-band .btn-main{color:#fff}
.elementor .btn-ghost{color:var(--navy)}
.elementor .hero .btn-ghost,.elementor .page-head .btn-ghost,.elementor .sec--navy .btn-ghost,.elementor .cta-band .btn-ghost{color:#fff}
.elementor .hero .btn-ghost:hover,.elementor .page-head .btn-ghost:hover,.elementor .sec--navy .btn-ghost:hover,.elementor .cta-band .btn-ghost:hover{color:var(--navy)}
.elementor .btn-ghost:hover{color:#fff}
.elementor .btn-main:hover{color:#fff}
.elementor a.card:hover{color:inherit}
.elementor .dl a{color:var(--navy)}

/* Conteneurs Elementor neutres : aucun espace ajouté autour des sections ECI */
.e-con{--container-default-padding-top:0px;--container-default-padding-right:0px;--container-default-padding-bottom:0px;--container-default-padding-left:0px}
.elementor-widget:not(:last-child){--kit-widget-spacing:0px}
.e-con>.elementor-widget-html,.e-con-inner>.elementor-widget-html{width:100%;max-width:100%}
.elementor-widget-html .elementor-widget-container>section:first-child{margin-top:0}

/* Éditeur Elementor : les blocs ne doivent pas rester invisibles (animation d'apparition) */
.elementor-editor-active .reveal,.elementor-editor-preview .reveal{opacity:1;transform:none}

/* ==========================================================================
   Pont pour les pages construites en widgets Elementor natifs (v4.3)
   Les classes de mise en page ECI portées par des conteneurs .e-con doivent
   reprendre le comportement d'origine, malgré les styles par défaut d'Elementor.
   ========================================================================== */

/* Grilles ECI sur conteneurs Elementor */
.e-con.hero-grid, .e-con.split, .e-con.split--wide,
.e-con.grid, .e-con.g2, .e-con.g3, .e-con.g4 { display:grid }
.e-con.split, .e-con.split--wide { align-items:center }
.e-con.split--wide { align-items:start }
.e-con.hero-grid { gap:clamp(1.6rem,4vw,3rem) }
.e-con.split, .e-con.split--wide { gap:clamp(1.5rem,4vw,3rem) }
.e-con.grid { gap:1.25rem }
.e-con.g2, .e-con.g3, .e-con.g4 { gap:1.25rem }

/* Titre de section (filet orange) en conteneur */
.e-con.tl { display:flex; gap:.85rem; align-items:flex-start; margin-bottom:1.6rem }

/* La coquille garde sa largeur maximale et son centrage */
.e-con.shell { max-width:var(--shell); margin-inline:auto; padding-inline:var(--gut); width:100% }

/* Cartes, piliers : padding et fond rétablis (Elementor met le padding à 0) */
.e-con.card { background:#fff; border:1px solid var(--line); border-radius:6px; padding:1.4rem 1.35rem }
.e-con.card--edge { border-top:3px solid var(--orange) }
.e-con.pillar { border:1px solid var(--line); border-radius:6px; background:#fff; padding:1.5rem 1.4rem }
.e-con.hero-media { border:1px solid rgba(255,255,255,.22); border-radius:6px; overflow:hidden; background:rgba(255,255,255,.05); box-shadow:0 30px 70px rgba(0,0,0,.35) }
.sec--navy .e-con.card { background:rgba(255,255,255,.055); border-color:rgba(255,255,255,.2) }
a.e-con.card:hover { border-color:var(--navy); transform:translateY(-3px) }

/* Couleurs des titres (widget Titre) : bleu nuit par défaut, blanc sur fonds sombres */
.elementor-heading-title { color:var(--navy) }
.sec--navy .elementor-heading-title, .hero .elementor-heading-title,
.page-head .elementor-heading-title, .cta-band .elementor-heading-title { color:#fff }

/* Le widget Titre ne doit pas ajouter de marge ni de taille propre : on garde
   les styles ECI des balises h1..h4 (déjà appliqués par la feuille du site). */
.elementor-widget-heading .elementor-heading-title { line-height:1.18 }

/* Les widgets Texte reprennent l'espacement des paragraphes ECI */
.elementor-widget-text-editor { color:inherit }
.e-con > .elementor-widget, .e-con-inner > .elementor-widget { max-width:100% }

/* claim (surtitre orange avec filet) rendu par un widget texte */
.elementor-widget.claim .elementor-widget-container { display:inline }

/* La photo héro et les cartes gardent leur ratio/limite */
.e-con.hero-media img { width:100%; display:block; aspect-ratio:4/3.4; object-fit:cover }

/* --- Images natives Elementor (v4.4) : cadres photo, légendes, zoom --- */
.e-con.fig { margin:0; border:1px solid var(--line); background:#fff; border-radius:6px; overflow:hidden; position:relative; box-shadow:0 14px 36px rgba(0,8,31,.07); display:block }
.e-con.fig img, .e-con.hero-media img { width:100%; height:auto; display:block; max-width:100% }
.e-con.fig .elementor-widget-image, .e-con.hero-media .elementor-widget-image { text-align:left; width:100% }
.e-con.fig--tall img { aspect-ratio:3/4; object-fit:cover }
.e-con.fig--wide img { aspect-ratio:16/9; object-fit:cover }
.e-con.fig--portrait img { aspect-ratio:1/1; object-fit:cover; object-position:center 45% }
.split .e-con.fig img { max-height:560px; object-fit:cover; object-position:center 30% }
.e-con.fig figcaption { font-size:.8rem; color:var(--ink-soft); padding:.6rem .85rem; border-top:1px solid var(--line); background:#fff; display:block }
.e-con.media-frame { position:relative }
.eci-zoom img { cursor:zoom-in; transition:transform .6s ease }
.e-con.fig:hover .eci-zoom img { transform:scale(1.025) }
.e-con.fig:has(.eci-zoom)::after { content:"\2922"; position:absolute; top:.7rem; right:.7rem; width:34px; height:34px; border-radius:50%; display:flex; align-items:center; justify-content:center; font-size:1rem; color:var(--navy); background:rgba(255,255,255,.92); box-shadow:0 4px 14px rgba(0,8,31,.18); opacity:0; transition:opacity .25s ease; pointer-events:none; z-index:2 }
.e-con.fig:hover::after { opacity:1 }
.elementor-widget-image img { border-radius:0; box-shadow:none }

/* --- Sections ECI portées par des conteneurs Elementor (v4.4.1) ---
   Elementor force un padding et une marge logiques à 0 sur chaque .e-con, ce qui
   écrase les règles physiques de la feuille du site (chargée avant). On les
   réaffirme ici avec une spécificité supérieure, à l'identique du site HTML. */
.e-con.sec { padding:var(--sec-y) 0; position:relative }
.e-con.sec--alt { background:var(--paper-2); border-block:1px solid var(--line) }
.e-con.sec--navy { background:var(--navy-bg); color:#D4DDEF; position:relative; overflow:hidden }
.e-con.hero { background:var(--navy-bg); color:#fff; position:relative; overflow:hidden; padding:clamp(2.6rem,5vw,4.2rem) 0 clamp(5rem,8vw,6.6rem) }
.e-con.page-head { background:var(--navy-bg); color:#fff; position:relative; overflow:hidden; padding:clamp(2.2rem,4.5vw,3.2rem) 0 }
.e-con.cta-band { background:var(--navy-deep); color:#C8D3E8; position:relative; overflow:hidden; padding:clamp(2.2rem,4vw,3rem) 0 }
.e-con.cta-band > .e-con.shell { display:flex; flex-direction:row; align-items:center; justify-content:space-between; gap:1.6rem; flex-wrap:wrap; position:relative }
.e-con.keyfigs { position:relative; z-index:3; margin-top:-58px }
@media (max-width:560px) { .e-con.keyfigs { margin-top:-36px } }
/* Le filet et la grille des titres, les colonnes : direction ligne malgré la colonne par défaut d'Elementor */
.e-con.tl { flex-direction:row }

/* --- Pseudo-éléments ECI sur conteneurs Elementor (v4.4.1) ---
   Elementor réserve ::before des conteneurs à son calque de fond (content:var(--background-overlay),
   position absolue), ce qui supprime le filet orange des titres et le motif nid d'abeille des
   sections sombres. On les rétablit avec une spécificité supérieure et tous les réglages explicites. */
.e-con.tl::before {
  content:""; display:block; position:static; inset:auto; top:auto; right:auto; bottom:auto; left:auto;
  flex:none; width:4px; height:auto; align-self:stretch; margin:.28rem 0 0; padding:0;
  background:var(--orange); opacity:1; mix-blend-mode:normal; border-radius:0; transition:none; z-index:auto;
}
.e-con.hero::before, .e-con.page-head::before, .e-con.sec--navy::before, .e-con.cta-band::before {
  content:""; display:block; position:absolute; inset:-140px; top:-140px; right:-140px; bottom:-140px; left:-140px;
  width:auto; height:auto; background-color:transparent; background-image:var(--hex-dark); background-size:1200px 900px;
  background-repeat:repeat; opacity:1; mix-blend-mode:normal; border-radius:0; transition:none; pointer-events:none; z-index:auto;
}
.e-con.cta-band::before { opacity:.9 }
/* La lueur orange du héro et l'angle décoratif des cadres photo (::after) */
.e-con.hero::after {
  content:""; display:block; position:absolute; right:-90px; top:-70px; left:auto; bottom:auto; width:420px; height:420px;
  background:radial-gradient(circle at 60% 40%,rgba(254,98,13,.28),transparent 62%); pointer-events:none; opacity:1; z-index:auto;
}
.e-con.media-frame::after {
  content:""; display:block; position:absolute; inset:auto -14px -14px auto; top:auto; left:auto; right:-14px; bottom:-14px;
  width:78px; height:78px; border:2px solid var(--orange); background:none; z-index:-1; opacity:1;
}
@media (max-width:1040px) { .e-con.media-frame::after { display:none } }
@media (max-width:760px) { .e-con.hero::before, .e-con.page-head::before, .e-con.sec--navy::before, .e-con.cta-band::before { background-size:820px 615px } }
/* Le contenu des sections sombres passe au-dessus du motif */
.e-con.hero > .e-con.shell, .e-con.page-head > .e-con.shell { position:relative; z-index:1 }
.e-con.sec--navy > .e-con.shell, .e-con.cta-band > .e-con.shell { position:relative }

/* Bande d'appel à l'action : texte à gauche, boutons à droite (Elementor impose width:100 % aux enfants,
   ce qui les empile ; on rend leur largeur automatique comme dans le site HTML). */
.e-con.cta-band > .e-con.shell > .e-con { --width:auto; width:auto; flex:1 1 auto; min-width:0 }
.e-con.cta-band > .e-con.shell > .elementor-widget { --container-widget-width:auto; width:auto; max-width:100%; flex:0 0 auto }
.e-con.cta-band > .e-con.shell > .elementor-widget .btns { margin:0 }