/* =========================================================
   Jonathan Amato – Coaching online · style.css
   Concetto di layout: morbido e luminoso. Pannelli arrotondati
   su bianco, accenti arancio e nero, font arrotondati.
   Palette: bianco, arancio (#FF6A13, scuro #B53C08 per i testi
   piccoli) e nero morbido (#141414). I nomi storici delle variabili
   (--c-viola, --c-lilla, --c-rosa...) contengono tonalità di arancio
   e grigio caldo, non viola. Nessuna animazione dura più di 5 s
   (WCAG 2.2.2): niente cicli infiniti.
   Le altre caratteristiche: ombre diffuse,
   ombre diffuse. La precisione resta nei dettagli tabulari
   (serie × rip, RPE), l'aspetto è caldo e accogliente.
   ========================================================= */

/* ---------- Font ospitati sul sito (licenza SIL Open Font License) ---------- */
@font-face {
  font-family: "Nunito";
  src: url("fonts/nunito.woff2") format("woff2");
  font-weight: 200 1000; font-style: normal; font-display: swap;
}
@font-face {
  font-family: "Figtree";
  src: url("fonts/figtree.woff2") format("woff2");
  font-weight: 300 900; font-style: normal; font-display: swap;
}

/* ---------- Design token: tema chiaro (predefinito) ----------
   Palette bianco, arancio, nero:
   - bianco come base, tanto respiro;
   - nero morbido per il testo e i pulsanti secondari;
   - arancio per marca e azioni (in versione scura per i testi piccoli, per il contrasto). */
:root {
  /* Colori base */
  --c-sfondo: #FFFFFF;
  --c-superficie: #FFFFFF;
  --c-testo: #141414;
  --c-testo-2: #57524D;
  --c-linea: #ECE8E4;
  --c-linea-forte: #D9D3CD;

  /* Arancio di marca */
  --c-accento: #FF6A13;
  --c-accento-hover: #F25A00;
  --c-accento-testo: #141414;   /* testo sopra l'arancio */
  --c-rosa: #FF9147;            /* seconda tinta dei gradienti arancio */
  --c-viola: #B53C08;           /* arancio scuro: link, occhielli, testi piccoli */
  --c-btn-scuro: #141414;
  --c-btn-scuro-testo: #FFFFFF;

  /* Pulsanti d'azione */
  --c-cta: #FF6A13;
  --c-cta-hover: #F25A00;
  --c-cta-testo: #141414;
  --c-titolo-evidenza: #E05200; /* arancio per titoli grandi: contrasto 3,9:1 su bianco */
  --c-pannello: #F4F3F1;
  --c-banda: #141414;
  --c-banda-testo: #FFFFFF;
  --c-banda-testo-2: #C9C4BE;
  --c-banda-linea: rgba(255, 255, 255, 0.16);

  /* Tinte tenui per i pannelli */
  --c-lilla: #FFF0E6;           /* arancio tenue */
  --c-pesca: #F4F2F0;           /* grigio caldo */
  --c-menta: #ECEAE6;
  --c-burro: #F1EFEC;
  --c-accento-tenue: var(--c-lilla);

  /* Stati */
  --c-avviso-sfondo: #FFF4D6;
  --c-avviso-testo: #5A4300;
  --c-avviso-bordo: #EBCB73;
  --c-errore: #C2264B;
  --c-errore-sfondo: #FFE9EE;
  --c-ok: #141414;

  /* Macchie di colore dell'hero */
  --c-macchia-1: rgba(255, 106, 19, 0.18);
  --c-macchia-2: rgba(255, 160, 90, 0.20);
  --c-macchia-3: rgba(20, 20, 20, 0.05);
  --ombra: 0 1px 2px rgba(20, 20, 20, 0.05), 0 12px 32px -12px rgba(20, 20, 20, 0.16);
  --ombra-grande: 0 2px 4px rgba(20, 20, 20, 0.04), 0 28px 60px -24px rgba(255, 106, 19, 0.35);
  --ombra-corallo: 0 10px 24px -10px rgba(255, 106, 19, 0.65);

  /* Tipografia */
  --f-titoli: "Nunito", "Arial Rounded MT Bold", "Helvetica Neue", Arial, sans-serif;
  --f-testo: "Figtree", "Helvetica Neue", Arial, sans-serif;
  --t-xs: 0.875rem;
  --t-s: 0.9375rem;
  --t-m: 1.0625rem;
  --t-l: 1.25rem;
  --t-xl: clamp(1.5rem, 1.2rem + 1.4vw, 2rem);
  --t-2xl: clamp(1.875rem, 1.4rem + 2.2vw, 2.75rem);
  --t-3xl: clamp(2.375rem, 1.6rem + 3.8vw, 4.5rem);

  /* Spaziature */
  --s-1: 0.25rem;
  --s-2: 0.5rem;
  --s-3: 0.75rem;
  --s-4: 1rem;
  --s-5: 1.5rem;
  --s-6: 2rem;
  --s-7: 3rem;
  --s-8: 4.5rem;
  --s-9: 6.5rem;

  /* Forme */
  --r-s: 12px;
  --r-m: 20px;
  --r-l: 28px;
  --r-xl: 40px;
  --r-pillola: 999px;

  --larghezza: 72rem;
  --larghezza-prosa: 40rem;
  --tocco: 2.75rem; /* 44px: area minima di tocco */
  color-scheme: light;
  color-scheme: light;
  color-scheme: light;
}

/* ---------- Tema scuro ---------- */
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    --c-sfondo: #121110;
    --c-superficie: #1C1B19;
    --c-testo: #F6F3F0;
    --c-testo-2: #B9B2AB;
    --c-linea: #2C2A27;
    --c-linea-forte: #3D3A36;
    --c-accento: #FF7A2B;
    --c-accento-hover: #FF8F4D;
    --c-accento-testo: #121110;
    --c-rosa: #FF9A57;
    --c-viola: #FF9A57;
    --c-btn-scuro: #121110;
    --c-btn-scuro-testo: #F6F3F0;
    --c-cta: #FF7A2B;
    --c-cta-hover: #FF8F4D;
    --c-cta-testo: #121110;
    --c-titolo-evidenza: #FF7A2B;
    --c-pannello: #1C1B19;
    --c-banda: #26231F;
    --c-banda-testo: #F6F3F0;
    --c-banda-testo-2: #B9B2AB;
    --c-banda-linea: rgba(255, 255, 255, 0.12);
    --c-lilla: #2A1D14;
    --c-pesca: #1F1E1C;
    --c-menta: #2C2925;
    --c-burro: #24201C;
    --c-avviso-sfondo: #3A321B;
    --c-avviso-testo: #FFE3A3;
    --c-avviso-bordo: #7A6432;
    --c-errore: #FF8FA8;
    --c-errore-sfondo: #3A1C27;
    --c-ok: #F6F3F0;
    --c-macchia-1: rgba(255, 122, 43, 0.16);
    --c-macchia-2: rgba(255, 154, 87, 0.10);
    --c-macchia-3: rgba(255, 255, 255, 0.03);
    --ombra: 0 1px 2px rgba(0, 0, 0, 0.3), 0 12px 32px -12px rgba(0, 0, 0, 0.6);
    --ombra-grande: 0 2px 4px rgba(0, 0, 0, 0.3), 0 28px 60px -24px rgba(0, 0, 0, 0.7);
    --ombra-corallo: 0 10px 24px -10px rgba(255, 122, 43, 0.45);
    color-scheme: dark;
  }
}
:root[data-theme="dark"] {
  --c-sfondo: #121110;
  --c-superficie: #1C1B19;
  --c-testo: #F6F3F0;
  --c-testo-2: #B9B2AB;
  --c-linea: #2C2A27;
  --c-linea-forte: #3D3A36;
  --c-accento: #FF7A2B;
  --c-accento-hover: #FF8F4D;
  --c-accento-testo: #121110;
  --c-rosa: #FF9A57;
  --c-viola: #FF9A57;
  --c-btn-scuro: #121110;
  --c-btn-scuro-testo: #F6F3F0;
  --c-cta: #FF7A2B;
  --c-cta-hover: #FF8F4D;
  --c-cta-testo: #121110;
  --c-titolo-evidenza: #FF7A2B;
  --c-pannello: #1C1B19;
  --c-banda: #26231F;
  --c-banda-testo: #F6F3F0;
  --c-banda-testo-2: #B9B2AB;
  --c-banda-linea: rgba(255, 255, 255, 0.12);
  --c-lilla: #2A1D14;
  --c-pesca: #1F1E1C;
  --c-menta: #2C2925;
  --c-burro: #24201C;
  --c-avviso-sfondo: #3A321B;
  --c-avviso-testo: #FFE3A3;
  --c-avviso-bordo: #7A6432;
  --c-errore: #FF8FA8;
  --c-errore-sfondo: #3A1C27;
  --c-ok: #F6F3F0;
  --c-macchia-1: rgba(255, 122, 43, 0.16);
  --c-macchia-2: rgba(255, 154, 87, 0.10);
  --c-macchia-3: rgba(255, 255, 255, 0.03);
  --ombra: 0 1px 2px rgba(0, 0, 0, 0.3), 0 12px 32px -12px rgba(0, 0, 0, 0.6);
  --ombra-grande: 0 2px 4px rgba(0, 0, 0, 0.3), 0 28px 60px -24px rgba(0, 0, 0, 0.7);
  --ombra-corallo: 0 10px 24px -10px rgba(255, 122, 43, 0.45);
  color-scheme: dark;
}

/* ---------- Base ---------- */
*, *::before, *::after { box-sizing: border-box; }
[hidden] { display: none !important; }

html { -webkit-text-size-adjust: 100%; scroll-behavior: smooth; }
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { transition: none !important; animation: none !important; }
}

body {
  margin: 0;
  background: var(--c-sfondo);
  color: var(--c-testo);
  font-family: var(--f-testo);
  font-size: var(--t-m);
  line-height: 1.65;
  overflow-x: hidden;
}
@media (min-width: 48rem) { body { font-size: 1.125rem; } }

/* fascia sopra l'header sticky (notch) */
body::before {
  content: "";
  position: fixed;
  inset: 0 0 auto;
  height: env(safe-area-inset-top, 0px);
  background: var(--c-sfondo);
  z-index: 60;
}

img { max-width: 100%; height: auto; display: block; }

h1, h2, h3, h4 {
  font-family: var(--f-titoli);
  line-height: 1.12;
  letter-spacing: -0.015em;
  margin: 0;
  text-wrap: balance;
  color: var(--c-testo);
}
h1 { font-size: var(--t-3xl); font-weight: 900; }
h2 { font-size: var(--t-2xl); font-weight: 850; }
h3 { font-size: var(--t-l); font-weight: 800; }
h4 { font-size: var(--t-m); font-weight: 800; }

p { margin: 0; }
p + p { margin-top: var(--s-4); }

a { color: var(--c-viola); text-underline-offset: 0.2em; text-decoration-thickness: 1.5px; }
a:hover { text-decoration-thickness: 2.5px; }

:focus-visible {
  outline: 3px solid var(--c-viola);
  outline-offset: 3px;
  border-radius: 8px;
}

.sr-only {
  position: absolute !important; width: 1px; height: 1px; padding: 0; margin: -1px;
  overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0;
}

.salta {
  position: absolute; left: var(--s-4); top: -100px;
  background: var(--c-btn-scuro); color: var(--c-btn-scuro-testo);
  padding: var(--s-3) var(--s-5); z-index: 100; font-family: var(--f-titoli); font-weight: 800;
  border-radius: var(--r-pillola);
}
.salta:focus { top: calc(env(safe-area-inset-top, 0px) + var(--s-2)); }

/* ---------- Layout ---------- */
.contenitore {
  width: 100%;
  max-width: calc(var(--larghezza) + 2 * 2rem);
  margin-inline: auto;
  padding-left: max(16px, env(safe-area-inset-left, 0px));
  padding-right: max(16px, env(safe-area-inset-right, 0px));
}
@media (min-width: 48rem) {
  .contenitore {
    padding-left: max(2rem, env(safe-area-inset-left, 0px));
    padding-right: max(2rem, env(safe-area-inset-right, 0px));
  }
}

.sezione { padding-block: var(--s-8); }
.sezione--stretta { padding-block: var(--s-7); }
@media (min-width: 64rem) { .sezione { padding-block: var(--s-9); } }

/* Pannelli arrotondati colorati al posto delle fasce piatte */
.sezione--superficie {
  background: var(--c-lilla);
  border-radius: var(--r-l);
  margin-inline: max(8px, env(safe-area-inset-left, 0px)) max(8px, env(safe-area-inset-right, 0px));
}
@media (min-width: 48rem) {
  .sezione--superficie { border-radius: var(--r-xl); margin-inline: max(16px, env(safe-area-inset-left, 0px)) max(16px, env(safe-area-inset-right, 0px)); }
}
.sezione--lilla { background: var(--c-lilla); }
.sezione--pesca { background: var(--c-pesca); }
.sezione--menta { background: var(--c-menta); }
.sezione--burro { background: var(--c-burro); }
.sezione--superficie + .sezione--superficie { margin-top: 16px; }

/* Pannello finale: gradiente corallo → rosa */
.sezione--accento {
  background: linear-gradient(135deg, var(--c-accento) 0%, var(--c-rosa) 100%);
  color: var(--c-accento-testo);
  border-radius: var(--r-l);
  margin: var(--s-6) max(8px, env(safe-area-inset-right, 0px)) var(--s-6) max(8px, env(safe-area-inset-left, 0px));
  position: relative;
  overflow: clip;
  isolation: isolate;
}
.sezione--accento::after {
  content: ""; position: absolute; z-index: -1;
  width: 28rem; height: 28rem; right: -8rem; top: -10rem; border-radius: 50%;
  background: radial-gradient(circle, rgba(255, 255, 255, 0.35), transparent 65%);
}
@media (min-width: 48rem) {
  .sezione--accento { border-radius: var(--r-xl); margin-inline: max(16px, env(safe-area-inset-left, 0px)) max(16px, env(safe-area-inset-right, 0px)); }
}
.sezione--accento h2, .sezione--accento h3 { color: var(--c-accento-testo); }

.prosa { max-width: var(--larghezza-prosa); }
.prosa > * + * { margin-top: var(--s-4); }
.prosa h2 { margin-top: var(--s-7); }
.prosa h3 { margin-top: var(--s-6); }
.prosa ul, .prosa ol { padding-left: 1.25rem; }
.prosa li + li { margin-top: var(--s-2); }
.prosa li::marker { color: var(--c-accento); }

.intestazione-sezione { display: grid; gap: var(--s-4); max-width: 46rem; margin-bottom: var(--s-7); }
.intestazione-sezione p { color: var(--c-testo-2); }
.sezione--accento .intestazione-sezione p { color: var(--c-accento-testo); }

.occhiello {
  justify-self: start;
  font-family: var(--f-titoli);
  font-size: var(--t-xs);
  font-weight: 800;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--c-viola);
  background: var(--c-superficie);
  padding: 0.35rem 0.9rem;
  border-radius: var(--r-pillola);
  display: inline-flex;
  align-items: center;
  gap: var(--s-2);
  box-shadow: 0 0 0 1px var(--c-linea);
}
.occhiello::before {
  content: "";
  width: 0.5rem; height: 0.5rem; border-radius: 50%;
  background: var(--c-ok);
}

.lead { font-size: var(--t-l); color: var(--c-testo-2); line-height: 1.55; }

.griglia { display: grid; gap: var(--s-5); }
@media (min-width: 48rem) {
  .griglia--2 { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--s-6); }
  .griglia--3 { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--s-5); }
}
.griglia > * { min-width: 0; }

/* ---------- Header ---------- */
.testata {
  position: sticky;
  top: env(safe-area-inset-top, 0px);
  z-index: 50;
  background: color-mix(in srgb, var(--c-sfondo) 85%, transparent);
  -webkit-backdrop-filter: saturate(1.4) blur(14px);
  backdrop-filter: saturate(1.4) blur(14px);
}
@supports not (background: color-mix(in srgb, red 50%, blue)) {
  .testata { background: var(--c-sfondo); }
}
.testata__riga {
  display: flex; align-items: center; justify-content: space-between;
  gap: var(--s-4); min-height: 4.5rem; flex-wrap: wrap;
}

.logo {
  display: inline-flex; flex-direction: column; text-decoration: none; color: var(--c-testo);
  min-height: var(--tocco); justify-content: center;
}
.logo__nome {
  font-family: var(--f-titoli); font-weight: 900;
  font-size: 1.375rem; letter-spacing: 0.38em; line-height: 1;
  margin-right: -0.38em;
}
.logo__sotto {
  font-family: var(--f-titoli); font-weight: 700; font-size: 0.6875rem; letter-spacing: 0.16em;
  text-transform: uppercase; color: var(--c-viola); margin-top: 0.35rem;
}
:root[data-theme="dark"] .logo__sotto { color: var(--c-accento); }
@media (prefers-color-scheme: dark) { :root:not([data-theme="light"]) .logo__sotto { color: var(--c-accento); } }

.menu-toggle {
  display: none;
  align-items: center; gap: var(--s-2);
  min-height: var(--tocco); min-width: var(--tocco);
  padding: 0 var(--s-4);
  background: var(--c-superficie); color: var(--c-testo);
  border: 0; border-radius: var(--r-pillola); box-shadow: var(--ombra);
  font-family: var(--f-titoli); font-size: var(--t-xs); font-weight: 800;
  letter-spacing: 0.04em; text-transform: uppercase; cursor: pointer;
}
.menu-toggle__icona { width: 18px; height: 12px; position: relative; display: inline-block; }
.menu-toggle__icona::before, .menu-toggle__icona::after,
.menu-toggle__icona span {
  content: ""; position: absolute; left: 0; right: 0; height: 2px; border-radius: 2px; background: currentColor;
  transition: transform .2s ease, opacity .2s ease;
}
.menu-toggle__icona::before { top: 0; }
.menu-toggle__icona span { top: 5px; }
.menu-toggle__icona::after { bottom: 0; }
.menu-toggle[aria-expanded="true"] .menu-toggle__icona::before { transform: translateY(5px) rotate(45deg); }
.menu-toggle[aria-expanded="true"] .menu-toggle__icona span { opacity: 0; }
.menu-toggle[aria-expanded="true"] .menu-toggle__icona::after { transform: translateY(-5px) rotate(-45deg); }

.nav { width: 100%; }
.nav__lista {
  list-style: none; margin: 0; padding: 0 0 var(--s-3);
  display: flex; flex-wrap: wrap; gap: 0 var(--s-2);
}
.nav__lista a {
  display: inline-flex; align-items: center; min-height: var(--tocco);
  padding: 0 var(--s-3); border-radius: var(--r-pillola);
  font-family: var(--f-titoli); font-size: var(--t-s); font-weight: 700;
  color: var(--c-testo); text-decoration: none;
  transition: background-color .15s ease;
}
.nav__lista a:hover { background: var(--c-lilla); }
.nav__lista a[aria-current="page"] { background: var(--c-lilla); color: var(--c-viola); }
.nav__cta { margin-top: var(--s-2); }

/* Mobile con JS: menu a scomparsa in un pannello morbido */
.js .menu-toggle { display: inline-flex; }
.js .nav { display: none; padding: 0 0 var(--s-5); }
.js .nav.aperta { display: block; }
.js .nav__lista {
  flex-direction: column; padding: var(--s-2); gap: 2px;
  background: var(--c-superficie); border-radius: var(--r-m); box-shadow: var(--ombra);
}
.js .nav__lista a { width: 100%; min-height: 3.25rem; font-size: var(--t-m); padding: 0 var(--s-4); }
.js .nav__cta { margin-top: var(--s-3); }
.js .nav__cta .btn { width: 100%; }

@media (min-width: 75rem) {
  .testata__riga { flex-wrap: nowrap; }
  .js .menu-toggle { display: none; }
  .nav, .js .nav { display: flex; width: auto; align-items: center; gap: var(--s-4); padding: 0; }
  .nav__lista, .js .nav__lista { flex-direction: row; padding: 0; gap: var(--s-1); background: transparent; box-shadow: none; }
  .js .nav__lista a { width: auto; min-height: var(--tocco); font-size: var(--t-s); padding: 0 var(--s-3); }
  .nav__cta, .js .nav__cta { margin: 0; }
  .js .nav__cta .btn { width: auto; }
}

/* ---------- Pulsanti ---------- */
.btn {
  display: inline-flex; align-items: center; justify-content: center; gap: var(--s-2);
  min-height: 3.25rem; padding: 0.8rem 1.6rem;
  font-family: var(--f-titoli); font-size: var(--t-m); font-weight: 800; letter-spacing: 0.005em;
  text-decoration: none; text-align: center; line-height: 1.2;
  border-radius: var(--r-pillola); border: 2px solid transparent; cursor: pointer;
  transition: background-color .15s ease, color .15s ease, border-color .15s ease, transform .15s ease, box-shadow .15s ease;
}
.btn:hover { transform: translateY(-2px); }
.btn:active { transform: translateY(0); }
.btn--primario { background: var(--c-cta); color: var(--c-cta-testo); box-shadow: var(--ombra-corallo); }
.btn--primario:hover { background: var(--c-cta-hover); }
.btn--secondario { background: var(--c-superficie); color: var(--c-testo); border-color: var(--c-linea-forte); }
.btn--secondario:hover { border-color: var(--c-viola); color: var(--c-viola); }
.btn--chiaro { background: var(--c-btn-scuro); color: var(--c-btn-scuro-testo); box-shadow: 0 12px 28px -10px rgba(0, 0, 0, 0.45); }
.btn--chiaro:hover { opacity: 0.9; }
.btn--piccolo { min-height: var(--tocco); padding: 0.55rem 1.15rem; font-size: var(--t-s); }
.btn--pieno { width: 100%; }
.btn[disabled] { opacity: 0.6; cursor: progress; transform: none; }

.link-freccia {
  display: inline-flex; align-items: center; gap: var(--s-2); min-height: var(--tocco);
  font-family: var(--f-titoli); font-weight: 800; font-size: var(--t-m); text-decoration: none;
}
.link-freccia::after {
  content: "→"; display: inline-grid; place-items: center; width: 1.9rem; height: 1.9rem; border-radius: 50%;
  background: var(--c-superficie); box-shadow: var(--ombra); transition: transform .15s ease;
}
.link-freccia:hover { text-decoration: underline; }
.link-freccia:hover::after { transform: translateX(4px); }

.azioni { display: flex; flex-wrap: wrap; gap: var(--s-3); align-items: center; }

/* ---------- Hero ---------- */
.hero {
  position: relative; isolation: isolate; overflow: clip;
  padding-block: var(--s-7) var(--s-8);
}
.hero::before {
  content: ""; position: absolute; inset: -10% -10% auto; height: 120%; z-index: -1; pointer-events: none;
  background:
    radial-gradient(40% 45% at 85% 25%, var(--c-macchia-2), transparent 70%),
    radial-gradient(35% 40% at 65% 75%, var(--c-macchia-1), transparent 70%),
    radial-gradient(30% 35% at 10% 10%, var(--c-macchia-3), transparent 70%);
}
.hero__griglia { display: grid; gap: var(--s-7); align-items: center; }
.hero__testo { display: grid; gap: var(--s-5); min-width: 0; }
.hero__testo h1 { max-width: 13ch; }
.hero__nota { font-size: var(--t-s); color: var(--c-testo-2); }
@media (min-width: 60rem) {
  .hero { padding-block: var(--s-8) var(--s-9); }
  .hero__griglia { grid-template-columns: minmax(0, 1.1fr) minmax(0, 0.9fr); gap: var(--s-8); }
}

/* ---------- Scheda di esempio (dettaglio di dominio) ---------- */
.scheda {
  margin: 0;
  background: var(--c-superficie);
  border-radius: var(--r-l);
  padding: var(--s-5);
  box-shadow: var(--ombra-grande);
  min-width: 0;
  rotate: 1.5deg;
}
@media (prefers-reduced-motion: reduce) { .scheda { rotate: 0deg; } }
.scheda__testa {
  display: flex; justify-content: space-between; align-items: center; gap: var(--s-3); flex-wrap: wrap;
  margin-bottom: var(--s-2);
  font-family: var(--f-titoli); font-size: var(--t-xs); font-weight: 800;
}
.scheda__testa strong {
  background: var(--c-lilla); color: var(--c-viola); padding: 0.3rem 0.8rem; border-radius: var(--r-pillola);
}
.scheda__testa span { background: var(--c-pesca); padding: 0.3rem 0.8rem; border-radius: var(--r-pillola); }
.scheda table { width: 100%; border-collapse: collapse; font-variant-numeric: tabular-nums; font-size: var(--t-s); }
.scheda th {
  text-align: left; font-family: var(--f-titoli); font-weight: 800; font-size: 0.75rem; letter-spacing: 0.04em; text-transform: uppercase;
  color: var(--c-testo-2); padding: var(--s-3) var(--s-2) var(--s-2) 0;
}
.scheda td { padding: var(--s-3) var(--s-2) var(--s-3) 0; border-top: 1px solid var(--c-linea); vertical-align: top; }
.scheda td:first-child { font-weight: 600; }
.scheda td.num, .scheda th.num { text-align: right; white-space: nowrap; padding-right: 0; padding-left: var(--s-2); }
.scheda td.num { font-family: var(--f-titoli); font-weight: 800; }
.scheda__piede {
  display: flex; justify-content: space-between; align-items: flex-end; gap: var(--s-3); flex-wrap: wrap;
  margin-top: var(--s-3); padding: var(--s-3) var(--s-4); border-radius: var(--r-m);
  background: var(--c-sfondo); font-size: var(--t-xs); color: var(--c-testo-2);
}
.scheda__firma { font-family: var(--f-titoli); font-weight: 900; color: var(--c-viola); font-size: var(--t-m); }

/* ---------- Problema / soluzione ---------- */
.elenco-errori { list-style: none; padding: 0; margin: 0; display: grid; gap: var(--s-3); }
.elenco-errori li {
  padding: var(--s-4) var(--s-5); background: var(--c-superficie); border-radius: var(--r-m); box-shadow: var(--ombra);
  display: grid; grid-template-columns: 2rem minmax(0, 1fr); gap: var(--s-3); align-items: start;
}
.elenco-errori li::before {
  content: "×"; display: grid; place-items: center; width: 2rem; height: 2rem; border-radius: 50%;
  background: var(--c-pesca); color: var(--c-viola);
  font-family: var(--f-titoli); font-weight: 900; font-size: 1.15rem; line-height: 1;
}

.pilastro {
  display: grid; gap: var(--s-3); align-content: start;
  padding: var(--s-6) var(--s-5); background: var(--c-superficie); border-radius: var(--r-l); box-shadow: var(--ombra);
}
.pilastro::before {
  content: ""; width: 3rem; height: 3rem; border-radius: 50%;
  background: radial-gradient(circle at 35% 35%, #FFB27F, var(--c-accento));
}
.griglia > .pilastro:nth-child(2)::before { background: radial-gradient(circle at 35% 35%, #5A5550, #141414); }
.griglia > .pilastro:nth-child(3)::before { background: radial-gradient(circle at 35% 35%, #FFD2B0, #FF9147); }
.pilastro p { color: var(--c-testo-2); }
.pilastro .occhiello { box-shadow: none; background: var(--c-sfondo); }

/* ---------- Passi (sequenza reale) ---------- */
.passi { list-style: none; padding: 0; margin: 0; display: grid; gap: var(--s-4); counter-reset: passo; }
.passi li {
  counter-increment: passo; display: grid; gap: var(--s-2); align-content: start;
  padding: var(--s-5); background: var(--c-superficie); border-radius: var(--r-l); box-shadow: var(--ombra); min-width: 0;
}
.passi li::before {
  content: counter(passo);
  display: grid; place-items: center; width: 2.75rem; height: 2.75rem; border-radius: 50%; margin-bottom: var(--s-2);
  background: var(--c-accento); color: var(--c-accento-testo);
  font-family: var(--f-titoli); font-weight: 900; font-size: 1.25rem; line-height: 1;
}
.passi li:nth-child(2)::before { background: var(--c-viola); color: var(--c-btn-scuro-testo); }
:root[data-theme="dark"] .passi li:nth-child(2)::before { color: var(--c-accento-testo); }
@media (prefers-color-scheme: dark) { :root:not([data-theme="light"]) .passi li:nth-child(2)::before { color: var(--c-accento-testo); } }
.passi li:nth-child(3)::before { background: var(--c-rosa); color: var(--c-accento-testo); }
.passi li:nth-child(4)::before { background: var(--c-menta); color: var(--c-testo); box-shadow: inset 0 0 0 2px var(--c-ok); }
.passi p { color: var(--c-testo-2); }
@media (min-width: 48rem) { .passi { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--s-5); } }
@media (min-width: 64rem) { .passi--4 { grid-template-columns: repeat(4, minmax(0, 1fr)); } }

/* ---------- Timeline blocchi di 4 settimane ---------- */
.blocchi {
  display: grid; gap: var(--s-4); font-family: var(--f-titoli);
  padding: var(--s-5); background: var(--c-superficie); border-radius: var(--r-l); box-shadow: var(--ombra);
}
.blocco { display: grid; gap: var(--s-2); }
.blocco__etichetta { font-size: var(--t-xs); font-weight: 800; color: var(--c-testo-2); }
.blocco__riga { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)) auto; gap: 6px; align-items: stretch; }
.settimana {
  background: var(--c-lilla); color: var(--c-viola); font-weight: 800;
  padding: var(--s-2); font-size: 0.8125rem; font-variant-numeric: tabular-nums;
  text-align: center; border-radius: var(--r-s); min-width: 0;
}
.blocco--due .settimana { background: var(--c-menta); color: var(--c-ok); }
.checkin {
  display: flex; align-items: center; justify-content: center;
  padding: var(--s-2) var(--s-3); font-size: 0.8125rem; font-weight: 800;
  background: var(--c-accento); color: var(--c-accento-testo); border-radius: var(--r-pillola); white-space: nowrap;
}
.blocchi__legenda { font-family: var(--f-testo); font-size: var(--t-s); color: var(--c-testo-2); }

/* ---------- Card programmazioni ---------- */
.programmazioni { display: grid; gap: var(--s-5); }
@media (min-width: 40rem) { .programmazioni { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (min-width: 72rem) { .programmazioni { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: var(--s-4); } }

.card-prog {
  position: relative;
  display: flex; flex-direction: column; gap: var(--s-4);
  background: var(--c-superficie); border-radius: var(--r-l); box-shadow: var(--ombra);
  padding: var(--s-6) var(--s-5) var(--s-5);
  min-width: 0;
}
.card-prog--evidenza {
  background:
    linear-gradient(var(--c-superficie), var(--c-superficie)) padding-box,
    linear-gradient(135deg, var(--c-accento), var(--c-rosa), var(--c-viola)) border-box;
  border: 3px solid transparent;
  box-shadow: var(--ombra-grande);
}
.card-prog__badge {
  position: absolute; top: -0.95rem; left: var(--s-5);
  background: linear-gradient(135deg, var(--c-accento), var(--c-rosa)); color: var(--c-accento-testo);
  font-family: var(--f-titoli); font-size: 0.8125rem; font-weight: 900; letter-spacing: 0.04em; text-transform: uppercase;
  padding: 0.35rem 0.9rem; border-radius: var(--r-pillola);
}
.card-prog__durata { font-family: var(--f-titoli); font-size: var(--t-l); font-weight: 900; }
.card-prog__prezzo { display: grid; gap: var(--s-1); padding: var(--s-4); border-radius: var(--r-m); background: var(--c-sfondo); }
.prezzo {
  font-family: var(--f-titoli); font-weight: 900; font-size: 2.75rem; line-height: 1;
  font-variant-numeric: tabular-nums; letter-spacing: -0.02em; color: var(--c-testo);
}
.prezzo__euro { font-size: 1.5rem; font-weight: 800; margin-left: 0.15em; color: var(--c-viola); }
:root[data-theme="dark"] .prezzo__euro { color: var(--c-accento); }
@media (prefers-color-scheme: dark) { :root:not([data-theme="light"]) .prezzo__euro { color: var(--c-accento); } }
.prezzo__mese { font-family: var(--f-titoli); font-weight: 700; font-size: var(--t-s); color: var(--c-viola); font-variant-numeric: tabular-nums; }
.prezzo__nota { font-size: var(--t-xs); color: var(--c-testo-2); }
.card-prog__lista { list-style: none; margin: 0; padding: 0; display: grid; gap: var(--s-3); font-size: var(--t-s); flex: 1; }
.card-prog__lista li { display: grid; grid-template-columns: 1.4rem minmax(0, 1fr); gap: var(--s-2); }
.card-prog__lista li::before {
  content: "✓"; display: grid; place-items: center; width: 1.4rem; height: 1.4rem; margin-top: 0.15em; border-radius: 50%;
  background: var(--c-menta); color: var(--c-ok); font-family: var(--f-titoli); font-weight: 900; font-size: 0.75rem;
}
.card-prog__lista li.extra { font-weight: 700; }
.card-prog__lista li.extra::before { content: "★"; background: var(--c-burro); color: var(--c-avviso-testo); }
.card-prog .btn { width: 100%; }

.mini-prog { display: grid; gap: var(--s-3); grid-template-columns: repeat(2, minmax(0, 1fr)); }
@media (min-width: 60rem) { .mini-prog { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: var(--s-4); } }
.mini-prog__card {
  display: grid; gap: var(--s-2); align-content: start;
  background: var(--c-superficie); border-radius: var(--r-l); box-shadow: var(--ombra);
  padding: var(--s-5) var(--s-4); min-width: 0; position: relative;
}
.mini-prog__card--evidenza {
  background:
    linear-gradient(var(--c-superficie), var(--c-superficie)) padding-box,
    linear-gradient(135deg, var(--c-accento), var(--c-rosa), var(--c-viola)) border-box;
  border: 3px solid transparent;
}
.mini-prog__card .prezzo { font-size: 2rem; }
.mini-prog__card .prezzo__euro { font-size: 1.125rem; }
.mini-prog__card .btn { margin-top: var(--s-2); width: 100%; padding-inline: 0.5rem; font-size: 0.875rem; }
.etichetta-evidenza {
  justify-self: start; font-family: var(--f-titoli); font-size: 0.75rem; font-weight: 900; letter-spacing: 0.04em;
  text-transform: uppercase; color: var(--c-accento-testo);
  background: linear-gradient(135deg, var(--c-accento), var(--c-rosa)); padding: 0.25rem 0.7rem; border-radius: var(--r-pillola);
}

/* ---------- Tabelle ---------- */
.tabella-wrap {
  position: relative; overflow-x: auto; -webkit-overflow-scrolling: touch;
  border-radius: var(--r-l); background: var(--c-superficie); box-shadow: var(--ombra);
}
.tabella { width: 100%; min-width: 40rem; border-collapse: collapse; font-size: var(--t-s); font-variant-numeric: tabular-nums; }
.tabella caption { text-align: left; padding: var(--s-5) var(--s-5) var(--s-3); font-family: var(--f-titoli); font-weight: 900; font-size: var(--t-l); caption-side: top; }
.tabella th, .tabella td { padding: var(--s-3) var(--s-4); border-top: 1px solid var(--c-linea); text-align: center; vertical-align: top; }
.tabella thead th { font-family: var(--f-titoli); font-weight: 900; background: var(--c-lilla); border-top: 0; }
.tabella tbody th { text-align: left; font-weight: 500; }
.tabella .col-evidenza { background: color-mix(in srgb, var(--c-pesca) 60%, transparent); }
.tabella thead .col-evidenza { background: var(--c-pesca); }
.tabella .si { display: inline-grid; place-items: center; width: 1.6rem; height: 1.6rem; border-radius: 50%; background: var(--c-menta); color: var(--c-ok); font-weight: 900; font-family: var(--f-titoli); }
.tabella .no { color: var(--c-testo-2); }

/* ---------- Segnaposto foto ---------- */
.foto {
  position: relative;
  display: flex; align-items: flex-end;
  width: 100%; max-width: 100%;
  aspect-ratio: 4 / 5;
  background:
    radial-gradient(60% 50% at 30% 25%, var(--c-macchia-2), transparent 70%),
    radial-gradient(55% 45% at 75% 70%, var(--c-macchia-1), transparent 70%),
    var(--c-lilla);
  border-radius: var(--r-xl);
  overflow: hidden;
  box-shadow: var(--ombra);
}
.foto--larga { aspect-ratio: 16 / 10; }
.foto--quadrata { aspect-ratio: 1 / 1; }
.foto__testo {
  margin: var(--s-4); padding: var(--s-3) var(--s-4);
  background: var(--c-superficie); border-radius: var(--r-m);
  font-size: var(--t-xs); line-height: 1.45; color: var(--c-testo-2);
}
.foto__testo strong { display: block; color: var(--c-viola); font-family: var(--f-titoli); font-weight: 900; font-size: 0.8125rem; margin-bottom: 0.2rem; }

/* ---------- Avvisi e riquadri ---------- */
.avviso {
  background: var(--c-avviso-sfondo); color: var(--c-avviso-testo);
  border-radius: var(--r-m); padding: var(--s-4) var(--s-5);
  display: grid; gap: var(--s-2);
}
.avviso strong { font-family: var(--f-titoli); font-weight: 900; }
.avviso a { color: inherit; }

.riquadro {
  background: var(--c-superficie); border-radius: var(--r-m); box-shadow: var(--ombra);
  padding: var(--s-5); display: grid; gap: var(--s-3);
}
.requisito {
  background: var(--c-superficie); box-shadow: var(--ombra);
  padding: var(--s-5) var(--s-5) var(--s-5) calc(var(--s-5) + 3.5rem); display: grid; gap: var(--s-2);
  border-radius: var(--r-l); max-width: 50rem; position: relative;
}
.requisito::before {
  content: "!"; position: absolute; left: var(--s-5); top: var(--s-5);
  display: grid; place-items: center; width: 2.5rem; height: 2.5rem; border-radius: 50%;
  background: var(--c-burro); color: var(--c-avviso-testo); font-family: var(--f-titoli); font-weight: 900; font-size: 1.25rem;
}
.requisito__titolo { font-family: var(--f-titoli); font-weight: 900; font-size: var(--t-l); }
@media (max-width: 30rem) {
  .requisito { padding: var(--s-5); padding-top: calc(var(--s-5) + 3rem); }
}

.qualifica {
  display: grid; gap: var(--s-2); padding: var(--s-5);
  border-radius: var(--r-l); max-width: var(--larghezza-prosa);
  background:
    linear-gradient(var(--c-superficie), var(--c-superficie)) padding-box,
    linear-gradient(135deg, var(--c-accento), var(--c-rosa), var(--c-viola)) border-box;
  border: 3px solid transparent;
}
.qualifica .occhiello { box-shadow: none; background: var(--c-lilla); }
.qualifica__titolo { font-family: var(--f-titoli); font-weight: 900; font-size: var(--t-l); }
.qualifica__nota { font-size: var(--t-s); color: var(--c-testo-2); }

.citazione {
  margin: var(--s-6) 0; padding: var(--s-6) var(--s-5) var(--s-5);
  background: var(--c-superficie); border-radius: var(--r-l); box-shadow: var(--ombra); position: relative;
  font-family: var(--f-titoli); font-weight: 900;
  font-size: var(--t-xl); line-height: 1.25; text-wrap: balance; color: var(--c-viola);
}
.citazione::before {
  content: "“"; position: absolute; top: -1.1rem; left: var(--s-5);
  display: grid; place-items: center; width: 2.5rem; height: 2.5rem; border-radius: 50%;
  background: var(--c-accento); color: var(--c-accento-testo); font-size: 2rem; line-height: 1; padding-top: 0.6rem;
}
.citazione p { margin: 0; }

/* ---------- Per chi è / non è ---------- */
.per-chi { display: grid; gap: var(--s-5); }
@media (min-width: 48rem) { .per-chi { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--s-5); } }
.per-chi__colonna { display: grid; gap: var(--s-4); align-content: start; padding: var(--s-6) var(--s-5); border-radius: var(--r-l); min-width: 0; }
.per-chi__colonna--si { background: var(--c-menta); }
.per-chi__colonna--no { background: var(--c-pesca); }
.per-chi ul { margin: 0; padding: 0; list-style: none; display: grid; gap: var(--s-3); }
.per-chi li { display: grid; grid-template-columns: 1.6rem minmax(0, 1fr); gap: var(--s-2); }
.per-chi li::before {
  display: grid; place-items: center; width: 1.6rem; height: 1.6rem; margin-top: 0.1em; border-radius: 50%;
  background: var(--c-superficie); font-family: var(--f-titoli); font-weight: 900; font-size: 0.875rem;
}
.per-chi__colonna--si li::before { content: "✓"; color: var(--c-ok); }
.per-chi__colonna--no li::before { content: "–"; color: var(--c-viola); }
.per-chi__consiglio { font-size: var(--t-s); color: var(--c-testo); background: var(--c-superficie); padding: var(--s-4); border-radius: var(--r-m); }

/* ---------- Storia ---------- */
.storia { display: grid; gap: var(--s-7); }
@media (min-width: 60rem) { .storia { grid-template-columns: minmax(0, 0.8fr) minmax(0, 1.2fr); gap: var(--s-8); align-items: start; } }
.storia__foto { position: relative; }
@media (min-width: 60rem) { .storia__foto { position: sticky; top: calc(env(safe-area-inset-top, 0px) + 6rem); } }
.storia__capitolo + .storia__capitolo { margin-top: var(--s-7); }
.storia__capitolo h2 { font-size: var(--t-xl); margin-bottom: var(--s-4); }

.estratto { display: grid; gap: var(--s-6); align-items: center; }
@media (min-width: 48rem) { .estratto { grid-template-columns: minmax(0, 15rem) minmax(0, 1fr); gap: var(--s-7); } }
.estratto blockquote { margin: 0; font-family: var(--f-titoli); font-weight: 700; font-size: var(--t-l); line-height: 1.5; }
.estratto blockquote p + p { margin-top: var(--s-3); }

/* ---------- Metodo ---------- */
.ruoli { display: grid; gap: var(--s-5); }
@media (min-width: 48rem) { .ruoli { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--s-5); } }
.ruolo { display: grid; gap: var(--s-4); align-content: start; padding: var(--s-6) var(--s-5); background: var(--c-lilla); border-radius: var(--r-l); min-width: 0; }
.ruolo--io { background: var(--c-pesca); }
.ruolo ul { margin: 0; padding-left: 1.2rem; display: grid; gap: var(--s-2); }
.ruolo li::marker { color: var(--c-viola); }
.ruolo--io li::marker { color: var(--c-viola); }
.ruolo__etichetta {
  justify-self: start; font-family: var(--f-titoli); font-size: var(--t-s); font-weight: 900;
  background: var(--c-superficie); padding: 0.35rem 0.9rem; border-radius: var(--r-pillola);
}

.lettura-scheda { display: grid; gap: var(--s-4); align-content: start; }
.riga-esempio {
  font-family: var(--f-titoli); font-variant-numeric: tabular-nums; font-size: var(--t-l); font-weight: 900;
  padding: var(--s-4) var(--s-5); background: var(--c-superficie); border-radius: var(--r-pillola); box-shadow: var(--ombra);
  display: flex; flex-wrap: wrap; gap: var(--s-2) var(--s-3); align-items: center;
}
.riga-esempio span { white-space: nowrap; }
.riga-esempio .sep { color: var(--c-accento); }
.definizioni { display: grid; gap: var(--s-2); margin: 0; }
.definizioni div { display: grid; grid-template-columns: minmax(0, 5.5rem) minmax(0, 1fr); gap: var(--s-3); padding: var(--s-3) var(--s-4); background: var(--c-superficie); border-radius: var(--r-m); }
.definizioni dt { font-family: var(--f-titoli); font-weight: 900; color: var(--c-viola); font-variant-numeric: tabular-nums; }
.definizioni dd { margin: 0; color: var(--c-testo-2); }

/* ---------- FAQ ---------- */
.faq { display: grid; gap: var(--s-3); max-width: 50rem; }
.faq details { background: var(--c-superficie); border-radius: var(--r-m); box-shadow: var(--ombra); padding: 0 var(--s-5); }
.faq summary {
  list-style: none; cursor: pointer; display: flex; justify-content: space-between; align-items: center; gap: var(--s-4);
  min-height: 3.75rem; padding: var(--s-4) 0;
  font-family: var(--f-titoli); font-weight: 800; font-size: var(--t-m); line-height: 1.35;
}
.faq summary::-webkit-details-marker { display: none; }
.faq summary::after {
  content: "+"; flex: none; width: 2.25rem; height: 2.25rem; display: grid; place-items: center;
  background: var(--c-lilla); color: var(--c-viola); border-radius: 50%; font-weight: 900; font-size: 1.25rem; transition: transform .2s ease, background-color .2s ease;
}
.faq details[open] summary::after { transform: rotate(45deg); background: var(--c-accento); color: var(--c-accento-testo); }
.faq__risposta { padding: 0 0 var(--s-5); color: var(--c-testo-2); max-width: var(--larghezza-prosa); }
.faq__risposta > * + * { margin-top: var(--s-3); }

/* ---------- CTA finale ---------- */
.cta-finale { display: grid; gap: var(--s-5); justify-items: start; max-width: 44rem; }
.cta-finale p { font-size: var(--t-l); font-weight: 500; }

/* ---------- Form ---------- */
.form { display: grid; gap: var(--s-5); max-width: 42rem; }
.form#form-lista, .form#form-contatti {
  background: var(--c-superficie); padding: var(--s-6) var(--s-5); border-radius: var(--r-l); box-shadow: var(--ombra-grande);
}
@media (min-width: 48rem) { .form#form-lista, .form#form-contatti { padding: var(--s-7) var(--s-6); } }
.campo { display: grid; gap: var(--s-2); min-width: 0; }
.campo > label, .etichetta, fieldset > legend {
  font-family: var(--f-titoli); font-weight: 800; font-size: var(--t-m); color: var(--c-testo); line-height: 1.35;
}
.facoltativo { font-weight: 600; color: var(--c-testo-2); font-size: 0.9em; }
.aiuto { font-size: var(--t-s); color: var(--c-testo-2); line-height: 1.5; }

input[type="text"], input[type="email"], input[type="tel"], input[type="number"], input[type="date"],
select, textarea {
  width: 100%; min-height: 3.25rem;
  padding: 0.75rem 1rem;
  font: inherit; font-size: 1rem; color: var(--c-testo);
  background: var(--c-sfondo); border: 2px solid var(--c-linea-forte); border-radius: var(--r-s);
  transition: border-color .15s ease, box-shadow .15s ease, background-color .15s ease;
}
input:hover, select:hover, textarea:hover { border-color: var(--c-viola); }
textarea { min-height: 7rem; resize: vertical; line-height: 1.5; }
select {
  appearance: none; -webkit-appearance: none;
  background-image: linear-gradient(45deg, transparent 50%, var(--c-viola) 50%), linear-gradient(135deg, var(--c-viola) 50%, transparent 50%);
  background-position: calc(100% - 22px) 55%, calc(100% - 16px) 55%;
  background-size: 6px 6px, 6px 6px; background-repeat: no-repeat; padding-right: 2.75rem;
}
input:focus-visible, select:focus-visible, textarea:focus-visible {
  outline: none; border-color: var(--c-viola); background-color: var(--c-superficie);
  box-shadow: 0 0 0 4px color-mix(in srgb, var(--c-viola) 25%, transparent);
}
[aria-invalid="true"] { border-color: var(--c-errore) !important; box-shadow: 0 0 0 3px color-mix(in srgb, var(--c-errore) 22%, transparent); }

fieldset { border: 0; padding: 0; margin: 0; min-width: 0; display: grid; gap: var(--s-3); }
fieldset > legend { padding: 0; margin-bottom: var(--s-2); }

.scelte { display: flex; flex-wrap: wrap; gap: var(--s-2); }
.scelte--colonna { flex-direction: column; }
.scelta {
  display: inline-flex; align-items: center; gap: var(--s-3);
  min-height: var(--tocco); padding: 0.55rem 1.1rem;
  border: 2px solid var(--c-linea-forte); border-radius: var(--r-pillola); background: var(--c-superficie);
  cursor: pointer; font-size: var(--t-s); font-weight: 500; line-height: 1.35;
  transition: border-color .15s ease, background-color .15s ease;
}
.scelta:hover { border-color: var(--c-viola); }
.scelte--colonna .scelta { width: 100%; border-radius: var(--r-m); }
.scelta:has(input:checked) { border-color: var(--c-viola); background: var(--c-lilla); color: var(--c-testo); font-weight: 700; }
.scelta input { width: 1.2rem; height: 1.2rem; margin: 0; flex: none; accent-color: var(--c-viola); }

.consenso {
  display: grid; grid-template-columns: 1.4rem minmax(0, 1fr); gap: var(--s-3); align-items: start;
  padding: var(--s-4); border-radius: var(--r-m); background: var(--c-sfondo);
  font-size: var(--t-s); line-height: 1.5; cursor: pointer;
}
.consenso:has(input:checked) { background: var(--c-menta); }
.consenso input { width: 1.3rem; height: 1.3rem; margin: 0.12rem 0 0; accent-color: var(--c-viola); }

.si-no { display: grid; gap: var(--s-3); padding: var(--s-4) var(--s-5); border-radius: var(--r-m); background: var(--c-sfondo); }
.si-no legend { margin-bottom: var(--s-3); font-family: var(--f-testo); font-weight: 500; font-size: var(--t-m); line-height: 1.45; }
.si-no .scelte { gap: var(--s-2); }
.si-no .scelta { min-width: 6rem; justify-content: center; }

.errore-campo { color: var(--c-errore); font-family: var(--f-titoli); font-size: var(--t-s); font-weight: 800; }
.errore-campo:empty { display: none; }
.riepilogo-errori {
  background: var(--c-errore-sfondo); color: var(--c-testo);
  padding: var(--s-4) var(--s-5); border-radius: var(--r-m);
}
.riepilogo-errori h2 { font-size: var(--t-m); color: var(--c-errore); margin-bottom: var(--s-2); }
.riepilogo-errori ul { margin: 0; padding-left: 1.2rem; }
.riepilogo-errori a { color: var(--c-testo); }

.campo-trappola { position: absolute !important; left: -9999px !important; width: 1px; height: 1px; overflow: hidden; }

.form-griglia { display: grid; gap: var(--s-4); }
@media (min-width: 40rem) { .form-griglia--2 { grid-template-columns: repeat(2, minmax(0, 1fr)); } .form-griglia--3 { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
.form-griglia > * { min-width: 0; }

/* layout pagina lista d'attesa e contatti */
.layout-form { display: grid; gap: var(--s-7); }
@media (min-width: 64rem) { .layout-form { grid-template-columns: minmax(0, 0.85fr) minmax(0, 1.15fr); gap: var(--s-7); align-items: start; } }
.layout-form__lato { display: grid; gap: var(--s-5); }
.layout-form__lato .requisito { box-shadow: none; background: var(--c-superficie); }

/* ---------- Questionario a step ---------- */
.progresso {
  display: grid; gap: var(--s-3); margin-bottom: var(--s-6); font-family: var(--f-titoli);
  position: sticky; top: calc(env(safe-area-inset-top, 0px) + 4.75rem); z-index: 5;
  background: var(--c-superficie); padding: var(--s-4) var(--s-5); border-radius: var(--r-m); box-shadow: var(--ombra);
}
.progresso__testo { display: flex; justify-content: space-between; gap: var(--s-3); flex-wrap: wrap; font-size: var(--t-s); font-weight: 700; color: var(--c-testo-2); }
.progresso__testo strong { font-weight: 900; color: var(--c-testo); }
.progresso__barra { height: 10px; background: var(--c-lilla); border-radius: var(--r-pillola); overflow: hidden; }
.progresso__riempimento { height: 100%; width: 0; background: linear-gradient(90deg, var(--c-accento), var(--c-rosa), var(--c-viola)); border-radius: var(--r-pillola); transition: width .35s ease; }

.passo-q {
  display: grid; gap: var(--s-5); padding: var(--s-6) var(--s-5);
  background: var(--c-superficie); border-radius: var(--r-l); box-shadow: var(--ombra);
}
@media (min-width: 48rem) { .passo-q { padding: var(--s-7) var(--s-6); } }
.passo-q + .passo-q { margin-top: var(--s-5); }
.js .passo-q + .passo-q { margin-top: 0; }
.passo-q__titolo { display: grid; gap: var(--s-2); }
.passo-q__titolo h2 { font-size: var(--t-xl); }
.passo-q__titolo h2:focus { outline: none; }
.passo-q__numero {
  justify-self: start; font-family: var(--f-titoli); font-size: var(--t-xs); font-weight: 900; color: var(--c-viola);
  background: var(--c-lilla); padding: 0.25rem 0.75rem; border-radius: var(--r-pillola);
}

.nav-passi {
  display: flex; justify-content: space-between; gap: var(--s-3); flex-wrap: wrap;
  padding-top: var(--s-5);
}
.nav-passi .btn { min-width: 9rem; }
.nav-passi #btn-avanti { margin-left: auto; }

.esercizio-livello { display: grid; gap: var(--s-3); padding: var(--s-4) var(--s-5); border-radius: var(--r-m); background: var(--c-sfondo); }
.esercizio-livello legend { font-family: var(--f-titoli); font-weight: 900; }
.esercizio-livello .form-griglia { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--s-3); }
.esercizio-livello .campo > label { font-size: var(--t-xs); }
.esercizio-livello input, .esercizio-livello select { background-color: var(--c-superficie); }

.salvataggio {
  display: flex; flex-wrap: wrap; gap: var(--s-2) var(--s-3); align-items: center; font-size: var(--t-s); color: var(--c-testo-2);
  background: var(--c-menta); padding: var(--s-2) var(--s-2) var(--s-2) var(--s-4); border-radius: var(--r-m);
}
.btn-testo {
  background: var(--c-superficie); border: 0; padding: 0 var(--s-4); min-height: var(--tocco); border-radius: var(--r-pillola);
  font: inherit; font-family: var(--f-titoli); font-weight: 800; color: var(--c-viola); cursor: pointer;
}
.btn-testo:hover { text-decoration: underline; }

/* ---------- Pagine semplici (grazie, conferma) ---------- */
.conferma { display: grid; gap: var(--s-5); max-width: 44rem; }
.conferma__segno {
  width: 4.5rem; height: 4.5rem; border-radius: 50%; display: grid; place-items: center;
  background: linear-gradient(135deg, var(--c-accento), var(--c-rosa)); color: var(--c-accento-testo);
  font-family: var(--f-titoli); font-size: 2rem; font-weight: 900; box-shadow: var(--ombra-corallo);
}
.conferma .elenco-errori li::before { content: "•"; background: var(--c-menta); color: var(--c-ok); }

/* ---------- Pagine legali ---------- */
.bozza-legale {
  border: 2px dashed var(--c-avviso-bordo); background: var(--c-avviso-sfondo); color: var(--c-avviso-testo);
  padding: var(--s-4) var(--s-5); border-radius: var(--r-m); font-size: var(--t-s); line-height: 1.5;
}
.da-completare {
  background: var(--c-avviso-sfondo); color: var(--c-avviso-testo); border: 1px dashed var(--c-avviso-bordo);
  padding: 0 0.35em; border-radius: 6px; font-size: 0.92em; font-weight: 600;
  overflow-wrap: anywhere;
}
.indice-legale { list-style: none; padding: 0; margin: 0; display: flex; flex-wrap: wrap; gap: var(--s-2); font-family: var(--f-titoli); font-size: var(--t-s); }
.indice-legale a {
  display: inline-flex; align-items: center; min-height: var(--tocco); padding: 0 var(--s-4);
  background: var(--c-superficie); border-radius: var(--r-pillola); box-shadow: var(--ombra); font-weight: 800; text-decoration: none;
}

/* ---------- Contatti ---------- */
.contatti-lista { list-style: none; padding: 0; margin: 0; display: grid; gap: var(--s-2); }
.contatti-lista li {
  display: grid; grid-template-columns: minmax(0, 6.5rem) minmax(0, 1fr); gap: var(--s-3); align-items: center;
  padding: var(--s-4); background: var(--c-superficie); border-radius: var(--r-m); box-shadow: var(--ombra);
}
.contatti-lista .chiave { font-family: var(--f-titoli); font-weight: 900; font-size: var(--t-s); color: var(--c-viola); }

/* ---------- Footer ---------- */
.piede {
  background: var(--c-lilla); padding-block: var(--s-7) var(--s-6); font-size: var(--t-s);
  border-radius: var(--r-xl) var(--r-xl) 0 0; margin-top: var(--s-6);
}
.piede__griglia { display: grid; gap: var(--s-6); }
@media (min-width: 48rem) { .piede__griglia { grid-template-columns: minmax(0, 1.4fr) repeat(2, minmax(0, 1fr)); } }
.piede__titolo { font-family: var(--f-titoli); font-size: var(--t-s); font-weight: 900; color: var(--c-viola); margin-bottom: var(--s-2); }
.piede ul { list-style: none; margin: 0; padding: 0; display: grid; }
.piede ul a { display: inline-flex; align-items: center; min-height: var(--tocco); color: var(--c-testo); font-weight: 500; }
.piede__descrizione { color: var(--c-testo-2); max-width: 26rem; margin-top: var(--s-3); }
.piede__fondo {
  margin-top: var(--s-6); padding-top: var(--s-4); border-top: 2px solid var(--c-superficie);
  display: flex; flex-wrap: wrap; gap: var(--s-2) var(--s-5); color: var(--c-testo-2); font-size: var(--t-xs);
}

/* ---------- Utilità ---------- */
.mt-4 { margin-top: var(--s-4); }
.mt-5 { margin-top: var(--s-5); }
.mt-6 { margin-top: var(--s-6); }
.mt-7 { margin-top: var(--s-7); }
.testo-2 { color: var(--c-testo-2); }
.piccolo { font-size: var(--t-s); }

/* raccordo tra intestazione di pagina e riquadro requisito */
.hero + .sezione--stretta { padding-top: 0; }

/* foto vere: sostituiscono i riquadri .foto (vedi LEGGIMI.md) */
.foto-img { display: block; width: 100%; max-width: 100%; height: auto; aspect-ratio: 4 / 5; object-fit: cover; border-radius: var(--r-xl); }
.foto-img--quadrata { aspect-ratio: 1 / 1; }
.foto-img--larga { aspect-ratio: 16 / 10; }
.intestazione-sezione .occhiello, .prosa .occhiello { color: var(--c-viola); }
.piede ul a { text-decoration: none; } .piede ul a:hover { text-decoration: underline; color: var(--c-viola); }

/* riquadro "Incluso in ogni programmazione" */
.incluso { max-width: 50rem; }
.incluso__titolo { font-family: var(--f-titoli); font-weight: 900; font-size: var(--t-l); }
.incluso__lista { list-style: none; margin: 0; padding: 0; display: grid; gap: var(--s-3); }
@media (min-width: 40rem) { .incluso__lista { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
.incluso__lista li { display: grid; grid-template-columns: 1.4rem minmax(0, 1fr); gap: var(--s-2); font-size: var(--t-s); }
.incluso__lista li::before {
  content: "✓"; display: grid; place-items: center; width: 1.4rem; height: 1.4rem; margin-top: 0.15em; border-radius: 50%;
  background: var(--c-menta); color: var(--c-ok); font-family: var(--f-titoli); font-weight: 900; font-size: 0.75rem;
}

/* ---------- Scheda tecnica (Home e Metodo) ---------- */
.sigla {
  display: inline-grid; place-items: center; min-width: 1.75rem; height: 1.75rem; padding: 0 0.35rem;
  border-radius: 8px; background: var(--c-btn-scuro); color: var(--c-btn-scuro-testo);
  font-family: var(--f-titoli); font-weight: 900; font-size: 0.75rem; line-height: 1; flex: none;
}
.sigla--sup { background: var(--c-accento); color: var(--c-accento-testo); }
.scheda__es { display: flex; align-items: center; gap: var(--s-2); }
.scheda tr.superserie td { background: color-mix(in srgb, var(--c-lilla) 70%, transparent); }
.scheda tr.superserie td:first-child { border-radius: 10px 0 0 10px; }
.scheda tr.superserie td:last-child { border-radius: 0 10px 10px 0; }
.scheda__piede { flex-direction: column; align-items: stretch; line-height: 1.5; }
.scheda__piede strong { color: var(--c-testo); }
.scheda__fondo { display: flex; justify-content: space-between; align-items: center; gap: var(--s-3); flex-wrap: wrap; }
.scheda__fondo a { display: inline-flex; align-items: center; min-height: var(--tocco); font-family: var(--f-titoli); font-weight: 800; }

/* Home, telefono: ogni esercizio diventa un blocco con le misure in fila */
@media (max-width: 34rem) {
  .scheda thead { display: none; }
  .scheda table, .scheda tbody { display: block; }
  .scheda tr { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: var(--s-1) var(--s-2); padding: var(--s-3) var(--s-2); border-top: 1px solid var(--c-linea); }
  .scheda tr.superserie { background: color-mix(in srgb, var(--c-lilla) 70%, transparent); border-radius: 12px; border-top-color: transparent; }
  .scheda tr.superserie td { background: none; }
  .scheda td, .scheda td.num { display: block; border: 0; padding: 0; text-align: left; }
  .scheda td.scheda__es { grid-column: 1 / -1; display: flex; padding-bottom: var(--s-1); }
  .scheda td[data-label]::before {
    content: attr(data-label); display: block; font-family: var(--f-titoli); font-weight: 700;
    font-size: 0.6875rem; letter-spacing: 0.03em; text-transform: uppercase; color: var(--c-testo-2);
  }
}

.scheda-completa { background: var(--c-superficie); border-radius: var(--r-l); box-shadow: var(--ombra-grande); padding: var(--s-5); min-width: 0; }
@media (min-width: 48rem) { .scheda-completa { padding: var(--s-6); } }
.tabella-wrap--piatta { box-shadow: none; border: 1px solid var(--c-linea); border-radius: var(--r-m); }
.tabella--scheda { min-width: 60rem; }
.tabella--scheda th, .tabella--scheda td { text-align: left; vertical-align: middle; }
.tabella--scheda tbody th { font-family: var(--f-titoli); font-weight: 800; }
.tabella--scheda td:not(.nota) { white-space: nowrap; font-family: var(--f-titoli); font-weight: 700; }
.tabella--scheda td.nota { font-size: var(--t-xs); color: var(--c-testo-2); min-width: 14rem; }
.tabella--scheda tr.superserie > * { background: color-mix(in srgb, var(--c-lilla) 70%, transparent); }
.tabella--prog { min-width: 0; }
.tabella--prog th, .tabella--prog td { text-align: left; }
.tabella--prog tbody th { font-weight: 600; }
.tabella--prog tr.corrente > * { background: var(--c-lilla); font-weight: 800; }
.pill-corrente {
  display: inline-block; margin-left: var(--s-2); padding: 0.1rem 0.5rem; border-radius: var(--r-pillola);
  background: var(--c-accento); color: var(--c-accento-testo); font-family: var(--f-titoli); font-size: 0.6875rem; font-weight: 900; text-transform: uppercase;
}
.riepilogo-seduta { display: grid; gap: var(--s-3); margin: var(--s-5) 0 0; grid-template-columns: repeat(2, minmax(0, 1fr)); }
@media (min-width: 48rem) { .riepilogo-seduta { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) minmax(0, 2fr); } }
.riepilogo-seduta div { background: var(--c-sfondo); border-radius: var(--r-m); padding: var(--s-3) var(--s-4); min-width: 0; }
.riepilogo-seduta div:last-child { grid-column: 1 / -1; }
@media (min-width: 48rem) { .riepilogo-seduta div:last-child { grid-column: auto; } }
.riepilogo-seduta dt { font-family: var(--f-titoli); font-size: var(--t-xs); font-weight: 800; color: var(--c-testo-2); text-transform: uppercase; letter-spacing: 0.03em; }
.riepilogo-seduta dd { margin: 0; font-family: var(--f-titoli); font-weight: 900; font-size: var(--t-l); font-variant-numeric: tabular-nums; }
.riepilogo-seduta dd.piccolo { font-size: var(--t-s); font-weight: 700; }
.definizioni div { grid-template-columns: minmax(0, 6.5rem) minmax(0, 1fr); }

/* Titolo hero: seconda frase in evidenza */
.hero__testo h1 { max-width: 14ch; }
.titolo-evidenza { color: var(--c-titolo-evidenza); display: inline-block; }
.tabella--scheda tbody th { min-width: 13rem; }

/* Scheda completa su telefono: un riquadro per esercizio */
@media (max-width: 47.99rem) {
  .tabella-wrap--piatta { overflow: visible; border: 0; border-radius: 0; background: transparent; }
  .tabella--scheda { min-width: 0; }
  .tabella--scheda thead { display: none; }
  .tabella--scheda, .tabella--scheda tbody { display: block; }
  .tabella--scheda tr {
    display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--s-3) var(--s-3);
    padding: var(--s-4); margin-bottom: var(--s-3); border: 1px solid var(--c-linea); border-radius: var(--r-m);
  }
  .tabella--scheda tr.superserie { background: color-mix(in srgb, var(--c-lilla) 70%, transparent); border-color: transparent; }
  .tabella--scheda tr > * { display: block; border: 0; padding: 0; background: none !important; white-space: normal !important; }
  .tabella--scheda td.col-sigla { display: none; }
  .tabella--scheda tbody th { grid-column: 1 / -1; min-width: 0; display: flex; align-items: center; gap: var(--s-2); font-size: var(--t-m); }
  .tabella--scheda tbody th::before {
    content: attr(data-sigla); display: inline-grid; place-items: center; min-width: 1.75rem; height: 1.75rem; padding: 0 0.35rem;
    border-radius: 8px; background: var(--c-btn-scuro); color: var(--c-btn-scuro-testo); font-size: 0.75rem; font-weight: 900; flex: none;
  }
  .tabella--scheda tr.superserie th::before { background: var(--c-accento); color: var(--c-accento-testo); }
  .tabella--scheda td.nota { grid-column: 1 / -1; min-width: 0; }
  .tabella--scheda td[data-label]::before {
    content: attr(data-label); display: block; font-family: var(--f-titoli); font-weight: 700; font-size: 0.6875rem;
    letter-spacing: 0.03em; text-transform: uppercase; color: var(--c-testo-2); margin-bottom: 2px;
  }
}
@media (min-width: 64rem) {
  .tabella--scheda { min-width: 0; }
  .tabella--scheda tbody th { min-width: 10rem; }
  .tabella--scheda td.nota { min-width: 0; }
  .tabella--scheda th, .tabella--scheda td { padding-inline: var(--s-3); }
}

/* Corsi di aggiornamento nel riquadro qualifica */
.aggiornamenti { display: grid; gap: var(--s-3); margin-top: var(--s-3); padding-top: var(--s-4); border-top: 1px solid var(--c-linea); }
.aggiornamenti__titolo { font-family: var(--f-titoli); font-weight: 900; font-size: var(--t-m); }
.aggiornamenti__lista { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: var(--s-2); }
.aggiornamenti__lista li {
  margin: 0; padding: 0.4rem 0.9rem; border-radius: var(--r-pillola);
  background: var(--c-lilla); color: var(--c-testo); font-family: var(--f-titoli); font-weight: 800; font-size: var(--t-s);
}
.prosa .aggiornamenti__lista li + li { margin-top: 0; }
.prosa .aggiornamenti__lista { padding-left: 0; }

/* ---------- Foglio della programmazione (Home) ---------- */
.foglio { position: relative; margin: 0 14px 14px 0; min-width: 0; }
/* fogli impilati dietro, dritti */
.foglio::before, .foglio::after {
  content: ""; position: absolute; inset: 0; border-radius: var(--r-m);
  background: var(--c-superficie); border: 1px solid var(--c-linea);
}
.foglio::before { transform: translate(14px, 14px); box-shadow: var(--ombra); }
.foglio::after { transform: translate(7px, 7px); }
.foglio__carta {
  position: relative; z-index: 1;
  background: var(--c-superficie); border: 1px solid var(--c-linea); border-radius: var(--r-m);
  box-shadow: 0 1px 2px rgba(20, 20, 20, 0.05);
  padding: var(--s-5); overflow: hidden;
}
/* banda arancio in testa al foglio */
.foglio__carta::before {
  content: ""; position: absolute; inset: 0 0 auto; height: 6px;
  background: linear-gradient(90deg, var(--c-accento), var(--c-rosa));
}

.foglio__testa {
  display: flex; justify-content: space-between; align-items: flex-start; gap: var(--s-3);
  padding-bottom: var(--s-3); border-bottom: 2px solid var(--c-testo);
}
.foglio__marchio { display: grid; gap: 2px; }
.foglio__logo { font-family: var(--f-titoli); font-weight: 900; font-size: 1.125rem; letter-spacing: 0.32em; line-height: 1.1; }
.foglio__sotto { font-family: var(--f-titoli); font-weight: 700; font-size: 0.75rem; color: var(--c-testo-2); letter-spacing: 0.02em; }
.foglio__esempio {
  font-family: var(--f-titoli); font-weight: 900; font-size: 0.6875rem; letter-spacing: 0.08em; text-transform: uppercase;
  color: var(--c-viola); border: 1.5px solid currentColor; border-radius: 6px; padding: 0.15rem 0.45rem; white-space: nowrap;
}

.foglio__meta {
  display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--s-2) var(--s-3);
  margin: 0; padding: var(--s-3) 0; border-bottom: 1px solid var(--c-linea);
}
.foglio__meta div { min-width: 0; }
.foglio__meta dt { font-family: var(--f-titoli); font-weight: 700; font-size: 0.6875rem; letter-spacing: 0.04em; text-transform: uppercase; color: var(--c-testo-2); }
.foglio__meta dd { margin: 0; font-family: var(--f-titoli); font-weight: 800; font-size: var(--t-xs); line-height: 1.3; }

.foglio__tabella { width: 100%; border-collapse: collapse; font-variant-numeric: tabular-nums; font-size: var(--t-s); }
.foglio__tabella th {
  text-align: left; font-family: var(--f-titoli); font-weight: 800; font-size: 0.6875rem; letter-spacing: 0.04em; text-transform: uppercase;
  color: var(--c-testo-2); padding: var(--s-3) var(--s-2) var(--s-2) 0;
}
.foglio__tabella td { padding: var(--s-3) var(--s-2) var(--s-3) 0; border-top: 1px solid var(--c-linea); vertical-align: top; }
.foglio__tabella .num { text-align: right; white-space: nowrap; padding-left: var(--s-2); }
.foglio__tabella th:last-child, .foglio__tabella td:last-child { padding-right: 0; }
.foglio__tabella td.num { font-family: var(--f-titoli); font-weight: 800; }
.foglio__tabella tr.superserie td { background: color-mix(in srgb, var(--c-lilla) 70%, transparent); }
.foglio__es { display: flex; align-items: flex-start; gap: var(--s-2); }
.foglio__nome { display: grid; gap: 6px; font-weight: 600; line-height: 1.3; }
.foglio__caselle { display: flex; gap: 4px; }
.casella { width: 12px; height: 12px; border: 1.5px solid var(--c-linea-forte); border-radius: 3px; background: var(--c-superficie); }

.foglio__piede { display: grid; gap: var(--s-3); margin-top: var(--s-2); padding-top: var(--s-3); border-top: 2px solid var(--c-testo); }
.foglio__legenda { font-size: var(--t-xs); color: var(--c-testo-2); line-height: 1.5; margin: 0; }
.foglio__legenda strong { color: var(--c-testo); font-family: var(--f-titoli); }
.foglio__fondo { display: flex; justify-content: space-between; align-items: flex-end; gap: var(--s-3); flex-wrap: wrap; }
.foglio__fondo a { display: inline-flex; align-items: center; min-height: var(--tocco); font-family: var(--f-titoli); font-weight: 800; font-size: var(--t-s); }
.foglio__firma { display: grid; justify-items: end; gap: 2px; padding-top: var(--s-2); border-top: 1px solid var(--c-testo-2); min-width: 9rem; }
.foglio__firma-nome { font-family: var(--f-titoli); font-weight: 900; font-size: var(--t-m); color: var(--c-viola); }
.foglio__firma-ruolo { font-size: 0.6875rem; color: var(--c-testo-2); }

/* Telefono: ogni esercizio diventa una riga a blocchi */
@media (max-width: 34rem) {
  .foglio { margin: 0 10px 10px 0; }
  .foglio::before { transform: translate(10px, 10px); }
  .foglio::after { transform: translate(5px, 5px); }
  .foglio__carta { padding: var(--s-4); }
  .foglio__meta { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .foglio__tabella thead { display: none; }
  .foglio__tabella, .foglio__tabella tbody { display: block; }
  .foglio__tabella tr { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: var(--s-1) var(--s-2); padding: var(--s-3) var(--s-2); border-top: 1px solid var(--c-linea); }
  .foglio__tabella tr.superserie { background: color-mix(in srgb, var(--c-lilla) 70%, transparent); border-radius: 12px; border-top-color: transparent; }
  .foglio__tabella tr.superserie td { background: none; }
  .foglio__tabella td, .foglio__tabella td.num { display: block; border: 0; padding: 0; text-align: left; }
  .foglio__tabella td.foglio__es { grid-column: 1 / -1; display: flex; padding-bottom: var(--s-1); }
  .foglio__tabella td[data-label]::before {
    content: attr(data-label); display: block; font-family: var(--f-titoli); font-weight: 700;
    font-size: 0.6875rem; letter-spacing: 0.03em; text-transform: uppercase; color: var(--c-testo-2);
  }
}
/* Metodo: l'intestazione da documento sopra la tabella completa */
.scheda-completa .foglio__meta { margin-bottom: var(--s-4); }
/* badge esercizio leggibile in entrambi i temi; firma sempre a destra */
.sigla { background: var(--c-testo); color: var(--c-superficie); }
.sigla--sup { background: var(--c-accento); color: var(--c-accento-testo); }
.tabella--scheda tbody th::before { background: var(--c-testo); color: var(--c-superficie); }
.tabella--scheda tr.superserie th::before { background: var(--c-accento); color: var(--c-accento-testo); }
.foglio__firma { margin-left: auto; }

/* =========================================================
   Revisione design · 31 ottobre 2026
   Regole: arancio solo per azioni e un'evidenza nel titolo;
   nero per carattere; pannelli neutri; card solo dove servono.
   ========================================================= */

/* --- Pannelli neutri al posto di beige/pesca --- */
.sezione--superficie[class] { background: var(--c-pannello); }
.piede { background: var(--c-pannello); }

/* --- Fascia nera --- */
.sezione--nero {
  background: var(--c-banda); color: var(--c-banda-testo);
  border-radius: var(--r-l);
  margin-inline: max(8px, env(safe-area-inset-left, 0px)) max(8px, env(safe-area-inset-right, 0px));
}
@media (min-width: 48rem) {
  .sezione--nero { border-radius: var(--r-xl); margin-inline: max(16px, env(safe-area-inset-left, 0px)) max(16px, env(safe-area-inset-right, 0px)); }
}
.sezione--nero h2, .sezione--nero h3 { color: var(--c-banda-testo); }
.sezione--nero p, .sezione--nero .intestazione-sezione p { color: var(--c-banda-testo-2); }
.sezione--nero .occhiello { color: var(--c-banda-testo-2); }
.sezione--nero .elenco-errori { gap: 0; }
.sezione--nero .elenco-errori li {
  background: none; box-shadow: none; border-radius: 0; color: var(--c-banda-testo);
  padding: var(--s-4) 0; border-top: 1px solid var(--c-banda-linea);
}
.sezione--nero .elenco-errori li:last-child { border-bottom: 1px solid var(--c-banda-linea); }
.sezione--nero .elenco-errori li::before { background: none; color: var(--c-banda-testo); box-shadow: inset 0 0 0 1.5px var(--c-banda-linea); }

/* --- Etichette: testo semplice, niente pillola arancio --- */
.occhiello { background: none; box-shadow: none; padding: 0; color: var(--c-testo-2); gap: var(--s-2); }
.occhiello::before { width: 1.25rem; height: 2px; border-radius: 2px; background: currentColor; }
.pilastro .occhiello, .qualifica .occhiello { background: none; }

/* --- Arancio solo per le azioni: link, prezzi, firme, etichette tornano neutri --- */
a { color: var(--c-testo); text-decoration-color: var(--c-accento); }
.link-freccia, .foglio__fondo a, .scheda__fondo a { color: var(--c-testo); }
.nav__lista a:hover, .nav__lista a[aria-current="page"] { background: var(--c-pannello); color: var(--c-testo); }
:root .logo__sotto, :root:not([data-theme="light"]) .logo__sotto, :root[data-theme="dark"] .logo__sotto { color: var(--c-testo-2); }
:root .prezzo__euro, :root:not([data-theme="light"]) .prezzo__euro, :root[data-theme="dark"] .prezzo__euro { color: var(--c-testo); }
.prezzo__mese { color: var(--c-testo-2); }
.foglio__firma-nome, .scheda__firma { color: var(--c-testo); }
.foglio__esempio { color: var(--c-testo-2); }
.definizioni dt, .piede__titolo { color: var(--c-testo); }
.contatti-lista .chiave { color: var(--c-testo-2); }
.passo-q__numero { color: var(--c-testo); background: var(--c-pannello); }
.btn--secondario:hover { border-color: var(--c-testo); color: var(--c-testo); }
.btn-testo { color: var(--c-testo); }

/* --- Meno card --- */
.pilastro { background: none; box-shadow: none; border-radius: 0; padding: var(--s-4) 0 0; border-top: 2px solid var(--c-testo); }
.pilastro::before { display: none; }
.passi li { background: none; box-shadow: none; border-radius: 0; padding: var(--s-4) 0 0; border-top: 1px solid var(--c-linea-forte); }
:root .passi li::before, :root .passi li:nth-child(n)::before, :root:not([data-theme="light"]) .passi li:nth-child(n)::before, :root[data-theme="dark"] .passi li:nth-child(n)::before {
  background: var(--c-testo); color: var(--c-superficie); box-shadow: none;
}
.riquadro { box-shadow: none; border: 1px solid var(--c-linea); }
.requisito, .layout-form__lato .requisito { box-shadow: none; background: var(--c-pannello); max-width: none; }
.riquadro.incluso { background: var(--c-pannello); border: 0; max-width: none; }
.contatti-lista { gap: 0; }
.contatti-lista li { background: none; box-shadow: none; border-radius: 0; padding: var(--s-4) 0; border-top: 1px solid var(--c-linea); }
.contatti-lista li:last-child { border-bottom: 1px solid var(--c-linea); }
.citazione {
  background: none; box-shadow: none; border-radius: 0; color: var(--c-testo);
  border-left: 4px solid var(--c-testo); padding: var(--s-1) 0 var(--s-1) var(--s-5); margin: var(--s-6) 0;
}
.citazione::before { display: none; }
.qualifica { background: var(--c-superficie); border: 2px solid var(--c-testo); }
.aggiornamenti__lista li { background: var(--c-pannello); }
.per-chi__colonna--si, .per-chi__colonna--no { background: var(--c-pannello); }
.per-chi__colonna--si li::before { color: var(--c-testo); }
.per-chi__colonna--no li::before { color: var(--c-testo-2); }
.tabella thead th { background: var(--c-pannello); white-space: nowrap; }
.tabella thead .col-evidenza { background: var(--c-lilla); }
.scheda-completa { box-shadow: none; border: 1px solid var(--c-linea); }
.layout-form__lato .requisito::before, .requisito::before { background: var(--c-superficie); }

/* --- Programmazioni: evidenza solida, niente gradienti --- */
.card-prog--evidenza, .mini-prog__card--evidenza { background: var(--c-superficie); border: 2px solid var(--c-accento); }
.card-prog__badge, .etichetta-evidenza { background: var(--c-accento); }
.griglia--affiancati { align-items: stretch; }

/* card prezzi allineate: badge fuori dal flusso, pulsante sempre in fondo */
.mini-prog { padding-top: var(--s-3); }
.mini-prog__card { display: flex; flex-direction: column; gap: var(--s-2); padding-top: var(--s-6); }
.mini-prog__card > .etichetta-evidenza { position: absolute; top: -0.8rem; left: var(--s-4); }
.mini-prog__card .btn { margin-top: auto; }
.mini-prog__card .prezzo__mese { margin-bottom: var(--s-3); }
.card-prog .btn, .mini-prog__card .btn { font-size: 0.875rem; padding-inline: 0.75rem; }
@media (min-width: 60rem) { .card-prog .btn, .mini-prog__card .btn { white-space: nowrap; } }

/* --- Hero su telefono: foglio ridotto a 2 esercizi --- */
@media (max-width: 34rem) {
  .foglio__tabella tbody tr:nth-child(n+3) { display: none; }
  .leg-sup { display: none; }
}
/* residui arancio fuori dalle azioni */
.intestazione-sezione .occhiello, .prosa .occhiello { color: var(--c-testo-2); }
.sezione--nero .intestazione-sezione .occhiello { color: var(--c-banda-testo-2); }
.foto__testo strong { color: var(--c-testo); }
.faq summary::after { background: var(--c-pannello); color: var(--c-testo); }
.faq details[open] summary::after { background: var(--c-testo); color: var(--c-superficie); }
.card-prog__lista li::before, .incluso__lista li::before { background: var(--c-menta); color: var(--c-testo); }
/* contenuti allineati in alto nei riquadri affiancati e nelle card */
.riquadro.incluso, .requisito { align-content: start; }
.card-prog__lista { align-content: start; }
.card-prog__prezzo { background: var(--c-pannello); }

/* Chi sono: chiusura e formazione sobria */
.storia__chiusura { font-family: var(--f-titoli); font-weight: 800; font-size: var(--t-l); line-height: 1.4; color: var(--c-testo); }
.formazione-breve { margin-top: var(--s-7); padding-top: var(--s-4); border-top: 1px solid var(--c-linea-forte); }
.formazione-breve p { font-size: var(--t-s); color: var(--c-testo-2); }
.formazione-breve strong { color: var(--c-testo); font-family: var(--f-titoli); }

/* ---------- Pagine esercizio ---------- */
.esercizio-dati { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--s-3) var(--s-5); margin: var(--s-3) 0 0; max-width: 40rem; }
@media (min-width: 48rem) { .esercizio-dati { grid-template-columns: repeat(4, minmax(0, 1fr)); max-width: none; } }
.esercizio-dati div { min-width: 0; padding-top: var(--s-2); border-top: 2px solid var(--c-testo); }
.esercizio-dati dt { font-family: var(--f-titoli); font-weight: 800; font-size: 0.75rem; letter-spacing: 0.04em; text-transform: uppercase; color: var(--c-testo-2); }
.esercizio-dati dd { margin: 0; font-family: var(--f-titoli); font-weight: 800; }

.esercizio-griglia { display: grid; grid-template-columns: minmax(0, 1fr); gap: var(--s-7); }
@media (min-width: 60rem) { .esercizio-griglia { grid-template-columns: minmax(0, 1.05fr) minmax(0, 0.95fr); gap: var(--s-8); align-items: start; } }
.esercizio-media { display: grid; grid-template-columns: minmax(0, 1fr); gap: var(--s-4); min-width: 0; }
@media (min-width: 60rem) { .esercizio-media { position: sticky; top: calc(env(safe-area-inset-top, 0px) + 6rem); } }
.prosa ol { padding-left: 1.25rem; }

.schema-esercizio { min-width: 0; margin: 0; background: var(--c-superficie); border-radius: var(--r-l); padding: var(--s-4); border: 1px solid var(--c-linea); }
.schema-esercizio svg { display: block; width: 100%; height: auto; color: var(--c-testo); }
.schema-esercizio figcaption { font-size: var(--t-xs); color: var(--c-testo-2); margin-top: var(--s-2); line-height: 1.5; }
.video-segnaposto {
  display: flex; align-items: center; gap: var(--s-4); padding: var(--s-4) var(--s-5);
  border: 2px dashed var(--c-linea-forte); border-radius: var(--r-l); color: var(--c-testo-2);
}
.video-segnaposto__icona { display: grid; place-items: center; width: 3rem; height: 3rem; border-radius: 50%; background: var(--c-pannello); color: var(--c-testo); flex: none; }
.video-segnaposto strong { display: block; color: var(--c-testo); font-family: var(--f-titoli); }

.tabella--errori { min-width: 40rem; }
.tabella--errori th, .tabella--errori td { text-align: left; }
.tabella--errori tbody th { font-family: var(--f-titoli); font-weight: 800; }
.spunti { list-style: none; padding: 0 !important; display: grid; gap: var(--s-3); }
.spunti li { font-family: var(--f-titoli); font-weight: 800; font-size: var(--t-l); padding-left: var(--s-4); border-left: 3px solid var(--c-testo); }
.prosa .spunti li + li { margin-top: 0; }
.riga-esempio { box-shadow: none; border: 1px solid var(--c-linea); }
.riga-esempio .sep { color: var(--c-testo-2); }

/* ---------- Manichino anatomico (schemi esercizi) ---------- */
.schema-esercizio .corpo { fill: var(--c-testo); }
.schema-esercizio .corpo--lontano { fill: var(--c-testo-2); opacity: 0.55; }
.schema-esercizio .disco { fill: color-mix(in srgb, var(--c-superficie) 22%, transparent); stroke: var(--c-testo-2); stroke-width: 3; }
.schema-esercizio .disco--interno { fill: none; stroke-width: 2; }
.schema-esercizio .bilanciere { fill: var(--c-testo); stroke: var(--c-superficie); stroke-width: 2; }
.schema-esercizio .guida { stroke: var(--c-titolo-evidenza); stroke-width: 2.5; stroke-dasharray: 6 6; }
.schema-esercizio .punto-guida { fill: var(--c-titolo-evidenza); stroke: var(--c-superficie); stroke-width: 2; }
.schema-esercizio .riferimento { stroke: var(--c-testo-2); stroke-width: 1.5; stroke-dasharray: 3 5; }
.schema-esercizio .marcatore circle { fill: var(--c-titolo-evidenza); }
.schema-esercizio .marcatore text { fill: #FFFFFF; font-family: var(--f-titoli); font-weight: 900; font-size: 18px; }
.schema-esercizio .etichetta-fase { font-family: var(--f-titoli); font-weight: 800; font-size: 22px; fill: var(--c-testo); }
.schema-esercizio .suolo { stroke: var(--c-linea-forte); stroke-width: 2; }
.legenda-schema { list-style: none; margin: var(--s-4) 0 0; padding: 0; display: grid; gap: var(--s-2); font-size: var(--t-s); }
.legenda-schema li { display: grid; grid-template-columns: 1.75rem minmax(0, 1fr); gap: var(--s-2); align-items: start; line-height: 1.45; }
.legenda-schema__n {
  display: grid; place-items: center; width: 1.5rem; height: 1.5rem; border-radius: 50%;
  background: var(--c-titolo-evidenza); color: #FFFFFF; font-family: var(--f-titoli); font-weight: 900; font-size: 0.8125rem;
}
.schema-esercizio .attrezzo { fill: var(--c-linea-forte); }
.schema-esercizio .sbarra { stroke: var(--c-testo-2); stroke-width: 5; stroke-linecap: round; }
.schema-esercizio .sbarra-sezione { fill: var(--c-testo-2); stroke: var(--c-superficie); stroke-width: 2; }

/* Schema scorrevole su schermi stretti: il testo resta leggibile */
.schema-scorri { overflow-x: auto; overscroll-behavior-x: contain; -webkit-overflow-scrolling: touch; border-radius: var(--r-m); }
.schema-scorri svg { min-width: calc(var(--l, 600) * 0.78px); }
.schema-scorri:focus-visible { outline: 3px solid var(--c-viola); outline-offset: 2px; }
.schema-suggerimento { display: none; margin: var(--s-2) 0 0; font-family: var(--f-titoli); font-weight: 800; font-size: var(--t-xs); color: var(--c-testo-2); }
.schema-esercizio.scorrevole .schema-suggerimento { display: block; }

/* Navigazione tra esercizi */
.naviga-esercizi { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: var(--s-3); margin-top: var(--s-7); }
.naviga-esercizi__link {
  display: grid; gap: 2px; padding: var(--s-4); border: 1px solid var(--c-linea); border-radius: var(--r-m);
  font-family: var(--f-titoli); font-weight: 800; color: var(--c-testo); text-decoration: none; min-height: var(--tocco);
}
.naviga-esercizi__link span { font-size: var(--t-xs); font-weight: 700; color: var(--c-testo-2); text-transform: uppercase; letter-spacing: 0.04em; }
.naviga-esercizi__link span::before { content: "← "; }
.naviga-esercizi__link--succ { text-align: right; grid-column: 2; }
.naviga-esercizi__link--succ span::before { content: ""; }
.naviga-esercizi__link--succ span::after { content: " →"; }
.naviga-esercizi__link:hover { border-color: var(--c-testo); }

.occhiello a { color: inherit; text-decoration-thickness: 1px; text-underline-offset: 3px; }

/* Indice esercizi */
.griglia-esercizi { list-style: none; margin: 0; padding: 0; display: grid; gap: var(--s-5); }
@media (min-width: 48rem) { .griglia-esercizi { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (min-width: 72rem) { .griglia-esercizi { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
.card-esercizio {
  position: relative; display: grid; grid-template-rows: auto 1fr; overflow: hidden;
  background: var(--c-superficie); border: 1px solid var(--c-linea); border-radius: var(--r-l);
  transition: border-color .15s ease, transform .15s ease;
}
.card-esercizio__schema { padding: var(--s-4) var(--s-4) var(--s-2); border-bottom: 1px solid var(--c-linea); background: var(--c-sfondo); }
.card-esercizio__schema svg { display: block; width: 100%; height: 9.5rem; color: var(--c-testo); }
.card-esercizio__schema .marcatore, .card-esercizio__schema .etichetta-fase { display: none; }
.card-esercizio__schema .corpo { fill: var(--c-testo); }
.card-esercizio__schema .corpo--lontano { fill: var(--c-testo-2); opacity: 0.55; }
.card-esercizio__schema .disco { fill: transparent; stroke: var(--c-testo-2); stroke-width: 3; }
.card-esercizio__schema .disco--interno { fill: none; stroke-width: 2; }
.card-esercizio__schema .bilanciere { fill: var(--c-testo); }
.card-esercizio__schema .guida { stroke: var(--c-titolo-evidenza); stroke-width: 3; stroke-dasharray: 6 6; }
.card-esercizio__schema .punto-guida { fill: var(--c-titolo-evidenza); }
.card-esercizio__schema .riferimento { stroke: var(--c-testo-2); stroke-width: 2; stroke-dasharray: 3 5; }
.card-esercizio__schema .suolo, .card-esercizio__schema .attrezzo { stroke: var(--c-linea-forte); fill: var(--c-linea-forte); stroke-width: 2; }
.card-esercizio__schema .sbarra { stroke: var(--c-testo-2); stroke-width: 5; stroke-linecap: round; }
.card-esercizio__schema .sbarra-sezione { fill: var(--c-testo-2); }
.card-esercizio__testo { display: grid; align-content: start; gap: var(--s-2); padding: var(--s-5); }
.card-esercizio__gruppo { margin: 0; font-family: var(--f-titoli); font-weight: 800; font-size: var(--t-xs); letter-spacing: 0.06em; text-transform: uppercase; color: var(--c-testo-2); }
.card-esercizio__nome { margin: 0; font-size: var(--t-l); }
.card-esercizio__testo p { margin: 0; }
.card-esercizio__muscoli { font-size: var(--t-xs); color: var(--c-testo-2); }
.card-esercizio__vai { margin-top: var(--s-2); font-family: var(--f-titoli); font-weight: 800; color: var(--c-viola); }

/* Approfondimenti */
.griglia-articoli { list-style: none; margin: 0; padding: 0; display: grid; gap: var(--s-5); }
@media (min-width: 60rem) { .griglia-articoli { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
.card-articolo {
  position: relative; display: grid; align-content: start; gap: var(--s-3); padding: var(--s-6) var(--s-5);
  background: var(--c-superficie); border: 1px solid var(--c-linea); border-radius: var(--r-l);
  transition: border-color .15s ease;
}
.card-articolo p { margin: 0; }
.card-articolo__cat, .card-articolo__data { font-family: var(--f-titoli); font-weight: 800; font-size: var(--t-xs); letter-spacing: 0.04em; text-transform: uppercase; color: var(--c-testo-2); }
.card-articolo__data { text-transform: none; letter-spacing: 0; font-weight: 700; padding-top: var(--s-3); border-top: 1px solid var(--c-linea); }
.card-articolo__vai { font-family: var(--f-titoli); font-weight: 800; color: var(--c-viola); }
.griglia-articoli .card-articolo { grid-template-rows: auto 1fr; }
.card-articolo__titolo { margin: 0; font-size: var(--t-l); }

.articolo__meta { margin-top: var(--s-4); font-family: var(--f-titoli); font-weight: 700; font-size: var(--t-s); color: var(--c-testo-2); }
.articolo__corpo { margin-inline: auto; }
.articolo__corpo h2 { font-size: var(--t-xl); }
.in-breve { padding: var(--s-5); border-radius: var(--r-l); background: var(--c-pannello); }
.in-breve h2 { margin: 0 0 var(--s-3) !important; font-size: var(--t-m) !important; text-transform: uppercase; letter-spacing: 0.06em; }
.in-breve ul { margin: 0; }
.rif { font-size: 0.7em; line-height: 0; margin-left: 1px; }
.rif a { font-family: var(--f-titoli); font-weight: 800; color: var(--c-viola); text-decoration: none; padding: 0 2px; }
.rif a:hover { text-decoration: underline; }
.fonti { margin-top: var(--s-8) !important; padding-top: var(--s-5); border-top: 2px solid var(--c-testo); }
.fonti h2 { margin-top: 0 !important; font-size: var(--t-l) !important; }
.fonti ol { font-size: var(--t-s); color: var(--c-testo-2); }
.fonti li { overflow-wrap: anywhere; }
.fonti li:target { background: var(--c-pannello); border-radius: var(--r-s, 6px); }
.fonti cite { font-style: normal; color: var(--c-testo); }
.altri-articoli h2 { font-size: var(--t-l) !important; }
.articolo .tabella th, .articolo .tabella td { text-align: left; }
@media (min-width: 60rem) { .schema-scorri svg { min-width: 0; } }
/* Numeri dei punti chiave: contrasto AA in chiaro e in scuro */
.schema-esercizio .marcatore circle { fill: var(--c-viola); }
.legenda-schema__n { background: var(--c-viola); }
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) .schema-esercizio .marcatore text { fill: #141414; }
  :root:not([data-theme="light"]) .legenda-schema__n { color: #141414; }
}
:root[data-theme="dark"] .schema-esercizio .marcatore text { fill: #141414; }
:root[data-theme="dark"] .legenda-schema__n { color: #141414; }

/* ---------- Logo: scritta VIR≡S disegnata ---------- */
.logo { flex-direction: row; align-items: center; }
.logo-ja { display: block; height: 2.5rem; width: auto; max-width: 100%; color: var(--c-testo); overflow: visible; }
.logo-ja__nero { stroke: currentColor; }
.logo-ja__arancio { stroke: var(--c-accento); }
.logo-ja__testo { fill: currentColor; }
.logo-ja__sotto { fill: var(--c-testo-2); }
.logo-ja__filetto { fill: var(--c-linea-forte); }
.logo-ja__trattino { fill: var(--c-accento); }
@media (max-width: 23.4rem) { .testata .logo-ja { height: 1.85rem; } }
.foglio__logo { display: inline-flex; align-items: center; gap: 0.45rem; font-family: var(--f-titoli); font-weight: 800; font-size: 0.8125rem; letter-spacing: 0.14em; text-transform: uppercase; }
.foglio__logo .logo-ja--simbolo { height: 1.35rem; width: auto; }

/* Link "Leggi …" nelle schede: unica parte cliccabile */
.card-esercizio__vai, .card-articolo__vai {
  justify-self: start; display: inline-flex; align-items: center; gap: 0.35em; min-height: var(--tocco);
  font-family: var(--f-titoli); font-weight: 800; color: var(--c-viola); text-decoration: none;
}
.card-esercizio__vai:hover, .card-articolo__vai:hover { text-decoration: underline; text-underline-offset: 4px; text-decoration-color: currentColor; }
.card-esercizio__vai span[aria-hidden], .card-articolo__vai span[aria-hidden] { transition: transform .15s ease; }
.card-esercizio__vai:hover span[aria-hidden], .card-articolo__vai:hover span[aria-hidden] { transform: translateX(3px); }
@media (prefers-reduced-motion: reduce) { .card-esercizio__vai span[aria-hidden], .card-articolo__vai span[aria-hidden] { transition: none; } }
.card-esercizio__vai span[aria-hidden], .card-articolo__vai span[aria-hidden] { display: inline-block; }

/* =========================================================
   Più impatto visivo senza foto
   ========================================================= */

/* Hero scuro */
.hero--scuro {
  background: var(--c-banda); color: var(--c-banda-testo);
  border-radius: var(--r-l);
  margin-inline: max(8px, env(safe-area-inset-left, 0px)) max(8px, env(safe-area-inset-right, 0px));
}
@media (min-width: 48rem) {
  .hero--scuro { border-radius: var(--r-xl); margin-inline: max(16px, env(safe-area-inset-left, 0px)) max(16px, env(safe-area-inset-right, 0px)); }
}
.hero--scuro::before {
  inset: 0; height: auto;
  background:
    radial-gradient(42% 55% at 82% 40%, rgba(255, 106, 19, 0.38), transparent 70%),
    radial-gradient(30% 40% at 8% 105%, rgba(255, 106, 19, 0.18), transparent 70%);
}
.hero--scuro h1 { color: var(--c-banda-testo); }
.hero--scuro .titolo-evidenza { color: #FF6A13; }
.hero--scuro .lead, .hero--scuro .hero__nota, .hero--scuro .occhiello { color: var(--c-banda-testo-2); }
.hero--scuro .btn--secondario { background: transparent; color: var(--c-banda-testo); border-color: rgba(255, 255, 255, 0.35); }
.hero--scuro .btn--secondario:hover { border-color: #fff; color: #fff; }
.hero--scuro .scheda, .hero--scuro .foglio { box-shadow: 0 30px 70px -25px rgba(0, 0, 0, 0.7); }

/* Numeri */
.numeri { padding-block: var(--s-7) var(--s-6); }
.numeri__lista { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--s-6) var(--s-5); }
@media (min-width: 60rem) { .numeri__lista { grid-template-columns: repeat(4, minmax(0, 1fr)); } }
.numeri__lista li { display: grid; gap: var(--s-2); align-content: start; padding-top: var(--s-4); position: relative; }
.numeri__lista li::before {
  content: ""; position: absolute; top: 0; left: 0; width: 2.5rem; height: 5px; border-radius: 3px; background: var(--c-accento);
}
.numeri__valore { font-family: var(--f-titoli); font-weight: 900; font-size: clamp(2.75rem, 7vw, 4rem); line-height: 0.95; letter-spacing: -0.02em; color: var(--c-testo); }
.numeri__valore small { font-size: 0.45em; font-weight: 800; margin-left: 0.08em; letter-spacing: 0; }
.numeri__etichetta { font-family: var(--f-titoli); font-weight: 700; color: var(--c-testo-2); line-height: 1.35; max-width: 14ch; }

/* Pilastri con icona */
.pilastro--icona::before { display: none; }
.pilastro__icona {
  display: grid; place-items: center; width: 3.25rem; height: 3.25rem; border-radius: 1rem;
  background: var(--c-banda); color: #FF6A13;
}
.pilastro__icona svg { width: 1.75rem; height: 1.75rem; }

/* Grafico della progressione */
.grafico { margin: var(--s-7) 0 0; padding: var(--s-5); background: var(--c-superficie); border: 1px solid var(--c-linea); border-radius: var(--r-l); }
@media (min-width: 48rem) { .grafico { padding: var(--s-6); } }
.grafico__titolo { display: grid; gap: 2px; margin-bottom: var(--s-4); color: var(--c-testo-2); font-size: var(--t-s); }
.grafico__titolo strong { font-family: var(--f-titoli); font-size: var(--t-l); color: var(--c-testo); }
.grafico__area { overflow-x: auto; }
.grafico svg { display: block; width: 100%; min-width: 34rem; height: auto; color: var(--c-testo); }
.grafico__base { stroke: var(--c-linea-forte); stroke-width: 2; }
.grafico__barra { fill: var(--c-testo); }
.grafico__barra--scarico { fill: var(--c-linea-forte); }
.grafico__barra:hover { fill: #FF6A13; }
.grafico__sett { font-family: var(--f-titoli); font-weight: 700; font-size: 13px; fill: var(--c-testo-2); }
.grafico__blocco { font-family: var(--f-titoli); font-weight: 900; font-size: 15px; fill: var(--c-testo); }
.grafico__nota { font-family: var(--f-titoli); font-weight: 700; font-size: 12px; fill: var(--c-testo-2); }
.grafico__legenda { display: flex; flex-wrap: wrap; align-items: center; gap: var(--s-2) var(--s-4); margin-top: var(--s-3); font-size: var(--t-xs); font-weight: 700; color: var(--c-testo-2); }
.grafico__chiave { display: inline-block; width: 0.9rem; height: 0.9rem; border-radius: 4px; background: var(--c-testo); margin-right: var(--s-2); vertical-align: -2px; }
.grafico__chiave--scarico { background: var(--c-linea-forte); }
.grafico__avvertenza { margin-top: var(--s-2); font-size: var(--t-xs); color: var(--c-testo-2); }

/* Monogramma al posto delle foto (finché non arrivano) */
.monogramma {
  position: relative; overflow: hidden; isolation: isolate;
  display: grid; align-content: space-between; gap: var(--s-5);
  aspect-ratio: 4 / 5; padding: var(--s-6); border-radius: var(--r-xl);
  background: var(--c-banda); color: var(--c-banda-testo);
}
.monogramma--quadrata { aspect-ratio: 1 / 1; padding: var(--s-5); }
.monogramma--larga { aspect-ratio: 16 / 10; }
.monogramma::before {
  content: ""; position: absolute; inset: 0; z-index: -1;
  background: radial-gradient(70% 60% at 85% 10%, rgba(255, 106, 19, 0.45), transparent 70%);
}
.monogramma__iniziali { font-family: var(--f-titoli); font-weight: 1000; font-size: clamp(4rem, 12vw, 7rem); line-height: 0.85; letter-spacing: -0.03em; }
.monogramma--quadrata .monogramma__iniziali { font-size: clamp(3.5rem, 9vw, 5rem); }
.monogramma__barre { display: grid; gap: 7px; width: 4.5rem; }
.monogramma__barre i { display: block; height: 9px; border-radius: 5px; background: var(--c-banda-testo); }
.monogramma__barre i:nth-child(2) { background: #FF6A13; width: 82%; margin-left: 9%; }
.monogramma__nome { display: grid; gap: 2px; font-family: var(--f-titoli); font-weight: 900; font-size: var(--t-m); }
.monogramma__nome small { font-weight: 700; font-size: var(--t-xs); letter-spacing: 0.16em; text-transform: uppercase; color: var(--c-banda-testo-2); }

/* Schede: illustrazioni degli articoli e griglia da 3 */
@media (min-width: 72rem) { .griglia-esercizi--3 { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
.card-articolo { padding: 0; gap: 0; overflow: hidden; }
.card-articolo__ill { padding: var(--s-4) var(--s-5) var(--s-2); background: var(--c-sfondo); border-bottom: 1px solid var(--c-linea); color: var(--c-testo); }
.card-articolo__ill svg { display: block; width: 100%; height: 8.5rem; }
.card-articolo__corpo { display: grid; grid-template-rows: auto auto 1fr auto auto; gap: var(--s-3); padding: var(--s-5) var(--s-5) var(--s-4); }
.card-articolo__corpo p { margin: 0; }
.ill-num { font-family: var(--f-titoli); font-weight: 900; font-size: 17px; fill: var(--c-testo); }
.ill-num--on { fill: #141414; font-size: 20px; }
.ill-testo { font-family: var(--f-titoli); font-weight: 800; font-size: 14px; fill: var(--c-testo-2); }

.hero--scuro .foglio, .hero--scuro .scheda { color: var(--c-testo); }
.grafico__suggerimento { display: none; margin: var(--s-2) 0 0; font-family: var(--f-titoli); font-weight: 800; font-size: var(--t-xs); color: var(--c-testo-2); }
@media (max-width: 40rem) { .grafico__suggerimento { display: block; } }
@media (max-width: 47.99rem) { .estratto .monogramma { max-width: 17rem; } }

/* =========================================================
   Home 7 → 8: apertura con grafico, confronto, anatomia della scheda, risorse
   ========================================================= */
.titolo-grande { font-size: clamp(2.25rem, 5.2vw, 3.75rem); line-height: 1.02; letter-spacing: -0.02em; }

/* Prove sotto i pulsanti */
.prove { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: var(--s-2) var(--s-4); }
.prove li { display: inline-flex; align-items: center; gap: 0.5rem; font-family: var(--f-titoli); font-weight: 700; font-size: var(--t-s); color: var(--c-banda-testo); }
.prove li::before { content: ""; width: 0.5rem; height: 0.5rem; border-radius: 50%; background: #FF6A13; flex: none; }

/* Grafico nell'apertura */
.gh {
  margin: 0; padding: var(--s-5); border-radius: var(--r-l); min-width: 0;
  background: rgba(255, 255, 255, 0.04); border: 1px solid rgba(255, 255, 255, 0.12);
  backdrop-filter: blur(6px);
}
.gh__titolo { font-family: var(--f-titoli); font-weight: 800; font-size: var(--t-s); color: var(--c-banda-testo); margin-bottom: var(--s-4); }
.gh svg { display: block; width: 100%; height: auto; }
.gh__base { stroke: rgba(255, 255, 255, 0.25); stroke-width: 1.5; }
.gh__barra { fill: #FF6A13; }
.gh__barra--scarico { fill: rgba(255, 255, 255, 0.28); }
.gh__blocco { font-family: var(--f-titoli); font-weight: 800; font-size: 11px; fill: var(--c-banda-testo-2); }
.gh__legenda { display: flex; flex-wrap: wrap; align-items: center; gap: 0.35rem; margin-top: var(--s-3); font-size: var(--t-xs); font-weight: 700; color: var(--c-banda-testo-2); }
.gh__chiave { display: inline-block; width: 0.75rem; height: 0.75rem; border-radius: 3px; background: #FF6A13; margin-left: 0.35rem; }
.gh__chiave:first-child { margin-left: 0; }
.gh__chiave--scarico { background: rgba(255, 255, 255, 0.28); }
.gh__nota { font-weight: 500; }
@media (min-width: 60rem) { .hero--scuro .hero__griglia { grid-template-columns: minmax(0, 1.15fr) minmax(0, 0.85fr); } }

/* Confronto senza piano / con il mio coaching (fascia nera) */
.confronto { display: grid; gap: var(--s-7); }
@media (min-width: 60rem) { .confronto { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: var(--s-8); } }
.confronto__titolo { font-size: var(--t-xs) !important; letter-spacing: 0.1em; text-transform: uppercase; color: var(--c-banda-testo-2) !important; margin-bottom: var(--s-2); }
.confronto__colonna--si .confronto__titolo { color: #FF6A13 !important; }
.vantaggi { list-style: none; margin: 0; padding: 0; display: grid; }
.vantaggi li { display: grid; grid-template-columns: auto minmax(0, 1fr); gap: var(--s-4); padding: var(--s-4) 0; border-top: 1px solid var(--c-banda-linea); }
.vantaggi li:last-child { border-bottom: 1px solid var(--c-banda-linea); }
.vantaggi h4 { margin: 0 0 0.2rem; font-size: var(--t-m); color: var(--c-banda-testo); }
.vantaggi p { margin: 0; font-size: var(--t-s); }
.vantaggi .pilastro__icona { width: 2.75rem; height: 2.75rem; border-radius: 0.8rem; background: rgba(255, 106, 19, 0.16); color: #FF6A13; }
.vantaggi .pilastro__icona svg { width: 1.5rem; height: 1.5rem; }

/* Anatomia di una scheda */
.firma__griglia { display: grid; gap: var(--s-7); align-items: start; }
@media (min-width: 60rem) { .firma__griglia { grid-template-columns: minmax(0, 1.3fr) minmax(0, 0.9fr); gap: var(--s-8); } }
.foglio--firma .foglio__carta { padding: var(--s-6); }
.foglio--firma .foglio__tabella { font-size: var(--t-m); }
.foglio--firma .foglio__tabella th { font-size: 0.75rem; white-space: nowrap; }
.foglio__caselle-riga { display: inline-flex; align-items: center; gap: var(--s-2); }
.nota-n {
  display: inline-grid; place-items: center; flex: none; width: 1.35rem; height: 1.35rem; border-radius: 50%;
  margin-right: 0.35rem; vertical-align: middle;
  background: var(--c-viola); color: #FFFFFF; font-family: var(--f-titoli); font-weight: 900; font-size: 0.75rem; letter-spacing: 0; text-transform: none;
}
.firma__note { list-style: none; margin: 0; padding: 0; display: grid; gap: var(--s-4); }
.firma__note li { display: grid; grid-template-columns: auto minmax(0, 1fr); gap: var(--s-3); align-items: start; line-height: 1.5; }
.firma__note .nota-n { width: 1.75rem; height: 1.75rem; font-size: 0.875rem; margin: 0; }
.firma__note strong { font-family: var(--f-titoli); }
@media (prefers-color-scheme: dark) { :root:not([data-theme="light"]) .nota-n { color: #141414; } }
:root[data-theme="dark"] .nota-n { color: #141414; }
@media (max-width: 34rem) { .foglio--firma .foglio__carta { padding: var(--s-4); } }

/* Prezzi su telefono: una per riga, la consigliata in cima */
@media (max-width: 40rem) {
  .mini-prog { grid-template-columns: minmax(0, 1fr); }
  .mini-prog__card--evidenza { order: -1; }
  .mini-prog__card { display: grid; grid-template-columns: minmax(0, 1fr) auto; grid-template-areas: "et et" "nome btn" "prezzo btn" "mese btn"; column-gap: var(--s-4); row-gap: 2px; align-items: center; padding: var(--s-4) var(--s-5); }
  .mini-prog__card .etichetta-evidenza { grid-area: et; justify-self: start; position: static; margin-bottom: var(--s-2); }
  .mini-prog__card .card-prog__durata { grid-area: nome; }
  .mini-prog__card .prezzo { grid-area: prezzo; }
  .mini-prog__card .prezzo__mese { grid-area: mese; }
  .mini-prog__card .btn { grid-area: btn; width: auto; margin: 0; padding-inline: var(--s-4); white-space: nowrap; }
}

/* Risorse gratuite */
.risorse { display: grid; gap: var(--s-7); }
@media (min-width: 60rem) { .risorse { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: var(--s-8); } }
.risorse__colonna { display: grid; gap: var(--s-4); align-content: start; }
.risorse__titolo { font-size: var(--t-l); margin: 0; }
.risorse__lista { list-style: none; margin: 0; padding: 0; display: grid; gap: var(--s-3); }
.risorsa {
  display: grid; grid-template-columns: 7.5rem minmax(0, 1fr); gap: var(--s-4); align-items: center;
  padding: var(--s-3); background: var(--c-superficie); border: 1px solid var(--c-linea); border-radius: var(--r-m);
}
.risorsa__img { border-radius: calc(var(--r-m) - 4px); background: var(--c-pannello); padding: var(--s-2); color: var(--c-testo); }
.risorsa__img svg { display: block; width: 100%; height: 4.25rem; }
.risorsa__img--schema .marcatore, .risorsa__img--schema .etichetta-fase { display: none; }
.risorsa__img--schema .corpo { fill: var(--c-testo); }
.risorsa__img--schema .corpo--lontano { fill: var(--c-testo-2); opacity: 0.55; }
.risorsa__img--schema .disco { fill: transparent; stroke: var(--c-testo-2); stroke-width: 4; }
.risorsa__img--schema .disco--interno { fill: none; stroke-width: 2; }
.risorsa__img--schema .bilanciere { fill: var(--c-testo); }
.risorsa__img--schema .guida { stroke: var(--c-titolo-evidenza); stroke-width: 4; stroke-dasharray: 8 8; }
.risorsa__img--schema .punto-guida { fill: var(--c-titolo-evidenza); }
.risorsa__img--schema .riferimento { stroke: var(--c-testo-2); stroke-width: 2; stroke-dasharray: 3 5; }
.risorsa__img--schema .suolo, .risorsa__img--schema .attrezzo { stroke: var(--c-linea-forte); fill: var(--c-linea-forte); stroke-width: 2; }
.risorsa__img--schema .sbarra { stroke: var(--c-testo-2); stroke-width: 5; }
.risorsa__img--schema .sbarra-sezione { fill: var(--c-testo-2); }
.risorsa__testo { display: grid; gap: 2px; min-width: 0; }
.risorsa__titolo { margin: 0; font-size: var(--t-m); line-height: 1.25; }
.risorsa__meta { margin: 0; font-size: var(--t-xs); color: var(--c-testo-2); }
.risorsa__vai { justify-self: start; display: inline-flex; align-items: center; gap: 0.35em; min-height: 2.5rem; font-family: var(--f-titoli); font-weight: 800; font-size: var(--t-s); color: var(--c-viola); text-decoration: none; }
.risorsa__vai span[aria-hidden] { display: inline-block; transition: transform .15s ease; }
.risorsa__vai:hover { text-decoration: underline; text-underline-offset: 4px; }
.risorsa__vai:hover span[aria-hidden] { transform: translateX(3px); }
@media (max-width: 26rem) { .risorsa { grid-template-columns: 5.75rem minmax(0, 1fr); } }

/* Schemi più grandi nelle schede esercizi */
.card-esercizio__schema svg { height: 11rem; }

.hero--scuro + .sezione--nero { margin-top: var(--s-3); }
.risorsa__img .ill-testo { display: none; }

/* =========================================================
   Movimento: solo transform e opacità, spento con "riduci movimento"
   ========================================================= */

/* Comparsa allo scorrimento (attivata da script.js) */
.anim .rivela { opacity: 0; transform: translateY(28px); transition: opacity .7s cubic-bezier(.2,.7,.2,1), transform .7s cubic-bezier(.2,.7,.2,1); transition-delay: var(--ritardo, 0s); }
.anim .rivela.visibile { opacity: 1; transform: none; }

/* Apertura: testo in sequenza, barre che crescono, bagliore che respira */
@keyframes sali { from { opacity: 0; transform: translateY(26px); } to { opacity: 1; transform: none; } }
@keyframes cresci { from { transform: scaleY(0); } to { transform: scaleY(1); } }
@keyframes respira { from { transform: translate3d(0, 0, 0) scale(1); } to { transform: translate3d(-4%, 3%, 0) scale(1.08); } }
.anim .hero--scuro .hero__testo > * { animation: sali .8s cubic-bezier(.2,.7,.2,1) both; }
.anim .hero--scuro .hero__testo > *:nth-child(2) { animation-delay: .08s; }
.anim .hero--scuro .hero__testo > *:nth-child(3) { animation-delay: .18s; }
.anim .hero--scuro .hero__testo > *:nth-child(4) { animation-delay: .28s; }
.anim .hero--scuro .hero__testo > *:nth-child(5) { animation-delay: .38s; }
.anim .hero--scuro .gh { animation: sali .9s .3s cubic-bezier(.2,.7,.2,1) both; }
.anim .gh__barra { transform-box: fill-box; transform-origin: 50% 100%; transform: scaleY(0); }
.anim .gh.visibile .gh__barra { animation: cresci .9s cubic-bezier(.2,.8,.2,1) both; animation-delay: calc(.5s + var(--i) * .12s); }
.hero--scuro::before { animation: respira 4.8s ease-in-out 1 both; }

/* Anatomia della scheda: i numeri si accendono in sequenza */
@keyframes impulso { 0% { box-shadow: 0 0 0 0 rgba(255, 106, 19, .55); transform: scale(1); } 40% { transform: scale(1.25); } 100% { box-shadow: 0 0 0 12px rgba(255, 106, 19, 0); transform: scale(1); } }
.anim .firma.visibile .foglio--firma .nota-n,
.anim .firma.visibile .firma__note .nota-n { animation: impulso .9s ease-out both; animation-delay: calc(.4s + var(--n, 0) * .35s); }

/* Linee guida degli schemi che scorrono */
@keyframes flusso { to { stroke-dashoffset: -24; } }
.schema-esercizio .guida, .card-esercizio__schema .guida, .risorsa__img--schema .guida { animation: flusso 1.6s linear 3; }

/* Schede che si sollevano al passaggio */
.card-esercizio, .card-articolo, .risorsa, .mini-prog__card, .card-prog { transition: transform .25s cubic-bezier(.2,.7,.2,1), box-shadow .25s ease, border-color .2s ease; }
@media (hover: hover) {
  .card-esercizio:hover, .card-articolo:hover, .risorsa:hover, .mini-prog__card:hover, .card-prog:hover { transform: translateY(-4px); box-shadow: 0 18px 40px -22px rgba(20, 20, 20, .35); }
}
.btn--primario { transition: transform .2s ease, box-shadow .2s ease, background-color .15s ease; }
@media (hover: hover) { .btn--primario:hover { transform: translateY(-2px); } }

/* ---------- Frecce tonde (carosello e scheda girevole) ---------- */
.freccia-tonda {
  display: inline-grid; place-items: center; width: var(--tocco); height: var(--tocco); flex: none;
  border-radius: 50%; border: 1.5px solid var(--c-linea-forte); background: var(--c-superficie); color: var(--c-testo); cursor: pointer;
  transition: background-color .15s ease, color .15s ease, border-color .15s ease, transform .15s ease;
}
.freccia-tonda svg { width: 1.25rem; height: 1.25rem; }
.freccia-tonda:hover { background: var(--c-testo); color: var(--c-superficie); border-color: var(--c-testo); }
.freccia-tonda:active { transform: scale(.94); }
.freccia-tonda:disabled { opacity: .35; cursor: default; background: var(--c-superficie); color: var(--c-testo); border-color: var(--c-linea-forte); }

/* ---------- Carosello delle schede ---------- */
.carosello { min-width: 0; display: grid; gap: var(--s-4); }
.carosello__binario {
  display: grid; grid-auto-flow: column; grid-auto-columns: 100%; gap: var(--s-5);
  overflow-x: auto; scroll-snap-type: x mandatory; scroll-behavior: smooth; overscroll-behavior-x: contain;
  scrollbar-width: none; padding: 4px 4px 18px; margin: -4px -4px 0; border-radius: var(--r-m);
}
.carosello__binario::-webkit-scrollbar { display: none; }
.carosello__binario:focus-visible { outline: 3px solid var(--c-viola); outline-offset: 2px; }
.carosello__slide { scroll-snap-align: start; scroll-snap-stop: always; min-width: 0; }
.carosello__controlli { display: flex; align-items: center; justify-content: center; gap: var(--s-4); }
.carosello__punti { display: flex; gap: var(--s-2); }
.carosello__punto { width: 2.75rem; height: var(--tocco); padding: 0; border: 0; background: none; cursor: pointer; display: grid; place-items: center; }
.carosello__punto::before { content: ""; width: 100%; height: 6px; border-radius: 3px; background: var(--c-linea-forte); transition: background-color .2s ease; }
.carosello__punto[aria-current="true"]::before { background: var(--c-accento); }
@media (prefers-reduced-motion: reduce) { .carosello__binario { scroll-behavior: auto; } }

/* ---------- Scheda che si gira (Chi c'è dietro) ---------- */
@media (min-width: 48rem) { .estratto { grid-template-columns: minmax(0, 19rem) minmax(0, 1fr); } }
.gira { display: grid; gap: var(--s-3); width: 100%; max-width: 19rem; }
.gira__scena { perspective: 1200px; touch-action: pan-y; cursor: grab; user-select: none; -webkit-user-select: none; }
.gira__carta { position: relative; aspect-ratio: 4 / 5; transform-style: preserve-3d; transition: transform .8s cubic-bezier(.3,.7,.2,1); }
.gira.girata .gira__carta { transform: rotateY(180deg); }
.gira__faccia { position: absolute; inset: 0; backface-visibility: hidden; -webkit-backface-visibility: hidden; border-radius: var(--r-xl); overflow: hidden; }
.gira__fronte .monogramma { height: 100%; aspect-ratio: auto; }
.gira__retro {
  transform: rotateY(180deg); display: grid; align-content: start; gap: var(--s-4);
  padding: var(--s-5); background: var(--c-superficie); border: 1px solid var(--c-linea); color: var(--c-testo);
  box-shadow: inset 0 6px 0 var(--c-accento);
}
.gira__titolo { margin: var(--s-2) 0 0; font-family: var(--f-titoli); font-weight: 900; font-size: var(--t-l); }
.gira__cv { list-style: none; margin: 0; padding: 0; display: grid; gap: var(--s-3); }
.gira__cv li { display: grid; gap: 2px; padding-top: var(--s-3); border-top: 1px solid var(--c-linea); font-size: var(--t-s); line-height: 1.4; }
.gira__cv strong { font-family: var(--f-titoli); font-size: var(--t-s); }
.gira__cv span { color: var(--c-testo-2); font-size: var(--t-xs); }
.gira__nota { margin: 0; font-size: var(--t-xs); }
.gira__controlli { display: flex; align-items: center; justify-content: space-between; gap: var(--s-3); }
.gira__stato { font-family: var(--f-titoli); font-weight: 800; font-size: var(--t-xs); letter-spacing: .08em; text-transform: uppercase; color: var(--c-testo-2); }
/* dondolio che invita a girarla, finché non la tocchi */
/* il dondolio usa la proprietà "rotate", separata da "transform" usata per girare la carta: così il primo giro è animato */
@keyframes dondola { 0%, 70%, 100% { rotate: y 0deg; } 78% { rotate: y -14deg; } 88% { rotate: y 9deg; } 94% { rotate: y -3deg; } }
.anim .gira:not(.toccata) .gira__carta { animation: dondola 4.5s ease-in-out 1.5s 1; }
@media (max-width: 47.99rem) { .estratto .gira { max-width: 17rem; } }

/* ---------- Icone "Con il mio coaching": compaiono e si disegnano una alla volta ---------- */
.anim .pilastro__icona--anim { transform: scale(.6); opacity: 0; transition: transform .55s cubic-bezier(.3,1.5,.4,1), opacity .35s ease; }
.anim .pilastro__icona--anim.attiva { transform: none; opacity: 1; }
@media (hover: hover) { .vantaggi li:hover .pilastro__icona--anim.attiva { transform: scale(1.06); } }
/* nella scheda del carosello si vedono tutte le righe anche su telefono */
.foglio--firma .foglio__tabella tbody tr:nth-child(n+3) { display: grid; }
@media (min-width: 34.01rem) { .foglio--firma .foglio__tabella tbody tr:nth-child(n+3) { display: table-row; } }
/* retro della scheda girevole: più compatto */
.gira__carta { aspect-ratio: 3 / 4; }
.gira__retro { padding: var(--s-4) var(--s-5); gap: var(--s-3); }
.gira__cv { gap: var(--s-2); }
.gira__cv li { padding-top: var(--s-2); }
.gira__retro { box-shadow: none; }
.gira__controlli { justify-content: center; gap: var(--s-3); }

/* ---------- Foto profilo ---------- */
.foto-profilo { display: block; overflow: hidden; border-radius: var(--r-xl); background: var(--c-banda); }
.foto-profilo img { display: block; width: 100%; height: 100%; object-fit: cover; object-position: 50% 20%; }
.foto-profilo--carta { height: 100%; }
.foto-profilo--grande { aspect-ratio: 3 / 4; }
/* la foto non si trascina: lo swipe arriva sempre alla carta */
.gira img { pointer-events: none; -webkit-user-drag: none; user-select: none; -webkit-touch-callout: none; }

/* ---------- Mazzo di schede (effetto carte da gioco) ---------- */
.mazzo { min-width: 0; display: grid; gap: var(--s-3); }
.mazzo__pila { display: grid; padding: 0 0 34px; touch-action: pan-y; user-select: none; -webkit-user-select: none; }
.mazzo__carta {
  grid-area: 1 / 1; min-width: 0; position: relative;
  transform-origin: 50% 85%;
  transition: transform .5s cubic-bezier(.2,.8,.2,1), opacity .35s ease, filter .35s ease;
  will-change: transform;
}
.mazzo__carta[data-pos="0"] { z-index: 3; transform: none; cursor: grab; }
.mazzo__carta[data-pos="1"] { z-index: 2; transform: translate(10px, 16px) rotate(2deg) scale(.97); filter: brightness(.97); }
.mazzo__carta[data-pos="2"] { z-index: 1; transform: translate(-8px, 30px) rotate(-2.5deg) scale(.94); filter: brightness(.94); }
.mazzo__carta.trascina { transition: none; cursor: grabbing; }
.mazzo__carta.vola { z-index: 4; }
.mazzo .foglio { margin: 0; }
.mazzo .foglio::before, .mazzo .foglio::after { display: none; }
.mazzo .foglio__carta { box-shadow: 0 18px 40px -24px rgba(20, 20, 20, .45); }
.mazzo__carta:not([data-pos="0"]) .foglio__carta { pointer-events: none; }
.mazzo__aiuto { margin: 0; text-align: center; font-family: var(--f-titoli); font-weight: 800; font-size: var(--t-xs); color: var(--c-testo-2); }
@media (hover: hover) and (pointer: fine) { .mazzo__aiuto { display: none; } }
.firma { overflow-x: clip; }

/* mazzo: tempi più rapidi e fluidi */
.mazzo__carta { transition: transform .42s cubic-bezier(.22,.8,.25,1), filter .3s ease; backface-visibility: hidden; }
.mazzo__carta.vola { z-index: 4; transition: transform .34s cubic-bezier(.3,.55,.25,1); }
.mazzo__carta.entra { transition: transform .42s cubic-bezier(.2,.8,.25,1); }
.mazzo__carta.salta, .mazzo__carta.trascina { transition: none; }
/* Barra in alto: più trasparente, il contenuto sotto si intravede sfocato */
.testata {
  background: color-mix(in srgb, var(--c-sfondo) 62%, transparent);
  -webkit-backdrop-filter: saturate(1.6) blur(18px);
  backdrop-filter: saturate(1.6) blur(18px);
  box-shadow: 0 1px 0 color-mix(in srgb, var(--c-testo) 8%, transparent);
}
/* punti dell'apertura: uno per riga, con spunta */
.prove { flex-direction: column; gap: var(--s-2); }
.prove li { align-items: flex-start; font-size: var(--t-s); line-height: 1.4; }
.prove li::before {
  width: 1.15rem; height: 1.15rem; margin-top: 0.1rem; border-radius: 50%;
  background: #FF6A13 url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M4 8.3l2.6 2.6L12 5.5' fill='none' stroke='%23141414' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center / 80% no-repeat;
}

/* --- Revisione testi e conversione --- */
/* spunte dell'apertura in bianco: l'arancio resta ai pulsanti e ai dati */
.prove li::before { background-color: #FFFFFF; }
.motivo-consigliata { margin: 0; font-size: var(--t-xs); line-height: 1.4; color: var(--c-testo-2); }
.mini-prog__card .motivo-consigliata { margin-top: var(--s-1); }
@media (max-width: 40rem) { .mini-prog__card .motivo-consigliata { grid-column: 1 / -1; grid-row: 5; margin-top: var(--s-2); } }
.foglio__fondo--firma { justify-content: flex-end; }
.firma__link { margin: var(--s-5) 0 0; }
/* lista d'attesa: domande facoltative raccolte */
.form-extra { border: 1px solid var(--c-linea); border-radius: var(--r-m); background: var(--c-superficie); }
.form-extra > summary {
  display: flex; flex-wrap: wrap; align-items: baseline; justify-content: space-between; gap: var(--s-1) var(--s-3);
  min-height: var(--tocco); padding: var(--s-4) var(--s-5); cursor: pointer; list-style: none;
  font-family: var(--f-titoli); font-weight: 800;
}
.form-extra > summary::-webkit-details-marker { display: none; }
.form-extra > summary::after { content: "+"; font-weight: 900; font-size: 1.25rem; line-height: 1; margin-left: auto; }
.form-extra[open] > summary::after { content: "–"; }
.form-extra > summary span { font-family: var(--f-testo); font-weight: 500; font-size: var(--t-xs); color: var(--c-testo-2); }
.form-extra__corpo { display: grid; gap: var(--s-5); padding: 0 var(--s-5) var(--s-5); }

/* Anatomia della scheda su telefono: i numeri restano accanto alle voci */
.nota-n--telefono { display: none; }
@media (max-width: 34rem) {
  .foglio--firma .nota-n--telefono { display: inline-grid; margin: 0.15rem 0.35rem 0 0; }
  .foglio--firma td[data-n] { position: relative; }
  .foglio--firma td[data-n] { padding-top: 1.7rem; }
  .foglio--firma td[data-n]::after {
    content: attr(data-n); position: absolute; left: 0; top: 0;
    display: grid; place-items: center; width: 1.35rem; height: 1.35rem; border-radius: 50%;
    background: var(--c-viola); color: #FFFFFF; font-family: var(--f-titoli); font-weight: 900; font-size: 0.75rem;
  }
}
@media (max-width: 34rem) and (prefers-color-scheme: dark) { :root:not([data-theme="light"]) .foglio--firma td[data-n]::after { color: #141414; } }
@media (max-width: 34rem) { :root[data-theme="dark"] .foglio--firma td[data-n]::after { color: #141414; } }
/* risorse in home: su telefono due guide e due articoli */
@media (max-width: 40rem) { .risorse__lista .risorsa:nth-child(n+3) { display: none; } }