@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&family=Montserrat:wght@600;700;800&display=swap');

:root{
  --navy:#071d3b; --navy2:#0a2c57; --blue:#1476d6; --blue2:#21a6e7;
  --green:#7ac143; --green2:#a6da67; --ink:#12213b; --muted:#617087;
  --line:#dfe7f0; --soft:#f4f7fa; --white:#fff; --shadow:0 24px 70px rgba(4,28,59,.13);
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;font-family:Inter,Arial,sans-serif;color:var(--ink);background:#fff;line-height:1.6}
a{color:inherit;text-decoration:none}
.container{width:min(1180px,calc(100% - 48px));margin:auto}

.topbar{height:84px;display:flex;align-items:center;gap:34px;padding:0 max(24px,calc((100% - 1180px)/2));position:sticky;top:0;z-index:50;background:rgba(255,255,255,.94);backdrop-filter:blur(15px);border-bottom:1px solid rgba(10,44,87,.08)}
.brand{display:flex;align-items:center;gap:12px;margin-right:auto;min-width:max-content}
.brand-mark{position:relative;width:53px;height:53px;border-radius:50%;border:3px solid var(--blue);display:grid;place-items:center;font-family:Montserrat;font-weight:800;color:var(--navy);letter-spacing:-4px;font-size:24px;overflow:visible}
.brand-mark:after{content:"";position:absolute;inset:4px;border-left:3px solid var(--green);border-bottom:3px solid var(--green);border-radius:50%;transform:rotate(-24deg)}
.brand-mark .hf{z-index:2;transform:translateX(-2px)}
.bars{position:absolute;bottom:6px;right:5px;display:flex;gap:2px;align-items:end;z-index:3}
.bars i{display:block;width:4px;background:linear-gradient(var(--blue2),var(--blue))}
.bars i:nth-child(1){height:7px}.bars i:nth-child(2){height:11px}.bars i:nth-child(3){height:16px}
.pixels{position:absolute;right:-4px;top:4px;width:16px;height:16px;z-index:4}
.pixels i{position:absolute;width:5px;height:5px;background:var(--green)}
.pixels i:nth-child(1){left:0;top:5px}.pixels i:nth-child(2){left:6px;top:0}.pixels i:nth-child(3){left:6px;top:6px}.pixels i:nth-child(4){left:12px;top:6px}
.brand-copy{display:flex;flex-direction:column;line-height:1}
.brand-copy strong{font-family:Montserrat;font-size:20px;letter-spacing:.8px}
.brand-copy small{margin-top:8px;font-size:9px;letter-spacing:2px;color:var(--blue);font-weight:700}
.brand-copy small b{color:var(--green)}
.nav{display:flex;align-items:center;gap:28px;font-size:14px;font-weight:600;color:#3e4e65}
.nav a:hover{color:var(--blue)}

.btn{display:inline-flex;align-items:center;justify-content:center;border-radius:9px;font-weight:700;transition:.22s;border:1px solid transparent;cursor:pointer}
.btn-small{padding:10px 16px;font-size:13px}
.btn-outline{border-color:#cdd9e6;color:var(--navy)}
.btn-outline:hover{border-color:var(--blue);color:var(--blue)}
.btn-primary{padding:14px 23px;background:linear-gradient(135deg,var(--green),#63ae31);color:#fff;box-shadow:0 12px 30px rgba(91,165,42,.22)}
.btn-primary:hover{transform:translateY(-2px);box-shadow:0 16px 34px rgba(91,165,42,.29)}
.btn-ghost{padding:13px 20px;border-color:rgba(255,255,255,.22);color:#fff;background:rgba(255,255,255,.07)}
.btn-ghost:hover{background:rgba(255,255,255,.12)}
.btn-large{padding:17px 28px;white-space:nowrap}

.hero{min-height:720px;position:relative;overflow:hidden;background:linear-gradient(135deg,#06162d 0%,#08264b 58%,#0b3766 100%);color:#fff;display:flex;align-items:center}
.hero:before{content:"";position:absolute;inset:0;background-image:linear-gradient(rgba(255,255,255,.025) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.025) 1px,transparent 1px);background-size:44px 44px;mask-image:linear-gradient(to right,black,transparent 80%)}
.hero-glow{position:absolute;border-radius:50%;filter:blur(10px);opacity:.18}
.hero-glow-a{width:560px;height:560px;background:var(--blue);right:-140px;top:-190px}
.hero-glow-b{width:330px;height:330px;background:var(--green);left:38%;bottom:-240px;opacity:.09}
.hero-grid{display:grid;grid-template-columns:.92fr 1.08fr;gap:58px;align-items:center;position:relative;z-index:2;padding:74px 0 82px}
.eyebrow{font-size:11px;font-weight:700;letter-spacing:2.15px;color:#c8d9ee;display:flex;align-items:center;gap:10px}
.eyebrow span{width:28px;height:2px;background:var(--green)}
h1,h2,h3{font-family:Montserrat,Inter,sans-serif;margin-top:0}
h1{font-size:clamp(42px,4vw,64px);line-height:1.08;letter-spacing:-2.5px;margin:23px 0 24px}
h1 em{font-style:normal;color:#9cd862}
.lead{font-size:18px;line-height:1.75;color:#c7d5e7;max-width:610px;margin:0 0 32px}
.hero-actions{display:flex;gap:11px;flex-wrap:wrap}
.hero-proof{display:flex;gap:23px;flex-wrap:wrap;margin-top:34px;color:#aebfd3;font-size:12px}
.hero-proof span{display:flex;gap:7px;align-items:center}
.dot{display:inline-block;width:7px;height:7px;border-radius:50%;background:#9aabba}
.dot.ok{background:var(--green);box-shadow:0 0 0 4px rgba(122,193,67,.12)}

.dashboard-wrap{perspective:1200px}
.dashboard{border:1px solid rgba(255,255,255,.13);border-radius:18px;background:linear-gradient(155deg,#17283f,#0b1728);padding:17px;box-shadow:0 35px 80px rgba(0,0,0,.35);transform:rotateY(-2deg) rotateX(1deg);position:relative}
.dashboard:after{content:"";position:absolute;inset:0;border-radius:18px;box-shadow:inset 0 1px rgba(255,255,255,.08);pointer-events:none}
.dash-top{height:50px;display:flex;align-items:center;justify-content:space-between;padding:0 7px 13px;border-bottom:1px solid rgba(255,255,255,.08)}
.dash-top>div:first-child{display:flex;flex-direction:column;line-height:1.15}
.dash-kicker{font-size:8px;letter-spacing:1.6px;color:#7e9bbc}.dash-top strong{font-size:13px}
.status{font-size:8px;color:#a8bbce;background:#0f2136;padding:7px 9px;border-radius:6px}.status span{display:inline-block;width:6px;height:6px;background:var(--green);border-radius:50%;margin-right:5px}
.dash-stats{display:grid;grid-template-columns:repeat(3,1fr);gap:9px;margin:13px 0}
.dash-stats article{padding:12px 13px;border-radius:9px;background:#0d1e32;border:1px solid rgba(255,255,255,.055);display:flex;flex-direction:column}
.dash-stats small,.side-card small{font-size:7px;letter-spacing:.8px;color:#7890aa}
.dash-stats strong{font-size:19px;margin:4px 0 2px}.dash-stats strong b{font-size:9px;color:#93a8bf}.trend{font-size:7px;color:#71879f}.trend.up{color:#9bd45e}.trend.down{color:#65b2ff}
.dash-body{display:grid;grid-template-columns:1fr 145px;gap:10px}
.chart-card,.side-card{background:#0d1e32;border:1px solid rgba(255,255,255,.055);border-radius:9px;padding:12px}
.chart-head{display:flex;justify-content:space-between;font-size:9px}.chart-head small{color:#71879f;font-size:7px}
.chart-card svg{width:100%;height:155px;margin-top:4px}.grid-lines path{stroke:#21344a;stroke-width:1}.line-green{fill:none;stroke:#7ac143;stroke-width:2.5}.line-blue{fill:none;stroke:#1476d6;stroke-width:2.5}.area-green{fill:url(#fillGreen)}.area-blue{fill:url(#fillBlue)}
.legend{display:flex;align-items:center;gap:5px;color:#71879f;font-size:7px}.legend span{width:7px;height:7px;border-radius:2px;margin-left:8px}.legend span:first-child{margin-left:0}.legend .blue{background:var(--blue)}.legend .green{background:var(--green)}
.side-card{padding-top:20px}.side-card>strong{display:block;font-size:27px;margin:6px 0 8px;color:#d8f0bb}.meter{height:5px;background:#1c3149;border-radius:99px;overflow:hidden;margin-bottom:22px}.meter i{display:block;width:44%;height:100%;background:linear-gradient(90deg,var(--blue),var(--green))}
.mini-row{display:flex;justify-content:space-between;padding:10px 0;border-top:1px solid #1d3045;font-size:7px;color:#7990aa}.mini-row b{color:#d5dfeb}

.metrics{position:relative;z-index:3;background:#fff;box-shadow:0 -10px 40px rgba(3,25,52,.06)}
.metrics-grid{display:grid;grid-template-columns:repeat(6,1fr);padding:28px 0 31px}
.metrics article{padding:5px 18px;border-right:1px solid var(--line);display:grid;grid-template-columns:34px 1fr;grid-template-areas:"icon label" "icon value" "icon note";align-items:center;column-gap:10px}
.metrics article:last-child{border-right:0}.metric-icon{grid-area:icon;width:31px;height:31px;border-radius:8px;display:grid;place-items:center;font-weight:800;background:#edf5ff;color:var(--blue)}.metric-icon.sun,.metric-icon.cover,.metric-icon.gain{background:#f0f8e9;color:#67aa36}
.metrics article>span{grid-area:label;font-size:9px;text-transform:uppercase;letter-spacing:.5px;color:#768397;font-weight:700}
.metrics article>strong{grid-area:value;font-size:18px;line-height:1.25}.metrics article>strong small{font-size:9px}.metrics article>i{grid-area:note;font-size:8px;font-style:normal;color:#9aa5b4}

.section{padding:104px 0}.section-grid{display:grid;grid-template-columns:1.12fr .88fr;gap:78px;align-items:center}.section-label{font-size:11px;letter-spacing:2px;font-weight:800;color:var(--blue);margin-bottom:13px}.section-label.light{color:#9dd863}
.section h2,.cta h2{font-size:clamp(31px,3vw,45px);line-height:1.15;letter-spacing:-1.2px;margin-bottom:22px}.section-copy p,.center-copy p{font-size:16px;color:var(--muted)}
.check-list{display:grid;gap:13px;margin-top:26px}.check-list span{font-size:14px;font-weight:600;color:#31415a}.check-list span:before{content:"✓";display:inline-grid;place-items:center;width:22px;height:22px;margin-right:10px;border-radius:50%;background:#eef7e7;color:#64a932;font-weight:900}

.visual{border:1px solid #dfe7ef;border-radius:16px;background:linear-gradient(180deg,#fafdff,#f3f7fb);box-shadow:var(--shadow);padding:18px}
.visual-top{display:flex;justify-content:space-between;border-bottom:1px solid #e4ebf2;padding:3px 4px 14px;font-size:11px;font-weight:700}.visual-top small{font-weight:500;color:#7b899b}.visual-top .dot{margin-right:5px}
.syno-flow{padding:32px 20px 20px;display:grid;place-items:center}.syno-node,.syno-center{width:112px;border:1px solid #dce6ef;background:#fff;border-radius:12px;padding:14px;text-align:center;box-shadow:0 8px 23px rgba(8,40,78,.08);display:flex;flex-direction:column}.syno-node span{font-size:22px;color:#f3af21}.syno-node b,.syno-center b{font-size:11px}.syno-node small,.syno-center small{color:#6f8195;font-size:9px}.syno-center{border-color:#bcd6ec}.syno-center span{font-family:Montserrat;font-weight:800;color:var(--blue);font-size:18px}

.syno-sources{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:28px;width:76%;align-items:stretch}
.syno-sources .syno-node{width:100%;min-height:100px;justify-content:center}
.syno-node em{font-size:8px;font-style:normal;color:#7890a3;margin-top:2px}
.grid-source span{color:var(--blue)!important}
.dual-flow{width:58%;display:grid;grid-template-columns:repeat(2,1fr);gap:48px;margin:0 auto}
.flow-channel{height:48px;position:relative;border-left:2px solid #90b9da}
.flow-channel:after{content:"";position:absolute;left:-5px;bottom:-1px;width:8px;height:8px;border-right:2px solid #90b9da;border-bottom:2px solid #90b9da;transform:rotate(45deg)}
.flow-channel span{position:absolute;left:10px;top:13px;font-size:7px;color:#6e8399;white-space:nowrap}
.flow-channel i{position:absolute;left:-4px;top:2px;width:6px;height:6px;border-radius:50%;background:var(--green);animation:flowSource 1.8s infinite linear}
.grid-flow i{background:var(--blue);animation-delay:.7s}
@keyframes flowSource{from{top:2px}to{top:38px}}
.inject-flow{margin-top:10px;font-size:8px;color:#75869a;background:#eef4f9;border:1px solid #dce6ef;padding:5px 10px;border-radius:999px}

.flow-line{height:32px;width:2px;background:#90b9da;position:relative}.flow-line i{position:absolute;width:6px;height:6px;border-radius:50%;background:var(--green);left:-2px;animation:flow 1.8s infinite linear}@keyframes flow{from{top:0}to{top:26px}}
.flow-split{height:33px;width:66%;border-top:2px solid #90b9da;border-left:2px solid #90b9da;border-right:2px solid #90b9da;margin-top:16px;position:relative}.flow-split:before{content:"";position:absolute;left:50%;top:0;height:33px;border-left:2px solid #90b9da}
.syno-branches{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;width:100%}.syno-branches div{padding:12px;background:#fff;border:1px solid #dce5ee;border-radius:9px;display:flex;flex-direction:column;text-align:center}.syno-branches b{font-size:9px}.syno-branches small{font-size:8px;color:#748499}

.analysis{background:#f4f7fa}.center-copy{text-align:center;max-width:760px;margin:0 auto 47px}.center-copy p{max-width:690px;margin:auto}
.feature-cards{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}.feature-cards article{position:relative;background:#fff;border:1px solid #e1e8ef;border-radius:16px;padding:27px;min-height:305px;box-shadow:0 10px 35px rgba(7,35,70,.06)}.feature-no{position:absolute;right:22px;top:19px;color:#e2e9f0;font-family:Montserrat;font-size:28px;font-weight:800}
.feature-cards h3{font-size:18px;margin:22px 0 8px}.feature-cards p{color:#6b788a;font-size:13px;margin:0}
.mini-chart{height:108px;display:flex;gap:7px;align-items:end;padding:18px 10px 8px;border-bottom:1px solid #e3e9f0}.mini-chart i{flex:1;border-radius:4px 4px 0 0;background:linear-gradient(#39a7e4,#1476d6)}.mini-chart i:nth-child(1){height:25%}.mini-chart i:nth-child(2){height:43%}.mini-chart i:nth-child(3){height:36%}.mini-chart i:nth-child(4){height:72%}.mini-chart i:nth-child(5){height:88%;background:linear-gradient(#9bd45e,#7ac143)}.mini-chart i:nth-child(6){height:61%}.mini-chart i:nth-child(7){height:41%}
.money{font-family:Montserrat;font-size:38px;font-weight:800;color:#5ca82d;margin-top:33px}.money small{font-size:18px}.money-sub{font-size:9px;color:#8b97a6;border-bottom:1px solid #e5ebf1;padding-bottom:27px}
.display-preview{height:112px;margin-top:20px;border-radius:9px;background:linear-gradient(135deg,#071b36,#0c3967);color:#fff;display:flex;align-items:center;justify-content:center;gap:16px;box-shadow:inset 0 0 0 1px rgba(255,255,255,.07)}.display-preview>span{width:42px;height:42px;border:2px solid #72c445;border-radius:50%;display:grid;place-items:center;font-family:Montserrat;font-weight:800}.display-preview div{display:flex;flex-direction:column}.display-preview b{font-size:20px}.display-preview small{font-size:7px;color:#83a1bf;letter-spacing:.7px}

.reports{background:#fff}.reports-grid{display:grid;grid-template-columns:.85fr 1.15fr;gap:90px;align-items:center}.export-pills{display:flex;gap:9px;margin-top:28px}.export-pills span{font-size:11px;font-weight:800;color:#42607c;border:1px solid #d8e2ec;border-radius:7px;padding:8px 14px;background:#f8fafc}
.report-card{background:linear-gradient(135deg,#e8eef5,#f5f8fb);border-radius:20px;padding:40px;box-shadow:var(--shadow)}.paper{max-width:480px;margin:auto;background:#fff;min-height:380px;padding:27px 30px;box-shadow:0 10px 32px rgba(14,44,75,.13);border-radius:3px}.paper-head{display:flex;justify-content:space-between;align-items:center;font-family:Montserrat;font-size:12px}.paper-head b{background:#0a2546;color:#fff;border-radius:4px;padding:7px}.paper-head em{font-size:7px;color:#9ed25f;font-style:normal}.paper-line{height:2px;background:#2c67b2;margin:22px 0 14px}.paper>small{font-size:8px;color:#2c5aa0;font-weight:800}.paper-row{display:flex;justify-content:space-between;border-bottom:1px solid #e8edf2;padding:9px 0;font-size:9px}.paper-row b{color:#385678}.paper-chart{height:70px;margin-top:18px;border-bottom:1px solid #dfe6ed;position:relative;background:linear-gradient(to right,transparent 49%,#edf2f5 50%,transparent 51%)}.paper-chart i{position:absolute;left:5%;right:5%;bottom:3px;height:50px;background:linear-gradient(155deg,transparent 0 20%,rgba(122,193,67,.25) 21% 42%,transparent 43% 48%,rgba(20,118,214,.18) 49% 72%,transparent 73%);clip-path:polygon(0 90%,15% 65%,27% 74%,39% 30%,54% 57%,69% 22%,81% 45%,100% 32%,100% 100%,0 100%)}

.compat{padding:42px 0;background:#f7f9fb;border-top:1px solid #e9eef3;border-bottom:1px solid #e9eef3}.compat p{text-align:center;font-size:11px;letter-spacing:1.2px;text-transform:uppercase;color:#8b98a8;font-weight:700;margin:0 0 22px}.compat-row{display:flex;justify-content:center;gap:36px;flex-wrap:wrap}.compat-row span{font-family:Montserrat;font-weight:700;color:#506178}

.cta{padding:82px 0;background:radial-gradient(circle at 75% 20%,#104b84,#071d3b 52%);color:#fff}.cta-inner{display:grid;grid-template-columns:1fr auto;gap:80px;align-items:center}.cta h2{max-width:700px;margin-bottom:12px}.cta p{color:#b9cadc;max-width:720px;margin:0}

footer{background:#04142a;color:#8ea3bb;padding:32px 0;font-size:11px}.footer-inner{display:flex;justify-content:space-between;align-items:center;gap:25px}.footer-brand{display:flex;flex-direction:column}.footer-brand strong{font-family:Montserrat;color:#fff;font-size:14px}.footer-brand span{font-size:7px;letter-spacing:1.5px;color:#7ac143}

@media(max-width:1050px){
  .nav{display:none}.hero-grid{grid-template-columns:1fr}.hero-copy{max-width:760px}.dashboard{transform:none}.metrics-grid{grid-template-columns:repeat(3,1fr)}.metrics article:nth-child(3){border-right:0}.section-grid,.reports-grid{grid-template-columns:1fr}.section-grid{gap:50px}.reports-grid{gap:50px}.feature-cards{grid-template-columns:1fr 1fr}.cta-inner{grid-template-columns:1fr;gap:28px}
}
@media(max-width:700px){

  .syno-sources{width:100%;grid-template-columns:1fr 1fr;gap:8px}
  .syno-sources .syno-node{padding:10px;min-height:88px}
  .dual-flow{width:72%;gap:24px}

  .container{width:min(100% - 30px,1180px)}.topbar{height:72px;padding:0 15px}.brand-copy strong{font-size:17px}.brand-copy small{display:none}.brand-mark{width:45px;height:45px}.topbar>.btn{display:none}.hero{min-height:auto}.hero-grid{padding:64px 0}.lead{font-size:16px}.dashboard{padding:11px}.dash-stats{grid-template-columns:1fr}.dash-body{grid-template-columns:1fr}.side-card{display:none}.metrics-grid{grid-template-columns:1fr 1fr}.metrics article{border-bottom:1px solid var(--line);border-right:1px solid var(--line);padding:14px 10px}.metrics article:nth-child(even){border-right:0}.section{padding:74px 0}.feature-cards{grid-template-columns:1fr}.report-card{padding:18px}.paper{padding:20px}.syno-branches{grid-template-columns:repeat(2,1fr);gap:6px}.cta{padding:65px 0}.footer-inner{flex-direction:column;align-items:flex-start}
}

/* Correction Sprint01 : raccordement des deux sources au TGBT */
.syno-flow .direct-to-tgbt{height:76px;margin-bottom:0}
.syno-flow .direct-to-tgbt .flow-channel{height:76px}
.syno-flow .direct-to-tgbt .flow-channel:after{bottom:0}
.syno-flow .direct-to-tgbt .flow-channel i{animation:flowIntoTgbt 1.8s infinite linear}
.syno-flow .direct-to-tgbt .grid-flow i{animation-delay:.7s}
.syno-flow .tgbt-connected{margin-top:0;position:relative}
.syno-flow .tgbt-connected:before,
.syno-flow .tgbt-connected:after{content:"";position:absolute;top:-2px;width:2px;height:2px}
@keyframes flowIntoTgbt{from{top:2px}to{top:66px}}

/* Sprint01 - Synoptique SVG final : raccordements garantis */
.syno-svg-wrap{padding:18px 14px 10px}
.syno-svg{display:block;width:100%;height:auto;max-width:100%}
.syno-legend-final{display:flex;justify-content:center;gap:18px;flex-wrap:wrap;border-top:1px solid #e1e8ef;padding-top:10px;margin-top:2px;font-size:8px;color:#61748b}
.syno-legend-final span{display:flex;align-items:center;gap:6px}
.syno-legend-final i{display:inline-block;width:22px;border-top:3px solid}
.syno-legend-final .pv{border-color:#7ac143}
.syno-legend-final .grid{border-color:#1476d6}
.syno-legend-final .inj{border-color:#68ad34;border-top-style:dashed}

/* =========================
   SPRINT 02 — PILOTAGE
   ========================= */
.sprint02-detail{background:linear-gradient(180deg,#071d3b 0%,#09294f 100%);color:#fff;position:relative;overflow:hidden}
.sprint02-detail:before{content:"";position:absolute;inset:0;background-image:linear-gradient(rgba(255,255,255,.025) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.025) 1px,transparent 1px);background-size:44px 44px;pointer-events:none}
.sprint02-detail .container{position:relative;z-index:1}
.s2-heading{display:grid;grid-template-columns:1fr .8fr;gap:70px;align-items:end;margin-bottom:42px}
.s2-heading h2{margin-bottom:0;max-width:650px}.s2-heading p{color:#b9c9da;margin:0 0 4px;font-size:15px}
.s2-dashboard{display:grid;grid-template-columns:1.6fr .7fr;gap:18px}
.s2-main,.s2-side article{background:rgba(255,255,255,.055);border:1px solid rgba(255,255,255,.11);border-radius:16px}
.s2-main{padding:25px}
.s2-card-head{display:flex;justify-content:space-between;align-items:flex-start;border-bottom:1px solid rgba(255,255,255,.1);padding-bottom:18px;margin-bottom:8px}
.s2-card-head div{display:flex;flex-direction:column}.s2-card-head small,.s2-side small{font-size:9px;letter-spacing:1px;color:#88a3bf}.s2-card-head strong{font-family:Montserrat;font-size:29px;margin-top:5px}.s2-card-head>span{font-size:9px;padding:6px 9px;border-radius:99px;background:rgba(122,193,67,.13);color:#a6dc73}
.building-row{display:grid;grid-template-columns:145px 1fr 60px;gap:18px;align-items:center;padding:16px 0;border-bottom:1px solid rgba(255,255,255,.07)}.building-row:last-child{border-bottom:0}.building-row>div:first-child{display:flex;flex-direction:column}.building-row b{font-size:12px}.building-row small{font-size:9px;color:#8da4bb}.building-row>strong{text-align:right;font-size:11px;color:#b9c9da}
.usage{height:9px;border-radius:99px;background:#142f4e;overflow:hidden}.usage i{display:block;height:100%;min-width:8px;border-radius:99px;background:linear-gradient(90deg,#1476d6,#7ac143)}
.s2-side{display:grid;gap:18px}.s2-side article{padding:24px}.s2-side strong{display:block;font-family:Montserrat;font-size:32px;margin:8px 0 10px}.s2-side .green-value{color:#9bd45e}.s2-side p{font-size:11px;line-height:1.55;color:#94a9be;margin:14px 0 0}
.s2-meter{height:7px;border-radius:99px;background:#153452;overflow:hidden}.s2-meter i{display:block;height:100%;background:linear-gradient(90deg,#6bb238,#9bd45e)}.s2-meter.blue i{background:linear-gradient(90deg,#1476d6,#39a7e4)}
.s2-benefits{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;margin-top:18px}.s2-benefits>div{padding:21px 23px;border-radius:13px;background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.08);display:grid;grid-template-columns:36px 1fr;grid-template-areas:"no title" "no text";column-gap:12px}.s2-benefits span{grid-area:no;font-family:Montserrat;color:#7ac143;font-weight:800}.s2-benefits b{grid-area:title;font-family:Montserrat;font-size:13px}.s2-benefits p{grid-area:text;color:#91a6bb;font-size:10px;margin:4px 0 0;line-height:1.5}
@media(max-width:1050px){.s2-heading,.s2-dashboard{grid-template-columns:1fr}.s2-side{grid-template-columns:1fr 1fr}}
@media(max-width:700px){.s2-heading{gap:20px}.s2-side,.s2-benefits{grid-template-columns:1fr}.building-row{grid-template-columns:90px 1fr 48px;gap:9px}.s2-main{padding:17px}}


/* Sprint02 - correction mise en page Synoptique */
@media (min-width:1051px) and (max-width:1450px){
  .platform .section-grid{
    grid-template-columns:1fr;
    gap:46px;
    align-items:start;
  }
  .platform .visual{
    width:min(900px,100%);
    margin:0 auto;
  }
  .platform .section-copy{
    width:min(900px,100%);
    margin:0 auto;
  }
  .platform .section-copy h2{
    max-width:780px;
  }
}

@media (min-width:1451px){
  .platform .section-grid{
    align-items:center;
  }
}

/* Empêche toute coupe verticale entre le visuel et son texte */
.platform{
  overflow:visible;
}
.platform .visual,
.platform .section-copy{
  min-width:0;
}
.platform .section-copy{
  position:relative;
  z-index:1;
}

/* =========================
   SPRINT 03 — ANALYSE
   ========================= */
.sprint03-analysis{background:#fff}
.s3-intro{display:grid;grid-template-columns:1fr .8fr;gap:70px;align-items:end;margin-bottom:42px}
.s3-intro h2{margin-bottom:0}.s3-intro p{color:var(--muted);margin:0 0 5px;font-size:15px}
.s3-layout{display:grid;grid-template-columns:1fr 235px;gap:20px}
.s3-chart-card{border:1px solid #dfe7ef;border-radius:16px;background:#fbfdff;padding:24px;box-shadow:0 12px 38px rgba(7,35,70,.07)}
.s3-card-top{display:flex;justify-content:space-between;gap:20px;align-items:center;padding-bottom:18px;border-bottom:1px solid #e4ebf2}
.s3-card-top>div:first-child{display:flex;flex-direction:column}.s3-card-top small{font-size:9px;letter-spacing:1px;color:#8291a4}.s3-card-top strong{font-family:Montserrat;font-size:17px;margin-top:3px}
.s3-tabs{display:flex;background:#f0f4f8;border-radius:8px;padding:3px}.s3-tabs span{font-size:9px;padding:6px 9px;border-radius:6px;color:#748397}.s3-tabs .active{background:#fff;color:var(--blue);box-shadow:0 2px 8px rgba(10,44,87,.08);font-weight:700}
.s3-chart{position:relative;padding:17px 5px 0 38px}.s3-chart svg{display:block;width:100%;height:auto}.s3-grid path{stroke:#e6edf3;stroke-width:1}.s3-line-blue{fill:none;stroke:#1476d6;stroke-width:2}.s3-line-green{fill:none;stroke:#7ac143;stroke-width:2}.s3-area-blue{fill:url(#s3blue)}.s3-area-green{fill:url(#s3green)}
.axis-labels{position:absolute;left:0;top:27px;bottom:43px;display:flex;flex-direction:column;justify-content:space-between;font-size:8px;color:#91a0b0}
.s3-hours{display:flex;justify-content:space-between;font-size:8px;color:#91a0b0;padding:0 3px}.s3-legend{display:flex;gap:17px;justify-content:center;margin-top:15px;font-size:9px;color:#65758a}.s3-legend span{display:flex;align-items:center;gap:5px}.s3-legend i{display:inline-block;width:20px;border-top:3px solid}.s3-legend .blue{border-color:#1476d6}.s3-legend .green{border-color:#7ac143}
.s3-kpis{display:grid;gap:12px}.s3-kpis article{border:1px solid #dfe7ef;border-radius:14px;padding:20px;background:#fff;display:flex;flex-direction:column;justify-content:center}.s3-kpis small{font-size:8px;letter-spacing:.8px;color:#8493a5}.s3-kpis strong{font-family:Montserrat;font-size:25px;margin:6px 0 2px}.s3-kpis strong b{font-size:10px}.s3-kpis strong.green{color:#66aa36}.s3-kpis span{font-size:9px;color:#98a4b3}
.s3-compare{margin-top:20px;border-radius:16px;background:#f4f7fa;padding:25px 28px;display:grid;grid-template-columns:.8fr 1.2fr;gap:35px;align-items:center}.compare-copy>small{font-size:9px;letter-spacing:1.2px;color:var(--blue);font-weight:800}.compare-copy h3{font-size:19px;margin:6px 0}.compare-copy p{font-size:11px;color:#758397;margin:0}.compare-stats{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}.compare-stats>div{background:#fff;border:1px solid #e0e7ee;border-radius:11px;padding:15px}.compare-stats span,.compare-stats small{display:block;font-size:8px;color:#8190a2}.compare-stats strong{display:block;font-family:Montserrat;font-size:20px;color:#2767aa;margin:5px 0}.compare-stats strong.positive{color:#65a936}
@media(max-width:1050px){.s3-intro{grid-template-columns:1fr;gap:18px}.s3-layout{grid-template-columns:1fr}.s3-kpis{grid-template-columns:repeat(3,1fr)}.s3-compare{grid-template-columns:1fr}}
@media(max-width:700px){.s3-card-top{align-items:flex-start;flex-direction:column}.s3-kpis,.compare-stats{grid-template-columns:1fr}.s3-chart-card{padding:15px}.s3-chart{padding-left:28px}.s3-compare{padding:20px}}


/* Sprint03 - Analyse compacte desktop */
@media (min-width:1051px){
  .sprint03-analysis{
    padding-top:68px;
    padding-bottom:68px;
  }
  .sprint03-analysis .s3-intro{
    margin-bottom:26px;
    gap:55px;
  }
  .sprint03-analysis .s3-intro h2{
    font-size:36px;
    margin-bottom:0;
  }
  .sprint03-analysis .s3-intro p{
    font-size:13px;
    line-height:1.55;
  }
  .sprint03-analysis .s3-chart-card{
    padding:18px 20px;
  }
  .sprint03-analysis .s3-card-top{
    padding-bottom:12px;
  }
  .sprint03-analysis .s3-chart{
    padding-top:8px;
  }
  .sprint03-analysis .s3-chart svg{
    max-height:205px;
  }
  .sprint03-analysis .s3-kpis article{
    padding:15px 18px;
  }
  .sprint03-analysis .s3-kpis strong{
    font-size:22px;
  }
  .sprint03-analysis .s3-compare{
    margin-top:14px;
    padding:17px 22px;
  }
  .sprint03-analysis .compare-copy h3{
    font-size:17px;
    margin:4px 0;
  }
  .sprint03-analysis .compare-stats>div{
    padding:11px 13px;
  }
  .sprint03-analysis .compare-stats strong{
    font-size:17px;
    margin:3px 0;
  }
}

/* =========================
   SPRINT 04 — ARCHIVES
   ========================= */
.sprint04-archives{background:#f4f7fa}
.s4-head{display:grid;grid-template-columns:1fr .8fr;gap:70px;align-items:end;margin-bottom:38px}.s4-head h2{margin-bottom:0}.s4-head p{margin:0 0 5px;color:var(--muted);font-size:15px}
.s4-workspace{display:grid;grid-template-columns:1fr 315px;gap:20px}.s4-history,.s4-report{background:#fff;border:1px solid #dfe7ef;border-radius:16px;box-shadow:0 10px 32px rgba(7,35,70,.055)}
.s4-history{padding:22px}.s4-toolbar{display:flex;justify-content:space-between;align-items:center;gap:20px;padding-bottom:17px;border-bottom:1px solid #e5ebf1}.s4-toolbar>div:first-child{display:flex;flex-direction:column}.s4-toolbar small,.s4-report>small{font-size:8px;letter-spacing:1px;color:#8493a5}.s4-toolbar strong{font-family:Montserrat;font-size:16px;margin-top:2px}
.s4-periods{display:flex;background:#f1f4f7;padding:3px;border-radius:8px}.s4-periods span{padding:6px 9px;border-radius:6px;font-size:8px;color:#758499}.s4-periods .active{background:#fff;color:var(--blue);font-weight:700;box-shadow:0 2px 7px rgba(7,35,70,.08)}
.s4-summary{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;margin:16px 0}.s4-summary article{padding:14px;border-radius:10px;background:#f8fafc;border:1px solid #e6ecf2;display:flex;flex-direction:column}.s4-summary small{font-size:7px;color:#8291a4;letter-spacing:.6px}.s4-summary strong{font-family:Montserrat;font-size:17px;margin:5px 0 1px}.s4-summary strong b{font-size:8px}.s4-summary strong.green{color:#66aa36}.s4-summary span{font-size:7px;color:#9aa5b3}
.s4-table{border:1px solid #e2e9f0;border-radius:10px;overflow:hidden}.s4-tr{display:grid;grid-template-columns:1.15fr repeat(3,1fr);font-size:9px;border-bottom:1px solid #e8edf2}.s4-tr:last-child{border-bottom:0}.s4-tr span{padding:10px 12px}.s4-tr span:not(:first-child){text-align:right}.s4-th{background:#f6f8fa;color:#718196;font-weight:700}
.s4-report{padding:25px}.s4-report-icon{width:38px;height:38px;border-radius:10px;background:#edf5ff;color:var(--blue);display:grid;place-items:center;font-weight:800;margin-bottom:17px}.s4-report h3{font-size:19px;margin:7px 0 10px}.s4-report p{font-size:11px;color:#718096;margin:0}.s4-formats{display:flex;gap:7px;margin:18px 0}.s4-formats span{font-size:8px;font-weight:800;padding:6px 9px;border:1px solid #d9e3ec;border-radius:6px;color:#42617f;background:#f8fafc}
.s4-report-preview{height:112px;border:1px solid #dce5ed;background:#fbfcfd;border-radius:8px;padding:14px;box-shadow:0 6px 18px rgba(7,35,70,.06)}.s4-report-preview>div{display:flex;justify-content:space-between;align-items:center;border-bottom:2px solid #2c67b2;padding-bottom:8px;margin-bottom:10px}.s4-report-preview b{font-family:Montserrat;font-size:9px;color:#0a315c}.s4-report-preview small{font-size:6px;color:#7c8999}.s4-report-preview i{display:block;height:6px;background:#e8edf2;border-radius:99px;margin:7px 0}.s4-report-preview i:nth-child(2){width:78%}.s4-report-preview i:nth-child(3){width:92%}.s4-report-preview i:nth-child(4){width:63%}
.s4-points{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin-top:18px}.s4-points>div{padding:15px 18px;border-left:3px solid var(--green);background:#fff;border-radius:0 9px 9px 0}.s4-points b,.s4-points span{display:block}.s4-points b{font-family:Montserrat;font-size:11px}.s4-points span{font-size:9px;color:#8190a2;margin-top:3px}
@media(max-width:1050px){.s4-head,.s4-workspace{grid-template-columns:1fr}.s4-summary{grid-template-columns:repeat(2,1fr)}}
@media(max-width:700px){.s4-head{gap:18px}.s4-toolbar{align-items:flex-start;flex-direction:column}.s4-periods{width:100%;display:grid;grid-template-columns:repeat(2,1fr);text-align:center}.s4-summary,.s4-points{grid-template-columns:1fr}.s4-table{overflow-x:auto}.s4-tr{min-width:570px}}

/* =========================
   SPRINT 05 — CONNECTIVITÉ
   ========================= */
.sprint05-connect{background:#fff}
.s5-head{display:grid;grid-template-columns:1fr .8fr;gap:70px;align-items:end;margin-bottom:42px}
.s5-head h2{margin-bottom:0}.s5-head p{font-size:15px;color:var(--muted);margin:0 0 5px}
.s5-architecture{display:grid;grid-template-columns:1fr 230px 1fr;gap:28px;align-items:center;border:1px solid #dfe7ef;border-radius:18px;background:linear-gradient(180deg,#fbfdff,#f4f7fa);padding:30px;box-shadow:0 12px 38px rgba(7,35,70,.06)}
.s5-devices,.s5-outputs{display:grid;gap:10px}.s5-devices article,.s5-outputs article{background:#fff;border:1px solid #dfe7ef;border-radius:11px;padding:13px;display:grid;align-items:center;box-shadow:0 4px 14px rgba(7,35,70,.035)}
.s5-devices article{grid-template-columns:38px 1fr auto;gap:10px}.s5-outputs article{grid-template-columns:38px 1fr;gap:10px}
.s5-devices article>div:nth-child(2),.s5-outputs article>div:nth-child(2){display:flex;flex-direction:column}.s5-devices b,.s5-outputs b{font-size:11px}.s5-devices small,.s5-outputs small{font-size:8px;color:#8493a5}.s5-devices article>span{font-size:7px;color:#64809c;background:#f1f5f8;padding:5px 7px;border-radius:99px}
.s5-icon,.s5-out-icon{width:34px;height:34px;border-radius:9px;display:grid;place-items:center;background:#edf5ff;color:var(--blue);font-family:Montserrat;font-weight:800;font-size:12px}.s5-icon.sungrow{background:#eef8e8;color:#66aa36}.s5-icon.modbus{background:#f2f4f7;color:#415b75}
.s5-flow{display:flex;align-items:center;justify-content:center}.s5-line{height:2px;flex:1;background:linear-gradient(90deg,#86b8df,#1476d6);position:relative}.s5-line:after{content:"";position:absolute;right:-1px;top:-4px;width:8px;height:8px;border-right:2px solid var(--blue);border-top:2px solid var(--blue);transform:rotate(45deg)}.s5-line.right{background:linear-gradient(90deg,#7ac143,#9bd45e)}.s5-line.right:after{border-color:#7ac143}
.s5-core{min-width:150px;min-height:150px;margin:0 10px;border-radius:50%;border:2px solid #9bc6eb;background:#fff;display:flex;flex-direction:column;align-items:center;justify-content:center;box-shadow:0 12px 28px rgba(7,35,70,.09);text-align:center}.s5-core>span{font-family:Montserrat;font-size:27px;font-weight:800;color:var(--blue)}.s5-core b{font-family:Montserrat;font-size:11px}.s5-core small{font-size:6px;color:#7f90a3;margin-top:4px}
.s5-capabilities{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin-top:18px}.s5-capabilities article{border:1px solid #e0e7ee;border-radius:12px;padding:18px;display:flex;gap:12px}.s5-capabilities article>span{font-family:Montserrat;font-size:18px;font-weight:800;color:#d7e2ec}.s5-capabilities b{font-family:Montserrat;font-size:11px}.s5-capabilities p{font-size:9px;color:#7b899b;line-height:1.5;margin:4px 0 0}
@media(max-width:1050px){.s5-head{grid-template-columns:1fr;gap:18px}.s5-architecture{grid-template-columns:1fr}.s5-flow{height:180px;flex-direction:column}.s5-line{width:2px;height:auto;min-height:25px;flex:1;background:linear-gradient(#86b8df,#1476d6)}.s5-line.right{background:linear-gradient(#7ac143,#9bd45e)}.s5-line:after{right:-3px;top:auto;bottom:0;transform:rotate(135deg)}.s5-capabilities{grid-template-columns:repeat(2,1fr)}}
@media(max-width:700px){.s5-architecture{padding:17px}.s5-devices article{grid-template-columns:38px 1fr}.s5-devices article>span{grid-column:2}.s5-capabilities{grid-template-columns:1fr}}

/* =========================
   SPRINT 06 — HF DISPLAY
   ========================= */
.sprint06-display{background:#f4f7fa}
.s6-head{display:grid;grid-template-columns:1fr .8fr;gap:70px;align-items:end;margin-bottom:38px}
.s6-head h2{margin-bottom:0}.s6-head p{font-size:15px;color:var(--muted);margin:0 0 5px}
.s6-stage{padding:34px;border-radius:20px;background:linear-gradient(145deg,#dfe7ef,#f7f9fb);box-shadow:inset 0 1px #fff}
.s6-screen{max-width:930px;margin:auto;border:9px solid #182431;border-radius:17px;background:radial-gradient(circle at 75% 20%,#103f70,#071a34 55%);color:#fff;padding:24px 28px 18px;box-shadow:0 22px 50px rgba(7,29,59,.2)}
.s6-screen-top{display:flex;justify-content:space-between;align-items:center;padding-bottom:16px;border-bottom:1px solid rgba(255,255,255,.1)}
.s6-logo{display:flex;align-items:center;gap:10px}.s6-logo>span{width:37px;height:37px;border:2px solid #7ac143;border-radius:50%;display:grid;place-items:center;font-family:Montserrat;font-weight:800}.s6-logo>div{display:flex;flex-direction:column}.s6-logo b{font-family:Montserrat;font-size:12px}.s6-logo small{font-size:6px;letter-spacing:1.2px;color:#8ca7c1}
.s6-online{font-size:8px;color:#9db2c7}.s6-online i,.s6-bottom i{display:inline-block;width:7px;height:7px;border-radius:50%;background:#7ac143;margin-right:6px;box-shadow:0 0 0 4px rgba(122,193,67,.09)}
.s6-screen-main{display:grid;grid-template-columns:.85fr 1.15fr;gap:35px;align-items:center;padding:34px 0 27px}.s6-main-value small{font-size:8px;letter-spacing:1.3px;color:#7f9ab5}.s6-main-value strong{display:block;font-family:Montserrat;font-size:50px;line-height:1.1;margin:7px 0}.s6-main-value strong b{font-size:15px;color:#9db2c7}.s6-main-value span{font-size:8px;color:#7691ac}
.s6-display-stats{display:grid;grid-template-columns:repeat(3,1fr);gap:9px}.s6-display-stats article{padding:15px 13px;background:rgba(255,255,255,.055);border:1px solid rgba(255,255,255,.08);border-radius:10px}.s6-display-stats small{display:block;font-size:6px;color:#7894ae;letter-spacing:.6px}.s6-display-stats strong{display:block;font-family:Montserrat;font-size:18px;margin-top:6px}.s6-display-stats strong b{font-size:7px}.s6-display-stats .green{color:#9bd45e}
.s6-energy-bar{padding:18px 0 22px;border-top:1px solid rgba(255,255,255,.08)}.s6-bar-labels,.s6-bar-values{display:flex;justify-content:space-between;font-size:7px;color:#88a0b8}.s6-bar{display:flex;height:9px;border-radius:99px;overflow:hidden;background:#153452;margin:8px 0}.s6-bar .solar{width:43.8%;background:linear-gradient(90deg,#65ad36,#8dcc55)}.s6-bar .network{width:56.2%;background:linear-gradient(90deg,#1476d6,#349bd9)}
.s6-bottom{display:flex;justify-content:space-between;align-items:center;padding-top:13px;border-top:1px solid rgba(255,255,255,.08);font-size:7px;color:#7690a9}.s6-bottom strong{font-family:Montserrat;font-size:8px;color:#a6b7c8;letter-spacing:.8px}
.s6-features{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin-top:18px}.s6-features article{background:#fff;border:1px solid #e0e7ee;border-radius:12px;padding:18px;display:flex;gap:13px}.s6-features article>span{font-family:Montserrat;font-weight:800;color:#d5e0ea;font-size:19px}.s6-features b{font-family:Montserrat;font-size:11px}.s6-features p{font-size:9px;color:#7c8999;line-height:1.5;margin:4px 0 0}
@media(max-width:1050px){.s6-head{grid-template-columns:1fr;gap:18px}.s6-screen-main{grid-template-columns:1fr}.s6-stage{padding:20px}}
@media(max-width:700px){.s6-stage{padding:8px}.s6-screen{border-width:5px;padding:18px 15px}.s6-main-value strong{font-size:39px}.s6-display-stats,.s6-features{grid-template-columns:1fr}.s6-screen-top{align-items:flex-start}.s6-online{margin-top:6px}}

/* Sprint06 - intégration du HF Display réel */
.s6-real-stage{padding:22px}
.s6-real-screen{overflow:hidden;border:8px solid #17212b;border-radius:15px;background:#15191d;box-shadow:0 20px 45px rgba(7,29,59,.18)}
.s6-real-screen img{display:block;width:100%;height:auto}
.s6-real-caption{display:flex;justify-content:space-between;align-items:center;gap:30px;max-width:1080px;margin:14px auto 0;color:#617087}
.s6-real-caption>span{white-space:nowrap;font-size:9px;font-weight:700;color:#40536a}
.s6-real-caption>span i{display:inline-block;width:7px;height:7px;border-radius:50%;background:#7ac143;margin-right:6px;box-shadow:0 0 0 4px rgba(122,193,67,.1)}
.s6-real-caption p{font-size:10px;line-height:1.5;margin:0;text-align:right}
@media(max-width:700px){
 .s6-real-stage{padding:8px}
 .s6-real-screen{border-width:4px;border-radius:9px}
 .s6-real-caption{align-items:flex-start;flex-direction:column;gap:5px}
 .s6-real-caption p{text-align:left}
}

/* =========================
   SPRINT 07 — BILAN ÉCONOMIQUE
   ========================= */
.sprint07-economy{background:#fff}
.s7-head{display:grid;grid-template-columns:1fr .8fr;gap:70px;align-items:end;margin-bottom:38px}.s7-head h2{margin-bottom:0}.s7-head p{font-size:15px;color:var(--muted);margin:0 0 5px}
.s7-board{display:grid;grid-template-columns:1.05fr 1.35fr;gap:18px}.s7-hero{border-radius:16px;background:linear-gradient(145deg,#071d3b,#0b3867);color:#fff;padding:27px;box-shadow:0 15px 38px rgba(7,29,59,.15)}.s7-hero>small{font-size:8px;letter-spacing:1.1px;color:#8ca7c1}.s7-hero>strong{display:block;font-family:Montserrat;font-size:38px;color:#a0d967;margin:7px 0 4px}.s7-hero>strong b{font-size:17px}.s7-hero>span{display:block;font-size:9px;color:#a9bdd1;max-width:410px}
.s7-progress{height:8px;background:#173c60;border-radius:99px;overflow:hidden;margin-top:26px}.s7-progress i{display:block;width:68%;height:100%;background:linear-gradient(90deg,#69b138,#9bd45e)}.s7-progress-labels{display:flex;justify-content:space-between;margin-top:7px;font-size:8px;color:#8da6bd}.s7-progress-labels b{color:#b7d89a}
.s7-kpis{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}.s7-kpis article{border:1px solid #dfe7ef;border-radius:14px;padding:21px;background:#fbfcfd;display:flex;flex-direction:column;justify-content:center}.s7-kpis small{font-size:7px;letter-spacing:.7px;color:#8493a5}.s7-kpis strong{font-family:Montserrat;font-size:22px;margin:7px 0 2px}.s7-kpis strong b{font-size:9px}.s7-kpis strong.green{color:#65aa36}.s7-kpis span{font-size:8px;color:#96a2b0}
.s7-detail{display:grid;grid-template-columns:1.35fr .65fr;gap:18px;margin-top:18px}.s7-months,.s7-explain{border:1px solid #dfe7ef;border-radius:16px;background:#f8fafc;padding:22px}.s7-title-row{display:flex;justify-content:space-between;align-items:flex-start}.s7-title-row>div{display:flex;flex-direction:column}.s7-title-row small,.s7-explain>small{font-size:8px;letter-spacing:1px;color:#8493a5}.s7-title-row b{font-family:Montserrat;font-size:14px;margin-top:2px}.s7-title-row>span{font-size:8px;color:#93a0af}
.s7-bars{height:190px;display:grid;grid-template-columns:repeat(6,1fr);gap:12px;align-items:end;margin-top:16px;border-bottom:1px solid #dfe7ef;padding:0 10px}.s7-bars>div{height:100%;display:flex;flex-direction:column;justify-content:flex-end;align-items:center}.s7-bars i{display:block;width:58%;min-width:22px;border-radius:5px 5px 0 0;background:linear-gradient(#47a8df,#1476d6)}.s7-bars i.current{background:linear-gradient(#9bd45e,#6db23a)}.s7-bars span{font-size:8px;font-weight:700;margin-top:7px}.s7-bars small{font-size:7px;color:#8d9aaa;margin:2px 0 8px}
.s7-explain{background:#fff}.s7-explain h3{font-size:18px;margin:6px 0 16px}.s7-step{display:grid;grid-template-columns:29px 1fr;gap:10px;padding:11px 0;border-top:1px solid #e7ecf1}.s7-step>span{width:25px;height:25px;border-radius:50%;display:grid;place-items:center;background:#edf5ff;color:var(--blue);font-size:9px;font-weight:800}.s7-step b{font-size:10px}.s7-step p{font-size:8px;color:#8290a1;margin:2px 0 0;line-height:1.45}
@media(max-width:1050px){.s7-head,.s7-board,.s7-detail{grid-template-columns:1fr}.s7-head{gap:18px}}
@media(max-width:700px){.s7-kpis{grid-template-columns:1fr}.s7-bars{gap:5px;padding:0}.s7-bars i{min-width:14px}.s7-hero>strong{font-size:31px}}

/* Sprint07 - refonte professionnelle du Bilan économique */
.pro-economy{background:#fff;padding-top:78px;padding-bottom:78px}
.pro-s7-head{margin-bottom:32px}
.pro-s7-head h2{max-width:720px;font-size:38px;line-height:1.18}
.pro-s7-head p{max-width:560px;font-size:14px;line-height:1.6}

.pro-economy-grid{display:grid;grid-template-columns:1.55fr .75fr;gap:18px;align-items:stretch}
.pro-main-card,.pro-side-card{border:1px solid #dfe7ef;border-radius:14px;background:#fff}
.pro-main-card{padding:24px;box-shadow:0 8px 26px rgba(7,35,70,.05)}
.pro-main-top{display:flex;justify-content:space-between;gap:20px;align-items:flex-start;padding-bottom:18px;border-bottom:1px solid #e7ecf1}
.pro-main-top>div:first-child{display:flex;flex-direction:column}
.pro-main-top small,.pro-side-card>small,.pro-trend-head small{font-size:8px;letter-spacing:1px;color:#8493a5}
.pro-main-top strong{font-family:Montserrat;font-size:33px;color:#1c3554;margin:6px 0 2px}
.pro-main-top strong b{font-size:15px}
.pro-main-top span{font-size:9px;color:#8a98a8}
.pro-badge{font-size:8px;color:#60748b;background:#f3f6f9;border:1px solid #e1e7ed;padding:6px 9px;border-radius:99px;white-space:nowrap}

.pro-main-metrics{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;padding:16px 0}
.pro-main-metrics>div{padding:13px 14px;background:#f8fafc;border:1px solid #e5ebf1;border-radius:9px}
.pro-main-metrics span{display:block;font-size:8px;color:#8493a5;margin-bottom:5px}
.pro-main-metrics b{font-size:12px;color:#243c58}

.pro-trend{border-top:1px solid #e7ecf1;padding-top:16px}
.pro-trend-head{display:flex;justify-content:space-between;align-items:flex-start}
.pro-trend-head>div{display:flex;flex-direction:column}
.pro-trend-head b{font-family:Montserrat;font-size:13px;margin-top:2px}
.pro-trend-head>span{font-size:8px;color:#93a0af}
.pro-trend-bars{height:150px;display:grid;grid-template-columns:repeat(6,1fr);gap:10px;align-items:end;margin-top:12px;border-bottom:1px solid #dfe6ed;padding:0 6px}
.pro-trend-bars>div{height:100%;display:flex;flex-direction:column;justify-content:flex-end;align-items:center}
.pro-trend-bars i{display:block;width:54%;min-width:20px;border-radius:4px 4px 0 0;background:linear-gradient(#5fa9dc,#1476d6)}
.pro-trend-bars i.current{background:linear-gradient(#8fc95a,#6cae38)}
.pro-trend-bars span{font-size:8px;font-weight:700;margin-top:6px}
.pro-trend-bars small{font-size:7px;color:#8d9aaa;margin:2px 0 7px}

.pro-side-card{padding:24px;background:#f8fafc}
.pro-side-card h3{font-size:17px;margin:6px 0 16px}
.pro-step{display:grid;grid-template-columns:32px 1fr;gap:10px;padding:12px 0;border-top:1px solid #e3e9ef}
.pro-step>span{font-family:Montserrat;font-size:10px;color:#6f879f;font-weight:700}
.pro-step b{font-size:10px;color:#263c55}
.pro-step p{font-size:8px;color:#7f8e9f;line-height:1.45;margin:2px 0 0}
.pro-side-note{margin-top:16px;padding:14px;border-radius:9px;background:#fff;border:1px solid #e0e7ee}
.pro-side-note span{font-size:8px;color:#8b98a7}
.pro-side-note b{display:block;font-size:11px;margin:4px 0 8px}
.pro-side-note>div{height:6px;border-radius:99px;background:#e9eef3;overflow:hidden}
.pro-side-note>div i{display:block;width:68%;height:100%;background:#7ac143}

/* Correction du décalage du HF Display après insertion du Sprint07 */
.sprint06-display{clear:both;position:relative;margin-top:0}
.sprint07-economy + .sprint06-display{padding-top:86px}
.sprint07-economy,
.sprint06-display{overflow:visible}
.sprint07-economy .container,
.sprint06-display .container{position:relative}

@media(max-width:1050px){
  .pro-economy-grid{grid-template-columns:1fr}
  .pro-s7-head h2{font-size:34px}
}
@media(max-width:700px){
  .pro-economy{padding-top:64px;padding-bottom:64px}
  .pro-main-top{flex-direction:column}
  .pro-main-metrics{grid-template-columns:1fr}
  .pro-trend-bars{gap:4px;padding:0}
  .pro-s7-head h2{font-size:30px}
}

/* =========================
   SPRINT 08 — MISE EN ŒUVRE
   ========================= */
.sprint08-deployment{background:#f4f7fa}
.s8-head{display:grid;grid-template-columns:1fr .8fr;gap:70px;align-items:end;margin-bottom:40px}
.s8-head h2{margin-bottom:0}.s8-head p{font-size:14px;color:var(--muted);line-height:1.65;margin:0 0 5px}
.s8-process{display:grid;grid-template-columns:1fr 32px 1fr 32px 1fr 32px 1fr;gap:9px;align-items:center}
.s8-process article{position:relative;min-height:230px;background:#fff;border:1px solid #dfe7ef;border-radius:14px;padding:22px;box-shadow:0 7px 22px rgba(7,35,70,.04)}
.s8-num{position:absolute;right:16px;top:14px;font-family:Montserrat;font-size:22px;font-weight:800;color:#e1e8ef}
.s8-process-icon{width:38px;height:38px;border-radius:9px;background:#edf5ff;color:var(--blue);display:grid;place-items:center;font-family:Montserrat;font-weight:800;font-size:12px;margin-bottom:17px}
.s8-process article:nth-of-type(3) .s8-process-icon{background:#eef8e8;color:#65aa36}
.s8-process h3{font-size:15px;margin:0 0 8px}.s8-process p{font-size:9px;line-height:1.55;color:#778699;min-height:57px;margin:0 0 17px}.s8-process article>span{font-size:8px;color:#4f6982;background:#f3f6f8;border-radius:99px;padding:6px 8px}
.s8-arrow{text-align:center;color:#9bb1c5;font-size:20px}
.s8-bottom{display:grid;grid-template-columns:1.35fr .65fr;gap:18px;margin-top:18px}
.s8-scale,.s8-benefit{border:1px solid #dfe7ef;border-radius:14px;background:#fff;padding:23px}
.s8-scale-head{display:flex;justify-content:space-between;align-items:flex-start;border-bottom:1px solid #e6ecf1;padding-bottom:15px}.s8-scale-head small,.s8-benefit>small{font-size:8px;letter-spacing:1px;color:#8493a5}.s8-scale-head h3{font-size:16px;margin:4px 0 0}.s8-scale-head>span{font-size:8px;color:#58718a;background:#f2f5f8;border-radius:99px;padding:6px 9px}
.s8-levels{display:grid;grid-template-columns:repeat(3,1fr);gap:0;margin-top:22px}.s8-levels>div{position:relative;padding-top:23px}.s8-levels>div:before{content:"";position:absolute;top:5px;left:0;right:0;border-top:2px solid #d9e3ec}.s8-levels>div:first-child:before{left:50%}.s8-levels>div:last-child:before{right:50%}.s8-levels i{position:absolute;top:0;left:calc(50% - 6px);width:12px;height:12px;border-radius:50%;background:#c8d5e1;border:3px solid #fff;box-shadow:0 0 0 1px #c8d5e1}.s8-levels .active i{background:#7ac143;box-shadow:0 0 0 1px #7ac143}.s8-levels>div>div{text-align:center}.s8-levels b,.s8-levels span{display:block}.s8-levels b{font-size:10px}.s8-levels span{font-size:8px;color:#8492a2;margin-top:3px}
.s8-benefit{background:linear-gradient(145deg,#071d3b,#0a315c);color:#fff}.s8-benefit>small{color:#7f9ab4}.s8-benefit h3{font-size:17px;margin:6px 0 10px}.s8-benefit p{font-size:9px;line-height:1.55;color:#a7bacd;margin:0}.s8-checks{display:grid;gap:9px;margin-top:18px}.s8-checks span{font-size:9px;color:#c3d2e0}.s8-checks span:before{content:"✓";color:#9bd45e;font-weight:900;margin-right:8px}
@media(max-width:1050px){.s8-head,.s8-bottom{grid-template-columns:1fr;gap:18px}.s8-process{grid-template-columns:1fr 1fr;gap:12px}.s8-arrow{display:none}}
@media(max-width:700px){.s8-process{grid-template-columns:1fr}.s8-process article{min-height:auto}.s8-levels{grid-template-columns:1fr;gap:13px}.s8-levels>div{padding:0 0 0 27px}.s8-levels>div:before{top:0;bottom:0;left:5px!important;right:auto!important;border-top:0;border-left:2px solid #d9e3ec}.s8-levels i{left:0;top:4px}.s8-levels>div>div{text-align:left}}

/* Sprint08 - Mise en œuvre : renforcement visuel bleu/vert HF */
.sprint08-deployment{
  background:
    radial-gradient(circle at 12% 10%, rgba(20,118,214,.08), transparent 28%),
    radial-gradient(circle at 88% 16%, rgba(122,193,67,.10), transparent 30%),
    #f5f8fb;
}
.s8-process article{
  overflow:hidden;
  border-color:#d6e3ee;
  box-shadow:0 10px 28px rgba(7,35,70,.06);
}
.s8-process article:before{
  content:"";
  position:absolute;
  left:0;top:0;bottom:0;
  width:4px;
  background:var(--blue);
}
.s8-process article:nth-of-type(3):before,
.s8-process article:nth-of-type(7):before{
  background:var(--green);
}
.s8-process article:nth-of-type(5):before{
  background:linear-gradient(var(--blue),var(--green));
}
.s8-process article:nth-of-type(1){
  background:linear-gradient(180deg,#ffffff 0%,#f3f8fd 100%);
}
.s8-process article:nth-of-type(3){
  background:linear-gradient(180deg,#ffffff 0%,#f5faef 100%);
}
.s8-process article:nth-of-type(5){
  background:linear-gradient(180deg,#ffffff 0%,#f2f8f7 100%);
}
.s8-process article:nth-of-type(7){
  background:linear-gradient(180deg,#ffffff 0%,#f7faef 100%);
}
.s8-process article:nth-of-type(1) .s8-process-icon{
  background:#e8f3fd;color:#0f6fca;
}
.s8-process article:nth-of-type(3) .s8-process-icon{
  background:#eef8e8;color:#63a832;
}
.s8-process article:nth-of-type(5) .s8-process-icon{
  background:linear-gradient(135deg,#eaf4fd,#eff8e9);
  color:#2c6e7f;
}
.s8-process article:nth-of-type(7) .s8-process-icon{
  background:#eef8e8;color:#63a832;
}
.s8-arrow{
  color:#2f84c9;
  font-weight:800;
  opacity:.9;
}
.s8-process article>span{
  background:#eef4f8;
  border:1px solid #dbe5ed;
  color:#3d5f7c;
  font-weight:600;
}
.s8-process article:nth-of-type(3)>span,
.s8-process article:nth-of-type(7)>span{
  background:#f0f8e9;
  border-color:#dcebcf;
  color:#5f9438;
}
.s8-scale{
  background:linear-gradient(180deg,#ffffff 0%,#f8fbfd 100%);
  box-shadow:0 8px 24px rgba(7,35,70,.045);
}
.s8-scale-head{border-bottom-color:#dfe8ef}
.s8-scale-head>span{
  background:#eaf4fd;
  color:#1767aa;
  border:1px solid #d3e5f4;
}
.s8-levels>div:before{border-color:#bdd2e3}
.s8-levels i{
  background:#9bb8d0;
  box-shadow:0 0 0 1px #9bb8d0;
}
.s8-levels .active i{
  background:#7ac143;
  box-shadow:0 0 0 1px #7ac143,0 0 0 5px rgba(122,193,67,.12);
}
.s8-levels>div:nth-child(2) i{
  background:#1476d6;
  box-shadow:0 0 0 1px #1476d6,0 0 0 5px rgba(20,118,214,.09);
}
.s8-levels>div:nth-child(3) i{
  background:#4b95cb;
  box-shadow:0 0 0 1px #4b95cb;
}
.s8-benefit{
  background:
    radial-gradient(circle at 85% 10%,rgba(122,193,67,.16),transparent 30%),
    linear-gradient(145deg,#071d3b,#0a315c);
  border-color:#123e69;
}
.s8-checks span:before{
  background:rgba(122,193,67,.12);
  border-radius:50%;
  display:inline-grid;
  place-items:center;
  width:17px;height:17px;
  margin-right:8px;
}
@media(max-width:700px){
  .s8-process article:before{width:3px}
}

/* Sprint08 - équilibrage du pavé Objectif en bas à droite */
.s8-benefit{
  background:linear-gradient(145deg,#f7fafc,#eef5f8);
  border-color:#d5e3ec;
  color:#1b3450;
  box-shadow:0 8px 24px rgba(7,35,70,.05);
}
.s8-benefit>small{color:#2674b5}
.s8-benefit h3{color:#183653}
.s8-benefit p{color:#718399}
.s8-checks span{color:#405a72}
.s8-checks span:before{
  color:#68ad35;
  background:#eef8e8;
}

/* =========================
   SPRINT 09 — FIABILITÉ
   ========================= */
.sprint09-security{background:#fff}
.s9-head{display:grid;grid-template-columns:1fr .8fr;gap:70px;align-items:end;margin-bottom:38px}
.s9-head h2{margin-bottom:0}.s9-head p{font-size:14px;color:var(--muted);line-height:1.65;margin:0 0 5px}
.s9-board{display:grid;grid-template-columns:1.35fr .65fr;gap:18px}
.s9-status,.s9-diagnostic{border:1px solid #dfe7ef;border-radius:14px;background:#f9fbfc;padding:23px}
.s9-status-head{display:flex;justify-content:space-between;align-items:flex-start;padding-bottom:16px;border-bottom:1px solid #e3e9ef}
.s9-status-head>div{display:flex;flex-direction:column}.s9-status-head small,.s9-diagnostic>small{font-size:8px;letter-spacing:1px;color:#8493a5}.s9-status-head strong{font-family:Montserrat;font-size:15px;margin-top:3px}.s9-status-head>span{font-size:8px;color:#58823c;background:#f0f8e9;border:1px solid #dcebcf;border-radius:99px;padding:6px 9px}.s9-status-head>span i{display:inline-block;width:6px;height:6px;border-radius:50%;background:#7ac143;margin-right:5px}
.s9-devices{display:grid;grid-template-columns:1fr 1fr;gap:0 22px;margin-top:8px}.s9-devices>div{display:grid;grid-template-columns:16px 1fr auto;gap:8px;align-items:center;padding:12px 0;border-bottom:1px solid #e7ecf1}.s9-devices>div>div{display:flex;flex-direction:column}.s9-devices b{font-size:10px}.s9-devices small{font-size:8px;color:#8b98a7}.s9-devices>div>strong{font-size:8px;color:#66983f}
.s9-dot{display:block;width:9px;height:9px;border-radius:50%}.s9-dot.ok{background:#7ac143;box-shadow:0 0 0 4px rgba(122,193,67,.1)}.s9-dot.pv{background:#1476d6;box-shadow:0 0 0 4px rgba(20,118,214,.09)}.s9-dot.off{background:#d85d5d;box-shadow:0 0 0 4px rgba(216,93,93,.09)}
.s9-diagnostic{background:linear-gradient(180deg,#f8fbfd,#f3f7fa)}.s9-diagnostic h3{font-size:18px;margin:6px 0 9px}.s9-diagnostic>p{font-size:9px;line-height:1.55;color:#7b899a;margin:0}
.s9-alert-demo{display:grid;grid-template-columns:17px 1fr;gap:10px;align-items:center;margin-top:19px;padding:13px;background:#fff;border:1px solid #eadede;border-radius:9px}.s9-alert-demo div{display:flex;flex-direction:column}.s9-alert-demo b{font-size:9px;color:#6d4141}.s9-alert-demo small{font-size:7px;color:#9a7b7b}
.s9-rule{margin-top:11px;padding:13px;background:#edf5fb;border-radius:9px;border:1px solid #d7e6f2}.s9-rule span,.s9-rule b{display:block}.s9-rule span{font-size:7px;color:#7990a6}.s9-rule b{font-size:10px;color:#315b80;margin-top:2px}
.s9-pillars{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin-top:18px}.s9-pillars article{border:1px solid #e0e7ee;border-radius:11px;padding:17px;background:#fff}.s9-pillars article>div{font-family:Montserrat;font-size:17px;font-weight:800;color:#d5e0e9}.s9-pillars b{display:block;font-family:Montserrat;font-size:10px;margin:7px 0 4px}.s9-pillars p{font-size:8px;color:#7e8c9c;line-height:1.5;margin:0}
@media(max-width:1050px){.s9-head,.s9-board{grid-template-columns:1fr;gap:18px}.s9-pillars{grid-template-columns:repeat(2,1fr)}}
@media(max-width:700px){.s9-devices,.s9-pillars{grid-template-columns:1fr}.s9-status-head{flex-direction:column;gap:10px}}

/* Sprint09 - lisibilité renforcée du cadre Supervision / état installation */
.s9-status{
  background:#ffffff;
  border-color:#cbd9e5;
}
.s9-status-head small{
  color:#52677d;
  font-size:9px;
  font-weight:700;
}
.s9-status-head strong{
  color:#142d49;
  font-size:16px;
}
.s9-devices b{
  color:#172f49;
  font-size:11px;
  font-weight:700;
}
.s9-devices small{
  color:#566b80;
  font-size:9px;
  font-weight:500;
}
.s9-devices>div>strong{
  color:#4f842d;
  font-size:9px;
  font-weight:700;
}
.s9-devices>div{
  border-bottom-color:#d9e3eb;
}
.s9-status-head>span{
  color:#416d27;
  font-size:9px;
  font-weight:700;
  background:#edf7e7;
  border-color:#cfe3c0;
}

/* Même amélioration sur le petit texte du diagnostic adjacent */
.s9-diagnostic>small{
  color:#52677d;
  font-size:9px;
  font-weight:700;
}
.s9-diagnostic>p{
  color:#566b80;
  font-size:10px;
}
.s9-alert-demo small{
  color:#765f5f;
  font-size:8px;
}
.s9-rule span{
  color:#526d86;
  font-size:8px;
}

/* Sprint10 - finition finale */
.sprint10-final{padding:88px 0 48px;color:#fff;background:radial-gradient(circle at 78% 15%,rgba(122,193,67,.13),transparent 28%),linear-gradient(135deg,#06182f,#082a51 62%,#0a365f)}
.s10-shell{display:grid;grid-template-columns:1.15fr .85fr;gap:55px;align-items:center}
.s10-copy h2{font-size:42px;line-height:1.14;max-width:690px;margin-bottom:18px}.s10-copy>p{font-size:15px;line-height:1.7;color:#b8c9da;max-width:670px}
.s10-reassurance{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-top:27px}.s10-reassurance>div{display:grid;grid-template-columns:25px 1fr;gap:8px;padding:12px;background:rgba(255,255,255,.045);border:1px solid rgba(255,255,255,.08);border-radius:10px}.s10-reassurance i{width:21px;height:21px;border-radius:50%;display:grid;place-items:center;background:rgba(122,193,67,.13);color:#9bd45e;font-style:normal;font-size:9px;font-weight:900}.s10-reassurance span{display:flex;flex-direction:column}.s10-reassurance b{font-size:9px}.s10-reassurance small{font-size:7px;color:#8fa7bf}
.s10-contact-card{background:#fff;color:#172d47;border-radius:16px;padding:28px;box-shadow:0 22px 50px rgba(0,0,0,.18)}.s10-contact-card>small{font-size:8px;letter-spacing:1.2px;color:#2473b5;font-weight:800}.s10-contact-card h3{font-size:22px;margin:7px 0 10px}.s10-contact-card>p{font-size:10px;line-height:1.6;color:#718196}
.s10-main-btn{display:flex;justify-content:space-between;align-items:center;margin-top:22px;padding:14px 16px;border-radius:9px;background:linear-gradient(135deg,#72b93f,#65aa34);color:#fff;font-size:10px;font-weight:800}.s10-main-btn b{font-size:17px}
.s10-contact-note{display:flex;justify-content:space-between;border-top:1px solid #e4eaf0;margin-top:18px;padding-top:13px}.s10-contact-note span{font-family:Montserrat;font-size:9px;font-weight:800;color:#173a5e}.s10-contact-note small{font-size:7px;color:#8997a6}
.s10-summary{display:grid;grid-template-columns:1fr 40px 1fr 40px 1fr 40px 1fr;align-items:center;margin-top:46px;padding-top:25px;border-top:1px solid rgba(255,255,255,.1)}.s10-summary>div{text-align:center;display:flex;flex-direction:column}.s10-summary>div span{font-family:Montserrat;font-size:8px;color:#7ac143}.s10-summary>div b{font-family:Montserrat;font-size:11px;margin:3px}.s10-summary>div small{font-size:7px;color:#829bb4}.s10-summary>i{height:1px;background:linear-gradient(90deg,rgba(20,118,214,.4),rgba(122,193,67,.5))}
@media(max-width:1050px){.s10-shell{grid-template-columns:1fr}}
@media(max-width:700px){.s10-copy h2{font-size:32px}.s10-reassurance{grid-template-columns:1fr}.s10-summary{grid-template-columns:1fr 1fr;gap:16px}.s10-summary>i{display:none}}

/* DEMO FINALE - synoptique des armoires animé */
.hf-live-demo{margin-top:18px;border:1px solid #dce6ef;border-radius:14px;background:linear-gradient(180deg,#fbfdff,#f4f8fb);padding:18px;overflow:hidden}
.hf-demo-head{display:flex;justify-content:space-between;align-items:flex-start;padding-bottom:13px;border-bottom:1px solid #e2e9ef}.hf-demo-head>div{display:flex;flex-direction:column}.hf-demo-head small{font-size:7px;letter-spacing:1px;color:#2975b4;font-weight:800}.hf-demo-head b{font-size:10px;color:#2a4058;margin-top:3px}.hf-demo-head>span{font-size:7px;color:#56813b;background:#eef8e8;border:1px solid #d7e9ca;border-radius:99px;padding:5px 8px}.hf-demo-head>span i{display:inline-block;width:6px;height:6px;border-radius:50%;background:#7ac143;margin-right:5px;animation:hfPulse 1.8s infinite}
.hf-demo-tree{padding:18px 15px 6px}.hf-demo-building{width:180px;margin:auto;padding:10px 13px;border:1px solid #bcd5e9;border-radius:10px;background:#fff;display:grid;grid-template-columns:34px 1fr;gap:9px;align-items:center;box-shadow:0 5px 15px rgba(7,35,70,.05)}.hf-demo-icon{width:32px;height:32px;border-radius:8px;background:#eaf4fd;color:#1476d6;display:grid;place-items:center;font-family:Montserrat;font-size:9px;font-weight:800}.hf-demo-building div{display:flex;flex-direction:column}.hf-demo-building b{font-size:9px}.hf-demo-building small{font-size:7px;color:#6f8195}
.hf-demo-trunk{height:42px;width:70%;margin:auto;position:relative;border-bottom:2px solid #6fa9d6}.hf-demo-trunk:before{content:"";position:absolute;left:50%;top:0;height:42px;border-left:2px solid #1476d6}.hf-demo-trunk i{position:absolute;bottom:-4px;width:7px;height:7px;border-radius:50%;background:#1476d6}.hf-demo-trunk i:nth-child(1){left:0}.hf-demo-trunk i:nth-child(2){left:calc(50% - 3px);background:#7ac143}.hf-demo-trunk i:nth-child(3){right:0}.hf-demo-trunk:after{content:"";position:absolute;left:calc(50% - 3px);top:3px;width:6px;height:6px;border-radius:50%;background:#7ac143;animation:hfFlow 2.2s linear infinite}
.hf-demo-tds{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;width:82%;margin:0 auto}.hf-demo-tds article{position:relative;text-align:center;padding:12px 8px;border:1px solid #dce5ed;border-radius:9px;background:#fff}.hf-demo-tds article:before{content:"";position:absolute;left:50%;top:-13px;height:13px;border-left:2px solid #6fa9d6}.hf-demo-tds article>span{display:inline-grid;place-items:center;width:27px;height:22px;border-radius:5px;background:#edf5fb;color:#226ba8;font-size:7px;font-weight:800}.hf-demo-tds b,.hf-demo-tds small,.hf-demo-tds em{display:block}.hf-demo-tds b{font-size:8px;margin-top:5px}.hf-demo-tds small{font-size:8px;color:#5e7186}.hf-demo-tds em{font-size:6px;font-style:normal;color:#68a13d;margin-top:3px}
.hf-demo-note{display:flex;justify-content:center;gap:10px;align-items:center;border-top:1px solid #e2e9ef;padding-top:10px;margin-top:8px;font-size:7px;color:#63768b}.hf-demo-note i{font-style:normal;color:#7ac143;font-weight:800}
@keyframes hfFlow{0%{top:3px;opacity:.2}50%{opacity:1}100%{top:34px;opacity:.2}}@keyframes hfPulse{0%,100%{box-shadow:0 0 0 0 rgba(122,193,67,.2)}50%{box-shadow:0 0 0 5px rgba(122,193,67,0)}}
@media(max-width:700px){.hf-demo-tds{width:100%;gap:5px}.hf-demo-trunk{width:78%}.hf-demo-head{gap:8px}.hf-demo-head>span{white-space:nowrap}}

/* DEMO FINALE - TD interactifs */
.hf-td-demo{margin-top:18px}
.hf-levels{display:grid;gap:14px;padding:18px 0 6px}
.hf-level-row{
  display:grid;
  grid-template-columns:120px repeat(3,minmax(0,1fr));
  gap:10px;
  align-items:stretch;
}
.hf-level-name{
  border-radius:10px;
  background:linear-gradient(180deg,#edf5fb,#f7fafc);
  border:1px solid #dce6ef;
  display:flex;
  flex-direction:column;
  justify-content:center;
  padding:13px;
}
.hf-level-name b{font-family:Montserrat;font-size:12px;color:#1f5f94}
.hf-level-name span{font-size:8px;color:#718399;margin-top:3px}

.hf-td-card{
  appearance:none;
  border:1px solid #dce5ed;
  background:#fff;
  border-radius:10px;
  padding:13px 14px;
  text-align:left;
  cursor:pointer;
  transition:.2s ease;
  box-shadow:0 4px 14px rgba(7,35,70,.04);
}
.hf-td-card:hover{
  transform:translateY(-1px);
  border-color:#a9cbe6;
  box-shadow:0 8px 22px rgba(7,35,70,.07);
}
.hf-td-card[aria-expanded="true"]{
  border-color:#1476d6;
  background:linear-gradient(180deg,#fff,#f2f8fd);
  box-shadow:0 0 0 3px rgba(20,118,214,.08);
}
.hf-td-top{
  display:grid;
  grid-template-columns:10px auto 1fr;
  gap:7px;
  align-items:center;
}
.hf-td-status{
  width:8px;height:8px;border-radius:50%;
  background:#7ac143;
  box-shadow:0 0 0 4px rgba(122,193,67,.10);
}
.hf-td-top b{font-size:10px;color:#20374f}
.hf-td-top small{font-size:7px;color:#6d9d49;text-align:right}
.hf-td-card>strong{
  display:block;
  margin:10px 0 2px;
  font-family:Montserrat;
  font-size:21px;
  color:#173a5e;
}
.hf-td-card>strong em{font-style:normal;font-size:9px;color:#7890a5}
.hf-td-hint{font-size:7px;color:#748699}

.hf-td-detail{
  margin-top:14px;
  border-top:1px solid #e1e8ef;
  padding-top:14px;
}
.hf-td-detail-empty{
  min-height:72px;
  display:flex;
  align-items:center;
  justify-content:center;
  gap:10px;
  color:#7b8c9e;
  font-size:9px;
}
.hf-td-detail-empty span{font-size:17px;color:#7ac143}
.hf-td-detail-empty p{margin:0}

.hf-td-detail-card{
  border:1px solid #dbe5ed;
  border-radius:11px;
  background:#fff;
  padding:15px;
}
.hf-td-detail-head{
  display:flex;
  justify-content:space-between;
  gap:15px;
  align-items:flex-start;
  padding-bottom:12px;
  border-bottom:1px solid #e5ebf1;
}
.hf-td-detail-head>div{display:flex;flex-direction:column}
.hf-td-detail-head small{font-size:7px;color:#7c8d9f;letter-spacing:.8px}
.hf-td-detail-head b{font-family:Montserrat;font-size:13px;margin-top:2px;color:#203a55}
.hf-td-detail-head strong{font-family:Montserrat;font-size:20px;color:#1476d6}
.hf-td-detail-head strong em{font-style:normal;font-size:8px;color:#7e91a5}

.hf-td-breakdown{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:10px;
  margin-top:12px;
}
.hf-usage{
  border-radius:9px;
  border:1px solid #e0e7ee;
  padding:12px;
  background:#f9fbfd;
}
.hf-usage span,.hf-usage b,.hf-usage small{display:block}
.hf-usage span{font-size:8px;color:#75879a}
.hf-usage b{font-family:Montserrat;font-size:15px;margin:4px 0;color:#223d58}
.hf-usage small{font-size:7px;color:#93a0ae}
.hf-usage-bar{height:6px;border-radius:99px;background:#e8eef3;overflow:hidden;margin-top:8px}
.hf-usage-bar i{display:block;height:100%;border-radius:99px}
.hf-usage.ecl .hf-usage-bar i{background:#7ac143}
.hf-usage.pc .hf-usage-bar i{background:#1476d6}
.hf-usage.process .hf-usage-bar i{background:#6b8aa6}

@media(max-width:900px){
  .hf-level-row{grid-template-columns:100px repeat(2,minmax(0,1fr))}
}
@media(max-width:700px){
  .hf-level-row{grid-template-columns:1fr 1fr}
  .hf-level-name{grid-column:1/-1}
  .hf-td-breakdown{grid-template-columns:1fr}
}

/* DEMO FINALE - synoptique réaliste conforme au logiciel */
.hf-real-synoptic{
  margin-top:18px;
  border-radius:16px;
  overflow:hidden;
  border:1px solid #50555a;
  background:linear-gradient(180deg,#43484c,#31363a);
  color:#fff;
  box-shadow:0 18px 45px rgba(0,0,0,.16);
}
.hf-real-head{
  display:flex;justify-content:space-between;align-items:center;
  padding:13px 17px;border-bottom:1px solid #555b60;
  background:rgba(20,23,25,.24)
}
.hf-real-head>div{display:flex;flex-direction:column}
.hf-real-head small{font-size:7px;letter-spacing:1.2px;color:#8fb6ff}
.hf-real-head b{font-size:10px;margin-top:2px}
.hf-real-head>span{font-size:7px;color:#b8dc72;border:1px solid #606961;border-radius:99px;padding:5px 8px;background:#343a35}
.hf-real-head>span i{display:inline-block;width:6px;height:6px;border-radius:50%;background:#a8d44c;margin-right:5px}

.hf-real-canvas{position:relative;height:760px;min-width:1120px;background:radial-gradient(circle at 50% 0%,rgba(255,255,255,.035),transparent 34%)}
.hf-real-lines{position:absolute;inset:0;width:100%;height:100%;pointer-events:none}
.hf-real-lines path{fill:none;stroke-width:2.5}
.hf-real-lines .main-line{stroke:#6ea2ff;filter:drop-shadow(0 0 2px rgba(110,162,255,.35))}
.hf-real-lines .pv-line{stroke:#a8d44c}
.hf-real-lines .grid-line{stroke:#d66a63}

.hf-real-node,.hf-building-node,.hf-real-td{
  position:absolute;
  width:18%;
  min-width:205px;
  border:1px solid #5c6166;
  border-radius:10px;
  background:linear-gradient(180deg,#464b4f,#383d41);
  box-shadow:0 7px 17px rgba(0,0,0,.16), inset 0 1px rgba(255,255,255,.025);
  padding:12px 12px 12px 13px;
  display:grid;
  grid-template-columns:54px 1fr;
  gap:10px;
  align-items:center;
  color:#fff;
}
.hf-real-node.tgbt{width:20%;border-color:#7399e8;box-shadow:0 0 0 1px rgba(115,153,232,.3),0 8px 20px rgba(0,0,0,.17)}
.hf-real-node.grid-source{width:18%}
.hf-building-node{width:18%;min-height:95px}
.hf-real-td{
  width:18%;
  border:1px solid #5d6266;
  cursor:pointer;
  font-family:inherit;
  text-align:left;
  min-height:96px;
  transition:.18s ease;
}
.hf-real-td:hover{border-color:#789be1;transform:translateY(-1px)}
.hf-real-td.active{border-color:#81a7ff;box-shadow:0 0 0 2px rgba(110,162,255,.16),0 8px 18px rgba(0,0,0,.16)}

.hf-real-status{position:absolute;right:9px;top:9px;width:8px;height:8px;border-radius:50%;box-shadow:0 0 7px currentColor}
.hf-real-status.amber{background:#e4c94a;color:#e4c94a}.hf-real-status.green{background:#a8d44c;color:#a8d44c}

.hf-real-icon{
  width:46px;height:62px;border-radius:3px;
  display:grid;place-items:center;
  background:linear-gradient(90deg,#d9dcde,#fff 48%,#aeb2b5);
  color:#171a1c;font-size:25px;
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.45),0 1px 3px rgba(0,0,0,.25)
}
.hf-real-icon.pv{height:38px;background:transparent;color:#9fb8ea;font-size:37px;box-shadow:none}
.hf-real-icon.breaker{font-size:18px}.hf-real-icon.tall{height:64px}

.hf-real-copy{display:flex;flex-direction:column;min-width:0}
.hf-real-copy b{font-size:9px;line-height:1.2;color:#fff}
.hf-real-copy strong{font-family:Montserrat;font-size:21px;line-height:1.1;color:#76a2ff;margin:6px 0 4px}
.pv-source .hf-real-copy strong,.pv-breaker .hf-real-copy strong{color:#a8d44c}
.hf-real-copy strong em{font-style:normal;font-size:10px}
.hf-real-copy small{font-size:7px;line-height:1.35;color:#e1e4e6}

.hf-real-detail-panel{border-top:1px solid #555b60;background:#282d31;padding:14px 18px}
.hf-real-detail-empty{display:flex;justify-content:space-between;gap:20px;align-items:center;color:#aeb5bb}
.hf-real-detail-empty b{font-size:10px;color:#fff}.hf-real-detail-empty span{font-size:8px}
.hf-real-detail-card{display:grid;grid-template-columns:190px 1fr;gap:16px;align-items:center}
.hf-real-detail-title small,.hf-real-detail-title b,.hf-real-detail-title strong{display:block}
.hf-real-detail-title small{font-size:7px;color:#8ea0b0;letter-spacing:1px}
.hf-real-detail-title b{font-size:11px;margin:3px 0}
.hf-real-detail-title strong{font-family:Montserrat;font-size:24px;color:#76a2ff}
.hf-real-detail-title strong em{font-style:normal;font-size:9px}
.hf-real-detail-usages{display:grid;grid-template-columns:repeat(3,1fr);gap:9px}
.hf-real-usage{padding:10px;border:1px solid #4c5358;border-radius:8px;background:#353b40}
.hf-real-usage span,.hf-real-usage b,.hf-real-usage small{display:block}
.hf-real-usage span{font-size:7px;color:#b7c0c8}.hf-real-usage b{font-family:Montserrat;font-size:14px;margin:3px 0}.hf-real-usage small{font-size:7px;color:#8e9aa4}
.hf-real-usage-bar{height:5px;background:#24292d;border-radius:99px;overflow:hidden;margin-top:7px}
.hf-real-usage-bar i{display:block;height:100%}
.hf-real-usage.ecl i{background:#a8d44c}.hf-real-usage.pc i{background:#6ea2ff}.hf-real-usage.process i{background:#8b949c}

@media(max-width:1200px){
  .hf-real-synoptic{overflow-x:auto}
}

/* Correction DEMO FINALE - affichage COMPLET du synoptique */
.hf-real-synoptic{
  overflow:visible;
}
.hf-real-canvas{
  height:980px;
  min-width:1180px;
  overflow:visible;
}
.hf-real-lines{
  overflow:visible;
}

/* Le synoptique de démonstration utilise toute la largeur disponible */
.platform .hf-real-synoptic{
  width:100%;
  min-width:0;
}
.platform .synoptic{
  overflow:visible;
}
@media(min-width:1051px){
  .platform .section-grid{
    grid-template-columns:1fr;
  }
  .platform .visual{
    width:100%;
    max-width:1180px;
    margin:0 auto;
  }
  .platform .section-copy{
    width:min(900px,100%);
    margin:50px auto 0;
  }
}

/* =========================================
   VERSION FINALE DEMO — animations sobres
   ========================================= */
.hf-real-head-actions{
  display:flex;
  align-items:center;
  gap:8px;
}
.hf-demo-state,
.hf-comm-state{
  font-size:7px;
  border-radius:99px;
  padding:5px 8px;
  border:1px solid #5a6267;
  background:#33383c;
  white-space:nowrap;
}
.hf-demo-state{color:#8fb6ff}
.hf-comm-state{color:#b8dc72}
.hf-demo-state i,
.hf-comm-state i{
  display:inline-block;
  width:6px;height:6px;border-radius:50%;
  margin-right:5px;
}
.hf-demo-state i{background:#6ea2ff}
.hf-comm-state i{background:#a8d44c}

.hf-flow-anim{
  stroke-dasharray:10 9;
  animation:hfDashFlow 1.15s linear infinite;
}
.hf-flow-green{animation-duration:1.05s}
.hf-flow-red{animation-duration:1.3s}
.hf-flow-blue{animation-duration:1.18s}

@keyframes hfDashFlow{
  from{stroke-dashoffset:0}
  to{stroke-dashoffset:-38}
}

/* Petite mise en mouvement initiale des nœuds principaux */
.hf-real-node,
.hf-building-node{
  animation:hfNodeIntro .55s ease both;
}
.hf-real-node:nth-of-type(1){animation-delay:.1s}
.hf-real-node:nth-of-type(2){animation-delay:.2s}
.hf-real-node:nth-of-type(3){animation-delay:.3s}
.hf-real-node:nth-of-type(4){animation-delay:.4s}

@keyframes hfNodeIntro{
  from{opacity:.72;transform:translateY(4px)}
  to{opacity:1;transform:translateY(0)}
}

/* Après la courte démonstration, tout redevient calme */
body.hf-demo-settled .hf-flow-anim{
  animation:none;
  stroke-dasharray:none;
}
body.hf-demo-settled .hf-demo-state{
  color:#9aa6b0;
  background:#34393d;
}
body.hf-demo-settled .hf-demo-state i{
  background:#7c8993;
}

/* HF Display : apparition douce uniquement à l'entrée dans la fenêtre */
.hf-display-showcase{
  position:relative;
  opacity:.96;
  transform:translateY(8px);
  transition:opacity .65s ease,transform .65s ease;
}
.hf-display-showcase.hf-in-view{
  opacity:1;
  transform:translateY(0);
}
.hf-display-badge{
  position:absolute;
  top:12px;
  right:12px;
  z-index:3;
  font-size:7px;
  font-weight:800;
  letter-spacing:.8px;
  color:#d9ecbe;
  background:rgba(34,45,37,.88);
  border:1px solid rgba(122,193,67,.4);
  border-radius:99px;
  padding:6px 9px;
  backdrop-filter:blur(4px);
}
@media(prefers-reduced-motion:reduce){
  .hf-flow-anim,
  .hf-real-node,
  .hf-building-node{
    animation:none!important;
  }
  .hf-display-showcase{
    transition:none;
    opacity:1;
    transform:none;
  }
}

/* VERSION FINALE DEMO — animation visible */
.hf-flow-particles{
  position:absolute;
  inset:0;
  z-index:4;
  pointer-events:none;
}
.particle{
  position:absolute;
  width:10px;
  height:10px;
  border-radius:50%;
  opacity:0;
  box-shadow:0 0 12px currentColor,0 0 20px currentColor;
}
.particle.pv{background:#b9e35c;color:#b9e35c}
.particle.grid{background:#e77970;color:#e77970}
.particle.main{background:#82adff;color:#82adff}

/* PV vers TGBT */
.p1{left:17%;top:10%;animation:hfPVFlow1 2.4s linear 3}
.p2{left:34%;top:10%;animation:hfPVFlow2 2.4s linear .45s 3}

/* Réseau vers TGBT */
.p3{left:70%;top:10%;animation:hfGridFlow 2.6s linear .2s 3}

/* TGBT vers bâtiments */
.p4{left:49.7%;top:15%;animation:hfMainDown 2.8s linear .3s 3}
.p5{left:49.7%;top:23%;animation:hfMainLeft 3.0s linear .8s 2}
.p6{left:49.7%;top:23%;animation:hfMainRight 3.0s linear 1.0s 2}
.p7{left:49.7%;top:23%;animation:hfMainCenter 2.8s linear 1.2s 2}

@keyframes hfPVFlow1{
  0%{left:17%;top:10%;opacity:0}
  12%{opacity:1}
  70%{left:41%;top:10%;opacity:1}
  100%{left:48%;top:15%;opacity:0}
}
@keyframes hfPVFlow2{
  0%{left:34%;top:10%;opacity:0}
  10%{opacity:1}
  75%{left:44%;top:10%;opacity:1}
  100%{left:49%;top:15%;opacity:0}
}
@keyframes hfGridFlow{
  0%{left:70%;top:10%;opacity:0}
  12%{opacity:1}
  75%{left:58%;top:10%;opacity:1}
  100%{left:51%;top:15%;opacity:0}
}
@keyframes hfMainDown{
  0%{left:49.7%;top:16%;opacity:0}
  15%{opacity:1}
  100%{left:49.7%;top:30%;opacity:0}
}
@keyframes hfMainLeft{
  0%{left:49.7%;top:24%;opacity:0}
  15%{opacity:1}
  72%{left:13%;top:24%;opacity:1}
  100%{left:13%;top:36%;opacity:0}
}
@keyframes hfMainRight{
  0%{left:49.7%;top:24%;opacity:0}
  15%{opacity:1}
  72%{left:80%;top:24%;opacity:1}
  100%{left:80%;top:36%;opacity:0}
}
@keyframes hfMainCenter{
  0%{left:49.7%;top:24%;opacity:0}
  15%{opacity:1}
  70%{left:57%;top:24%;opacity:1}
  100%{left:57%;top:36%;opacity:0}
}

/* Valeurs clairement animées pendant la démo */
.hf-live-value{
  animation:hfValuePulse 1.4s ease-in-out 5;
}
@keyframes hfValuePulse{
  0%,100%{filter:none;transform:scale(1)}
  50%{filter:drop-shadow(0 0 5px currentColor);transform:scale(1.045)}
}

/* Après stabilisation : arrêt complet */
body.hf-demo-settled .particle,
body.hf-demo-settled .hf-live-value{
  animation:none!important;
  opacity:0;
  transform:none;
  filter:none;
}

/* Bouton discret pour rejouer la démonstration */
.hf-replay-demo{
  margin-left:6px;
  border:1px solid #626a70;
  background:#3a4044;
  color:#d6dee6;
  border-radius:7px;
  padding:5px 8px;
  font-size:7px;
  cursor:pointer;
}
.hf-replay-demo:hover{
  border-color:#82adff;
  color:#fff;
}

/* Correction finale : animation déclenchée à l'arrivée sur le synoptique */
.hf-flow-anim{
  stroke-dasharray:none!important;
  animation:none!important;
}
.particle{
  width:5px!important;
  height:5px!important;
  box-shadow:0 0 5px currentColor,0 0 9px currentColor!important;
}
.hf-real-synoptic.hf-await-demo .particle,
.hf-real-synoptic.hf-await-demo .hf-live-value{
  animation:none!important;
  opacity:0;
}
.hf-real-synoptic.hf-demo-running{
  box-shadow:0 18px 45px rgba(0,0,0,.16),0 0 0 1px rgba(110,162,255,.08);
}

/* =========================================
   VERSION FINALE NETTOYEE
   ========================================= */
.skip-link{
  position:fixed;left:14px;top:-60px;z-index:9999;
  padding:10px 14px;border-radius:7px;background:#fff;color:#0a315c;
  font-size:13px;font-weight:800;box-shadow:0 5px 18px rgba(0,0,0,.18)
}
.skip-link:focus{top:12px}

a:focus-visible,button:focus-visible{
  outline:3px solid #9bd45e;
  outline-offset:3px;
}
.hf-real-td:focus-visible{
  outline:3px solid #9bd45e;
  outline-offset:3px;
  border-color:#9bd45e;
}

/* navigation : 6 éléments seulement */
.nav{gap:20px}
.nav a{font-size:13px}

/* Petits textes : plancher de lisibilité dans les sections de contenu */
.sprint04-archives small,.sprint05-connect small,.sprint08-deployment small,
.sprint09-security small,.sprint07-economy small{
  letter-spacing:.2px;
}
.s4-summary small,.s4-summary span,.s4-tr,.s4-report p,
.s5-devices small,.s5-outputs small,.s5-devices article>span,.s5-capabilities p,
.s8-process p,.s8-process article>span,.s8-levels span,.s8-benefit p,
.s9-devices small,.s9-devices>div>strong,.s9-diagnostic>p,.s9-pillars p{
  font-size:9px;
  color:#5f7184;
}
.s8-benefit p,.s8-benefit .s8-checks span{color:#405a72}

/* Histoire produit : synoptique -> HF Display */
.product-story{background:#eef4f8;border-top:1px solid #dbe5ed;border-bottom:1px solid #dbe5ed}
.product-story .container{
  min-height:58px;display:flex;align-items:center;justify-content:center;gap:18px;
  font-size:10px;font-weight:700;color:#3e5871
}
.product-story i{font-style:normal;color:#70b33d;font-size:16px}

/* Le synoptique est désormais la démonstration majeure */
.platform{padding-bottom:76px}
.platform .section-copy{max-width:900px}
.platform .section-copy p{max-width:760px}

/* Mobile : le diagramme conserve son sens, mais on évite de casser toute la page */
@media(max-width:700px){
  .product-story .container{flex-direction:column;gap:3px;padding:12px 0;text-align:center}
  .product-story i{transform:rotate(90deg)}
  .hf-real-synoptic{
    overflow-x:auto;
    overscroll-behavior-x:contain;
    -webkit-overflow-scrolling:touch;
  }
  .hf-real-canvas{min-width:1080px}
  .hf-real-synoptic:before{
    content:"Faire glisser horizontalement pour parcourir le synoptique";
    display:block;
    position:sticky;left:0;
    padding:7px 12px;
    background:#272c30;color:#d2d9df;
    font-size:9px;text-align:center;
    z-index:8;
  }
}

/* contraste et taille minimale des légendes importantes */
.hf-real-copy small{font-size:8px;color:#f0f2f3}
.hf-real-copy b{font-size:10px}
.hf-real-detail-empty span{font-size:9px;color:#c4cbd1}

/* Version finale - compatibilités multi-marques */
.final-connect{background:#fff}
.final-compat-grid{
  display:grid;
  grid-template-columns:repeat(2,1fr);
  gap:14px;
}
.final-compat-grid article{
  display:grid;
  grid-template-columns:48px 1fr auto;
  gap:14px;
  align-items:start;
  padding:20px;
  border:1px solid #dfe7ef;
  border-radius:13px;
  background:linear-gradient(180deg,#fff,#f8fafc);
  box-shadow:0 7px 22px rgba(7,35,70,.04);
}
.final-compat-icon{
  width:42px;height:42px;border-radius:10px;
  display:grid;place-items:center;
  background:#edf5ff;color:#1476d6;
  font-family:Montserrat;font-weight:800;
}
.final-compat-icon.shelly{background:#edf5ff;color:#1476d6}
.final-compat-icon.pv{background:#eef8e8;color:#68a938}
.final-compat-icon.open{background:#f2f5f8;color:#4b657c}
.final-compat-grid article>div:nth-child(2){display:flex;flex-direction:column}
.final-compat-grid small{font-size:8px;letter-spacing:.8px;color:#718399;font-weight:700}
.final-compat-grid h3{font-size:15px;margin:4px 0 7px}
.final-compat-grid p{font-size:9px;line-height:1.55;color:#617487;margin:0}
.final-compat-grid article>span{
  font-size:7px;font-weight:700;color:#4e6b84;
  background:#eef3f7;border:1px solid #dfe6ed;
  border-radius:99px;padding:5px 7px;white-space:nowrap
}
.final-compat-message{
  margin-top:15px;
  border:1px solid #d7e6f2;
  border-radius:12px;
  background:linear-gradient(90deg,#f2f8fd,#f6faef);
  padding:17px 20px
}
.final-compat-message>div{
  display:grid;grid-template-columns:42px 1fr;gap:12px;align-items:center
}
.final-compat-message>div>span{
  width:38px;height:38px;border-radius:50%;
  display:grid;place-items:center;
  font-family:Montserrat;font-weight:800;
  color:#1476d6;border:2px solid #7ac143;background:#fff
}
.final-compat-message>div>div{display:flex;flex-direction:column}
.final-compat-message b{font-size:11px;color:#183a5b}
.final-compat-message small{font-size:9px;color:#617487;margin-top:3px;line-height:1.5}

@media(max-width:900px){
  .final-compat-grid{grid-template-columns:1fr}
}
@media(max-width:700px){
  .final-compat-grid article{grid-template-columns:42px 1fr}
  .final-compat-grid article>span{grid-column:2}
}

/* Onglets interactifs de la section Analyse */
.s3-tabs span{cursor:pointer;user-select:none;transition:background-color .18s ease,color .18s ease,box-shadow .18s ease}
.s3-tabs span:focus-visible{outline:2px solid #1476d6;outline-offset:2px}


/* ==========================================
   NAVIGATION MOBILE — version finale
   ========================================== */
html,body{max-width:100%;overflow-x:hidden}

.mobile-menu-toggle,
.mobile-nav{display:none}

.mobile-menu-toggle{
  width:42px;height:42px;flex:0 0 42px;padding:0;
  border:1px solid #d7e1eb;border-radius:10px;background:#fff;color:var(--navy);
  align-items:center;justify-content:center;flex-direction:column;gap:5px;
  cursor:pointer;box-shadow:0 4px 14px rgba(7,29,59,.08)
}
.mobile-menu-toggle span{display:block;width:21px;height:2px;border-radius:2px;background:currentColor;transition:.2s}
.mobile-menu-toggle[aria-expanded="true"] span:nth-child(1){transform:translateY(7px) rotate(45deg)}
.mobile-menu-toggle[aria-expanded="true"] span:nth-child(2){opacity:0}
.mobile-menu-toggle[aria-expanded="true"] span:nth-child(3){transform:translateY(-7px) rotate(-45deg)}

@media(max-width:1050px){
  .topbar{width:100%;max-width:100vw;gap:12px}
  .topbar .nav,.topbar>.btn-small{display:none!important}
  .mobile-menu-toggle{display:inline-flex!important;margin-left:auto}

  .mobile-nav{
    display:flex;position:fixed;left:0;right:0;top:84px;width:100vw;max-width:100vw;
    flex-direction:column;padding:8px 15px 14px;background:rgba(255,255,255,.99);
    border-top:1px solid #e0e7ef;border-bottom:1px solid #d7e1eb;
    box-shadow:0 18px 35px rgba(7,29,59,.16);z-index:49;
    opacity:0;visibility:hidden;pointer-events:none;transform:translateY(-8px);
    transition:opacity .18s ease,transform .18s ease,visibility .18s ease
  }
  .mobile-nav.is-open{opacity:1;visibility:visible;pointer-events:auto;transform:translateY(0)}
  .mobile-nav a{display:flex;align-items:center;min-height:44px;padding:8px 10px;border-radius:8px;color:#314158;font-size:14px;font-weight:650}
  .mobile-nav a:active,.mobile-nav a:focus-visible{background:#f2f6fa;color:var(--blue);outline:none}
  .mobile-nav .mobile-nav-cta{justify-content:center;margin-top:7px;background:linear-gradient(135deg,var(--green),#63ae31);color:#fff;font-weight:750}
}

@media(max-width:700px){
  .topbar{height:72px;padding:0 14px}
  .brand{gap:9px;min-width:0;flex:1 1 auto;overflow:hidden}
  .brand-mark{width:45px;height:45px;flex:0 0 45px}
  .brand-copy{min-width:0}
  .brand-copy strong{font-size:16px;white-space:nowrap}
  .brand-copy small{display:none}
  .mobile-menu-toggle{width:40px;height:40px;flex-basis:40px}
  .mobile-nav{top:72px;padding-left:14px;padding-right:14px}
}