/*
  Shop Walk 3D — funzioni (07/10/2026): pannelli dei moduli in js/funzioni/.
  Stesso tema boutique di app.css (avorio, nero caldo, ottone, corallo; Gloock + Manrope): usa le sue variabili,
  con valori di ripiego così il file funziona anche da solo (pagina di prova, versione accessibile).
*/
.fz-velo, .fz-tour, #fz-stampa, .fz-scheda, .fz-carrello {
  --fz-carta: var(--cartoncino, #fbf8f2);
  --fz-carta-2: var(--cartoncino-2, #f1ebe0);
  --fz-ink: var(--inchiostro, #1d1915);
  --fz-ink-2: var(--inchiostro-2, #5c5248);
  --fz-ottone: var(--nastro, #b08a52);
  --fz-acc: var(--accento, #c23d18);
  --fz-acc-scuro: var(--accento-scuro, #8f2e12);
  --fz-verde: var(--verde, #1e6b47);
  --fz-blu: var(--blu, #2d5a87);
  --fz-filo: var(--filo, rgba(29, 25, 21, .1));
  --fz-bordo: var(--bordo, 1px solid rgba(29, 25, 21, .14));
  --fz-raggio: var(--raggio, 14px);
  --fz-ombra: var(--ombra, 0 18px 40px -20px rgba(40, 28, 16, .45), 0 2px 8px rgba(40, 28, 16, .08));
  --fz-display: var(--display, "Gloock", Georgia, serif);
  --fz-testo: var(--testo, "Manrope", system-ui, -apple-system, "Segoe UI", sans-serif);
  --fz-ease: var(--ease, cubic-bezier(.16, 1, .3, 1));
}
.fz-ico { width: 20px; height: 20px; fill: none; stroke: currentColor; stroke-width: 1.7; stroke-linecap: round; stroke-linejoin: round; flex: none; }
.fz-vh { position: absolute !important; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }

/* ---------- pannello ---------- */
.fz-velo {
  position: fixed; inset: 0; z-index: 35; display: grid; place-items: center;
  padding: max(14px, env(safe-area-inset-top)) max(16px, env(safe-area-inset-right)) max(16px, env(safe-area-inset-bottom)) max(16px, env(safe-area-inset-left));
  background: rgba(29, 25, 21, .46); -webkit-backdrop-filter: blur(3px); backdrop-filter: blur(3px);
  font: 500 16px/1.45 var(--fz-testo); color: var(--fz-ink);
  animation: fz-velo .28s ease-out;
}
.fz-velo[hidden] { display: none !important; }
.fz-foglio {
  position: relative; width: min(560px, 100%); max-height: min(88dvh, 860px); overflow: auto; overscroll-behavior: contain;
  background: var(--fz-carta); border-radius: var(--fz-raggio); box-shadow: 0 40px 80px -30px rgba(29, 25, 21, .6), 0 2px 10px rgba(29, 25, 21, .1);
  animation: fz-sale .45s var(--fz-ease);
  scrollbar-width: thin; scrollbar-color: rgba(29, 25, 21, .28) transparent;
}
.fz-foglio.fz-largo { width: min(940px, 100%); }
.fz-foglio::before { content: ""; position: absolute; left: 28px; right: 28px; top: 0; height: 2px; background: linear-gradient(90deg, transparent, var(--fz-ottone), transparent); opacity: .8; }
.fz-testa {
  position: sticky; top: 0; z-index: 2; display: flex; justify-content: space-between; align-items: flex-start; gap: 16px;
  padding: 22px 24px 14px; background: linear-gradient(var(--fz-carta) 82%, color-mix(in srgb, var(--fz-carta) 0%, transparent));
}
.fz-titolo { margin: 0; font: 400 clamp(26px, 3.2vw, 34px)/1.05 var(--fz-display); letter-spacing: -.005em; text-wrap: balance; }
.fz-sotto { margin: 6px 0 0; color: var(--fz-ink-2); font-size: 14.5px; max-width: 60ch; text-wrap: pretty; }
.fz-chiudi {
  flex: none; width: 44px; height: 44px; display: grid; place-items: center; margin: -6px -8px 0 0;
  border: 0; border-radius: 50%; background: transparent; color: var(--fz-ink); cursor: pointer; transition: background-color .2s;
}
.fz-chiudi:hover { background: var(--fz-carta-2); }
.fz-corpo { padding: 4px 24px 24px; }
.fz-velo :focus-visible, .fz-tour :focus-visible, .fz-scheda :focus-visible, .fz-carrello :focus-visible { outline: 2px solid var(--fz-blu); outline-offset: 3px; }
.fz-velo ::selection { background: #ead9bb; color: var(--fz-ink); }

.fz-h3 { margin: 0 0 10px; font: 400 21px/1.15 var(--fz-display); letter-spacing: 0; }
.fz-aiuto { margin: 6px 0 0; color: var(--fz-ink-2); font-size: 13.5px; line-height: 1.45; text-wrap: pretty; }
.fz-errore { margin: 8px 0 0; color: var(--fz-acc-scuro); font-weight: 700; font-size: 14px; }
.fz-avviso { margin: 12px 0; padding: 12px 14px; border-radius: 10px; background: #f6e7d4; color: #4a2a12; font-size: 14.5px; }
.fz-avviso a { color: var(--fz-acc-scuro); font-weight: 700; }
.fz-vuoto { display: flex; gap: 12px; align-items: flex-start; margin: 8px 0; padding: 18px; border-radius: 12px; background: var(--fz-carta-2); color: var(--fz-ink-2); }
.fz-vuoto .fz-ico { color: var(--fz-acc); margin-top: 2px; }

/* ---------- tasti ---------- */
.fz-tasto {
  display: inline-flex; align-items: center; justify-content: center; gap: 8px; min-height: 48px; padding: 0 18px;
  border: 1px solid rgba(29, 25, 21, .28); border-radius: 10px; background: transparent; color: var(--fz-ink);
  font: 700 15.5px/1.15 var(--fz-testo); text-decoration: none; cursor: pointer; text-align: center;
  transition: transform .2s var(--fz-ease), box-shadow .2s var(--fz-ease), background-color .2s, border-color .2s;
}
.fz-tasto:hover { background: #fff; border-color: var(--fz-ink); }
.fz-tasto:active { transform: translateY(1px); }
.fz-tasto:disabled { opacity: .6; cursor: default; transform: none; }
.fz-primario { background: var(--fz-acc); border-color: var(--fz-acc); color: #fff; box-shadow: 0 14px 26px -14px rgba(143, 46, 18, .75), inset 0 1px 0 rgba(255, 255, 255, .14); }
.fz-primario:hover { background: #a8340f; border-color: #a8340f; color: #fff; box-shadow: 0 18px 30px -14px rgba(143, 46, 18, .8); }
.fz-secondario { background: #fff; }
.fz-tasto-piccolo { min-height: 44px; padding: 0 14px; font-size: 14.5px; }
.fz-largo-100 { width: 100%; }
.fz-link { border: 0; padding: 0; background: none; color: var(--fz-acc-scuro); font: inherit; font-weight: 700; text-decoration: underline; text-underline-offset: 3px; cursor: pointer; }
.fz-azioni { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 18px; }
.fz-azioni-griglia { display: grid; grid-template-columns: repeat(auto-fit, minmax(170px, 1fr)); }

/* ---------- campi ---------- */
.fz-campo { display: grid; gap: 6px; font-size: 13.5px; font-weight: 700; color: var(--fz-ink-2); }
.fz-campo input, .fz-campo select {
  min-height: 46px; padding: 0 12px; border: 1px solid rgba(29, 25, 21, .3); border-radius: 10px; background: #fff;
  font: 600 16px var(--fz-testo); color: var(--fz-ink); font-variant-numeric: tabular-nums; width: 100%;
}
.fz-campo [aria-invalid="true"] { border-color: var(--fz-acc); box-shadow: 0 0 0 3px rgba(194, 61, 24, .18); }
.fz-campo-q { max-width: 200px; }
.fz-riga-campi { display: flex; gap: 10px; flex-wrap: wrap; }
.fz-riga-campi > * { flex: 1 1 130px; }
.fz-spunta { display: flex; align-items: center; gap: 10px; min-height: 44px; font-weight: 600; font-size: 15px; cursor: pointer; }
.fz-spunta input { width: 20px; height: 20px; accent-color: var(--fz-acc); flex: none; }
.fz-passo { display: inline-flex; align-items: stretch; border: 1px solid rgba(29, 25, 21, .3); border-radius: 10px; background: #fff; overflow: hidden; }
.fz-passo button { width: 46px; border: 0; background: transparent; font: 700 22px/1 var(--fz-testo); color: var(--fz-ink); cursor: pointer; }
.fz-passo button:hover { background: var(--fz-carta-2); }
.fz-passo input { width: 92px; min-height: 46px; border: 0; border-inline: var(--fz-bordo); border-radius: 0; text-align: center; }
fieldset.fz-gruppo { border: 0; margin: 0; padding: 0; min-width: 0; }
.fz-gruppo { padding-top: 16px; margin-top: 16px; border-top: 1px solid var(--fz-filo) !important; }
.fz-gruppo:first-child { margin-top: 0; padding-top: 0; border-top: 0 !important; }
.fz-gruppo legend { padding: 0; margin-bottom: 8px; font-weight: 800; font-size: 13px; letter-spacing: .06em; text-transform: uppercase; color: var(--fz-ink-2); float: left; width: 100%; }
.fz-gruppo legend + * { clear: both; }
.fz-slider { display: flex; justify-content: space-between; font-size: 14px; font-weight: 600; color: var(--fz-ink); margin-top: 6px; }
.fz-slider output { font-variant-numeric: tabular-nums; color: var(--fz-ink-2); }
.fz-gruppo input[type="range"] { width: 100%; height: 32px; accent-color: var(--fz-acc); margin: 0; }
.fz-scelte { display: flex; flex-wrap: wrap; gap: 8px; }
.fz-chip { position: relative; }
.fz-chip input { position: absolute; opacity: 0; inset: 0; margin: 0; cursor: pointer; }
.fz-chip span { display: inline-flex; align-items: center; min-height: 40px; padding: 0 14px; border-radius: 99px; border: 1px solid rgba(29, 25, 21, .28); background: #fff; font-weight: 700; font-size: 14px; transition: background-color .2s, color .2s, border-color .2s; }
.fz-chip input:checked + span { background: var(--fz-ink); border-color: var(--fz-ink); color: var(--fz-carta); }
.fz-chip input:focus-visible + span { outline: 2px solid var(--fz-blu); outline-offset: 2px; }
.fz-inchiostri { display: flex; flex-wrap: wrap; gap: 8px; }
.fz-inchiostro { position: relative; cursor: pointer; }
.fz-inchiostro input { position: absolute; opacity: 0; inset: 0; margin: 0; cursor: pointer; }
.fz-campione { display: block; width: 40px; height: 40px; border-radius: 50%; background: var(--c); box-shadow: inset 0 0 0 1px rgba(29, 25, 21, .25); position: relative; }
.fz-campione[data-auto] { background: conic-gradient(#1d1915 0 50%, #fff 0 100%); }
.fz-inchiostro input:checked + .fz-campione { box-shadow: inset 0 0 0 1px rgba(29, 25, 21, .25), 0 0 0 2px var(--fz-carta), 0 0 0 4px var(--fz-acc); }
.fz-inchiostro input:focus-visible + .fz-campione { outline: 2px solid var(--fz-blu); outline-offset: 5px; }

/* ---------- righe (preventivo, kit, preferiti) ---------- */
.fz-righe { list-style: none; margin: 0; padding: 0; border-top: 1px solid var(--fz-filo); }
.fz-riga { display: grid; grid-template-columns: 64px 1fr auto; align-items: center; gap: 4px 14px; padding: 12px 0; border-bottom: 1px solid var(--fz-filo); }
.fz-riga:has(.fz-riga-vai) { grid-template-columns: 64px 1fr auto auto; }
.fz-riga-testo { min-width: 0; }
.fz-riga-nome { margin: 0; font-weight: 700; line-height: 1.25; }
.fz-riga-dett { margin: 3px 0 0; color: var(--fz-ink-2); font-size: 13.5px; font-variant-numeric: tabular-nums; }
.fz-riga-nota { margin: 4px 0 0; font-size: 13px; color: #6b3a10; }
.fz-riga-tot { margin: 0; font-weight: 800; font-variant-numeric: tabular-nums; white-space: nowrap; text-align: right; }
.fz-riga-azioni { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 8px; }
.fz-riga-azioni .fz-tasto { min-height: 40px; padding: 0 12px; font-size: 13.5px; }
.fz-riga-vai { width: 44px; height: 44px; display: grid; place-items: center; border: var(--fz-bordo); border-radius: 50%; background: #fff; color: var(--fz-ink); cursor: pointer; }
.fz-riga-vai:hover { border-color: var(--fz-ink); }
.fz-foto { width: 96px; height: 96px; object-fit: contain; display: block; border-radius: 10px; background: #fff; box-shadow: inset 0 0 0 1px var(--fz-filo); }
.fz-foto-s { width: 64px; height: 64px; }
.fz-foto-vuota { background: linear-gradient(135deg, var(--fz-carta-2), #e6dccb); }
.fz-totali { margin: 14px 0 0; display: grid; gap: 6px; }
.fz-totali div { display: flex; justify-content: space-between; gap: 12px; font-variant-numeric: tabular-nums; }
.fz-totali dt { color: var(--fz-ink-2); }
.fz-totali dd { margin: 0; font-weight: 700; }
.fz-totali .fz-totale { margin-top: 6px; padding-top: 10px; border-top: 1px solid var(--fz-ottone); align-items: baseline; }
.fz-totali .fz-totale dt { color: var(--fz-ink); font-weight: 800; }
.fz-totali .fz-totale dd { font: 400 26px/1 var(--fz-display); }
.fz-totali small { font: 600 12.5px var(--fz-testo); color: var(--fz-ink-2); }
.fz-link-box { margin-top: 18px; }
.fz-link-box input { font-size: 14px; font-weight: 500; color: var(--fz-ink-2); }

/* ---------- prova il tuo logo ---------- */
.fz-logo-griglia { display: grid; grid-template-columns: minmax(0, 1.08fr) minmax(0, 1fr); gap: 26px; align-items: start; }
.fz-palco { margin: 0; position: sticky; top: 86px; }
.fz-tela {
  display: block; width: 100%; height: auto; aspect-ratio: 1; border-radius: 12px; background: #fff;
  box-shadow: inset 0 0 0 1px var(--fz-filo), 0 22px 44px -28px rgba(40, 28, 16, .5);
  touch-action: none; cursor: grab;
}
.fz-tela.fz-presa { cursor: grabbing; }
.fz-palco-nota { margin-top: 10px; font-size: 13px; color: var(--fz-ink-2); }
.fz-prodotto-nome { margin: 0 0 14px; font: 400 21px/1.2 var(--fz-display); }
.fz-prodotto-nome span { display: block; margin-top: 4px; font: 600 13px var(--fz-testo); color: var(--fz-ink-2); }
.fz-carica { display: flex; align-items: center; justify-content: center; gap: 10px; min-height: 52px; padding: 0 18px; border-radius: 10px; border: 1.5px dashed rgba(29, 25, 21, .4); background: #fff; font-weight: 800; cursor: pointer; transition: background-color .2s, border-color .2s; }
.fz-carica:hover { border-color: var(--fz-ink); }
.fz-carica.fz-primario { border: 1px solid var(--fz-acc); }
.fz-file { position: absolute; width: 1px; height: 1px; opacity: 0; }
.fz-file:focus-visible + .fz-aiuto, .fz-carica:has(+ .fz-file:focus-visible) { outline: 2px solid var(--fz-blu); outline-offset: 3px; }
.fz-in-carrello { display: grid; gap: 10px; padding: 14px; border-radius: 12px; background: var(--fz-carta-2); }
.fz-logo .fz-azioni { display: grid; gap: 12px; }
.fz-logo .fz-campo-q { max-width: none; }

.fz-logo-scheda { display: grid; grid-template-columns: 88px 1fr; gap: 14px; align-items: center; padding: 14px; border-radius: 12px; background: var(--fz-carta-2); }
.fz-mini { width: 88px; height: 88px; border-radius: 10px; background: #fff; box-shadow: inset 0 0 0 1px var(--fz-filo); display: grid; place-items: center; color: var(--fz-acc); }
.fz-mini .fz-ico { width: 32px; height: 32px; }
.fz-logo-scheda-t { margin: 0; font-weight: 800; }
.fz-logo-scheda .fz-aiuto { margin: 2px 0 10px; }

/* ---------- scheda: cuore, scaglioni, abbinamenti ---------- */
.fz-scheda { display: grid; gap: 14px; margin: 14px 0; }
.fz-scheda > div:empty { display: none; }
.fz-cuore { display: inline-flex; align-items: center; gap: 8px; min-height: 44px; padding: 0 14px 0 10px; border: var(--fz-bordo); border-radius: 99px; background: #fff; font: 700 14.5px var(--fz-testo); color: var(--fz-ink); cursor: pointer; transition: border-color .2s, background-color .2s; }
.fz-cuore:hover { border-color: var(--fz-ink); }
.fz-cuore.on { border-color: var(--fz-acc); color: var(--fz-acc-scuro); }
.fz-cuore.on .fz-ico { fill: var(--fz-acc); stroke: var(--fz-acc); animation: fz-batte .5s var(--fz-ease); }
.fz-scala { list-style: none; margin: 0; padding: 0; display: grid; grid-auto-flow: column; grid-auto-columns: minmax(0, 1fr); border: var(--fz-bordo); border-radius: 12px; overflow: hidden; background: #fff; }
.fz-scala li { display: grid; gap: 1px; padding: 10px 8px; text-align: center; border-left: 1px solid var(--fz-filo); font-variant-numeric: tabular-nums; transition: background-color .25s; }
.fz-scala li:first-child { border-left: 0; }
.fz-scala-q { font-size: 12.5px; font-weight: 700; color: var(--fz-ink-2); }
.fz-scala-p { font-weight: 800; font-size: 15px; }
.fz-scala-s { font-size: 12px; font-weight: 700; color: var(--fz-verde); }
.fz-scala li:first-child .fz-scala-s { color: var(--fz-ink-2); font-weight: 600; }
.fz-scala li.ora { background: var(--fz-ink); color: var(--fz-carta); }
.fz-scala li.ora .fz-scala-q, .fz-scala li.ora .fz-scala-s { color: #e9dcc4; }
.fz-inc-ora { margin: 10px 0 0; font-size: 14.5px; }
.fz-inc-spinta { margin: 8px 0 0; padding: 10px 12px; border-radius: 10px; background: #f6e7d4; color: #3f2512; font-size: 14px; }
.fz-inc-spinta .fz-link { margin-left: 4px; }
.fz-abb-lista { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; }
.fz-abb-2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.fz-abb { display: grid; gap: 8px; align-content: space-between; }
.fz-abb-vedi { display: grid; gap: 4px; justify-items: start; padding: 0; border: 0; background: none; text-align: left; font: inherit; color: inherit; cursor: pointer; }
.fz-abb-vedi .fz-foto { width: 100%; height: auto; aspect-ratio: 1; }
.fz-abb-vedi:hover .fz-abb-n { text-decoration: underline; text-underline-offset: 3px; }
.fz-abb-n { font-weight: 700; font-size: 14px; line-height: 1.25; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.fz-abb-p { font-weight: 800; font-variant-numeric: tabular-nums; font-size: 14px; }
.fz-abb-p small { font-weight: 600; color: var(--fz-ink-2); }
.fz-abb .fz-tasto { min-height: 40px; padding: 0 8px; font-size: 13px; width: 100%; }
.fz-carrello { display: grid; gap: 14px; margin: 14px 0; }
.fz-carrello > div:empty, .fz-carrello > div[hidden] { display: none; }

/* ---------- kit ---------- */
.fz-kit-scelte { display: flex; gap: 8px; overflow-x: auto; padding: 2px 2px 10px; margin: 0 -2px 6px; scroll-snap-type: x proximity; scrollbar-width: thin; }
.fz-kit-chip { flex: none; scroll-snap-align: start; display: grid; gap: 2px; text-align: left; min-height: 56px; padding: 8px 16px; border-radius: 12px; border: var(--fz-bordo); background: #fff; font: 800 15px/1.2 var(--fz-testo); color: var(--fz-ink); cursor: pointer; transition: background-color .2s, border-color .2s, color .2s; }
.fz-kit-chip small { font-weight: 600; font-size: 12.5px; color: var(--fz-ink-2); }
.fz-kit-chip[aria-checked="true"] { background: var(--fz-ink); color: var(--fz-carta); border-color: var(--fz-ink); }
.fz-kit-chip[aria-checked="true"] small { color: #e2d6c2; }
.fz-kit-testa { display: grid; grid-template-columns: 1fr auto; gap: 18px; align-items: end; margin: 8px 0 14px; }
.fz-kit-desc p { margin: 0; color: var(--fz-ink-2); max-width: 52ch; }
.fz-kit-controlli { display: grid; gap: 6px; justify-items: start; }
.fz-kit-conto { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: baseline; gap: 6px 18px; margin-top: 14px; padding-top: 12px; border-top: 1px solid var(--fz-ottone); }
.fz-kit-conto p { margin: 0; font-variant-numeric: tabular-nums; }
.fz-kit-cifra { font: 400 34px/1 var(--fz-display); }
.fz-kit-conto small { color: var(--fz-ink-2); font-weight: 600; }
.fz-kit-mini { margin: 6px 0 10px; }

/* ---------- ti aiuto a scegliere ---------- */
.fz-passi { display: flex; gap: 6px; margin: 0 0 16px; }
.fz-passi span { height: 4px; flex: 1; border-radius: 2px; background: var(--fz-filo); transition: background-color .3s; }
.fz-passi .fatto { background: var(--fz-ottone); }
.fz-passi .ora { background: var(--fz-acc); }
.fz-domanda { margin: 0 0 4px; font: 400 clamp(24px, 3vw, 30px)/1.1 var(--fz-display); outline: none; }
.fz-risposte { display: grid; grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); gap: 10px; margin-top: 16px; }
.fz-risposta { display: grid; gap: 3px; text-align: left; min-height: 72px; padding: 14px 16px; border-radius: 12px; border: var(--fz-bordo); background: #fff; font: 800 16.5px/1.2 var(--fz-testo); color: var(--fz-ink); cursor: pointer; transition: transform .2s var(--fz-ease), border-color .2s, box-shadow .2s; }
.fz-risposta small { font-weight: 600; font-size: 13.5px; color: var(--fz-ink-2); }
.fz-risposta:hover { border-color: var(--fz-ink); transform: translateY(-1px); box-shadow: 0 12px 24px -18px rgba(40, 28, 16, .6); }
.fz-risposta.scelta { border-color: var(--fz-acc); box-shadow: inset 0 0 0 1px var(--fz-acc); }
.fz-indietro { margin-top: 16px; border-color: transparent; padding-left: 6px; }
.fz-consiglio-kit { margin: 16px 0; padding: 16px 18px; border-radius: 12px; background: var(--fz-carta-2); }
.fz-consiglio-kit p { margin: 0; }
.fz-griglia-prodotti { list-style: none; margin: 16px 0 0; padding: 0; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 18px 14px; }
.fz-prodotto { display: grid; gap: 6px; align-content: start; }
.fz-prodotto .fz-foto { width: 100%; height: auto; aspect-ratio: 1; }
.fz-prodotto-n { margin: 2px 0 0; font-weight: 700; font-size: 14.5px; line-height: 1.25; }
.fz-prodotto-p { margin: 0; font-size: 13.5px; color: var(--fz-ink-2); font-variant-numeric: tabular-nums; }
.fz-prodotto-p strong { color: var(--fz-ink); font-size: 15px; }
.fz-prodotto-azioni { display: grid; gap: 6px; margin-top: 4px; }
.fz-prodotto-azioni .fz-tasto { min-height: 42px; font-size: 13.5px; padding: 0 10px; }

/* ---------- giro guidato ---------- */
.fz-tour {
  position: fixed; z-index: 25; left: 50%; bottom: calc(max(16px, env(safe-area-inset-bottom)) + 18px); transform: translateX(-50%);
  width: min(440px, calc(100vw - 32px)); padding: 18px 20px 16px; border-radius: var(--fz-raggio);
  background: var(--fz-carta); color: var(--fz-ink); font: 500 15.5px/1.45 var(--fz-testo);
  box-shadow: 0 30px 60px -24px rgba(29, 25, 21, .6), 0 2px 8px rgba(29, 25, 21, .1);
  border-top: 2px solid var(--fz-ottone);
}
.fz-tour[hidden] { display: none; }
.fz-tour.fz-entra { animation: fz-sale .5s var(--fz-ease); }
.fz-tour-passo { align-self: center; margin-right: 4px; font-size: 13px; font-weight: 700; color: var(--fz-ink-2); font-variant-numeric: tabular-nums; white-space: nowrap; }
.fz-tour-t { margin: 0; font: 400 24px/1.1 var(--fz-display); outline: none; text-wrap: balance; }
.fz-tour-d { margin: 8px 0 14px; color: var(--fz-ink-2); text-wrap: pretty; }
.fz-tour-azioni { display: flex; justify-content: space-between; align-items: center; gap: 10px; }
.fz-tour-dx { display: flex; align-items: center; gap: 8px; }
.fz-tour [data-salta], .fz-tour [data-no] { border-color: transparent; padding: 0 8px; color: var(--fz-ink-2); }
.fz-tour [data-prima] { width: 44px; padding: 0; }

/* ---------- animazioni ---------- */
@keyframes fz-velo { from { opacity: 0; } }
@keyframes fz-sale { from { opacity: 0; transform: translateY(18px); } }
.fz-tour.fz-entra { animation-name: fz-sale-tour; }
@keyframes fz-sale-tour { from { opacity: 0; transform: translate(-50%, 18px); } }
@keyframes fz-batte { 40% { transform: scale(1.25); } }
@media (prefers-reduced-motion: reduce) {
  .fz-velo, .fz-foglio, .fz-tour, .fz-tour.fz-entra, .fz-cuore.on .fz-ico { animation: none !important; }
  .fz-tasto, .fz-risposta, .fz-scala li { transition: none; }
}

/* ---------- telefono ---------- */
@media (max-width: 720px) {
  .fz-velo { place-items: end stretch; padding: max(10px, env(safe-area-inset-top)) 0 0; }
  .fz-foglio, .fz-foglio.fz-largo { width: 100%; max-height: 92dvh; border-radius: 18px 18px 0 0; padding-bottom: env(safe-area-inset-bottom); }
  .fz-testa { padding: 18px 16px 12px; }
  .fz-corpo { padding: 4px 16px 20px; }
  .fz-logo-griglia { grid-template-columns: 1fr; gap: 16px; }
  .fz-palco { position: static; }
  .fz-tela { max-width: 420px; margin: 0 auto; }
  .fz-kit-testa { grid-template-columns: 1fr; align-items: start; }
  .fz-griglia-prodotti { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .fz-abb-lista { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; }
  .fz-riga, .fz-riga:has(.fz-riga-vai) { grid-template-columns: 56px 1fr auto; align-items: start; }
  .fz-riga .fz-foto-s { width: 56px; height: 56px; }
  .fz-riga-vai { grid-column: 3; grid-row: 1; width: 44px; height: 44px; }
  .fz-riga-tot, .fz-riga:has(.fz-riga-vai) .fz-riga-tot { grid-column: 2 / 4; text-align: left; }
  .fz-scala li { padding: 8px 4px; }
  .fz-scala-p { font-size: 14px; }
  .fz-tour { bottom: calc(max(16px, env(safe-area-inset-bottom)) + 150px); }
}
@media (max-width: 400px) { .fz-abb-lista { grid-template-columns: repeat(2, minmax(0, 1fr)); } }

/* ---------- pagina di stampa del preventivo (Salva in PDF) ---------- */
#fz-stampa { display: none; }
@media print {
  html.fz-in-stampa, html.fz-in-stampa body { height: auto !important; overflow: visible !important; background: #fff !important; }
  html.fz-in-stampa body > *:not(#fz-stampa) { display: none !important; }
  html.fz-in-stampa #fz-stampa { display: block !important; color: #000; font: 11pt/1.4 var(--fz-testo); }
  @page { size: A4; margin: 16mm 14mm; }
  .fzp-testa { display: flex; justify-content: space-between; align-items: baseline; padding-bottom: 8pt; border-bottom: 1.5pt solid #b08a52; margin-bottom: 14pt; }
  .fzp-marchio { margin: 0; font: 400 24pt/1 var(--fz-display); }
  .fzp-data { margin: 0; font-weight: 700; }
  .fzp-tab { width: 100%; border-collapse: collapse; font-size: 9.5pt; }
  .fzp-tab th { text-align: left; font-size: 8.5pt; text-transform: uppercase; letter-spacing: .04em; border-bottom: 1pt solid #000; padding: 4pt; }
  .fzp-tab td { padding: 5pt 4pt; border-bottom: .5pt solid #ccc; vertical-align: top; font-variant-numeric: tabular-nums; }
  .fzp-tab tr { break-inside: avoid; }
  .fzp-tab small { color: #444; }
  .fzp-tot { margin: 12pt 0 0 auto; border-collapse: collapse; min-width: 45%; }
  .fzp-tot th { text-align: left; padding: 3pt 12pt 3pt 0; font-weight: 600; }
  .fzp-tot td { text-align: right; padding: 3pt 0; font-variant-numeric: tabular-nums; }
  .fzp-grande th, .fzp-grande td { font-size: 13pt; font-weight: 800; border-top: 1pt solid #000; padding-top: 6pt; }
  .fzp-nota { margin: 12pt 0 0; font-size: 9.5pt; word-break: break-all; }
  .fzp-piede { margin-top: 18pt; padding-top: 6pt; border-top: .5pt solid #999; font-size: 9pt; color: #333; }
}