
/* ==========================================================================
   ERG'OS Prévention — Header global + hero
   Un seul fichier pour tout le site. Modifier ici = effectif sur toutes les pages.
   Préfixe ergh- (header) pour ne pas entrer en conflit avec les anciens blocs hero.
   La police n'est pas déclarée : elle est héritée d'Avada (Serenity).
   Bascule PC / burger : 1024 px  |  Barre fixe PC : après 400 px de scroll (voir .js)
   ========================================================================== */
 
/* ---------- Variables (modifier ici couleurs / hauteurs) ---------- */
:root{
  --ergh-yellow:#F9D240;
  --ergh-green:#7BAD9B;          /* séparateurs du sous-menu, burger */
  --ergh-green-dark:#2F6152;     /* texte du sous-menu, survol */
  --ergh-ink:#14312a;            /* texte menu mobile */
  --ergh-text:#404040;           /* texte menu barre fixe */
  --ergh-bar-h:60px;             /* hauteur bande mobile */
  --ergh-sticky-h:88px;          /* hauteur barre fixe PC */
  --ergh-z:9990;
  --ergh-fade:.3s;               /* durée du fondu de la barre fixe */
}
 
html{ scroll-padding-top:calc(var(--ergh-sticky-h) + 16px); }
 
/* ---------- Base commune ---------- */
.ergh-header,.ergh-sticky{ font-family:inherit; }
.ergh-header *,.ergh-sticky *{ box-sizing:border-box; }
.ergh-header ul,.ergh-sticky ul{ list-style:none; margin:0; padding:0; }
.ergh-header a,.ergh-sticky a{ text-decoration:none; }
.ergh-header button{ font-family:inherit; }
.ergh-logo{ display:block; line-height:0; }
.ergh-logo img{ display:block; width:auto; max-width:none; }
 
.ergh-skip{
  position:absolute; left:-9999px; top:0; z-index:calc(var(--ergh-z) + 10);
  background:#fff; color:var(--ergh-ink); padding:12px 18px; font-weight:600; border-radius:0 0 8px 0;
}
.ergh-skip:focus{ left:0; }
 
/* Sentinelle : quand elle sort de l'écran (400 px de scroll), le JS affiche la barre fixe */
.ergh-sentinel{ position:absolute; top:0; left:0; width:1px; height:400px; opacity:0; pointer-events:none; }
 
/* Par défaut (aucun hero détecté) : pas de header superposé, barre blanche fixe */
.ergh-desk,.ergh-bar,.ergh-mnav,.ergh-sticky{ display:none; }
.ergh-chevron{ display:none; }
 
/* ---------- Menu (structure commune) ---------- */
.ergh-nav{ display:flex; align-items:center; justify-content:center; flex-wrap:wrap; }
.ergh-nav__item{ position:relative; }
.ergh-item-row{ display:flex; align-items:center; }
.ergh-nav__link{
  position:relative; display:inline-block; padding:6px 2px; white-space:nowrap;
  font-weight:500; letter-spacing:.3px; transition:color .2s ease;
}
/* Trait jaune : page active en permanence, survol animé */
.ergh-nav__link::after{
  content:''; position:absolute; left:2px; right:2px; bottom:0; height:3px; border-radius:2px;
  background:var(--ergh-yellow); transform:scaleX(0); transform-origin:left; transition:transform .25s ease;
}
.ergh-nav__item.is-current > .ergh-nav__link::after,
.ergh-nav__item.is-current > .ergh-item-row > .ergh-nav__link::after,
.ergh-nav__item.is-ancestor > .ergh-item-row > .ergh-nav__link::after{ transform:scaleX(1); }
 
/* Sous-menu : fond blanc, texte vert, séparateurs VERTS */
.ergh-submenu{ background:#fff; }
.ergh-submenu li{ display:block; }
.ergh-submenu__link{
  display:block; padding:13px 24px; color:var(--ergh-green-dark);
  font-weight:600; font-size:18px; white-space:normal;
  border-bottom:1px solid var(--ergh-green);
}
.ergh-submenu li:last-child .ergh-submenu__link{ border-bottom:0; }
.ergh-submenu__link:hover{ background:rgba(47,97,82,.07); color:#244f42; }
 
/* Focus clavier visible */
.ergh-header a:focus-visible,.ergh-sticky a:focus-visible,
.ergh-burger:focus-visible,.ergh-chevron:focus-visible{ outline:3px solid var(--ergh-green-dark); outline-offset:2px; }
.ergh-desk__nav a:focus-visible{ outline-color:#fff; }
 
@keyframes ergLineDraw{ to{ transform:scaleX(1); } }
@keyframes ergNavFadeDown{
  0%{ opacity:0; transform:translateY(-12px); }
  100%{ opacity:1; transform:translateY(0); }
}
@keyframes ergFadeIn{
  0%{ opacity:0; transform:translateY(16px); }
  100%{ opacity:1; transform:translateY(0); }
}
 
/* ==========================================================================
   PC  (≥ 1025 px)
   ========================================================================== */
@media (min-width:1025px){
  /* Pages sans hero : la barre fixe occupe le haut de page */
  body{ padding-top:var(--ergh-sticky-h); }
  body:has(.ergos-hero-wrap){ padding-top:0; }
 
  .ergh-header{ position:absolute; top:0; left:0; right:0; z-index:var(--ergh-z); }
 
  /* Header superposé : uniquement si la page contient un hero */
  body:has(.ergos-hero-wrap) .ergh-desk{
    display:flex; flex-direction:column; align-items:center; padding:56px 3% 24px;
  }
  /* Une fois la barre fixe affichée, on retire le header du haut (hors écran) de la navigation clavier */
  body.ergh-is-stuck:has(.ergos-hero-wrap) .ergh-desk{ visibility:hidden; }
 
  .ergh-logo--desk img{ height:52px; }
  .ergh-line{
    width:min(560px,62%); height:2px; background:#fff; margin:16px 0;
    transform:scaleX(0); transform-origin:center; animation:ergLineDraw .9s ease-out .3s forwards;
  }
 
  .ergh-desk__nav .ergh-nav{ gap:8px clamp(18px,2.2vw,32px); }
  .ergh-desk__nav .ergh-nav__link{
    color:#fff; font-size:clamp(16px,1.7vw,25px); text-shadow:0 1px 3px rgba(0,0,0,.5);
  }
  .ergh-desk__nav .ergh-nav__link:hover{ color:var(--ergh-yellow); }
 
  /* Menu en cascade : Accueil uniquement (classe body.home ajoutée par WordPress) */
  body.home .ergh-desk__nav .ergh-nav > .ergh-nav__item{
    opacity:0; transform:translateY(-12px); animation:ergNavFadeDown .6s ease-out .84s forwards;
  }
  body.home .ergh-desk__nav .ergh-nav > .ergh-nav__item:nth-child(4){ animation-delay:.45s; }
  body.home .ergh-desk__nav .ergh-nav > .ergh-nav__item:nth-child(3),
  body.home .ergh-desk__nav .ergh-nav > .ergh-nav__item:nth-child(5){ animation-delay:.58s; }
  body.home .ergh-desk__nav .ergh-nav > .ergh-nav__item:nth-child(2),
  body.home .ergh-desk__nav .ergh-nav > .ergh-nav__item:nth-child(6){ animation-delay:.71s; }
  body.home .ergh-desk__nav .ergh-nav > .ergh-nav__item:nth-child(1),
  body.home .ergh-desk__nav .ergh-nav > .ergh-nav__item:nth-child(7){ animation-delay:.84s; }
 
  /* Sous-menu en survol / focus clavier */
  .ergh-submenu{
    position:absolute; top:calc(100% + 14px); left:50%; min-width:300px; z-index:2;
    border-radius:10px; box-shadow:0 16px 34px rgba(0,0,0,.22); padding:6px 0;
    opacity:0; visibility:hidden; transform:translateX(-50%) translateY(6px);
    transition:opacity .22s ease, transform .22s ease, visibility .22s ease;
  }
  /* Pont invisible : le survol ne se perd plus en traversant l'espace sous "Nos services" */
  .ergh-submenu::before{ content:''; position:absolute; left:0; right:0; top:-16px; height:16px; }
  .ergh-nav__item.has-sub:hover > .ergh-submenu,
  .ergh-nav__item.has-sub:focus-within > .ergh-submenu{ opacity:1; visibility:visible; transform:translateX(-50%) translateY(0); }
  /* Échap ferme le sous-menu (géré en JS) */
  .ergh-nav__item.has-sub.is-dismissed > .ergh-submenu{ opacity:0; visibility:hidden; }
 
  /* Barre fixe blanche (logo à gauche, menu à droite) */
  .ergh-sticky{
    display:flex; align-items:center; justify-content:space-between; gap:24px;
    position:fixed; top:0; left:0; right:0; height:var(--ergh-sticky-h);
    padding:0 clamp(20px,3vw,48px); background:#fff;
    box-shadow:0 4px 18px rgba(0,0,0,.10); z-index:var(--ergh-z);
    opacity:1; visibility:visible; transition:opacity var(--ergh-fade) ease;
  }
  .ergh-logo--sticky img{ height:44px; }
  .ergh-sticky__nav{ height:100%; }
  .ergh-sticky__nav .ergh-nav{ height:100%; flex-wrap:nowrap; justify-content:flex-end; gap:0 clamp(16px,1.8vw,30px); }
  .ergh-sticky__nav .ergh-nav__item{ display:flex; align-items:center; height:100%; }
  .ergh-sticky__nav .ergh-nav__link{ color:var(--ergh-text); font-size:clamp(15px,1.45vw,19px); }
  .ergh-sticky__nav .ergh-nav__link:hover{ color:var(--ergh-green-dark); }
  .ergh-sticky__nav .ergh-nav__link:hover::after{ transform:scaleX(1); }
  .ergh-sticky__nav .ergh-submenu{ top:100%; border-radius:0 0 10px 10px; }
  .ergh-sticky__nav .ergh-submenu::before{ display:none; }
 
  /* Pages avec hero : barre masquée, puis fondu au-delà de 400 px */
  body:has(.ergos-hero-wrap) .ergh-sticky{
    opacity:0; visibility:hidden; pointer-events:none;
    transition:opacity var(--ergh-fade) ease, visibility 0s linear var(--ergh-fade);
  }
  body.ergh-is-stuck:has(.ergos-hero-wrap) .ergh-sticky{
    opacity:1; visibility:visible; pointer-events:auto;
    transition:opacity var(--ergh-fade) ease, visibility 0s;
  }
 
  /* Barre d'administration WordPress */
  body.admin-bar .ergh-sticky{ top:32px; }
}
 
/* ==========================================================================
   Tablette / mobile  (≤ 1024 px) — bande fixe + burger
   ========================================================================== */
@media (max-width:1024px){
  html{ scroll-padding-top:calc(var(--ergh-bar-h) + 16px); }
  body{ padding-top:var(--ergh-bar-h); }
  body:has(.ergos-hero-wrap){ padding-top:0; }
 
  .ergh-header{ position:fixed; top:0; left:0; right:0; z-index:var(--ergh-z); }
  body.admin-bar .ergh-header{ top:32px; }
 
  .ergh-bar{
    display:flex; align-items:center; justify-content:space-between;
    height:var(--ergh-bar-h); padding:8px 16px; background:#fff; box-shadow:0 2px 10px rgba(0,0,0,.12);
  }
  .ergh-logo--bar img{ height:34px; }
 
  .ergh-burger{
    width:44px; height:44px; padding:0; cursor:pointer;
    display:flex; flex-direction:column; align-items:center; justify-content:center; gap:5px;
    background:var(--ergh-green); border:2px solid var(--ergh-green); border-radius:8px;
  }
  .ergh-burger span{ display:block; width:22px; height:2px; background:var(--ergh-yellow); border-radius:2px; transition:transform .25s ease, opacity .2s ease; }
  .ergh-header.is-open .ergh-burger span:nth-child(1){ transform:translateY(7px) rotate(45deg); }
  .ergh-header.is-open .ergh-burger span:nth-child(2){ opacity:0; }
  .ergh-header.is-open .ergh-burger span:nth-child(3){ transform:translateY(-7px) rotate(-45deg); }
 
  .ergh-mnav{
    display:block; position:absolute; top:100%; left:0; right:0; background:#fff;
    max-height:0; overflow:hidden; visibility:hidden;
    transition:max-height .3s ease, visibility 0s linear .3s; box-shadow:0 12px 20px rgba(0,0,0,.14);
  }
  .ergh-header.is-open .ergh-mnav{
    max-height:calc(100vh - var(--ergh-bar-h)); max-height:calc(100dvh - var(--ergh-bar-h));
    overflow-y:auto; visibility:visible; transition:max-height .3s ease, visibility 0s;
  }
 
  .ergh-mnav .ergh-nav{ display:block; padding:6px 0; }
  .ergh-mnav .ergh-nav__item{ border-bottom:1px solid #eee; }
  .ergh-mnav .ergh-nav__link{ display:block; flex:1; padding:14px 20px; color:var(--ergh-ink); font-size:16px; white-space:normal; }
  .ergh-mnav .ergh-nav__link::after{ display:none; }
  .ergh-mnav .ergh-nav__item.is-current > .ergh-nav__link,
  .ergh-mnav .ergh-nav__item.is-current > .ergh-item-row > .ergh-nav__link,
  .ergh-mnav .ergh-nav__item.is-ancestor > .ergh-item-row > .ergh-nav__link{
    color:var(--ergh-green-dark); font-weight:600; box-shadow:inset 4px 0 0 var(--ergh-yellow);
  }
 
  .ergh-chevron{
    display:flex; align-items:center; justify-content:center; width:44px; height:44px; padding:0;
    background:none; border:0; color:var(--ergh-green-dark); cursor:pointer; transition:transform .25s ease;
  }
  .ergh-nav__item.mobile-open > .ergh-item-row .ergh-chevron{ transform:rotate(180deg); }
 
  .ergh-mnav .ergh-submenu{
    max-height:0; overflow:hidden; visibility:hidden;
    transition:max-height .3s ease, visibility 0s linear .3s;
  }
  .ergh-mnav .ergh-nav__item.mobile-open > .ergh-submenu{ max-height:340px; visibility:visible; transition:max-height .3s ease, visibility 0s; }
  .ergh-mnav .ergh-submenu__link{ padding:12px 20px 12px 34px; font-size:16px; }
}
 
/* ==========================================================================
   HERO (bloc par page : image + titre). Le header n'en fait plus partie.
   Texte centré verticalement sur tous les écrans (PC, tablette, mobile), accueil compris.
   ========================================================================== */
.ergos-hero-wrap{
  position:relative; width:100%; min-height:100vh; display:flex; align-items:center; overflow:hidden;
}
.ergos-hero-wrap .ergos-hero-bg{
  position:absolute; inset:0; width:100%; height:100%; max-width:none; object-fit:cover; object-position:center center; z-index:0;
}
.ergos-hero-overlay{
  position:absolute; inset:0; z-index:1; pointer-events:none;
  background:linear-gradient(180deg, rgba(10,20,20,.5) 0%, rgba(10,20,20,.2) 65%);
}
.ergos-hero-content{
  position:relative; z-index:2; width:100%; padding:0 10%;
}
 
.ergos-hero-title{
  color:#fff !important;
  text-shadow:0 2px 8px rgba(0,0,0,.55), 0 1px 3px rgba(0,0,0,.85);
  opacity:0; animation:ergFadeIn 1.1s ease-out .2s forwards;
}
.ergos-hero-subtitle{
  color:#fff; font-size:clamp(26px,2.5vw,48px); font-weight:400; letter-spacing:.5px; line-height:1.5; margin-top:14px;
  text-shadow:0 2px 6px rgba(0,0,0,.55), 0 1px 2px rgba(0,0,0,.8);
  opacity:0; animation:ergFadeIn 1.1s ease-out .5s forwards;
}
/* Accueil : pas de fondu du titre sur PC (conservé sur mobile/tablette) */
@media (min-width:1025px){
  .ergos-hero-wrap--home .ergos-hero-title,
  .ergos-hero-wrap--home .ergos-hero-subtitle{ opacity:1; animation:none; }
}
@media (max-width:1024px){
  .ergos-hero-content,
  .ergos-hero-wrap--home .ergos-hero-content{ padding:0 6%; }
}
 
/* ---------- Accessibilité : mouvement réduit ---------- */
@media (prefers-reduced-motion:reduce){
  .ergos-hero-title,.ergos-hero-subtitle{ animation:none !important; opacity:1 !important; transform:none !important; }
  .ergh-line{ animation:none !important; transform:none !important; }
  body.home .ergh-desk__nav .ergh-nav > .ergh-nav__item{ animation:none !important; opacity:1 !important; transform:none !important; }
  .ergh-sticky,.ergh-mnav,.ergh-submenu,.ergh-burger span{ transition:none !important; }
}