/* ───────────────── Header & nav ───────────────── */
.site-header{
  background:var(--elev);
  padding:1rem 0;
  box-shadow:var(--shadow);
  position:sticky; top:0; z-index:100;
  border-bottom:1px solid var(--muted);
}
.site-header .container{
  display:flex; justify-content:space-between; align-items:center; gap:.75rem;
}
.brand{margin:0; font-size:var(--step-1); letter-spacing:2px}
.brand a{color:var(--text); text-decoration:none; display:inline-block}
.brand a img{vertical-align:middle; margin-right:10px}
.brand a:hover{
  opacity:.9; transform:scale(1.02);
  transition: opacity .4s ease, transform .4s ease, filter .4s ease;
  filter:drop-shadow(0 0 5px var(--brand));
}

/* Desktop nav visible */
.nav{display:flex; gap:1rem}
.nav a{
  color:#f4f4f4; text-decoration:none; padding:.6rem .7rem;
  border-radius:10px; font-weight:500; opacity:.9;
  transition:color .2s ease, opacity .2s ease;
}
.nav a[aria-current="page"], .nav a:hover{color:var(--brand); opacity:1}

/* Hamburger button (hidden desktop) */
.nav-toggle{display:none}

/* ───────────────── Lang switch in hamburger ───────────────── */
.lang-switch{
  display:flex; align-items:center; gap:.5rem;
  margin-left:auto; /* pousse à droite sur desktop */
}

.flag-btn{
  display:inline-flex; align-items:center; gap:.4rem;
  padding:.45rem .6rem; border-radius:10px;
  background:var(--panel); border:1px solid rgba(255,255,255,.12);
  color:var(--muted); font-weight:600; font-size:var(--step--1);
  cursor:pointer; transition:transform .15s ease, border-color .2s ease, color .2s ease, background .2s ease;
}
.flag-btn:hover{ transform:translateY(-1px); border-color:rgba(255,255,255,.25); color:var(--text); }
.flag-btn.active{ background:var(--brand); color:#000; border-color:transparent; }
.flag-btn img{ display:block; border-radius:3px; }

/* dans le menu mobile (popover), on isole la section */
.nav .lang-switch{
  border-top:1px solid rgba(255,255,255,.1);
  margin-top:.6rem; padding-top:.6rem;
  justify-content:flex-start;
}