/*
  En-tête et pied de page de la refonte (2026-09) pour les pages secondaires
  (layout refonte-page.njk, balisage dans partials/site-header.njk et site-footer.njk).
  Valeurs reprises telles quelles de src/assets/refonte/home.css, qui garde sa propre
  copie pour l'accueil : toute retouche de l'en-tête se reporte dans les deux fichiers
  (et dans themes.css pour les pages /podcasts/).
*/
@font-face{font-family:"Poppins";font-weight:400;font-display:swap;src:url(/assets/refonte/fonts/Poppins-Regular.woff2) format("woff2")}
@font-face{font-family:"Poppins";font-weight:500;font-display:swap;src:url(/assets/refonte/fonts/Poppins-Medium.woff2) format("woff2")}
@font-face{font-family:"Poppins";font-weight:600;font-display:swap;src:url(/assets/refonte/fonts/Poppins-SemiBold.woff2) format("woff2")}
@font-face{font-family:"Poppins";font-weight:700;font-display:swap;src:url(/assets/refonte/fonts/Poppins-Bold.woff2) format("woff2")}
@font-face{font-family:"Poppins";font-weight:800;font-display:swap;src:url(/assets/refonte/fonts/Poppins-ExtraBold.woff2) format("woff2")}

:root{
  --night:#05054F; --night-2:#07103B; --night-3:#0B1247;
  --red:#D53515; --gold:#FFB400;
  --ease-out:cubic-bezier(.22,1,.36,1);
  --hdr:68px;
}
html{scroll-padding-top:var(--hdr)}

/* ---------- Bouton pilule (refonte) ---------- */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;border:0;border-radius:999px;
  font-family:"Poppins",sans-serif;font-weight:600;text-decoration:none;cursor:pointer;
  transition:transform .2s var(--ease-out),background-color .2s,border-color .2s}
.btn:active{transform:scale(.97)}
.btn-red{background:var(--red);color:#fff}
.btn-sm{min-height:48px;padding:0 22px;font-size:17px}

/* ---------- En-tête ---------- */
.hdr{position:fixed;inset:0 0 auto 0;height:var(--hdr);z-index:50;display:flex;align-items:center;
  padding:0 clamp(16px,4vw,48px);gap:36px;color:#fff;font-family:"Poppins",sans-serif;
  background:var(--night);border-bottom:1px solid rgba(255,255,255,.1)}
.hdr .logo{display:inline-flex;align-items:center;min-height:44px}
.hdr .logo img{display:block;height:30px;width:auto}
.hdr nav{display:flex;gap:30px;margin-left:auto}
.hdr nav a{white-space:nowrap;text-decoration:none;font-size:16px;font-weight:500;color:rgba(255,255,255,.82);padding:10px 0;border-bottom:2px solid transparent;transition:color .2s,border-color .2s}
.hdr nav a:hover,.hdr nav a[aria-current="page"]{color:#fff;border-bottom-color:var(--red)}
.hdr :focus-visible,footer :focus-visible{outline:3px solid var(--gold);outline-offset:3px;border-radius:6px}

/* ---------- Pied de page ---------- */
footer{padding:64px 0 64px;color:rgba(255,255,255,.72);font-family:"Poppins",sans-serif;font-size:16px;line-height:1.6;background:var(--night-2)}
footer .wrap{max-width:1240px;margin:0 auto;padding:0 clamp(16px,4vw,48px);display:flex;flex-wrap:wrap;gap:24px;justify-content:space-between;align-items:center}
footer nav{display:flex;gap:26px;flex-wrap:wrap}
footer a{text-decoration:none;color:rgba(255,255,255,.85);min-height:44px;display:inline-flex;align-items:center}
footer a:hover,footer a[aria-current="page"]{color:#fff}
footer a[aria-current="page"]{text-decoration:underline;text-decoration-color:var(--red);text-decoration-thickness:2px;text-underline-offset:6px}
footer .logo img{display:block;height:26px;width:auto;margin-bottom:10px}

@media (max-width:1024px){
  :root{--hdr:60px}
  .hdr nav{display:none}
  .hdr .btn-sm{margin-left:auto;height:44px}
  .hdr .logo img{height:26px}
}
@media (max-width:760px){
  footer nav{gap:4px 22px}
}