:root{--g:#05a705;--gd:#037a03;--gl:#e8f8e8;--gm:#30d158;--gold:#f5a623;--dk:#111412;--txt:#1d2421;--mu:#6b7a70;--br:#dde8de;--bg:#f2f6f2;--wh:#fff;--gr:linear-gradient(135deg,#05a705,#30d158);--gh:linear-gradient(160deg,#0a1a0c,#0d2010,#061508);}
*{margin:0;padding:0;box-sizing:border-box;}html{scroll-behavior:smooth;height:100%;}
body{font-family:Outfit,sans-serif;background:var(--bg);color:var(--txt);line-height:1.6;display:flex;flex-direction:column;margin:0;padding:0;padding-top:58px;overflow-x:hidden;position:relative;}
body::after{content:'';position:fixed;inset:0;pointer-events:none;z-index:-1;background-image:linear-gradient(rgba(5,167,5,.07) 1px,transparent 1px),linear-gradient(90deg,rgba(5,167,5,.07) 1px,transparent 1px),linear-gradient(rgba(5,167,5,.03) 1px,transparent 1px),linear-gradient(90deg,rgba(5,167,5,.03) 1px,transparent 1px);background-size:64px 64px,64px 64px,16px 16px,16px 16px;mask-image:radial-gradient(ellipse 100% 100% at 50% 50%,black 30%,transparent 90%);-webkit-mask-image:radial-gradient(ellipse 100% 100% at 50% 50%,black 30%,transparent 90%);}
/* ── NAV override (centrage menu sans CTA) ──
   Limité au desktop : sur mobile (≤900px) le menu hamburger
   doit reprendre les styles plein-écran de common.css. */
@media(min-width:901px){
  .nav-links{position:absolute;left:50%;transform:translateX(-50%)}
}

/* ── Mobile : aligne le déroulé du menu hamburger sur la
   hauteur réelle de la navbar (50px sur ≤768px, 58px sinon)
   pour éliminer l'espace blanc entre la navbar et le menu. */
@media(max-width:900px){
  .nav-links{top:58px !important;}
}
@media(max-width:768px){
  .nav-links{top:50px !important;}
}

/* ── FOOTER override — flush bottom, pleine largeur ── */
html{height:100%}
body{min-height:100%;display:flex;flex-direction:column}
body>.mg,body>.sbar,body>.devis-hero,body>section{flex-shrink:0}
footer{margin-top:auto;width:100%;padding-left:0;padding-right:0;padding-bottom:24px}

/* ── DEVIS HERO (même thème que blog/fidelite) ── */
.devis-hero{
  min-height:52vh;
  background:linear-gradient(to bottom,#000 0%,#020d04 40%,#041508 100%);
  display:flex;flex-direction:column;
  align-items:center;justify-content:center;
  text-align:center;
  padding:120px 24px 80px;
  position:relative;overflow:hidden;
}
.devis-hero::before{
  content:'';position:absolute;inset:0;
  background-image:
    linear-gradient(rgba(5,167,5,.11) 1px,transparent 1px),
    linear-gradient(90deg,rgba(5,167,5,.11) 1px,transparent 1px);
  background-size:64px 64px;
  mask-image:radial-gradient(ellipse 85% 75% at 50% 42%,black 10%,transparent 72%);
  -webkit-mask-image:radial-gradient(ellipse 85% 75% at 50% 42%,black 10%,transparent 72%);
  pointer-events:none;z-index:0;
}
.devis-hero::after{
  content:'';position:absolute;inset:0;
  background:
    radial-gradient(ellipse 72% 56% at 50% 40%,rgba(5,167,5,.14) 0%,transparent 68%),
    radial-gradient(ellipse 38% 28% at 50% 36%,rgba(48,209,88,.08) 0%,transparent 62%);
  pointer-events:none;z-index:0;
}
.devis-hero>*{position:relative;z-index:1}
.devis-hero h1{
  font-size:clamp(2.8rem,6vw,5rem);font-weight:700;
  color:#fff;line-height:1.06;letter-spacing:-2.5px;
  margin-bottom:18px;
  animation:fadeUp .9s ease .4s both;
}
.devis-hero h1 span{background:var(--gr);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}
.devis-hero p{
  font-size:clamp(.95rem,2vw,1.15rem);color:rgba(255,255,255,.5);
  max-width:540px;margin:0 auto 40px;font-weight:300;line-height:1.78;
  animation:fadeUp .9s ease .6s both;
}
.devis-hero .hero-badge{
  display:inline-flex;align-items:center;gap:8px;
  background:rgba(255,255,255,.08);
  border:1px solid rgba(255,255,255,.13);
  
  padding:8px 22px;border-radius:50px;
  margin-bottom:28px;
  animation:fadeUp .9s ease .2s both;
}
.devis-hero .hero-badge span{color:#30d158;font-size:.82rem;font-weight:500;letter-spacing:.04em}
.devis-hero .hero-badge .dot{width:6px;height:6px;border-radius:50%;background:#30d158;animation:pulse 2s ease infinite;box-shadow:0 0 8px #30d158}
@keyframes fadeUp{from{opacity:0;transform:translateY(28px)}to{opacity:1;transform:none}}
@keyframes pulse{0%,100%{opacity:1}50%{opacity:.5}}
.sbar{display:flex;justify-content:center;padding:0 24px;position:sticky;top:58px;z-index:190;background:#fff;margin:0;border-bottom:1px solid var(--br);overflow-x:auto;-webkit-overflow-scrolling:touch;scrollbar-width:none;}
.sbar::-webkit-scrollbar{display:none;}
.si{display:inline-flex;align-items:center;gap:7px;padding:14px 22px;border:none;border-bottom:3px solid transparent;background:transparent;color:var(--mu);font-family:Outfit,sans-serif;font-size:.88rem;font-weight:600;white-space:nowrap;cursor:pointer;transition:all .25s;user-select:none;}
.si:hover{color:var(--tx);background:rgba(5,167,5,.04);}
.si.done{color:var(--gd);border-bottom-color:var(--gd);}
.si.active{color:var(--g);background:transparent;border-bottom-color:var(--g);}
.sn{width:22px;height:22px;border-radius:50%;border:2px solid currentColor;display:flex;align-items:center;justify-content:center;font-size:.70rem;font-weight:700;flex-shrink:0;}
.si.active .sn{background:var(--g);border-color:var(--g);color:#fff;}
.si.done .sn{background:var(--gd);border-color:var(--gd);color:#fff;}
.ss{display:none;}
.mg{max-width:1440px;margin:0 auto;padding:28px 3.5% 70px;display:grid;grid-template-columns:1fr;gap:26px;align-items:start;}
.panel{background:#fff;border-radius:16px;border:1px solid var(--br);overflow:hidden;margin-bottom:18px;transition:box-shadow .3s;}
.panel:hover{box-shadow:0 2px 20px rgba(0,0,0,.07);}
.ph2{display:flex;align-items:center;gap:13px;padding:18px 22px;border-bottom:1px solid var(--br);background:linear-gradient(90deg,rgba(5,167,5,.04),transparent);}
.pic{width:38px;height:38px;border-radius:10px;background:var(--gr);display:flex;align-items:center;justify-content:center;font-size:1.05rem;flex-shrink:0;}
.pht h3{font-size:.95rem;font-weight:700;color:var(--dk);}
.pht p{font-size:.75rem;color:var(--mu);margin-top:1px;}
.pb{padding:22px;}
.bhint{background:rgba(5,167,5,.06);border-left:3px solid var(--g);padding:9px 13px;border-radius:0 8px 8px 0;font-size:.78rem;color:var(--mu);margin-bottom:16px;line-height:1.5;}
.bhint strong{color:var(--gd);}
/* ── Bilan toolbar ── */
.bilan-toolbar{display:flex;align-items:center;gap:12px;margin-bottom:12px;flex-wrap:wrap;}
.csv-btn{margin:0;padding:7px 14px;border:1.5px solid #1e88e5;border-radius:8px;background:rgba(30,136,229,.07);color:#1e88e5;font-family:Outfit,sans-serif;font-size:.78rem;font-weight:600;cursor:pointer;display:inline-flex;align-items:center;gap:6px;transition:all .2s;}
.csv-btn:hover{background:rgba(30,136,229,.14);}
.csv-dl{margin:0;padding:7px 14px;border:1.5px dashed #888;border-radius:8px;background:transparent;color:#666;font-family:Outfit,sans-serif;font-size:.78rem;font-weight:600;cursor:pointer;display:inline-flex;align-items:center;gap:6px;transition:all .2s;}
.csv-dl:hover{border-color:#1e88e5;color:#1e88e5;background:rgba(30,136,229,.05);}
/* ── IO Dropdown ── */
.io-drop-wrap{position:relative;display:inline-block;}
.io-drop-wrap .csv-btn .io-arrow{font-size:.55rem;margin-left:2px;transition:transform .2s;}
.io-drop-wrap:has(.io-drop.open) .io-arrow{transform:rotate(180deg);}
.io-drop{display:none;position:absolute;top:calc(100% + 6px);left:0;min-width:260px;background:#fff;border:1px solid var(--br);border-radius:12px;box-shadow:0 12px 40px rgba(0,0,0,.15);z-index:200;padding:8px 0;animation:ioFadeIn .15s ease;}
.io-drop.open{display:block;}
@keyframes ioFadeIn{from{opacity:0;transform:translateY(-6px)}to{opacity:1;transform:translateY(0)}}
.io-drop-label{padding:6px 14px 4px;font-size:.65rem;font-weight:700;color:var(--mu);text-transform:uppercase;letter-spacing:.5px;}
.io-drop-sep{height:1px;background:var(--br);margin:6px 10px;}
.io-opt{display:flex;align-items:center;gap:8px;width:100%;padding:9px 14px;border:none;background:transparent;font-family:Outfit,sans-serif;font-size:.8rem;font-weight:600;color:var(--txt);cursor:pointer;transition:background .15s,color .15s;text-align:left;}
.io-opt:hover{background:rgba(5,167,5,.06);color:var(--g);}
.io-opt:disabled{opacity:.38;cursor:not-allowed;}
.io-opt:disabled:hover{background:transparent;color:var(--txt);}
.io-opt.io-exp{color:#0d2a10;}
.csv-toast{position:fixed;bottom:24px;left:50%;transform:translateX(-50%) translateY(80px);background:#1d2421;color:#fff;padding:11px 22px;border-radius:12px;font-size:.8rem;font-weight:600;z-index:9000;transition:transform .35s cubic-bezier(.4,0,.2,1),opacity .35s;opacity:0;pointer-events:none;box-shadow:0 8px 32px rgba(0,0,0,.3);display:flex;align-items:center;gap:8px;}
.csv-toast.show{transform:translateX(-50%) translateY(0);opacity:1;}

.zone-row{display:inline-flex;align-items:center;gap:7px;font-size:.78rem;color:var(--mu);font-weight:600;position:relative;flex-shrink:0;max-width:100%;}
.zone-label-txt{font-size:.78rem;font-weight:700;color:var(--mu);}
.zone-trigger{display:inline-flex;align-items:center;gap:7px;padding:0 10px 0 9px;border:1.5px solid var(--br);border-radius:8px;background:#fff;height:32px;cursor:pointer;transition:border-color .2s,box-shadow .2s;user-select:none;min-width:180px;}
.zone-trigger:hover{border-color:var(--g);}
.zone-trigger.open{border-color:var(--g);box-shadow:0 0 0 3px rgba(5,167,5,.1);}
.zone-trigger-icon{font-size:.95rem;flex-shrink:0;}
.zone-trigger-text{flex:1;font-family:Outfit,sans-serif;font-size:.78rem;color:var(--txt);font-weight:500;}
.zone-trigger-arrow{font-size:.55rem;color:var(--mu);transition:transform .2s;flex-shrink:0;}
.zone-trigger.open .zone-trigger-arrow{transform:rotate(180deg);}
.zone-dropdown{position:absolute;top:calc(100% + 5px);left:0;background:#fff;border:1.5px solid var(--br);border-radius:12px;box-shadow:0 8px 28px rgba(0,0,0,.13);z-index:300;min-width:220px;padding:5px 0;display:none;}
.zone-dropdown.open{display:block;animation:zdrop .15s ease;}
@keyframes zdrop{from{opacity:0;transform:translateY(-6px)}to{opacity:1;transform:translateY(0)}}
.zone-opt{display:flex;align-items:center;gap:9px;padding:8px 14px;cursor:pointer;font-size:.8rem;color:var(--txt);transition:background .15s;}
.zone-opt:hover{background:var(--gl);}
.zone-opt.selected{background:rgba(5,167,5,.1);color:var(--gd);font-weight:700;}
.zone-opt.selected::before{content:"✓";font-size:.8rem;color:var(--g);margin-right:-2px;}
.zone-opt:not(.selected)::before{content:"";display:inline-block;width:.8rem;}
.zone-opt-icon{font-size:1rem;flex-shrink:0;}
.zone-opt-text{flex:1;}
.view-btns{display:flex;gap:4px;margin-left:auto;}
.vbtn{padding:6px 14px;border-radius:8px;border:1.5px solid var(--br);background:#fff;font-family:Outfit,sans-serif;font-size:.78rem;font-weight:600;color:var(--mu);cursor:pointer;transition:all .2s;display:inline-flex;align-items:center;gap:6px;}
.vbtn.active{background:var(--g);border-color:var(--g);color:#fff;}
.vbtn:hover:not(.active){border-color:var(--g);color:var(--g);}
.vbtn-icon{width:16px;height:16px;flex-shrink:0;}
/* ── Vue par pièce ── */
.piece-section{margin-bottom:14px;}
.piece-header{display:flex;align-items:center;gap:8px;background:linear-gradient(90deg,rgba(5,167,5,.08),transparent);padding:7px 10px;border-radius:8px 8px 0 0;border:1px solid var(--br);border-bottom:none;font-size:.8rem;font-weight:700;color:var(--gd);}
.piece-header .piece-icon{font-size:1rem;}
/* ── Drag & Drop pièce ── */
.dnd-row{cursor:grab;transition:opacity .15s,background .15s;}
.dnd-row:active{cursor:grabbing;}
.dnd-row.dragging{opacity:.4;background:rgba(5,167,5,.05);}
.dnd-handle{display:inline-flex;align-items:center;justify-content:center;width:18px;height:28px;color:var(--br);font-size:.85rem;cursor:grab;flex-shrink:0;user-select:none;transition:color .15s;}
.dnd-handle:hover{color:var(--mu);}
.dnd-drop-zone{transition:background .15s,box-shadow .15s;}
.dnd-drop-zone.drag-over{background:rgba(5,167,5,.07);box-shadow:inset 0 0 0 2px rgba(5,167,5,.3);}
.dnd-ghost-bar{height:3px;background:var(--g);border-radius:2px;transition:opacity .15s;}
/* ── Priorité select ── */
.prio-sel{padding:3px 6px;border:1px solid var(--br);border-radius:6px;font-family:Outfit,sans-serif;font-size:.72rem;color:var(--txt);background:#fff;cursor:pointer;width:90px;}
.prio-sel:focus{outline:none;border-color:var(--g);}
.prio-sel.essentiel{background:#fff8e8;border-color:#f5a623;color:#c97a00;}
.prio-sel.confort{background:#f0faf0;border-color:var(--g);color:var(--gd);}
.prio-sel.optionnel{background:#f5f5f5;border-color:#bbb;color:#666;}
/* ── Simult% cell ── */
.simult-inp{width:44px;text-align:center;border:1px solid var(--br);border-radius:5px;padding:2px 3px;font-family:Outfit,sans-serif;font-size:.75rem;background:#fff;}
.simult-inp:focus{outline:none;border-color:var(--g);background:rgba(5,167,5,.05);}
/* ── Pièce select ── */
.piece-sel{padding:3px 5px;border:1px solid var(--br);border-radius:5px;font-family:Outfit,sans-serif;font-size:.72rem;color:var(--txt);background:#fff;cursor:pointer;width:88px;}
.piece-sel:focus{outline:none;border-color:var(--g);}
.tw{overflow-x:auto;-webkit-overflow-scrolling:touch;}
.bt{width:100%;border-collapse:collapse;font-size:.78rem;}
.bt th{background:#f0f7f0;color:var(--dk);font-weight:700;padding:8px 6px;text-align:center;border:1px solid #dde8de;font-size:.71rem;white-space:nowrap;}
.bt th.l{text-align:left;padding-left:10px;}
.bt td{padding:5px 5px;border:1px solid #e8f0e8;text-align:center;vertical-align:middle;}
.bt td.an{text-align:left;padding-left:8px;}
.bt input{width:100%;border:none;background:transparent;text-align:center;font-family:Outfit,sans-serif;font-size:.78rem;color:var(--txt);padding:2px 3px;}
.bt input[type=text]{text-align:left;}
.bt input:focus{outline:none;background:rgba(5,167,5,.06);border-radius:4px;}
.bt .cc{background:#f0faf0;color:var(--gd);font-weight:700;font-size:.8rem;}
.bt .tr td{background:#f0f7f0;font-weight:700;}
.bt .tr .hl{background:var(--gold);color:#fff;font-weight:800;}
.bt .rr td{background:#fff8e8;font-weight:800;}
.bt .rr .hl{background:var(--gold);color:#fff;}
.abtn{margin-top:11px;padding:7px 16px;border:1.5px dashed var(--g);border-radius:8px;background:transparent;color:var(--g);font-family:Outfit,sans-serif;font-size:.8rem;font-weight:600;cursor:pointer;transition:all .2s;}
.abtn:hover{background:var(--gl);}
.reset-btn{width:34px;height:34px;border:1.5px solid rgba(229,57,53,.3);border-radius:8px;background:transparent;color:rgba(229,57,53,.55);font-family:Outfit,sans-serif;font-size:1.05rem;font-weight:700;cursor:pointer;transition:all .2s;margin:0;display:inline-flex;align-items:center;justify-content:center;padding:0;line-height:1;flex-shrink:0;}
.reset-btn:hover{background:rgba(229,57,53,.07);border-color:rgba(229,57,53,.6);color:#e53935;}
.optim-btn{width:34px;height:34px;border:1.5px solid rgba(245,166,35,.35);border-radius:8px;background:transparent;color:rgba(245,166,35,.7);font-size:1rem;cursor:pointer;transition:all .2s;margin:0;display:inline-flex;align-items:center;justify-content:center;padding:0;flex-shrink:0;}
.optim-btn:hover{background:rgba(245,166,35,.08);border-color:rgba(245,166,35,.7);color:#f5a623;}
.packs-shortcut-btn{width:34px;height:34px;border:1.5px solid rgba(5,167,5,.35);border-radius:8px;background:transparent;color:rgba(5,167,5,.7);font-size:.95rem;cursor:pointer;transition:all .2s;margin:0;display:inline-flex;align-items:center;justify-content:center;padding:0;flex-shrink:0;}
.packs-shortcut-btn:hover{background:rgba(5,167,5,.08);border-color:var(--g);color:var(--g);}
.optim-panel-overlay{position:fixed;inset:0;background:rgba(0,0,0,.25);z-index:8900;opacity:0;transition:opacity .3s;pointer-events:none;}
.optim-panel-overlay.open{opacity:1;pointer-events:all;}
.optim-modal{position:fixed;top:0;right:0;bottom:0;width:min(400px,95vw);background:#fff;box-shadow:-8px 0 40px rgba(0,0,0,.15);font-family:Outfit,sans-serif;display:flex;flex-direction:column;z-index:9000;transform:translateX(100%);transition:transform .35s cubic-bezier(.4,0,.2,1);}
.optim-modal.open{transform:translateX(0);}
.optim-modal-head{background:linear-gradient(135deg,#1a2e1c,#0d1f10);padding:20px 22px;color:#fff;display:flex;align-items:center;justify-content:space-between;gap:12px;flex-shrink:0;}
.optim-modal-head h3{font-size:1rem;font-weight:800;margin:0;}
.optim-modal-head p{font-size:.75rem;opacity:.6;margin:2px 0 0;}
.optim-modal-body{padding:18px 20px;overflow-y:auto;flex:1;}
.optim-section-title{font-size:.7rem;font-weight:700;color:#6b7a70;text-transform:uppercase;letter-spacing:.7px;margin-bottom:8px;}
.optim-item{display:flex;align-items:flex-start;gap:10px;padding:10px 13px;border-radius:10px;background:#f8faf8;border:1px solid #e8ede8;margin-bottom:7px;}
.optim-item.warn{background:#fffbf0;border-color:#fde89a;}
.optim-item.ok{background:#f0faf0;border-color:#c3e6c3;}
.optim-item.info{background:#f0f6ff;border-color:#c0d6f7;}
.optim-icon{font-size:1.1rem;flex-shrink:0;margin-top:1px;}
.optim-text strong{display:block;font-size:.8rem;font-weight:700;color:#1d2421;margin-bottom:2px;}
.optim-text span{font-size:.74rem;color:#6b7a70;line-height:1.4;}
.optim-modal-foot{padding:14px 20px;border-top:1px solid #eee;display:flex;gap:8px;flex-shrink:0;}
.optim-modal-foot button{flex:1;padding:9px 0;border-radius:9px;font-family:Outfit,sans-serif;font-size:.82rem;font-weight:700;cursor:pointer;border:none;transition:all .2s;}
.reset-modal-overlay{position:fixed;inset:0;background:rgba(0,0,0,.55);z-index:9000;display:flex;align-items:center;justify-content:center;padding:20px;}
.reset-modal{background:#fff;border-radius:18px;padding:32px 28px;max-width:380px;width:100%;box-shadow:0 24px 60px rgba(0,0,0,.18);text-align:center;font-family:Outfit,sans-serif;}
.reset-modal-icon{font-size:2.4rem;margin-bottom:14px;line-height:1;}
.reset-modal h3{font-size:1.05rem;font-weight:800;color:#1d2421;margin-bottom:8px;}
.reset-modal p{font-size:.83rem;color:#6b7a70;line-height:1.5;margin-bottom:24px;}
.reset-modal-btns{display:flex;gap:10px;}
.reset-modal-btns button{flex:1;padding:10px 0;border-radius:10px;font-family:Outfit,sans-serif;font-size:.85rem;font-weight:700;cursor:pointer;transition:all .2s;border:none;}
.reset-modal-cancel{background:#f2f6f2;color:#6b7a70;}
.reset-modal-cancel:hover{background:#e8ede8;}
.reset-modal-confirm{background:#e53935;color:#fff;}
.reset-modal-confirm:hover{background:#c62828;}
.dbtn{width:20px;height:20px;border-radius:50%;border:1px solid #ffd0d0;background:#fff5f5;color:#e05;font-size:.75rem;cursor:pointer;display:flex;align-items:center;justify-content:center;}
.dbtn:hover{background:#ffd0d0;}
/* ── Row toggle ON/OFF ── */
.row-toggle{position:relative;display:inline-block;width:30px;height:16px;cursor:pointer;vertical-align:middle;}
.row-toggle input{opacity:0;width:0;height:0;}
.row-toggle-slider{position:absolute;inset:0;background:#ccc;border-radius:16px;transition:background .2s;}
.row-toggle-slider::before{content:'';position:absolute;left:2px;top:2px;width:12px;height:12px;background:#fff;border-radius:50%;transition:transform .2s;}
.row-toggle input:checked+.row-toggle-slider{background:var(--g);}
.row-toggle input:checked+.row-toggle-slider::before{transform:translateX(14px);}
/* Row disabled state */
#bb tr.row-off{opacity:.35;background:repeating-linear-gradient(135deg,transparent,transparent 8px,rgba(0,0,0,.02) 8px,rgba(0,0,0,.02) 16px) !important;}
#bb tr.row-off input,#bb tr.row-off select{pointer-events:none;}
#bb tr.row-off .row-toggle,#bb tr.row-off .dbtn{pointer-events:auto;}
.vg{display:grid;grid-template-columns:1fr 1fr 1fr;gap:11px;margin-bottom:14px;}
.vc{border:2px solid var(--br);border-radius:13px;padding:16px 10px;text-align:center;cursor:pointer;transition:all .25s;background:#fafafa;position:relative;overflow:hidden;}
.vc::before{content:"";position:absolute;inset:0;background:var(--gr);opacity:0;transition:opacity .25s;}
.vc:hover{border-color:var(--g);}
.vc.active{border-color:var(--g);box-shadow:0 0 0 3px rgba(5,167,5,.13);}
.vc.active::before{opacity:.06;}
.vb{font-size:1.7rem;font-weight:900;background:var(--gr);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;position:relative;}
.vs{font-size:.7rem;color:var(--mu);margin-top:3px;line-height:1.3;position:relative;}
.vc.active .vs{color:var(--gd);}
.vtip{background:linear-gradient(90deg,rgba(5,167,5,.07),transparent);border-left:3px solid var(--g);padding:10px 13px;border-radius:0 8px 8px 0;font-size:.78rem;color:var(--mu);line-height:1.5;}
.pl{display:flex;flex-direction:column;gap:7px;}
.pc2{display:flex;align-items:center;gap:13px;padding:12px 15px;border:1.5px solid var(--br);border-radius:12px;cursor:pointer;transition:all .2s;background:#fafafa;}
.pc2:hover{border-color:var(--g);background:var(--gl);}
.pc2.sel{border-color:var(--g);background:rgba(5,167,5,.07);}
.pc2 input[type=radio]{accent-color:var(--g);width:15px;height:15px;flex-shrink:0;cursor:pointer;}
.pi2{flex:1;}
.pn2{font-size:.88rem;font-weight:700;color:var(--dk);}
.ps2{font-size:.72rem;color:var(--mu);margin-top:1px;}
.pgb{font-size:.65rem;background:var(--gl);color:var(--gd);border-radius:4px;padding:1px 6px;font-weight:600;margin-top:2px;display:inline-block;}
.ppr{font-size:.98rem;font-weight:800;color:var(--g);white-space:nowrap;}
.ppu{font-size:.68rem;color:var(--mu);text-align:right;}
.qr{display:flex;align-items:center;gap:10px;margin-top:13px;}
.ql2{font-size:.83rem;font-weight:600;flex:1;}
.qc{display:flex;align-items:center;gap:7px;}
.qb2{width:30px;height:30px;border-radius:7px;border:1.5px solid var(--br);background:#fff;font-size:1.1rem;font-weight:700;cursor:pointer;display:flex;align-items:center;justify-content:center;color:var(--txt);transition:all .15s;}
.qb2:hover{border-color:var(--g);color:var(--g);}
.qn{width:44px;text-align:center;padding:5px 3px;border:1.5px solid var(--br);border-radius:7px;font-family:Outfit,sans-serif;font-size:.92rem;font-weight:700;color:var(--txt);}
.qn:focus{outline:none;border-color:var(--g);}
.reco{margin-top:9px;font-size:.75rem;color:var(--mu);font-style:italic;line-height:1.4;}
.fg{margin-bottom:14px;}
.fg:last-child{margin-bottom:0;}
.fg label{display:block;font-size:.81rem;font-weight:600;margin-bottom:5px;}
.fg input,.fg select,.fg textarea{width:100%;padding:10px 13px;border:1.5px solid var(--br);border-radius:10px;font-family:Outfit,sans-serif;font-size:.88rem;color:var(--txt);background:#fafafa;transition:border-color .2s;}
.fg input:focus,.fg select:focus,.fg textarea:focus{outline:none;border-color:var(--g);background:#fff;}
.fg textarea{resize:vertical;min-height:75px;}
.fgr{display:grid;grid-template-columns:1fr 1fr;gap:12px;}
/* ── RECAP DEVIS ──────────────────────────────────────── */
.qbox{background:#162b1a;border-radius:24px;color:#fff;box-shadow:0 12px 40px rgba(0,0,0,.22);overflow:hidden;border:1px solid rgba(48,209,88,.14);}
.qbox-header{background:linear-gradient(135deg,#1a3d20,#1f4828);padding:22px 24px 18px;border-bottom:1px solid rgba(48,209,88,.10);position:relative;}
.qbox-header::after{content:"";position:absolute;top:0;right:0;width:120px;height:120px;background:radial-gradient(circle,rgba(48,209,88,.07),transparent 70%);pointer-events:none;}
.qbox-logo{font-size:.72rem;font-weight:800;letter-spacing:2px;text-transform:uppercase;color:rgba(255,255,255,.38);margin-bottom:6px;}
.qbox-logo span{color:var(--gm);}
.qbh{display:flex;align-items:center;gap:10px;}
.qbh h3{font-size:1.05rem;font-weight:800;letter-spacing:-.3px;flex:1;}
.qbvolt{background:rgba(48,209,88,.15);border:1px solid rgba(48,209,88,.28);color:var(--gm);font-size:.7rem;font-weight:800;padding:4px 11px;border-radius:20px;letter-spacing:.5px;}
.qbox-client{padding:14px 24px 12px;background:rgba(255,255,255,.04);border-bottom:1px solid rgba(255,255,255,.06);font-size:.75rem;color:rgba(255,255,255,.5);display:flex;align-items:center;gap:7px;min-height:38px;}
.qbox-client span{color:rgba(255,255,255,.85);font-weight:600;}
.qpw{display:grid;grid-template-columns:1fr 1fr;gap:1px;background:rgba(255,255,255,.07);margin-bottom:0;}
.qpwi{text-align:center;padding:10px 8px;background:#162b1a;}
.qpwv{font-size:.92rem;font-weight:800;color:var(--gm);}
.qpwl{font-size:.6rem;color:rgba(255,255,255,.32);text-transform:uppercase;letter-spacing:.5px;margin-top:2px;}
.qbox-body{padding:18px 24px;}
.qsec{font-size:.6rem;text-transform:uppercase;letter-spacing:1.2px;color:rgba(48,209,88,.55);margin:14px 0 6px;font-weight:700;display:flex;align-items:center;gap:6px;}
.qsec::before{content:"";display:inline-block;width:16px;height:1px;background:rgba(48,209,88,.3);}
.qline{display:flex;justify-content:space-between;align-items:baseline;padding:5px 0;border-bottom:1px solid rgba(255,255,255,.05);gap:8px;}
.qline:last-child{border-bottom:none;}
.ql3{font-size:.78rem;color:rgba(255,255,255,.52);flex:1;line-height:1.3;}
.qv2{font-size:.8rem;font-weight:700;color:rgba(255,255,255,.9);text-align:right;white-space:nowrap;}
.qv2.g{color:var(--gm);}
.qdiv{height:1px;background:linear-gradient(90deg,transparent,rgba(48,209,88,.18),transparent);margin:14px 0;}
.qsub{display:flex;justify-content:space-between;padding:5px 0;}
.qsub .ql3{font-size:.8rem;color:rgba(255,255,255,.52);}
.qsub .qv2{font-size:.8rem;color:rgba(255,255,255,.82);}
.qtot{background:linear-gradient(135deg,rgba(5,167,5,.14),rgba(48,209,88,.06));border:1px solid rgba(48,209,88,.22);border-radius:16px;padding:18px 20px;margin-top:18px;position:relative;overflow:hidden;}
.qtot::before{content:"";position:absolute;inset:0;background:radial-gradient(ellipse 80% 60% at 50% 0%,rgba(48,209,88,.05),transparent);pointer-events:none;}
.tlbl{font-size:.62rem;text-transform:uppercase;letter-spacing:1.5px;color:var(--gm);margin-bottom:6px;font-weight:700;opacity:.8;}
.tval{font-size:2rem;font-weight:900;color:#fff;letter-spacing:-1.5px;line-height:1;}
.tcur{font-size:.7rem;color:rgba(255,255,255,.35);margin-top:4px;}
.qempty{text-align:center;padding:32px 0;color:rgba(255,255,255,.22);font-size:.83rem;line-height:1.7;}

/* ── COMPARAISON SOLAIRE vs ENEO ── */
.comp-panel{background:#fff;border-radius:16px;border:1px solid var(--br);overflow:hidden;}
.comp-header{background:linear-gradient(135deg,#0a1a0c,#0d2e15);padding:20px 24px 16px;position:relative;overflow:hidden;}
.comp-header::after{content:"";position:absolute;top:-20px;right:-20px;width:120px;height:120px;background:radial-gradient(circle,rgba(48,209,88,.15),transparent 70%);pointer-events:none;}
.comp-header-top{display:flex;align-items:center;gap:12px;margin-bottom:6px;}
.comp-header-icon{width:40px;height:40px;border-radius:10px;background:linear-gradient(135deg,#05a705,#30d158);display:flex;align-items:center;justify-content:center;font-size:1.1rem;flex-shrink:0;}
.comp-header h3{font-size:1rem;font-weight:800;color:#fff;letter-spacing:-.3px;}
.comp-header p{font-size:.75rem;color:rgba(255,255,255,.45);margin-top:1px;}
.comp-badges{display:flex;gap:8px;flex-wrap:wrap;margin-top:10px;}
.comp-badge{display:inline-flex;align-items:center;gap:5px;font-size:.68rem;font-weight:700;padding:4px 10px;border-radius:20px;letter-spacing:.3px;}
.comp-badge.solar{background:rgba(48,209,88,.15);border:1px solid rgba(48,209,88,.3);color:#30d158;}
.comp-badge.eneo{background:rgba(255,100,50,.15);border:1px solid rgba(255,100,50,.3);color:#ff8060;}
.comp-body{padding:20px 22px;}
.comp-controls{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin-bottom:20px;background:#f7faf7;border-radius:12px;padding:16px;border:1px solid var(--br);}
.comp-ctrl-group{display:flex;flex-direction:column;gap:5px;}
.comp-ctrl-label{font-size:.72rem;font-weight:700;color:var(--mu);text-transform:uppercase;letter-spacing:.5px;}
.comp-ctrl-input{display:flex;align-items:center;gap:8px;}
.comp-ctrl-input input{width:100%;padding:8px 11px;border:1.5px solid var(--br);border-radius:9px;font-family:Outfit,sans-serif;font-size:.85rem;font-weight:700;color:var(--txt);background:#fff;transition:border-color .2s;}
.comp-ctrl-input input:focus{outline:none;border-color:var(--g);background:#fff;}
.comp-ctrl-input span{font-size:.76rem;color:var(--mu);white-space:nowrap;font-weight:600;}
.comp-tarif-section{margin-bottom:16px;}
.comp-tarif-title{font-size:.75rem;font-weight:700;color:var(--txt);margin-bottom:10px;display:flex;align-items:center;gap:7px;}
.comp-tarif-title::after{content:"";flex:1;height:1px;background:var(--br);}
.comp-tarif-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;}
.comp-tarif-card{border:2px solid var(--br);border-radius:10px;padding:10px 12px;cursor:pointer;transition:all .2s;background:#fafafa;text-align:center;}
.comp-tarif-card:hover{border-color:var(--g);background:var(--gl);}
.comp-tarif-card.active{border-color:#ff6432;background:rgba(255,100,50,.06);box-shadow:0 0 0 3px rgba(255,100,50,.1);}
.comp-tarif-card.active .ctc-name{color:#d44;}
.ctc-icon{font-size:1.2rem;margin-bottom:4px;}
.ctc-name{font-size:.72rem;font-weight:700;color:var(--dk);margin-bottom:2px;}
.ctc-rate{font-size:.85rem;font-weight:800;color:#ff6432;}
.ctc-desc{font-size:.63rem;color:var(--mu);line-height:1.3;margin-top:3px;}
.comp-tarif-custom{display:flex;align-items:center;gap:8px;margin-top:10px;padding:10px 12px;border:1.5px dashed var(--br);border-radius:10px;background:#fafafa;}
.comp-tarif-custom label{font-size:.74rem;font-weight:600;color:var(--mu);flex:1;white-space:nowrap;}
.comp-tarif-custom input{width:100px;padding:6px 10px;border:1.5px solid var(--br);border-radius:8px;font-family:Outfit,sans-serif;font-size:.82rem;font-weight:700;color:var(--txt);text-align:right;}
.comp-tarif-custom input:focus{outline:none;border-color:#ff6432;}
.comp-tarif-custom span{font-size:.72rem;color:var(--mu);font-weight:600;white-space:nowrap;}
.comp-hausse{display:flex;align-items:center;gap:8px;margin-top:8px;padding:8px 12px;border:1.5px solid rgba(255,100,50,.25);border-radius:9px;background:rgba(255,100,50,.04);}
.comp-hausse label{font-size:.73rem;font-weight:600;color:#c44;flex:1;}
.comp-hausse input{width:72px;padding:5px 9px;border:1.5px solid rgba(255,100,50,.3);border-radius:7px;font-family:Outfit,sans-serif;font-size:.82rem;font-weight:700;text-align:right;background:#fff;}
.comp-hausse input:focus{outline:none;border-color:#ff6432;}
.comp-hausse span{font-size:.72rem;color:#c44;font-weight:600;}
.comp-chart-wrap{position:relative;background:linear-gradient(180deg,#f9fcf9 0%,#fff 100%);border:1px solid var(--br);border-radius:14px;padding:18px 16px 12px;margin-bottom:16px;}
.comp-chart-title{font-size:.78rem;font-weight:700;color:var(--dk);margin-bottom:14px;display:flex;align-items:center;gap:8px;}
.comp-chart-legend{display:flex;gap:16px;flex-wrap:wrap;margin-bottom:12px;}
.comp-legend-item{display:flex;align-items:center;gap:6px;font-size:.72rem;font-weight:600;color:var(--mu);}
.comp-legend-dot{width:12px;height:12px;border-radius:3px;flex-shrink:0;}
.comp-canvas-wrap{position:relative;width:100%;height:260px;}
.comp-canvas-wrap canvas{width:100%!important;height:100%!important;}
.comp-kpi-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-bottom:16px;}
.comp-kpi{background:#f7faf7;border:1px solid var(--br);border-radius:12px;padding:12px 14px;text-align:center;}
.comp-kpi.highlight{background:linear-gradient(135deg,rgba(5,167,5,.1),rgba(48,209,88,.06));border-color:rgba(5,167,5,.25);}
.comp-kpi-val{font-size:1.15rem;font-weight:900;color:var(--g);line-height:1;}
.comp-kpi.neg .comp-kpi-val{color:#e53935;}
.comp-kpi-label{font-size:.63rem;color:var(--mu);margin-top:4px;line-height:1.3;}
.comp-table-wrap{overflow-x:auto;border-radius:10px;border:1px solid var(--br);}
.comp-table{width:100%;border-collapse:collapse;font-size:.74rem;}
.comp-table th{background:#f0f7f0;color:var(--dk);font-weight:700;padding:8px 10px;text-align:right;white-space:nowrap;font-size:.7rem;}
.comp-table th:first-child{text-align:left;}
.comp-table td{padding:6px 10px;border-top:1px solid #eef5ee;text-align:right;}
.comp-table td:first-child{text-align:left;font-weight:600;color:var(--dk);}
.comp-table tr:hover td{background:#f7fbf7;}
.comp-table .solar-col{color:var(--gd);font-weight:700;}
.comp-table .eneo-col{color:#d44;font-weight:700;}
.comp-table .saving-col{color:#1e88e5;font-weight:700;}
.comp-table .payback-row td{background:rgba(5,167,5,.08);font-weight:800;}
.comp-breakeven-note{margin-top:12px;padding:12px 15px;background:linear-gradient(90deg,rgba(5,167,5,.08),transparent);border-left:3px solid var(--g);border-radius:0 10px 10px 0;font-size:.78rem;color:var(--mu);line-height:1.6;}
.comp-breakeven-note strong{color:var(--gd);}
@media(max-width:768px){
  .comp-controls{grid-template-columns:1fr;}
  .comp-tarif-grid{grid-template-columns:1fr 1fr;}
  .comp-kpi-grid{grid-template-columns:1fr 1fr;}
  .comp-canvas-wrap{height:200px;}
}
.qempty-icon{font-size:2rem;margin-bottom:8px;opacity:.3;}
.qbox-actions{padding:16px 24px 20px;display:flex;flex-direction:column;gap:8px;}
.bact{width:100%;padding:13px;border-radius:12px;border:none;font-family:Outfit,sans-serif;font-size:.9rem;font-weight:700;cursor:pointer;transition:all .25s;display:flex;align-items:center;justify-content:center;gap:8px;letter-spacing:.1px;}
.bpdf{background:linear-gradient(135deg,#05a705,#30d158);color:#fff;box-shadow:0 4px 16px rgba(5,167,5,.3);}
.bpdf:hover{transform:translateY(-2px);box-shadow:0 8px 28px rgba(5,167,5,.4);}
.bwa{background:rgba(255,255,255,.06);color:rgba(255,255,255,.85);border:1px solid rgba(255,255,255,.1);}
.bwa:hover{background:rgba(255,255,255,.12);border-color:rgba(255,255,255,.2);}
.bprint{background:linear-gradient(135deg,#05a705,#30d158);color:#fff;}
.bprint:hover{transform:translateY(-2px);box-shadow:0 8px 24px rgba(5,167,5,.35);}
.qbox-inner{display:block;}
/* ── FIN RECAP DEVIS ──────────────────────────────────── */
#pz{display:none;}
@media print{
@page{size:A4;margin:14mm 16mm 16mm 16mm;}
body>*:not(#pz){display:none!important;}
#pz{display:block!important;font-family:'Outfit',Arial,sans-serif;color:#000;background:#fff;}

/* ── HEADER centré style PDF référence ── */
.pph{text-align:center;padding:10mm 0 6mm;border-bottom:2px solid #000;}
.pph-logo-name{font-family:'DM Serif Display',Georgia,serif;font-size:22pt;font-weight:900;letter-spacing:1px;color:#000;text-transform:uppercase;margin-bottom:2mm;}
.pph-logo-name span{color:#05a705;}
.pph-tagline{font-size:7pt;color:#555;font-style:italic;text-transform:uppercase;letter-spacing:.6px;margin-bottom:1.5mm;}
.pph-infos{font-size:7.5pt;color:#333;line-height:1.9;margin-bottom:1mm;}
.pph-infos a{color:#333;text-decoration:underline;}
.pph-divider{width:60mm;height:1px;background:#ccc;margin:2mm auto;}
/* Logo image centré */
.pph-logo-img{margin:3mm auto;display:block;width:38mm;}

/* ── Titre devis ── */
.ppt{text-align:center;margin:5mm 0 4mm;padding:0;}
.ppt h2{font-size:11pt;font-weight:900;color:#000;margin-bottom:2mm;line-height:1.3;}
.ppt-sub{font-size:9pt;color:#333;text-decoration:underline;margin-bottom:1mm;}
.ppintro{font-size:8.5pt;color:#333;margin:4mm 0;line-height:1.7;text-align:center;padding:0 10mm;}

/* ── Barre client ── */
.pp-client-bar{display:flex;justify-content:space-between;align-items:flex-start;background:#f0faf0;border-left:4px solid #05a705;padding:5px 12px;margin:4mm 0;font-size:8pt;}
.pp-client-bar .pp-cn{font-size:10pt;font-weight:800;color:#000;}
.pp-client-bar .pp-ct{font-size:7.5pt;color:#444;margin-top:2px;}

/* ── Section labels ── */
.ppsec{font-size:8pt;font-weight:800;color:#0d2a10;margin:5mm 0 2mm;text-transform:uppercase;letter-spacing:.8px;display:flex;align-items:center;gap:5px;text-decoration:underline;}

/* ── Tableau bilan de puissance ── */
.pptbl{width:100%;border-collapse:collapse;font-size:7pt;margin-bottom:4mm;border:1px solid #bbb;}
.pptbl th{background:#0d2a10;color:#fff;font-weight:700;padding:5px 4px;text-align:center;font-size:6.5pt;border:1px solid #555;}
.pptbl th.l{text-align:left;padding-left:6px;}
.pptbl td{padding:4px 4px;border:1px solid #ccc;text-align:center;font-size:6.8pt;vertical-align:middle;}
.pptbl td.l{text-align:left;padding-left:6px;}
.pptbl .trf td{background:#f0f8f0;font-weight:700;border-color:#aaa;}
.pptbl .hlc{background:#f5a623!important;color:#fff;font-weight:800;}
.pptbl tbody tr:nth-child(even) td{background:#fafafa;}

/* ── Tableau devis équipements ── */
.ppdtbl{width:100%;border-collapse:collapse;font-size:8pt;margin-bottom:4mm;border:1px solid #bbb;}
.ppdtbl thead tr th{background:#05a705;color:#fff;font-weight:800;padding:6px 10px;font-size:8pt;letter-spacing:.3px;text-align:center;}
.ppdtbl thead tr th:nth-child(2){text-align:left;}
.ppdtbl th.r{text-align:right;}
.ppdtbl td{padding:6px 10px;border:1px solid #ddd;font-size:8pt;vertical-align:middle;}
.ppdtbl td.r{text-align:right;}
.ppdtbl td:first-child{text-align:center;color:#666;font-size:7.5pt;}
.ppdtbl .cat td{background:#e8f5e8;font-weight:800;text-align:center;color:#0d2a10;font-size:7.5pt;letter-spacing:.7px;text-transform:uppercase;border-color:#b8d8b8;}
.ppdtbl tbody tr:not(.cat):not(.sub):not(.tot):nth-child(even) td{background:#fafff8;}
.ppdtbl .sub td{background:#f0faf0;font-weight:700;border-color:#c8e8c8;}
.ppdtbl .sub td.r{color:#05a705;font-size:9pt;}
.ppdtbl .tot td{background:#0d2a10;color:#fff;font-weight:800;font-size:10pt;border-color:#0d2a10;}
.ppdtbl .tot td.r{color:#30d158;font-size:10.5pt;}

/* ── Tension installation ── */
.pp-volt-line{font-size:9pt;font-weight:800;color:#05a705;margin:3mm 0 1mm;text-transform:uppercase;letter-spacing:.5px;}

/* ── NB ── */
.ppnb{border:1px solid #c8d8c8;border-radius:4px;padding:8px 12px;font-size:8pt;color:#333;line-height:2;margin-top:4mm;background:#f8fdf8;}
.ppnb strong{color:#0d2a10;}

/* ── Footer / signature ── */
.pp-footer{margin-top:6mm;display:flex;justify-content:space-between;align-items:flex-end;border-top:1.5px solid #ccc;padding-top:4mm;}
.pp-footer-left{font-size:7pt;color:#888;line-height:1.7;}
.pp-signature{font-size:8pt;color:#333;text-align:right;font-weight:600;}
.pp-stamp{display:inline-flex;align-items:center;justify-content:center;border:2px solid #05a705;border-radius:50%;width:22mm;height:22mm;font-size:6.5pt;color:#05a705;font-weight:700;text-align:center;margin-top:3mm;line-height:1.3;padding:2mm;}
}
/* ══════════════════════════════════════════
   RESPONSIVE — TABLET ≤ 980px
   ══════════════════════════════════════════ */
@media(max-width:980px){
  .mg{grid-template-columns:1fr;}
  nav{padding:0 16px;}
  .fgr{grid-template-columns:1fr;}
  .anlys-grid{grid-template-columns:1fr 1fr;}
  .qbox-inner{display:flex;flex-direction:column;gap:14px;}
}

/* ══════════════════════════════════════════
   RESPONSIVE — MOBILE ≤ 640px
   ══════════════════════════════════════════ */
/* ══════════════════════════════════════════════════════
   RESPONSIVE — Mobile-first complete overhaul
   ══════════════════════════════════════════════════════ */

/* Tablet: 980px */
@media(max-width:980px){
  .mg{grid-template-columns:1fr;}
  nav{padding:0 16px;}
  .fgr{grid-template-columns:1fr 1fr;}
  .anlys-grid{grid-template-columns:1fr 1fr;}
}

/* Mobile: 768px */
@media(max-width:768px){
  /* Navbar */
  nav{padding:0 12px;height:50px;}
  .nl{font-size:.95rem;}
  .nb{font-size:.72rem;padding:5px 10px;}
  .sbar{top:50px;padding:0 10px;}
  .si{padding:10px 14px;font-size:.78rem;gap:5px;}
  .sn{width:18px;height:18px;font-size:.60rem;}

  /* Hero — compact */
  .devis-hero{padding:80px 20px 50px;min-height:auto;}
  .devis-hero h1{font-size:2rem;letter-spacing:-1px;}
  .devis-hero p{font-size:.85rem;max-width:100%;}

  /* Layout */
  .mg{padding:12px 10px 80px;gap:14px;}
  .pb{padding:12px 11px;}
  .ph2{padding:12px 14px;}

  /* Toolbar — scroll horizontal, icones only for secondary btns */
  .bilan-toolbar{gap:6px;flex-wrap:nowrap;overflow-x:auto;padding-bottom:2px;}
  .bilan-toolbar::-webkit-scrollbar{display:none;}
  .bilan-toolbar .abtn{white-space:nowrap;font-size:.72rem;padding:6px 10px;}
  .csv-btn{font-size:.72rem;padding:6px 10px;}
  .csv-dl{font-size:.72rem;padding:6px 9px;}
  .zone-trigger{min-width:130px;font-size:.72rem;height:30px;}
  .view-btns{flex-shrink:0;}
  .vbtn{padding:5px 10px;font-size:.72rem;}

  /* Bilan table — horizontal scroll, colonnes secondaires masquées */
  .tw{overflow-x:auto;-webkit-overflow-scrolling:touch;border-radius:10px;}
  .bt{font-size:.7rem;min-width:480px;} /* réduit vs 700px avant */
  .bt th,.bt td{padding:5px 4px;}
  .bt input[type=number]{width:40px;font-size:.68rem;padding:3px 4px;}
  .bt input[type=text]{width:68px;font-size:.68rem;padding:3px 5px;}
  /* Masquer colonnes secondaires sur mobile (on garde P.cont et P.pointe) */
  .bt .col-pct,.bt .col-ppt,.bt .col-whj,.bt .col-whn{display:none;}
  th.col-pct,th.col-ppt,th.col-whj,th.col-whn{display:none;}

  /* Voltage cards — horizontal layout */
  .vg{grid-template-columns:1fr;gap:7px;}
  .vc{padding:10px 13px;display:flex;align-items:center;gap:12px;text-align:left;}
  .vb{font-size:1.15rem;margin-bottom:0;flex-shrink:0;}
  .vs{font-size:.7rem;}
  .vtip{font-size:.75rem;padding:8px 12px;}

  /* Product cards */
  .pl{gap:7px;}
  .pc2{padding:9px 11px;gap:8px;}
  .pn2{font-size:.78rem;}
  .ps2{font-size:.67rem;}
  .ppr{font-size:.85rem;}
  .ppu{font-size:.6rem;}
  .pi2{flex:1;min-width:0;}

  /* Qty row */
  .qty-row{flex-wrap:wrap;gap:5px;}
  .ql2{font-size:.76rem;}
  .qi{width:50px;font-size:.8rem;}

  /* Analyse */
  .anlys-grid{grid-template-columns:1fr;}
  .donut-container{flex-direction:column;align-items:stretch;}
  .donut-legend{margin-top:10px;}
  .anlys-impact{padding:12px 14px;}
  .impact-row{font-size:.72rem;}
  .kpi-val{font-size:1.4rem;}

  /* Devis */
  .qbox{border-radius:14px;}
  .qbox-header{padding:14px 14px 12px;}
  .qbox-body{padding:12px 14px;}
  .qbox-actions{padding:10px 14px 14px;gap:8px;}
  .qbox-client{padding:9px 14px;}
  .ql3{font-size:.73rem;}
  .qv2{font-size:.76rem;}
  .qsub .ql3,.qsub .qv2{font-size:.8rem;}

  /* Client form */
  .fgr{grid-template-columns:1fr;}
  .fg label{font-size:.74rem;}
  .fg input,.fg select,.fg textarea{font-size:.82rem;padding:8px 11px;}

  /* Optim panel — drawer from bottom on mobile */
  .optim-modal{width:100vw;max-width:100vw;border-radius:20px 20px 0 0;top:auto;right:0;bottom:0;height:85vh;transform:translateY(100%);}
  .optim-modal.open{transform:translateY(0);}
  .optim-modal-body{padding:12px 13px;}
  .optim-modal-head{padding:14px 15px;border-radius:20px 20px 0 0;}
  .optim-modal-foot{padding:10px 13px;}
  .optim-item{padding:8px 10px;gap:8px;}
  .optim-text strong{font-size:.77rem;}
  .optim-text span{font-size:.71rem;}

  /* Reset modal */
  .reset-modal{padding:22px 16px;border-radius:16px;max-width:320px;}
  .reset-modal-icon{font-size:2rem;}
  .reset-modal h3{font-size:.95rem;}
  .reset-modal p{font-size:.78rem;}

  /* Library modal — full bottom sheet */
  .lib-modal-inner{border-radius:18px 18px 0 0;max-height:90vh;width:100%;margin:0;margin-top:auto;}
  .lib-grid{grid-template-columns:1fr 1fr;}
  .lib-sw{padding:10px 12px;}

}

/* Small mobile: 480px */
@media(max-width:480px){
  .mg{padding:10px 8px 80px;}
  .pb{padding:10px 10px;}

  /* Hero ultra-compact */
  .devis-hero{padding:60px 16px 40px;}
  .devis-hero .hero-badge{display:none;}
  .devis-hero p{display:none;}

  /* Sbar — numéros seuls (les labels sont des text nodes, on les
     masque via font-size:0 et on rétablit le font-size sur .sn) */
  .sbar{padding:0 6px;justify-content:center;gap:2px;}
  .si{
    padding:8px 6px;
    font-size:0 !important;
    gap:0;
    min-width:32px;
    justify-content:center;
  }
  .si .sn{
    font-size:.78rem !important;
    width:24px;height:24px;
  }
  .ss{font-size:.85rem;color:var(--mu);margin:0 1px}

  /* Toolbar — icon-only pour csv-dl */
  .csv-dl{display:none;} /* modèle CSV caché, pas essentiel mobile */
  .bilan-toolbar .abtn{padding:6px 9px;}

  /* Table encore plus compacte */
  .bt{font-size:.64rem;min-width:360px;}
  .bt input[type=number]{width:34px;font-size:.63rem;}
  .bt input[type=text]{width:58px;font-size:.63rem;}

  /* Voltage cards */
  .vg{gap:5px;}
  .vc{padding:8px 11px;}
  .vb{font-size:1rem;}
  .vs{font-size:.66rem;}

  /* Product cards */
  .pc2{padding:8px 9px;gap:7px;}
  .pn2{font-size:.75rem;}
  .ps2{font-size:.63rem;}

  /* Analyse KPIs */
  .anlys-grid{grid-template-columns:1fr 1fr;}
  .kpi-val{font-size:1.25rem;}
  .kpi-lbl{font-size:.56rem;}

  /* Devis */
  .qbox-actions{flex-direction:column;}
  .qbox-actions button{width:100%;}

  /* Library */
  .lib-grid{grid-template-columns:1fr 1fr;}

}

/* XS: 360px */
@media(max-width:360px){
  .anlys-grid{grid-template-columns:1fr;}
  .lib-grid{grid-template-columns:1fr;}
  .bt{min-width:300px;}
  nav .nl{font-size:.85rem;}
  .nb{display:none;}
}

/* ════════════════════════════════════════════════════════
   RESPONSIVE FIXES — Patch (mobile)
   Force la pleine largeur des conteneurs pour éviter le
   vide à droite (panels, packs, footer) sur mobile.
   ════════════════════════════════════════════════════════ */
@media(max-width:768px){
  html,body{width:100%;max-width:100%;overflow-x:hidden}

  /* Conteneurs principaux : pleine largeur, box-sizing safe */
  .mg,.sbar,.devis-hero,#secPacks,
  .pk-grid,.pk-search-wrap,.pk-search-tags,
  footer,.footer-grid,.footer-bottom{
    max-width:100% !important;
    width:100%;
    box-sizing:border-box;
  }

  /* Section packs : padding latéral cohérent (override inline style) */
  #secPacks{padding:48px 0 40px !important}
  .pk-grid{padding:0 14px !important;margin:0 !important;width:100%}
  .pk-search-wrap{padding:0 14px !important}

  /* Footer pleine largeur */
  footer{padding:48px 18px 24px}
  .footer-grid{padding:0;margin:0 auto 32px;max-width:100%}
  .footer-bottom{margin:0 auto;max-width:100%}

  /* .mg : pleine largeur sans débordement */
  .mg{padding:14px 12px 80px;margin:0 auto;width:100%;max-width:100%}

  /* Empêche les panels de déborder */
  .panel{max-width:100%;box-sizing:border-box}
}

@media(max-width:480px){
  #secPacks{padding:36px 0 32px !important}
  .pk-grid{padding:0 12px !important;gap:10px}
  .pk-search-wrap{padding:0 12px !important}
  footer{padding:40px 14px 22px}
}

/* ════════════════════════════════════════════════════════
   Tableau bilan : scroll horizontal lisible sur mobile
   - Wrapper scrollable visible
   - Indicateur de scroll (scrollbar fine)
   - Colonnes secondaires masquées sur très petit pour
     que tout rentre sans débordement
   ════════════════════════════════════════════════════════ */
@media(max-width:768px){
  /* Wrapper scrollable du tableau : visible et avec scrollbar fine */
  .tw{
    overflow-x:auto;
    overflow-y:hidden;
    -webkit-overflow-scrolling:touch;
    border-radius:10px;
    border:1px solid rgba(0,0,0,.06);
  }
  .tw::-webkit-scrollbar{height:6px}
  .tw::-webkit-scrollbar-track{background:rgba(0,0,0,.04);border-radius:3px}
  .tw::-webkit-scrollbar-thumb{background:rgba(5,167,5,.5);border-radius:3px}

  /* Bilan-toolbar : permet wrap au lieu d'overflow (sinon les
     dropdowns sont clippés par le contexte de scroll) */
  .bilan-toolbar{
    overflow:visible !important;
    flex-wrap:wrap;
    padding-bottom:6px;
  }

  /* Dropdowns : z-index élevé pour passer au-dessus du tableau */
  .io-drop{z-index:1000 !important}
  .zone-dropdown{z-index:1000 !important}

  /* Le wrapper du tableau ne doit pas créer de stacking context bloquant */
  .tw{position:relative;z-index:0}
}

/* Sur très petit (≤480) : masquer Pièce, Simult. ET Priorité
   - Colonne 1 : Pièce
   - Colonne 6 : Simult. (col-pp en 5 déjà cachée)
   - Colonne 13 : Priorité */
@media(max-width:480px){
  .bt th:nth-child(1),
  .bt td:nth-child(1),
  .bt th:nth-child(6),
  .bt td:nth-child(6),
  .bt th:nth-child(13),
  .bt td:nth-child(13){display:none}
  .bt{min-width:300px;font-size:.65rem}
  .bt th,.bt td{padding:5px 3px}
  .bt input[type=number]{width:34px;font-size:.62rem;padding:2px 3px}
  .bt input[type=text]{width:60px;font-size:.62rem;padding:2px 4px}

  /* Toolbar bilan : icônes seules (textes masqués) */
  .bilan-toolbar .btn-label,
  .zone-trigger-text{display:none !important}
  .abtn,.csv-btn{padding:8px 10px;font-size:1.05rem;min-width:0}
  .zone-trigger{min-width:0;padding:6px 10px;gap:4px}
  .zone-trigger-icon{font-size:1.05rem}
  .zone-trigger-arrow{font-size:.65rem}
  .csv-btn .io-arrow{font-size:.65rem}
  .bilan-toolbar{gap:5px}

  /* Boutons « Vue liste » / « Vue par pièce » : icône SVG sans cadre */
  .vbtn{
    padding:8px;
    border:none !important;
    background:transparent !important;
    box-shadow:none !important;
    color:var(--mu);
    display:inline-flex;
    align-items:center;
    justify-content:center;
    min-width:36px;height:36px;
    border-radius:8px;
    transition:color .2s, background .2s;
  }
  .vbtn:hover:not(.active){color:var(--g);background:rgba(5,167,5,.08) !important}
  .vbtn.active{
    background:rgba(5,167,5,.14) !important;
    color:var(--g) !important;
    border:none !important;
  }
  .vbtn-icon{
    width:20px;height:20px;
    flex-shrink:0;
    display:block;
  }
}

/* Sur ultra-petit (≤380) : compactage supplémentaire (P.cont et P.pointe restent visibles) */
@media(max-width:380px){
  .bt{min-width:300px}
  .bt th,.bt td{padding:3px 2px}
  .bt input[type=number]{width:30px;font-size:.58rem}
}

/* ════════════════════════════════════════════════════════
   PANELS PLEINE LARGEUR — Patch agressif (mobile)
   .mg passe en display:block pour s'assurer que les .panel
   stretchent à 100% de la largeur disponible (la grille
   « 1fr » résiduelle peut produire des cellules étroites
   selon le contenu).
   ════════════════════════════════════════════════════════ */
@media(max-width:768px){
  .mg{
    display:block !important;
    width:100% !important;
    max-width:100% !important;
    padding:14px 10px 80px !important;
    margin:0 !important;
    box-sizing:border-box !important;
  }
  /* Le wrapper anonyme <div> entre .mg et .panel */
  .mg > div{
    width:100% !important;
    max-width:100% !important;
    margin:0 !important;
    padding:0 !important;
  }
  /* Les panels eux-mêmes */
  .mg .panel,
  body > .mg .panel{
    width:100% !important;
    max-width:100% !important;
    margin:0 0 16px 0 !important;
    box-sizing:border-box !important;
  }
  /* Sidebar + section secPacks restent pleine largeur */
  body,html{width:100% !important;max-width:100vw !important}
}

@media(max-width:480px){
  .mg{padding:10px 8px 80px !important}
  .mg .panel{margin-bottom:14px !important}
}

/* ════════════════════════════════════════════════════════
   Patch v5 (mobile) — alignement nav/sbar + UX bilan
   - .sbar collée sous la navbar (50px)
   - body padding-top synchronisé avec la hauteur de nav
   - .bhint « Comment remplir » masqué dans le bilan
   - Tableau bilan compact : largeurs de colonnes optimisées
   ════════════════════════════════════════════════════════ */
@media(max-width:768px){
  /* Synchronise body padding-top avec nav (50px en mobile) */
  body{padding-top:50px !important}
  /* La sbar est plaquée juste sous la nav, z-index élevé pour
     passer au-dessus des panels (qui ont un stacking context
     créé par leur animation translateY) */
  .sbar{
    top:50px !important;
    border-top:none;
    z-index:500 !important;
    background:#fff !important;
    box-shadow:0 2px 8px rgba(0,0,0,.04);
  }
  /* Reset stacking context des panels pour qu'ils passent sous la sbar */
  .panel{position:relative;z-index:1}
  /* Masque le bloc « Comment remplir » dans la section Bilan */
  #sec1 > .pb > .bhint:first-child,
  .panel#sec1 .bhint{display:none !important}

  /* Tableau : largeurs réduites, padding compact */
  .bt{font-size:.66rem}
  .bt th,.bt td{padding:4px 3px}
  .bt th{font-size:.62rem}
  .bt input[type=number]{width:36px;padding:3px 4px;font-size:.66rem}
  .bt input[type=text]{width:62px;padding:3px 5px;font-size:.66rem}
  /* Colonnes nombre serrées (Qté, P.cont., H.Jour, H.Nuit) */
  .bt th:nth-child(3),.bt td:nth-child(3),
  .bt th:nth-child(4),.bt td:nth-child(4),
  .bt th:nth-child(9),.bt td:nth-child(9),
  .bt th:nth-child(10),.bt td:nth-child(10){min-width:46px;width:46px}
  .bt th:nth-child(13),.bt td:nth-child(13){min-width:60px}
  .bt th:nth-child(14),.bt td:nth-child(14){min-width:38px;width:38px}
}

@media(max-width:480px){
  .bt{font-size:.62rem;min-width:320px}
  .bt th{font-size:.58rem;line-height:1.1}
  .bt th small{font-size:.52rem}
  .bt th,.bt td{padding:3px 2px}
  .bt input[type=number]{width:32px;padding:2px 3px}
  .bt input[type=text]{width:54px;padding:2px 3px}
}

@keyframes fUp{from{opacity:0;transform:translateY(16px)}to{opacity:1;transform:none}}
.panel{animation:fUp .4s ease both;}
.panel:nth-child(1){animation-delay:.04s}.panel:nth-child(2){animation-delay:.09s}.panel:nth-child(3){animation-delay:.13s}.panel:nth-child(4){animation-delay:.17s}.panel:nth-child(5){animation-delay:.21s}.panel:nth-child(6){animation-delay:.25s}

/* ════════════════════════════════════════════════════════
   FIX gap navbar ↔ sbar (onglets 1→5)
   1. common.js bascule .scrolled sur la nav au scroll → on
      verrouille la hauteur pour empêcher tout shift.
   2. La sbar passe en position:fixed collée juste sous la
      navbar (au lieu de sticky qui dépendait du flux flex
      du body, source d'écarts parasites).
   3. Le body compense en réservant la hauteur de nav + sbar.
   ════════════════════════════════════════════════════════ */
nav#mainNav,
nav#mainNav.scrolled{height:58px !important}
@media(max-width:768px){
  nav#mainNav,
  nav#mainNav.scrolled{height:50px !important}
}

/* Sbar : fixée juste en dessous de la nav, plus aucun gap possible */
body > .sbar#sbar{
  position:fixed !important;
  left:0 !important;
  right:0 !important;
  top:58px !important;
  margin:0 !important;
  z-index:900 !important;
  background:#fff !important;
}
/* Compense la hauteur de nav (58) + sbar (~48) sur desktop */
body{padding-top:106px !important}

@media(max-width:768px){
  body > .sbar#sbar{top:50px !important;z-index:900 !important}
  /* Compense nav (50) + sbar (~46) en mobile */
  body{padding-top:96px !important}
}
@media(max-width:480px){
  /* Sbar plus compacte sur très petit écran */
  body{padding-top:92px !important}
}

/* ════════════════════════════════════════════════════════
   FIX overlap sbar (onglets) ↔ bloc invoice (panels)
   - Isole la sbar dans son propre stacking context
   - Lui donne un fond opaque + bordure + ombre pour bien
     séparer visuellement le contenu qui défile dessous
   - Force les panels à rester sous la sbar (z-index)
   - Ajoute un peu d'air entre la sbar et le 1er panel
   ════════════════════════════════════════════════════════ */
.sbar{
  isolation:isolate;
  background:#fff !important;
  border-bottom:1px solid var(--br);
  box-shadow:0 4px 12px -6px rgba(0,0,0,.10);
}
.mg{position:relative;z-index:1;}
.panel{position:relative;z-index:1;}
.mg > div > .panel:first-child,
.mg > .panel:first-child{margin-top:6px;}

@media(max-width:768px){
  .sbar{
    z-index:600 !important;
    box-shadow:0 6px 14px -8px rgba(0,0,0,.18) !important;
  }
  /* Décale légèrement le 1er panel pour éviter le contact visuel
     direct avec la sbar (la sbar reste sticky au-dessus quand on
     scrolle, mais à l'arrêt il y a un espace propre) */
  .mg{padding-top:18px !important}
  .mg > div > .panel:first-child,
  .mg > .panel:first-child{margin-top:0 !important}
  /* Sécurité : aucune transform résiduelle sur les panels après
     animation, sinon ils créent un stacking context qui rivalise
     avec la sbar */
  .panel{transform:none}
}

@media(max-width:480px){
  .mg{padding-top:14px !important}
  .sbar{padding-top:2px;padding-bottom:2px}
}

/* ════════════════════════════════════════════════════════
   ICON-ONLY toolbar (mobile + tablette portrait ≤ 768px)
   Stratégie double pour vaincre cache + spécificité :
   1) display:none sur les libellés explicites (.btn-label, .zone-trigger-text)
   2) font-size:0 sur le bouton parent pour tuer aussi tout
      text-node "nu" (espaces, retours, etc.). Les enfants
      icône (emoji span ou SVG) re-déclarent leur font-size.
   ════════════════════════════════════════════════════════ */
@media(max-width:768px){

  /* Toolbar : flex propre, gap homogène, pas de scroll horizontal */
  .bilan-toolbar{
    gap:8px !important;
    flex-wrap:wrap !important;
    overflow:visible !important;
    align-items:center !important;
    padding-bottom:0 !important;
  }

  /* 1) Masque explicite des libellés */
  .bilan-toolbar .btn-label,
  .bilan-toolbar .zone-trigger-text,
  .zone-trigger-text{display:none !important}

  /* 2+3) Bibliothèque (.abtn), Importer/Exporter (.csv-btn) et
        Zone (.zone-trigger) : MÊME dimension de cadre.
        Largeur et hauteur fixes, padding 0 → centrage parfait
        de l'icône + flèche optionnelle. */
  .bilan-toolbar .abtn,
  .bilan-toolbar .csv-btn,
  .bilan-toolbar .zone-trigger{
    width:54px !important;
    height:40px !important;
    min-width:54px !important;
    max-width:54px !important;
    padding:0 !important;
    margin:0 !important;
    box-sizing:border-box !important;
    border-radius:10px !important;
    font-size:1.05rem !important;
    line-height:1 !important;
    display:inline-flex !important;
    align-items:center !important;
    justify-content:center !important;
    gap:3px !important;
    white-space:nowrap !important;
    flex-shrink:0 !important;
  }
  /* Bordure : on harmonise l'épaisseur (1.5px) déjà commune,
     les couleurs/styles (dashed vert, solid bleu, solid gris) sont
     conservées pour rester reconnaissables. */
  .bilan-toolbar .abtn{border-width:1.5px !important}
  .bilan-toolbar .csv-btn{border-width:1.5px !important}
  .bilan-toolbar .zone-trigger{border-width:1.5px !important}

  /* Petites flèches déroulantes : compactes, pas de margin */
  .bilan-toolbar .csv-btn .io-arrow,
  .bilan-toolbar .zone-trigger-arrow{
    font-size:.55rem !important;
    margin:0 !important;
  }
  .bilan-toolbar .zone-trigger-icon{font-size:1.05rem !important}

  /* 4) Vue liste / Vue par pièce : SVG seul, sans cadre */
  .view-btns{flex-shrink:0;display:inline-flex;gap:4px}
  .bilan-toolbar .vbtn{
    padding:8px !important;
    border:none !important;
    background:transparent !important;
    box-shadow:none !important;
    color:var(--mu) !important;
    display:inline-flex !important;
    align-items:center !important;
    justify-content:center !important;
    min-width:36px !important;height:36px !important;
    border-radius:8px !important;
    font-size:0 !important;
    line-height:0 !important;
  }
  .bilan-toolbar .vbtn:hover:not(.active){
    color:var(--g) !important;
    background:rgba(5,167,5,.08) !important;
  }
  .bilan-toolbar .vbtn.active{
    background:rgba(5,167,5,.14) !important;
    color:var(--g) !important;
  }
  .bilan-toolbar .vbtn-icon{
    width:20px !important;height:20px !important;
    flex-shrink:0;
    display:block !important;
  }

  /* 5) Filet de sécurité : si malgré tout un .btn-label apparaissait,
        on l'écrase avec une 2e couche de spécificité forte. */
  .bilan-toolbar button .btn-label,
  .bilan-toolbar a .btn-label,
  .bilan-toolbar .abtn > .btn-label,
  .bilan-toolbar .csv-btn > .btn-label,
  .bilan-toolbar .vbtn > .btn-label{
    display:none !important;
    visibility:hidden !important;
    width:0 !important;
    height:0 !important;
    overflow:hidden !important;
    font-size:0 !important;
    opacity:0 !important;
    position:absolute !important;
    pointer-events:none !important;
  }

  /* 6) FIX déroulés (Importer/Exporter et Zone) coupés
        .panel a overflow:hidden → quand le dropdown sort en bas
        ou à droite du panneau, il est rogné. On libère l'overflow
        sur le panneau Bilan, et on ajoute un fond + ombre forte
        aux dropdowns pour qu'ils restent lisibles par-dessus tout. */
  .panel#sec1{overflow:visible !important}
  .panel#sec1 .pb{overflow:visible !important}
  .bilan-toolbar{overflow:visible !important}
  .io-drop-wrap{position:relative !important}
  .zone-row{position:relative !important}

  .io-drop{
    z-index:2000 !important;
    min-width:240px !important;
    max-width:calc(100vw - 24px) !important;
    box-shadow:0 16px 44px rgba(0,0,0,.22) !important;
    background:#fff !important;
  }
  .zone-dropdown{
    z-index:2000 !important;
    min-width:210px !important;
    max-width:calc(100vw - 24px) !important;
    box-shadow:0 16px 44px rgba(0,0,0,.22) !important;
    background:#fff !important;
  }

  /* Si le dropdown risque de dépasser à droite, on le replie
     vers la gauche en l'ancrant sur le côté droit du bouton. */
  .io-drop-wrap .io-drop{left:auto !important;right:0 !important}
}

/* ════════════════════════════════════════════════════════
   Backdrop overlay (créé par JS via _showDDBackdrop)
   Styles toujours actifs (pas seulement en mobile) pour
   garantir l'overlay + blur quel que soit le viewport.
   ════════════════════════════════════════════════════════ */
.dd-backdrop{
  position:fixed;
  inset:0;
  background:rgba(0,0,0,.55);
  -webkit-backdrop-filter:blur(6px);
  backdrop-filter:blur(6px);
  z-index:9990;
  opacity:0;
  transition:opacity .25s ease, backdrop-filter .25s ease;
  pointer-events:none;
}
.dd-backdrop.show{opacity:1;pointer-events:auto;}

/* ════════════════════════════════════════════════════════
   MOBILE : déroulés (Importer/Exporter + Zone) en bottom-sheet
   modal. Sur ≤ 768 px ils sortent du flux du panneau et
   s'ancrent en bas de l'écran avec un backdrop semi-opaque.
   ════════════════════════════════════════════════════════ */
@media(max-width:768px){
  /* Verrou de l'arrière-plan :
     - position:fixed gèle le viewport (technique iOS Safari fiable)
     - largeur 100% pour garder la mise en page
     - top défini par le JS (-scrollY) pour conserver la position visuelle
     - touch-action:none coupe tout scroll/zoom tactile
     - user-select:none évite la sélection accidentelle de texte derrière */
  body.dd-modal-open{
    position:fixed !important;
    left:0 !important;
    right:0 !important;
    width:100% !important;
    overflow:hidden !important;
    touch-action:none !important;
    -webkit-user-select:none !important;
    user-select:none !important;
  }
  /* Le sheet et le bouton fermer doivent rester sélectionnables/scrollables */
  body.dd-modal-open .io-drop,
  body.dd-modal-open .zone-dropdown,
  body.dd-modal-open .dd-close-btn{
    touch-action:auto !important;
    -webkit-user-select:auto !important;
    user-select:auto !important;
  }

  /* Dropdown → bottom-sheet : couvre toute la largeur, ancré en bas */
  .io-drop,
  .zone-dropdown{
    position:fixed !important;
    left:0 !important;
    right:0 !important;
    bottom:0 !important;
    top:auto !important;
    width:100% !important;
    max-width:100% !important;
    min-width:0 !important;
    margin:0 !important;
    border-radius:22px 22px 0 0 !important;
    border:none !important;
    padding:18px 0 max(28px,env(safe-area-inset-bottom)) !important;
    z-index:9999 !important;
    box-shadow:0 -16px 48px rgba(0,0,0,.28) !important;
    background:#fff !important;
    max-height:78vh;
    overflow-y:auto;
    -webkit-overflow-scrolling:touch;
    /* État fermé : caché en bas */
    display:block !important;
    visibility:hidden;
    transform:translateY(100%);
    transition:transform .32s cubic-bezier(.32,.72,.27,1.0),
               visibility 0s linear .32s;
    animation:none !important;
  }
  .io-drop.open,
  .zone-dropdown.open{
    visibility:visible;
    transform:translateY(0);
    transition:transform .32s cubic-bezier(.32,.72,.27,1.0),
               visibility 0s linear 0s;
  }

  /* Petite barre poignée en haut du sheet */
  .io-drop::before,
  .zone-dropdown::before{
    content:'';
    position:sticky;
    top:0;
    display:block;
    width:42px;
    height:4px;
    background:#d4dad4;
    border-radius:3px;
    margin:0 auto 14px;
  }

  /* Bouton fermer en haut à droite du sheet */
  .dd-close-btn{
    position:absolute;
    top:12px;
    right:14px;
    width:36px;
    height:36px;
    border:none;
    border-radius:50%;
    background:rgba(0,0,0,.06);
    color:#444;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    cursor:pointer;
    transition:background .15s,color .15s,transform .15s;
    z-index:5;
    padding:0;
  }
  .dd-close-btn:hover{background:rgba(0,0,0,.10);color:#000;}
  .dd-close-btn:active{transform:scale(.92);}
  .dd-close-btn svg{width:18px;height:18px;display:block;}

  /* Titre du sheet — on agrandit les .io-drop-label déjà présents */
  .io-drop .io-drop-label{
    padding:10px 22px 6px !important;
    font-size:.72rem !important;
  }
  .io-drop .io-drop-sep{margin:8px 14px !important;}

  /* Items cliquables : touch targets confortables */
  .io-drop .io-opt,
  .zone-dropdown .zone-opt{
    padding:14px 22px !important;
    font-size:.92rem !important;
    gap:12px !important;
    min-height:52px;
    align-items:center;
    border-radius:0 !important;
  }
  .io-drop .io-opt:active,
  .zone-dropdown .zone-opt:active{background:rgba(5,167,5,.12) !important;}

  .zone-dropdown .zone-opt-icon{font-size:1.25rem !important;flex-shrink:0;width:28px;text-align:center;}
  .zone-dropdown .zone-opt-text{font-size:.92rem !important;}
  .zone-dropdown .zone-opt.selected{background:rgba(5,167,5,.10) !important;color:var(--g) !important;font-weight:700;}
  .zone-dropdown .zone-opt.selected::after{
    content:'✓';
    margin-left:auto;
    color:var(--g);
    font-weight:700;
  }

  /* Annule l'ancrage right:0 desktop — le sheet est plein écran */
  .io-drop-wrap .io-drop{right:auto !important;left:0 !important;}
}

.pc2-dim{opacity:.55;border-style:dashed!important;}
/* ── Locked section state ── */
.sec-locked{display:none;flex-direction:column;align-items:center;justify-content:center;gap:10px;padding:32px 20px;text-align:center;}
.sec-locked.visible{display:flex;}
.sec-locked-icon{font-size:2rem;opacity:.35;}
.sec-locked-text{font-size:.78rem;color:var(--mu);line-height:1.6;max-width:320px;}
.sec-locked-text strong{color:var(--gd);}
.sec-content{display:none;}
/* ── Badge verrou dans header panneau ── */
.ph-lock-badge{display:none;align-items:center;gap:5px;margin-left:auto;background:rgba(245,166,35,.1);border:1px solid rgba(245,166,35,.3);border-radius:20px;padding:3px 10px 3px 7px;font-size:.7rem;font-weight:600;color:#b8840a;white-space:nowrap;position:relative;}
.ph-lock-badge.visible{display:inline-flex;}
.ph-lock-badge-icon{font-size:.8rem;flex-shrink:0;}
.ph-lock-badge-tip{position:absolute;bottom:calc(100% + 8px);right:0;background:#1d2421;color:#fff;font-size:.71rem;font-weight:500;padding:7px 11px;border-radius:9px;white-space:normal;width:220px;line-height:1.5;box-shadow:0 6px 20px rgba(0,0,0,.22);pointer-events:none;opacity:0;transition:opacity .2s;z-index:100;text-align:left;}
.ph-lock-badge-tip::after{content:"";position:absolute;top:100%;right:14px;border:6px solid transparent;border-top-color:#1d2421;}
.ph-lock-badge:hover .ph-lock-badge-tip{opacity:1;}
.sec-content.visible{display:block;}
.pc2-dim:hover{opacity:.85;border-color:var(--g)!important;}
.pc2-dim.sel{opacity:1;border-style:solid!important;}
.volt-tag{display:inline-block;margin-left:6px;font-size:.6rem;background:#e8e8e8;color:#555;border-radius:4px;padding:1px 5px;font-weight:600;vertical-align:middle;}
.other-volt-lbl{font-size:.68rem;color:var(--mu);text-transform:uppercase;letter-spacing:.8px;font-weight:600;margin:10px 0 5px;padding-top:8px;border-top:1px dashed var(--br);}

.pc2-dim{opacity:.52;border-style:dashed!important;}
.pc2-dim:hover{opacity:.85;border-color:var(--g)!important;background:var(--gl);}
.pc2-dim.sel{opacity:1;border-style:solid!important;}
.volt-tag{display:inline-block;margin-left:6px;font-size:.58rem;background:rgba(5,167,5,.12);color:var(--gd);border-radius:4px;padding:1px 5px;font-weight:700;vertical-align:middle;letter-spacing:.4px;}
.other-volt-lbl{font-size:.67rem;color:var(--mu);text-transform:uppercase;letter-spacing:.8px;font-weight:600;margin:11px 0 5px;padding-top:9px;border-top:1px dashed var(--br);}

/* ── ANALYSE GRAPHIQUE ────────────────────────────────── */
.anlys-empty{text-align:center;padding:40px 20px;color:var(--mu);font-size:.85rem;line-height:1.8;}
.anlys-empty-icon{font-size:2.4rem;margin-bottom:10px;opacity:.3;}
.anlys-grid{display:grid;grid-template-columns:1fr 1fr 1fr;gap:14px;margin-bottom:18px;}
@media(max-width:900px){.anlys-grid{grid-template-columns:1fr 1fr;}}@media(max-width:580px){.anlys-grid{grid-template-columns:1fr;}.donut-container{flex-direction:column;}}
.anlys-card{background:#f7fbf7;border:1px solid var(--br);border-radius:14px;padding:16px 18px;}
.anlys-card h4{font-size:.78rem;font-weight:700;color:var(--dk);margin-bottom:12px;display:flex;align-items:center;gap:7px;}
.prio-bars{display:flex;flex-direction:column;gap:11px;padding-top:2px;}
.pb-row{display:flex;flex-direction:column;gap:3px;}
.pb-head{display:flex;align-items:center;justify-content:space-between;font-size:.71rem;font-weight:700;}
.pb-track{height:16px;background:#eef2ee;border-radius:30px;overflow:hidden;}
.pb-fill{height:100%;border-radius:30px;display:flex;align-items:center;justify-content:flex-end;padding-right:6px;font-size:.6rem;font-weight:800;color:#fff;transition:width .7s cubic-bezier(.4,0,.2,1);min-width:0;}
.pb-sub{font-size:.66rem;color:var(--mu);text-align:right;}
.lib-sw{display:flex;align-items:center;gap:7px;padding:9px 14px;background:#f8faf8;border-bottom:1px solid #e8ede8;flex-shrink:0;}
.lib-sw input{flex:1;padding:7px 11px 7px 30px;border:1.5px solid #dde8de;border-radius:8px;font-family:Outfit,sans-serif;font-size:.8rem;color:#1d2421;background:#fff;transition:border-color .2s;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='13' height='13' viewBox='0 0 24 24' fill='none' stroke='%23aaa' stroke-width='2.5'%3E%3Ccircle cx='11' cy='11' r='8'/%3E%3Cpath d='M21 21l-4.35-4.35'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:9px center;}
.lib-sw input:focus{outline:none;border-color:var(--g);}
.lib-sw input::placeholder{color:#bbb;}

.anlys-card h4 span{width:28px;height:28px;background:var(--gr);border-radius:8px;display:inline-flex;align-items:center;justify-content:center;font-size:.9rem;}
.chart-wrap{position:relative;width:100%;height:180px;}
.chart-wrap canvas{width:100%!important;height:100%!important;}
.bar-chart-wrap{display:flex;flex-direction:column;gap:7px;padding-top:4px;}
.bar-row{display:flex;align-items:center;gap:9px;font-size:.72rem;}
.bar-lbl{width:110px;flex-shrink:0;color:var(--txt);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-weight:500;}
.bar-track{flex:1;background:#e8f0e8;border-radius:20px;height:12px;overflow:hidden;position:relative;}
.bar-fill{height:100%;border-radius:20px;transition:width .5s cubic-bezier(.4,0,.2,1);min-width:2px;}
.bar-val{width:60px;text-align:right;font-weight:700;color:var(--gd);flex-shrink:0;}
.bar-fill.danger{background:linear-gradient(90deg,#f5a623,#e05);}
.bar-fill.warn{background:linear-gradient(90deg,#f5c842,#f5a623);}
.bar-fill.ok{background:linear-gradient(90deg,#05a705,#30d158);}
.badge-energivore{display:inline-block;background:#fff0e0;border:1px solid #f5a623;color:#c97a00;font-size:.6rem;font-weight:700;padding:1px 7px;border-radius:20px;margin-left:6px;vertical-align:middle;}
.anlys-kpis{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-bottom:16px;}
.kpi-card{background:linear-gradient(135deg,#f0faf0,#e8f5e8);border:1px solid var(--br);border-radius:12px;padding:13px 10px;text-align:center;}
.kpi-val{font-size:1.25rem;font-weight:900;background:var(--gr);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;line-height:1;}
.kpi-lbl{font-size:.62rem;color:var(--mu);margin-top:4px;text-transform:uppercase;letter-spacing:.5px;font-weight:600;}
.reco-list{display:flex;flex-direction:column;gap:8px;}
.reco-item{display:flex;align-items:flex-start;gap:10px;padding:10px 13px;border-radius:10px;font-size:.76rem;line-height:1.5;}
.reco-item.danger{background:#fff6ed;border:1px solid #fddcb0;}
.reco-item.warn{background:#fffbea;border:1px solid #fce97a;}
.reco-item.ok{background:#f0faf0;border:1px solid var(--br);}
.reco-item.info{background:#f0f6ff;border:1px solid #c0d6f7;}
.reco-icon{font-size:1rem;flex-shrink:0;margin-top:1px;}
.reco-text strong{display:block;font-weight:700;color:var(--dk);margin-bottom:2px;}
.reco-text span{color:var(--mu);}
.anlys-impact{background:linear-gradient(135deg,#0d1f10,#123016);border-radius:14px;padding:16px 18px;color:#fff;margin-bottom:16px;}
.anlys-impact h4{font-size:.78rem;font-weight:700;color:rgba(255,255,255,.7);margin-bottom:12px;display:flex;align-items:center;gap:8px;}
.anlys-impact h4::before{content:"";display:inline-block;width:3px;height:14px;background:var(--gm);border-radius:2px;}
.impact-row{display:flex;justify-content:space-between;align-items:center;padding:6px 0;border-bottom:1px solid rgba(255,255,255,.06);font-size:.75rem;}
.impact-row:last-child{border-bottom:none;}
.impact-lbl{color:rgba(255,255,255,.45);}
.impact-val{font-weight:700;color:var(--gm);}
.impact-val.warn{color:#f5c842;}
.impact-val.danger{color:#ff6b6b;}
.donut-container{display:flex;align-items:center;gap:16px;}
.donut-legend{flex:1;display:flex;flex-direction:column;gap:6px;}
.legend-item{display:flex;align-items:center;gap:7px;font-size:.7rem;}
.legend-dot{width:10px;height:10px;border-radius:50%;flex-shrink:0;}
.legend-lbl{flex:1;color:var(--txt);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.legend-pct{font-weight:700;color:var(--gd);}
/* ── Accessoires & Logistique section ── */
.acc-section{margin-bottom:10px;}
.acc-cat-header{display:flex;align-items:center;gap:8px;background:linear-gradient(90deg,rgba(5,167,5,.07),transparent);padding:7px 10px 7px 12px;border-radius:8px 8px 0 0;border:1px solid var(--br);border-bottom:none;font-size:.75rem;font-weight:800;color:var(--gd);cursor:pointer;user-select:none;position:relative;}
.wa-opt{display:flex;align-items:center;gap:9px;padding:8px 12px;cursor:pointer;transition:background .12s;}
.wa-opt:hover{background:#ddf0e4;}
.wa-opt.selected{background:#ccebd6;}
.wa-opt-av{width:30px;height:30px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:.65rem;font-weight:800;flex-shrink:0;background:#d0eeda;color:#2e6b3e;}
.wa-opt-info{display:flex;flex-direction:column;gap:2px;min-width:0;flex:1;}
.wa-opt-name{font-size:.78rem;font-weight:700;color:#1a3a22;}
.wa-opt-num{font-size:.65rem;color:#5a8a68;}
.wa-opt-del{margin-left:auto;border:none;background:transparent;color:#c0a0a0;cursor:pointer;font-size:.8rem;padding:2px 4px;border-radius:4px;line-height:1;}
.wa-opt-del:hover{background:#fde8e8;color:#c0392b;}
#waDropTrigger:hover{border-color:rgba(37,211,102,.6);}
.mo-section{border-radius:8px;overflow:hidden;border:1px solid rgba(255,150,30,.28);}
.mo-header{display:flex;align-items:center;gap:8px;background:linear-gradient(90deg,rgba(255,150,30,.09),transparent);padding:7px 10px 7px 12px;font-size:.75rem;font-weight:800;color:#b85e00;}
.acc-cat-arrow{margin-left:auto;font-size:.6rem;color:var(--mu);transition:transform .2s;}
.acc-cat-header.collapsed .acc-cat-arrow{transform:rotate(-90deg);}
.acc-cat-total{margin-left:8px;font-size:.72rem;font-weight:700;color:var(--g);background:rgba(5,167,5,.1);padding:2px 8px;border-radius:10px;}
.acc-table{width:100%;border-collapse:collapse;font-size:.76rem;border:1px solid var(--br);border-top:none;border-radius:0 0 8px 8px;overflow:hidden;}
.acc-table th{background:#f0f7f0;color:var(--dk);font-weight:700;padding:6px 8px;text-align:center;border-bottom:1px solid var(--br);font-size:.68rem;white-space:nowrap;}
.acc-table th.l{text-align:left;padding-left:10px;}
.acc-table td{padding:5px 7px;border-bottom:1px solid #f0f5f0;text-align:center;vertical-align:middle;}
.acc-table td.l{text-align:left;padding-left:10px;}
.acc-table tr:last-child td{border-bottom:none;}
.acc-table tr.acc-disabled td{opacity:.38;}
.acc-table tr.acc-disabled td input{opacity:.5;pointer-events:none;}
.acc-toggle{width:32px;height:18px;border-radius:9px;border:none;cursor:pointer;position:relative;transition:background .2s;flex-shrink:0;background:#ddd;padding:0;display:inline-block;}
.acc-toggle::after{content:"";position:absolute;top:2px;left:2px;width:14px;height:14px;border-radius:50%;background:#fff;transition:transform .2s;box-shadow:0 1px 3px rgba(0,0,0,.2);}
.acc-toggle.on{background:var(--g);}
.acc-toggle.on::after{transform:translateX(14px);}
.acc-inp{width:100%;border:1px solid var(--br);border-radius:5px;padding:3px 5px;font-family:Outfit,sans-serif;font-size:.74rem;text-align:right;background:#fff;color:var(--txt);}
.acc-inp:focus{outline:none;border-color:var(--g);background:rgba(5,167,5,.04);}
.acc-inp.name{text-align:left;}
.acc-tip-wrap{position:relative;display:flex;align-items:center;gap:5px;}
.acc-tip-icon{flex-shrink:0;width:15px;height:15px;border-radius:50%;background:rgba(5,167,5,.15);color:var(--gd);font-size:.6rem;font-weight:800;display:inline-flex;align-items:center;justify-content:center;cursor:default;user-select:none;}
#accTipBox{position:fixed;z-index:9999;background:#1a2620;color:#e8f5e8;font-size:.7rem;line-height:1.5;padding:8px 11px;border-radius:8px;max-width:240px;pointer-events:none;opacity:0;transition:opacity .15s;white-space:normal;box-shadow:0 4px 18px rgba(0,0,0,.4);}
.acc-del{width:22px;height:22px;border-radius:50%;border:1px solid rgba(229,57,53,.3);background:transparent;color:rgba(229,57,53,.55);font-size:.75rem;cursor:pointer;display:inline-flex;align-items:center;justify-content:center;transition:all .15s;flex-shrink:0;padding:0;}
.acc-del:hover{background:rgba(229,57,53,.1);color:#e53935;border-color:#e53935;}
.acc-add-btn{margin-top:7px;padding:5px 12px;border:1.5px dashed var(--g);border-radius:7px;background:transparent;color:var(--g);font-family:Outfit,sans-serif;font-size:.75rem;font-weight:600;cursor:pointer;transition:all .2s;display:inline-flex;align-items:center;gap:5px;}
.acc-add-btn:hover{background:var(--gl);}
.acc-grand-total{display:flex;align-items:center;justify-content:space-between;padding:10px 14px;background:linear-gradient(90deg,rgba(5,167,5,.08),rgba(5,167,5,.03));border:1px solid rgba(5,167,5,.2);border-radius:10px;margin-top:12px;}
.acc-grand-total-lbl{font-size:.8rem;font-weight:700;color:var(--dk);}
.acc-grand-total-val{font-size:1rem;font-weight:900;color:var(--g);}
/* ── Boutons Fiche Technique & Manuel ── */
.ds-btn{display:none;align-items:center;gap:5px;padding:5px 10px;border:1.5px solid rgba(5,167,5,.35);border-radius:8px;background:rgba(5,167,5,.06);color:var(--gd);font-family:Outfit,sans-serif;font-size:.72rem;font-weight:700;cursor:pointer;text-decoration:none;white-space:nowrap;transition:all .18s;flex-shrink:0;position:relative;}
.ds-btn:hover{background:rgba(5,167,5,.14);border-color:var(--g);color:var(--g);}
.ds-btn.visible{display:flex;}
.ds-btn svg{flex-shrink:0;}
.ds-btn.man-btn{border-color:rgba(99,102,241,.35);background:rgba(99,102,241,.06);color:#6366f1;}
.ds-btn.man-btn:hover{background:rgba(99,102,241,.14);border-color:#6366f1;color:#6366f1;}
.ds-btns{display:flex;gap:6px;align-items:center;flex-shrink:0;}

/* ══ STYLE BLOCK 2 ══ */

#secPacks{position:relative;overflow:hidden;}
#secPacks::before{
  content:"";position:absolute;inset:0;pointer-events:none;
  background:radial-gradient(ellipse 80% 50% at 50% 0%,rgba(5,167,5,.07),transparent),
             radial-gradient(ellipse 40% 40% at 90% 90%,rgba(5,167,5,.04),transparent);
}

/* ── Header ── */
.pk-hdr{text-align:center;margin-bottom:48px;position:relative;z-index:1;}
.pk-eyebrow{
  display:inline-flex;align-items:center;gap:6px;
  font-size:.65rem;font-weight:800;letter-spacing:2.5px;text-transform:uppercase;
  color:var(--gd);margin-bottom:16px;
}
.pk-eyebrow span{display:inline-block;width:20px;height:1.5px;background:var(--gd);}
.pk-title{
  font-family:"DM Serif Display",serif;
  font-size:clamp(1rem,2vw,1.4rem);
  color:#111412;line-height:1.1;margin-bottom:12px;
}
.pk-title em{font-style:normal;background:var(--gr);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;}
.pk-sub{font-size:.82rem;color:#6b7a70;max-width:380px;margin:0 auto;}

/* ── Grid ── */
.pk-grid{
  max-width:1200px;margin:0 auto;padding:0 4%;
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:14px;
}

/* ── Card ── */
.pkc{
  position:relative;
  border-radius:16px;
  overflow:hidden;
  cursor:pointer;
  background:var(--pkc-bg,#fff);
  border:1px solid var(--pkc-border,rgba(0,0,0,.07));
  transition:transform .22s cubic-bezier(.34,1.4,.64,1), box-shadow .22s, border-color .22s;
  display:flex;flex-direction:column;
  min-height:200px;
  box-shadow:0 2px 8px rgba(0,0,0,.05);
}
.pkc:hover{
  transform:translateY(-5px) scale(1.015);
  box-shadow:0 20px 40px rgba(0,0,0,.12), 0 0 0 1.5px var(--pkc-glow,rgba(5,167,5,.4));
  border-color:var(--pkc-glow,rgba(5,167,5,.4));
}
/* Glow gradient top */
.pkc-glow{
  position:absolute;top:0;left:0;right:0;height:80px;
  background:linear-gradient(to bottom,var(--pkc-top,rgba(5,167,5,.1)),transparent);
  pointer-events:none;z-index:0;
}
/* Dot grid texture */
.pkc-dots{
  position:absolute;inset:0;pointer-events:none;z-index:0;
  background-image:radial-gradient(circle,rgba(0,0,0,.035) 1px,transparent 1px);
  background-size:18px 18px;
}
/* Content */
.pkc-inner{position:relative;z-index:1;padding:20px 20px 18px;display:flex;flex-direction:column;gap:14px;flex:1;}
.pkc-top{display:flex;align-items:flex-start;gap:12px;}
.pkc-emoji{
  width:48px;height:48px;border-radius:12px;flex-shrink:0;
  background:var(--pkc-ico-bg,rgba(5,167,5,.1));
  border:1px solid var(--pkc-ico-border,rgba(5,167,5,.15));
  display:flex;align-items:center;justify-content:center;
  font-size:1.5rem;line-height:1;
}
.pkc-meta{flex:1;min-width:0;}
.pkc-name{
  font-size:.88rem;font-weight:800;color:#111412;
  line-height:1.2;margin-bottom:4px;letter-spacing:-.1px;
}
.pkc-desc{font-size:.67rem;color:#6b7a70;line-height:1.5;}
/* Tag row */
.pkc-tags{display:flex;gap:5px;flex-wrap:wrap;}
.pkc-tag{
  font-size:.58rem;font-weight:700;letter-spacing:.3px;
  padding:2px 8px;border-radius:20px;
  background:rgba(0,0,0,.04);
  color:#9aaa9e;
  border:1px solid rgba(0,0,0,.07);
}
.pkc-tag.hi{
  background:var(--pkc-tag-bg,rgba(5,167,5,.09));
  color:var(--pkc-tag-c,#037a03);
  border-color:var(--pkc-tag-b,rgba(5,167,5,.2));
}
/* Bottom row */
.pkc-foot{
  display:flex;align-items:center;justify-content:space-between;
  padding-top:12px;margin-top:auto;
  position:relative;
}
/* ── Ticket tear line ── */
.pkc-tear{
  position:relative;
  margin:0 -1px;
  height:1px;
  border:none;
  background:repeating-linear-gradient(
    90deg,
    var(--pkc-tag-c, rgba(5,167,5,.6)) 0px,
    var(--pkc-tag-c, rgba(5,167,5,.6)) 5px,
    transparent 5px,
    transparent 10px
  );
  opacity:.4;
}
/* Half-circle notches on each side */
.pkc-tear::before,
.pkc-tear::after{
  content:"";
  position:absolute;
  top:50%;transform:translateY(-50%);
  width:14px;height:14px;
  border-radius:50%;
  background:#f0f5f0; /* matches section bg */
  border:1px solid var(--pkc-border, rgba(0,0,0,.07));
}
.pkc-tear::before{left:-8px;}
.pkc-tear::after{right:-8px;}
.pkc-count{font-size:.62rem;color:#9aaa9e;font-weight:600;}
.pkc-btn{
  display:inline-flex;align-items:center;gap:5px;
  padding:6px 13px;border-radius:8px;border:none;cursor:pointer;
  background:var(--pkc-btn,rgba(5,167,5,.1));
  color:var(--pkc-btn-c,#037a03);
  border:1px solid var(--pkc-btn-b,rgba(5,167,5,.2));
  font-family:Outfit,sans-serif;font-size:.68rem;font-weight:700;
  letter-spacing:.2px;
  transition:background .15s, transform .1s;
}
.pkc-btn:hover{background:var(--pkc-btn-h,rgba(5,167,5,.18));}
.pkc-btn:active{transform:scale(.95);}
.pkc-btn svg{flex-shrink:0;}

@media(max-width:780px){.pk-grid{grid-template-columns:repeat(2,1fr);}}
@media(max-width:480px){.pk-grid{grid-template-columns:1fr;}}

/* ── Pagination ── */
.pk-dot{
  width:8px;height:8px;border-radius:50%;
  background:rgba(0,0,0,.15);border:none;cursor:pointer;
  transition:transform .2s,background .2s;padding:0;
}
.pk-dot.active{background:var(--g);transform:scale(1.35);}
.pk-dot:hover:not(.active){background:rgba(0,0,0,.3);}
.pk-nav{
  display:flex;align-items:center;justify-content:center;gap:6px;
  width:34px;height:34px;border-radius:50%;border:1.5px solid rgba(0,0,0,.12);
  background:#fff;cursor:pointer;color:#555;
  font-size:.85rem;transition:all .15s;box-shadow:0 1px 4px rgba(0,0,0,.07);
}
.pk-nav:hover{border-color:var(--g);color:var(--g);box-shadow:0 2px 8px rgba(5,167,5,.15);}
.pk-nav:disabled{opacity:.3;cursor:default;pointer-events:none;}
.pk-page-lbl{font-size:.72rem;font-weight:700;color:#6b7a70;letter-spacing:.5px;margin:0 4px;}

/* ══ STYLE BLOCK 3 ══ */

.pk-search-wrap{max-width:860px;margin-left:auto;margin-right:auto;}
.pk-search-bar{
  display:flex;align-items:center;gap:10px;
  background:#fff;border:2px solid var(--br);border-radius:14px;
  padding:10px 16px;box-shadow:0 4px 18px rgba(0,0,0,.07);
  transition:border-color .2s,box-shadow .2s;
}
.pk-search-bar:focus-within{border-color:var(--g);box-shadow:0 4px 22px rgba(5,167,5,.13);}
.pk-search-icon{font-size:1.1rem;flex-shrink:0;}
.pk-search-input{
  flex:1;border:none;outline:none;font-family:Outfit,sans-serif;
  font-size:.88rem;font-weight:500;color:var(--txt);background:transparent;
}
.pk-search-input::placeholder{color:#aab8b0;}
.pk-search-count{font-size:.72rem;font-weight:700;color:var(--mu);white-space:nowrap;flex-shrink:0;}
.pk-search-clear{border:none;background:transparent;cursor:pointer;color:var(--mu);font-size:.85rem;padding:0 2px;line-height:1;transition:color .15s;flex-shrink:0;}
.pk-search-clear:hover{color:#e53935;}
/* Mic button */
.pk-mic-btn{
  width:30px;height:30px;border-radius:8px;border:1.5px solid var(--br);
  background:transparent;color:var(--mu);cursor:pointer;
  display:inline-flex;align-items:center;justify-content:center;
  flex-shrink:0;transition:all .2s;padding:0;
}
.pk-mic-btn:hover{border-color:var(--g);color:var(--g);background:rgba(5,167,5,.06);}
.pk-mic-btn.listening{border-color:#e53935;color:#e53935;background:rgba(229,57,53,.07);animation:pkMicPulse .8s ease-in-out infinite;}
@keyframes pkMicPulse{0%,100%{box-shadow:0 0 0 0 rgba(229,57,53,.3);}50%{box-shadow:0 0 0 5px rgba(229,57,53,.0);}}
/* Tags — une seule ligne sur desktop */
.pk-search-tags{
  display:flex;flex-wrap:nowrap;gap:6px;margin-top:12px;
  justify-content:center;overflow-x:auto;
  scrollbar-width:none;-ms-overflow-style:none;
}
.pk-search-tags::-webkit-scrollbar{display:none;}
.pk-stag{
  padding:4px 12px;border-radius:20px;border:1.5px solid var(--br);
  background:#fff;font-family:Outfit,sans-serif;font-size:.72rem;font-weight:600;
  color:var(--mu);cursor:pointer;transition:all .15s;white-space:nowrap;flex-shrink:0;
}
.pk-stag:hover{border-color:var(--g);color:var(--g);}
.pk-stag.active{background:var(--g);border-color:var(--g);color:#fff;}
@media(max-width:640px){
  .pk-search-tags{justify-content:flex-start;}
}
/* Résultats live */
.pk-search-results{
  position:absolute;left:0;right:0;top:calc(100% + 8px);
  background:#fff;border:1.5px solid var(--br);border-radius:14px;
  box-shadow:0 12px 36px rgba(0,0,0,.13);overflow:hidden;z-index:500;
}
.pk-sr-item{
  display:flex;align-items:center;gap:12px;padding:10px 16px;
  cursor:pointer;transition:background .12s;border-bottom:1px solid #f0f5f0;
}
.pk-sr-item:last-child{border-bottom:none;}
.pk-sr-item:hover{background:var(--gl);}
.pk-sr-ico{font-size:1.3rem;flex-shrink:0;}
.pk-sr-name{font-size:.84rem;font-weight:700;color:var(--dk);}
.pk-sr-desc{font-size:.7rem;color:var(--mu);margin-top:1px;}
.pk-sr-tags{display:flex;gap:4px;flex-wrap:wrap;margin-top:3px;}
.pk-sr-tag{font-size:.6rem;font-weight:700;padding:1px 7px;border-radius:10px;background:rgba(5,167,5,.09);color:var(--gd);border:1px solid rgba(5,167,5,.18);}
.pk-sr-empty{padding:18px 16px;text-align:center;font-size:.82rem;color:var(--mu);}
.pk-sr-load{margin-left:auto;flex-shrink:0;padding:5px 11px;border-radius:7px;border:1.5px solid rgba(5,167,5,.25);background:rgba(5,167,5,.07);color:var(--gd);font-family:Outfit,sans-serif;font-size:.68rem;font-weight:700;cursor:pointer;transition:all .15s;}
.pk-sr-load:hover{background:rgba(5,167,5,.15);}

/* ══ STYLE BLOCK 4 ══ */
'
  +'*{margin:0;padding:0;box-sizing:border-box;}'
  +'body{font-family:Outfit,Arial,sans-serif;color:#000;background:#fff;padding:14mm 16mm;font-size:9pt;}'
  +'.pph{text-align:center;padding-bottom:6mm;border-bottom:2px solid #000;margin-bottom:5mm;}'
  +'.pph h1{font-family:"DM Serif Display",Georgia,serif;font-size:22pt;font-weight:900;letter-spacing:1px;margin-bottom:2mm;}'
  +'.pph h1 span{color:#05a705;}'
  +'.pph .tag{font-size:7pt;color:#555;font-style:italic;text-transform:uppercase;letter-spacing:.6px;margin-bottom:2mm;}'
  +'.pph .infos{font-size:7.5pt;color:#333;line-height:2;}'
  +'.titre{text-align:center;margin:6mm 0 3mm;}'
  +'.titre h2{font-size:12pt;font-weight:900;color:#000;}'
  +'.titre .sub{font-size:9pt;text-decoration:underline;margin-top:2mm;color:#333;}'
  +'.intro{font-size:8.5pt;color:#333;text-align:center;line-height:1.8;margin:4mm 15mm 5mm;}'
  +'.client-bar{display:flex;justify-content:space-between;align-items:flex-start;background:#f0faf0;border-left:4px solid #05a705;padding:6px 12px;margin:4mm 0 5mm;}'
  +'.client-bar .cn{font-size:10pt;font-weight:800;margin-bottom:2px;}'
  +'.client-bar .ct{font-size:7.5pt;color:#444;}'
  +'.client-bar .dn{text-align:right;font-size:7.5pt;line-height:1.9;}'
  +'.tbl-devis{width:100%;border-collapse:collapse;font-size:8.5pt;margin-bottom:2mm;}'
  +'.tbl-devis thead th{background:#05a705;color:#fff;font-weight:800;padding:7px 10px;letter-spacing:.3px;text-align:center;border:1px solid #038a03;}'
  +'.tbl-devis thead th:nth-child(2){text-align:left;}'
  +'.tbl-devis td{padding:6px 9px;border:1px solid #e0e0e0;vertical-align:middle;}'
  +'.tbl-devis td:first-child{text-align:center;color:#777;font-size:8pt;}'
  +'.tbl-devis td:nth-child(3){text-align:center;}'
  +'.tbl-devis td.r{text-align:right;}'
  +'.tbl-devis .cat td{background:#e8f5e8;font-weight:800;text-align:center;color:#0d2a10;font-size:8pt;text-transform:capitalize;letter-spacing:.2px;border-color:#c8e8c8;padding:5px 9px;}'
  +'.tbl-devis .sub td{background:#f4fbf4;font-weight:700;border-color:#cce8cc;border-top:1.5px solid #a8d8a8;}'
  +'.tbl-devis .sub td.r{color:#05a705;font-size:9.5pt;}'
  +'.tbl-devis .mo td{background:#fffbf0;font-weight:700;border-color:#e8d8a0;}'
  +'.tbl-devis .mo td.r{color:#c87800;font-size:9.5pt;}'
  +'.tbl-devis .tot td{background:#0d2a10;color:#fff;font-weight:800;font-size:10.5pt;border-color:#0d2a10;}'
  +'.tbl-devis .tot td.r{color:#30d158;}'
  +'.volt{font-size:10pt;font-weight:800;color:#05a705;margin:4mm 0 2mm;text-transform:uppercase;letter-spacing:.5px;}'
  +'.nb{border:1px solid #c8d8c8;padding:8px 12px;font-size:8pt;color:#333;line-height:2.1;margin-top:4mm;background:#f8fdf8;}'
  +'.nb strong{color:#0d2a10;}'
  +'.footer{margin-top:8mm;display:flex;justify-content:space-between;align-items:flex-end;border-top:1.5px solid #ccc;padding-top:5mm;}'
  +'.footer-left{font-size:7pt;color:#aaa;line-height:1.8;}'
  +'.footer-right{text-align:right;font-size:8.5pt;font-weight:700;color:#333;}'
  +'.stamp{display:inline-flex;align-items:center;justify-content:center;border:2.5px solid #05a705;border-radius:50%;width:22mm;height:22mm;font-size:6pt;color:#05a705;font-weight:800;text-align:center;line-height:1.5;margin-top:3mm;padding:3mm;}'
  +'@media print{@page{size:A4;margin:0;}body{padding:10mm 14mm;}}'
  +'