/* ==================================================================
   IL SERVIZIO — la pagina unica (servizio + come funziona), 25/10/2026
   Si appoggia a css/home.css: temi chiaro e scuro, gusci, etichette,
   titoli, entrate (.rivela, .carta), passi, garanzia (.patto). Qui solo
   le parti proprie della pagina, tutte col prefisso sv-. In fondo la
   scheda del contatto (pf-), copiata identica alla piattaforma.
   ================================================================== */

/* ---- pezzi comuni della pagina ---- */
.sv-h3 { margin: 0; font-size: clamp(1.3rem, 1.8vw, 1.6rem); line-height: 1.15; letter-spacing: -.025em; font-weight: 700; color: var(--t); text-wrap: balance; }
.sv-intro { margin: 20px 0 0; }
.sv-titolo-largo { max-width: 24ch; }
.sv-nota { margin: clamp(26px, 3vw, 40px) 0 0; max-width: 72ch; padding: 18px 22px; border-radius: 18px; background: var(--g-bg); box-shadow: inset 0 0 0 1px var(--g-bd); font-size: 1.02rem; line-height: 1.6; color: var(--t2); }
.sv-limite { margin: 4px 0 0; padding: 14px 16px; border-left: 3px solid var(--arancio); border-radius: 0 12px 12px 0; background: rgba(231, 89, 31, .08); font-size: .98rem !important; line-height: 1.55; color: var(--t2); }
.sv-domanda { position: relative; margin: 6px 0 0; padding: 20px 22px 20px 62px; border-radius: 18px; background: linear-gradient(160deg, rgba(231, 89, 31, .15), rgba(231, 89, 31, .05)); box-shadow: inset 0 0 0 1px rgba(231, 89, 31, .38); font-size: 1.05rem; line-height: 1.5; font-weight: 600; color: var(--t); }
.sv-domanda::before { content: "?"; position: absolute; left: 18px; top: 18px; width: 30px; height: 30px; border-radius: 50%; display: grid; place-items: center; font-size: 1rem; font-weight: 800; color: #fff; background: var(--arancio); }

/* ---- 1 · apertura: il titolo su due livelli ---- */
.sv-eroe { min-height: 100svh; display: flex; align-items: center; padding-top: calc(var(--sez) + 40px); }
.sv-eroe > .dentro { width: 100%; position: relative; }
/* lo sfondo (25/10/2026): un fotogramma del video della home, la citta' con
   la villetta blu, sfumato a sinistra sotto il titolo e in basso verso la
   sezione dopo. Sul telefono il fotogramma verticale, ancorato in basso. */
.sv-eroe { position: relative; overflow: clip; }
.sv-eroe__sfondo { position: absolute; inset: 0; background: url("../assets/frames/presentazione/d/100.webp") 70% 55% / cover no-repeat; transform: scale(1.04); }
.sv-eroe__sfondo::after { content: ""; position: absolute; inset: 0; background: linear-gradient(90deg, rgba(236, 232, 227, .97) 0%, rgba(236, 232, 227, .92) 32%, rgba(236, 232, 227, .35) 58%, rgba(236, 232, 227, .05) 80%), linear-gradient(0deg, rgba(236, 232, 227, .9) 0%, rgba(236, 232, 227, 0) 22%); }
.sv-briciole { display: flex; align-items: center; gap: 8px; margin: 0 0 26px; font-size: .86rem; font-weight: 500; color: var(--t2); }
.sv-briciole a { text-decoration: none; }
.sv-briciole a:hover { color: var(--t); }
.sv-eroe__titolo { margin: 22px 0 0; display: grid; gap: clamp(14px, 2vw, 26px); font-weight: 700; color: var(--t); }
.sv-eroe__uno { display: block; font-size: clamp(2.8rem, min(7.6vw, 13svh), 7.4rem); line-height: .95; letter-spacing: -.055em; text-wrap: balance; max-width: 14ch; }
.sv-eroe__due { display: block; max-width: 30ch; font-size: clamp(1.35rem, min(2.4vw, 4.4svh), 2.2rem); line-height: 1.2; letter-spacing: -.03em; font-weight: 600; color: var(--blu); text-wrap: balance; }
.sv-eroe .azioni { margin-top: clamp(28px, 4vw, 44px); }

/* ---- 1b · chi ha gia' pagato (25/10/2026): i dieci agenti, il file che si
   spegne, la mappa della pagina. Tutto segue lo scroll (js/servizio.js). */
.sv-fascia { padding: clamp(80px, 9vw, 130px) 0; }
.sv-fascia__apre { margin: 0 0 clamp(44px, 5vw, 70px); max-width: 46ch; font-size: clamp(1.45rem, 2.3vw, 2.15rem); line-height: 1.3; font-weight: 600; letter-spacing: -.02em; color: var(--t); text-wrap: pretty; }
.sv-fascia__apre em { font-style: normal; color: var(--acc); }
.sv-fascia__griglia { display: grid; grid-template-columns: minmax(0, .9fr) minmax(0, 1.1fr); gap: clamp(36px, 6vw, 90px); align-items: center; }
.sv-agenti { margin: 0; display: grid; gap: 22px; }
.sv-agenti__numero { display: flex; align-items: baseline; gap: 12px; font-size: clamp(4.6rem, 8vw, 7.4rem); line-height: .82; font-weight: 800; letter-spacing: -.06em; color: var(--arancio); font-variant-numeric: tabular-nums; text-shadow: 0 0 60px rgba(231, 89, 31, .35); }
.sv-agenti__numero small { font-size: .3em; letter-spacing: -.02em; font-weight: 700; color: var(--t); text-shadow: none; }
.sv-agenti__fila { display: grid; grid-template-columns: repeat(10, minmax(0, 1fr)); gap: clamp(6px, 1vw, 12px); max-width: 520px; }
.sv-agenti__fila i { display: block; }
.sv-agenti__fila svg { display: block; width: 100%; height: auto; fill: rgba(242, 239, 233, .12); transition: fill .4s var(--molla), transform .5s cubic-bezier(.2, 1.7, .4, 1), filter .4s var(--molla); }
.sv-agenti__fila i.su svg { fill: rgba(242, 239, 233, .55); }
.sv-agenti__fila i.brucia svg { fill: var(--arancio); transform: translateY(-4px); filter: drop-shadow(0 6px 14px rgba(231, 89, 31, .55)); }
.sv-agenti figcaption { max-width: 34ch; font-size: 1rem; font-weight: 600; line-height: 1.45; color: var(--t2); }
.sv-fascia__testo { margin: 0; max-width: 54ch; font-size: 1.06rem; line-height: 1.6; color: var(--t2); }
.sv-mappa { margin-top: clamp(50px, 6vw, 80px); padding-top: clamp(36px, 4vw, 50px); border-top: 1px solid var(--linea); display: grid; grid-template-columns: minmax(0, 1.1fr) minmax(0, .9fr); gap: clamp(30px, 5vw, 70px); align-items: center; }
.sv-fascia__forte { margin: 0; font-size: clamp(1.25rem, 1.8vw, 1.6rem); line-height: 1.4; font-weight: 600; letter-spacing: -.015em; color: var(--t); max-width: 40ch; }
.sv-mappa__vie { display: grid; gap: 10px; }
.sv-mappa__vie a { display: flex; align-items: center; gap: 14px; padding: 16px 18px; border-radius: 16px; text-decoration: none; font-size: 1.05rem; font-weight: 700; color: var(--t); background: rgba(255, 255, 255, .04); box-shadow: inset 0 0 0 1px var(--linea); transition: background .3s var(--molla), box-shadow .3s var(--molla), transform .3s var(--molla); }
.sv-mappa__vie a:hover { background: rgba(231, 89, 31, .12); box-shadow: inset 0 0 0 1.5px rgba(231, 89, 31, .6); transform: translateX(4px); }
.sv-mappa__n { font-size: .78rem; letter-spacing: .1em; color: var(--acc); }
.sv-mappa__ic { margin-left: auto; width: 30px; height: 30px; flex: none; border-radius: 50%; display: grid; place-items: center; background: rgba(255, 255, 255, .08); }
.sv-mappa__ic svg { width: 14px; height: 14px; }
.sv-mappa__vie a:hover .sv-mappa__ic { background: var(--arancio); color: #fff; }

/* ---- 2 · cosa ricevi ---- */
/* Il tour della scheda. Da fermo (schermi stretti, movimento ridotto,
   niente JS) la scheda e' in alto e i riquadri si leggono in fila sotto;
   con .sv-tour--vivo la scheda resta ferma e lo scroll muove la camera. */
.sv-tour { margin-top: clamp(36px, 5vw, 64px); }
.sv-tour__lato { margin-top: clamp(36px, 5vw, 56px); }
.sv-tour__testi { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px clamp(20px, 3vw, 40px); }
.sv-tappa { padding: 20px 22px; border-radius: 18px; background: rgba(255, 255, 255, .62); box-shadow: inset 0 0 0 1px var(--linea); }
.sv-tappa--apre { grid-column: 1 / -1; padding: 0; background: none; box-shadow: none; }
.sv-tappa--chiude, .sv-tour__piede { display: none; }
.sv-tappa__n { font-size: .78rem; font-weight: 800; letter-spacing: .1em; color: var(--acc); }
.sv-tappa__n small { font-size: inherit; color: var(--muto); }
.sv-tappa h3 { margin: 6px 0 8px; font-size: 1.25rem; line-height: 1.2; letter-spacing: -.015em; color: var(--t); }
.sv-tappa p { margin: 0; line-height: 1.55; color: var(--t2); }
.sv-tappa .sv-tappa__grande { font-size: clamp(1.15rem, 1.5vw, 1.4rem); line-height: 1.4; font-weight: 600; letter-spacing: -.01em; color: var(--t); }

.sv-tour--vivo { height: calc(100svh + 8 * 60svh); }
.sv-tour--vivo .sv-tour__palco { position: sticky; top: 0; height: 100svh; box-sizing: border-box; padding: 96px 0 32px; display: grid; grid-template-columns: minmax(0, 1.6fr) minmax(290px, .78fr); gap: clamp(28px, 4vw, 56px); align-items: center; }
.sv-tour--vivo .sv-tour__vista { position: relative; height: 100%; overflow: hidden; border-radius: 24px; background: rgba(15, 27, 61, .045); box-shadow: inset 0 0 0 1px rgba(15, 27, 61, .07); }
.sv-tour--vivo .pf-wrap { position: absolute; left: 0; top: 0; width: 1040px; max-width: none; margin: 0; transform-origin: 0 0; will-change: transform; }
.sv-tour--vivo .pf-scheda { position: relative; }
.sv-tour--vivo .sv-tour__lato { margin: 0; display: grid; gap: 30px; align-content: center; }
.sv-tour--vivo .sv-tour__testi { grid-template-columns: minmax(0, 1fr); gap: 0; }
.sv-tour--vivo .sv-tappa { grid-area: 1 / 1; align-self: center; opacity: 0; visibility: hidden; transform: translateY(16px); transition: opacity .45s var(--molla), transform .6s var(--molla), visibility 0s linear .45s; }
.sv-tour--vivo .sv-tappa.on { opacity: 1; visibility: visible; transform: none; transition-delay: 0s; }
.sv-tour--vivo .sv-tappa--chiude { display: block; }
.sv-tour--vivo .sv-tappa:not(.sv-tappa--apre):not(.sv-tappa--chiude) { padding: 28px 30px; border-radius: 22px; background: #fff; box-shadow: 0 34px 70px -34px rgba(15, 27, 61, .4), inset 0 0 0 1px rgba(15, 27, 61, .06); }
.sv-tour--vivo .sv-tappa h3 { margin: 10px 0 10px; font-size: clamp(1.4rem, 1.9vw, 1.75rem); }
.sv-tour--vivo .sv-tappa p { font-size: 1.05rem; }
.sv-tour--vivo .sv-tour__piede { display: flex; align-items: center; justify-content: space-between; gap: 18px; }
.sv-tour__barre { display: flex; gap: 6px; flex: 1; max-width: 210px; }
.sv-tour__barre i { flex: 1; height: 4px; border-radius: 4px; background: rgba(15, 27, 61, .12); transition: background .35s var(--molla); }
.sv-tour__barre i.on { background: var(--arancio); }
.sv-tour__salta { display: inline-flex; align-items: center; gap: 8px; font-size: .92rem; font-weight: 700; color: var(--t2); text-decoration: none; }
.sv-tour__salta svg { width: 14px; height: 14px; }
.sv-tour__salta:hover { color: var(--acc); }
/* la parte di cui si parla resta accesa, il resto si spegne */
.sv-tour--vivo .pf-head, .sv-tour--vivo .pf-sec, .sv-tour--vivo .pf-fondo { transition: opacity .5s var(--molla), outline-color .5s var(--molla); }
.sv-tour--vivo .pf-sec { outline: 2px solid transparent; outline-offset: 10px; border-radius: 12px; }
.sv-tour--vivo .pf-scheda.sv-fuoco .pf-head:not(.sv-qui),
.sv-tour--vivo .pf-scheda.sv-fuoco .pf-sec:not(.sv-qui),
.sv-tour--vivo .pf-scheda.sv-fuoco .pf-fondo { opacity: .22; }
.sv-tour--vivo .pf-sec.sv-qui { outline-color: rgba(231, 89, 31, .55); }
.pf-scheda .pf-pin { transition: opacity .3s var(--molla), transform .45s cubic-bezier(.2, 1.7, .4, 1), box-shadow .45s var(--molla); }
.rl-js .pf-scheda .pf-pin { opacity: .3; transform: scale(.75); }
.rl-js .pf-scheda .pf-pin.sv-acceso { opacity: 1; transform: none; }
.rl-js .pf-scheda .pf-pin.ora { transform: scale(1.18); box-shadow: 0 0 0 5px rgba(231, 89, 31, .25); }
.sv-due { display: grid; grid-template-columns: minmax(0, 1fr); gap: 18px; margin-top: clamp(40px, 5vw, 70px); }
.sv-carta { display: grid; gap: 14px; align-content: start; }
.sv-carta p { margin: 0; font-size: 1.02rem; line-height: 1.6; color: var(--t2); }
.sv-filtri { list-style: none; margin: 4px 0; padding: 0; display: grid; }
.sv-filtri li { display: grid; grid-template-columns: 92px 1fr; gap: 12px; padding: 11px 0; border-top: 1px solid var(--linea); font-size: 1rem; line-height: 1.45; color: var(--t); }
.sv-filtri li:first-child { border-top: 0; padding-top: 0; }
.sv-filtri b { padding-top: .3em; font-size: 11px; font-weight: 700; letter-spacing: .16em; text-transform: uppercase; color: var(--acc); }

/* ---- 3 · come arrivano i contatti ---- */
.sv-percorso__griglia { display: grid; grid-template-columns: minmax(0, .7fr) minmax(0, 1.3fr); gap: clamp(30px, 5vw, 80px); align-items: start; }
.sv-percorso__lato { position: sticky; top: 120px; display: grid; gap: 24px; justify-items: start; }
.sv-percorso__n { display: flex; align-items: baseline; gap: 10px; }
.sv-percorso__n b { display: inline-block; font-size: clamp(5rem, 10vw, 9rem); line-height: .85; font-weight: 800; letter-spacing: -.06em; color: var(--arancio); font-variant-numeric: tabular-nums; text-shadow: 0 0 60px rgba(231, 89, 31, .35); }
.sv-percorso__n b.cambia { animation: cambia .5s cubic-bezier(.2, .9, .3, 1.2); }
@keyframes cambia { 0% { opacity: .2; transform: translateY(18px) scale(.94); filter: blur(4px); } 100% { opacity: 1; transform: none; filter: none; } }
.sv-percorso__n span { font-size: 1.1rem; font-weight: 600; color: var(--muto); }
.sv-percorso__voci { list-style: none; margin: 0; padding: 0; display: grid; gap: 2px; counter-reset: voce; }
.sv-percorso__voci li { counter-increment: voce; display: flex; align-items: center; gap: 12px; padding: 8px 0; font-size: 1.02rem; font-weight: 600; color: var(--muto); transition: color .35s var(--molla), transform .35s var(--molla); }
.sv-percorso__voci li::before { content: counter(voce, decimal-leading-zero); width: 26px; font-size: .78rem; letter-spacing: .08em; }
.sv-percorso__voci li.fatto { color: var(--t2); }
.sv-percorso__voci li.on { color: var(--t); transform: translateX(6px); }
.sv-percorso__voci li.on::before { color: var(--acc); }
.sv-passi { grid-auto-rows: auto; gap: 22px; }
.sv-passi .passo .nucleo { display: grid; grid-template-columns: none; gap: 14px; align-items: start; padding: clamp(24px, 3vw, 40px); }
.sv-passi .passo__n { padding: 0; }
.sv-passo__t { margin: 0; font-size: clamp(1.45rem, 2.2vw, 2rem); line-height: 1.12; letter-spacing: -.03em; font-weight: 700; color: var(--t); text-wrap: balance; }
.sv-passi p { margin: 0; font-size: 1.04rem; line-height: 1.6; color: var(--t2); }
.sv-cinque { list-style: none; margin: 4px 0; padding: 0; display: grid; gap: 12px; counter-reset: cinque; }
.sv-cinque li { counter-increment: cinque; position: relative; padding-left: 40px; font-size: 1rem; line-height: 1.5; color: var(--t2); }
.sv-cinque li::before { content: counter(cinque); position: absolute; left: 0; top: -1px; width: 26px; height: 26px; border-radius: 50%; display: grid; place-items: center; font-size: .8rem; font-weight: 700; color: var(--acc); background: rgba(231, 89, 31, .14); }
.sv-cinque strong { color: var(--t); }
.sv-flusso { display: grid; gap: 10px; }
.sv-flusso p { padding: 16px 18px; border-radius: 16px; background: rgba(255, 255, 255, .04); box-shadow: inset 0 0 0 1px var(--linea); }
.sv-flusso__scarto { justify-self: center; width: 34px; height: 34px; border-radius: 50%; display: grid; place-items: center; background: rgba(231, 89, 31, .14); }
.sv-flusso__scarto svg { width: 16px; height: 16px; fill: none; stroke: #ff8a57; stroke-width: 1.8; stroke-linejoin: round; }

/* ---- 4 · i tre segmenti ---- */

/* ---- 5 · il confine ---- */
.sv-confine { display: grid; grid-template-columns: minmax(0, 1.15fr) auto minmax(0, 1fr); gap: 18px; align-items: center; margin-top: clamp(36px, 4.5vw, 56px); }
.sv-confine > .guscio { align-self: stretch; }
.sv-k { margin: 0 0 16px; font-size: 11px; font-weight: 700; letter-spacing: .18em; text-transform: uppercase; color: var(--eti-c); }
.sv-confine--noi { background: rgba(231, 89, 31, .1); box-shadow: 0 0 0 1.5px rgba(231, 89, 31, .55), 0 50px 80px -40px rgba(231, 89, 31, .4); }
.sv-confine--noi .nucleo { background: linear-gradient(165deg, #2a1f2a, #151629 70%); }
.sv-confine--noi .sv-k { color: #ff9a6b; }
.sv-confine__ponte span { display: block; padding: 18px 9px; border-radius: 999px; writing-mode: vertical-rl; transform: rotate(180deg); font-size: .82rem; font-weight: 700; letter-spacing: .06em; white-space: nowrap; color: #ff9a6b; background: rgba(231, 89, 31, .12); box-shadow: inset 0 0 0 1.5px rgba(231, 89, 31, .5); }
.sv-spunte { list-style: none; margin: 0; padding: 0; display: grid; }
.sv-spunte li { display: grid; grid-template-columns: 22px 1fr; gap: 12px; align-items: start; padding: 11px 0; border-top: 1px solid var(--linea); font-size: 1rem; line-height: 1.45; color: var(--t); }
.sv-spunte li:first-child { border-top: 0; padding-top: 0; }
.sv-spunte li::before { content: ""; width: 22px; height: 22px; border-radius: 50%; background: rgba(231, 89, 31, .18) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23ff8a57' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 12.5 4 4 8-9'/%3E%3C/svg%3E") center / 14px no-repeat; }
.sv-spunte--tu li::before { background: rgba(255, 255, 255, .08) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23f2efe9' stroke-width='2.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 12h11M13 7l5 5-5 5'/%3E%3C/svg%3E") center / 13px no-repeat; }

/* ---- 7 · i dati ---- */
.sv-dati { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: clamp(28px, 5vw, 70px); margin-top: clamp(30px, 4vw, 50px); align-items: start; }
.sv-verifica { list-style: none; margin: 0; padding: 0; display: grid; gap: 10px; }
.sv-verifica .nucleo { position: relative; padding: 16px 18px 16px 54px; font-size: 1rem; line-height: 1.5; color: var(--t2); }
.sv-verifica .nucleo::before { content: ""; position: absolute; left: 18px; top: 17px; width: 22px; height: 22px; border-radius: 50%; background: rgba(231, 89, 31, .18) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23ff8a57' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 12.5 4 4 8-9'/%3E%3C/svg%3E") center / 14px no-repeat; }
.sv-verifica strong { color: var(--t); }

/* ---- 8 · la zona ---- */
.sv-zona { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 18px; margin-top: clamp(36px, 4.5vw, 56px); }
.sv-zona .nucleo { display: grid; gap: 16px; align-content: start; }
.sv-zona p { margin: 0; font-size: 1.05rem; line-height: 1.6; color: var(--t2); }
.sv-zona strong { color: var(--t); }
.sv-zona--si { box-shadow: 0 0 0 1.5px rgba(231, 89, 31, .45); }
.sv-segno { width: 46px; height: 46px; border-radius: 50%; display: grid; place-items: center; font-size: 1.2rem; font-weight: 800; }
.sv-segno--si { color: #fff; background: var(--arancio); box-shadow: 0 0 0 6px rgba(231, 89, 31, .16); }
.sv-segno--no { color: var(--t2); background: rgba(15, 27, 61, .08); }
.sv-dopo { margin-top: clamp(26px, 3vw, 40px); }

/* ---- 9 · cosa paghi: la tabella ---- */
.sv-tabella { margin-top: clamp(36px, 4.5vw, 56px); border-radius: 26px; overflow: hidden; background: var(--g-bg); box-shadow: 0 0 0 1px var(--g-bd); }
.sv-tabella__testa, .sv-riga { display: grid; grid-template-columns: minmax(150px, .8fr) minmax(0, 1fr) minmax(0, 1.25fr); }
.sv-tabella__testa span { padding: 18px 22px; font-size: 11px; font-weight: 700; letter-spacing: .16em; text-transform: uppercase; color: var(--muto); }
.sv-riga > span { padding: 16px 22px; border-top: 1px solid var(--linea); font-size: .98rem; line-height: 1.45; color: var(--t2); }
.sv-riga > span:first-child { font-weight: 700; color: var(--t); }
.sv-tabella .is-noi { background: rgba(231, 89, 31, .09); }
.sv-tabella__testa .is-noi { color: #ff9a6b; }
.sv-riga .is-noi { color: var(--t); }
.sv-riga--fine .is-noi { background: rgba(231, 89, 31, .18); }
.sv-riga { opacity: 0; transform: translateY(16px); transition: opacity .5s var(--uscita), transform .7s var(--uscita); transition-delay: calc(var(--k, 0) * 70ms); }
.sv-tabella.in .sv-riga { opacity: 1; transform: none; }
.sv-zeri { list-style: none; margin: 18px 0 0; padding: 0; display: flex; flex-wrap: wrap; gap: 10px; }
.sv-zeri li { padding: 10px 16px; border-radius: 999px; font-size: .95rem; color: var(--t2); background: rgba(255, 255, 255, .05); box-shadow: inset 0 0 0 1px var(--linea); }
.sv-zeri b { color: #ff8a57; }

/* ---- 10 · il pacchetto ---- */
.sv-offerta { display: grid; grid-template-columns: minmax(0, 1.3fr) minmax(0, 1fr); gap: 18px; margin-top: clamp(36px, 4.5vw, 56px); }
.sv-offerta .nucleo { display: grid; gap: 14px; align-content: start; }
.sv-offerta p { margin: 0; font-size: 1.02rem; line-height: 1.6; color: var(--t2); }
.sv-offerta--grande .nucleo { --t: var(--luce); --t2: rgba(242, 239, 233, .74); background: linear-gradient(165deg, #22356a, #0f1631 75%); box-shadow: inset 0 1px 0 rgba(255, 255, 255, .1); }
.sv-offerta__tag { justify-self: start; padding: 6px 12px; border-radius: 999px; font-size: 11px; font-weight: 700; letter-spacing: .16em; text-transform: uppercase; color: #ff9a6b; background: rgba(231, 89, 31, .16); }
.sv-offerta .sv-offerta__big { font-size: clamp(1.7rem, 2.8vw, 2.5rem); line-height: 1.08; font-weight: 800; letter-spacing: -.035em; color: var(--t); }
.sv-offerta .sv-offerta__mid { font-size: 1.25rem; line-height: 1.3; font-weight: 700; color: var(--t); }
#denaro .azioni { margin-top: 28px; }

/* ---- 11 · la garanzia (componenti .patto della home) ---- */
.sv-patto { margin-top: clamp(30px, 4vw, 50px); }
.patto .patto__chiusa { font-size: .98rem; }
/* dieci voci in una colonna stretta: l'etichetta sopra, non accanto */
.sv-patto .limiti > div { grid-template-columns: minmax(0, 1fr); gap: 4px; padding: 13px 0; }

/* ---- 12 · l'accesso ---- */
.sv-frase { margin: 0; font-size: clamp(1.6rem, 2.6vw, 2.3rem); line-height: 1.12; font-weight: 800; letter-spacing: -.035em; color: var(--acc); }

/* ---- 13 · le domande ---- */
.sv-domande { display: grid; grid-template-columns: minmax(0, .8fr) minmax(0, 1.2fr); gap: clamp(30px, 5vw, 80px); align-items: start; }
.sv-domande > div:first-child { position: sticky; top: 120px; }
.sv-faq { display: grid; gap: 12px; }
.sv-faq details { padding: 0; border-radius: 22px; }
.sv-faq summary { list-style: none; cursor: pointer; display: flex; align-items: center; justify-content: space-between; gap: 16px; padding: 22px 24px; font-size: 1.1rem; font-weight: 700; line-height: 1.3; color: var(--t); }
.sv-faq summary::-webkit-details-marker { display: none; }
.sv-faq summary i { position: relative; flex: none; width: 30px; height: 30px; border-radius: 50%; background: rgba(255, 255, 255, .08); transition: background .3s var(--molla); }
.sv-faq summary i::before, .sv-faq summary i::after { content: ""; position: absolute; left: 50%; top: 50%; width: 12px; height: 2px; border-radius: 2px; background: currentColor; transform: translate(-50%, -50%); transition: transform .35s var(--molla); }
.sv-faq summary i::after { transform: translate(-50%, -50%) rotate(90deg); }
.sv-faq details[open] summary i { background: var(--arancio); }
.sv-faq details[open] summary i::after { transform: translate(-50%, -50%) rotate(0deg); }
.sv-faq details p { margin: 0; padding: 0 24px 24px; font-size: 1.02rem; line-height: 1.6; color: var(--t2); }

/* ---- 14 · la richiesta finale ---- */
.finale__testo .sv-ebook { font-size: .95rem; }
.sv-ebook a { color: var(--t); }
.sv-chiusa { margin: clamp(44px, 6vw, 80px) auto 0; max-width: 30ch; text-align: center; font-size: clamp(1.6rem, 3vw, 2.6rem); line-height: 1.15; font-weight: 700; letter-spacing: -.035em; color: var(--t); text-wrap: balance; }
.sv-chiusa span { color: var(--acc); }

/* ---- telefono ---- */
@media (max-width: 860px) {
  .sv-eroe { min-height: 100svh; align-items: flex-start; padding-top: calc(var(--sez) + 60px); }
  .sv-eroe__sfondo { background-image: url("../assets/frames/presentazione/m/100.webp"); background-size: 100% auto; background-position: 50% calc(100% + 180px); transform: none; }
  .sv-eroe__sfondo::after { background: linear-gradient(180deg, rgba(236, 232, 227, .98) 0%, rgba(236, 232, 227, .95) 50%, rgba(236, 232, 227, .55) 66%, rgba(236, 232, 227, 0) 82%), linear-gradient(0deg, rgba(236, 232, 227, .85) 0%, rgba(236, 232, 227, 0) 12%); }
  .sv-fascia__griglia, .sv-mappa, .sv-tour__testi, .sv-due, .sv-percorso__griglia, .sv-dati, .sv-zona, .sv-offerta, .sv-domande { grid-template-columns: minmax(0, 1fr); }
  .sv-percorso__lato { position: static; gap: 14px; }
  .sv-percorso__n, .sv-percorso__voci { display: none; }
  /* i passi: meno rientro per la linea, cosi' il testo non resta in una colonna stretta */
  .sv-passi { padding-left: 26px; }
  .sv-passi::before, .sv-passi::after { left: 6px; }
  .sv-passi .passo::before { left: -26px; }
  .sv-passi .passo .nucleo { padding: 20px 18px; }
  .sv-confine { grid-template-columns: minmax(0, 1fr); }
  .sv-confine__ponte { justify-self: center; }
  .sv-confine__ponte span { writing-mode: horizontal-tb; transform: none; padding: 9px 16px; }
  .sv-domande > div:first-child { position: static; }
  .sv-filtri li { grid-template-columns: 74px 1fr; }
  .sv-tabella__testa { display: none; }
  .sv-riga { grid-template-columns: minmax(0, 1fr); padding: 6px 0; border-top: 1px solid var(--linea); }
  .sv-riga:first-of-type { border-top: 0; }
  .sv-riga > span { border-top: 0; padding: 6px 18px; }
  .sv-riga > span:first-child { padding-top: 12px; }
  .sv-riga > span:nth-child(2)::before, .sv-riga > span:nth-child(3)::before { display: block; margin-bottom: 2px; font-size: 10px; font-weight: 700; letter-spacing: .16em; text-transform: uppercase; color: var(--muto); }
  .sv-riga > span:nth-child(2)::before { content: "Lo metti tu"; }
  .sv-riga > span:nth-child(3)::before { content: "Lo mettiamo noi"; color: #ff9a6b; }
  .sv-riga .is-noi { margin: 4px 10px 10px; border-radius: 12px; padding: 10px 12px !important; }
}
.ridotto .sv-riga { opacity: 1; transform: none; transition: none; }
.ridotto .sv-percorso__n b.cambia { animation: none; }

/* ==================================================================
   LA SCHEDA DEL CONTATTO, copiata identica dalla pagina di prima
   ================================================================== */
/* ===== modifica 11: la scheda del proprietario della piattaforma =====
   Ricostruita sui valori di Piattaforma-ReaLink (site-theme.css,
   dashboard.css): tema chiaro, Urbanist per titoli e numeri, Figtree
   per il testo, blu notte del marchio, beige caldo per le superfici.
   I font sono gli stessi file della piattaforma, copiati in
   assets/fonts. Tutto e' sotto .pf- e non tocca il resto del sito. */
@font-face{font-family:'Figtree';font-style:normal;font-weight:400 700;font-display:swap;src:url('../assets/fonts/figtree-latin-ext-400-700.woff2') format('woff2');unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;}
@font-face{font-family:'Figtree';font-style:normal;font-weight:400 700;font-display:swap;src:url('../assets/fonts/figtree-latin-400-700.woff2') format('woff2');unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;}
@font-face{font-family:'Urbanist';font-style:normal;font-weight:600 800;font-display:swap;src:url('../assets/fonts/urbanist-latin-ext-600-800.woff2') format('woff2');unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;}
@font-face{font-family:'Urbanist';font-style:normal;font-weight:600 800;font-display:swap;src:url('../assets/fonts/urbanist-latin-600-800.woff2') format('woff2');unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;}

.pf-wrap { max-width: 1040px; margin: 0 auto; perspective: 1400px; }
.pf-scheda {
  --pf-surface-2: #F7F3EC; --pf-ink: #001866; --pf-text: #1E2A44;
  --pf-muted: #626C84; --pf-muted-2: #737B90;
  --pf-border-2: #EFE9E0; --pf-border-strong: #D8CEC0;
  --pf-accent: #1866CC; --pf-accent-tint: #EAF2FD;
  --pf-warm: #F6A04D; --pf-warm-tint: #FFF1E2;
  --pf-succ: #6D4FD1; --pf-succ-soft: rgba(109, 79, 209, .08); --pf-succ-line: rgba(109, 79, 209, .32);
  --pf-display: 'Urbanist', 'Segoe UI Semibold', 'Segoe UI', system-ui, sans-serif;
  --pf-body: 'Figtree', 'Segoe UI', system-ui, sans-serif;
  overflow: hidden; border-radius: 18px; background: #fff;
  box-shadow: 0 2px 10px rgba(18, 42, 78, .12), 0 50px 90px -40px rgba(0, 24, 102, .6);
  font-family: var(--pf-body); font-size: 14px; line-height: 1.55; color: var(--pf-text);
  text-align: left;
}
.pf-head {
  display: flex; align-items: center; gap: 12px;
  padding: 20px 24px; border-bottom: 1px solid var(--pf-border-2);
}
.pf-avatar {
  flex: none; display: grid; place-items: center;
  width: 48px; height: 48px; border-radius: 50%;
  background: linear-gradient(180deg, #0B2A8A 0%, #001866 100%);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .2);
  font-family: var(--pf-display); font-size: 16px; font-weight: 700; letter-spacing: .02em; color: #fff;
}
.pf-id { flex: 1; min-width: 0; }
.pf-name {
  display: flex; align-items: center; gap: 8px;
  font-family: var(--pf-display); font-size: 20px; font-weight: 600; color: var(--pf-text);
}
.pf-badges { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 8px; }
.pf-badge {
  display: inline-flex; align-items: center; padding: 4px 10px; border-radius: 999px;
  border: 1px solid var(--pf-border-2); background: var(--pf-surface-2);
  font-size: 11.5px; font-weight: 600; white-space: nowrap; color: var(--pf-text);
}
.pf-badge.is-succ {
  border-color: var(--pf-succ-line); background: var(--pf-succ-soft); color: var(--pf-succ);
  font-size: 12px; font-weight: 700; letter-spacing: .02em;
}
.pf-close {
  flex: none; display: grid; place-items: center;
  width: 40px; height: 40px; border-radius: 50%;
  border: 1px solid var(--pf-border-2); background: var(--pf-surface-2);
  font-size: 20px; color: var(--pf-muted);
}

/* Le due pagine della scheda, con la piega al centro come nella piattaforma */
.pf-body {
  display: grid; grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 24px 51px; padding: 24px 32px;
  background-image: linear-gradient(90deg, rgba(0, 0, 0, 0) calc(50% - 34px), rgba(18, 42, 78, .043) 50%,
    rgba(18, 42, 78, .14) calc(50% - .5px), rgba(18, 42, 78, .14) calc(50% + .5px), rgba(0, 0, 0, 0) calc(50% + 34px));
}
.pf-pagina { display: flex; flex-direction: column; gap: 24px; min-width: 0; }
.pf-sec h4 {
  display: flex; align-items: center; gap: 8px; margin: 0 0 12px;
  font-family: var(--pf-display); font-size: 11px; font-weight: 700; line-height: 1.1;
  letter-spacing: .1em; text-transform: uppercase; color: var(--pf-muted);
}
.pf-sec h4 svg,
.pf-tel svg,
.pf-maps svg {
  flex: none; width: 14px; height: 14px;
  fill: none; stroke: var(--pf-accent); stroke-width: 2; stroke-linecap: round; stroke-linejoin: round;
}
.pf-tel svg, .pf-maps svg { width: 16px; height: 16px; }

.pf-tels { display: flex; flex-direction: column; gap: 8px; }
.pf-tel {
  display: flex; align-items: center; gap: 10px; padding: 11px 16px;
  border: 1px solid var(--pf-border-2); border-radius: 14px; background: var(--pf-surface-2);
  font-size: 14px; font-variant-numeric: tabular-nums;
  transition: border-color .16s ease, background-color .16s ease;
}
.pf-tel__n { flex: 1; min-width: 0; overflow-wrap: anywhere; font-weight: 600; letter-spacing: .01em; }
.pf-tel.is-mail { font-size: 13px; }
.pf-tel.is-mail .pf-tel__n { font-weight: 500; }
.pf-tel__cta {
  flex: none; padding: 4px 10px; border-radius: 999px; background: var(--pf-warm-tint);
  font-size: 11px; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; color: var(--pf-ink);
  transition: background-color .16s ease;
}
.pf-tel:hover { border-color: var(--pf-accent); background: var(--pf-accent-tint); }
.pf-tel:hover .pf-tel__cta { background: var(--pf-warm); }
.pf-maps {
  display: flex; align-items: center; justify-content: center; gap: 9px;
  margin-top: 10px; padding: 10px; border: 1px solid var(--pf-muted-2); border-radius: 14px;
  background: #fff; font-size: 13px; font-weight: 600; color: var(--pf-muted);
}
.pf-nota {
  min-height: 88px; padding: 11px 14px;
  border: 1px solid var(--pf-muted-2); border-radius: 14px; background: var(--pf-surface-2);
}
.pf-nota-bar {
  display: flex; align-items: center; justify-content: space-between; gap: 12px;
  margin-top: 10px; font-size: 11.5px; color: var(--pf-muted);
}
.pf-btn {
  padding: 7px 12px; border: 1px solid var(--pf-border-2); border-radius: 14px;
  font-size: 13px; font-weight: 600; color: var(--pf-text); opacity: .45;
}

.pf-dl { display: flex; flex-direction: column; margin: 0; }
.pf-row {
  display: grid; grid-template-columns: minmax(120px, 38%) 1fr; gap: 10px;
  padding: 8px 0; border-bottom: 1px solid var(--pf-border-2); font-size: 13px;
}
.pf-row:last-child { border-bottom: 0; }
.pf-row dt { font-weight: 500; color: var(--pf-muted); }
.pf-row dd { margin: 0; overflow-wrap: anywhere; font-weight: 500; color: var(--pf-text); }

.pf-nucleo {
  display: flex; align-items: center; gap: 10px; margin-bottom: 8px; padding: 10px 12px;
  border: 1px solid var(--pf-border-2); border-radius: 14px; background: var(--pf-surface-2);
}
.pf-nucleo .pf-avatar { width: 30px; height: 30px; font-size: 11px; }
.pf-nucleo b { display: block; font-size: 13px; }
.pf-nucleo small { display: block; font-size: 11.5px; color: var(--pf-muted); }

.pf-forbice {
  display: flex; flex-wrap: wrap; align-items: baseline; gap: 8px;
  font-family: var(--pf-display); font-size: 23.2px; font-weight: 600; color: var(--pf-ink);
  font-variant-numeric: tabular-nums;
}
.pf-tratto { font-weight: 400; color: var(--pf-muted); }
.pf-centrale { margin: 4px 0 0; font-size: 12.5px; color: var(--pf-muted); font-variant-numeric: tabular-nums; }
.pf-zone { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; margin-top: 12px; font-size: 12px; color: var(--pf-muted); }
.pf-zona {
  padding: 4px 10px; border: 1px solid var(--pf-border-strong); border-radius: 999px;
  background: #fff; font-size: 12px; font-weight: 500; color: var(--pf-text);
}
.pf-zona.is-scelta { border-color: var(--pf-accent); background: var(--pf-accent-tint); color: var(--pf-ink); }

.pf-fondo {
  grid-column: 1 / -1; margin: 0; padding-top: 14px;
  border-top: 1px solid var(--pf-border-2); font-size: 11px; line-height: 1.6; color: var(--pf-muted);
}

/* Il rimando alla legenda: arancio del sito, non della piattaforma,
   cosi si capisce che e' un'annotazione e non un pezzo della scheda. */
.pf-pin {
  display: inline-grid; place-items: center; flex: none;
  width: 18px; height: 18px; border-radius: 50%; background: var(--arancio);
  font-family: var(--font); font-size: 10px; font-style: normal; font-weight: 800;
  letter-spacing: 0; text-transform: none; color: #fff;
}
/* Entrata: la scheda si apre come nella piattaforma, una pagina e poi
   l'altra. Una volta sola, quando il blocco entra nello schermo. */
.rl-js .pf-wrap .pf-pagina { opacity: 0; transform: rotateY(-7deg) translateY(12px); transform-origin: 100% 50%; }
.rl-js .pf-wrap .pf-pagina + .pf-pagina { transform: rotateY(7deg) translateY(12px); transform-origin: 0 50%; }
.rl-js .pf-wrap.rl-in .pf-pagina { animation: pf-apri .8s cubic-bezier(.22, 1, .36, 1) .2s forwards; }
.rl-js .pf-wrap.rl-in .pf-pagina + .pf-pagina { animation-delay: .38s; }
@keyframes pf-apri { to { opacity: 1; transform: none; } }

@media (max-width: 760px) {
  .pf-head { padding: 16px 18px; }
  .pf-body { grid-template-columns: minmax(0, 1fr); padding: 18px; background-image: none; }
  .pf-row { grid-template-columns: minmax(0, 1fr); gap: 2px; }
  .pf-row dt { font-size: 11px; letter-spacing: .05em; text-transform: uppercase; }
}
@media (prefers-reduced-motion: reduce) {
  .rl-js .pf-wrap .pf-pagina { opacity: 1; transform: none; animation: none !important; }
  .pf-tel, .pf-tel__cta { transition: none; }
}


/* ==================================================================
   Pagina rifatta il 26/10/2026: dieci sezioni, tutto fermo tranne il tour
   ================================================================== */
.sv-eroe__sotto { margin: clamp(18px, 2.4vw, 28px) 0 0; max-width: 56ch; font-size: clamp(1.02rem, 1.3vw, 1.18rem); line-height: 1.6; color: var(--t2); }

/* il problema: a sinistra la figura, a destra il ponte con i tre collegamenti */
.sv-fascia__griglia .sv-mappa { margin: 0; padding: 0; border: 0; grid-template-columns: minmax(0, 1fr); gap: 24px; }

/* come arrivano: sette passi; su desktop le schede stanno in un riquadro
   fermo a lato e si danno il cambio, sul telefono ognuna sopra il suo passo */
.sv-viaggio { margin-top: clamp(30px, 4vw, 56px); }
.sv-viaggio__passi { list-style: none; margin: 0; padding: 0; display: grid; gap: clamp(28px, 4vw, 44px); }
.sv-viaggio__passo { display: grid; gap: 18px; }
.sv-viaggio__testo { display: grid; gap: 12px; align-content: start; }
.sv-viaggio__n { font-size: clamp(2.2rem, 3.6vw, 3.2rem); line-height: .9; font-weight: 800; letter-spacing: -.05em; color: var(--arancio); font-variant-numeric: tabular-nums; }
.sv-viaggio__t { margin: 0; font-size: clamp(1.35rem, 2vw, 1.8rem); line-height: 1.15; letter-spacing: -.03em; font-weight: 700; color: var(--t); text-wrap: balance; }
.sv-viaggio__testo > p { margin: 0; font-size: 1.04rem; line-height: 1.6; color: var(--t2); }
.sv-viaggio__lato { display: none; }

/* le schede di Marta: carte chiare sul fondo scuro */
.sv-v { display: grid; gap: 14px; padding: 22px; border-radius: 22px; background: #f6f4f0; color: #1d2433; box-shadow: 0 40px 70px -40px rgba(0, 0, 0, .85), 0 0 0 1px rgba(255, 255, 255, .06); font-size: .95rem; }
.sv-v__k { font-size: .72rem; font-weight: 800; letter-spacing: .14em; text-transform: uppercase; color: #8b8f99; }
.sv-v__chi { display: flex; align-items: center; gap: 12px; }
.sv-v__chi img { width: 48px; height: 48px; border-radius: 50%; object-fit: cover; }
.sv-v__chi span { display: grid; font-size: .85rem; color: #6b7280; }
.sv-v__chi b { font-size: 1rem; color: #1d2433; }
.sv-v__chips { display: flex; flex-wrap: wrap; gap: 6px; }
.sv-v__chip { padding: 5px 11px; border-radius: 999px; font-size: .8rem; font-weight: 700; background: #fff; box-shadow: inset 0 0 0 1px rgba(231, 89, 31, .4); }
.sv-v__gruppo, .sv-v__stato { display: flex; align-items: center; gap: 10px; font-size: .88rem; font-weight: 600; color: #1d2433; }
.sv-v__gruppo i, .sv-v__stato i { width: 10px; height: 10px; border-radius: 50%; background: #25d366; box-shadow: 0 0 0 4px rgba(37, 211, 102, .18); }
.sv-v__nome { font-size: 1.25rem; letter-spacing: .02em; }
.sv-v__righe { display: flex; flex-wrap: wrap; gap: 8px 18px; font-size: .88rem; color: #6b7280; }
.sv-v__righe b { color: #1d2433; }
.sv-v__abbina { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; font-variant-numeric: tabular-nums; }
.sv-v__cf { padding: 6px 10px; border-radius: 10px; background: #e9e5de; font-weight: 700; letter-spacing: .04em; }
.sv-v__freccia { color: var(--arancio); font-weight: 800; }
.sv-v__tel { display: inline-flex; align-items: center; gap: 8px; padding: 6px 10px; border-radius: 10px; background: #fff; font-weight: 700; box-shadow: inset 0 0 0 1px rgba(15, 27, 61, .1); }
.sv-v__ok { display: inline-grid; place-items: center; width: 18px; height: 18px; border-radius: 50%; font-size: .7rem; font-style: normal; color: #fff; background: #1f9d55; }
.sv-v__scarti { list-style: none; margin: 0; padding: 0; display: grid; gap: 6px; }
.sv-v__scarti li { font-size: .85rem; color: #9aa0ab; text-decoration: line-through; text-decoration-color: #d93a2b; text-decoration-thickness: 2px; }
.sv-v__check { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 10px 12px; border-radius: 12px; background: #fff; box-shadow: inset 0 0 0 1px rgba(15, 27, 61, .08); }
.sv-v__check span { font-size: .88rem; color: #6b7280; }
.sv-v__check b { display: inline-flex; align-items: center; gap: 8px; font-size: .9rem; }
.sv-v__lista { display: grid; gap: 6px; }
.sv-v__lista div { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 2px 10px; padding: 10px 12px; border-radius: 12px; background: #fff; opacity: .6; }
.sv-v__lista div.is-lei { opacity: 1; box-shadow: inset 0 0 0 1.5px var(--arancio); }
.sv-v__lista b { font-size: .92rem; }
.sv-v__lista span { grid-column: 1; font-size: .8rem; color: #6b7280; }
.sv-v__lista em { grid-column: 2; grid-row: 1 / span 2; align-self: center; padding: 4px 9px; border-radius: 999px; font-size: .72rem; font-style: normal; font-weight: 700; color: #6d4fd1; background: rgba(109, 79, 209, .1); }
.sv-v__numero { display: grid; gap: 2px; padding: 12px 14px; border-radius: 12px; background: #fff; }
.sv-v__numero span { font-size: .8rem; color: #6b7280; }
.sv-v__numero b { font-size: 1.1rem; letter-spacing: .04em; }
.sv-v--chat { background: #ece5dd; }
.sv-v__msg { position: relative; max-width: 82%; padding: 10px 12px 18px; border-radius: 14px; font-size: .95rem; }
.sv-v__msg small { position: absolute; right: 10px; bottom: 4px; font-size: .68rem; color: #7b8288; }
.sv-v__msg--tuo { justify-self: end; display: grid; gap: 7px; width: 82%; background: #d9fdd3; border-top-right-radius: 4px; }
.sv-v__msg--tuo i { display: block; height: 8px; border-radius: 4px; background: rgba(17, 27, 33, .14); }
.sv-v__msg--tuo i.corta { width: 55%; }
.sv-v__msg--suo { justify-self: start; padding-right: 48px; font-weight: 600; background: #fff; border-top-left-radius: 4px; }

@media (min-width: 1000px) {
  .sv-viaggio { display: grid; grid-template-columns: minmax(0, 1fr) minmax(340px, 420px); gap: clamp(40px, 6vw, 90px); align-items: start; }
  .sv-viaggio__passi { gap: 0; }
  .sv-viaggio__passo { padding: clamp(40px, 9vh, 90px) 0; border-top: 1px solid var(--linea); transition: opacity .45s var(--molla); }
  .rl-js .sv-viaggio__passo { opacity: .4; }
  .sv-viaggio__passo:first-child { border-top: 0; padding-top: 0; }
  .rl-js .sv-viaggio__passo.on { opacity: 1; }
  .rl-js .sv-viaggio__passo .sv-viaggio__vis { display: none; }
  .rl-js .sv-viaggio__lato { display: block; position: sticky; top: calc(50vh - 170px); }
  /* senza JS o col movimento ridotto: ogni scheda accanto al suo passo, tutto acceso */
  .sv-viaggio__passo { grid-template-columns: minmax(0, 1fr); }
  .ridotto .sv-viaggio { display: block; }
  .ridotto .sv-viaggio__lato { display: none; }
  .ridotto .sv-viaggio__passo, .ridotto .sv-viaggio__passo.on { opacity: 1; }
  .ridotto .sv-viaggio__passo .sv-viaggio__vis { display: block; max-width: 420px; }
  .sv-viaggio__schermo { display: grid; }
  .sv-viaggio__schermo > .sv-v { grid-area: 1 / 1; align-self: start; opacity: 0; visibility: hidden; transform: translateY(14px) scale(.98); transition: opacity .45s var(--molla), transform .55s var(--molla), visibility 0s linear .45s; }
  .sv-viaggio__schermo > .sv-v.on { opacity: 1; visibility: visible; transform: none; transition-delay: 0s; }
}
.ridotto .sv-viaggio__passo, .ridotto .sv-viaggio__schermo > .sv-v { transition: none; }

/* chi fa cosa, su fondo chiaro: la carta «noi» resta scura e accesa */
.sv-chi .sv-confine--noi .nucleo { --t: var(--luce); --t2: rgba(242, 239, 233, .74); --linea: rgba(255, 255, 255, .1); }
.sv-chi .sv-spunte--tu li::before { background: rgba(15, 27, 61, .08) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%230f1b3d' stroke-width='2.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 12.5 4 4 8-9'/%3E%3C/svg%3E") center / 13px no-repeat; }
.sv-chi .sv-confine__ponte span { color: var(--t); }
.sv-chi .sv-dati { margin-top: clamp(56px, 7vw, 96px); }

/* cosa resta tuo: quattro righe, due per lato */
#resta .sv-segno--no { color: var(--t2); background: rgba(255, 255, 255, .08); }

/* cosa paghi, su fondo chiaro */
.sv-paghi .sv-tabella__testa .is-noi { color: var(--acc); }
.sv-paghi .sv-zeri li { background: rgba(255, 255, 255, .6); }
.sv-paghi .sv-zeri b { color: var(--acc); }
.sv-rischio { margin-top: clamp(40px, 5vw, 64px); max-width: 72ch; display: grid; gap: 12px; }
.sv-rischio p { margin: 0; font-size: 1.05rem; line-height: 1.65; color: var(--t2); }
.sv-paghi__pacchetto { margin-top: clamp(48px, 6vw, 80px); }
.sv-paghi .sv-paghi__pacchetto + .corpo { margin-top: 10px; }
.sv-paghi .sv-offerta { margin-top: clamp(24px, 3vw, 36px); }

/* le domande, su fondo chiaro */
#domande .sv-faq summary i { background: rgba(15, 27, 61, .08); }
#domande .sv-faq details[open] summary i { color: #fff; background: var(--arancio); }

@media (max-width: 860px) {
  .sv-chi .sv-confine__ponte span { color: var(--t); }
  .sv-paghi .sv-riga > span:nth-child(3)::before { color: var(--acc); }
}