/* Devis instantane — integre au site d'origine (Pop Azur). Memes bordures, memes ombres, memes couleurs. */
#devis .dv{margin-top:clamp(32px,5vw,48px);position:relative;background:#FFFFFF;border:2px solid #0E0E12;border-radius:28px;box-shadow:10px 10px 0 #0E0E12;padding:clamp(20px,3.6vw,34px);display:grid;gap:clamp(22px,3.5vw,38px);align-items:start;text-align:left}
@media(min-width:900px){#devis .dv{grid-template-columns:1fr 300px}}
#devis .dv-col{min-width:0}
#devis .dv-etape{position:relative}
#devis .dv-etape.entre{animation:dvEntre .45s cubic-bezier(.2,.7,.2,1)}
@keyframes dvEntre{from{opacity:0;transform:translateX(18px)}to{opacity:1;transform:none}}
#devis .dv-etape.secoue{animation:dvSecoue .4s}
@keyframes dvSecoue{20%,60%{transform:translateX(-6px)}40%,80%{transform:translateX(6px)}}
#devis .dv-num{display:inline-block;background:#1B3DF0;color:#FFFFFF;border-radius:99px;padding:6px 13px;font-family:'Archivo',sans-serif;font-size:10.5px;font-weight:900;letter-spacing:0.12em}
#devis .dv-titre{margin:14px 0 0;font-family:'Archivo',sans-serif;font-weight:900;font-size:clamp(22px,3.4vw,32px);line-height:1.04;letter-spacing:-0.03em}
#devis .dv-aide{margin:10px 0 0;font-size:14px;line-height:1.6;color:rgba(14,14,18,0.65)}
#devis .dv-choix{margin-top:18px;display:grid;gap:10px}
#devis .dv-choix.serre{grid-template-columns:repeat(auto-fit,minmax(190px,1fr))}
#devis .dv-opt{position:relative;display:grid;grid-template-columns:auto 1fr auto;gap:12px;align-items:center;padding:13px 15px;background:#FFFFFF;border:2px solid #0E0E12;border-radius:16px;cursor:pointer;box-shadow:3px 3px 0 rgba(14,14,18,0.18);transition:transform .15s ease,box-shadow .15s ease,background .15s ease,color .15s ease}
#devis .dv-opt:hover{transform:translate(-2px,-2px);box-shadow:5px 5px 0 #0E0E12}
#devis .dv-opt.on{background:#1B3DF0;color:#FFFFFF;box-shadow:5px 5px 0 #0E0E12}
#devis .dv-opt.on .dv-det{color:rgba(255,255,255,0.75)}
#devis .dv-opt.on .dv-prix{color:#FFC93C}
#devis .dv-opt input{position:absolute;opacity:0;pointer-events:none}
#devis .dv-opt:focus-within{outline:3px solid #FF5136;outline-offset:3px}
#devis .dv-ico{font-size:22px;width:34px;text-align:center}
#devis .dv-lib{display:block;font-weight:800;font-size:15px;line-height:1.25}
#devis .dv-det{display:block;font-size:12.5px;line-height:1.45;color:rgba(14,14,18,0.6);margin-top:3px}
#devis .dv-prix{font-family:'Archivo',sans-serif;font-weight:900;font-size:13px;color:#1B3DF0;white-space:nowrap}
#devis .dv-preset{margin-top:18px;display:flex;gap:14px;align-items:center;flex-wrap:wrap;background:#FFC93C;border:2px solid #0E0E12;border-radius:18px;padding:14px 16px;box-shadow:4px 4px 0 #0E0E12}
#devis .dv-preset b{font-family:'Archivo',sans-serif;font-weight:900;font-size:14px;line-height:1.2}
#devis .dv-preset span{font-size:12.5px;color:rgba(14,14,18,0.7)}
#devis .dv-preset button{margin-left:auto;background:#0E0E12;color:#FFFFFF;border:2px solid #0E0E12;border-radius:999px;padding:10px 16px;font-family:'Archivo',sans-serif;font-size:12px;font-weight:800;cursor:pointer;box-shadow:3px 3px 0 #FFFFFF;transition:all .15s ease}
#devis .dv-preset button:hover{transform:translate(-2px,-2px);box-shadow:5px 5px 0 #FFFFFF}
#devis .dv-compteur{display:flex;align-items:center;gap:14px;flex-wrap:wrap}
#devis .dv-compteur button{width:46px;height:46px;border-radius:50%;border:2px solid #0E0E12;background:#FFFFFF;font-size:22px;font-weight:900;cursor:pointer;box-shadow:3px 3px 0 #0E0E12;transition:all .15s ease}
#devis .dv-compteur button:hover{background:#FFC93C}
#devis .dv-compteur output{font-family:'Archivo',sans-serif;font-weight:900;font-size:40px;min-width:54px;text-align:center;letter-spacing:-0.03em}
#devis .dv-compteur small{flex-basis:100%;color:rgba(14,14,18,0.6)}
#devis .dv-nav{margin-top:22px;padding-top:18px;border-top:2px solid rgba(14,14,18,0.1);display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap}
#devis .dv-btn{display:inline-flex;align-items:center;gap:8px;border:2px solid #0E0E12;border-radius:999px;padding:12px 20px;font-family:'Archivo',sans-serif;font-size:13px;font-weight:800;cursor:pointer;text-decoration:none;transition:all .15s ease;background:#FFFFFF;color:#0E0E12;box-shadow:4px 4px 0 rgba(14,14,18,0.2)}
#devis .dv-btn:hover{transform:translate(-2px,-2px);box-shadow:6px 6px 0 #0E0E12}
#devis .dv-btn.noir{background:#0E0E12;color:#FFFFFF;box-shadow:4px 4px 0 #FFC93C}
#devis .dv-btn.jaune{background:#FFC93C;color:#0E0E12;box-shadow:4px 4px 0 #0E0E12}
#devis .dv-btn.vert{background:#2BB673;color:#FFFFFF;box-shadow:4px 4px 0 #0E0E12}
#devis .dv-btn.bleu{background:#1B3DF0;color:#FFFFFF;box-shadow:4px 4px 0 #0E0E12}
#devis .dv-btn.grand{padding:15px 26px;font-size:14.5px}
#devis .dv-btn:disabled{opacity:.35;cursor:default;transform:none;box-shadow:4px 4px 0 rgba(14,14,18,0.2)}
#devis .dv-pas{display:flex;gap:6px;align-items:center}
#devis .dv-pas i{display:block;width:8px;height:8px;border-radius:50%;background:rgba(14,14,18,0.18);border:1.5px solid #0E0E12;transition:background .2s}
#devis .dv-pas i.fait{background:#1B3DF0}
#devis .dv-pas i.ici{background:#FFC93C;transform:scale(1.25)}

/* ticket lateral */
.dv-ticket{position:relative;background:#FFC93C;border:2px solid #0E0E12;border-radius:22px;box-shadow:8px 8px 0 #0E0E12;padding:22px 20px 18px}
@media(min-width:900px){.dv-ticket{position:sticky;top:96px}}
.dv-tk-tete{display:flex;justify-content:space-between;align-items:center;font-family:'Archivo',sans-serif;font-size:10.5px;font-weight:900;letter-spacing:0.14em}
.dv-tk-tete span:last-child{color:rgba(14,14,18,0.55)}
.dv-tk-prix{margin-top:10px;font-family:'Archivo',sans-serif;font-weight:900;font-size:clamp(46px,6vw,56px);letter-spacing:-0.05em;line-height:1}
.dv-tk-prix small{font-size:.45em;letter-spacing:0;margin-left:4px}
.dv-tk-sous{font-size:11.5px;font-weight:600;color:rgba(14,14,18,0.6)}
.dv-tk-lignes{list-style:none;margin:14px 0 0;padding:12px 0 0;border-top:2px dashed rgba(14,14,18,0.35);font-size:13px;display:grid;gap:6px}
.dv-tk-lignes li{display:flex;justify-content:space-between;gap:10px}
.dv-tk-lignes b{white-space:nowrap}
.dv-tk-lignes em{display:block;font-style:normal;font-size:11px;color:#1B3DF0;font-weight:700}
.dv-tk-bas{display:flex;justify-content:space-between;gap:10px;margin-top:12px;padding-top:10px;border-top:2px solid rgba(14,14,18,0.15);font-size:13px}
.dv-tk-bas b{font-family:'Archivo',sans-serif}
.dv-ticket.pulse{animation:dvPulse .5s cubic-bezier(.2,.7,.2,1)}
@keyframes dvPulse{30%{transform:scale(1.03) rotate(-.6deg)}}
.dv-garantie{margin-top:14px;display:flex;flex-direction:column;gap:7px;font-size:12.5px;font-weight:600}
.dv-garantie span{display:flex;gap:8px;align-items:flex-start}
.dv-garantie span::before{content:"✓";color:#1B3DF0;font-weight:900}
.dv-stamp{position:absolute;top:-18px;right:-10px;background:#2BB673;color:#FFFFFF;border:2px solid #0E0E12;box-shadow:3px 3px 0 #0E0E12;border-radius:999px;padding:7px 12px;font-family:'Archivo',sans-serif;font-weight:900;font-size:10.5px;transform:rotate(6deg);animation:wob 3.4s ease-in-out infinite}

/* resultat */
#devis .dv-res{animation:dvEntre .5s cubic-bezier(.2,.7,.2,1)}
#devis .dv-res-prix{margin-top:12px;font-family:'Archivo',sans-serif;font-weight:900;font-size:clamp(56px,9vw,96px);letter-spacing:-0.05em;line-height:.95;color:#1B3DF0}
#devis .dv-res-prix small{font-size:.42em;letter-spacing:0}
#devis .dv-res-sous{margin-top:6px;font-family:'Archivo',sans-serif;font-weight:800;font-size:12px;letter-spacing:0.1em;color:rgba(14,14,18,0.55)}
#devis .dv-res-intro{margin:14px 0 0;font-size:15px;line-height:1.6;color:rgba(14,14,18,0.8);max-width:56ch}
#devis .dv-res-plafond{margin:10px 0 0;font-weight:800;color:#FF5136}
#devis .dv-cles{margin-top:18px;display:grid;gap:10px;grid-template-columns:repeat(auto-fit,minmax(150px,1fr))}
#devis .dv-cle{border:2px solid #0E0E12;border-radius:16px;padding:12px 14px;background:#EEF1F7}
#devis .dv-cle b{display:block;font-family:'Archivo',sans-serif;font-weight:900;font-size:20px;letter-spacing:-0.03em}
#devis .dv-cle span{font-size:12.5px;color:rgba(14,14,18,0.65)}
#devis .dv-recap{width:100%;border-collapse:collapse;font-size:14px;margin-top:18px}
#devis .dv-recap td{padding:8px 0;border-bottom:1.5px solid rgba(14,14,18,0.1)}
#devis .dv-recap td:last-child{text-align:right;font-weight:800;white-space:nowrap}
#devis .dv-recap em{font-style:normal;color:#2BB673;font-size:12px;display:block;font-weight:700}
#devis .dv-recap tr.total td{font-family:'Archivo',sans-serif;font-weight:900;font-size:16px;border:0;padding-top:12px}
#devis .dv-actions{margin-top:22px;display:flex;flex-wrap:wrap;gap:12px;align-items:center}
#devis .dv-lien{background:none;border:0;padding:8px;color:rgba(14,14,18,0.6);text-decoration:underline;font-size:13px;cursor:pointer;font-weight:600}
#devis .dv-exemple{margin-top:16px;display:flex;align-items:center;gap:12px;flex-wrap:wrap;padding:12px 14px;border:2px dashed #0E0E12;border-radius:16px;font-size:13.5px}
#devis .dv-exemple a{font-weight:800;color:#1B3DF0}
#devis .dv-form{margin-top:20px;padding-top:20px;border-top:2px solid rgba(14,14,18,0.1)}
#devis .dv-form h3{margin:0;font-family:'Archivo',sans-serif;font-weight:900;font-size:19px}
#devis .dv-form p{margin:6px 0 14px;font-size:13.5px;color:rgba(14,14,18,0.65)}
#devis .dv-champs{display:grid;gap:12px}
@media(min-width:640px){#devis .dv-champs{grid-template-columns:1fr 1fr}#devis .dv-champs .large{grid-column:span 2}}
#devis .dv-champs label{display:grid;gap:5px;font-size:13px;font-weight:700}
#devis .dv-champs small{font-weight:400;color:rgba(14,14,18,0.55)}
#devis .dv-champs input,#devis .dv-champs textarea{font:inherit;padding:12px 14px;border:2px solid #0E0E12;border-radius:14px;background:#FFFFFF;box-shadow:3px 3px 0 rgba(14,14,18,0.12)}
#devis .dv-champs input:focus,#devis .dv-champs textarea:focus{outline:0;box-shadow:4px 4px 0 #FFC93C}
#devis .dv-pot{position:absolute;left:-9999px;opacity:0;height:0;overflow:hidden}
#devis .dv-etat{margin:12px 0 0;font-weight:700;min-height:20px;font-size:14px}
#devis .dv-etat.ok{color:#1E7A4C}
#devis .dv-etat.ko{color:#C2331B}
#devis .dv-legal{margin:16px 0 0;font-size:12px;line-height:1.6;color:rgba(14,14,18,0.6)}
#devis .dv-legal a{color:inherit}
#devis .dv-toujours{margin-top:22px;display:flex;flex-wrap:wrap;gap:8px;justify-content:center}
#devis .dv-toujours span{font-size:12px;font-weight:700;border:2px solid #0E0E12;border-radius:999px;padding:6px 11px;background:#FFFFFF;box-shadow:2px 2px 0 rgba(14,14,18,0.15)}
/* ---------- mobile : une question a la fois, le ticket devient une barre repliee en bas ---------- */
.dv-mini{display:none}
@media(max-width:899px){
  #devis .dv{padding:18px 16px 20px}
  #devis .dv-titre{font-size:clamp(21px,6vw,26px)}
  #devis .dv-aide{font-size:13px;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
  #devis .dv-choix{gap:8px}
  #devis .dv-opt{padding:11px 13px;gap:10px;grid-template-columns:auto 1fr auto}
  #devis .dv-opt .dv-det{display:none}
  #devis .dv-opt.on .dv-det{display:block}
  #devis .dv-lib{font-size:14.5px}
  #devis .dv-preset{padding:12px 14px;gap:10px}
  #devis .dv-preset button{margin-left:0;width:100%;text-align:center}
  #devis .dv-toujours{display:none}
  .dv-fini .dv-toujours{display:flex}
  /* la barre repliee */
  .dv-mini{position:fixed;left:10px;right:10px;bottom:calc(10px + env(safe-area-inset-bottom));z-index:95;display:grid;grid-template-columns:auto 1fr auto auto;align-items:center;gap:10px;
    background:#FFC93C;color:#0E0E12;border:2px solid #0E0E12;border-radius:999px;box-shadow:5px 5px 0 #0E0E12;padding:10px 14px 10px 16px;font-family:'Archivo',sans-serif;cursor:pointer;text-align:left}
  .dv-mini-lib{font-size:10.5px;font-weight:900;letter-spacing:0.12em;text-transform:uppercase}
  .dv-mini b{font-weight:900;font-size:20px;letter-spacing:-0.03em}
  .dv-mini-etape{font-size:11px;font-weight:700;color:rgba(14,14,18,0.6)}
  .dv-mini-chev{font-size:14px;transition:transform .25s}
  .dv-mini[aria-expanded="true"] .dv-mini-chev{transform:rotate(180deg)}
  .dv-fini .dv-mini{display:none}
  /* le ticket complet, en feuille qui monte depuis le bas */
  .dv-ticket{position:fixed;left:10px;right:10px;bottom:calc(66px + env(safe-area-inset-bottom));z-index:94;max-height:calc(100vh - 120px);overflow:auto;
    transform:translateY(110%);opacity:0;transition:transform .35s cubic-bezier(.2,.7,.2,1),opacity .3s;pointer-events:none}
  .dv-ticket.ouvert{transform:none;opacity:1;pointer-events:auto}
  .dv-stamp{display:none}
  .dv-tk-etape{display:none}
  /* au resultat, le detail est deja dans la page : la feuille et la barre disparaissent */
  .dv-fini .dv-ticket{display:none}
  /* au resultat : les actions en colonne, pleine largeur */
  #devis .dv-res .dv-actions .dv-btn{width:100%;justify-content:center}
  #devis .dv-res-prix{font-size:clamp(50px,16vw,72px)}
}
@media(prefers-reduced-motion:reduce){#devis .dv-etape.entre,#devis .dv-res,.dv-ticket.pulse,.dv-stamp{animation:none!important}.dv-ticket{transition:none}}

/* en-tete sur petit ecran : deux pastilles qui tiennent sur une ligne */
#hdr a{white-space:nowrap}
@media(max-width:560px){#hdr a{font-size:11.5px!important;padding:8px 12px!important}#hdr>div{padding-left:14px!important}}
@media(max-width:380px){#hdr .hd-long{display:none}}

/* la barre et la feuille du devis : seulement quand la section est a l'ecran */
@media(max-width:899px){body:not(.dv-en-vue) .dv-mini,body:not(.dv-en-vue) .dv-ticket{display:none}}
/* petit ecran : la pastille telephone ne "sonne" pas (elle penchait dans l'en-tete), badge du hero plus court */
@media(max-width:640px){
  body.is-in #hdr a[href^="tel:"]{animation:none!important}
  .hero-badge{font-size:11px!important;padding:8px 13px!important;letter-spacing:0.06em!important}
  .hb-long{display:none}
}
@media(max-width:400px){.hero-badge{font-size:10.5px!important;padding:8px 11px!important}}
@media(max-width:340px){#hdr a{padding:8px 10px!important}#hdr>div{gap:8px!important}}
