/* ============================================================
   MANDAT ÉNERGIE — Shell de navigation V2, version ISOLÉE
   ------------------------------------------------------------
   Ce fichier ne contient QUE le bandeau, le header, le menu
   déroulant et le drawer mobile. Toutes les règles sont scopées
   sous .topbar / header.site / .drawer afin de pouvoir être
   chargées sur une page qui possède déjà son propre thème
   (ex. simulateur_public.html) sans en modifier le rendu.

   NE PAS éditer ici les règles communes : la source de vérité
   reste style.css (bloc « topbar + header »). Ce fichier en est
   une extraction scopée.
   ============================================================ */

/* ---------- variables, portées au shell uniquement ---------- */
.topbar, header.site, .drawer{
  --blue-950:#0b2431; --blue-900:#103449; --blue-800:#144a68; --blue-700:#176e97;
  --blue-600:#1a85b8; --blue-100:#d9eef7; --blue-50:#eef7fb;
  --yellow:#ffe93d; --yellow-ink:#4a3d00;
  --green-500:#80c030;
  --ink:#0f2430; --muted:#4a6675; --line:#d7e6ee;
  --offre-residence:#9c4a2d; --offre-vendeur:#1a85b8;
  --offre-bailleur:#80c030; --offre-immeuble:#946312;
  --amber:#e2a10a;
  --font-display:'Poppins',system-ui,sans-serif;
  --font-sans:'Manrope',system-ui,sans-serif;
  --radius-pill:999px;
  --shadow:0 12px 32px rgba(16,52,73,.14);
  --lift:0 26px 60px rgba(16,52,73,.22);
  --shadow-yellow:0 10px 24px rgba(226,190,10,.45);
  --shadow-header:0 10px 30px rgba(16,52,73,.14);
  --content-max:1200px; --content-pad:24px;
  --ease:cubic-bezier(.22,.61,.36,1);
  --dur-fast:.15s; --dur-hover:.22s;
}

/* ---------- primitives, scopées ---------- */
.topbar *, header.site *, .drawer *{box-sizing:border-box}
header.site .wrap{max-width:var(--content-max);margin:0 auto;padding:0 var(--content-pad)}
.topbar .ico, header.site .ico, .drawer .ico{
  width:1em;height:1em;stroke:currentColor;stroke-width:2.4;fill:none;
  stroke-linecap:round;stroke-linejoin:round;flex:none}
header.site img, .drawer img{display:block}
.topbar a, header.site a, .drawer a{text-decoration:none;transition:color var(--dur-fast) var(--ease)}

header.site .btn, .drawer .btn{
  display:inline-flex;align-items:center;justify-content:center;gap:10px;
  border-radius:var(--radius-pill);font-family:var(--font-sans);font-weight:800;
  white-space:nowrap;cursor:pointer;border:none;padding:15px 28px;font-size:15.5px;
  transition:box-shadow var(--dur-hover) var(--ease),transform var(--dur-fast) var(--ease),
             background var(--dur-hover) var(--ease),color var(--dur-hover) var(--ease)}
header.site .btn:hover, .drawer .btn:hover{transform:translateY(-2px);filter:none}
header.site .btn:active, .drawer .btn:active{transform:translateY(1px)}
header.site .btn-yellow, .drawer .btn-yellow{
  background:var(--yellow);color:var(--yellow-ink);box-shadow:var(--shadow-yellow)}
header.site .btn-ghost, .drawer .btn-ghost{
  background:transparent;color:var(--blue-900);border:2px solid var(--blue-900);box-shadow:none}
header.site .btn-ghost:hover, .drawer .btn-ghost:hover{background:var(--blue-900);color:#fff}

/* ---------- bandeau + header ---------- */
.topbar{background:var(--blue-950);color:#cce8f5;font-size:13px;text-align:center;
  padding:9px 16px;font-family:var(--font-sans);line-height:1.5}
.topbar b{color:var(--yellow)}
.topbar a{color:var(--green-500);font-weight:800;margin-left:6px}

header.site{position:sticky;top:0;z-index:80;background:rgba(238,247,251,.95);
  backdrop-filter:blur(12px);border-bottom:1px solid var(--line);
  transition:box-shadow .3s;font-family:var(--font-sans)}
header.site.scrolled{box-shadow:var(--shadow-header)}
header.site .nav{display:flex;align-items:center;gap:16px;height:86px}
header.site .nav .logo{flex:none;display:flex;align-items:center}
header.site .nav .logo img{height:70px;width:auto;max-width:none;flex:none}

header.site .nav-links{display:flex;gap:2px;margin:0 auto;align-items:center}
header.site .nav-links>div{position:relative}
header.site .nav-links a.top{display:flex;align-items:center;gap:6px;padding:10px 14px;
  border-radius:var(--radius-pill);font-family:var(--font-display);font-weight:600;
  font-size:15px;color:var(--blue-950);white-space:nowrap}
header.site .nav-links a.top .car{width:14px;height:14px;opacity:.55;
  transition:transform var(--dur-hover)}
header.site .nav-links>div:hover>a.top{background:#fff;box-shadow:var(--shadow);color:var(--blue-700)}
header.site .nav-links>div:hover>a.top .car{transform:rotate(180deg)}
/* neutralise le soulignement animé du thème simulateur */
header.site .nav-links>a::after, header.site .nav-links a.top::after{content:none}

header.site .menu{position:absolute;top:calc(100% + 6px);left:50%;
  transform:translate(-50%,10px);min-width:270px;background:#fff;border-radius:18px;
  box-shadow:var(--lift);padding:10px;opacity:0;visibility:hidden;
  transition:.22s var(--ease);border-top:5px solid var(--pc,var(--blue-600))}
header.site .nav-links>div:hover .menu{opacity:1;visibility:visible;transform:translate(-50%,0)}
header.site .menu::before{content:'';position:absolute;top:-14px;left:0;right:0;height:14px}
header.site .menu a{display:block;padding:11px 14px;border-radius:12px;font-size:14.5px;
  font-weight:600;color:var(--ink)}
header.site .menu a:hover{background:var(--blue-50);color:var(--blue-700)}

header.site .nav-cta{display:flex;align-items:center;gap:16px;flex:none}
header.site .nav-cta .link{font-weight:700;font-size:14.5px;color:var(--blue-800);
  display:inline-flex;align-items:center;gap:7px;white-space:nowrap}
header.site .burger{display:none;background:none;border:none;cursor:pointer;
  color:var(--blue-950);padding:8px}
header.site .burger .ico{width:26px;height:26px}
.drawer{display:none}

/* ---------- mobile / tablette ---------- */
@media(max-width:1060px){
  header.site .nav{height:72px}
  header.site .nav .logo img{height:54px}
  header.site .nav-links{display:none}
  header.site .nav-cta .link, header.site .nav-cta .btn{display:none}
  header.site .burger{display:block;margin-left:auto}
  .drawer{display:block;position:fixed;inset:0;z-index:100;pointer-events:none;
    font-family:var(--font-sans)}
  .drawer .backdrop{position:absolute;inset:0;background:rgba(11,36,49,.5);opacity:0;transition:.3s}
  .drawer .panel{position:absolute;top:0;right:0;bottom:0;width:min(340px,88vw);
    background:#fff;box-shadow:var(--lift);transform:translateX(100%);
    transition:.32s var(--ease);padding:22px;overflow-y:auto}
  .drawer.open{pointer-events:auto}
  .drawer.open .backdrop{opacity:1}
  .drawer.open .panel{transform:none}
  .drawer .close{background:none;border:none;cursor:pointer;color:var(--blue-950);
    padding:6px;margin-left:auto;display:block}
  .drawer .close .ico{width:26px;height:26px}
  .drawer .grp{padding:12px 4px;border-bottom:1px solid var(--line)}
  .drawer .grp b{display:flex;align-items:center;gap:10px;
    font-family:var(--font-display);font-size:16px;color:var(--blue-950)}
  .drawer .grp b i{width:9px;height:9px;border-radius:3px;
    background:var(--pc,var(--blue-600));flex:none;font-style:normal}
  .drawer .grp a{display:block;padding:8px 0 8px 20px;font-size:14.5px;
    font-weight:600;color:var(--muted)}
  .drawer .cta{display:grid;gap:10px;margin-top:18px}
}