/*
Theme Name:   EDNC Child
Theme URI:    https://ednc.fr
Description:  Thème enfant de Hello Elementor pour EDNC — Organisme de formation petite enfance certifié Qualiopi, Aix-en-Provence.
Author:       EDNC
Author URI:   https://ednc.fr
Template:     hello-elementor
Version:      1.0.0
License:      GNU General Public License v2 or later
License URI:  http://www.gnu.org/licenses/gpl-2.0.html
Text Domain:  ednc-child
Tags:         child-theme, elementor, formation, petite-enfance, qualiopi
*/

/* ══════════════════════════════════════════════════
   RESET & VARIABLES GLOBALES EDNC
══════════════════════════════════════════════════ */
:root {
  --ednc-purple:       #6b3aa8;
  --ednc-purple-dark:  #4a2578;
  --ednc-purple-mid:   #7c45bc;
  --ednc-purple-light: #8c5ec8;
  --ednc-purple-xlight:#e8ddf5;
  --ednc-orange:       #F7941D;
  --ednc-orange-dark:  #e07f10;
  --ednc-orange-light: #fef4e8;
  --ednc-white:        #ffffff;
  --ednc-off-white:    #f0ebfa;
  --ednc-gray-light:   #ebe4f5;
  --ednc-gray-text:    #666666;
  --ednc-border:       #cfc5e8;
  --ednc-text:         #2d2d2d;
  --ednc-radius:       18px;
  --ednc-shadow:       0 8px 40px rgba(107,58,168,.13);
  --ednc-shadow-card:  0 4px 24px rgba(107,58,168,.09);
  --ednc-nav-h:        68px;
}

/* Supprimer les marges Hello Elementor par défaut */
body.hello-elementor {
  margin: 0;
  padding: 0;
  overflow-x: hidden;
}

/* Masquer header/footer Hello Elementor natifs (on utilise les nôtres) */
.site-header,
.site-footer,
.elementor-section-wrap > .elementor-section:first-child .elementor-widget-wp-widget-nav_menu {
  display: none !important;
}

/* Layout principal : header sticky + contenu + footer */
#ednc-site-wrapper {
  display: flex;
  flex-direction: column;
  min-height: 100vh;
}

#ednc-main-content {
  flex: 1;
}

/* Poppins globale */
body,
h1, h2, h3, h4, h5, h6,
p, a, button, input, select, textarea {
  font-family: 'Poppins', sans-serif;
}

/* Scroll reveal animation globale */
.reveal {
  opacity: 0;
  transform: translateY(30px);
  transition: opacity .65s ease, transform .65s ease;
}
.reveal.visible {
  opacity: 1;
  transform: translateY(0);
}

/* ══════════════════════════════════════════════════
   CORRECTIF H2 — override Hello Elementor / WP
   (les pages EDNC utilisent h2 avec em en orange)
══════════════════════════════════════════════════ */

/* Reset complet des h2 sur toutes les pages EDNC */
#ednc-main-content h2 {
  font-family: 'Poppins', sans-serif !important;
  font-size: clamp(1.3rem, 2.4vw, 1.9rem) !important;
  font-weight: 800 !important;
  color: #4a2578 !important;
  line-height: 1.28 !important;
  margin-bottom: 14px !important;
  text-transform: none !important;
  letter-spacing: normal !important;
}

/* em dans h2 = orange (ex: "Former celles et ceux...") */
#ednc-main-content h2 em,
#ednc-main-content h2 span {
  font-style: normal !important;
  color: #F7941D !important;
  font-weight: 800 !important;
}

/* h1 */
#ednc-main-content h1 {
  font-family: 'Poppins', sans-serif !important;
  font-weight: 800 !important;
  line-height: 1.22 !important;
  text-transform: none !important;
  letter-spacing: normal !important;
}

/* h1 em / span dans les heroes (texte orange) */
#ednc-main-content h1 em,
#ednc-main-content .hero h1 em,
#ednc-main-content .hero h1 span {
  font-style: normal !important;
  color: #F7941D !important;
}

/* h3 */
#ednc-main-content h3 {
  font-family: 'Poppins', sans-serif !important;
  font-weight: 800 !important;
  line-height: 1.3 !important;
  text-transform: none !important;
}

/* ══════════════════════════════════════════════════
   CORRECTIF MEGA MENU — position:fixed + z-index
   Le mega est en position:fixed pour sortir de tout
   stacking context créé par sticky/blur parent.
══════════════════════════════════════════════════ */

/* ─── Z-INDEX HIÉRARCHIE ───────────────────────
   nav-wrap  : 99997
   backdrop  : 99998  (couvre le contenu de la page)
   mega/drop : 99999  (au-dessus de TOUT — WP, Elementor, plugins)
──────────────────────────────────────────────── */

#mega-backdrop {
  /* Backdrop complètement désactivé — évite le fond sombre
     qui se superposait au mega panel */
  display: none !important;
}

.mega {
  position: fixed !important;
  z-index: 99999 !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
  filter: none !important;
  isolation: isolate !important;
}

.dropdown {
  z-index: 99999 !important;
  backdrop-filter: none !important;
  filter: none !important;
}

.nav-wrap {
  z-index: 99997 !important;
}

/* Forcer les couleurs texte dans les dropdowns
   (Hello Elementor hérite color:white sur les <a> dans contexte sombre) */
.dropdown-link,
.dropdown-link .dl-text {
  color: #2d2d2d !important;
}
.dropdown-link:hover,
.dropdown-link:hover .dl-text {
  color: #4a2578 !important;
}

/* Contenu interne mega : jamais flouté */
.mega-inner, .mega-cols, .mega-col,
.mega-link, .mega-cta-card, .mega-footer {
  backdrop-filter: none !important;
  filter: none !important;
}

/* Forcer couleurs des liens dans le mega
   (override Hello Elementor qui hérite color:white des <a> en contexte nav sombre) */
.mega-link .ml-title {
  color: #4a2578 !important;
}
.mega-link:hover .ml-title {
  color: #F7941D !important;
}
.mega-link .ml-desc {
  color: #666666 !important;
}
.mega-col-title {
  color: #4a2578 !important;
}
.mega-col-sub {
  color: #666666 !important;
}
.mega-footer-left {
  color: #666666 !important;
}
.mega-footer-link {
  color: #6b3aa8 !important;
}



/* ══════════════════════════════════════════════════
   CORRECTIF MOBILE DRAWER — couleurs forcées
   (Hello Elementor hérite color:white sur les <a>)
══════════════════════════════════════════════════ */
.mobile-drawer {
  background: #ffffff !important;
  color: #2d2d2d !important;
}
.mobile-drawer a,
.mobile-drawer .mob-link,
.mobile-drawer .mob-direct-link {
  color: #2d2d2d !important;
}
.mobile-drawer .mob-section-title {
  color: #4a2578 !important;
}
.mobile-drawer .mob-sublabel {
  color: #6b3aa8 !important;
}
.mobile-drawer .mob-cta {
  color: #ffffff !important;
  background: #F7941D !important;
}
.mobile-drawer .mob-cta-secondary {
  color: #6b3aa8 !important;
}

/* ══════════════════════════════════════════════════
   CORRECTIF LAPTOP — nav compacte selon la largeur
══════════════════════════════════════════════════ */

/* Le CTA ne doit JAMAIS être coupé */
.nav-wrap .nav-cta-wrap {
  flex-shrink: 0 !important;
  margin-left: 8px !important;
}
.nav-wrap .nav-cta {
  white-space: nowrap !important;
}

@media (max-width: 1350px) {
  .nav-wrap .nav { padding: 0 24px !important; }
  .nav-wrap .nav-logo { margin-right: 14px !important; }
  .nav-wrap .nav-link { padding: 0 9px !important; font-size: .77rem !important; }
  .nav-wrap .nav-cta { padding: 8px 16px !important; font-size: .77rem !important; }
}

@media (max-width: 1200px) {
  .nav-wrap .nav-link { padding: 0 7px !important; font-size: .74rem !important; }
  .nav-wrap .nav-logo { margin-right: 8px !important; }
  .nav-wrap .nav-cta { padding: 7px 13px !important; font-size: .74rem !important; }
}

@media (max-width: 1100px) {
  .nav-wrap .nav { padding: 0 14px !important; }
  .nav-wrap .nav-logo img { height: 28px !important; }
  .nav-wrap .nav-logo { margin-right: 6px !important; }
  .nav-wrap .nav-link { padding: 0 6px !important; font-size: .71rem !important; }
  .nav-wrap .nav-cta { padding: 7px 11px !important; font-size: .71rem !important; }
}



/* ══════════════════════════════════════════════════
   SVG ICONS — styles globaux
   Les SVG inline héritent de color: currentColor
══════════════════════════════════════════════════ */
svg[aria-hidden="true"] {
  display: inline-block;
  vertical-align: middle;
  flex-shrink: 0;
}

/* Dans les boutons et liens : couleur héritée */
.btn svg,
.nav-link svg,
.mob-link svg,
.mob-section-title svg,
.mob-direct-link svg,
.dropdown-link svg,
.mega-link svg,
.mega-footer-link svg {
  color: inherit;
}

/* Dans la topbar : blanc */
.topbar-item svg,
.topbar-link svg {
  color: rgba(255,255,255,0.7);
}

/* Dans le footer : couleur héritée (orange ou blanc) */
.footer-contacts svg,
.footer-socials svg {
  color: inherit;
}

/* Icones dans les cartes de sections : couleur du parent */
.mvv-card-icon svg,
.eng-card svg,
.pq-card svg,
.sol-icon svg,
.ci-icon svg,
.access-icon-wrap svg {
  color: var(--ednc-purple, #6b3aa8);
}

/* Icones orange */
.section-label svg,
.hero-badge svg,
.stat-item svg {
  color: var(--ednc-orange, #F7941D);
}

/* Boutons primaires */
.btn-primary svg,
.nav-cta svg,
.mob-cta svg {
  color: #ffffff;
}

/* Dropdown links */
.dl-icon {
  display: flex;
  align-items: center;
  justify-content: center;
}
.dl-icon svg {
  color: #6b3aa8;
}

/* Mobile drawer icons */
.mob-icon svg {
  color: #6b3aa8;
}


/* ══════════════════════════════════════════════════
   TAILLE DE POLICE — augmentée de ~1.5px sur desktop
   Base navigateur = 16px → on passe à 17.5px
   Tout le texte en rem monte proportionnellement
   Sur mobile on revient à 16px (défaut)
══════════════════════════════════════════════════ */
html {
  font-size: 17.5px;
}
@media (max-width: 960px) {
  html {
    font-size: 16px;
  }
}
@media (max-width: 640px) {
  html {
    font-size: 15.5px;
  }
}

/* ═══════════════════════
   SÉCURITÉ ANTI-DÉBORDEMENT
═══════════════════════ */
img, video, iframe, embed, object {
  max-width: 100%;
}
* { max-width: 100%; box-sizing: border-box; }
/* Exception pour les éléments qui doivent rester larges */
.mega, .mobile-drawer, .hero { max-width: none; }