/* Base comune ai prodotti della Strada A: morbida, leggibile, tocchi grandi per tablet. */
:root {
  --accento: #3f7d5a; --accento-chiaro: #e6f1ea; --testo: #24302a; --tenue: #66736b;
  --fondo: #f7f5f0; --carta: #ffffff; --bordo: #e2ded5; --rosso: #c0392b; --rosso-chiaro: #fbe9e7;
  --giallo: #b7791f; --giallo-chiaro: #fdf3dc; --raggio: 14px; --ombra: 0 1px 2px rgba(0,0,0,.05), 0 4px 16px rgba(0,0,0,.05);
}
* { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; }
body { margin: 0; font: 16px/1.5 -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif; color: var(--testo); background: var(--fondo); }
h1, h2, h3 { line-height: 1.2; margin: 0 0 .5em; }
a { color: var(--accento); }
button, .bottone { font: inherit; cursor: pointer; border: 1px solid var(--bordo); background: var(--carta); color: var(--testo);
  border-radius: 999px; padding: .55em 1.1em; display: inline-flex; align-items: center; gap: .4em; text-decoration: none; transition: background .15s, border-color .15s; }
button:hover, .bottone:hover { border-color: var(--accento); }
button.primario, .bottone.primario { background: var(--accento); border-color: var(--accento); color: #fff; }
button.primario:hover, .bottone.primario:hover { filter: brightness(1.08); }
button.piccolo { padding: .3em .75em; font-size: .9em; }
button.icona { padding: .35em .6em; border-radius: 10px; }
button:disabled { opacity: .45; cursor: default; }
input, textarea, select { font: inherit; color: inherit; background: var(--carta); border: 1px solid var(--bordo); border-radius: 10px; padding: .5em .7em; width: 100%; }
input:focus, textarea:focus, select:focus { outline: 2px solid var(--accento-chiaro); border-color: var(--accento); }
label { display: block; font-size: .9em; color: var(--tenue); margin-bottom: .25em; }
.scheda { background: var(--carta); border: 1px solid var(--bordo); border-radius: var(--raggio); box-shadow: var(--ombra); padding: 1.2em; }
.tenue { color: var(--tenue); }
.riga { display: flex; gap: .6em; align-items: center; flex-wrap: wrap; }
.spinta { flex: 1; }
.avviso { background: var(--giallo-chiaro); color: #6b4a10; border-radius: 10px; padding: .6em .9em; font-size: .95em; }
.errore { background: var(--rosso-chiaro); color: var(--rosso); border-radius: 10px; padding: .6em .9em; }
.pillola { display: inline-block; font-size: .78em; padding: .15em .6em; border-radius: 999px; background: var(--accento-chiaro); color: var(--accento); font-weight: 600; }
.nascosto { display: none !important; }
.toast { position: fixed; left: 50%; bottom: 24px; transform: translateX(-50%); background: #24302a; color: #fff; padding: .7em 1.2em; border-radius: 999px; box-shadow: var(--ombra); z-index: 99; font-size: .95em; }

/* Landing */
.landing header.eroe { padding: 4em 1.2em 3em; text-align: center; max-width: 820px; margin: 0 auto; }
.landing .eroe h1 { font-size: clamp(2em, 5vw, 3em); letter-spacing: -.02em; }
.landing .eroe p.sotto { font-size: 1.2em; color: var(--tenue); max-width: 620px; margin: 0 auto 1.5em; }
.landing section { max-width: 980px; margin: 0 auto; padding: 2em 1.2em; }
.landing .griglia { display: grid; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); gap: 1em; }
.landing .griglia .scheda h3 { font-size: 1.1em; }
.landing .prezzo { text-align: center; }
.landing .prezzo .cifra { font-size: 3em; font-weight: 800; color: var(--accento); }
.landing table.confronto { width: 100%; border-collapse: collapse; background: var(--carta); border-radius: var(--raggio); overflow: hidden; }
.landing table.confronto th, .landing table.confronto td { padding: .7em .9em; border-bottom: 1px solid var(--bordo); text-align: left; }
.landing footer { text-align: center; color: var(--tenue); font-size: .85em; padding: 3em 1em; }
.landing .domande details { background: var(--carta); border: 1px solid var(--bordo); border-radius: 12px; padding: .8em 1em; margin-bottom: .6em; }
.landing .domande summary { cursor: pointer; font-weight: 600; }