/* Static pages — Maison Plus Libre */

body.mpl-is-static-page {
  background: #f3f0e8;
  color: #14362e;
}

.mpl-static-page {
  --page-signal: #efa952;
  --page-signal-soft: rgba(239,169,82,.12);
  background: #f3f0e8;
}
.mpl-static-page--heat { --page-signal:#c8795d; --page-signal-soft:rgba(200,121,93,.12); }
.mpl-static-page--energy { --page-signal:#d4b94c; --page-signal-soft:rgba(212,185,76,.13); }
.mpl-static-page--water { --page-signal:#69b4c3; --page-signal-soft:rgba(105,180,195,.13); }
.mpl-static-page--living { --page-signal:#7f9d72; --page-signal-soft:rgba(127,157,114,.13); }

.mpl-static-hero {
  position: relative;
  overflow: hidden;
  padding: clamp(72px,8vw,126px) 0 clamp(64px,7vw,105px);
  border-bottom: 1px solid rgba(20,54,46,.12);
  background:
    radial-gradient(circle at 76% 18%, var(--page-signal-soft), transparent 24%),
    #f3f0e8;
}

.mpl-static-hero::before {
  content:"";
  position:absolute;
  width:520px;
  height:520px;
  left:-280px;
  top:-245px;
  border:1px solid rgba(20,54,46,.07);
  border-radius:50%;
  box-shadow:0 0 0 70px rgba(20,54,46,.016),0 0 0 140px rgba(20,54,46,.01);
}

.mpl-static-hero__grid {
  position:relative;
  display:grid;
  grid-template-columns:minmax(0,1.05fr) minmax(420px,.75fr);
  gap:clamp(60px,8vw,130px);
  align-items:center;
}

.mpl-static-kicker {
  display:flex;
  align-items:center;
  gap:12px;
  margin:0 0 24px;
  color:#53645e;
  font-size:.72rem;
  font-weight:850;
  letter-spacing:.13em;
  text-transform:uppercase;
}
.mpl-static-kicker span { width:30px; height:2px; background:var(--page-signal); }

.mpl-static-hero h1 {
  max-width:900px;
  margin:0;
  color:#14362e;
  font-size:clamp(3.35rem,6.5vw,7rem);
  font-weight:770;
  line-height:.91;
  letter-spacing:-.07em;
}

.mpl-static-hero__lead {
  max-width:760px;
  margin:30px 0 0;
  color:#65736e;
  font-family:ui-serif,Georgia,Cambria,"Times New Roman",serif;
  font-size:clamp(1.35rem,2.25vw,2.05rem);
  line-height:1.35;
  letter-spacing:-.025em;
}

.mpl-static-hero__trust {
  display:flex;
  flex-wrap:wrap;
  gap:12px 24px;
  margin-top:38px;
  color:#76817d;
  font-size:.66rem;
  font-weight:850;
  letter-spacing:.08em;
  text-transform:uppercase;
}
.mpl-static-hero__trust span { position:relative; padding-left:13px; }
.mpl-static-hero__trust span::before { content:""; position:absolute; left:0; top:.45em; width:5px; height:5px; border-radius:50%; background:var(--page-signal); }

.mpl-static-system {
  min-height:450px;
  display:grid;
  align-content:center;
  padding:34px;
  color:#fff;
  background:
    linear-gradient(rgba(255,255,255,.028) 1px,transparent 1px),
    linear-gradient(90deg,rgba(255,255,255,.028) 1px,transparent 1px),
    #0d2d27;
  background-size:42px 42px;
  border-radius:4px 38px 4px 4px;
  box-shadow:0 28px 75px rgba(20,54,46,.15);
}
.mpl-static-system__house svg { width:100%; height:auto; overflow:visible; }
.mpl-static-system svg .house,.mpl-static-system svg .soft,.mpl-static-system svg .flow,.mpl-static-system svg .plus { fill:none; stroke-linecap:round; stroke-linejoin:round; }
.mpl-static-system svg .house { stroke:rgba(255,255,255,.72); stroke-width:3; }
.mpl-static-system svg .soft { stroke:rgba(255,255,255,.14); stroke-width:1.5; }
.mpl-static-system svg .flow { stroke-width:3.5; stroke-dasharray:8 11; }
.mpl-static-system svg .heat { stroke:#c8795d; color:#c8795d; }
.mpl-static-system svg .energy { stroke:#d4b94c; color:#d4b94c; }
.mpl-static-system svg .water { stroke:#69b4c3; color:#69b4c3; }
.mpl-static-system svg .living { stroke:#7f9d72; color:#7f9d72; }
.mpl-static-system svg .center { fill:rgba(255,255,255,.035); stroke:rgba(255,255,255,.18); }
.mpl-static-system svg .plus { stroke:#fff; stroke-width:3; }
.mpl-static-system__legend { display:grid; grid-template-columns:repeat(4,1fr); gap:8px; margin-top:20px; padding-top:17px; border-top:1px solid rgba(255,255,255,.12); }
.mpl-static-system__legend span { font-size:.64rem; font-weight:850; text-transform:uppercase; letter-spacing:.07em; }
.mpl-static-system__legend .heat { color:#e09b83; }
.mpl-static-system__legend .energy { color:#e4d071; }
.mpl-static-system__legend .water { color:#8ed1dd; }
.mpl-static-system__legend .living { color:#9eba94; }
.mpl-static-system > small { display:block; margin-top:14px; color:rgba(255,255,255,.46); font-size:.65rem; line-height:1.45; }

.mpl-static-flowbar { display:grid; grid-template-columns:repeat(4,1fr); height:4px; }
.mpl-static-flowbar i:nth-child(1){background:#c8795d}.mpl-static-flowbar i:nth-child(2){background:#d4b94c}.mpl-static-flowbar i:nth-child(3){background:#69b4c3}.mpl-static-flowbar i:nth-child(4){background:#7f9d72}

/* The strategy is visible on pillar pages: problem → action → guide → comparison. */
.mpl-pillar-map {
  padding:32px 0 34px;
  border-bottom:1px solid rgba(20,54,46,.12);
  background:#faf8f1;
}
.mpl-pillar-map .mpl-shell {
  display:grid;
  grid-template-columns:minmax(190px,.65fr) minmax(0,2.1fr);
  gap:28px 52px;
  align-items:start;
}
.mpl-pillar-map__intro span {
  display:block;
  margin-bottom:8px;
  color:#89948f;
  font-size:.62rem;
  font-weight:850;
  letter-spacing:.11em;
  text-transform:uppercase;
}
.mpl-pillar-map__intro strong {
  display:block;
  max-width:300px;
  color:#14362e;
  font-family:ui-serif,Georgia,Cambria,"Times New Roman",serif;
  font-size:1.28rem;
  font-weight:400;
  line-height:1.25;
}
.mpl-pillar-map__steps {
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:0;
  margin:0;
  padding:0;
  list-style:none;
  border-top:1px solid rgba(20,54,46,.14);
}
.mpl-pillar-map__steps li {
  position:relative;
  min-height:92px;
  padding:15px 18px 12px 0;
  border-right:1px solid rgba(20,54,46,.11);
}
.mpl-pillar-map__steps li:not(:first-child) { padding-left:18px; }
.mpl-pillar-map__steps li::before {
  content:"";
  position:absolute;
  top:-4px;
  left:0;
  width:8px;
  height:8px;
  border-radius:50%;
  background:var(--page-signal);
}
.mpl-pillar-map__steps li:not(:first-child)::before { left:18px; }
.mpl-pillar-map__steps b {
  display:block;
  margin-bottom:10px;
  color:#98a19d;
  font-size:.6rem;
  letter-spacing:.09em;
}
.mpl-pillar-map__steps span {
  color:#183a32;
  font-size:.8rem;
  font-weight:760;
  line-height:1.35;
}
.mpl-pillar-map__nav {
  grid-column:2;
  display:flex;
  flex-wrap:wrap;
  gap:8px;
}
.mpl-pillar-map__nav a {
  display:inline-flex;
  align-items:center;
  min-height:38px;
  padding:0 14px;
  border:1px solid rgba(20,54,46,.12);
  border-radius:999px;
  color:#50625c;
  background:#fff;
  font-size:.72rem;
  font-weight:780;
  text-decoration:none;
  transition:transform .18s ease,border-color .18s ease,background .18s ease;
}
.mpl-pillar-map__nav a:hover { transform:translateY(-1px); border-color:rgba(20,54,46,.28); }
.mpl-pillar-map__nav a.is-active { color:#14362e; border-color:var(--page-signal); background:var(--page-signal-soft); }

.mpl-static-layout {
  display:grid;
  grid-template-columns:260px minmax(0,780px);
  justify-content:center;
  gap:clamp(55px,8vw,115px);
  padding-top:clamp(72px,8vw,120px);
  padding-bottom:clamp(84px,9vw,140px);
}

.mpl-static-aside {
  position:sticky;
  top:120px;
  align-self:start;
  padding:22px 0 22px 22px;
  border-left:2px solid var(--page-signal);
}
.mpl-static-aside span { display:block; margin-bottom:12px; color:#89948f; font-size:.61rem; font-weight:850; letter-spacing:.11em; text-transform:uppercase; }
.mpl-static-aside strong { display:block; font-family:ui-serif,Georgia,Cambria,"Times New Roman",serif; font-size:1.55rem; font-weight:400; line-height:1.13; }
.mpl-static-aside p { margin:15px 0 0; color:#697772; font-size:.78rem; line-height:1.55; }

.mpl-static-content { color:#263f37; }
.mpl-static-content > p:first-child { margin-top:0; color:#14362e; font-family:ui-serif,Georgia,Cambria,"Times New Roman",serif; font-size:clamp(1.45rem,2.4vw,2rem); line-height:1.42; }
.mpl-static-content p,.mpl-static-content li { font-size:1.04rem; line-height:1.78; }
.mpl-static-content p { margin:0 0 1.5em; }
.mpl-static-content h2 { margin:2.1em 0 .7em; color:#14362e; font-size:clamp(2.15rem,4vw,3.75rem); line-height:1; letter-spacing:-.055em; }
.mpl-static-content h3 { margin:1.8em 0 .65em; color:#173f35; font-family:ui-serif,Georgia,Cambria,"Times New Roman",serif; font-size:clamp(1.55rem,2.8vw,2.35rem); font-weight:400; line-height:1.12; letter-spacing:-.035em; }
.mpl-static-content ul,.mpl-static-content ol { margin:0 0 1.8em; padding-left:1.3em; }
.mpl-static-content li { margin:.55em 0; }
.mpl-static-content strong { color:#14362e; }
.mpl-static-content blockquote { margin:2.2em 0; padding:24px 0 24px 26px; border-left:3px solid var(--page-signal); color:#14362e; font-family:ui-serif,Georgia,Cambria,"Times New Roman",serif; font-size:1.45rem; line-height:1.45; }
.mpl-static-content hr { margin:3.2em 0; border:0; border-top:1px solid rgba(20,54,46,.13); }
.mpl-static-content table { width:100%; margin:2em 0; border-collapse:collapse; font-size:.9rem; }
.mpl-static-content th,.mpl-static-content td { padding:14px 12px; border-bottom:1px solid rgba(20,54,46,.13); text-align:left; vertical-align:top; }
.mpl-static-content th { color:#14362e; font-size:.72rem; letter-spacing:.06em; text-transform:uppercase; }
.mpl-static-content a { color:#173f35; text-decoration-thickness:1px; text-underline-offset:3px; }

.mpl-static-next { padding:58px 0; color:#fff; background:#0d2d27; }
.mpl-static-next__inner { display:flex; justify-content:space-between; align-items:center; gap:45px; }
.mpl-static-next__inner div { max-width:760px; }
.mpl-static-next span { display:block; margin-bottom:10px; color:rgba(255,255,255,.43); font-size:.62rem; font-weight:850; letter-spacing:.11em; text-transform:uppercase; }
.mpl-static-next strong { display:block; font-family:ui-serif,Georgia,Cambria,"Times New Roman",serif; font-size:clamp(1.45rem,2.5vw,2.15rem); font-weight:400; line-height:1.25; }
.mpl-static-next a { display:inline-flex; align-items:center; gap:25px; flex:0 0 auto; min-height:50px; padding:0 20px; border:1px solid rgba(255,255,255,.2); border-radius:999px; color:#fff; font-size:.78rem; font-weight:850; text-decoration:none; }

@media (max-width:980px) {
  .mpl-static-hero__grid { grid-template-columns:1fr; }
  .mpl-static-system { min-height:390px; }
  .mpl-pillar-map .mpl-shell { grid-template-columns:1fr; }
  .mpl-pillar-map__nav { grid-column:1; }
  .mpl-static-layout { grid-template-columns:1fr; max-width:850px; }
  .mpl-static-aside { position:static; max-width:520px; }
}

@media (max-width:680px) {
  .mpl-static-hero { padding-top:56px; padding-bottom:58px; }
  .mpl-static-hero__grid { gap:46px; }
  .mpl-static-hero h1 { font-size:clamp(3rem,14vw,4.5rem); }
  .mpl-static-system { min-height:0; padding:22px; border-radius:3px 28px 3px 3px; }
  .mpl-static-system__legend { grid-template-columns:repeat(2,1fr); }
  .mpl-pillar-map { padding:28px 0; }
  .mpl-pillar-map__steps { grid-template-columns:1fr 1fr; }
  .mpl-pillar-map__steps li:nth-child(2n) { border-right:0; }
  .mpl-pillar-map__steps li:nth-child(n+3) { border-top:1px solid rgba(20,54,46,.1); }
  .mpl-static-layout { padding-top:62px; padding-bottom:78px; gap:42px; }
  .mpl-static-content p,.mpl-static-content li { font-size:1rem; }
  .mpl-static-next__inner { display:grid; }
  .mpl-static-next a { justify-self:start; }
}

@media (prefers-reduced-motion:reduce) {
  .mpl-pillar-map__nav a { transition:none; }
}
