/* ============================= CSS CORRIGÉ – Hero net + Header visible en mobile Basé sur ton style.css (Kelly template) ============================= */

/* ---------- Header ---------- / #header { background: #e9e8e6; box-shadow: 0px 0px 25px 0 rgba(0, 0, 0, 0.08); position: fixed; / FIX PRINCIPAL / top: 0; left: 0; width: 100%; z-index: 1000; / AU-DESSUS DU HERO */ padding: 15px 0; }
#header {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  z-index: 2000; /* plus haut que hero + menu */
}
/* Décalage du contenu à cause du header fixe */ #main { margin-top: 80px; }

@media (max-width: 992px) { #main { margin-top: 70px; } }

/* ---------- Hero ---------- / #hero { width: 100%; height: 100vh; background: url("../img/hero-bg.jpg") top right no-repeat; background-size: cover; position: relative; padding-top: 80px; / empêche le header de recouvrir */ }

/* SUPPRESSION DE L'OVERLAY FLOU EN MOBILE / @media (max-width: 992px) { #hero:before { display: none; / FIX FLOU */ } }

/* Désactiver background fixed sur mobile (performance + netteté) */ @media (max-width: 1024px) { #hero { background-attachment: scroll; } }

/* ---------- Texte Hero ---------- */ #hero h1 { margin: 0; font-size: 48px; font-weight: 900; line-height: 56px; color: #ffffff; }

#hero h2 { color: #ffffff; margin: 10px 0 0 0; font-size: 22px; }

@media (max-width: 992px) { #hero h1 { font-size: 28px; line-height: 36px; }

#hero h2 { font-size: 18px; line-height: 24px; } }

/* ---------- Navigation mobile ---------- / .navbar-mobile { position: fixed; top: 0; right: 0; left: 0; bottom: 0; background: rgba(9, 9, 9, 0.9); z-index: 1100; / au-dessus du header */ }

/* ---------- Sécurité anti-recouvrement ---------- */ body { overflow-x: hidden; }
#header {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  z-index: 2000;
}

#hero {
  position: relative;
  z-index: 1;
}

@media (max-width: 991px) {
  #hero {
    height: auto;
    min-height: 100svh;
    padding-top: 120px;
    padding-bottom: 60px;
  }
}
/* MOBILE & TABLET HEADER FIX */
@media (max-width: 991px) {

  #header {
    height: 60px;
  }

  #header .logo img {
    max-height: 30px;
  }

  .header-social-links {
    display: none;
  }

  .mobile-nav-toggle {
    font-size: 28px;
    line-height: 1;
  }

  #navbar ul {
    padding-top: 20px;
  }
}
/* INDEX EN – hide hamburger on desktop */
@media (min-width: 992px) {
  body.index-en .mobile-nav-toggle {
    display: none;
  }
  @media (min-width: 992px) {
  body.index-fr .mobile-nav-toggle {
    display: none;
  }
@media (min-width: 992px) {
  body.index-th .mobile-nav-toggle {
    display: none;
  }

}

/* MOBILE & TABLET HEADER FIX */
@media (max-width: 991px) {

  #header {
    height: 60px;
  }

  #header .logo img {
    max-height: 40px;
  }

  .header-social-links {
    display: none;
  }

  .mobile-nav-toggle {
    font-size: 28px;
    line-height: 1;
  }

  #navbar ul {
    padding-top: 20px;
  }
}
/* ================================
   HEADER – HARMONISATION LANGUES
   FR / EN / TH
================================ */

/* DESKTOP */
@media (min-width: 992px) {

  /* Hamburger caché */
  body.lang-fr .mobile-nav-toggle,
  body.lang-en .mobile-nav-toggle,
  body.lang-th .mobile-nav-toggle {
    display: none;
  }

  /* Menu horizontal visible */
  body.lang-fr #navbar ul,
  body.lang-en #navbar ul,
  body.lang-th #navbar ul {
    display: flex !important;
    position: static;
    background: none;
  }

}

/* MOBILE + TABLETTE */
@media (max-width: 991px) {

  /* Hamburger visible */
  body.lang-fr .mobile-nav-toggle,
  body.lang-en .mobile-nav-toggle,
  body.lang-th .mobile-nav-toggle {
    display: block;
  }

  /* Menu caché par défaut (JS gère l’ouverture) */
  body.lang-fr #navbar ul,
  body.lang-en #navbar ul,
  body.lang-th #navbar ul {
    display: none;
  }

}

/* ============================= FIN DES CORRECTIONS ============================= */