/* ==========================================================
   CHARTE GRAPHIQUE COMMUNE — V1
   ========================================================== */

:root {
  /* Palette de base */
  --creme: #FBF6F0;
  --brun: #241C17;
  --terracotta: #C1694F;
  --turquoise: #3FA9A4;
  --turquoise-clair: #E4F1F0;
  --ligne: #E7DED3;

  /* Camaïeu pastel turquoise pour les 3 chemins (accueil) */
  --chemin-maieusthesie: #EAF4F2;   /* le plus doux */
  --chemin-ir: #DCEDEA;             /* intermédiaire */
  --chemin-massage: #CFE6E2;        /* le plus soutenu */

  /* Dimensions structurelles, réglées à l'intégration finale */
  --hauteur-header: 84px;
  --hauteur-barre-cta: 88px; /* boutons + ligne "Contact | Arriver | FAQ" + "Mon espace" */
  --hauteur-bandeau-cookies: 40px;

  --rayon-doux: 4px 32px 4px 32px;
}

* { box-sizing: border-box; }
html { scrollbar-gutter: stable; }

body {
  margin: 0;
  font-family: "Work Sans", -apple-system, sans-serif;
  color: var(--brun);
  background: var(--creme);
  line-height: 1.6;
  padding-top: var(--hauteur-header);
}

h1, h2, h3 {
  font-family: "Fraunces", serif;
  font-weight: 500;
  color: var(--brun);
}

a { color: inherit; }

/* ==========================================================
   HEADER — fond turquoise dégradé, flouté, fixe
   ========================================================== */

.site-header {
  position: fixed;
  top: 0; left: 0; right: 0;
  z-index: 50;
  height: var(--hauteur-header);

  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1.5rem;
  padding: 0 clamp(1rem, 3vw, 2.5rem);

  background: linear-gradient(
    120deg,
    rgba(63, 169, 164, 0.88) 0%,
    rgba(63, 169, 164, 0.72) 100%
  );
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);

  box-shadow: 0 2px 12px rgba(36, 28, 23, 0.08);
}

.site-header__identite {
  display: flex;
  align-items: center;
  gap: .75rem;
  min-width: 0;
  text-decoration: none;
}

.site-header__logo {
  flex: 0 0 auto;
  width: calc(var(--hauteur-header) - 4px);
  height: calc(var(--hauteur-header) - 4px);
  display: flex;
  align-items: center;
  justify-content: center;
}
.site-header__logo img {
  width: 92%;
  height: 92%;
  object-fit: contain;
  opacity: 0.98;
}

.site-header__titre {
  display: flex;
  flex-direction: column;
  line-height: 1.25;
  min-width: 0;
}
.site-header__titre .nom {
  font-family: "Fraunces", serif;
  font-size: 1.05rem;
  font-weight: 600;
  color: #FFFFFF;
  white-space: nowrap;
}
.site-header__titre .accroche {
  font-size: .78rem;
  color: rgba(255, 255, 255, 0.9);
  white-space: nowrap;
}

.site-header__menu {
  display: flex;
  align-items: center;
  gap: clamp(.05rem, .6vw, .3rem);
  flex-wrap: nowrap;
}
.site-header__menu a {
  text-decoration: none;
  font-size: clamp(.72rem, .85vw, .92rem);
  padding: .4rem .5rem;
  font-weight: 500;
  color: #FFFFFF;
  border-radius: 999px;
  border: 1px solid transparent;
  transition: background .15s ease, border-color .15s ease;
  white-space: nowrap;
}
.site-header__menu a:hover,
.site-header__menu a:focus-visible {
  text-decoration: underline;
  text-underline-offset: 3px;
}
.site-header__menu a.actif {
  text-decoration: underline;
  text-underline-offset: 3px;
  font-weight: 600;
}

.site-header__contact {
  flex: 0 0 auto;
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  text-align: right;
  text-decoration: none;
  line-height: 1.2;
}
.site-header__contact .adresse {
  font-size: .82rem;
  font-weight: 600;
  color: #FFFFFF;
}
.site-header__contact .horaires {
  font-size: .72rem;
  color: rgba(255, 255, 255, 0.85);
}
.site-header__contact:hover .adresse,
.site-header__contact:focus-visible .adresse {
  text-decoration: underline;
}

.site-header__burger {
  display: none;
  flex: 0 0 auto;
  width: 42px; height: 42px;
  align-items: center;
  justify-content: center;
  background: rgba(255,255,255,.14);
  border: none;
  border-radius: 50%;
  cursor: pointer;
  padding: 0;
}
.site-header__burger svg { width: 26px; height: 26px; }
.burger-trait {
  fill: none;
  stroke: #FFFFFF;
  stroke-width: 2;
  stroke-linecap: round;
  transition: d .25s ease, transform .25s ease;
}
.burger-point {
  fill: #FFFFFF;
  transition: opacity .2s ease;
}
/* Animation : l'amande s'ouvre en croix quand le menu est actif */
.site-header__burger.est-ouvert .burger-trait--haut { transform: translateY(4px) rotate(180deg); transform-origin: 16px 16px; }
.site-header__burger.est-ouvert .burger-trait--bas { transform: translateY(-4px) rotate(180deg); transform-origin: 16px 16px; }
.site-header__burger.est-ouvert .burger-point { opacity: 0; }

@media (max-width: 1000px) {
  .site-header__menu { display: none; }
  .site-header__burger { display: flex; }
}

.menu-mobile {
  position: fixed;
  top: var(--hauteur-header);
  left: 0; right: 0;
  z-index: 49;
  display: flex;
  flex-direction: column;
  background: rgba(36, 28, 23, 0.97);
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
  padding: .5rem 0 1rem;
}
.menu-mobile[hidden] { display: none !important; }
.menu-mobile a {
  color: var(--creme);
  text-decoration: none;
  padding: .85rem 1.5rem;
  font-size: 1rem;
  border-bottom: 1px solid rgba(255,255,255,.08);
}
.menu-mobile a.actif { color: var(--turquoise); font-weight: 600; }
.menu-mobile__contact {
  margin-top: .5rem;
  font-size: .82rem !important;
  color: #C9BFB4 !important;
  border-bottom: none !important;
}

/* ==========================================================
   FILIGRANE ŒIL-LOTUS — arrière-plan discret, toutes pages
   ========================================================== */

.filigrane-oeil-lotus {
  position: fixed;
  top: 5vw;
  right: -10vw;
  width: 46vw;
  max-width: 560px;
  min-width: 280px;
  opacity: .06;
  pointer-events: none;
  z-index: 0;
}
.filigrane-oeil-lotus img { width: 100%; height: auto; display: block; }

/* ==========================================================
   IMAGE HÉRO 16:9
   ========================================================== */

.hero-page {
  position: relative;
  width: 100%;
  aspect-ratio: 16 / 9;
  max-height: 480px;
  overflow: hidden;
  margin-bottom: 2rem;
}
.hero-page img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}
.hero-page::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(180deg, rgba(36,28,23,0) 55%, rgba(36,28,23,.35) 100%);
}

/* ==========================================================
   FOOTER
   ========================================================== */

footer.site-footer {
  position: relative;
  z-index: 1;
  padding: 4.5rem clamp(1rem, 4vw, 3rem) calc(2.5rem + var(--hauteur-barre-cta) + var(--hauteur-bandeau-cookies));
  background: #3A2D25;
  color: var(--creme);
}

.site-footer__grille {
  display: flex;
  flex-wrap: wrap;
  gap: 2rem;
  justify-content: space-between;
  max-width: 1100px;
  margin: 0 auto;
}

.site-footer__bloc h3 {
  color: var(--creme);
  font-size: 1rem;
  margin: 0 0 .8rem;
}

.site-footer__tagline {
  font-size: .84rem;
  color: #C9BFB4;
  margin: 0 0 .35rem;
  line-height: 1.5;
}
.site-footer__adresse {
  display: flex;
  align-items: center;
  gap: .4rem;
  font-size: clamp(.72rem, .85vw, .92rem);
  font-weight: 600;
  margin: .6rem 0 .5rem;
}
.site-footer__adresse a.icone-lien {
  display: inline-flex;
  color: var(--turquoise);
}
.site-footer__adresse a.icone-lien:hover { color: var(--creme); }

.site-footer__telephone {
  font-size: 1.3rem;
  font-weight: 700;
  color: var(--creme);
  text-decoration: none;
  display: inline-block;
  margin: .3rem 0 1rem;
}
.site-footer__telephone:hover { color: var(--turquoise); }

.site-footer__prestations { font-size: .88rem; color: #C9BFB4; line-height: 1.7; }
.site-footer__prestations a {
  color: #C9BFB4;
  text-decoration: none;
}
.site-footer__prestations a:hover,
.site-footer__prestations a:focus-visible {
  text-decoration: underline;
  color: var(--creme);
}

.site-footer__reseaux {
  display: flex;
  gap: .9rem;
  margin-top: 1rem;
}
.site-footer__reseaux a {
  width: 34px; height: 34px;
  display: flex; align-items: center; justify-content: center;
  border-radius: 50%;
  border: 1px solid rgba(255,255,255,.08);
}
.site-footer__reseaux a svg {
  width: 16px; height: 16px;
  fill: #FFFFFF;
  stroke: none;
}
.site-footer__reseaux a:hover { border-color: rgba(255,255,255,.4); }

.site-footer__bas {
  max-width: 1100px;
  margin: 2.5rem auto 0;
  padding-top: 1.2rem;
  border-top: 1px solid rgba(255,255,255,.12);
  display: flex;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: .6rem;
  font-size: .78rem;
  color: #9C9188;
}
.site-footer__bas a { color: #9C9188; text-decoration: none; }
.site-footer__bas a:hover { color: var(--turquoise); }
.site-footer__admin { opacity: .55; font-size: .72rem; }
.site-footer__admin:hover { opacity: 1; }

/* ==========================================================
   BARRE CTA FIXE (bas de fenêtre)
   ========================================================== */

.barre-cta {
  position: fixed;
  left: 0; right: 0;
  bottom: 0; /* élément le plus bas ; le bandeau cookies se place au-dessus via sa propre variable */
  z-index: 45;

  background: linear-gradient(180deg, rgba(36,28,23,.88) 0%, rgba(20,15,11,.92) 100%);
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
  color: var(--creme);
  padding: .7rem 1rem .5rem;
  overflow: hidden; /* pour la barre de progression interne */
}

.barre-cta__progression {
  position: absolute;
  top: 0; left: 0;
  height: 3px;
  width: 0%; /* mis à jour en JS */
  background: var(--turquoise);
  transition: width .1s linear;
}

.barre-cta__boutons {
  display: flex;
  justify-content: center;
  gap: .6rem;
  flex-wrap: wrap;
}
.barre-cta__boutons a {
  display: inline-flex;
  align-items: center;
  gap: .4rem;
  padding: .55rem 1.1rem;
  border-radius: 999px;
  text-decoration: none;
  font-size: .88rem;
  font-weight: 600;
}
.barre-cta__bouton-principal { background: var(--turquoise); color: var(--creme); }
.barre-cta__bouton-secondaire { background: rgba(255,255,255,.08); color: var(--creme); border: 1px solid rgba(255,255,255,.25); }

.barre-cta__liens {
  display: flex;
  justify-content: center;
  gap: 1.4rem;
  margin-top: .5rem;
  font-size: .76rem;
}
.barre-cta__liens a {
  color: #C9BFB4;
  text-decoration: none;
}
.barre-cta__liens a:hover { color: var(--turquoise); }

@media (max-width: 480px) {
  .barre-cta__boutons a span.texte-long { display: none; }
}

/* ==========================================================
   FORMULAIRES — contact & newsletter
   ========================================================== */

.formulaire-carte {
  max-width: 560px;
  margin: 0 auto;
  padding: 1.5rem;
  background: #FFFFFF;
  border: 1px solid var(--ligne);
  border-radius: var(--rayon-doux);
}

.formulaire__ligne {
  display: flex;
  flex-direction: column;
  gap: clamp(.05rem, .6vw, .3rem);
  margin-bottom: 1rem;
}
.formulaire__ligne label {
  font-size: .85rem;
  font-weight: 600;
  color: var(--brun);
}
.formulaire__ligne input,
.formulaire__ligne textarea {
  font-family: inherit;
  font-size: .95rem;
  padding: .6rem .8rem;
  border: 1px solid var(--ligne);
  border-radius: 8px;
  background: var(--creme);
  color: var(--brun);
}
.formulaire__ligne input:focus,
.formulaire__ligne textarea:focus {
  outline: none;
  border-color: var(--turquoise);
}

.formulaire__piege {
  position: absolute;
  left: -9999px;
  width: 1px;
  height: 1px;
  overflow: hidden;
}

.formulaire__case {
  display: flex;
  align-items: flex-start;
  gap: .5rem;
  font-size: .85rem;
  color: var(--brun);
  margin-bottom: 1.1rem;
  cursor: pointer;
}
.formulaire__case input[type="checkbox"] {
  margin-top: .2rem;
  flex: 0 0 auto;
}

.formulaire__bouton {
  width: 100%;
  padding: .8rem;
  background: var(--turquoise);
  color: var(--creme);
  border: none;
  border-radius: 999px;
  font-size: 1rem;
  font-weight: 600;
  cursor: pointer;
}
.formulaire__bouton:hover { filter: brightness(1.06); }

.formulaire-alerte {
  padding: .8rem 1rem;
  border-radius: 8px;
  font-size: clamp(.72rem, .85vw, .92rem);
  padding: .4rem .5rem;
  margin-bottom: 1rem;
}
.formulaire-alerte--succes {
  background: var(--turquoise-clair);
  color: #1F6E69;
}
.formulaire-alerte--erreur {
  background: #FBEAE5;
  color: #9C3B22;
}

/* Encart newsletter, plus compact que le formulaire de contact */
.newsletter-encart {
  max-width: 480px;
  margin: 0 auto;
  padding: 1.3rem 1.5rem;
  background: var(--turquoise-clair);
  border-radius: var(--rayon-doux);
  text-align: center;
}
.newsletter-encart__titre,
.site-footer__bloc .newsletter-encart__titre {
  margin: 0 0 .5rem;
  font-size: 1rem;
  color: var(--brun);
}
.newsletter-encart__texte {
  font-size: clamp(.72rem, .85vw, .92rem);
  padding: .4rem .5rem;
  margin: 0 0 .9rem;
  color: var(--brun);
}
.newsletter-encart__formulaire {
  display: flex;
  flex-wrap: wrap;
  gap: .5rem;
  justify-content: center;
}
.newsletter-encart__formulaire input[type="email"],
.newsletter-encart__formulaire input[type="text"] {
  flex: 1 1 180px;
  padding: .6rem .9rem;
  border: 1px solid var(--ligne);
  border-radius: 999px;
  font-size: .9rem;
}
.newsletter-encart__formulaire button {
  padding: .6rem 1.3rem;
  background: var(--turquoise);
  color: var(--creme);
  border: none;
  border-radius: 999px;
  font-weight: 600;
  cursor: pointer;
}
.newsletter-encart__consentement {
  display: block;
  margin-top: .7rem;
  font-size: .72rem;
  color: #5A6E6C;
  text-align: left;
}

/* ==========================================================
   AVIS GOOGLE
   ========================================================== */

.avis-google {
  max-width: 720px;
  margin: 0 auto;
  padding: 1.5rem;
}
.avis-google__entete {
  display: flex;
  align-items: center;
  gap: .8rem;
  flex-wrap: wrap;
  margin-bottom: 1.2rem;
}
.avis-google__logo { width: 28px; height: 28px; flex: 0 0 auto; }
.avis-google__note { flex: 1 1 auto; }
.avis-google__note strong { font-size: 1.1rem; display: block; }
.avis-google__note span { font-size: .78rem; color: #6b6058; }
.avis-google__bouton {
  padding: .5rem 1.1rem;
  border: 1px solid var(--turquoise);
  color: var(--turquoise);
  border-radius: 999px;
  text-decoration: none;
  font-size: .85rem;
  font-weight: 600;
}
.avis-google__bouton:hover { background: var(--turquoise); color: #fff; }

.avis-google__carte {
  background: #FFFFFF;
  border: 1px solid var(--ligne);
  border-radius: var(--rayon-doux);
  padding: 1.3rem;
}
.avis-google__auteur { display: flex; align-items: center; gap: .7rem; margin-bottom: .6rem; }
.avis-google__avatar {
  width: 40px; height: 40px;
  border-radius: 50%;
  background: var(--turquoise);
  color: #fff;
  display: flex; align-items: center; justify-content: center;
  font-weight: 700;
  flex: 0 0 auto;
}
.avis-google__nom { margin: 0; font-weight: 600; font-size: .9rem; }
.avis-google__etoiles { margin: 0; color: var(--terracotta); font-size: .85rem; letter-spacing: 1px; }
.avis-google__texte { font-size: clamp(.72rem, .85vw, .92rem);
  padding: .4rem .5rem; color: #3c332c; margin: 0; }

.avis-google__nav { display: flex; justify-content: center; gap: 1rem; margin-top: .8rem; }
.avis-google__nav button {
  width: 34px; height: 34px;
  border-radius: 50%;
  border: 1px solid var(--ligne);
  background: #fff;
  font-size: 1.2rem;
  cursor: pointer;
  color: var(--brun);
}
.avis-google__nav button:hover { border-color: var(--turquoise); color: var(--turquoise); }

/* ==========================================================
   PARTAGE EN 1 CLIC
   ========================================================== */

.partage-1-clic {
  display: flex;
  align-items: center;
  gap: .6rem;
}
.partage-1-clic__label { font-size: .82rem; color: #6b6058; margin-right: .3rem; }
.partage-1-clic__icone {
  width: 36px; height: 36px;
  display: flex; align-items: center; justify-content: center;
  border-radius: 50%;
  border: 1px solid var(--ligne);
  background: #fff;
  cursor: pointer;
  text-decoration: none;
}
.partage-1-clic__icone svg { width: 17px; height: 17px; fill: none; stroke: var(--turquoise); stroke-width: 1.6; }
.partage-1-clic__icone:hover { border-color: var(--turquoise); }

/* ==========================================================
   FAQ EN ACCORDÉON
   ========================================================== */

.faq-accordeon { max-width: 760px; margin: 0 auto; }
.faq-accordeon__item {
  border-bottom: 1px solid var(--ligne);
}
.faq-accordeon__question {
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  background: none;
  border: none;
  padding: 1.1rem 0;
  font-family: "Fraunces", serif;
  font-size: 1.02rem;
  font-weight: 500;
  color: var(--brun);
  text-align: left;
  cursor: pointer;
}
.faq-accordeon__icone {
  flex: 0 0 auto;
  width: 20px; height: 20px;
  position: relative;
}
.faq-accordeon__icone::before, .faq-accordeon__icone::after {
  content: "";
  position: absolute;
  background: var(--turquoise);
  transition: transform .2s ease;
}
.faq-accordeon__icone::before { top: 9px; left: 2px; right: 2px; height: 2px; }
.faq-accordeon__icone::after { left: 9px; top: 2px; bottom: 2px; width: 2px; }
.faq-accordeon__question[aria-expanded="true"] .faq-accordeon__icone::after { transform: scaleY(0); }

.faq-accordeon__reponse {
  display: none;
  padding: 0 0 1.3rem;
  gap: 1rem;
}
.faq-accordeon__reponse.est-ouverte { display: flex; flex-wrap: wrap; }
.faq-accordeon__image {
  width: 84px; height: 84px;
  object-fit: cover;
  border-radius: 10px;
  flex: 0 0 auto;
}
.faq-accordeon__texte { flex: 1 1 260px; font-size: .95rem; color: #3c332c; }
.faq-accordeon__texte a { color: var(--terracotta); }

/* ==========================================================
   ENCART "3 CHEMINS" (Accueil) — camaïeu pastel turquoise
   ========================================================== */

.trois-chemins {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
  gap: 1.2rem;
  max-width: 1000px;
  margin: 0 auto 2.5rem;
}
.trois-chemins__carte {
  padding: 1.6rem;
  border-radius: var(--rayon-doux);
  text-decoration: none;
  color: var(--brun);
  transition: transform .15s ease;
}
.trois-chemins__carte:hover { transform: translateY(-3px); }
.trois-chemins__carte--maieusthesie { background: var(--chemin-maieusthesie); }
.trois-chemins__carte--ir { background: var(--chemin-ir); }
.trois-chemins__carte--massage { background: var(--chemin-massage); }
.trois-chemins__carte h3 { margin: 0 0 .5rem; font-size: 1.1rem; }
.trois-chemins__carte p { margin: 0; font-size: .88rem; color: #3c332c; }

/* Teinte de fond de page assortie, sur les pages dédiées */
body.page-maieusthesie { background: var(--chemin-maieusthesie); }
body.page-intelligence-relationnelle { background: var(--chemin-ir); }
body.page-massage-bien-etre { background: var(--chemin-massage); }

/* Liste des types de massage (FAQ "Quels massages proposez-vous") */
.liste-massages {
  list-style: none;
  margin: 0; padding: 0;
  display: flex;
  flex-direction: column;
  gap: 1rem;
}
.liste-massages li {
  display: flex;
  align-items: center;
  gap: 1rem;
}
.liste-massages img {
  width: 70px; height: 70px;
  border-radius: 10px;
  object-fit: cover;
  flex: 0 0 auto;
  background: var(--turquoise-clair);
}
.liste-massages span { font-size: clamp(.72rem, .85vw, .92rem);
  padding: .4rem .5rem; color: #3c332c; }

/* Image manquante (voir image-fallback.js) — fond dégradé doux,
   le temps que les vrais visuels soient déposés sur le serveur */
.image-manquante {
  background: linear-gradient(135deg, var(--turquoise-clair) 0%, #F3EDE4 100%);
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: inherit;
  max-width: 100%;
}

/* Contenu tiers bloqué avant consentement (Maps, YouTube...) */
.contenu-bloque {
  padding: 2rem 1.5rem;
  background: var(--turquoise-clair);
  border-radius: var(--rayon-doux);
  text-align: center;
}
.contenu-bloque p { font-size: .9rem; color: #3c332c; margin: 0 0 .8rem; }
.contenu-bloque button {
  padding: .6rem 1.2rem;
  background: var(--turquoise);
  color: var(--creme);
  border: none;
  border-radius: 999px;
  font-weight: 600;
  cursor: pointer;
}

.icone-menu-youtube {
  width: 18px;
  height: 13px;
  margin-right: .35rem;
  vertical-align: -2px;
}

/* ==========================================================
   MENU DÉROULANT "RESSOURCES" (desktop)
   ========================================================== */

.site-header__ressources {
  position: relative;
}

.site-header__ressources-bouton {
  display: inline-flex;
  align-items: center;
  gap: .3rem;
  text-decoration: none;
  font-size: clamp(.72rem, .85vw, .92rem);
  font-family: inherit;
  font-weight: 500;
  color: #FFFFFF;
  background: none;
  padding: .4rem .8rem;
  border-radius: 999px;
  border: 1px solid transparent;
  cursor: pointer;
  transition: background .15s ease, border-color .15s ease;
  white-space: nowrap;
}
.site-header__ressources-bouton:hover,
.site-header__ressources-bouton:focus-visible,
.site-header__ressources-bouton.est-ouvert {
  text-decoration: underline;
  text-underline-offset: 3px;
}

.fleche-ressources {
  width: 10px;
  height: 7px;
  flex: 0 0 auto;
  transition: transform .2s ease;
}
.site-header__ressources-bouton.est-ouvert .fleche-ressources {
  transform: rotate(180deg);
}

.site-header__ressources-panneau {
  position: absolute;
  top: calc(100% + .6rem);
  right: 0;
  min-width: 200px;
  z-index: 51;

  display: flex;
  flex-direction: column;
  padding: .4rem;

  background: linear-gradient(120deg, rgba(63, 169, 164, 0.92) 0%, rgba(63, 169, 164, 0.82) 100%);
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
  border-radius: 14px;
  box-shadow: 0 8px 24px rgba(36, 28, 23, 0.25);
}
.site-header__ressources-panneau[hidden] { display: none !important; }

.site-header__ressources-panneau a {
  display: flex;
  align-items: center;
  text-decoration: none;
  font-size: .9rem;
  font-weight: 500;
  color: var(--creme);
  padding: .65rem .9rem;
  border-radius: 8px;
  white-space: nowrap;
  transition: background .15s ease;
}
.site-header__ressources-panneau a:hover,
.site-header__ressources-panneau a:focus-visible {
  text-decoration: underline;
  text-underline-offset: 3px;
}
.site-header__ressources-panneau a.actif {
  text-decoration: underline;
  text-underline-offset: 3px;
  font-weight: 600;
}

/* ==========================================================
   GROUPE "ACCUEIL" — lien direct + flèche ouvrant "Notre histoire"
   ========================================================== */

.site-header__groupe-accueil {
  position: relative;
  display: inline-flex;
  align-items: center;
  gap: 0;
}

.site-header__fleche-seule {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: none;
  border: none;
  padding: .4rem .35rem;
  cursor: pointer;
  color: #FFFFFF;
}
.site-header__fleche-seule .fleche-ressources {
  width: 10px;
  height: 7px;
}
.site-header__fleche-seule.est-ouvert .fleche-ressources {
  transform: rotate(180deg);
}

/* Étiquettes nommantes au survol des icônes réseaux du footer */
.site-footer__reseaux a { position: relative; }
.site-footer__reseaux a::after {
  content: attr(data-label);
  position: absolute;
  bottom: 130%;
  left: 50%;
  transform: translateX(-50%) translateY(4px);
  background: var(--creme);
  color: var(--brun);
  font-size: .7rem;
  font-weight: 600;
  padding: .3rem .65rem;
  border-radius: 999px;
  white-space: nowrap;
  opacity: 0;
  pointer-events: none;
  transition: opacity .15s ease, transform .15s ease;
  box-shadow: 0 2px 8px rgba(0,0,0,.18);
  z-index: 5;
}
.site-footer__reseaux a:hover::after,
.site-footer__reseaux a:focus-visible::after {
  opacity: 1;
  transform: translateX(-50%) translateY(0);
}