/* ══════════════════════════════════════════════════════════════════════
   VESTITO COMUNE DEGLI STRUMENTI — 16 agosto 2026

   Gli strumenti sono stati scritti prima del sito e si vedeva: ognuno aveva
   la sua idea di verde, di rosso e di grigio (tre valori diversi per
   «--good», tre per «--bad», tre per «--muted», e in un file i rossi e i
   verdi predefiniti di Tailwind), una barra tutta sua da 52px senza ricerca
   né menu sul telefono, nessuna testata e nessun piede.

   Questo file porta le tre cose che devono essere identiche ovunque:
     1. i colori         → :root, un valore per ogni nome
     2. la testata       → .toolhead
     3. il piede         → .toolfoot

   Le pagine lo agganciano con <link rel="stylesheet" href="stile-strumenti.css">
   e cancellano il proprio :root. Dentro il Laboratorio (iframe) testata e
   piede spariscono da soli: lì la cornice ce l'ha già la pagina ospite.
   ══════════════════════════════════════════════════════════════════════ */

:root{
  /* Identità */
  --navy:#0D2955;
  --navy-mid:#1A3A5C;
  --navy-deep:#070F1E;
  --teal:#008F85;
  --teal2:#006E66;
  --teal-light:#D4EDE9;
  --light-teal:#D4EDE9;      /* alias storico, usato da f01/f02/f04 */
  --gold:#C9A84C;
  --gold-light:#E8C96B;
  --gold2:#8F7526;           /* oro leggibile su fondo chiaro */

  /* Testo e superfici */
  --white:#FFFFFF;
  --card:#FFFFFF;
  --bg:#F7F9FC;
  --border:#E2EAF0;
  --muted:#5A6A7E;
  --dim:#8A9BB0;

  /* Esiti: un solo verde, un solo rosso, un solo giallo */
  --good:#12796F;
  --bad:#C0492F;
  --warn:#B07A1E;

  /* Serie dei grafici: prima erano azzurri, viola e arancioni di un'altra
     tavolozza. Questi nascono dai colori del sito. */
  --c-1:#0D2955;
  --c-2:#008F85;
  --c-3:#C9A84C;
  --c-4:#5A7FA8;
  --c-5:#3FB5AC;
  --c-6:#8F7526;
  --c-7:#8A9BB0;
  --c-8:#C0492F;
}

/* ── Nomi ereditati dagli strumenti scritti prima di questo file ──────────
   f03 aveva una scala di grigi tutta sua e due raggi propri; pensione,
   mutuo-affitto e f09 una serie di colori per i grafici. Il 16 agosto il
   :root di ogni pagina e' stato cancellato in favore di questo, ma questi
   nomi non erano ancora stati ricondotti: una var() senza valore rende la
   proprieta' non valida, e la proprieta' sparisce. Il risultato si vedeva:
   in f03 le tre schede avevano perso bordo, sfondo e angoli tondi, e il
   pulsante «Inizia l'analisi» era un rettangolo ad angolo vivo; in pensione
   i quattro riquadri, che dovevano essere di quattro colori diversi, erano
   tutti dello stesso blu. Qui ogni nome vecchio torna a un colore condiviso.
   ────────────────────────────────────────────────────────────────────── */
:root{
  /* Raggi: la stessa scala del sito, 12 px per le schede, 10 per il resto */
  --radius:12px;
  --radius-sm:10px;
  --shadow:0 2px 10px rgba(13,41,85,.06);

  /* La scala di grigi di f03 */
  --gray-50:#F7F9FC;         /* = --bg     */
  --gray-100:#EEF2F6;
  --gray-200:#E2EAF0;        /* = --border */
  --gray-400:#8A9BB0;        /* = --dim    */
  --gray-600:#5A6A7E;        /* = --muted  */
  --gray-800:#0D2955;        /* = --navy, il colore del testo nel sito */
  --navy-light:#5A7FA8;      /* = --c-4    */
  --danger:#C0492F;          /* = --bad    */

  /* Testo e verde chiaro con i nomi corti usati da f09 e pensione */
  --txt:#3D4E62;
  --teal-l:#D4EDE9;          /* = --teal-light */

  /* Le serie dei grafici previdenziali e di mutuo-affitto */
  --c-pub:#5A7FA8;           /* pensione pubblica   */
  --c-priv:#008F85;          /* integrazione privata */
  --c-fp:#C9A84C;            /* fondo pensione       */
  --c-target:#C0492F;        /* gap da colmare       */
  --c-mutuo:#0D2955;
  --c-affitto-inv:#008F85;
}

/* ── Testata di pagina ────────────────────────────────────────────────
   Prima si entrava dritti dentro il modulo, senza sapere che cosa fosse
   quella pagina. Stessa grammatica delle pagine del sito: occhiello,
   titolo, riga di spiegazione. */
.toolhead{background:linear-gradient(160deg,#05101f 0%,#0D2955 55%,#0d3460 100%);color:#fff;padding:38px 24px 34px;position:relative;overflow:hidden}
.toolhead-in{max-width:860px;margin:0 auto;position:relative;z-index:1}
.toolhead-k{display:inline-flex;align-items:center;gap:9px;font-size:10px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--gold-light);margin-bottom:12px}
.toolhead-k b{background:rgba(201,168,76,.16);border:1px solid rgba(201,168,76,.34);border-radius:5px;padding:3px 8px;font-weight:700;letter-spacing:.08em}
.toolhead h1{font-family:'Playfair Display',Georgia,serif;font-size:clamp(25px,3.2vw,36px);font-weight:800;line-height:1.15;letter-spacing:-.01em;margin:0 0 12px}
.toolhead h1 em{font-style:italic;color:var(--gold-light)}
.toolhead p{font-size:15px;color:rgba(255,255,255,.7);line-height:1.7;font-weight:300;margin:0;max-width:640px}
.toolhead-meta{display:flex;flex-wrap:wrap;gap:8px 20px;margin-top:18px;font-size:12.5px;color:rgba(255,255,255,.55)}
.toolhead-meta span{display:inline-flex;align-items:center;gap:7px}
.toolhead-meta b{color:var(--gold-light);font-weight:600}
@media(max-width:640px){.toolhead{padding:28px 18px 26px}.toolhead p{font-size:14.5px}}

/* ── Piede ────────────────────────────────────────────────────────────
   Nessuno strumento aveva una via d'uscita: si finiva la pagina e sotto
   c'era solo il blocco legale. */
.toolfoot{background:var(--navy-deep);padding:30px 24px 26px;font-family:'DM Sans',system-ui,-apple-system,sans-serif}
.toolfoot-in{max-width:860px;margin:0 auto;display:flex;gap:22px;align-items:center;justify-content:space-between;flex-wrap:wrap}
.toolfoot-brand{font-family:'Playfair Display',Georgia,serif;font-size:16px;font-weight:700;color:#fff}
.toolfoot-brand span{color:var(--gold)}
.toolfoot-brand small{display:block;font-family:'DM Sans',sans-serif;font-size:10.5px;font-weight:500;letter-spacing:.1em;text-transform:uppercase;color:rgba(255,255,255,.35);margin-top:3px}
.toolfoot-links{display:flex;gap:6px;flex-wrap:wrap}
.toolfoot-links a{font-size:13px;font-weight:500;color:rgba(255,255,255,.62);text-decoration:none;padding:8px 12px;border-radius:8px;transition:background .16s,color .16s}
.toolfoot-links a:hover{background:rgba(255,255,255,.07);color:#fff}
.toolfoot-links a.cta{background:var(--gold);color:var(--navy);font-weight:700}
.toolfoot-links a.cta:hover{background:var(--gold-light);color:var(--navy)}
@media(max-width:640px){.toolfoot-in{flex-direction:column;align-items:flex-start;gap:16px}.toolfoot-links{gap:2px}}

/* Dentro il Laboratorio la cornice ce l'ha già la pagina che ospita:
   stessa regola che vale per la barra e per il footer legale. */
html.rc-embedded .toolhead,
html.rc-embedded .toolfoot{display:none!important}

/* ── Nota legale in cima allo strumento ───────────────────────────────
   Era una banda scura schiacciata fra la barra e la testata, con un bordo
   oro da 2 px che tagliava la pagina in due. Ora e' una nota dentro il
   contenuto, con lo stesso filetto degli altri riquadri del sito. */
.toolnote{background:#fff;border:1px solid var(--border);border-left:3px solid var(--gold);border-radius:12px;
  color:var(--muted);font-size:12.5px;line-height:1.7;padding:14px 18px;max-width:960px;margin:22px auto 0}
.toolnote strong{color:var(--navy)}
.toolnote a{color:var(--teal);font-weight:600}
html.rc-embedded .toolnote{margin-top:14px}


/* ══ «A cosa serve questo strumento» — 23 agosto 2026 ══════════════════════
   Riscontro da persone non esperte: aprivano lo strumento e non capivano a
   che cosa servisse, ne' che cosa dovessero avere sotto mano. Un blocco a
   scomparsa in cima a ognuno dei nove, con la stessa struttura ovunque:
   a cosa serve, quando aprirlo, cosa portare, cosa ottieni, cosa non fa.

   Sta FUORI dalla .toolhead di proposito: dentro il Laboratorio la testata e'
   nascosta, e li' dentro sparirebbe anche questo. Chiuso all'apertura, cosi'
   chi sa gia' cosa cerca non deve scavalcarlo. */
.a-cosa-serve{
  max-width:1080px; margin:22px auto 0; padding:0 20px;
  font-family:'DM Sans',system-ui,sans-serif;
}
.a-cosa-serve>summary{
  cursor:pointer; list-style:none; display:flex; align-items:center; gap:10px;
  background:#FFFBF0; border:1px solid rgba(201,168,76,.42); border-left:3px solid var(--gold,#C9A84C);
  border-radius:0 11px 11px 0; padding:13px 18px;
  font-size:13.5px; font-weight:700; color:var(--gold2,#8F7526);
  transition:background .18s, border-color .18s;
}
.a-cosa-serve>summary::-webkit-details-marker{display:none}
.a-cosa-serve>summary::before{
  content:'?'; flex:0 0 auto; width:19px; height:19px; border-radius:50%;
  border:1.5px solid var(--gold2,#8F7526); font-size:11.5px; line-height:16px;
  text-align:center; font-weight:800;
}
.a-cosa-serve>summary::after{content:'\203A'; margin-left:auto; font-size:17px; transition:transform .2s}
.a-cosa-serve[open]>summary::after{transform:rotate(90deg)}
.a-cosa-serve>summary:hover{background:#FDF4DC; border-color:var(--gold,#C9A84C)}
.a-cosa-serve>summary:focus-visible{outline:2px solid var(--teal,#008F85); outline-offset:2px}

.acs-corpo{
  border:1px solid var(--border,#E2EAF0); border-top:none;
  border-radius:0 0 11px 11px; background:var(--card,#fff);
  padding:20px 22px 6px; margin-left:3px;
  display:grid; gap:16px;
}
.acs-voce{display:grid; grid-template-columns:210px 1fr; gap:4px 22px; align-items:start}
.acs-k{
  font-size:10px; font-weight:700; letter-spacing:.11em; text-transform:uppercase;
  color:var(--dim,#8A9BB0); padding-top:3px;
}
.acs-voce p{margin:0 0 0; font-size:13.5px; line-height:1.7; color:var(--muted,#5A6A7E); max-width:66ch}
.acs-voce p strong{color:var(--navy,#0D2955); font-weight:700}
.acs-voce p a{color:var(--teal,#008F85); font-weight:600; text-decoration:none; border-bottom:1px solid rgba(0,143,133,.35)}
.acs-voce p a:hover{border-bottom-color:var(--teal,#008F85)}
.acs-limite{border-top:1px solid var(--border,#E2EAF0); padding-top:16px}
.acs-limite .acs-k{color:var(--bad,#C0492F)}

@media(max-width:760px){
  .acs-voce{grid-template-columns:1fr; gap:3px}
  .acs-corpo{padding:18px 18px 4px; gap:18px}
  .a-cosa-serve{padding:0 14px}
  .a-cosa-serve>summary{font-size:13px; padding:12px 15px}
}

/* ══════════════════════════════════════════════════════════════════════════
   LA CODA DEGLI STRUMENTI — 10 settembre 2026
   Salva il risultato · Dati, metodo e limiti · Il passo successivo · Il dato
   ereditato da un altro strumento. Il markup lo monta strumenti-comune.js:
   qui c'è solo il vestito, così resta uguale su tutti e nove.
   ══════════════════════════════════════════════════════════════════════════ */

.rc-coda{
  max-width:920px; margin:34px auto 0; padding:0 20px 40px;
  display:grid; gap:16px;
  font-family:'DM Sans',system-ui,-apple-system,sans-serif;
}

/* ── Salva il risultato ─────────────────────────────────────────────────── */
.rc-salva{
  background:var(--card,#fff); border:1px solid var(--border,#E2EAF0);
  border-left:3px solid var(--teal,#008F85); border-radius:12px;
  padding:18px 22px; display:flex; align-items:center; gap:22px; flex-wrap:wrap;
}
.rc-salva-txt{flex:1 1 340px; min-width:0}
.rc-salva-t{font-family:'Playfair Display',Georgia,serif; font-size:16.5px;
  font-weight:700; color:var(--navy,#0D2955); margin-bottom:5px}
.rc-salva-d{font-size:12.8px; line-height:1.65; color:var(--muted,#5A6A7E); max-width:70ch}
.rc-salva-d strong{color:var(--navy,#0D2955)}
.rc-salva-btn{
  flex-shrink:0; background:var(--navy,#0D2955); color:#fff; border:none;
  border-radius:9px; padding:12px 22px; font-size:13px; font-weight:700;
  font-family:inherit; cursor:pointer; transition:background .18s,transform .18s;
}
.rc-salva-btn:hover{background:var(--navy-mid,#1A3A5C); transform:translateY(-1px)}
.rc-salva-btn:focus-visible{outline:2px solid var(--gold,#C9A84C); outline-offset:3px}

/* ── Dati, metodo, limiti ───────────────────────────────────────────────── */
.rc-fonti{
  background:var(--card,#fff); border:1px solid var(--border,#E2EAF0);
  border-radius:12px; overflow:hidden;
}
.rc-fonti>summary{
  cursor:pointer; list-style:none; padding:15px 22px;
  font-size:13.5px; font-weight:700; color:var(--navy,#0D2955);
  display:flex; align-items:center; gap:9px;
}
.rc-fonti>summary::-webkit-details-marker{display:none}
.rc-fonti>summary::before{
  content:'⚖'; font-size:15px; color:var(--gold2,#8F7526); flex-shrink:0;
}
.rc-fonti>summary::after{
  content:'›'; margin-left:auto; font-size:19px; color:var(--dim,#8A9BB0);
  transition:transform .2s;
}
.rc-fonti[open]>summary::after{transform:rotate(90deg)}
.rc-fonti>summary:hover{background:var(--bg,#F7F9FC)}
.rc-fonti-corpo{
  border-top:1px solid var(--border,#E2EAF0); padding:20px 22px;
  display:grid; grid-template-columns:repeat(3,1fr); gap:26px;
}
.rc-fonti-k{
  font-size:10px; font-weight:700; letter-spacing:.11em; text-transform:uppercase;
  color:var(--dim,#8A9BB0); margin-bottom:10px;
}
.rc-fonti-lim .rc-fonti-k{color:var(--bad,#C0492F)}
.rc-fonti-col ul{margin:0; padding-left:17px; display:grid; gap:7px}
.rc-fonti-col li{font-size:12.7px; line-height:1.62; color:var(--muted,#5A6A7E)}
.rc-fonti-col li strong{color:var(--navy,#0D2955); font-weight:700}
.rc-fonti-col li a{color:var(--teal,#008F85); font-weight:600; text-decoration:none;
  border-bottom:1px solid rgba(0,143,133,.35)}
.rc-fonti-nota{
  border-top:1px solid var(--border,#E2EAF0); padding:13px 22px;
  font-size:11.8px; line-height:1.6; color:var(--dim,#8A9BB0); background:var(--bg,#F7F9FC);
}

/* ── Il passo successivo ────────────────────────────────────────────────── */
.rc-passo{
  background:linear-gradient(135deg,var(--navy,#0D2955),var(--navy-mid,#1A3A5C));
  border:1px solid rgba(201,168,76,.3); border-radius:12px; padding:20px 24px;
}
.rc-passo-k{
  font-size:10px; font-weight:700; letter-spacing:.13em; text-transform:uppercase;
  color:var(--gold,#C9A84C); margin-bottom:10px;
}
.rc-passo-corpo{display:flex; align-items:center; gap:22px; flex-wrap:wrap}
.rc-passo-txt{flex:1 1 340px; font-size:13.5px; line-height:1.65; color:rgba(255,255,255,.78)}
.rc-passo-txt strong{color:#fff; font-weight:700}
.rc-passo-btn{
  flex-shrink:0; background:var(--gold,#C9A84C); color:var(--navy,#0D2955);
  padding:11px 22px; border-radius:9px; font-size:13px; font-weight:700;
  text-decoration:none; white-space:nowrap; transition:background .18s,transform .18s;
}
.rc-passo-btn:hover{background:var(--gold-light,#E8C96B); transform:translateY(-1px)}
.rc-passo-alt{
  margin-top:13px; padding-top:12px; border-top:1px solid rgba(255,255,255,.12);
  font-size:12px; line-height:1.6; color:rgba(255,255,255,.55);
}
.rc-passo-alt a{color:var(--gold-light,#E8C96B); text-decoration:none; font-weight:600}

/* ── Il dato che arriva da un altro strumento ───────────────────────────── */
.rc-ered{
  background:#FFF9E8; border:1px solid rgba(201,168,76,.45); border-left:3px solid var(--gold,#C9A84C);
  border-radius:11px; padding:14px 18px; margin-bottom:16px;
  display:flex; align-items:center; gap:18px; flex-wrap:wrap;
  font-family:'DM Sans',system-ui,-apple-system,sans-serif;
}
.rc-ered-txt{flex:1 1 320px; font-size:12.8px; line-height:1.6; color:#4A5A6E}
.rc-ered-txt strong{color:var(--navy,#0D2955); font-weight:700}
.rc-ered-btn{display:flex; gap:8px; flex-shrink:0}
.rc-ered-si,.rc-ered-no{
  border-radius:8px; padding:8px 15px; font-size:11.5px; font-weight:700;
  font-family:inherit; cursor:pointer; white-space:nowrap;
}
.rc-ered-si{background:var(--navy,#0D2955); color:#fff; border:none}
.rc-ered-si:hover{background:var(--navy-mid,#1A3A5C)}
.rc-ered-no{background:none; border:1px solid rgba(13,41,85,.25); color:var(--muted,#5A6A7E)}
.rc-ered-fatto{background:#EAF6F4; border-color:rgba(0,143,133,.35); border-left-color:var(--teal,#008F85)}

@media(max-width:900px){
  .rc-fonti-corpo{grid-template-columns:1fr; gap:20px}
}
@media(max-width:560px){
  .rc-coda{padding:0 16px 32px; margin-top:26px}
  .rc-salva,.rc-passo{padding:16px 17px}
  .rc-salva-btn,.rc-passo-btn{width:100%; text-align:center}
  .rc-fonti>summary{padding:14px 17px; font-size:12.8px}
  .rc-fonti-corpo{padding:17px}
  .rc-ered-btn{width:100%}
  .rc-ered-si,.rc-ered-no{flex:1}
}

/* ══════════════════════════════════════════════════════════════════════════
   UN SOLO SISTEMA PER TUTTI GLI STRUMENTI — 30 settembre 2026

   Roberto: «tutte le volte che approfondiamo uno strumento troviamo alcuni
   problemi: allinea ovunque lo stile, prendendo come modello quello della
   previdenza». Le forme qui sotto sono quelle dell'Analisi previdenziale
   (blocco «UN SOLO SISTEMA PER I SEI MODULI» e «inizio pagina» di
   pensione.html), portate nel foglio comune perche' le usino tutti:

     · la riga di servizio in cima: A cosa serve · Nota legale · una riga
       di avvertenza, e a destra «Prova con dati d'esempio» / «Azzera»;
     · i quattro toni dei messaggi (informazione, conferma, attenzione,
       rischio): una forma sola, bordo sinistro di 4 px;
     · le tessere dei risultati: bianche, filetto colorato in alto;
     · l'invito a parlarne: una riga, un pulsante;
     · la scheda PDF: testata blu, quattro numeri, sezioni numerate.
   ══════════════════════════════════════════════════════════════════════════ */

/* ── Riga di servizio ─────────────────────────────────────────────────── */
.rc-serv{display:flex;justify-content:space-between;align-items:center;gap:10px 16px;flex-wrap:wrap;
  margin:0 0 14px;font-family:'DM Sans',system-ui,-apple-system,sans-serif}
.rc-serv-sx{display:flex;align-items:center;gap:6px 14px;flex-wrap:wrap;font-size:12px;color:var(--muted)}
.rc-serv-link{background:none;border:0;padding:4px 0;font:inherit;font-size:12.5px;font-weight:600;color:var(--teal);cursor:pointer;
  text-decoration:underline;text-decoration-color:rgba(0,143,133,.35);text-underline-offset:3px}
.rc-serv-link[aria-expanded="true"]{color:var(--navy);text-decoration-color:var(--navy)}
.rc-serv-link:focus-visible{outline:2px solid var(--teal);outline-offset:2px;border-radius:3px}
.rc-serv-nota{color:var(--dim);font-size:11.5px}
.rc-serv-dx{display:flex;gap:8px;flex-wrap:wrap;margin-left:auto}
.rc-serv-pan{background:#fff;border:1px solid var(--border);border-radius:12px;padding:16px 18px;margin:0 0 14px;
  font-family:'DM Sans',system-ui,-apple-system,sans-serif;font-size:12.5px;line-height:1.75;color:var(--muted)}
.rc-serv-pan[hidden]{display:none}
.rc-serv-pan p{margin:0 0 8px}.rc-serv-pan p:last-child{margin:0}
.rc-serv-pan a{color:var(--teal);font-weight:600}
.rc-serv-pan .acs-corpo{padding:0;border:0;background:none;margin:0}
.rc-lead{font-family:'DM Sans',system-ui,-apple-system,sans-serif;font-size:13px;line-height:1.7;color:var(--muted);
  margin:0 0 18px;max-width:760px}
.rc-lead b,.rc-lead strong{color:var(--navy)}
/* I due pulsanti: prima erano copiati in ogni file, con piccole differenze. */
.start-demo{height:38px;padding:0 18px;border-radius:10px;border:1.5px solid var(--gold);background:#FFFBF0;color:#8a6d1f;
  font-family:'DM Sans',system-ui,sans-serif;font-size:12.5px;font-weight:700;cursor:pointer;white-space:nowrap;transition:background .15s,color .15s}
.start-demo:hover{background:var(--gold);color:var(--navy)}
.start-demo[disabled]{opacity:.5;cursor:default}
.start-reset{height:38px;padding:0 16px;border-radius:10px;border:1px solid var(--border);background:#fff;color:var(--muted);
  font-family:'DM Sans',system-ui,sans-serif;font-size:12.5px;font-weight:600;cursor:pointer;white-space:nowrap;transition:all .15s}
.start-reset:hover{border-color:#C0392B;color:#C0392B;background:#FDF3F2}
.start-reset.conferma{border-color:#C0392B;color:#fff;background:#C0392B}
.start-reset[hidden]{display:none}
@media(max-width:700px){.rc-serv-nota{display:block;width:100%}.rc-serv-dx{margin-left:0}}

/* ── Messaggi: quattro toni, una forma ────────────────────────────────── */
.rc-msg{border:1px solid;border-left-width:4px;border-radius:10px;padding:14px 18px;font-size:12.5px;line-height:1.7;
  margin:0 0 12px;font-family:'DM Sans',system-ui,-apple-system,sans-serif}
.rc-msg.info{background:#F6F8FB;border-color:#DFE5EE;border-left-color:#8C9BB0;color:var(--txt)}
.rc-msg.ok{background:#F1F9F8;border-color:rgba(0,143,133,.25);border-left-color:var(--teal);color:#0B4F48}
.rc-msg.att{background:#FCF7EC;border-color:rgba(201,168,76,.35);border-left-color:var(--gold2);color:#5E4309}
.rc-msg.risk{background:#FDF4F4;border-color:rgba(192,57,43,.22);border-left-color:#C0392B;color:#7A1F1F}
.rc-msg strong,.rc-msg b{color:inherit}
.rc-msg a{color:inherit;font-weight:700}

/* ── Tessere dei risultati ────────────────────────────────────────────── */
.rc-kpi-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin:0 0 16px}
.rc-kpi-grid.c3{grid-template-columns:repeat(3,1fr)}
.rc-kpi-grid.c2{grid-template-columns:repeat(2,1fr)}
.rc-kpi{background:#fff;border:1px solid var(--border);border-top:3px solid var(--navy);border-radius:12px;padding:16px 18px;
  box-shadow:0 1px 4px rgba(13,41,85,.05);font-family:'DM Sans',system-ui,-apple-system,sans-serif;min-width:0}
.rc-kpi.t-teal{border-top-color:var(--teal)}.rc-kpi.t-gold{border-top-color:var(--gold)}
.rc-kpi.t-red{border-top-color:#C0492F}.rc-kpi.t-grey{border-top-color:#8C9BB0}
.rc-kpi-l{font-size:10px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--muted);margin:0 0 6px}
.rc-kpi-v{font-size:21px;font-weight:700;color:var(--navy);line-height:1.2;margin:0;font-variant-numeric:tabular-nums}
.rc-kpi.t-red .rc-kpi-v{color:#C0492F}.rc-kpi.t-teal .rc-kpi-v{color:var(--teal)}
.rc-kpi-s{font-size:10.5px;line-height:1.55;color:var(--muted);margin:4px 0 0}
@media(max-width:700px){.rc-kpi-grid,.rc-kpi-grid.c3{grid-template-columns:1fr 1fr}}
@media(max-width:380px){.rc-kpi-grid,.rc-kpi-grid.c3,.rc-kpi-grid.c2{grid-template-columns:1fr}}

/* ── Card e campi ─────────────────────────────────────────────────────── */
.rc-carta{background:#fff;border:1px solid var(--border);border-radius:14px;padding:24px;margin:0 0 18px;
  box-shadow:0 1px 6px rgba(13,41,85,.05);font-family:'DM Sans',system-ui,-apple-system,sans-serif}
.rc-carta-t{font-size:10.5px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--gold2);margin:0 0 14px}
.rc-carta-lead{font-size:12.5px;color:var(--muted);line-height:1.7;max-width:720px;margin:-4px 0 18px}
.rc-campi{display:grid;grid-template-columns:repeat(3,1fr);gap:16px 18px}
.rc-campi.c2{grid-template-columns:1fr 1fr}
.rc-campo-l{display:block;font-size:11px;font-weight:500;letter-spacing:.08em;text-transform:uppercase;color:var(--muted);margin:0 0 6px}
.rc-campo-h{font-size:10.5px;color:var(--muted);line-height:1.55;margin-top:4px}
@media(max-width:700px){.rc-campi,.rc-campi.c2{grid-template-columns:1fr}.rc-carta{padding:18px 16px}}
/* Righe di tabella: etichetta a sinistra, valore in grassetto a destra */
.q-row{display:flex;justify-content:space-between;gap:12px;padding:10px 0;border-bottom:1px solid #EDF1F6;font-size:12.5px;align-items:baseline}
.q-row:last-child{border-bottom:none}
.q-row span:first-child{color:var(--muted)}
.q-row span:last-child{color:var(--navy);font-weight:600;text-align:right}
.q-row.q-tot{border-top:2px solid var(--border);border-bottom:0;margin-top:2px}
.q-row.q-tot span{font-weight:700;color:var(--navy)}
/* Titolo di sezione fuori dalle card (come «Tre domande, poi gli approfondimenti») */
.rc-mod-t{font-family:'DM Sans',system-ui,-apple-system,sans-serif;font-size:21px;font-weight:700;color:var(--navy);letter-spacing:-.01em;margin:28px 0 6px}
.rc-mod-d{font-size:12.5px;color:var(--muted);line-height:1.7;max-width:720px;margin:0 0 16px}
/* L'esito: il numero che conclude un ragionamento */
.rc-esito{margin:0 0 16px;padding:18px 22px;border-radius:12px;background:#EFF8F7;border:1px solid rgba(0,143,133,.3);
  color:var(--txt);font-size:12.5px;line-height:1.7;font-family:'DM Sans',system-ui,-apple-system,sans-serif}
.rc-esito.neg{background:#FDF4F4;border-color:rgba(192,57,43,.3)}
.rc-esito-k{font-size:10px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--dim);margin-bottom:6px}
.rc-esito-v{font-size:30px;font-weight:800;color:var(--teal);letter-spacing:-.02em;line-height:1.15;margin:0 0 6px;font-variant-numeric:tabular-nums}
.rc-esito.neg .rc-esito-v{color:#C0392B}
/* 30/09/2026: i dati si salvano da soli, come nell'Analisi previdenziale: il
   banner del consenso e la riga «dati salvati» non compaiono piu'. */
#ls-banner,#ls-saved-row,#f09-ls-banner,#f09-ls-row{display:none!important}
/* (regole di prima, rimaste per sicurezza) */
#ls-banner{background:#fff!important;border:1px dashed var(--border)!important;border-radius:10px!important;padding:12px 16px!important}
#ls-banner>div:first-child,#ls-banner>div:first-child strong{color:var(--navy)!important}
#ls-banner>div:first-child span{color:var(--muted)!important}
#ls-banner button:first-child{background:var(--navy)!important;color:#fff!important}
#ls-banner button:last-child{background:#fff!important;color:var(--muted)!important;border:1px solid var(--border)!important}
#ls-saved-row{background:#F1F9F8!important;border:1px solid rgba(0,143,133,.25)!important;border-radius:10px!important}
#ls-saved-row span{color:#0B4F48!important}

/* ── L'invito a parlarne ──────────────────────────────────────────────── */
.rc-cta{display:flex;align-items:center;justify-content:space-between;gap:10px 14px;flex-wrap:wrap;
  background:#fff;border:1px solid var(--border);border-left:4px solid var(--teal);border-radius:0 12px 12px 0;
  padding:14px 18px;margin:16px 0;font-family:'DM Sans',system-ui,-apple-system,sans-serif;font-size:12.8px;line-height:1.6;color:var(--muted)}
.rc-cta b,.rc-cta strong{color:var(--navy)}
.rc-cta>span:first-child{flex:1 1 300px}
.rc-cta-az{display:flex;gap:8px;align-items:center;flex-wrap:wrap}
.rc-cta-btn{background:var(--navy);color:#fff!important;padding:9px 16px;border-radius:8px;font-weight:700;text-decoration:none;
  font-size:12.5px;white-space:nowrap}
.rc-cta-btn:hover{background:var(--navy-mid)}
.rc-cta-alt{color:var(--teal)!important;font-weight:700;font-size:12.5px;text-decoration:none;white-space:nowrap}
.rc-cta-alt:hover{text-decoration:underline}

/* ── La scheda da stampare ──────────────────────────────────────────────── */
/* Fuori dalla stampa non esiste: sta in <body> solo per essere l'unico figlio
   diretto visibile quando parte il foglio di stampa. */
.rc-stampa{display:none}

/* 30 settembre 2026: la scheda di tutti gli strumenti ha la forma che il
   28 settembre era stata data solo a quella dell'Analisi previdenziale —
   testata blu, i numeri principali in tessere, un riquadro «In breve», poi
   il dettaglio in sezioni numerate e ipotesi, metodo e limiti su due
   colonne. Le regole sono quelle che stavano in pensione.html, spostate qui. */
.pr{font-family:'DM Sans',system-ui,-apple-system,sans-serif;color:#0D2955;font-size:9.5pt;line-height:1.5;
  -webkit-print-color-adjust:exact;print-color-adjust:exact}
.pr *{box-sizing:border-box}
.pr-testa{background:#0D2955;color:#fff;border-radius:10px;padding:18px 22px 16px;position:relative;overflow:hidden}
.pr-testa::after{content:'';position:absolute;right:-40px;top:-40px;width:180px;height:180px;border-radius:50%;
  border:26px solid rgba(201,168,76,.18)}
.pr-marchio{font-family:'Playfair Display',Georgia,serif;font-size:12pt;font-weight:700;letter-spacing:.01em}
.pr-marchio span{font-family:'DM Sans',sans-serif;font-size:7.5pt;font-weight:600;letter-spacing:.14em;
  text-transform:uppercase;color:#C9A84C;margin-left:6px}
.pr-k{font-size:7pt;font-weight:700;letter-spacing:.16em;text-transform:uppercase;color:#C9A84C;margin-top:16px}
.pr-testa h1{font-family:'Playfair Display',Georgia,serif;font-size:24pt;line-height:1.1;margin:3px 0 8px;color:#fff}
.pr-chi{font-size:9pt;color:rgba(255,255,255,.78);max-width:74%}
.pr-data{position:absolute;right:22px;top:18px;font-size:7.5pt;color:rgba(255,255,255,.6);text-align:right}
.pr-kpi{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;margin:14px 0 4px}
.pr-kpi.n3{grid-template-columns:repeat(3,1fr)}.pr-kpi.n2{grid-template-columns:repeat(2,1fr)}.pr-kpi.n1{grid-template-columns:1fr}
.pr-c{border:1px solid #E2EAF0;border-top:3px solid #0D2955;border-radius:8px;padding:9px 11px 10px;background:#fff;break-inside:avoid;min-width:0}
.pr-c.t{border-top-color:#8C9BB0}.pr-c.r{border-top-color:#C0492F}.pr-c.g{border-top-color:#C9A84C}.pr-c.ok{border-top-color:#008F85}
.pr-cl{font-size:6.8pt;font-weight:700;letter-spacing:.09em;text-transform:uppercase;color:#5A6A7E}
.pr-cv{font-size:15.5pt;font-weight:700;line-height:1.15;margin:3px 0 2px;white-space:nowrap}
.pr-c.r .pr-cv{color:#C0492F}.pr-c.ok .pr-cv{color:#008F85}
.pr-cs{font-size:7.3pt;color:#5A6A7E;line-height:1.35}
.pr-box{border:1px solid #E2EAF0;border-radius:9px;padding:12px 14px;margin-top:10px;break-inside:avoid;background:#fff}
.pr-box img{display:block;width:100%;height:auto}
.pr-bt{font-size:7.5pt;font-weight:700;letter-spacing:.11em;text-transform:uppercase;color:#0D2955;margin:0 0 8px}
.pr-bt em{font-style:normal;color:#8A9BB0;font-weight:600;letter-spacing:.04em;text-transform:none;margin-left:6px}
.pr-leg{display:flex;flex-wrap:wrap;gap:4px 14px;margin-top:6px;font-size:7.5pt;color:#3A4A5E}
.pr-leg i{display:inline-block;width:9px;height:9px;border-radius:2px;margin-right:5px;vertical-align:-1px}
.pr-lett{margin:10px 0 0;padding:0;list-style:none}
.pr-lett li{position:relative;padding-left:14px;margin-bottom:4px;font-size:8.8pt;line-height:1.55}
.pr-lett li::before{content:'';position:absolute;left:0;top:.55em;width:6px;height:6px;border-radius:50%;background:#C9A84C}
.pr-sez{margin-top:16px;break-inside:auto}
.pr-sh{display:flex;align-items:center;gap:8px;border-bottom:1.5px solid #C9A84C;padding-bottom:4px;margin-bottom:4px;break-after:avoid}
.pr-n{flex:none;width:18px;height:18px;border-radius:50%;background:#0D2955;color:#fff;font-size:7.5pt;font-weight:700;
  display:flex;align-items:center;justify-content:center}
.pr-sh h2{font-size:10.5pt;font-weight:700;margin:0;color:#0D2955}
.pr-tab{width:100%;border-collapse:collapse}
.pr-tab tr{break-inside:avoid}
.pr-tab th,.pr-tab td{padding:4.5px 6px;border-bottom:1px solid #EEF2F6;vertical-align:top;text-align:left}
.pr-tab tr:nth-child(even) th,.pr-tab tr:nth-child(even) td{background:#F7F9FB}
.pr-tab th{font-weight:400;color:#5A6A7E;width:50%;font-size:8.5pt}
.pr-tab td{font-weight:600;font-size:8.8pt;color:#0D2955}
.pr-sc th{width:auto}.pr-sc thead td,.pr-sc thead th{border-bottom:1.5px solid #0D2955;font-size:8pt;font-weight:700;color:#0D2955;background:transparent!important}
.pr-sc td.n,.pr-sc th.n{text-align:right;font-variant-numeric:tabular-nums}
.pr-sc .fpe-dim,.pr-dim{display:block;font-weight:400;color:#5A6A7E;font-size:7.5pt}
.pr a{color:inherit;text-decoration:none}
.pr-tab tr.tot td,.pr-tab tr.tot th,.pr-sc tr.tot td,.pr-sc tr.tot th{border-top:1.5px solid #0D2955;font-weight:700;color:#0D2955;background:transparent!important}
.pr-nota{font-size:7.5pt;line-height:1.5;color:#5A6A7E;margin:5px 0 0}
.pr-testo{font-size:8.8pt;line-height:1.6;color:#3A4A5E;margin:6px 0 0}
.pr-sez.tfr,.pr-sez.evid{background:#FBF7EC;border:1px solid #EADFBF;border-radius:9px;padding:10px 12px}
.pr-sez.tfr .pr-tab tr:nth-child(even) th,.pr-sez.tfr .pr-tab tr:nth-child(even) td,
.pr-sez.evid .pr-tab tr:nth-child(even) th,.pr-sez.evid .pr-tab tr:nth-child(even) td{background:transparent}
.pr-fonti{columns:2;column-gap:18px;margin-top:6px}
.pr-fonti h3{font-size:7pt;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:#8A9BB0;margin:6px 0 3px;break-after:avoid}
.pr-fonti ul{margin:0 0 6px;padding-left:13px}
.pr-fonti li{font-size:7.3pt;line-height:1.45;color:#3A4A5E;margin-bottom:2px;break-inside:avoid}
.pr-piede{margin-top:16px;border-top:1px solid #E2EAF0;padding-top:8px;font-size:7.2pt;color:#5A6A7E;line-height:1.5;break-inside:avoid}
.pr-piede b{color:#0D2955}
.pr-p2{break-before:page}
.pr-vuoto{color:#C0492F;margin:14px 0}
/* barre orizzontali della prima pagina (composizioni, distribuzioni) */
.pr-barre{display:grid;gap:5px;margin-top:2px}
.pr-bar{display:grid;grid-template-columns:34% 1fr 44px;gap:8px;align-items:center;font-size:8.3pt}
.pr-bar-l{color:#3A4A5E;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.pr-bar-t{height:8px;background:#EEF2F6;border-radius:3px;overflow:hidden}
.pr-bar-f{display:block;height:8px;border-radius:3px}
.pr-bar-v{text-align:right;font-weight:700;font-variant-numeric:tabular-nums}

@media print{
  body>*{display:none !important}
  body>.rc-stampa{display:block !important}
  @page{margin:13mm 13mm 16mm;
    @bottom-left{content:'Roberto Cavallo \00B7  Consulente Finanziario Indipendente \00B7  robertocavallocfa.it';
      font-family:'DM Sans',sans-serif;font-size:7pt;color:#8A9BB0}
    @bottom-right{content:'pagina ' counter(page) ' di ' counter(pages);
      font-family:'DM Sans',sans-serif;font-size:7pt;color:#8A9BB0}}
  html,body{background:#fff !important}
  a[href]::after{content:'' !important}
}
