:root{
  --carta:#EDF0F3; --foglio:#FFFFFF; --inchiostro:#13213A; --muto:#5A6577; --riga:#D5DBE3;
  --timbro:#2F4BD8; --ok:#1E7F4E; --attenzione:#B86E00; --rischio:#B3261E;
  --display:"Bricolage Grotesque",ui-sans-serif,system-ui,sans-serif;
  --testo:"IBM Plex Sans",ui-sans-serif,system-ui,sans-serif;
  --cifre:"IBM Plex Mono",ui-monospace,Menlo,monospace;
}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]){
  --carta:#0E1420;--foglio:#162033;--inchiostro:#E7ECF4;--muto:#97A3B6;--riga:#26324A;
  --timbro:#7E93FF;--ok:#4CC38A;--attenzione:#E9A23B;--rischio:#F2766C;color-scheme:dark}}
:root[data-theme="dark"]{
  --carta:#0E1420;--foglio:#162033;--inchiostro:#E7ECF4;--muto:#97A3B6;--riga:#26324A;
  --timbro:#7E93FF;--ok:#4CC38A;--attenzione:#E9A23B;--rischio:#F2766C;color-scheme:dark}
body{background:var(--carta);color:var(--inchiostro);font:16px/1.55 var(--testo)}
.wrap{max-width:680px;margin:0 auto;padding-block:40px 64px;
  padding-left:max(16px,env(safe-area-inset-left,0px));padding-right:max(16px,env(safe-area-inset-right,0px));
  display:flex;flex-direction:column;gap:56px}
.eyebrow{font:500 12px/1 var(--cifre);letter-spacing:.12em;text-transform:uppercase;color:var(--muto)}
h1,h2{font-family:var(--display);text-wrap:balance;margin:0}
h1{font-size:clamp(38px,9vw,64px);line-height:.98;font-weight:800;letter-spacing:-.02em}
h2{font-size:clamp(24px,5vw,32px);font-weight:800;letter-spacing:-.01em}
p{margin:0;max-width:60ch}
.lead{font-size:18px;color:var(--muto)}
header{display:flex;flex-direction:column;gap:18px}
.marchio{display:flex;align-items:center;gap:10px;font:800 18px var(--display)}
.marchio svg{flex:none}
.cta{display:inline-flex;align-items:center;gap:10px;align-self:flex-start;background:var(--timbro);color:#fff;
  font:600 17px var(--testo);padding:14px 22px;border-radius:999px;text-decoration:none}
.cta:focus-visible{outline:3px solid var(--inchiostro);outline-offset:3px}
.nota{font-size:13px;color:var(--muto)}

/* la scheda campione: il pezzo forte */
.scheda{background:var(--foglio);border:1px solid var(--riga);border-radius:6px;overflow:hidden}
.scheda-testa{display:flex;justify-content:space-between;gap:12px;flex-wrap:wrap;padding:14px 18px;border-bottom:1px dashed var(--riga);
  font:500 12px var(--cifre);color:var(--muto);letter-spacing:.04em}
.scheda-corpo{padding:20px 18px;display:flex;flex-direction:column;gap:20px}
.confronto{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.cifra{display:flex;flex-direction:column;gap:2px;min-width:0}
.cifra .k{font-size:13px;color:var(--muto)}
.cifra .v{font:500 clamp(24px,6vw,34px)/1.1 var(--cifre);font-variant-numeric:tabular-nums}
.barrato{text-decoration:line-through;text-decoration-color:var(--rischio);text-decoration-thickness:2px;color:var(--muto)}
.rischi{list-style:none;margin:0;padding:0;display:flex;flex-direction:column}
.rischi li{display:grid;grid-template-columns:auto 1fr auto;gap:10px;align-items:baseline;padding:9px 0;border-top:1px solid var(--riga)}
.rischi li:first-child{border-top:0}
.liv{font:500 11px var(--cifre);text-transform:uppercase;letter-spacing:.08em;padding:2px 7px;border-radius:3px;color:var(--foglio)}
.alto{background:var(--rischio)}.medio{background:var(--attenzione)}
.euro{font:500 14px var(--cifre);color:var(--muto);font-variant-numeric:tabular-nums}
.verdetto{display:flex;justify-content:space-between;align-items:center;gap:12px;flex-wrap:wrap;
  border:2px solid var(--attenzione);border-radius:6px;padding:14px 16px}
.verdetto strong{font:800 22px var(--display);color:var(--attenzione)}
.verdetto .v{font:500 22px var(--cifre)}
.timbro{font:500 11px var(--cifre);letter-spacing:.1em;text-transform:uppercase;color:var(--timbro);
  border:1.5px solid var(--timbro);border-radius:4px;padding:3px 8px;transform:rotate(-3deg);display:inline-block}

.passi{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:18px;counter-reset:p}
.passi li{display:grid;grid-template-columns:40px 1fr;gap:14px;counter-increment:p}
.passi li::before{content:counter(p);font:800 28px/1 var(--display);color:var(--timbro)}
.passi b{display:block;font-weight:600}
.passi span{color:var(--muto)}

.piani{display:grid;grid-template-columns:repeat(auto-fit,minmax(190px,1fr));gap:12px}
.piano{background:var(--foglio);border:1px solid var(--riga);border-radius:6px;padding:18px;display:flex;flex-direction:column;gap:8px;min-width:0}
.piano.top{border:2px solid var(--timbro)}
.conto{width:100%;border-collapse:collapse;font-size:14px}
.conto td{padding:7px 0;border-top:1px solid var(--riga);vertical-align:top}
.conto td:last-child{text-align:right;white-space:nowrap;padding-left:12px;font:500 14px var(--cifre);font-variant-numeric:tabular-nums}
.conto tr.tot td{font-weight:600;border-top:1.5px solid var(--inchiostro)}
.fondatori{background:color-mix(in srgb,var(--timbro) 8%,var(--foglio))}
.piano .nome{font:500 12px var(--cifre);letter-spacing:.1em;text-transform:uppercase;color:var(--muto)}
.piano .prezzo{font:800 34px/1 var(--display)}
.piano .prezzo small{font:400 14px var(--testo);color:var(--muto)}
.piano ul{margin:4px 0 0;padding-left:18px;color:var(--muto);font-size:14px;display:flex;flex-direction:column;gap:4px}
section{display:flex;flex-direction:column;gap:18px}
footer{font-size:13px;color:var(--muto);border-top:1px solid var(--riga);padding-top:18px;display:flex;flex-direction:column;gap:8px}
@media (prefers-reduced-motion:no-preference){.cta{transition:transform .15s}.cta:hover{transform:translateY(-2px)}}

/* --- sito: modulo di caricamento e risultati --- */
a{color:var(--timbro)}
.carica{background:var(--foglio);border:1px solid var(--riga);border-radius:6px;padding:20px 18px;display:flex;flex-direction:column;gap:16px}
.zona-file{display:flex;flex-direction:column;align-items:center;gap:8px;text-align:center;padding:28px 16px;
  border:2px dashed var(--riga);border-radius:6px;cursor:pointer;color:var(--muto)}
.zona-file.pronto{border-color:var(--timbro);color:var(--inchiostro)}
.zona-file b{color:var(--inchiostro)}
.zona-file input{position:absolute;width:1px;height:1px;opacity:0}
.zona-file:focus-within{outline:3px solid var(--timbro);outline-offset:2px}
.opzioni{display:flex;flex-wrap:wrap;gap:12px 24px;align-items:center;font-size:15px}
.opzioni label{display:flex;align-items:center;gap:8px}
select,input[type=email]{font:inherit;color:var(--inchiostro);background:var(--carta);border:1px solid var(--riga);border-radius:6px;padding:8px 10px}
input[type=email]{width:100%}
button.cta{border:0;cursor:pointer}
button.cta[disabled]{opacity:.6;cursor:progress}
.avviso{border-left:4px solid var(--rischio);background:var(--foglio);padding:12px 14px;border-radius:4px}
.ok-box{border-left:4px solid var(--ok);background:var(--foglio);padding:12px 14px;border-radius:4px}
.punteggio{display:flex;align-items:center;gap:16px}
.punteggio .n{font:800 52px/1 var(--display)}
.verde{color:var(--ok)}.giallo{color:var(--attenzione)}.rosso{color:var(--rischio)}
.verdetto.verde{border-color:var(--ok)}.verdetto.rosso{border-color:var(--rischio)}
.verdetto.verde strong{color:var(--ok)}.verdetto.rosso strong{color:var(--rischio)}
.basso{background:var(--muto)}
.legale{font-size:14px;color:var(--muto);display:flex;flex-direction:column;gap:10px}
.legale h2{font-size:20px;color:var(--inchiostro)}
input,select,button{box-sizing:border-box;max-width:100%}
.verdetto.giallo,.verdetto.verde,.verdetto.rosso{color:var(--inchiostro)}
.verdetto.giallo strong{color:var(--attenzione)}
