body.variante-v3 {
  --larghezza-sidebar: clamp(380px, 30vw, 480px);
  --altezza-footer: calc(3.5rem + env(safe-area-inset-bottom, 0px));
  padding-bottom: var(--altezza-footer);
}
.footer-v3 {
  position: fixed; z-index: 21; inset: auto 0 0;
  height: var(--altezza-footer); padding: 0 clamp(1.25rem, 4vw, 4rem) env(safe-area-inset-bottom, 0px);
  display: flex; align-items: center; gap: 1.5rem;
  background: #fcfcff; border-top: 1px solid var(--filo); font-size: .75rem;
}
.footer-v3 .marchio { font-size: 1.3rem; }
.footer-v3 > span { color: var(--tenue); }
.footer-v3 > a:last-child { margin-left: auto; white-space: nowrap; }
@media (min-width: 1000px) {
  body:has(#sidebar:not([hidden])) .footer-v3 { right: var(--larghezza-sidebar); }
}
@media (max-width: 999px) {
  body.variante-v3 #sidebar { bottom: var(--altezza-footer); }
  body.variante-v3:has(#sidebar:not([hidden])) { padding-bottom: calc(max(27dvh, 150px) + var(--altezza-footer)); }
  .footer-v3 { gap: .75rem; }
}
@media (max-width: 380px) { .footer-v3 > span { display: none; } }

/* Ogni tappa nasce chiusa. La scelta esplicita precede l'ipotesi di Jev.
   data-tieni conserva il percorso già emerso, anche se cambia l'ipotesi. */
@property --v3-prossimo-impatto { syntax: "<number>"; inherits: true; initial-value: 0; }
@property --v3-prossimo-perchi { syntax: "<number>"; inherits: true; initial-value: 0; }
@property --v3-prossimo-come { syntax: "<number>"; inherits: true; initial-value: 0; }
@property --v3-prossimo-fiducia { syntax: "<number>"; inherits: true; initial-value: 0; }
@property --v3-prossimo-prezzi { syntax: "<number>"; inherits: true; initial-value: 0; }
@property --v3-prossimo-contatto { syntax: "<number>"; inherits: true; initial-value: 0; }
@property --candidata { syntax: "<number>"; inherits: false; initial-value: 0; }
@property --v3-prossimo-verifica { syntax: "<number>"; inherits: true; initial-value: 0; }
@property --v3-prossimo-passo { syntax: "<number>"; inherits: true; initial-value: 0; }
@property --v3-domanda-risultati { syntax: "<number>"; inherits: true; initial-value: 0; }
@property --v3-domanda-dati { syntax: "<number>"; inherits: true; initial-value: 0; }
@property --v3-domanda-contatto { syntax: "<number>"; inherits: true; initial-value: 0; }
@property --v3-domanda-esplora { syntax: "<number>"; inherits: true; initial-value: 0; }
@property --v3-esposta { syntax: "<number>"; inherits: true; initial-value: 0; }

/* Una comparsa esaurisce il gesto: serve una nuova interazione per proseguire.
   Le scelte dirette restano immediate attraverso --aperto. */
@property --v3-risposta-attuale { syntax: "<number>"; inherits: true; initial-value: 0; }
@property --v3-gesto-dopo-tappa { syntax: "<number>"; inherits: true; initial-value: 0; }
.tappa-v3 {
  --presenza: max(var(--aperto), min(var(--v3-risposta-attuale), var(--v3-gesto-dopo-tappa), clamp(0, (var(--candidata) - .55) * 4, 1)));
}
/* Una maggioranza netta basta per un approfondimento informativo reversibile.
   Con probabilità arrotondate a due decimali apre da .51: non apre due alternative.
   Offerte, contatto e invito mantengono la soglia prudente precedente. */
:is(#tappa-impatto, #tappa-perchi, #tappa-come, #tappa-fiducia, #tappa-verifica) {
  --presenza: max(var(--aperto), min(var(--v3-risposta-attuale), var(--v3-gesto-dopo-tappa), clamp(0, (var(--candidata) - .5) * 100, 1)));
}
#tappa-impatto { --candidata: var(--v3-prossimo-impatto); }
#tappa-perchi { --candidata: var(--v3-prossimo-perchi); }
#tappa-come { --candidata: var(--v3-prossimo-come); }
#tappa-fiducia { --candidata: var(--v3-prossimo-fiducia); }
#tappa-prezzi { --candidata: var(--v3-prossimo-prezzi); }
#tappa-contatto { --candidata: var(--v3-prossimo-contatto); }
#tappa-verifica { --candidata: var(--v3-prossimo-verifica); }
#tappa-passo { --candidata: min(var(--v3-prossimo-passo), max(var(--v3-domanda-risultati), var(--v3-domanda-dati), var(--v3-domanda-contatto), var(--v3-domanda-esplora))); }
/* La scelta sul contenitore non forza l'apertura dei dettagli al suo interno. */
.tappa-v3 > .sezione { --aperto: 0; --chiuso: 0; border-top: 1px solid var(--filo); min-height: 0; }
.variante-v3 .sezione:not(#apertura) { padding-block: clamp(2.65rem, 4.24cqw, 4.77rem); }
.variante-v3 .due-colonne { gap: clamp(2rem, 4cqw, 4rem); }
.lettura-v3 { margin-top: 1.75rem; display: grid; gap: 1.2rem; }
.lettura-v3 h3 { font-size: 1rem; margin-bottom: .4rem; letter-spacing: -.01em; }
.lettura-v3 p { font-size: .95rem; line-height: 1.7; max-width: 55ch; margin-bottom: 0; }
.diagramma-v3 { margin: 1.75rem 0 0; max-width: 34rem; }
.diagramma-v3 img { display: block; width: 100%; height: auto; }
.diagramma-v3 figcaption { margin-top: .65rem; color: var(--tenue); font-size: .75rem; line-height: 1.5; max-width: 55ch; }
.scelte-v3 { display: flex; flex-wrap: wrap; gap: .7rem; margin-top: 2rem; padding-top: 1.5rem; border-top: 1px solid var(--filo); }
.scelte-v3 > h2 { flex-basis: 100%; margin: 0; font-size: clamp(1.3rem, 2cqw, 1.65rem); line-height: 1.2; letter-spacing: -.025em; }
.scelte-v3 > p { flex-basis: 100%; max-width: none; margin: 0 0 .35rem; font-size: .85rem; line-height: 1.55; }
.scelte-v3 .bottone { font-size: .85rem; padding: .8rem 1rem; min-height: 44px; }
@container (max-width: 500px) {
  .scelte-v3 { gap: .65rem; margin-top: 1.5rem; }
  .scelte-v3 .bottone { flex-basis: 100%; justify-content: space-between; }
  .scelte-v3 .bottone::after { content: "↗"; margin-left: .7rem; }
}
.racconto-v3 { max-width: 54rem; }
.verifica-visuale-v3 { display: grid; grid-template-columns: minmax(0, 1.2fr) minmax(0, .8fr); gap: clamp(2rem, 5cqw, 5rem); align-items: center; }
.infografica-verifica-v3 { width: 100%; max-width: 30rem; margin: 0; justify-self: end; transform: rotate(2deg); }
.infografica-verifica-v3 img { display: block; width: 100%; height: auto; }
/* Stesse coordinate nello schermo: le orbite proseguono tra verifica e invito. */
.variante-v3 #verifica, .variante-v3 #passo {
  background-image: url('/immagini/orbite-v3.svg');
  background-size: max(100vw, 1100px) max(1400px, calc(100vh + 240px));
  background-position: inherit;
  background-attachment: fixed;
  background-repeat: no-repeat;
}
@media (prefers-reduced-motion: no-preference) {
  body.variante-v3 { animation: orbite-v3 28s ease-in-out infinite alternate; }
}
@keyframes orbite-v3 {
  from { background-position: 50% 0; }
  to { background-position: calc(50% + 70px) -100px; }
}
html[data-collaudo] body.variante-v3 { animation: none; }
@container (max-width: 760px) {
  .verifica-visuale-v3 { grid-template-columns: 1fr; }
  .infografica-verifica-v3 { max-width: 26rem; justify-self: center; transform: none; }
}
#verifica, #passo { min-height: 0; }
.approfondimenti-v3 { margin-top: 2.5rem; border-top: 1px solid var(--filo); }
.approfondimenti-v3 details { border-bottom: 1px solid var(--filo); padding: 1.25rem 0; }
.approfondimenti-v3 summary { cursor: pointer; font-size: 1.2rem; font-weight: 600; }
.approfondimenti-v3 details p { margin: 1rem 0 0; max-width: 42rem; }
.continua-v3 { display: inline-block; margin-top: 2rem; }
.invito-v3 .azioni { margin-top: 2rem; }
/* Solo il contenuto nuovo: nessun movimento della pagina già letta. */
.tappa-v3[data-aperto="1"]:not([data-origine="scelta"]) .interno {
  animation: apparizione-v3 .8s cubic-bezier(.2,.7,.2,1) both;
  animation-delay: calc((1 - var(--v3-esposta)) * 86400s);
}
@keyframes apparizione-v3 {
  from { opacity: 0; filter: blur(5px); transform: translateY(18px); }
  to { opacity: 1; filter: blur(0); transform: translateY(0); }
}
@media (prefers-reduced-motion: reduce) {
  .tappa-v3[data-aperto="1"]:not([data-origine="scelta"]) .interno { animation: none; }
}
html[data-collaudo] .tappa-v3 .interno { animation: none; }

/* Colore come ritmo del racconto: avorio, albicocca e verde profondo. */
body.variante-v3 {
  --inchiostro: #183c38; --tenue: #536a64; --accento: #216b5c;
  --carta: #fffaf1; --superficie: #fffdf8; --filo: #cbd9cc;
  --fondo: #e7efdd; --azzurro: #dbeccf;
  background: var(--carta); color: var(--inchiostro);
}
.variante-v3 .barra-alta, .variante-v3 .footer-v3 { background: #fffaf1f5; }
.variante-v3 #apertura { background: #f5efd9; }
.variante-v3 .esempio-hero { background: #174f46; }
.variante-v3 .esempio-hero p { color: #e0eee0; }
.variante-v3 .percorsi-visivi strong { color: #216b5c; }
/* La scelta esplicita nella hero porta davanti il contenuto corrispondente.
   Si animano solo trasformazioni: le tre righe occupano sempre lo stesso spazio. */
.variante-v3 .percorsi-visivi { display: grid; grid-auto-rows: 1fr; gap: .5rem; }
.variante-v3 .percorsi-visivi > div {
  margin: 0; position: relative;
  transition: translate 950ms cubic-bezier(.22, 1, .36, 1),
    scale 950ms cubic-bezier(.22, 1, .36, 1), background-color 600ms ease,
    box-shadow 600ms ease;
}
.variante-v3 .esempio-hero:hover .percorsi-visivi > div { transform: none; }
.variante-v3 .hero:has(.scelte-v3 a[href="#impatto"]:is(:hover, :focus-visible)) .percorsi-visivi > div:nth-child(1),
.variante-v3 .hero:has(.scelte-v3 a[href="#perchi"]:is(:hover, :focus-visible)) .percorsi-visivi > div:nth-child(2),
.variante-v3 .hero:has(.scelte-v3 a[href="#fiducia"]:is(:hover, :focus-visible)) .percorsi-visivi > div:nth-child(3) {
  background: #dbe8a9; scale: 1.025; z-index: 2;
  box-shadow: 0 8px 24px #092e3426;
}
.variante-v3 .hero:has(.scelte-v3 a[href="#perchi"]:is(:hover, :focus-visible)) .percorsi-visivi > div:nth-child(1) {
  translate: 0 calc(100% + .5rem);
}
.variante-v3 .hero:has(.scelte-v3 a[href="#perchi"]:is(:hover, :focus-visible)) .percorsi-visivi > div:nth-child(2) {
  translate: .5rem calc(-100% - .5rem);
}
.variante-v3 .hero:has(.scelte-v3 a[href="#fiducia"]:is(:hover, :focus-visible)) .percorsi-visivi > div:nth-child(-n+2) {
  translate: 0 calc(100% + .5rem);
}
.variante-v3 .hero:has(.scelte-v3 a[href="#fiducia"]:is(:hover, :focus-visible)) .percorsi-visivi > div:nth-child(3) {
  translate: .5rem calc(-200% - 1rem);
}
.variante-v3 .hero:has(.scelte-v3 a[href="#impatto"]:is(:hover, :focus-visible)) .percorsi-visivi > div:nth-child(1) {
  translate: .5rem 0;
}
@media (prefers-reduced-motion: reduce) {
  .variante-v3 .percorsi-visivi > div { transition: none; }
}
html[data-collaudo] .variante-v3 .percorsi-visivi > div { transition: none; }
.variante-v3 .bottone:hover { background: #174f46; box-shadow: 0 5px 0 #173c3818; }
.variante-v3 .bottone.secondario:hover { background: #dbeccf; }
.variante-v3 #impatto, .variante-v3 #verifica { background-color: #f5d2b3; }
.variante-v3 #perchi, .variante-v3 #prezzi { background: #fffaf1; }
.variante-v3 #fiducia { background: #e5edda; }
.variante-v3 #come {
  background: #173f39; --inchiostro: #fffaf1; --tenue: #d7e5d9;
  --accento: #d9ec9e; --filo: #ffffff35; color: var(--inchiostro);
}
.variante-v3 #come .aspetto > .link, .variante-v3 #come .dettaglio > p { color: #d9ec9e; }
.variante-v3 .scheda-profilo[data-profilo="agenzia"] { background: #e1ebcd; }
.variante-v3 .scheda-profilo[data-profilo="azienda"] { background: #d8e9e1; }
.variante-v3 #passo { background-color: #dbe8a9; }
/* La chiusura contrasta con le sezioni chiare, anche quando cambia il percorso.
   Il metodo è già scuro: se precede il modulo, la chiusura diventa albicocca. */
.variante-v3 #contatto {
  background-color: #173f39;
  --inchiostro: #fffaf1; --tenue: #d7e5d9; --filo: #ffffff35;
  color: var(--inchiostro);
}
.variante-v3 #tappa-come[data-aperto="1"] + #tappa-contatto #contatto {
  background-color: #f5d2b3;
  --inchiostro: #183c38; --tenue: #425c54; --filo: #cbd9cc;
}
.variante-v3 .calcolatore { box-shadow: 0 12px 0 #b3c9b45c; }
.variante-v3 .modulo { --inchiostro: #183c38; --tenue: #536a64; --accento: #216b5c; --filo: #cbd9cc; color: var(--inchiostro); background: #fffdf8; }
.variante-v3 .modulo input[type="email"], .variante-v3 .modulo select { border-color: #a9bfb1; }
.variante-v3 #sidebar, .variante-v3 #sidebar header { background: #edf1e8; }
.variante-v3 #sidebar .inviato { background: #dfe7d7; }
.variante-v3 #avviso-motore { background: #173f39; color: #fffaf1; }

/* Il modulo è la coda stabile: nuovi contenuti lo accompagnano verso il basso. */
@property --v3-convertito { syntax: "<number>"; inherits: true; initial-value: 0; }
@property --v3-in-navigazione { syntax: "<number>"; inherits: true; initial-value: 0; }
.variante-v3 #sezioni { overflow-anchor: none; }

/* Un solo tempo decorativo, ereditato anche dalle tappe aperte più tardi. */
.variante-v3 .pagina-b, .variante-v3 #sezioni, .variante-v3 .tappa-v3 { background-position: inherit; }
.come-visuale-v3 { display: grid; grid-template-columns: minmax(0, 1.15fr) minmax(0, .85fr); gap: clamp(2rem, 5cqw, 5rem); align-items: center; margin-bottom: 2.5rem; }
.attenzione-v3 { padding: clamp(1.4rem, 3cqw, 2.5rem); border: 1px solid var(--filo); border-radius: 1.5rem; background: #f8f5e9; color: #163f38; }
.attenzione-v3 .occhiello-attenzione { font-size: .68rem; letter-spacing: .14em; margin-bottom: 1rem; }
.attenzione-v3 h3 { font-size: clamp(1.4rem, 2.4cqw, 2rem); line-height: 1.15; max-width: 17ch; }
.attenzione-v3 ol { list-style: none; counter-reset: passi; margin: 1.5rem 0; padding: 0; }
.attenzione-v3 li { counter-increment: passi; position: relative; padding: 0 0 1.3rem 3rem; border-left: 1px solid #9eb6a8; margin-left: 1rem; }
.attenzione-v3 li:last-child { padding-bottom: 0; border-color: transparent; }
.attenzione-v3 li::before { content: counter(passi, decimal-leading-zero); position: absolute; left: -1rem; top: -.15rem; width: 2rem; height: 2rem; display: grid; place-items: center; background: #dce8a9; border-radius: 50%; font-size: .7rem; }
.attenzione-v3 li:last-child::before { background: #f5d2b0; }
.attenzione-v3 li p { font-size: .86rem; line-height: 1.55; margin-top: .3rem; color: #45625a; }
.fonti-attenzione { font-size: .75rem; border-top: 1px solid var(--filo); padding-top: .8rem; margin-top: 1rem; }
.fonti-attenzione summary { cursor: pointer; }
.fonti-attenzione a { display: block; margin-top: .7rem; text-decoration: underline; }
@container (max-width: 760px) { .come-visuale-v3 { grid-template-columns: 1fr; } }
.variante-v3 #come .attenzione-v3 p { color: #45625a; }
.variante-v3 #come .attenzione-v3 a { color: #216b5b; }

/* Il percorso del pilota affianca le proposte; il contatto resta essenziale. */
.variante-v3 #prezzi > .interno > div > .testa { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); column-gap: clamp(2rem, 4cqw, 4rem); }
.variante-v3 #prezzi .testa > h2, .variante-v3 #prezzi .testa > p, .variante-v3 #prezzi .testa > .lettura-v3 { grid-column: 1; }
.variante-v3 #prezzi .testa > .diagramma-v3 { grid-column: 2; grid-row: 1 / span 3; align-self: center; margin-top: 0; }
@container (max-width: 760px) {
  .variante-v3 #prezzi > .interno > div > .testa { display: block; }
  .variante-v3 #prezzi .testa > .diagramma-v3 { margin-top: 1.75rem; }
}
.variante-v3 #prezzi > .interno > div > .testa { max-width: none; }

/* Hero desktop a schermo pieno, esclusi gli elementi persistenti. */
@media (min-width: 1000px) {
  .variante-v3 .barra-alta { height: 4.75rem; }
  @container (min-width: 761px) {
    .variante-v3 #apertura {
      min-height: calc(100dvh - var(--altezza-avviso) - 4.75rem - var(--altezza-footer));
      display: grid;
      align-items: center;
      padding-block: clamp(2.65rem, 4.24cqw, 4.77rem);
    }
  }
}
/* Su schermi stretti l’altezza segue testo e pulsanti, senza vuoti forzati. */
@container (max-width: 760px) {
  .variante-v3 #apertura { min-height: 0; padding-block: clamp(2rem, 6cqw, 3.5rem); }
}

/* Punto e cornice della hero condividono lo stesso ciclo cromatico. */
.variante-v3 .marchio .punto {
  color: #111111;
  font-family: Georgia, "Times New Roman", serif;
  font-size: calc(1em + 1px);
}
.variante-v3 .esempio-hero::before { color: #111111; border-color: currentColor; }
@media (prefers-reduced-motion: no-preference) {
  .variante-v3 .marchio .punto,
  .variante-v3 .esempio-hero::before { animation: punto-cromatico-v3 14s ease-in-out infinite; }
}
@keyframes punto-cromatico-v3 {
  0%, 6%, 100% { color: #111111; }
  12% { color: #f386a1; }
  18% { color: #D45BB6; }
  29% { color: #a447ff; }
  40% { color: #21c6ee; }
  51% { color: #20db81; }
  63% { color: #b9f500; }
  75% { color: #ffe000; }
  86% { color: #ffab24; }
  94% { color: #885020; }
}
html[data-collaudo] .variante-v3 .marchio .punto,
html[data-collaudo] .variante-v3 .esempio-hero::before { animation: none; }

/* L’invito dopo le FAQ è un blocco distinto dalla risposta precedente. */
.variante-v3 .fiducia-contenuto > .dentro-prova {
  margin-top: clamp(2rem, 3cqw, 3rem);
  padding-top: clamp(1.5rem, 2cqw, 2rem);
  border-top: 1px solid var(--filo);
}

/* Seconda partitura: il CSS dà forma all’ipotesi dati/controllo di Jev. */
@property --v3-geometria-dati { syntax: "<number>"; inherits: true; initial-value: 0; }
.variante-v3 #verifica, .variante-v3 #passo {
  --v3-geometria-dati: clamp(0, calc((var(--v3-domanda-dati) - .5) * 20), 1);
  position: relative;
  isolation: isolate;
}
.variante-v3 #verifica::before, .variante-v3 #passo::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -1;
  pointer-events: none;
  background-color: #e9e6f5;
  background-image: url('/immagini/costellazioni-v3.svg');
  background-size: max(100vw, 1100px) max(1400px, calc(100vh + 240px));
  background-position: inherit;
  background-attachment: fixed;
  background-repeat: no-repeat;
  opacity: var(--v3-geometria-dati);
  transition: opacity 1.6s ease-in-out;
}
.variante-v3 #passo::before { background-color: #dfedf0; }
@media (prefers-reduced-motion: reduce) {
  .variante-v3 #verifica::before, .variante-v3 #passo::before { transition: none; }
}
html[data-collaudo] .variante-v3 #verifica::before,
html[data-collaudo] .variante-v3 #passo::before { transition: none; }

/* Il footer resta compatto sulle larghezze minori. */
@media (max-width: 600px) {
  .footer-v3 > span { display: none; }
}


/* Navigazione raccolta e lingua distinta dalle destinazioni del percorso. */
.variante-v3 .barra-alta {
  display: grid; grid-template-columns: auto minmax(0, 1fr) auto auto;
  column-gap: clamp(.75rem, 1.6cqw, 1.5rem); row-gap: .7rem;
}
.variante-v3 .barra-alta .menu-v3 {
  display: flex; align-items: center; justify-content: center;
  gap: .15rem; flex-wrap: nowrap; order: initial;
}
.menu-v3 a {
  display: inline-flex; align-items: center; justify-content: center;
  min-height: 44px; padding: .55rem .8rem; border-radius: .65rem;
  font-size: .84rem; font-weight: 600; white-space: nowrap;
  transition: background-color .18s ease, color .18s ease;
}
.variante-v3 .menu-v3 a:hover { background: #e7eddf; color: #174f46; }
.variante-v3 .menu-v3 a[aria-current="location"] { background: #dfe9d1; color: #173f39; }
.lingue-v3 {
  display: inline-flex; align-items: center; gap: 2px; padding: 3px;
  border: 1px solid #c7d3c2; border-radius: 999px; background: #edf0e5;
}
.lingue-v3 > :is(a, span) {
  display: inline-flex; align-items: center; justify-content: center;
  min-width: 36px; min-height: 36px; padding: 0 .45rem;
  border-radius: 999px; font-size: .72rem; line-height: 1;
  font-weight: 700; letter-spacing: .035em; text-decoration: none;
}
.lingue-v3 > [aria-current] { background: #173f39; color: #fffaf1; }
.lingue-v3 > a { color: #3e5e53; transition: background-color .18s ease; }
.lingue-v3 > a:hover { background: #dce5d2; color: #173f39; }
.variante-v3 .barra-alta :is(.menu-v3 a, .lingue-v3 a):focus-visible {
  outline: 2px solid #216b5c; outline-offset: 3px;
}
.variante-v3 .barra-alta .cta-menu { white-space: nowrap; order: initial; }
@container (max-width: 780px) {
  .variante-v3 .barra-alta { grid-template-columns: minmax(0, 1fr) auto; padding-block: .65rem; }
  .variante-v3 .barra-alta .marchio { grid-column: 1; grid-row: 1; }
  .variante-v3 .barra-alta .cta-menu { grid-column: 2; grid-row: 1; justify-self: end; }
  .variante-v3 .barra-alta .menu-v3 { grid-column: 1; grid-row: 2; justify-content: flex-start; gap: 0; }
  .variante-v3 .barra-alta .lingue-v3 { grid-column: 2; grid-row: 2; justify-self: end; }
  .menu-v3 a { padding-inline: .45rem; font-size: .78rem; }
}
@container (max-width: 380px) {
  .variante-v3 .barra-alta { column-gap: .35rem; padding-inline: .8rem; }
  .menu-v3 a { padding-inline: .3rem; font-size: .73rem; }
  .lingue-v3 > :is(a, span) { min-width: 32px; padding-inline: .3rem; }
}
@media (prefers-reduced-motion: reduce) {
  .menu-v3 a, .lingue-v3 > a { transition: none; }
}

/* Epilogo su richiesta: rimane dopo il form nella stessa coda stabile. */
.sviluppo-v3 { background: #f1efdf; color: #173f39; padding: 0 clamp(1.25rem, 6cqw, 6rem); }
.sviluppo-apri { display: flex; align-items: center; justify-content: space-between; gap: 1.5rem; width: 100%; padding: 1.7rem 0; border: 0; background: transparent; color: inherit; font: inherit; font-weight: 600; text-align: left; cursor: pointer; }
.sviluppo-apri::after { content: '+'; font-size: 1.5rem; font-weight: 400; }
.sviluppo-apri[aria-expanded='true']::after { content: '−'; }
.sviluppo-apri:focus-visible { outline: 2px solid #216b5c; outline-offset: -2px; }
.sviluppo-contenuto { --aperto: 0; --presenza: var(--aperto); }
.sviluppo-interno { padding: 1.5rem 0 3.5rem; border-top: 1px solid #c9d2bf; }
.sviluppo-interno > p:first-child { font-size: .75rem; text-transform: uppercase; letter-spacing: .1em; }
.sviluppo-interno h2 { font-size: clamp(1.8rem, 3.3cqw, 3rem); max-width: 24ch; }
.sviluppo-v3 p { color: #486258; }
.sviluppo-ambiti { margin-top: 2rem; }
.sviluppo-ambiti article { display: grid; grid-template-columns: 2rem 1fr 1.7fr; gap: 1rem; padding: 1.3rem 0; border-top: 1px solid #c9d2bf; }
.sviluppo-numero { font-size: .75rem; padding-top: .25rem; color: #607567; }
.sviluppo-ambiti h3 { font-size: 1.1rem; }
.sviluppo-ambiti p { margin: 0; font-size: .95rem; }
.sviluppo-limite { margin: 1.5rem 0 0; font-size: .85rem; max-width: 85ch; }
@container (max-width: 600px) {
  .sviluppo-ambiti article { grid-template-columns: 1.5rem 1fr; gap: .4rem .7rem; }
  .sviluppo-ambiti p { grid-column: 2; }
}

/* Ricevuta del form: dialogo nativo, focus confinato e chiusura con Escape. */
body:has(.conferma-v3[open]) { overflow: hidden; }
.conferma-v3 { position: fixed; inset: 0; margin: auto; width: min(540px, calc(100% - 2rem)); max-height: calc(100dvh - 2rem); overflow-y: auto; border: 1px solid #d0dba9; border-radius: 1.8rem; padding: clamp(1.75rem, 5vw, 3rem); color: #173f39; background: #dce9a8; box-shadow: 0 24px 90px #102e3833; }
.conferma-v3::backdrop { background: #102f3a88; backdrop-filter: blur(5px); }
.conferma-v3 h2 { font-size: clamp(2rem, 6vw, 3rem); line-height: 1.05; letter-spacing: -.04em; margin: 1rem 0; }
.conferma-v3 p { color: #34564b; }
.conferma-chiudi { position: absolute; top: .75rem; right: .75rem; width: 44px; height: 44px; border: 0; border-radius: 50%; background: #fffaf180; color: #173f39; font-size: 1.8rem; cursor: pointer; }
.conferma-segno { display: grid; place-items: center; width: 56px; height: 56px; border-radius: 50%; background: #173f39; color: #e4eeaf; font-size: 1.6rem; margin-bottom: 1.5rem; }
.conferma-v3 .conferma-etichetta { font-size: .75rem; font-weight: 600; margin-bottom: .75rem; }
.conferma-esito { background: #fffaf1; border-radius: 1rem; padding: 1.2rem; margin: 1.4rem 0; }
.conferma-esito p { margin: 0; font-size: .95rem; }
.conferma-v3 .bottone { width: 100%; justify-content: center; }
.conferma-v3 button:focus-visible { outline: 2px solid #173f39; outline-offset: 4px; }
@media (prefers-reduced-motion: no-preference) {
  .conferma-v3[open] { animation: conferma-entra .65s ease-out; transform-origin: center; }
  @keyframes conferma-entra {
    0% { opacity: 0; transform: translateY(12px) rotate(0deg); }
    24% { opacity: 1; transform: translateY(0) rotate(-1.6deg); }
    45% { transform: rotate(1.2deg); }
    65% { transform: rotate(-.7deg); }
    82% { transform: rotate(.3deg); }
    100% { opacity: 1; transform: translateY(0) rotate(0deg); }
  }
}

/* Diagnostica riducibile: lo stesso pulsante flottante su desktop e mobile. */
.variante-v3 #apri-sidebar {
  display: grid; place-items: center; top: auto; right: .85rem;
  bottom: calc(var(--altezza-footer) + .75rem); width: 52px; height: 52px;
  padding: 0; border: 1px solid #D45BB6; background: #D45BB6; color: #17221f;
  border-radius: 50%; font-size: .85rem; font-weight: 700; box-shadow: 0 4px 16px #173f3920;
}
body.variante-v3:has(#sidebar[hidden]) #apri-sidebar { bottom: calc(var(--altezza-footer) + .75rem); }
.variante-v3:has(#sidebar:not([hidden])) #apri-sidebar { display: none; }
.variante-v3 #sidebar header { align-items: center; gap: .8rem; background: #edf1e7; }
.variante-v3 #sidebar header strong { flex: 1; }
.variante-v3 .riduci-sidebar {
  display: grid; place-items: center; flex: 0 0 44px; width: 44px; height: 44px;
  border: 1px solid #c7d3c2; border-radius: 50%; background: #fffaf1;
  color: #173f39; font-size: 1.5rem; cursor: pointer;
}
.variante-v3 :is(#apri-sidebar, .riduci-sidebar):focus-visible { outline: 2px solid #216b5c; outline-offset: 3px; }
@media (max-width: 999px) {
  .variante-v3 #sidebar { border-radius: 1rem 1rem 0 0; }
}

/* Seguire il progetto è una scelta secondaria, separata dalle offerte. */
.segui-progetto { margin-top: 1.8rem; padding-top: 1.3rem; border-top: 1px solid var(--filo); }
.segui-progetto-apri { display: inline-flex; align-items: center; gap: .8rem; min-height: 44px; padding: .25rem 0; border: 0; background: none; color: #216b5c; font: inherit; font-size: .95rem; font-weight: 600; cursor: pointer; }
.segui-progetto-apri::after { content: '+'; font-size: 1.3rem; }
.segui-progetto-apri[aria-expanded='true']::after { content: '−'; }
.segui-progetto-apri:focus-visible { outline: 2px solid #216b5c; outline-offset: 4px; }
.segui-progetto-nota { font-size: .85rem; margin: .15rem 0 0; }
.segui-progetto-campo { --aperto: 0; --presenza: var(--aperto); }
.segui-progetto-campo .modulo { margin-top: 1.2rem; max-width: 36rem; padding: clamp(1.2rem, 3cqw, 2rem); }

/* La scelta sul tracciamento precede qualsiasi adattamento comportamentale. */
html:not([data-consenso='accettato']) body.variante-v3 { padding-right: 0 !important; padding-bottom: var(--altezza-footer) !important; }
html:not([data-consenso='accettato']) .variante-v3 :is(#sidebar, #apri-sidebar, .menu-v3, .scelte-v3, .sviluppo-v3, .hero > div > .nota, .hero .azioni .link) { display: none !important; }
html:not([data-consenso='accettato']) .variante-v3 .tappa-v3:not(#tappa-contatto) { display: none !important; }
html:not([data-consenso='accettato']) .variante-v3 .footer-v3 { right: 0; }
html:not([data-consenso='accettato']) .variante-v3 .barra-alta { grid-template-columns: minmax(0, 1fr) auto auto; }
.preferenze-cookie { color: #216b5c; white-space: nowrap; text-underline-offset: .2em; }
#consenso-banner { position: fixed; z-index: 50; left: 1rem; bottom: calc(var(--altezza-footer) + 1rem); width: min(570px, calc(100vw - 2rem)); max-height: calc(100dvh - var(--altezza-footer) - 2rem); overflow: auto; padding: clamp(1.2rem, 3vw, 2rem); background: #fffaf1; color: #173f39; border: 1px solid #b8cbbd; border-radius: 1.4rem; box-shadow: 0 12px 50px #173f3930; }
#consenso-banner[hidden] { display: none; }
#consenso-banner h2 { font-size: 1.45rem; margin: 0 0 .8rem; }
#consenso-banner p { font-size: .88rem; color: #425c54; line-height: 1.55; }
#consenso-banner a { color: #216b5c; font-size: .85rem; }
.consenso-azioni { display: flex; gap: .75rem; margin-top: 1rem; }
.consenso-azioni button { flex: 1; min-height: 44px; padding: .7rem 1rem; border: 1px solid #216b5c; border-radius: 999px; font: inherit; font-weight: 600; background: #216b5c; color: #fffaf1; cursor: pointer; }
.consenso-chiudi { border: 0; padding: .5rem 0; font: inherit; font-size: .8rem; background: none; color: #216b5c; text-decoration: underline; cursor: pointer; }
#consenso-banner [role='status']:empty { display: none; }
#consenso-banner :is(a, button):focus-visible { outline: 2px solid #173f39; outline-offset: 3px; }
@media (max-width: 600px) {
  .footer-v3 { padding-inline: .8rem; gap: .6rem; font-size: .68rem; }
  .footer-v3 > span { display: none; }
}

/* Lo scroll può continuare la lettura, non aprire proposte commerciali. */
@property --v3-continuazione-scroll { syntax: "<number>"; inherits: true; initial-value: 0; }
:is(#tappa-prezzi, #tappa-contatto, #tappa-passo) {
  --presenza: max(var(--aperto), min(calc(1 - var(--v3-continuazione-scroll)), var(--v3-risposta-attuale), var(--v3-gesto-dopo-tappa), clamp(0, (var(--candidata) - .55) * 4, 1)));
}

/* Lo spazio si libera già durante l’uscita, separatamente da hidden. */
body.variante-v3:has(#sidebar[data-ridotta="true"]) { padding-right: 0; padding-bottom: var(--altezza-footer); }
body.variante-v3:has(#sidebar[data-ridotta="true"]) .footer-v3 { right: 0; }

/* Sul telefono il richiamo cromatico passa al punto finale del titolo. */
@media (max-width: 760px) and (prefers-reduced-motion: no-preference) {
  .variante-v3 .hero .punto-hero { animation: punto-cromatico-v3 14s ease-in-out infinite; }
}
html[data-collaudo] .variante-v3 .hero .punto-hero { animation: none; }

/* Il controllo dell’epilogo resta fuori dalla corsia del pulsante Jev. */
@media (max-width: 999px) {
  .variante-v3 .sviluppo-apri { width: calc(100% - 4rem); gap: 1rem; }
  .variante-v3 .sviluppo-apri::after { flex-shrink: 0; }
}

/* Sul telefono lingua sopra e contatto discreto nella riga del menu. */
@media (max-width: 999px) {
  .variante-v3 .barra-alta .lingue-v3 { grid-column: 2; grid-row: 1; justify-self: end; }
  .variante-v3 .barra-alta .cta-menu {
    grid-column: 2; grid-row: 2; justify-self: end;
    background: transparent; color: #216b5c; border: 1px solid #aebfb1;
    box-shadow: none; padding: .5rem .7rem; font-size: .75rem; min-height: 36px;
  }
  html:not([data-consenso='accettato']) body.variante-v3 .barra-alta { grid-template-columns: minmax(0, 1fr) auto; }
}