/* Immobascule — chrome partagé : réplique EXACTE de l'en-tête du calculateur sur les pages de contenu. */

/* === Palette exacte du calculateur (clair) === */
:root{
  --c-f4f2ec-bg:#F4F2EC; --c-1b1a17-fg:#1B1A17; --c-a39e92-fg:#A39E92; --c-6b6862-fg:#6B6862;
  --c-eae6dc-bg:#EAE6DC; --c-fff-bg:#fff; --c-e5e1d8-bd:#E5E1D8; --c-fbfaf7-bg:#FBFAF7;
  --c-e2ddd2-bd:#E2DDD2; --c-2f6f5e-fg:#2F6F5E; --c-2f6f5e-bg:#2F6F5E; --c-f4f1ea-bg:#F4F1EA;
  --c-736e63-fg:#736E63; --c-b07a3c-fg:#B07A3C;
  --seg-bg:#fff; --seg-fg:#1B1A17; --seg-off:#8A867C; --seg-sh:0 1px 2px rgba(0,0,0,0.08);
  --logo-tile:#1B1A17; --logo-immo:#1B1A17; --logo-bascule:#2F6F5E;
  /* alias sémantiques pour le corps des pages (s'adaptent au thème) */
  --bg:var(--c-f4f2ec-bg); --card:var(--c-fff-bg); --soft:var(--c-fbfaf7-bg); --beige:var(--c-f4f1ea-bg);
  --ink:var(--c-1b1a17-fg); --muted:var(--c-6b6862-fg); --faint:var(--c-a39e92-fg); --line:var(--c-e5e1d8-bd);
  --green:var(--c-2f6f5e-fg); --green-d:var(--c-2f6f5e-fg); --gold:var(--c-b07a3c-fg);
}
html[data-theme="dark"]{ color-scheme:dark;
  --c-f4f2ec-bg:#15140f; --c-1b1a17-fg:#f1efe9; --c-a39e92-fg:#8f8b81; --c-6b6862-fg:#b7b2a7;
  --c-eae6dc-bg:#2b2820; --c-fff-bg:#211f19; --c-e5e1d8-bd:#37342b; --c-fbfaf7-bg:#262319;
  --c-e2ddd2-bd:#37342b; --c-2f6f5e-fg:#3a8b74; --c-2f6f5e-bg:#2f6f5e; --c-f4f1ea-bg:#16150f;
  --c-736e63-fg:#b7b2a7; --c-b07a3c-fg:#c79456;
  --seg-bg:#3a382f; --seg-fg:#f1efe9; --seg-off:#8f8b81; --seg-sh:0 1px 2px rgba(0,0,0,0.45);
  --logo-tile:#2A2926; --logo-immo:#F4F2EC; --logo-bascule:#5FB89A; --green-d:#7fd2b9;
}
html,body{background:var(--c-f4f2ec-bg);}
/* logo adaptatif (les SVG des pages de contenu utilisent des couleurs littérales) */
html[data-theme="dark"] header.site svg [stroke="#1B1A17"]{stroke:#f1efe9;}
html[data-theme="dark"] header.site svg rect[fill="#1B1A17"]{fill:#2A2926;}
html[data-theme="dark"] header.site svg [fill="#1B1A17"]{fill:#F4F2EC;}
html[data-theme="dark"] header.site svg [fill="#2F6F5E"]{fill:#5FB89A;}

/* === En-tête IDENTIQUE au calculateur === */
header.site{position:sticky;top:0;z-index:50;background:var(--c-f4f2ec-bg);padding:0;border-bottom:1px solid transparent;transition:box-shadow .25s ease,border-color .25s ease;}
header.site > .wrap{max-width:1280px;margin:0 auto;padding:18px 24px;display:flex;align-items:center;justify-content:space-between;gap:16px;transition:padding .25s ease;}
html[data-scrolled="1"] header.site{box-shadow:0 6px 20px rgba(0,0,0,0.06);border-bottom-color:var(--c-e5e1d8-bd);}
html[data-scrolled="1"] header.site > .wrap{padding-top:9px;padding-bottom:9px;}
header.site svg[aria-label="immobascule"]{height:130px;width:auto;display:block;transition:height .28s cubic-bezier(.4,0,.2,1);}
html[data-scrolled="1"] header.site svg[aria-label="immobascule"]{height:48px;}

/* contrôles (FR/EN, zoom, thème) — styles exacts de l'app */
.sc-controls{display:flex;align-items:center;gap:12px;flex:none;}
.sc-seg{display:flex;gap:3px;background:var(--c-eae6dc-bg);border-radius:9px;padding:3px;flex:none;}
.sc-seg button{font-family:'Spline Sans',sans-serif;font-size:13px;font-weight:600;border:none;border-radius:7px;padding:6px 13px;cursor:pointer;background:transparent;color:var(--seg-off);line-height:1;}
.sc-seg button.on{background:var(--seg-bg);color:var(--seg-fg);box-shadow:var(--seg-sh);}
.sc-zoom button{font-size:16px;line-height:1;padding:4px 11px;}
.sc-theme{display:inline-flex;align-items:center;justify-content:center;width:36px;height:36px;border:1px solid var(--c-e5e1d8-bd);border-radius:9px;background:var(--c-fbfaf7-bg);color:var(--c-6b6862-fg);cursor:pointer;flex:none;transition:border-color .15s;}
.sc-theme:hover,.sc-zoom button:hover{border-color:#2F6F5E;}
.sc-theme .moon{display:none;}
html[data-theme="dark"] .sc-theme .sun{display:none;}
html[data-theme="dark"] .sc-theme .moon{display:inline;}

/* === Navigation (Outils / Guides) — intégrée à l'en-tête collant === */
nav.sitenav{border-top:1px solid var(--c-e5e1d8-bd);border-bottom:1px solid var(--c-e5e1d8-bd);background:var(--c-fbfaf7-bg);}
html[data-scrolled="1"] nav.sitenav > div{padding-top:6px;padding-bottom:6px;}
nav.sitenav > div{max-width:1280px;margin:0 auto;padding:8px 24px;display:flex;align-items:center;gap:7px 10px;flex-wrap:wrap;font-family:'Spline Sans',sans-serif;line-height:normal;}
nav.sitenav .lbl{font-size:10px;letter-spacing:.1em;text-transform:uppercase;color:var(--c-a39e92-fg);font-weight:700;}
nav.sitenav .sep{width:1px;height:16px;background:var(--c-e5e1d8-bd);display:inline-block;margin:0 4px;}
nav.sitenav a.tool{font-size:12.5px;font-weight:600;text-decoration:none;color:var(--c-2f6f5e-fg);background:var(--c-f4f1ea-bg);border:1px solid var(--c-e2ddd2-bd);border-radius:999px;padding:5px 12px;}
nav.sitenav a.tool.on{color:#fff;background:var(--c-2f6f5e-bg);border-color:var(--c-2f6f5e-bg);}
nav.sitenav a.guide{font-size:12.5px;font-weight:600;text-decoration:none;color:var(--c-6b6862-fg);padding:5px 3px;}
nav.sitenav a.guide.on{color:var(--c-2f6f5e-fg);border-bottom:2px solid var(--c-2f6f5e-fg);}

/* masque l'ancienne nav statique avant l'injection */
header.site + nav:not(.sitenav){display:none;}

@media (max-width:720px){
  .sc-zoom{display:none;}
  header.site svg[aria-label="immobascule"]{height:40px!important;}
  html[data-scrolled="1"] header.site svg[aria-label="immobascule"]{height:34px!important;}
  header.site > .wrap{flex-wrap:wrap;gap:10px;}
}
