@import url('https://fonts.googleapis.com/css2?family=Bebas+Neue&family=Red+Hat+Display:wght@300;400;500;700&display=swap');
:root{--bg:#0c0c0e;--bg2:#141416;--card:#181820;--bord:#252530;--red:#dc2626;--orange:#f97316;--amber:#f59e0b;--green:#22c55e;--steel:#64748b;--text:#f0f0f5;--text2:#6878a8;}
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0;}
body{font-family:'Red Hat Display',sans-serif;background:var(--bg);color:var(--text);overflow-x:hidden;}
.ec-header{background:linear-gradient(135deg,#0c0c0e 0%,#1a0a0a 100%);padding:52px 32px 36px;border-bottom:1px solid var(--bord);position:relative;overflow:hidden;}
.ec-header::before{content:'CO₂';position:absolute;right:-20px;top:50%;transform:translateY(-50%);font-family:'Bebas Neue',sans-serif;font-size:18rem;color:rgba(220,38,38,.04);pointer-events:none;line-height:1;}
.ec-header-inner{max-width:980px;margin:0 auto;display:grid;grid-template-columns:1fr auto;gap:24px;align-items:center;}
.ec-dept{font-size:.68rem;letter-spacing:.25em;text-transform:uppercase;color:var(--red);margin-bottom:12px;font-weight:700;}
.ec-title{font-family:'Bebas Neue',sans-serif;font-size:clamp(3.5rem,10vw,7rem);line-height:.88;color:var(--text);letter-spacing:.02em;}
.ec-sub{margin-top:12px;color:var(--text2);font-size:.92rem;}
.ec-gauge-wrap{display:flex;flex-direction:column;align-items:center;gap:8px;}
#ecGauge{display:block;}
.ec-gauge-label{text-align:center;font-size:.8rem;color:var(--text2);}
.ec-gauge-label strong{color:var(--orange);}
.ec-nav{position:sticky;top:0;z-index:100;background:rgba(12,12,14,.95);backdrop-filter:blur(10px);border-bottom:1px solid var(--bord);display:flex;flex-wrap:wrap;justify-content:center;}
.ec-na{padding:11px 14px;font-size:.77rem;font-weight:700;text-decoration:none;color:var(--text2);border-bottom:2px solid transparent;transition:all .2s;text-transform:uppercase;letter-spacing:.04em;white-space:nowrap;}
.ec-na:hover,.ec-na.active{color:var(--red);border-color:var(--red);}
.ec-main{max-width:980px;margin:0 auto;padding:48px 24px 80px;display:flex;flex-direction:column;gap:50px;}
.ec-section{opacity:0;transform:translateY(22px);transition:opacity .5s,transform .5s;}
.ec-section.visible{opacity:1;transform:translateY(0);}
.ec-section h2{font-family:'Bebas Neue',sans-serif;font-size:1.8rem;letter-spacing:.06em;color:var(--text);padding:10px 20px;background:rgba(220,38,38,.1);border-left:4px solid var(--red);border-radius:0 6px 6px 0;display:flex;align-items:center;gap:14px;margin-bottom:0;}
.ec-section h2 span{font-size:.9rem;color:var(--red);}
.ec-body{background:var(--card);border:1px solid var(--bord);border-top:none;border-radius:0 0 8px 8px;padding:26px;}
.ec-body p{color:var(--text2);line-height:1.82;font-size:.93rem;margin-bottom:16px;}
.ec-body p:last-child{margin-bottom:0;}
.ec-body strong{color:var(--text);}
.ec-concept-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin-bottom:16px;}
.ec-cg{background:var(--bg2);border:1px solid var(--bord);border-radius:8px;padding:16px;}
.ec-cg:nth-child(1){border-top:3px solid var(--red);}
.ec-cg:nth-child(2){border-top:3px solid var(--orange);}
.ec-cg:nth-child(3){border-top:3px solid var(--amber);}
.ec-cg h4{font-size:.85rem;font-weight:700;color:var(--text);margin-bottom:7px;}
.ec-cg p{font-size:.81rem;color:var(--text2);margin:0;line-height:1.65;}
.ec-pge-box{display:flex;align-items:center;gap:16px;background:rgba(220,38,38,.07);border:1px solid rgba(220,38,38,.2);border-radius:8px;padding:14px 20px;}
.ec-pge-n{font-family:'Bebas Neue',sans-serif;font-size:2rem;color:var(--red);}
.ec-pge-t{font-size:.75rem;font-weight:700;text-transform:uppercase;color:var(--text2);flex-shrink:0;}
.ec-pge-v{font-size:.88rem;color:var(--text);font-weight:600;}
.ec-methods{display:grid;grid-template-columns:repeat(2,1fr);gap:12px;}
.ec-meth{background:var(--bg2);border:1px solid var(--bord);border-radius:8px;padding:16px;}
.ec-meth h4{font-size:.87rem;font-weight:700;color:var(--orange);margin-bottom:7px;}
.ec-meth p{font-size:.82rem;color:var(--text2);margin:0;line-height:1.65;}
/* Barres */
.ec-postes{display:flex;flex-direction:column;gap:8px;margin-bottom:18px;}
.ec-poste{display:flex;align-items:center;gap:12px;}
.ec-pb{height:22px;border-radius:4px;background:var(--red);flex-shrink:0;transition:width 1s;}
.ec-pb.transport{background:var(--orange);}
.ec-pb.logement{background:var(--amber);}
.ec-pb.biens{background:#8b5cf6;}
.ec-pb.services{background:var(--steel);}
.ec-pb.sante{background:#06b6d4;}
.ec-pl{display:flex;justify-content:space-between;flex:1;font-size:.83rem;}
.ec-pl span:first-child{color:var(--text);}
.ec-pl span:last-child{color:var(--text2);}
.ec-detail-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:12px;}
.ec-det{background:var(--bg2);border:1px solid var(--bord);border-radius:8px;padding:14px;}
.ec-det h4{font-size:.85rem;font-weight:700;color:var(--orange);margin-bottom:6px;}
.ec-det p{font-size:.81rem;color:var(--text2);margin:0;line-height:1.65;}
/* Compare */
.ec-compare-list{display:flex;flex-direction:column;gap:8px;margin-bottom:16px;}
.ec-cmp{background:var(--bg2);border:1px solid var(--bord);border-radius:6px;padding:10px 14px;position:relative;overflow:hidden;}
.ec-cmp-bar{position:absolute;left:0;top:0;bottom:0;background:rgba(220,38,38,.15);border-radius:6px 0 0 6px;}
.ec-cmp-bar.green{background:rgba(34,197,94,.15);}
.ec-cmp-info{position:relative;z-index:1;display:flex;justify-content:space-between;font-size:.86rem;}
.ec-cmp-info span:first-child{color:var(--text);}
.ec-cmp-info span:last-child{color:var(--text2);}
/* Réduire */
.ec-reduce-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;}
.ec-rd{background:var(--bg2);border:1px solid var(--bord);border-radius:8px;padding:16px;}
.ec-rd.high{border-top:3px solid var(--green);}
.ec-rd.medium{border-top:3px solid var(--amber);}
.ec-rd.low{border-top:3px solid var(--steel);}
.ec-rd-impact{font-family:'Bebas Neue',sans-serif;font-size:1.2rem;color:var(--green);margin-bottom:6px;}
.ec-rd.medium .ec-rd-impact{color:var(--amber);}
.ec-rd.low .ec-rd-impact{color:var(--steel);}
.ec-rd h4{font-size:.85rem;font-weight:700;color:var(--text);margin-bottom:6px;}
.ec-rd p{font-size:.8rem;color:var(--text2);margin:0;line-height:1.6;}
/* Compensation */
.ec-comp-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin-bottom:16px;}
.ec-cp{background:var(--bg2);border:1px solid var(--bord);border-radius:8px;padding:18px;}
.ec-cp.green-bg{border-top:3px solid var(--green);}
.ec-cp.red-bg{border-top:3px solid var(--red);}
.ec-cp h4{font-size:.9rem;font-weight:700;color:var(--text);margin-bottom:10px;}
.ec-ul{list-style:none;display:flex;flex-direction:column;gap:6px;}
.ec-ul li{font-size:.82rem;color:var(--text2);padding-left:16px;position:relative;line-height:1.65;}
.ec-ul li::before{content:'·';position:absolute;left:0;color:var(--orange);}
.ec-ul strong{color:var(--text);}
.ec-ent-grid,.ec-pol-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:12px;}
.ec-ent,.ec-pol{background:var(--bg2);border:1px solid var(--bord);border-radius:8px;padding:16px;}
.ec-ent h4,.ec-pol h4{font-size:.87rem;font-weight:700;color:var(--red);margin-bottom:7px;}
.ec-ent p,.ec-pol p{font-size:.82rem;color:var(--text2);margin:0;line-height:1.65;}
.ec-footer{border-top:1px solid var(--bord);background:var(--bg2);padding:18px 32px;font-size:.8rem;color:var(--text2);text-align:center;}
@media(max-width:768px){.ec-header-inner{grid-template-columns:1fr;}.ec-concept-grid,.ec-reduce-grid{grid-template-columns:1fr;}.ec-methods,.ec-detail-grid,.ec-comp-grid,.ec-ent-grid,.ec-pol-grid{grid-template-columns:1fr;}}