/* /prezzi-siti-web/ — solo quello che i componenti comuni non hanno: «quando conviene», regole delle modifiche, voci extra */
.ps-quando{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:clamp(20px,3vw,40px);margin-top:clamp(28px,4vw,44px)}
.ps-quando>div{display:grid;gap:10px;align-content:start;padding-top:16px;border-top:2px solid var(--grafite)}
.ps-quando h3{font-family:var(--f-tit);font-size:1.25rem;line-height:1.2;margin:0}
.ps-quando ul{margin:0;padding-left:1.15em;display:grid;gap:6px;color:var(--ferro)}

.ps-regole{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px}
.ps-col{background:var(--bianco);border:1px solid var(--linea);border-radius:var(--r);padding:clamp(20px,3vw,28px);display:grid;gap:12px;align-content:start;min-width:0}
.ps-col h3{font-family:var(--f-tit);font-size:1.25rem;line-height:1.2;margin:0}
.ps-col--si h3{color:var(--rosso-scuro)}
.ps-col ul{margin:0;padding-left:1.15em;display:grid;gap:6px}

.ps-extra{list-style:none;margin:clamp(24px,3vw,36px) 0 0;padding:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px}
.ps-extra li{display:grid;gap:4px;align-content:start;padding-top:14px;border-top:1px solid var(--linea);min-width:0}
.ps-extra span{font-family:var(--f-mono);font-size:.8rem;letter-spacing:.06em;text-transform:uppercase;color:var(--ferro)}
.ps-extra b{font-family:var(--f-tit);font-size:1.3rem;line-height:1.2}
.ps-extra small{font-size:.95rem;color:var(--ferro)}

@media (max-width:640px){.ps-quando,.ps-regole,.ps-extra{grid-template-columns:minmax(0,1fr)}}

/* elenchi col pallino (base.css li azzera) e il punto delle migliaia stretto nei prezzi grandi (tabular-nums lo allarga) */
.ps-quando ul,.ps-col ul{list-style:disc}
.ps-quando li::marker,.ps-col li::marker{color:var(--rosso)}
.pn-prezzo b{font-variant-numeric:proportional-nums}

/* i tre livelli: stessa scheda dei piani (componenti.css .piano), con dentro i due modi di pagare */
.ps-livelli{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(16px,2vw,24px);align-items:stretch;margin:0;padding:0}
.ps-liv{position:relative;display:flex;flex-direction:column;gap:14px;background:var(--bianco);border-radius:var(--r);padding:clamp(24px,2.6vw,34px);box-shadow:0 0 0 1px var(--linea) inset;min-width:0}
.ps-liv--top{box-shadow:0 0 0 2px var(--rosso) inset}
.ps-liv h3{font-family:var(--f-tit);font-size:26px;line-height:1.15;margin:0}
.ps-liv-per{color:var(--ferro);margin:0}
.ps-modi{display:grid;gap:0;margin:0;border-top:1px solid var(--linea)}
.ps-modi>div{display:grid;grid-template-columns:5.5rem minmax(0,1fr);gap:10px;align-items:baseline;padding-block:12px;border-bottom:1px solid var(--linea)}
.ps-modi dt{font:500 12px/1.3 var(--f-mono);letter-spacing:.06em;text-transform:uppercase;color:var(--rosso-scuro)}
.ps-modi dd{margin:0;display:grid;gap:2px}
.ps-modi dd b{font:800 clamp(26px,2.4vw,32px)/1.05 var(--f-tit);letter-spacing:-.02em;font-variant-numeric:proportional-nums}
.ps-modi dd small{font-size:14px;color:var(--ferro);line-height:1.35}
.ps-liv .btn{margin-top:auto}
.ps-quando p{margin:0}
@media (max-width:1023px){.ps-livelli{grid-template-columns:minmax(0,1fr);max-width:560px}}
/* tabella dei criteri: è testo, non prezzi (componenti.css mette l'ultima colonna in mono e in grassetto) */
#come-scegliere .tabella td{font-family:var(--f-txt);font-weight:400;letter-spacing:0}
#come-scegliere .tabella td:last-child{font-weight:600;white-space:normal;font-variant-numeric:normal}

/* durata e disdetta del noleggio (05/10/2026) */
.ps-durata{margin-top:clamp(28px,4vw,44px);background:var(--bianco);border-radius:var(--r);box-shadow:0 0 0 2px var(--grafite) inset;padding:clamp(22px,3vw,32px);display:grid;gap:14px}
.ps-durata h3{font-family:var(--f-tit);font-size:1.35rem;line-height:1.2;margin:0}
.ps-durata dl{margin:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}
.ps-durata dl>div{display:grid;gap:4px;align-content:start;padding-top:10px;border-top:1px solid var(--linea)}
.ps-durata dt{font:500 12px/1.3 var(--f-mono);letter-spacing:.06em;text-transform:uppercase;color:var(--rosso-scuro)}
.ps-durata dd{margin:0}
.ps-durata p{margin:0;color:var(--ferro);max-width:60em}
@media (max-width:760px){.ps-durata dl{grid-template-columns:minmax(0,1fr)}}

/* mantenimento scritto chiaro (05/10/2026) */
.ps-modi dd small .ps-mant{font:700 14px/1.3 var(--f-txt);letter-spacing:0;color:var(--grafite)}
#mantenimento .tabella td{white-space:normal;font-family:var(--f-txt);font-weight:400;font-variant-numeric:normal}
#mantenimento .tabella td small{color:var(--ferro);font-size:14px}
