/* Le pagine di prodotto nello stile di Minerva (8 ott 2026): prima /prodotti/talkcheck/.
 * Si carica DOPO minerva-v2.css e solo sulle pagine prodotte da paginaProdotto() in
 * scripts/marketing-v2/genera.js: le pagine Minerva non lo vedono e non cambiano.
 * Qui solo il tono del prodotto e i blocchi che Minerva non ha (pv2-*). */

/* il tono: il verde dell'app TalkCheck (theme_color #238636), schiarito per il fondo scuro */
.mv2.mv2--pubblica.mv2--talkcheck {
  --mv2-tono: #3fb950;
  --mv2-accento: #3fb950;
  --mv2-accento-chiaro: #7ee2a8;   /* testo su fondo scuro */
  --mv2-accento-cta: #1f7a34;      /* bianco sopra: 5,5 */
  --mv2-accento-cta-su: #17602a;
}

/* le schede prendono il tono del prodotto; a tre voci stanno su tre colonne */
.mv2--pubblica .pv2-schede .mv2-scheda { border-top-color: var(--mv2-tono); }
@media (min-width: 1040px) {
  /* due schede: su tutta la riga, non due quarti con mezza pagina vuota (Salvo, 9 ott 2026, /servizi/web/) */
  .mv2 .pv2-schede--2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .mv2 .pv2-schede--3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .mv2 .pv2-schede--6 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}
.mv2--pubblica .pv2-passi .mv2-passo__n { background: var(--mv2-accento-cta); color: #fff; }

/* un elenco: due colonne su schermo largo, un segno nel tono davanti a ogni voce */
.mv2 .pv2-elenco { list-style: none; margin: 26px 0 0; padding: 0; display: grid; gap: 10px 32px; max-width: 980px; }
@media (min-width: 760px) { .mv2 .pv2-elenco { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
.mv2 .pv2-elenco li { position: relative; padding-left: 26px; color: var(--mv2-testo-2); line-height: 1.55; }
.mv2 .pv2-elenco li::before {
  content: ''; position: absolute; left: 2px; top: .5em; width: 12px; height: 7px;
  border-left: 2px solid var(--mv2-tono); border-bottom: 2px solid var(--mv2-tono); transform: rotate(-45deg);
}

.mv2 .pv2-sottotitolo { margin: 40px 0 0; font-size: 1.16rem; font-weight: 700; }
.mv2 .pv2-citazione { border-left-color: var(--mv2-tono); }
.mv2 .pv2-citazione strong { color: var(--mv2-accento-chiaro); font-weight: 600; }
.mv2 .pv2-nota { margin: 20px 0 0; font-size: .9rem; color: var(--mv2-testo-2); max-width: 72ch; }
.mv2 .pv2-motto {
  margin: 34px 0 0; max-width: 34ch; font-size: clamp(1.2rem, 2.4vw, 1.6rem); font-weight: 700;
  line-height: 1.3; letter-spacing: -0.01em; color: var(--mv2-testo); text-wrap: balance;
}

/* i cinque verdetti: il nome con il suo segno colorato (il colore non e' mai l'unico segnale:
   il nome c'e' sempre), come nell'app */
.mv2 .pv2-verdetti { display: grid; gap: 12px; margin-top: 22px; }
@media (min-width: 680px) { .mv2 .pv2-verdetti { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (min-width: 1040px) { .mv2 .pv2-verdetti { grid-template-columns: repeat(5, minmax(0, 1fr)); } }
.mv2 .pv2-verdetto {
  padding: 18px 18px 16px; background: var(--mv2-fondo-2);
  border: 1px solid var(--mv2-bordo); border-radius: var(--mv2-raggio);
}
.mv2 .pv2-verdetto__nome { display: flex; align-items: center; gap: 10px; margin: 0 0 8px; font-size: 1.02rem; font-weight: 700; }
.mv2 .pv2-verdetto__nome::before { content: ''; flex: 0 0 auto; width: 10px; height: 10px; border-radius: 50%; background: var(--pv2-v); }
.mv2 .pv2-verdetto__testo { margin: 0; font-size: .92rem; color: var(--mv2-testo-2); }
.mv2 .pv2-verdetto--1 { --pv2-v: #3fb950; }
.mv2 .pv2-verdetto--2 { --pv2-v: #f85149; }
.mv2 .pv2-verdetto--3 { --pv2-v: #d29922; }
.mv2 .pv2-verdetto--4 { --pv2-v: #8b949e; }
.mv2 .pv2-verdetto--5 { --pv2-v: #58a6ff; }

/* accanto a uno scatto la colonna e' meta': l'elenco va su una colonna, le schede su due */
@media (min-width: 900px) {
  .mv2 .mv2-affianca .pv2-elenco { grid-template-columns: minmax(0, 1fr); }
  .mv2 .mv2-affianca .mv2-schede { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  /* con un numero dispari di schede l'ultima prende tutta la riga: niente buco accanto */
  .mv2 .mv2-affianca .mv2-schede > :last-child:nth-child(odd) { grid-column: 1 / -1; }
}

/* Giardiniamo: un verde foglia (il marchio e' nero), diverso da quello di TalkCheck */
.mv2.mv2--pubblica.mv2--giardiniamo {
  --mv2-tono: #84cc16;
  --mv2-accento: #84cc16;
  --mv2-accento-chiaro: #bef264;
  --mv2-accento-cta: #4d7c0f;      /* bianco sopra: 5,3 */
  --mv2-accento-cta-su: #3f6212;
}
/* solo in revisione: una funzione ancora da confermare (la prova blocca il rilascio) */
.mv2 .pv2-da-verificare { outline: 2px dashed #f59e0b; outline-offset: 3px; }

/* gli scatti da computer delle pagine di prodotto: tutta la colonna, senza il tetto del telefono */
.mv2--pubblica .pv2-scatto-desk img { width: 100%; height: auto; }

/* le illustrazioni del sito nelle pagine v2 (hero dei servizi): angoli come gli scatti, nessun vassoio */
.mv2--pubblica .pv2-immagine { margin: 0; }
.mv2--pubblica .pv2-immagine img { display: block; width: 100%; height: auto; border-radius: 18px; border: 1px solid rgba(255, 255, 255, .1); box-shadow: 0 24px 60px -24px rgba(0, 0, 0, .75); }

/* i pulsanti veri (<button>, le finestre data-modal di site.js) con lo stile dei collegamenti mv2-cta:
   senza, il browser mette il suo fondo chiaro (#efefef) sotto il testo bianco e non si legge (8 ott 2026) */
.mv2 button.mv2-cta { background: transparent; font: inherit; font-size: 0.98rem; font-weight: 600; line-height: inherit; cursor: pointer; -webkit-appearance: none; appearance: none; }
.mv2 button.mv2-cta--primaria { background: var(--mv2-accento-cta); }

/* l'ancora di un collegamento del menu che punta a una sezione: sotto la testata fissa */
.mv2 .pv2-ancora { display: block; position: relative; top: -90px; visibility: hidden; }
.mv2 .mv2-scheda[id] { scroll-margin-top: 90px; }

/* quattro passi: due righe da due, come la griglia delle pagine di prima (non 3 + 1) */
@media (min-width: 760px) { .mv2 .pv2-passi--4 { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
.mv2 .pv2-passi .mv2-passo__n { width: auto; min-width: 30px; padding: 0 6px; }

/* casi reali (11 ott 2026, /servizi/embedded/ «L'abbiamo già fatto»): schede interamente cliccabili */
.mv2 .pv2-casi { display: grid; gap: 20px; margin: 26px 0 0; max-width: 980px; }
@media (min-width: 760px) { .mv2 .pv2-casi { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
.mv2 .pv2-caso {
  display: flex; flex-direction: column; text-decoration: none; color: inherit; border-radius: 14px; overflow: hidden;
  background: var(--mv2-fondo-2); border: 1px solid var(--mv2-bordo); border-top: 3px solid var(--mv2-tono, var(--mv2-accento));
  transition: transform .25s ease, border-color .25s ease;
}
.mv2 .pv2-caso:hover, .mv2 .pv2-caso:focus-visible { transform: translateY(-3px); border-color: var(--mv2-tono, var(--mv2-accento)); }
.mv2 .pv2-caso:focus-visible { outline: 2px solid var(--mv2-accento-chiaro); outline-offset: 3px; }
.mv2 .pv2-caso img { display: block; width: 100%; height: auto; aspect-ratio: 4 / 3; object-fit: cover; background: #0b1220; }
.mv2 .pv2-caso__corpo { display: flex; flex-direction: column; gap: 6px; padding: 18px 20px 20px; flex: 1; }
.mv2 .pv2-caso__anno { font-size: .78rem; letter-spacing: .16em; font-weight: 700; color: var(--mv2-accento-chiaro); }
.mv2 .pv2-caso__nome { font-size: 1.16rem; font-weight: 700; color: var(--mv2-testo); }
.mv2 .pv2-caso__testo { color: var(--mv2-testo-2); line-height: 1.55; flex: 1; }
.mv2 .pv2-caso__invito { margin-top: 8px; font-weight: 600; color: var(--mv2-accento-chiaro); }
.mv2 .pv2-casi + .pv2-citazione { max-width: 980px; }
@media (prefers-reduced-motion: reduce) { .mv2 .pv2-caso { transition: none; } .mv2 .pv2-caso:hover { transform: none; } }