@charset "utf-8";
/* ===================================================== */
/* HEADER-SOMBRE.CSS — menu adapté aux pages à fond       */
/* sombre (À propos, Contact, Témoignages) : bandeau vert */
/* sombre translucide et texte blanc, comme sur les       */
/* sections sombres de l'accueil.                         */
/* scripts/header-sombre.js pose la classe                */
/* « header-sombre » sur <html> tant qu'une partie sombre */
/* est sous le menu ; sur une partie claire (formulaire   */
/* « Laisser un témoignage », pied de page), le menu      */
/* reprend son aspect clair habituel.                     */
/* Chargé APRÈS style-header-divise.css et                */
/* style-menu-portefolio-mobile.css.                      */
/* ===================================================== */

/* Transitions douces entre les deux aspects */
#header-desktop,
#logo-desktop a,
#logo-mobile-v2 a {
    transition: background 0.4s ease, color 0.4s ease;
}
#burger-mobile-v2 span {
    transition: background 0.4s ease, transform 0.3s ease;
}

/* ---------- Ordinateur ---------- */
html.header-sombre #header-desktop {
    background: rgba(31, 43, 38, 0.82);      /* vert sombre du site, translucide */
}
html.header-sombre #header-desktop:hover {
    background: rgba(31, 43, 38, 0.92);
}
html.header-sombre #header-desktop #logo-desktop a,
html.header-sombre #header-desktop #menu-desktop > a,
html.header-sombre #header-desktop #menu-desktop > div > a {
    color: rgba(255, 255, 255, 0.9);
}
html.header-sombre #header-desktop #logo-desktop a:hover,
html.header-sombre #header-desktop #menu-desktop > a:hover,
html.header-sombre #header-desktop #menu-desktop > div > a:hover {
    color: #fff;
    background: rgba(255, 255, 255, 0.1);
}

/* ---------- Mobile / tablette ---------- */
html.header-sombre #header-mobile-v2::before {
    background: rgba(31, 43, 38, 0.82);
}
html.header-sombre #header-mobile-v2:hover::before {
    background: rgba(31, 43, 38, 0.92);
}
html.header-sombre #header-mobile-v2 #logo-mobile-v2 a {
    color: rgba(255, 255, 255, 0.9);
}
html.header-sombre #header-mobile-v2 #burger-mobile-v2 span {
    background: rgba(255, 255, 255, 0.9);
}
