/* =====================================================================
   Configuratore Carpentiero Antonio — redesign v3 "Struttura morbida"
   Griglia a 8px, un solo margine laterale, contenitori a doppio bordo
   (vassoio + piastra), ombre azzurrate, bottoni "isola" con freccia.
   Colori invariati: blu #006AB3, arancio #EF7F1A, testo #14181D, sfondo #F2F4F7.
   ===================================================================== */
:root{
  --bg:#F2F4F7; --surface:#FFFFFF; --ink:#14181D; --muted:#5A6572; --line:#E1E6EC; --line-strong:#C9D1DA;
  --primary:#006AB3; --primary-deep:#00538D; --primary-soft:#E4EFF8; --orange:#EF7F1A; --orange-deep:#B55A06; --orange-soft:#FDEBD8;
  --danger:#B91C1C; --orange-ink:#6B3507; --blue-ink:#063F6E; --vis-top:#F8F9FB; --vis-bot:#E9EDF2; --chip:#E8ECF1;
  --ok:#1E7A48; --ok-soft:#E2F2E9; --warn:#B8420A; --warn-soft:#FBE9DE;
  /* griglia: tutto è multiplo di 4 */
  --g:20px;                       /* margine laterale unico */
  --s1:4px; --s2:8px; --s3:12px; --s4:16px; --s5:24px; --s6:32px; --s7:48px; --s8:64px;
  --h-ctl:56px; --h-field:56px;   /* altezze fisse dei comandi */
  --r-s:10px; --r-m:16px; --r-l:28px;
  --tray:rgba(20,24,29,.045);     /* vassoio del doppio bordo */
  --ring:0 0 0 1px rgba(20,24,29,.07);
  --lift:inset 0 1px 0 rgba(255,255,255,.9);
  --sh:0 1px 2px rgba(10,40,70,.05),0 14px 30px -14px rgba(10,40,70,.18);
  --sh-up:0 2px 4px rgba(10,40,70,.06),0 24px 44px -16px rgba(10,40,70,.28);
  --font:"Nunito Sans",system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;
  --display:"Montserrat",system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;
  --ease:cubic-bezier(.32,.72,0,1);
  --col-l:440px; --col-gap:56px;  /* desktop: colonna anteprima + intervallo */
  color-scheme:light; box-sizing:border-box;
  padding-top:env(safe-area-inset-top,0px); padding-bottom:env(safe-area-inset-bottom,0px);
}
*,*::before,*::after{box-sizing:inherit}
html{scroll-padding-top:env(safe-area-inset-top,0px);scroll-padding-bottom:132px;overflow-x:hidden;overscroll-behavior-x:none;scroll-behavior:smooth}
html,body{margin:0;min-height:100%;-webkit-text-size-adjust:100%;text-size-adjust:100%}
*,*::before,*::after{touch-action:manipulation}
body{overflow-x:clip;background:var(--bg);color:var(--ink);font-family:var(--font);font-size:16px;line-height:1.5;font-variant-numeric:tabular-nums;-webkit-font-smoothing:antialiased;caret-color:var(--primary)}
input,textarea,select{font-size:16px!important}
button,input,textarea,select{font:inherit;color:inherit}
button{cursor:pointer;-webkit-tap-highlight-color:transparent}
::selection{background:rgba(0,106,179,.22);color:inherit}
button:focus-visible,input:focus-visible,textarea:focus-visible,a:focus-visible,select:focus-visible{outline:3px solid var(--primary);outline-offset:3px}
*{scrollbar-width:thin;scrollbar-color:#B9C2CC transparent}
[hidden]{display:none!important}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.app{position:relative;z-index:1;max-width:560px;margin:0 auto;min-height:100%;display:flex;flex-direction:column}
.app[hidden]{display:none!important}

/* caratteri ospitati nel sito (niente richieste a Google, funzionano anche offline) */
@font-face{font-family:"Montserrat";font-style:normal;font-weight:600 800;font-display:swap;src:url("/fonts/montserrat-latin.woff2") format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:"Nunito Sans";font-style:normal;font-weight:400 800;font-display:swap;src:url("/fonts/nunito-sans-latin.woff2") format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
/* titoli: Montserrat extra-bold, stretti e compatti */
.display,h1,h2,h3{font-family:var(--display);font-weight:800;letter-spacing:-.03em;text-wrap:balance}
h1{font-size:clamp(28px,7.8vw,36px);line-height:1.06;margin:0}
.lead{color:var(--muted);margin:var(--s2) 0 0;font-size:15px;line-height:1.45;max-width:46ch;text-wrap:pretty}

/* ---------- placca illustrata (l'oggetto reale resta com'è) ---------- */
.plate{display:inline-flex;padding:calc(var(--s,1)*13px);border-radius:calc(var(--s,1)*6px);
  background:linear-gradient(180deg,var(--pl-top),var(--pl-bot));
  box-shadow:inset 0 1px 0 rgba(255,255,255,.65),inset 0 -1px 0 rgba(0,0,0,.08),0 calc(var(--s,1)*14px) calc(var(--s,1)*26px) rgba(10,20,30,.22),0 2px 5px rgba(10,20,30,.12)}
.plate .grp{display:flex;gap:calc(var(--s,1)*2px);padding:calc(var(--s,1)*2px);border-radius:calc(var(--s,1)*3px);background:rgba(0,0,0,.16);box-shadow:inset 0 1px 2px rgba(0,0,0,.25)}
.plate .grps{display:flex;gap:calc(var(--s,1)*7px)}
.plate.stack .grps{flex-direction:column;align-items:center}
.plate svg{display:block}

/* ---------- bottoni ----------
   Primario = pillola scura con "isola" arancio per la freccia.
   Tutti i comandi hanno la stessa altezza (56px) e lo stesso raggio. */
.pill{display:flex;align-items:center;justify-content:space-between;gap:var(--s3);width:100%;min-width:0;height:var(--h-ctl);padding:0 var(--s2) 0 var(--s5);border:0;border-radius:999px;background:var(--ink);color:#fff;font-family:var(--display);font-weight:700;font-size:15px;letter-spacing:-.005em;text-align:left;box-shadow:0 12px 24px -10px rgba(20,24,29,.55)}
.pill>span:first-child{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.pill .arr{flex:0 0 auto;width:40px;height:40px;border-radius:50%;background:var(--orange);display:grid;place-items:center;box-shadow:0 0 0 0 rgba(239,127,26,.32);transition:box-shadow .7s var(--ease),background-color .5s var(--ease)}
.pill .arr svg{width:18px;height:18px;stroke:var(--ink)}
.pill:not(:disabled):hover .arr,.pill:not(:disabled):focus-visible .arr{box-shadow:0 0 0 6px rgba(239,127,26,.28)}
.pill>span:first-child{transition:transform .6s var(--ease)}
.pill:not(:disabled):hover>span:first-child{transform:translateX(-3px)}
.pill:disabled{opacity:.4;box-shadow:none;cursor:default}
.pill.appear{animation:pop .4s var(--ease)}
@keyframes pop{from{transform:translateY(8px);opacity:0}to{transform:none;opacity:1}}
.round{flex:0 0 auto;width:var(--h-ctl);height:var(--h-ctl);border-radius:50%;border:0;background:#fff;box-shadow:var(--ring),var(--sh);display:grid;place-items:center}
.round svg{width:20px;height:20px}
.btn-sec,.btn-ghost{display:inline-flex;align-items:center;justify-content:center;gap:var(--s2);min-height:48px;padding:0 var(--s5);border-radius:999px;border:0;background:#fff;box-shadow:var(--ring);font-family:var(--display);font-weight:700;font-size:14px;letter-spacing:-.005em;line-height:1.2;color:var(--ink);text-decoration:none;text-align:center}
.btn-ghost{width:100%;height:var(--h-ctl)}
.btn-ok,.btn-danger,.btn-pub{display:inline-flex;align-items:center;justify-content:center;min-height:48px;padding:0 var(--s5);border-radius:999px;border:0;color:#fff;font-family:var(--display);font-weight:700;font-size:14px;line-height:1.2}
.btn-ok{background:var(--ink)} .btn-danger{background:var(--danger)} .btn-pub{background:var(--ok)}
.btn-sec.danger{color:var(--danger)}
.link-btn{background:none;border:0;color:var(--muted);font-size:14px;font-weight:700;text-decoration:underline;text-underline-offset:4px;padding:var(--s2) var(--s3);min-height:44px;justify-self:center}
.link-btn.danger{color:var(--danger)}
.mini-btn{display:inline-flex;align-items:center;min-height:44px;font-size:13px;font-weight:700;padding:0 var(--s4);border-radius:999px;border:0;background:#fff;box-shadow:var(--ring);color:var(--ink)}
.mini-btn.danger{color:var(--danger)}

/* ---------- testata del passo ---------- */
header{padding:var(--s4) var(--g) 0}
.flow-logo{display:block;width:68px;padding:0;margin:0 auto var(--s4);border:0;background:none;cursor:pointer;-webkit-tap-highlight-color:transparent}
.flow-logo svg{display:block;width:100%;height:auto}
.topline{display:flex;flex-direction:column;gap:var(--s2);margin-bottom:var(--s4);min-width:0}
.step-chip{order:2;font-size:13px;font-weight:700;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.room-chip{font-weight:800;color:var(--primary)}
.dots{order:1;display:flex;align-items:center;gap:var(--s1);height:6px}
.dots i{flex:1;height:6px;border-radius:99px;background:#D3DAE2;transition:background .5s var(--ease)}
.dots i.done{background:var(--primary)}
.dots i.cur{background:var(--orange);transform-origin:left center}
.dots.anim i.cur{animation:fillIn .9s var(--ease) both}
.dots i.done{transform-origin:left center}
@keyframes fillIn{from{transform:scaleX(.05);opacity:.5}to{transform:none;opacity:1}}

/* ---------- anteprima: vassoio + piastra con griglia ---------- */
.preview{margin:var(--s4) var(--g) 0;padding:var(--s2);border-radius:var(--r-l);background:var(--tray);box-shadow:var(--ring)}
.preview.wallview{background:#E9E4D9}
.preview-scroll{overflow-x:auto;display:flex;gap:var(--s4);padding:var(--s4) var(--s4) var(--s3);justify-content:safe center;scrollbar-width:none;border-radius:calc(var(--r-l) - var(--s2));
  background-color:#fff;box-shadow:var(--lift)}
.preview-scroll::-webkit-scrollbar{display:none}
.pv-item{flex:0 0 auto;display:flex;flex-direction:column;align-items:center;gap:var(--s3)}
.pv-item small{font-size:12px;color:var(--muted);font-weight:700}
.empty-preview{color:var(--muted);font-size:14px;padding:var(--s7) var(--s4);text-align:center;border-radius:calc(var(--r-l) - var(--s2));background-color:#fff}
.meter{display:flex;align-items:center;gap:var(--s3);font-size:13px;font-weight:800;padding:var(--s3) var(--s3) var(--s2)}
.meter-bar{flex:1;min-width:0;display:flex;gap:var(--s1);height:12px}
.meter-bar i{flex:1;border-radius:4px;background:rgba(20,24,29,.12);transition:background .5s var(--ease)}
.meter-bar i.on{background:var(--primary);transform-origin:bottom}
.meter-bar i.on.new{animation:cellOn .6s var(--ease) both}
@keyframes cellOn{from{transform:scaleY(.2);opacity:.4}to{transform:none;opacity:1}}
.meter.over{color:var(--warn)} .meter.over .meter-bar i.on{background:var(--warn)}
.pv-room{display:flex;flex-wrap:wrap;align-items:center;gap:var(--s1) var(--s3);padding:var(--s3) var(--s3) var(--s2)}
.pv-room b{font-family:var(--display);font-weight:800;font-size:16px}
.pv-room>span:last-child{flex-basis:100%;font-size:13px;color:var(--muted)}

main{flex:1;padding:var(--s4) var(--g) var(--s2)}

/* ---------- schede: piastra bianca, anello sottile, ombra azzurrata ---------- */
.s-card,.option,.ftile,.srow,.room-card,.g-card,.bom,.qcard,.kpi-t,.ap-card,.sw-row,.inv-room,.done-box,.esito,.serie-note,.find-hint,.tile{
  background:#fff;border:0;border-radius:var(--r-m);box-shadow:var(--ring),var(--sh)}
.s-card[aria-pressed="true"],.option[aria-pressed="true"],.ftile.active,.srow.active{box-shadow:0 0 0 2px var(--primary),var(--sh)}
.s-card,.option,.ftile,.srow,.room-card{transition:transform .5s var(--ease),box-shadow .5s var(--ease)}

/* serie: carosello */
.carousel{display:flex;gap:var(--s3);overflow-x:auto;scroll-snap-type:x mandatory;margin:0 calc(var(--g)*-1);padding:var(--s2) var(--g) var(--s5);scrollbar-width:none;scroll-padding:0 var(--g)}
.carousel::-webkit-scrollbar{display:none}
.s-card{flex:0 0 82%;max-width:336px;scroll-snap-align:start;text-align:left;padding:var(--s2) var(--s2) var(--s5);border-radius:var(--r-l);display:flex;flex-direction:column}
.s-vis{position:relative;height:192px;display:grid;place-items:center;margin-bottom:var(--s4);border-radius:calc(var(--r-l) - var(--s2));
  background-color:var(--vis-top)}
.sel-badge{position:absolute;top:var(--s3);left:var(--s3);display:none;align-items:center;gap:6px;height:28px;padding:0 var(--s3) 0 var(--s2);border-radius:99px;background:var(--primary);color:#fff;font-size:12px;font-weight:800}
.sel-badge svg{width:15px;height:15px}
[aria-pressed="true"] .sel-badge{display:flex}
.s-row{display:flex;justify-content:space-between;align-items:center;gap:var(--s3);padding:0 var(--s3)}
.s-row h2{font-size:24px;margin:0;line-height:1.1}
.sw{display:flex;align-items:center;flex:0 0 auto}
.sw i{width:16px;height:16px;border-radius:50%;margin-left:-4px;box-shadow:0 0 0 2px #fff,inset 0 0 0 1px rgba(0,0,0,.14)}
.sw em{font-style:normal;font-size:12px;font-weight:800;color:var(--muted);margin-left:var(--s2)}
.s-card p{margin:var(--s2) var(--s3) 0;color:var(--muted);font-size:14px;line-height:1.45}

/* cover */
.options{display:grid;gap:var(--s3)}
.option{position:relative;text-align:left;padding:var(--s3) 56px var(--s3) var(--s3);display:flex;gap:var(--s4);align-items:center;min-height:96px}
.option .ov{flex:0 0 auto;width:64px;height:72px;border-radius:var(--r-s);display:grid;place-items:center;background:linear-gradient(180deg,var(--vis-top),var(--vis-bot))}
.option h2{font-size:17px;margin:0;line-height:1.2}
.option p{margin:var(--s1) 0 0;color:var(--muted);font-size:14px;line-height:1.4}
.check{position:absolute;top:50%;right:var(--s4);width:28px;height:28px;margin-top:-14px;border-radius:50%;background:var(--primary);display:none;place-items:center}
.check svg{width:14px;height:14px}
[aria-pressed="true"]>.check{display:grid}

/* supporti: righe */
.rows{display:grid;gap:var(--s3)}
.srow{display:flex;align-items:center;gap:var(--s3);min-width:0;padding:var(--s3);min-height:88px}
.srow .sv{flex:0 0 auto;width:64px;height:64px;overflow:hidden;border-radius:var(--r-s);display:grid;place-items:center;background:linear-gradient(180deg,var(--vis-top),var(--vis-bot))}
.srow .tx{flex:1;min-width:0}
.srow strong{display:block;font-family:var(--display);font-size:16px;line-height:1.25;font-weight:700;letter-spacing:-.01em;overflow:hidden;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}
.srow span{font-size:13px;color:var(--muted)}
.srow .stepper{flex:0 0 auto;margin:0;height:52px}
.srow .qty-in{width:30px}

/* frutti: griglia con comandi allineati in basso */
.grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--s3)}
.ftile{display:flex;flex-direction:column;gap:var(--s3);min-width:0;padding:var(--s2) var(--s2) var(--s3)}
.ftile .fv{height:104px;border-radius:var(--r-s);display:grid;place-items:center;background:linear-gradient(180deg,var(--vis-top),var(--vis-bot))}
.ftile .fv svg{filter:drop-shadow(0 6px 8px rgba(10,20,30,.18))}
.ftile>strong,.ftile>span,.ftile>.cpick{margin-left:var(--s2);margin-right:var(--s2)}
.ftile strong{display:block;font-family:var(--display);font-size:14px;line-height:1.25;font-weight:700;letter-spacing:-.01em}
.ftile span{font-size:12px;color:var(--muted);line-height:1.35}
.stepper{display:flex;align-items:center;justify-content:space-between;background:var(--bg);border-radius:99px;margin:auto var(--s2) 0;padding:var(--s1);height:52px}
.stepper button{flex:0 0 44px;width:44px;height:44px;border:0;border-radius:50%;background:#fff;box-shadow:var(--ring);font-size:20px;line-height:1;color:var(--ink);display:grid;place-items:center;padding:0;transition:transform .4s var(--ease)}
.stepper button[data-d="1"]{background:var(--ink);color:#fff;box-shadow:none}
.stepper button:disabled{opacity:.35;cursor:default;box-shadow:none}
.stepper output{align-self:center;font-weight:800}
.qty-in{flex:1 1 auto;width:40px;min-width:24px;height:44px;border:0;border-radius:var(--r-s);background:transparent;text-align:center;font-weight:800;font-variant-numeric:tabular-nums;padding:0;-moz-appearance:textfield;appearance:textfield}
.qty-in:focus{outline:none;background:#fff;box-shadow:0 0 0 2px var(--primary)}
.qty-in::-webkit-outer-spin-button,.qty-in::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}
.cpick{display:flex;align-items:center;gap:var(--s3);flex-wrap:wrap}
.cpick small{font-size:12px;color:var(--muted);font-weight:700;width:100%}
.cdot{width:28px;height:28px;border-radius:50%;border:2px solid #fff;box-shadow:0 0 0 1px var(--line-strong);padding:0}
.cdot.none{background:#fff;position:relative}
.cdot.none::after{content:"";position:absolute;left:4px;right:4px;top:50%;height:2px;background:#B8C0C8;transform:rotate(-45deg)}
.cdot{position:relative}
.cdot::before{content:"";position:absolute;inset:-8px}
.cdot[aria-pressed="true"]{box-shadow:0 0 0 2px var(--primary)}

/* finiture */
.sheet h3{font-size:16px;color:var(--ink);margin:var(--s6) 0 var(--s3);display:flex;justify-content:space-between;align-items:baseline}
.sheet h3 b{font-family:var(--font);font-weight:700;font-size:14px;color:var(--muted);letter-spacing:0}
.sheet h3:first-child{margin-top:var(--s1)}
.swatches{display:grid;grid-template-columns:repeat(auto-fill,minmax(56px,1fr));gap:var(--s3);justify-items:center}
.swatch{width:56px;height:56px;border-radius:50%;padding:5px;border:2px solid transparent;background:none;transition:transform .4s var(--ease)}
.swatch i{display:block;width:100%;height:100%;border-radius:50%;box-shadow:inset 0 0 0 1px rgba(0,0,0,.14),0 4px 8px -2px rgba(10,40,70,.2)}
.swatch[aria-pressed="true"]{border-color:var(--primary)}
.hint{font-size:13px;color:var(--muted);margin:var(--s3) 0 0}

/* richiesta e riepilogo */
.sum{display:grid;grid-template-columns:1.25fr 1fr;gap:var(--s3);margin-bottom:var(--s4)}
.sum-dark{grid-row:span 2;border-radius:var(--r-m);padding:var(--s4);background:var(--ink);color:#fff;display:flex;flex-direction:column;gap:6px;justify-content:flex-end;box-shadow:var(--sh)}
.sum-dark .mini{margin-bottom:auto;padding-top:var(--s1)}
.sum-dark b{font-family:var(--display);font-weight:800;font-size:18px}
.sum-dark span{font-size:12px;opacity:.72}
.sum .tile{padding:var(--s3) var(--s4)}
.sum .tile b{font-family:var(--display);font-weight:800;font-size:26px;display:block;line-height:1}
.sum .tile.orange b{color:var(--orange-deep)}
.seg{display:flex;gap:var(--s1);background:#E4E8ED;padding:var(--s1);border-radius:99px;margin-bottom:var(--s3)}
.seg button{flex:1;height:44px;padding:0 var(--s3);border:0;border-radius:99px;background:transparent;font-family:var(--display);font-weight:700;color:var(--muted);font-size:14px;transition:background .4s var(--ease),color .4s var(--ease)}
.seg button[aria-pressed="true"]{background:#fff;color:var(--ink);box-shadow:var(--ring),0 4px 10px -4px rgba(10,40,70,.25)}
.field{display:block;background:#fff;border:0;border-radius:var(--r-m);padding:var(--s3) var(--s4);min-height:var(--h-field);margin-bottom:var(--s3);box-shadow:var(--ring);transition:box-shadow .3s var(--ease)}
.field:focus-within{box-shadow:0 0 0 2px var(--primary),0 0 0 6px rgba(0,106,179,.14)}
.field span{display:block;font-size:12px;font-weight:700;color:var(--muted);line-height:1.2}
.field:focus-within span{color:var(--primary)}
.field input,.field textarea{display:block;width:100%;border:0;background:transparent;padding:var(--s1) 0 0;font-size:16px;font-weight:600;outline:none}
.field textarea{min-height:56px;resize:vertical}
.consent{display:flex;gap:var(--s3);align-items:flex-start;font-size:14px;color:var(--muted);margin:var(--s2) var(--s1)}
.consent input{width:20px;height:20px;margin-top:1px;flex:0 0 auto;accent-color:var(--primary)}
.err{color:var(--warn);font-size:14px;margin:var(--s2) 0 0;font-weight:600}
.alert{background:var(--warn-soft);color:var(--warn);border-radius:var(--r-m);padding:var(--s3) var(--s4);margin-bottom:var(--s4);font-size:14px;font-weight:600}
.done-box,.esito{padding:var(--s6) var(--s5);text-align:center;border-radius:var(--r-l)}
.done-icon{width:64px;height:64px;border-radius:50%;background:var(--ok-soft);display:grid;place-items:center;margin:0 auto var(--s4)}
.done-icon svg{width:30px;height:30px}
.done-box h2,.esito h2{font-size:24px;margin:0 0 var(--s2);line-height:1.1}
.done-box p,.esito p{color:var(--muted);margin:0}
.reqcode{display:inline-block;font-family:var(--display);font-size:28px;font-weight:800;letter-spacing:.06em;margin:var(--s3) 0 var(--s2);padding:var(--s2) var(--s5);border-radius:var(--r-m);background:var(--orange-soft);color:var(--orange-deep)}
.esito .tot{font-family:var(--display);font-weight:800;font-size:44px;letter-spacing:-.03em;margin:var(--s3) 0 var(--s1);line-height:1}
.actions,.g-actions{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,190px),1fr));gap:var(--s3);justify-content:center;align-items:stretch;margin-top:var(--s4)}
.actions>*,.g-actions>*{width:100%;min-width:0}
.save-tip{display:flex;gap:var(--s3);align-items:flex-start;text-align:left;background:var(--orange-soft);color:var(--orange-ink);border-radius:var(--r-m);padding:var(--s3) var(--s4);margin:var(--s4) 0 var(--s1);font-size:14px;line-height:1.4}
.save-tip svg{flex:0 0 auto;width:22px;height:22px;margin-top:1px}
.edit-note{background:var(--primary-soft);color:var(--blue-ink);border-radius:var(--r-m);padding:var(--s3) var(--s4);margin-bottom:var(--s4);font-size:14px;font-weight:600}
.find-box{margin-top:var(--s1)}
.code-field input{font-family:var(--display);font-weight:800;font-size:24px;letter-spacing:.1em;text-transform:uppercase;padding-top:var(--s1)}
.find-hint{font-size:14px;color:var(--muted);padding:var(--s3) var(--s4);margin-top:var(--s2)}

/* promemoria serie */
.serie-note{display:flex;align-items:center;gap:var(--s3);padding:var(--s1) var(--s2) var(--s1) var(--s4);margin:var(--s3) 0 0;font-size:14px;color:var(--muted);min-height:52px}
.serie-note b{color:var(--ink);font-weight:800}
.serie-note>span:nth-child(2){flex:1;min-width:0}
.sn-dot{flex:0 0 auto;width:14px;height:14px;border-radius:50%;box-shadow:inset 0 0 0 1px rgba(0,0,0,.18)}
.sn-change{flex:0 0 auto;min-height:44px;border:0;box-shadow:var(--ring);background:#fff;border-radius:99px;padding:0 var(--s4);font-size:13px;font-weight:800;color:var(--ink)}

/* stanze */
.room-list{display:grid;gap:var(--s3);margin-bottom:var(--s5)}
.room-card{overflow:hidden;min-width:0;border-radius:var(--r-l)}
.room-open{display:flex;align-items:center;gap:var(--s4);width:100%;min-width:0;padding:var(--s3) var(--s3) var(--s2);border:0;background:none;text-align:left;color:var(--ink)}
.room-ic{flex:0 0 auto;width:64px;height:64px;border-radius:var(--r-s);background:linear-gradient(180deg,var(--vis-top),var(--vis-bot));display:grid;place-items:center;overflow:hidden;color:var(--primary)}
.room-ic-svg svg{width:28px;height:28px;display:block}
.room-card.ok{box-shadow:0 0 0 1.5px #9FD0B3,var(--sh)}
.room-card.ok .room-ic{background:linear-gradient(180deg,#F1FAF4,#DDF0E4)}
.room-tx{flex:1;min-width:0;display:grid;gap:var(--s1)}
.room-tx b{font-family:var(--display);font-weight:800;font-size:17px;letter-spacing:-.02em;line-height:1.2;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.room-st{font-size:13px;color:var(--muted);line-height:1.35}
.room-card.ok .room-st{color:var(--ok)} .room-card.run .room-st{color:var(--warn)}
.room-tag{justify-self:start;display:inline-flex;align-items:center;gap:6px;height:24px;font-size:12px;font-weight:800;padding:0 var(--s3) 0 var(--s2);border-radius:99px;background:var(--primary-soft);color:var(--blue-ink)}
.room-tag svg{width:15px;height:15px;flex:0 0 auto}
.room-go{flex:0 0 auto;width:40px;height:40px;border-radius:50%;background:var(--ink);color:#fff;display:grid;place-items:center}
.room-go svg{width:16px;height:16px}
.room-act{display:flex;flex-wrap:wrap;gap:var(--s2);padding:0 var(--s3) var(--s3) 92px}
.room-add h3{font-size:18px;margin:0 0 var(--s3);line-height:1.15}
.room-form{display:flex;gap:var(--s2);align-items:stretch}
.room-form .field{flex:1;min-width:0;margin:0}
.room-form .btn-ok{flex:0 0 auto;min-height:var(--h-field);padding:0 var(--s5)}
.room-sugg-t{margin:var(--s4) 0 var(--s2);font-size:13px}
.inv-rooms{display:grid;gap:var(--s2);margin:0 0 var(--s4)}
.inv-room{display:grid;gap:2px;padding:var(--s3) var(--s4)}
.inv-room b{font-size:15px} .inv-room span{font-size:13px;color:var(--muted)}
.modal-form .field{margin-bottom:var(--s4)}

/* ---------- home: titolo grande a sinistra, due lanciatori ---------- */
html.on-home,html.on-home body{overflow:hidden;height:100%;overscroll-behavior:none;background:var(--bg)}
html.on-home .bar{display:none}
.home{position:fixed;inset:0;z-index:5;background:var(--bg);overflow:hidden;overscroll-behavior:none;touch-action:manipulation;transition:opacity .4s var(--ease),transform .4s var(--ease)}
.home[hidden]{display:none}
.home .sp-box{position:absolute;inset:0;display:flex;flex-direction:column;justify-content:center;gap:var(--s6);padding:calc(var(--s5) + env(safe-area-inset-top,0px)) var(--g) calc(var(--s5) + env(safe-area-inset-bottom,0px));max-width:560px;margin:0 auto}
.home .sp-logo{display:flex;justify-content:center}
.home .sp-logo svg{display:block;width:168px;height:auto;overflow:visible}
.home .sp-panel{display:flex;flex-direction:column}
.home .sp-heading{margin:0 0 var(--s5);font-size:clamp(34px,10vw,46px);line-height:1;color:var(--ink)}
.home .sp-actions{display:flex;flex-direction:column;gap:var(--s3);width:100%}
.home .sp-btn{display:flex;align-items:center;gap:var(--s4);width:100%;min-height:88px;padding:var(--s2);border:0;border-radius:var(--r-l);background:var(--primary);color:#fff;font-family:var(--display);font-weight:800;font-size:19px;line-height:1.15;letter-spacing:-.02em;text-align:left;cursor:pointer;box-shadow:var(--sh-up);transition:transform .5s var(--ease),box-shadow .5s var(--ease)}
.home .sp-btn:active{transform:scale(.985)}
.home .sp-ic{flex:0 0 auto;width:72px;height:72px;display:grid;place-items:center;background:rgba(255,255,255,.14);color:#fff;border-radius:calc(var(--r-l) - var(--s2))}
.home .sp-ic svg{width:28px;height:28px}
.home .sp-tx{flex:1;display:flex;flex-direction:column;justify-content:center}
.home .sp-go{flex:0 0 auto;width:48px;height:48px;margin-right:var(--s2);display:grid;place-items:center;background:var(--orange);border-radius:50%;box-shadow:0 0 0 0 rgba(255,255,255,.35);transition:box-shadow .7s var(--ease)}
.home .sp-go svg{width:20px;height:20px;stroke:var(--ink)}
.home .sp-btn:not(.soon):hover .sp-go,.home .sp-btn:not(.soon):focus-visible .sp-go{box-shadow:0 0 0 6px rgba(255,255,255,.3)}
.home .sp-btn.soon{background:#E5E8EC;color:#78828E;box-shadow:inset 0 0 0 1px rgba(20,24,29,.06);cursor:not-allowed;filter:saturate(0)}
.home .sp-btn.soon .sp-ic{background:#D6DADF;color:#8A94A0}
.home .sp-soon{display:inline-flex;align-self:flex-start;margin-top:var(--s2);height:24px;align-items:center;font-family:var(--font);font-size:12px;font-weight:800;letter-spacing:.06em;text-transform:uppercase;color:var(--ink);background:var(--orange);border-radius:99px;padding:0 var(--s3)}
.home .sp-link{display:inline-flex;align-items:center;gap:var(--s2);align-self:center;margin-top:var(--s3);min-height:44px;padding:0;border:0;background:none;color:var(--primary);font-family:var(--display);font-weight:700;font-size:14px;cursor:pointer}
.home .sp-link svg{width:18px;height:18px}
.home .sp-link span{text-decoration:underline;text-underline-offset:4px}
.home .legal{margin:var(--s4) 0 0;max-width:none;text-align:center;font-size:12px;line-height:1.5;color:var(--muted)}
@media (max-height:640px){.home .sp-logo svg{width:110px}.home .sp-heading{font-size:30px;margin-bottom:var(--s4)}.home .sp-btn{min-height:72px}.home .sp-ic{width:56px;height:56px}}
@media (min-width:900px){
  .home .sp-box{max-width:1240px;display:grid;grid-template-columns:minmax(0,7fr) minmax(0,5fr);grid-template-rows:auto 1fr auto;column-gap:var(--s8);padding:var(--s7) var(--s7) var(--s6);align-items:start}
  .home .sp-logo{grid-column:1/-1;grid-row:1}
  .home .sp-logo svg{width:200px}
  .home .sp-panel{display:contents}
  .home .sp-heading{grid-column:1;grid-row:2;align-self:center;font-size:clamp(56px,6.2vw,92px);line-height:.98;margin:0;max-width:9ch}
  .home .sp-actions{grid-column:2;grid-row:2;align-self:center;gap:var(--s4)}
  .home .sp-link{margin-top:var(--s4)}
  .home .legal{grid-column:1/-1;grid-row:3;align-self:end;max-width:none;margin:0}
  .home .sp-btn{min-height:112px;font-size:24px;padding:var(--s3)}
  .home .sp-ic{width:88px;height:88px}
  .home .sp-go{width:56px;height:56px;margin-right:var(--s4)}
}
/* apertura: il logo si compone, poi arrivano i pulsanti */
.home.intro .sp-logo path,.home.intro .sp-btn,.home.intro .sp-heading{opacity:0}
.home.intro.go .sp-logo path:nth-of-type(1){animation:spUp .9s var(--ease) .2s forwards}
.home.intro.go .sp-logo path:nth-of-type(2){animation:spRight .9s var(--ease) .2s forwards}
.home.intro.go .sp-logo path:nth-of-type(3){animation:spLine .9s var(--ease) .2s forwards}
.home.intro.go .sp-logo path:nth-of-type(4){animation:spUp .9s var(--ease) .2s forwards}
.home.intro.go .sp-logo path:nth-of-type(5){animation:spUp .9s var(--ease) .2s forwards}
.home.intro.go .sp-heading{animation:spFade .7s var(--ease) .8s forwards}
.home.intro.go .sp-btn{animation:spFade .7s var(--ease) .8s forwards}
.home.intro.go .sp-btn.soon{animation:spFade .7s var(--ease) .8s forwards}
.home .sp-link{opacity:0}
.home.intro.go .sp-link{animation:spFade .7s var(--ease) .8s forwards}
.home:not(.intro) .sp-link{opacity:1}
.home.enter .sp-logo{animation:rise .7s var(--ease) both}
.home.enter .sp-heading,.home.enter .sp-btn{animation:rise .7s var(--ease) .1s both}
.home.enter .sp-btn.soon{animation-delay:.17s}
.home.enter .sp-link{animation:rise .7s var(--ease) .24s both}
.home.leaving{opacity:0;transform:translateY(-10px);pointer-events:none}

/* ---------- benvenuto del configuratore ---------- */
.welcome{flex:1;min-height:100vh;min-height:100dvh;display:flex;flex-direction:column;gap:var(--s4);padding:var(--s5) var(--g) calc(var(--s5) + env(safe-area-inset-bottom,0px))}
.welcome .brand{order:0;align-self:center}
.welcome .w-text{order:1}
.welcome .wall{order:2}
.welcome #readyBox{order:3}
.welcome .welcome-cta{order:4}
.welcome>.legal{order:6}
.welcome .brand svg{width:92px;height:auto;display:block}
.welcome h1{font-size:clamp(30px,8.6vw,38px);line-height:1.04;margin:0}
.welcome .lead{margin-top:var(--s2);font-size:15px;line-height:1.45}
.welcome .brand-home{cursor:pointer;width:max-content;-webkit-tap-highlight-color:transparent}
.welcome .brand-home:focus-visible{outline:2px solid var(--primary);outline-offset:6px}
.wall{position:relative;display:flex;flex-direction:column;border-radius:var(--r-l);overflow:hidden;padding:var(--s2);background:var(--tray);box-shadow:var(--ring)}
.wall::before{content:"";position:absolute;inset:var(--s2);border-radius:calc(var(--r-l) - var(--s2));box-shadow:var(--lift);
  background-color:#fff}
.wall>*{position:relative}
.stage{position:relative;flex:1;min-height:136px;display:grid;place-items:center}
/* informazioni in breve: fanno parte della vetrina */
.facts{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));border-top:1px solid var(--line);margin:0 var(--s1)}
.fact{padding:var(--s3) var(--s3) var(--s4);min-width:0}
.fact+.fact{border-left:1px solid var(--line)}
.fact strong{display:block;font-family:var(--display);font-size:13px;line-height:1.2;letter-spacing:-.01em}
.fact strong i{font-style:normal;font-size:20px;color:var(--primary);margin-right:2px}
.fact:nth-child(2) strong{color:var(--orange-deep)}
.fact span{display:block;font-size:12px;line-height:1.35;color:var(--muted);margin-top:var(--s1)}
.glass-chip{position:absolute;display:flex;align-items:center;gap:var(--s2);height:32px;padding:0 var(--s3);border-radius:99px;background:var(--ink);color:#fff;font-size:12.5px;font-weight:700}
.glass-chip i{width:12px;height:12px;border-radius:50%}
.tile strong{display:block;font-family:var(--display);font-size:14px;line-height:1.2;letter-spacing:-.01em}
.tile.orange strong{color:var(--orange-deep)}
.tile span{font-size:12.5px;color:var(--muted);line-height:1.35;display:block;margin-top:var(--s1)}
.welcome-cta{display:grid;grid-template-columns:1fr 1fr;gap:var(--s3)}
.welcome-cta>.pill,.welcome-cta>.link-btn{grid-column:1/-1}
/* scorciatoie: due schede con icona, titolo e sottotitolo, sempre leggibili */
.cta-tile{position:relative;display:flex;flex-direction:column;align-items:flex-start;gap:var(--s2);min-width:0;padding:var(--s3) var(--s3) var(--s3);min-height:96px;border:0;border-radius:var(--r-m);background:#fff;box-shadow:var(--ring),var(--sh);text-align:left;color:var(--ink);transition:transform .5s var(--ease),box-shadow .5s var(--ease)}
.cta-tile .ic{flex:0 0 auto;width:40px;height:40px;border-radius:12px;background:var(--primary-soft);color:var(--primary);display:grid;place-items:center}
.cta-tile .ic svg{width:20px;height:20px}
.cta-tile .tx{display:flex;flex-direction:column;gap:2px;margin-top:auto;min-width:0}
.cta-tile b{font-family:var(--display);font-weight:800;font-size:14px;line-height:1.2;letter-spacing:-.01em}
.cta-tile small{font-size:12.5px;line-height:1.3;color:var(--muted)}
.cta-tile .go{position:absolute;top:calc(var(--s3) + 6px);right:var(--s3);width:28px;height:28px;border-radius:50%;background:var(--bg);color:var(--ink);display:grid;place-items:center;transition:background-color .4s var(--ease)}
.cta-tile .go svg{width:14px;height:14px}
.cta-tile:active{transform:scale(.98)}
@media (hover:hover){.cta-tile:hover{transform:translateY(-3px);box-shadow:var(--ring),var(--sh-up)}}
.area-btn{display:flex;align-items:center;justify-content:center;gap:var(--s2)}
.area-btn svg{width:18px;height:18px;flex:0 0 auto}
.welcome.leaving{opacity:0;transform:translateY(8px);transition:opacity .3s var(--ease),transform .3s var(--ease);pointer-events:none}
.ready-banner{display:flex;align-items:center;gap:var(--s3);background:var(--ok-soft);color:#14532D;border-radius:var(--r-m);padding:var(--s3) var(--s4);border:0;text-align:left;width:100%}
.ready-banner b{display:block}
.ready-banner span{font-size:13px}
.ready-banner .done-icon{width:40px;height:40px;margin:0;flex:0 0 auto}
.ready-banner .done-icon svg{width:20px;height:20px}

/* ---------- piè di pagina e dicitura legale ---------- */
.brand-foot{padding:var(--s7) var(--g) 148px;text-align:center;display:flex;flex-direction:row;flex-wrap:wrap;justify-content:center;align-items:center;gap:var(--s2);margin-top:var(--s5)}
.brand-foot small{font-size:12px;color:var(--muted)}
.brand-foot svg{width:104px;height:auto;display:block}
.brand-foot>small,.brand-foot>#footLogo{flex:0 0 100%;display:flex;justify-content:center}
.foot-admin{display:inline-flex;align-items:center;justify-content:center;gap:var(--s2);min-width:148px;min-height:44px;margin-top:var(--s3);padding:0 var(--s4);border-radius:99px;border:0;background:#fff;box-shadow:var(--ring);color:var(--ink);font-family:var(--display);font-size:13px;font-weight:700}
.foot-admin svg{width:15px!important;height:15px!important}
.legal{margin:var(--s4) auto 0;max-width:420px;text-align:center;font-size:12px;line-height:1.5;color:var(--muted)}
.legal em{font-style:italic}
.brand-foot .legal{flex:0 0 100%;max-width:none;box-sizing:border-box;padding-inline:max(0px,calc((100% - 46ch)/2));margin:var(--s4) 0 0}
.welcome>.legal{margin:var(--s2) auto 0;padding:0;text-align:center}

/* ---------- barra comandi: isola flottante ---------- */
/* barra comandi agganciata al bordo inferiore dello schermo */
.bar{position:fixed;left:0;right:0;bottom:0;z-index:5;padding:var(--s3) var(--g) calc(var(--s3) + env(safe-area-inset-bottom,0px));background:rgba(255,255,255,.9);-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px);border-top:1px solid var(--line);box-shadow:0 -14px 34px -18px rgba(10,40,70,.28)}
.bar-inner{max-width:520px;margin:0 auto;display:flex;gap:var(--s3);align-items:center}
.bar-inner .pill{flex:1;box-shadow:0 10px 20px -10px rgba(20,24,29,.5)}
.bar-inner .round{box-shadow:var(--ring)}
.toast{position:fixed;left:50%;bottom:104px;transform:translate(-50%,10px);background:var(--ink);color:#fff;padding:var(--s3) var(--s4);border-radius:99px;font-size:14px;font-weight:600;opacity:0;visibility:hidden;transition:opacity .3s var(--ease),transform .5s var(--ease),visibility 0s .5s;pointer-events:none;z-index:9}
.toast.show{opacity:1;visibility:visible;transform:translate(-50%,0);transition-delay:0s}
.lg-blue{fill:#006AB3}.lg-orange{fill:#EF7F1A}.lg-ink{fill:#2B2A29}

/* finestre */
.modal-ov{position:fixed;inset:0;z-index:50;background:transparent;display:grid;place-items:center;padding:var(--s5);animation:fade .2s ease-out;transition:opacity .2s ease}
.modal-ov.closing{opacity:0;pointer-events:none}
.modal{width:100%;max-width:400px;background:#fff;border-radius:var(--r-l);padding:var(--s6) var(--s5) var(--s5);box-shadow:0 0 0 200vmax rgba(15,20,26,.5),0 24px 60px rgba(0,0,0,.28);animation:rise .5s var(--ease)}
.modal h2{font-size:20px;margin:0 0 var(--s2);line-height:1.15}
.modal p{color:var(--muted);margin:0 0 var(--s5);font-size:15px;white-space:pre-line}
.modal-act{display:flex;flex-wrap:wrap;gap:var(--s3);justify-content:flex-end}
.modal-act>button{min-height:48px}
.modal-act.col{flex-direction:column-reverse;align-items:stretch}
.modal-act.col>button{width:100%}
@keyframes fade{from{opacity:0}to{opacity:1}}

/* ---------- area clienti ---------- */
.ap-list{display:grid;gap:var(--s3)}
.ap-card{display:flex;align-items:stretch;overflow:hidden;border-radius:var(--r-m)}
.ap-open{flex:1;min-width:0;display:grid;gap:3px;text-align:left;padding:var(--s4) var(--s5);border:0;background:none;color:var(--ink);cursor:pointer}
.ap-code{font-family:var(--display);font-weight:800;font-size:21px;letter-spacing:.05em;line-height:1.1}
.ap-meta{font-size:13px;color:var(--muted)}
.ap-stato{justify-self:start;margin-top:var(--s1);font-size:12px;font-weight:800;padding:3px var(--s3);border-radius:99px;background:var(--chip);color:var(--muted)}
.ap-stato.ok{background:var(--ok-soft);color:var(--ok)}
.ap-del{flex:0 0 auto;width:56px;border:0;border-left:1px solid var(--line);background:none;color:var(--muted);font-size:22px;cursor:pointer}
.ap-del svg{width:20px;height:20px}
.ap-del:disabled{opacity:.4}
.ap-actions{display:flex;justify-content:space-between;gap:var(--s3);margin:var(--s5) var(--s1) var(--s2)}

/* ---------- gestionale ---------- */
h3.sec{font-size:18px;margin:var(--s6) 0 var(--s3);line-height:1.1}
.bom{padding:var(--s1) var(--s4) var(--s2);margin-bottom:var(--s4)}
.bom h4{font-size:12px;color:var(--muted);font-weight:800;margin:var(--s4) 0 var(--s1)}
.bom-row{display:grid;grid-template-columns:1fr auto auto;gap:var(--s3);padding:var(--s2) 0;border-bottom:1px solid var(--line);align-items:baseline;font-size:15px}
.bom-row:last-child{border-bottom:0}
.bom-row code{font-family:var(--font);font-weight:800;font-size:14px;color:var(--primary)}
.bom-row code.missing{color:var(--warn);font-weight:600}
.bom-row b{font-variant-numeric:tabular-nums;min-width:40px;text-align:right}
.app.wide{max-width:760px}
.g-card{padding:var(--s4);margin-bottom:var(--s3);border-radius:var(--r-l)}
.g-card.center{text-align:center;padding:var(--s6) var(--s5)}
.g-card h2{font-size:20px;margin:0 0 var(--s2);line-height:1.15}
.g-card p{color:var(--muted);margin:0}
.lock{width:64px;height:64px;border-radius:var(--r-m);background:var(--primary);color:#fff;display:grid;place-items:center;margin:0 auto var(--s4)}
.lock svg{width:30px;height:30px}
.g-login{max-width:420px;margin:var(--s2) auto 0;display:flex;flex-direction:column}
.g-login .link-btn{margin-top:var(--s1)}
.g-form{display:block}
.g-note{background:var(--orange-soft);color:var(--orange-ink);border-radius:var(--r-m);padding:var(--s3) var(--s4);font-size:14px;margin-top:var(--s2)}
.rec-code{font-family:var(--display);font-weight:800;font-size:24px;letter-spacing:.06em;padding:var(--s4);border-radius:var(--r-m);background:var(--bg);border:1px dashed #9AA5B1;margin-bottom:var(--s4);word-break:break-word}
.kpi{display:grid;grid-template-columns:repeat(2,1fr);gap:var(--s3);margin-bottom:var(--s4)}
.kpi-big{grid-column:1/-1;border-radius:var(--r-l);padding:var(--s5);background:var(--primary);color:#fff;display:flex;flex-direction:column;box-shadow:var(--sh-up)}
.kpi-big span{font-size:13px;opacity:.82}
.kpi-big b{font-family:var(--display);font-weight:800;font-size:32px;line-height:1.1;letter-spacing:-.03em}
.kpi-big small{font-size:12px;opacity:.78}
.kpi-t{text-align:left;padding:var(--s4)}
.kpi-t b{display:block;font-family:var(--display);font-weight:800;font-size:26px;line-height:1.1}
.kpi-t span{font-size:12px;color:var(--muted);font-weight:700}
.g-tools{display:flex;gap:var(--s3);align-items:stretch;margin-bottom:var(--s3)}
.g-tools .search{flex:1;min-width:0;margin-bottom:0}
.search{display:flex;align-items:center;gap:var(--s3);background:#fff;border:0;border-radius:99px;padding:0 var(--s5);height:var(--h-field);margin-bottom:var(--s3);box-shadow:var(--ring)}
.search:focus-within{box-shadow:0 0 0 2px var(--primary),0 0 0 6px rgba(0,106,179,.14)}
.search svg{width:20px;height:20px;color:var(--muted);flex:0 0 auto}
.search input{flex:1;border:0;outline:none;background:transparent;font-size:15px}
.btn-reload{flex:0 0 auto;display:inline-flex;align-items:center;gap:var(--s2);height:var(--h-field);padding:0 var(--s5);border-radius:99px;border:0;background:#fff;box-shadow:var(--ring);font-family:var(--display);font-weight:700;font-size:14px;color:var(--ink)}
.btn-reload svg{width:18px;height:18px;flex:0 0 auto}
.btn-reload.spin svg{animation:spin .8s linear infinite}
.btn-reload:disabled{opacity:.6;cursor:default}
@keyframes spin{to{transform:rotate(360deg)}}
.g-upd{font-size:12px;color:var(--muted);margin:calc(var(--s1)*-1) var(--s1) var(--s3)}
@media (max-width:480px){.btn-reload{width:var(--h-field);padding:0;justify-content:center}.btn-reload span{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0,0,0,0)}}
.fchips{display:flex;gap:var(--s2);overflow-x:auto;padding:2px 0 var(--s3);scrollbar-width:none}
.fchips::-webkit-scrollbar{display:none}
.fchips.wrap{flex-wrap:wrap;overflow:visible;padding-bottom:var(--s3)}
.fchip{flex:0 0 auto;min-height:44px;padding:0 var(--s4);border-radius:99px;border:0;background:#fff;box-shadow:var(--ring);font-size:13px;font-weight:800;color:var(--ink)}
.fchip[aria-pressed="true"]{background:var(--ink);color:#fff;box-shadow:none}
.qlist{display:grid;gap:var(--s3);grid-template-columns:minmax(0,1fr)}
.qcard{text-align:left;padding:var(--s4) var(--s5);display:grid;gap:var(--s1);min-width:0;border-radius:var(--r-m)}
.qcard>*{min-width:0}
.qtop{display:flex;justify-content:space-between;align-items:center;gap:var(--s3)}
.qtop strong{font-size:16px;font-weight:800;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;min-width:0}
.qmid{font-size:14px}
.qmid .tipo{color:var(--muted);text-transform:capitalize}
.qbot{display:flex;justify-content:space-between;gap:var(--s3);font-size:12px;color:var(--muted)}
.qbot b{color:var(--ink);font-size:14px}
.qbot span{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.badge{flex:0 0 auto;font-size:12px;font-weight:800;padding:3px var(--s3);border-radius:99px;white-space:nowrap}
.tipo-b{background:var(--orange-soft);color:var(--orange-deep);text-transform:capitalize}
.g-row{display:flex;align-items:center;gap:var(--s3);margin-bottom:var(--s2)}
.muted{color:var(--muted);font-size:14px}
.g-line{display:flex;justify-content:space-between;gap:var(--s3);padding:var(--s3) 0;border-top:1px solid var(--line);font-size:15px}
.g-line span{color:var(--muted)}
.g-line b{text-align:right;font-weight:700;overflow-wrap:anywhere}
.stati{display:flex;flex-wrap:wrap;gap:var(--s2)}
.stato{min-height:44px;padding:0 var(--s4);border-radius:99px;border:0;background:#fff;box-shadow:var(--ring);font-size:13px;font-weight:800;color:var(--muted)}
.stato[aria-pressed="true"]{background:var(--b);color:var(--c);box-shadow:0 0 0 1.5px var(--c)}
.g-pv{margin:0 0 var(--s1)}
.g-ta{width:100%;min-height:72px;border:0;border-radius:var(--r-m);box-shadow:var(--ring);padding:var(--s3);margin:6px 0 var(--s3);background:#fff}
.g-card>.btn-sec,.g-card>.btn-ghost,.g-form>.btn-sec{display:flex;width:100%;margin-top:var(--s1)}
.g-card>.btn-sec+.btn-sec{margin-top:var(--s3)}
.g-card>.muted+.btn-sec{margin-top:var(--s3)}
.cfg-line{display:flex;flex-wrap:wrap;align-items:center;gap:6px;margin-top:6px}
.cfg-tag{font-size:12px;font-weight:800;padding:3px var(--s3);border-radius:99px;background:var(--chip);color:var(--muted)}
.cfg-tag.on{background:var(--ok-soft);color:var(--ok)}
.two{display:grid;grid-template-columns:1fr 1fr;gap:var(--s3)}
.field.sel select{width:100%;border:0;background:transparent;padding:var(--s1) 0 0;font:inherit;font-weight:600;color:var(--ink);outline:none;-webkit-appearance:none;appearance:none;background-image:linear-gradient(45deg,transparent 50%,var(--muted) 50%),linear-gradient(135deg,var(--muted) 50%,transparent 50%);background-position:calc(100% - 10px) 60%,calc(100% - 5px) 60%;background-size:5px 5px;background-repeat:no-repeat}
/* prezzi */
.ptable{padding:var(--s1) var(--s3)}
.psec{font-size:12px;font-weight:800;color:var(--muted);margin:var(--s3) 0 2px}
.prow{display:grid;grid-template-columns:minmax(0,1fr) 82px 70px;gap:var(--s2);align-items:center;padding:var(--s2) 0;border-bottom:1px solid var(--line)}
.prow:last-child{border-bottom:0}
.prow .pdesc{min-width:0}
.pdesc b{display:block;font-size:14px;font-weight:700;line-height:1.3;overflow-wrap:anywhere}
.pdesc span{font-size:12px;color:var(--muted);overflow-wrap:anywhere}
.pdesc .miss{color:var(--warn);font-style:normal}
.pin input,.psc input{height:40px;border:0;border-radius:var(--r-s);box-shadow:var(--ring);padding:0 var(--s3);text-align:right;font-weight:700;background:var(--bg)}
.pin input{width:100%}
.psc input{width:92px}
.pin input:focus,.psc input:focus{outline:none;box-shadow:0 0 0 2px var(--primary);background:#fff}
.psub{min-width:74px;text-align:right;font-weight:800;font-variant-numeric:tabular-nums;font-size:14px}
.ptot{margin-top:var(--s3);border-top:2px solid var(--ink);padding-top:var(--s2);display:grid;gap:6px}
.ptot>div{display:flex;justify-content:space-between;align-items:center;font-size:15px}
.ptot span{color:var(--muted)}
.pbig b{font-family:var(--display);font-size:24px;font-weight:800}
.ptable.listino .prow{grid-template-columns:minmax(0,1fr) 96px}
.pub-total{background:var(--bg);border-radius:var(--r-m);padding:var(--s4);text-align:center;margin-bottom:var(--s3)}
.pub-total span{display:block;font-size:13px;color:var(--muted)}
.pub-total b{display:block;font-family:var(--display);font-weight:800;font-size:32px;line-height:1.1;letter-spacing:-.03em}
.pub-total small{color:var(--muted)}

/* =========================================================
   DESKTOP (da 960px): colonna sinistra = titolo + anteprima,
   colonna destra = scelte. Tutto sulla stessa griglia.
   ========================================================= */
@media (min-width:960px){
  :root{--g:0px}
  .app,.app.wide{max-width:1240px;padding:0 var(--s7)}
  button,.qcard,.s-card,.option,.swatch{cursor:pointer}
  h1{font-size:44px}
  .lead{font-size:17px}
  /* benvenuto: testo e comandi a sinistra, tavola a destra */
  .welcome{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.05fr);grid-template-areas:"brand brand" "text wall" "ready wall" "cta wall";column-gap:var(--col-gap);row-gap:var(--s5);align-content:center;padding:var(--s7) 0;min-height:100vh}
  .welcome .brand{grid-area:brand;justify-self:center;margin-bottom:var(--s5)}
  .welcome .brand svg{width:148px}
  .welcome .w-text{grid-area:text}
  .welcome #readyBox{grid-area:ready}
  .welcome .wall{grid-area:wall;min-height:600px;align-self:stretch}
  .welcome .wall .plate{transform:scale(1.8)}
  .fact{padding:var(--s4) var(--s4) var(--s5)}
  .fact strong{font-size:14px}
  .fact span{font-size:12.5px}
  .welcome .glass-chip:first-of-type{top:var(--s5)!important;left:var(--s5)!important}
  .welcome .glass-chip:last-of-type{bottom:var(--s5)!important;right:var(--s5)!important}
  .welcome-cta{grid-area:cta;max-width:460px}
  .welcome>.legal{grid-column:1/-1;max-width:none;margin:var(--s5) 0 0}
  .welcome h1{font-size:clamp(52px,5vw,72px)}
  .welcome .lead{font-size:18px;max-width:40ch}
  /* passaggi */
  #flow{display:grid;grid-template-columns:minmax(0,1fr);max-width:760px;margin:0 auto;width:100%}
  header{padding:var(--s7) 0 0}
  .flow-logo{width:96px}
  main{padding:var(--s5) 0 160px}
  .preview{margin:var(--s5) 0 0}
  /* con anteprima: logo e avanzamento su tutta la larghezza, poi due colonne allineate in alto */
  #flow:has(> #preview:not([hidden])){max-width:none;padding-top:var(--s7);grid-template-columns:var(--col-l) minmax(0,1fr);grid-template-rows:auto auto auto auto auto auto 1fr auto;grid-template-areas:"logo logo" "line line" "title main" "lead main" "note main" "pv main" "pv main" "foot foot";column-gap:var(--col-gap);align-items:start}
  #flow:has(> #preview:not([hidden])) > header{display:contents}
  #flow:has(> #preview:not([hidden])) .flow-logo{grid-area:logo;justify-self:center;margin:0 0 var(--s5)}
  #flow:has(> #preview:not([hidden])) .topline{grid-area:line;margin-bottom:var(--s6)}
  #flow:has(> #preview:not([hidden])) #title{grid-area:title}
  #flow:has(> #preview:not([hidden])) #lead{grid-area:lead}
  #flow:has(> #preview:not([hidden])) #serieNote{grid-area:note}
  #flow:has(> #preview:not([hidden])) > main{grid-area:main;padding:var(--s2) 0 160px}
  #flow:has(> #preview:not([hidden])) > #preview{grid-area:pv;position:sticky;top:var(--s5);margin:var(--s5) 0 0;align-self:start}
  #flow:has(> #preview:not([hidden])) > .brand-foot{grid-area:foot;padding:var(--s6) 0 160px;justify-content:center}
  .preview-scroll{padding:var(--s7) var(--s4) var(--s5)}
  .grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--s3)}
  .carousel{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));overflow:visible;margin:0;padding:var(--s2) 0 var(--s5)}
  .s-card{max-width:none}
  .options{grid-template-columns:1fr}
  .rows{grid-template-columns:minmax(0,1fr)}
  .find-box,.find-hint{max-width:560px}
  .esito{max-width:640px}
  .room-list{grid-template-columns:repeat(2,minmax(0,1fr))}
  /* barra comandi: la pillola sta esattamente sotto la colonna delle scelte */
  .bar{padding:var(--s3) var(--s7)}
  /* barra comandi centrata nella pagina, con larghezza massima */
  .bar-inner{max-width:640px;margin:0 auto;justify-content:center}
  .bar-inner .pill{flex:1 1 auto;box-shadow:0 14px 28px -12px rgba(20,24,29,.6)}
  .g-card>.btn-sec,.g-form>.btn-sec{width:auto;min-width:240px}
  .actions{grid-template-columns:repeat(auto-fill,minmax(190px,220px))}
  .g-actions{grid-template-columns:repeat(auto-fill,minmax(170px,210px));justify-content:start}
  .esito .actions,.done-box .actions{justify-content:center}
  /* passaggio del mouse */
  .s-card:hover,.option:hover,.ftile:hover,.srow:hover,.qcard:hover,.kpi-t:hover,.room-card:hover{transform:translateY(-3px);box-shadow:var(--ring),var(--sh-up)}
  .s-card[aria-pressed="true"]:hover,.option[aria-pressed="true"]:hover,.ftile.active:hover,.srow.active:hover{box-shadow:0 0 0 2px var(--primary),var(--sh-up)}
  .btn-sec:hover,.btn-ghost:hover,.round:hover,.foot-admin:hover,.mini-btn:hover,.btn-reload:hover,.fchip:hover,.stato:hover{box-shadow:0 0 0 1.5px var(--ink)}
  .stepper button:not(:disabled):hover{transform:scale(1.08)}
  /* gestionale */
  .app.wide #flow{max-width:1120px}
  .qlist{grid-template-columns:repeat(2,minmax(0,1fr))}
  .kpi{grid-template-columns:1.6fr repeat(4,minmax(0,1fr))}
  .kpi-big{grid-column:auto}
  .g-login{margin-top:var(--s5)}
  .prow{grid-template-columns:minmax(0,1fr) 110px 100px}
}
@media (min-width:1280px){
  .grid{grid-template-columns:repeat(4,minmax(0,1fr))}
  #flow:has(> #preview:not([hidden])) .grid{grid-template-columns:repeat(3,minmax(0,1fr))}
}
@media (max-width:380px){ .room-act{padding-left:var(--s3)} .room-form{flex-direction:column} .room-form .btn-ok{min-height:48px} }
@media (max-width:340px){ .facts{grid-template-columns:1fr}.fact+.fact{border-left:0;border-top:1px solid var(--line)} }

/* ===================== MOVIMENTO ===================== */
@keyframes rise{from{opacity:0;transform:translateY(16px);filter:blur(6px)}to{opacity:1;transform:none;filter:none}}
@keyframes slideIn{from{opacity:0;transform:translateX(var(--dx,28px));filter:blur(4px)}to{opacity:1;transform:none;filter:none}}
@keyframes selPop{from{transform:scale(.985);filter:brightness(.97)}to{transform:none;filter:none}}
@keyframes checkPop{from{opacity:0;transform:scale(.55) rotate(-12deg)}to{opacity:1;transform:none}}
@keyframes modDrop{from{opacity:0;transform:translateY(-12px)}to{opacity:1;transform:none}}
@keyframes draw{to{stroke-dashoffset:0}}
@keyframes spUp{from{opacity:0;transform:translateY(46px)}to{opacity:1;transform:none}}
@keyframes spRight{from{opacity:0;transform:translateX(70px)}to{opacity:1;transform:none}}
@keyframes spLine{from{opacity:0;transform:translateX(-24px)}to{opacity:1;transform:none}}
@keyframes spFade{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
.welcome.view-wait>*{opacity:0}
.welcome.view-in>*{animation:rise .9s var(--ease) both}
.welcome.view-in>:nth-child(2){animation-delay:.08s}
.welcome.view-in>:nth-child(3){animation-delay:.16s}
.welcome.view-in>:nth-child(4){animation-delay:.24s}
.welcome.view-in>:nth-child(5){animation-delay:.32s}
.welcome.view-in>:nth-child(n+6){animation-delay:.4s}
#flow.view-in>header,#flow.view-in>#preview,#flow.view-in>#main{animation:slideIn .8s var(--ease) both}
#flow.view-in>#preview{animation-delay:.05s}
#flow.view-in>#main{animation-delay:.1s}
.just-sel{animation:selPop .6s var(--ease)}
.just-sel .check,.just-sel .sel-badge{animation:checkPop .7s var(--ease)}
.preview svg.drop{animation:modDrop .4s var(--ease) both}
.pv-item.plate-in{animation:rise .6s var(--ease) both}
.pill,.round,.btn-sec,.btn-ghost,.swatch,.seg button,.stepper button{transition:transform .4s var(--ease),background-color .3s,color .3s,box-shadow .3s}
.pill:not(:disabled):active,.round:active,.btn-sec:active,.btn-ghost:active,.stepper button:not(:disabled):active{transform:scale(.97);transition-duration:.12s}
.s-card:active,.option:active,.swatch:active,.seg button:active{transform:scale(.99);transition-duration:.12s}
.done-box.view-pop .done-icon{animation:checkPop .6s var(--ease) both}
.done-box.view-pop .done-icon path{stroke-dasharray:22;stroke-dashoffset:22;animation:draw .5s ease-out .3s forwards}
.done-box.view-pop>:not(.done-icon){animation:rise .7s var(--ease) both;animation-delay:.2s}
@keyframes calmIn{from{opacity:0}to{opacity:1}}
/* "riduci movimento": niente spostamenti, ingrandimenti o sfocature; restano dissolvenze brevi e cambi di colore,
   così selezione, passo corrente e pulsanti continuano a dare un riscontro */
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *,*::before,*::after{transition-property:opacity,background-color,color,border-color,box-shadow!important;transition-duration:.18s!important;transition-delay:0s!important;transition-timing-function:ease!important}
  .welcome.view-in>*,#flow.view-in>header,#flow.view-in>#preview,#flow.view-in>#main,.pv-item.plate-in,.preview svg.drop,.modal,.done-box.view-pop>*,.done-box.view-pop .done-icon{animation:calmIn .35s ease both!important}
  .just-sel,.just-sel .check,.just-sel .sel-badge,.pill.appear,.dots.anim i.cur,.meter-bar i.on.new{animation:calmIn .35s ease both!important}
  .done-box.view-pop .done-icon path{animation:none!important;stroke-dashoffset:0!important}
  .bar:not([hidden]){animation:none!important}
  .home.leaving,.welcome.leaving{transform:none!important}
  .s-card:hover,.option:hover,.ftile:hover,.srow:hover,.qcard:hover,.kpi-t:hover,.room-card:hover,.cta-tile:hover{transform:none!important}
  .pill:active,.round:active,.btn-sec:active,.btn-ghost:active,.stepper button:active,.s-card:active,.option:active,.swatch:active,.seg button:active,.cta-tile:active,.home .sp-btn:active{transform:none!important}
  .arr::before,.sp-go::before,.cta-tile .go::before{transition-duration:.18s!important}
}

/* schede e righe: entrano con dissolvenza e sfocatura mentre scorri la pagina */
@keyframes cardIn{from{opacity:0;transform:translateY(28px) scale(.985)}to{opacity:1;transform:none}}
@supports (animation-timeline:view()){
  @media (prefers-reduced-motion:no-preference){
    .srow,.ftile,.option,.room-card,.qcard,.ap-card,.g-card,.bom{animation:cardIn linear backwards;animation-timeline:view();animation-range:entry 0% entry 55%}
  }
}
/* barra comandi: sale dal basso la prima volta */
@keyframes barIn{from{transform:translateY(100%)}to{transform:none}}
.bar:not([hidden]){animation:barIn .8s var(--ease) both}
/* finestre: dissolvenza dello sfondo e salita della piastra */
.modal-ov{animation:fade .35s var(--ease)}
/* pulsante premuto: si abbassa, poi risale */
.pill:not(:disabled):active,.home .sp-btn:active{transition-duration:.15s}


/* freccia: resta ferma. Il cerchio si riempie dal centro e un anello si apre intorno */
.arr,.sp-go{position:relative;isolation:isolate;overflow:hidden}
.cta-tile .go{isolation:isolate;overflow:hidden}
.arr::before,.sp-go::before,.cta-tile .go::before{content:"";position:absolute;inset:0;z-index:-1;border-radius:50%;background:#fff;transform:scale(0);transition:transform .65s var(--ease)}
.cta-tile .go::before{background:var(--orange)}
.pill:not(:disabled):hover .arr::before,.pill:not(:disabled):focus-visible .arr::before,.pill:not(:disabled):active .arr::before,
.home .sp-btn:not(.soon):hover .sp-go::before,.home .sp-btn:not(.soon):focus-visible .sp-go::before,.home .sp-btn:not(.soon):active .sp-go::before,
.cta-tile:hover .go::before,.cta-tile:focus-visible .go::before,.cta-tile:active .go::before{transform:scale(1)}

/* "riduci animazioni" attivo: l'apertura con il logo resta, solo come dissolvenza (niente movimento) */
@media (prefers-reduced-motion:reduce){
  .home.intro.go .sp-logo path{animation:calmIn .9s ease .2s both!important}
  .home.intro.go .sp-logo path:nth-of-type(2){animation-delay:.2s!important}
  .home.intro.go .sp-logo path:nth-of-type(3){animation-delay:.2s!important}
  .home.intro.go .sp-logo path:nth-of-type(4){animation-delay:.2s!important}
  .home.intro.go .sp-logo path:nth-of-type(5){animation-delay:.2s!important}
  .home.intro.go .sp-heading{animation:calmIn .7s ease .8s both!important}
  .home.intro.go .sp-btn{animation:calmIn .7s ease .8s both!important}
  .home.intro.go .sp-btn.soon{animation:calmIn .7s ease .8s both!important}
  .home.intro.go .sp-link{animation:calmIn .7s ease .8s both!important}
}

/* "Prossimamente": il riquadro non è disponibile, quindi tutto grigio e senza rilievo */
.home .sp-btn.soon .sp-soon{background:transparent;color:#6E7883;box-shadow:inset 0 0 0 1.5px #B8C0C9}
.home .sp-btn.soon:active{transform:none}

/* su telefono (e su schermi touch) il cerchio arancione con la freccia resta fermo: niente riempimento e niente anello */
@media (hover:none),(max-width:959px){
  .arr::before,.sp-go::before,.cta-tile .go::before{display:none}
  .pill:not(:disabled):hover .arr,.pill:not(:disabled):focus-visible .arr,.pill:not(:disabled):active .arr{box-shadow:none}
  .home .sp-btn:not(.soon):hover .sp-go,.home .sp-btn:not(.soon):focus-visible .sp-go,.home .sp-btn:not(.soon):active .sp-go{box-shadow:none}
  .pill:not(:disabled):hover>span:first-child{transform:none}
}


.modal-ov{overscroll-behavior:contain}

/* contatore moduli con molti posti: una sola barra di avanzamento */
.meter{min-width:0}
.meter-bar.big{position:relative;overflow:hidden;border-radius:6px;background:rgba(20,24,29,.12)}
.meter-bar.big i{flex:none;width:100%;height:100%;border-radius:0;transform-origin:left center;transition:transform .5s var(--ease)}
.actions.center{justify-content:center}
/* elenco del materiale stanza per stanza */
.mat{display:grid;gap:var(--s3);margin-bottom:var(--s4)}
.mat-room{padding:var(--s3) var(--s4) var(--s2)}
.mat-room h4{font-family:var(--display);font-weight:800;font-size:17px;margin:var(--s2) 0 var(--s1)}
.mat-sec{font-size:12px;font-weight:800;color:var(--muted);margin:var(--s3) 0 var(--s1)}
.mat-row{display:grid;grid-template-columns:1fr auto;gap:var(--s3);padding:var(--s2) 0;border-bottom:1px solid var(--line);align-items:baseline;font-size:15px;text-align:left}
.mat-row.adm{grid-template-columns:1fr auto auto}
.mat-row code{font-family:var(--font);font-weight:800;font-size:14px;color:var(--primary)}
.mat-row code.missing{color:var(--warn);font-weight:600}
.mat-row b{font-variant-numeric:tabular-nums;min-width:40px;text-align:right}
.done-box~h3.sec,.done-box~.mat{text-align:left}

/* elenco dei preventivi inviati: scorri a sinistra per eliminare */
.sw-list{display:grid;gap:var(--s3)}
.sw-row{position:relative;overflow:hidden;border-radius:var(--r-m)}
.sw-del{position:absolute;right:0;top:0;bottom:0;width:88px;border:0;background:var(--danger);color:#fff;display:grid;place-items:center;cursor:pointer;opacity:0;transition:opacity .2s ease}
.sw-del svg{width:24px;height:24px}
.sw-row.sw-on .sw-del{opacity:1}
.sw-fg{position:relative;display:flex;background:#fff;touch-action:pan-y;transition:transform .35s var(--ease);will-change:transform}
.sw-fg .ap-open{flex:1;min-width:0}
@media (prefers-reduced-motion:reduce){.sw-fg{transition-duration:.01s}}

/* pagina contatti */
.ct-wrap{display:grid;gap:var(--s4)}
.ct-addr{display:flex;align-items:center;gap:var(--s4);padding:var(--s4) var(--s5);text-align:left}
.ct-addr b{display:block;font-family:var(--display);font-size:18px;margin-bottom:2px}
.ct-addr span:not(.ct-pin){display:block;color:var(--muted);font-size:15px}
.ct-pin{flex:0 0 auto;width:48px;height:48px;border-radius:50%;display:grid;place-items:center;background:var(--chip);color:var(--primary)}
.ct-pin svg{width:24px;height:24px}
.ct-actions{display:grid;grid-template-columns:1fr;gap:var(--s3)}
.ct-btn{display:flex;align-items:center;justify-content:center;gap:var(--s3);min-height:56px;padding:0 var(--s5);border-radius:99px;color:#fff;font-family:var(--display);font-weight:800;font-size:17px;text-decoration:none;box-shadow:var(--sh-up);transition:transform .4s var(--ease),box-shadow .4s var(--ease)}
.ct-btn svg{flex:0 0 auto;width:24px;height:24px}
.ct-btn small{font-family:var(--font);font-weight:700;font-size:14px;opacity:.9}
.ct-btn:active{transform:scale(.985)}
.ct-wa{background:#168040}
.ct-call{background:var(--primary)}
.ct-mail{background:var(--ink)}
@media (hover:hover){.ct-btn:hover{transform:translateY(-2px)}}
.ct-map{padding:0;overflow:hidden;height:260px;display:flex}
.ct-map iframe{display:block;width:100%;height:100%;border:0}
.ct-map-btn{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:var(--s2);border:0;background:linear-gradient(180deg,var(--vis-top),var(--vis-bot));color:var(--ink);cursor:pointer;padding:var(--s5);text-align:center}
.ct-map-btn svg{width:36px;height:36px;color:var(--primary)}
.ct-map-btn b{font-family:var(--display);font-size:18px}
.ct-map-btn small{font-size:13px;color:var(--muted);max-width:30ch}
@media (min-width:640px){.ct-actions{grid-template-columns:repeat(3,1fr)}.ct-map{height:340px}}
.ct-btn{padding:0 var(--s4);white-space:nowrap}
.ct-btn small{white-space:nowrap}
@media (max-width:420px){.ct-call{gap:var(--s2)}}
/* righe di pulsanti centrate: le colonne vuote della griglia non spostano i pulsanti a sinistra */
.actions.center{display:flex;flex-wrap:wrap;justify-content:center;align-items:stretch}
.actions.center>*{width:auto;flex:0 1 220px;min-width:min(100%,190px)}

/* avviso di consenso per la mappa */
.ck{position:fixed;left:50%;bottom:calc(env(safe-area-inset-bottom,0px) + 104px);z-index:60;width:min(560px,calc(100% - 2*var(--g)));padding:var(--s5);border-radius:var(--r-l);background:#fff;box-shadow:var(--ring),0 24px 48px -16px rgba(20,24,29,.35);transform:translateX(-50%);animation:ckIn .6s var(--ease) both}
.ck h2{font-family:var(--display);font-weight:800;font-size:18px;margin:0 0 var(--s2);line-height:1.15}
.ck p{margin:0 0 var(--s2);font-size:14px;line-height:1.45;color:var(--muted)}
.ck .ck-link{margin-bottom:var(--s4)}
.ck a{color:var(--primary);font-weight:700;text-underline-offset:3px}
.ck-btns{display:grid;grid-template-columns:1fr 1fr;gap:var(--s3)}
.ck-btns .btn-sec{width:100%;margin:0}
@keyframes ckIn{from{opacity:0;transform:translate(-50%,24px)}to{opacity:1;transform:translate(-50%,0)}}
@media (prefers-reduced-motion:reduce){.ck{animation:calmFade .3s ease both}}
@keyframes calmFade{from{opacity:0}to{opacity:1}}
/* pagine senza etichetta di passo (es. Contatti): niente riga vuota sopra il titolo */
.topline:has(#stepinfo:empty):not(:has(.dots i)){display:none}