/* Home di Irene Carrer — versione telefono.
   Regola: il desktop (checkpoint carrer-irene-desktop-v1) non si tocca. Fuori dalla media query ci sono
   solo le due righe che nascondono il pulsante e il pannello del menu; tutto il resto vale sotto 768 px.
   Sul telefono ogni sezione smette di essere uno "stadio" in proporzione al mockup e diventa una
   griglia a colonne con gutter unico; gli elementi scelgono riga e colonna, i caratteri hanno
   misure proprie (non una percentuale del desktop). */

.menu-apri { display: none; }
.menu-telefono[hidden] { display: none; }

@media (max-width: 767.98px) {
  :root {
    --g: clamp(20px, 5.6vw, 24px);          /* gutter del telefono: 22 px a 390 */
    --t-hero: clamp(44px, 12.4vw, 54px);
    --t-grande: clamp(38px, 10.6vw, 46px);
    --t-medio: clamp(32px, 9vw, 40px);
    --t-sotto: clamp(23px, 6.4vw, 28px);
    --t-corpo: 17.5px;
    --t-eyebrow: 14px;
    --t-cta: 17px;
    --ritmo: 96px;                          /* fra le sezioni */
  }
  html.menu-aperto, html.menu-aperto body { overflow: hidden; overscroll-behavior: none; touch-action: none; }
  .menu-telefono { touch-action: pan-y; overscroll-behavior: contain; }

  /* ---------- base comune alle sezioni gia' rifatte ---------- */
  #s01, #s02, #s03 {
    aspect-ratio: auto !important; height: auto; display: grid;
    grid-template-columns: var(--g) minmax(0, 1fr) minmax(0, 1fr) var(--g);
    align-content: start; padding-bottom: var(--ritmo); background-image: none !important;
  }
  #s02, #s03 { padding-top: var(--ritmo); }
  :is(#s01, #s02, #s03) > * { grid-column: 2 / 4; }
  :is(#s01, #s02, #s03) .a { position: static !important; translate: none !important; width: auto !important;
    height: auto; margin: 0; left: auto; top: auto; }
  :is(#s01, #s02, #s03) .righe-fisse { white-space: normal !important; }
  :is(#s01, #s02, #s03) .giunzione { display: none !important; }
  /* nei paragrafi gli a capo del mockup desktop si sciolgono; nei titoli restano */
  :is(#s01, #s02, #s03) :is(.tipo-corpo, .citazione) br { display: none; }

  /* etichetta sopra i titoli */
  .st .eyebrow { font-size: var(--t-eyebrow) !important; gap: 12px !important; margin: 0 0 18px !important; }
  .st .eyebrow::after { width: 48px !important; }
  #s01 .eyebrow { letter-spacing: .08em !important; }

  /* pulsante principale */
  :is(#s01, #s02, #s03) .cta { --h: 0; height: auto !important; min-height: 52px; padding: 14px 26px;
    font-size: var(--t-cta) !important; width: max-content !important; max-width: 100%; justify-self: start; }

  /* ================================================================ testata + menu */
  #s01 header { position: relative !important; grid-column: 1 / -1; grid-row: 1; height: 68px !important;
    padding-inline: var(--g) !important; display: flex; align-items: center; justify-content: space-between;
    border-bottom: 1px solid #e6e5e2; background: rgba(239,236,233,0.9); }
  #s01 header nav, #s01 header > .cta { display: none !important; }
  #s01 .marchio b { font-size: 21px !important; }
  #s01 .marchio span { font-size: 12px !important; margin-top: 2px; }
  .menu-apri { display: grid; place-content: center; gap: 5px; width: 48px; height: 48px; margin-right: -10px;
    border: 0; background: none; cursor: pointer; }
  .menu-apri span { display: block; width: 24px; height: 1.6px; background: rgb(31,23,21); border-radius: 2px; }
  .menu-telefono { position: fixed; inset: 0; z-index: 50; background: #f7f5ef; display: flex; flex-direction: column;
    padding: 0 var(--g) 32px; overflow-y: auto; }
  .menu-telefono-testa { display: flex; align-items: center; justify-content: space-between; height: 68px;
    border-bottom: 1px solid #e6e5e2; margin: 0 calc(-1 * var(--g)); padding: 0 var(--g); }
  .menu-telefono-marchio { font-family: var(--font-titoli); font-size: 21px; color: var(--inchiostro); text-decoration: none; letter-spacing: -.02em; }
  .menu-chiudi { position: relative; width: 48px; height: 48px; margin-right: -10px; border: 0; background: none; cursor: pointer; }
  .menu-chiudi span { position: absolute; left: 12px; top: 23px; width: 24px; height: 1.6px; background: rgb(31,23,21); }
  .menu-chiudi span:first-child { transform: rotate(45deg); } .menu-chiudi span:last-child { transform: rotate(-45deg); }
  .menu-telefono ul { list-style: none; margin: 16px 0 0; padding: 0; }
  .menu-telefono li a { display: block; padding: 16px 0; font-family: var(--font-titoli); font-size: 32px; line-height: 1.1;
    letter-spacing: -.02em; color: var(--inchiostro); text-decoration: none; border-bottom: 1px solid rgba(88, 84, 58, .17); }
  .menu-telefono-prenota { margin-top: 32px; align-self: flex-start; display: inline-flex; align-items: center; min-height: 54px;
    padding: 0 28px; border-radius: 999px; background: var(--cta); color: #fbf3ee; text-decoration: none;
    font-family: var(--font-testo); font-weight: 500; font-size: var(--t-cta); }
  :is(.menu-apri, .menu-chiudi, .menu-telefono a):focus-visible { outline: 2px solid var(--etichetta); outline-offset: 3px; }

  /* ================================================================ s01 apertura */
  #s01 { grid-template-columns: var(--g) 56px minmax(0, 1fr) var(--g); background: rgb(239,236,233); }
  #s01 > :is(.apertura-luce, .testata-fondo, .striscia-fondo, .fogliame) { display: none !important; }
  #s01 > .eyebrow { grid-row: 2; margin-top: 40px !important; }
  #s01 > h1 { grid-row: 3; font-size: var(--t-hero) !important; line-height: .98 !important; }
  #s01 > .tipo-sottotitolo { grid-row: 4; margin-top: 20px; font-size: var(--t-sotto) !important; line-height: 1.12 !important; }
  #s01 > .tipo-corpo { grid-row: 5; margin-top: 22px; font-size: var(--t-corpo) !important; line-height: 1.58 !important; }
  #s01 > .cta { grid-row: 6; margin-top: 30px; }
  #s01 > .link { grid-row: 7; margin-top: 8px; min-height: 48px; font-size: var(--t-cta) !important; justify-self: start; }
  #s01 > .apertura-foto { grid-column: 1 / -1; grid-row: 8; margin-top: 36px; position: relative !important;
    height: auto !important; aspect-ratio: 4 / 4.6; overflow: hidden; }
  #s01 > .apertura-foto img { position: absolute !important; inset: 0; width: 100% !important; height: 100% !important;
    object-fit: cover; object-position: 50% 47%; -webkit-mask-image: none; mask-image: none; }
  /* i tre pilastri: righe con icona, numero e nome, divise da filetti */
  #s01 > .icona-s01 { grid-column: 2; align-self: center; width: 34px !important; scale: 1; margin: 0; }
  #s01 > .pilastro { grid-column: 3; align-self: center; font-size: 23px !important; line-height: 1.1 !important; }
  #s01 > .pilastro small { font-size: 12px; margin-bottom: 4px; }
  #s01 > :nth-child(13), #s01 > :nth-child(18) { grid-row: 9; margin-top: 30px; }
  #s01 > :nth-child(16) { grid-row: 10; }
  #s01 > :nth-child(14), #s01 > :nth-child(19) { grid-row: 11; }
  #s01 > :nth-child(17) { grid-row: 12; }
  #s01 > :nth-child(15), #s01 > :nth-child(20) { grid-row: 13; }
  #s01 > .divisore-s01 { grid-column: 2 / 4; width: auto !important; height: 1px !important; margin: 18px 0; }
  #s01 > .pilastro, #s01 > .icona-s01 { padding: 2px 0; }

  /* ================================================================ s02 partiamo da te */
  #s02 { grid-template-columns: var(--g) 44px minmax(0, 1fr) var(--g); }
  #s02 > .eyebrow { grid-row: 1; }
  #s02 > h2 { grid-row: 2; font-size: var(--t-grande) !important; line-height: 1.02 !important; margin-bottom: 28px; }
  #s02 > .numero-s02 { grid-column: 2; font-size: 19px !important; line-height: 1.3 !important; padding: 18px 0; }
  #s02 > .voce-s02 { grid-column: 3; font-size: 23px !important; line-height: 1.2 !important; padding: 16px 0; }
  #s02 > :nth-child(5), #s02 > :nth-child(6) { grid-row: 3; }
  #s02 > :nth-child(13) { grid-row: 4; }
  #s02 > :nth-child(7), #s02 > :nth-child(8) { grid-row: 5; }
  #s02 > :nth-child(14) { grid-row: 6; }
  #s02 > :nth-child(9), #s02 > :nth-child(10) { grid-row: 7; }
  #s02 > :nth-child(15) { grid-row: 8; }
  #s02 > :nth-child(11), #s02 > :nth-child(12) { grid-row: 9; }
  #s02 > .divisore-s02 { grid-column: 2 / 4; width: auto !important; height: 1px !important; }
  #s02 > .tipo-corpo { grid-row: 10; margin-top: 32px; font-size: var(--t-corpo) !important; line-height: 1.6 !important; letter-spacing: 0 !important; }
  #s02 > .cta { grid-row: 11; margin-top: 28px; }
  #s02 > .sfondo-s02 { grid-column: 1 / -1; grid-row: 12; margin-top: 44px; }
  /* ritaglio del telefono: la sola still life (x 800-1536, y 180-862 del mockup), senza il crema a sinistra */
  #s02 > .sfondo-s02 { aspect-ratio: 736 / 682; overflow: hidden; }
  #s02 > .sfondo-s02 img { width: 208.7%; max-width: none; height: auto; margin: -24.5% 0 0 -108.7%; }

  /* ================================================================ s03 la salute come risorsa */
  #s03 { column-gap: 0; }
  #s03 > .eyebrow { grid-row: 1; }
  #s03 > h2 { grid-row: 2; font-size: var(--t-grande) !important; line-height: 1.02 !important; }
  #s03 > h2 .stretta { letter-spacing: inherit; }
  #s03 > .tipo-corpo.forte { grid-row: 3; margin-top: 26px; }
  #s03 > .tipo-corpo:not(.forte) { grid-row: 4; margin-top: 16px; }
  #s03 > .tipo-corpo { font-size: var(--t-corpo) !important; line-height: 1.6 !important; }
  #s03 > .sfondo-s03 { grid-column: 1 / -1; grid-row: 5; margin-top: 40px; }
  /* ritaglio del telefono: pianta, tazza e libri (x 760-1536, y 0-660 del mockup), senza la fascia crema */
  #s03 > .sfondo-s03 { aspect-ratio: 776 / 660; overflow: hidden; }
  #s03 > .sfondo-s03 img { width: 197.9%; max-width: none; height: auto; margin: 0 0 0 -97.9%; }
  #s03 > .citazione { grid-row: 6; margin-top: 28px; font-size: 24px !important; line-height: 1.25 !important;
    color: #3f3b35 !important; text-shadow: none !important; border-left-color: rgba(172,156,141,0.45) !important; padding-left: 18px !important; }
  #s03 > .divisore-s03 { display: none !important; }
  #s03 > .cerchio-s03 { width: 64px !important; height: 64px !important; justify-self: center; margin-top: 36px; }
  #s03 > .beneficio-s03 { font-size: 19px !important; line-height: 1.18 !important; margin-top: 12px; padding: 0 6px; }
  #s03 > :nth-child(14), #s03 > :nth-child(18), #s03 > :nth-child(22) { grid-column: 2; }
  #s03 > :nth-child(15), #s03 > :nth-child(19), #s03 > :nth-child(23) { grid-column: 2; }
  #s03 > :nth-child(16), #s03 > :nth-child(20), #s03 > :nth-child(24) { grid-column: 3; }
  #s03 > :nth-child(17), #s03 > :nth-child(21), #s03 > :nth-child(25) { grid-column: 3; }
  #s03 > :nth-child(14), #s03 > :nth-child(16) { grid-row: 7; }
  #s03 > :nth-child(15), #s03 > :nth-child(17) { grid-row: 8; }
  #s03 > :nth-child(18), #s03 > :nth-child(20) { grid-row: 9; }
  #s03 > :nth-child(19), #s03 > :nth-child(21) { grid-row: 10; }
  #s03 > :nth-child(22), #s03 > :nth-child(24) { grid-row: 11; }
  #s03 > :nth-child(23), #s03 > :nth-child(25) { grid-row: 12; }
}

/* ======================================================================= GRUPPO B (s04, s05, s06)
   Generato da strumenti/mobile_b.py: modificare li', non qui. */
@media (max-width: 767.98px) {
  #s04, #s05, #s06 {
    aspect-ratio: auto !important; height: auto; display: grid; padding: var(--ritmo) 0;
    grid-template-columns: var(--g) minmax(0, 1fr) minmax(0, 1fr) var(--g); align-content: start;
    background-image: none !important;
  }
  :is(#s04, #s05, #s06) > * { grid-column: 2 / 4; }
  :is(#s04, #s05, #s06) .a { position: static !important; translate: none !important; width: auto !important;
    height: auto; margin: 0; left: auto; top: auto; }
  :is(#s04, #s05, #s06) .righe-fisse { white-space: normal !important; }
  :is(#s04, #s05, #s06) .giunzione { display: none !important; }
  :is(#s04, #s05, #s06) :is(.tipo-corpo, .citazione, .testo-s06, .menta-riga, .titolo-s05) br { display: none; }
  :is(#s04, #s05, #s06) .tipo-corpo { font-size: var(--t-corpo) !important; line-height: 1.6 !important; letter-spacing: 0 !important; }

  /* ================================================================ s04: testo, poi 13 schede su 2 colonne */
  #s04 > .sfondo-s04 { display: none; }
  #s04 > h2 { font-size: var(--t-grande) !important; line-height: 1.02 !important; }
  #s04 > h2 .stretta { letter-spacing: inherit; }
  #s04 > .tipo-corpo:nth-of-type(2) { margin-top: 26px; }
  #s04 > p.tipo-corpo + p.tipo-corpo { margin-top: 14px; }
  #s04 > .card-s04 { margin-top: 36px; display: grid; grid-template-columns: 1fr 1fr; gap: 12px;
    --off: 0px; --tw: 100%; }
  #s04 .card-s04 > li { position: static !important; translate: none !important; margin: 0; }
  #s04 .filetto-s04 { width: var(--tw) !important; margin-left: var(--off) !important; aspect-ratio: 200 / 170;
    height: auto !important; background: url(sfondi/s04-card-1920.webp) no-repeat; background-size: 768% auto;
    border-radius: 2px; }
  #s04 .cerchio-s04 { z-index: 1; align-self: start; justify-self: start; aspect-ratio: 1; height: auto !important;
    width: calc(var(--tw) * .265) !important;
    margin: calc(var(--tw) * var(--fy)) 0 0 calc(var(--off) + var(--tw) * var(--fx)) !important; }
  #s04 .nome-s04 { z-index: 1; align-self: end; justify-self: start; font-size: 16px !important; line-height: 1.15 !important;
    margin: 0 10px 11px calc(var(--off) + 12px) !important; max-width: calc(var(--tw) - 24px); white-space: normal !important; }
  #s04 .card-s04 > :nth-child(1), #s04 .card-s04 > :nth-child(2), #s04 .card-s04 > :nth-child(3) { grid-row: 1; grid-column: 1; --fx: 0.0875; --fy: 0.0850; }
  #s04 .card-s04 > :nth-child(2) { background-position: 46.632% 7.728%; }
  #s04 .card-s04 > :nth-child(4), #s04 .card-s04 > :nth-child(5), #s04 .card-s04 > :nth-child(6) { grid-row: 1; grid-column: 2; --fx: 0.1100; --fy: 0.0850; }
  #s04 .card-s04 > :nth-child(5) { background-position: 68.563% 7.728%; }
  #s04 .card-s04 > :nth-child(7), #s04 .card-s04 > :nth-child(8), #s04 .card-s04 > :nth-child(9) { grid-row: 2; grid-column: 1; --fx: 0.0950; --fy: 0.0850; }
  #s04 .card-s04 > :nth-child(8) { background-position: 91.093% 7.728%; }
  #s04 .card-s04 > :nth-child(10), #s04 .card-s04 > :nth-child(11), #s04 .card-s04 > :nth-child(12) { grid-row: 2; grid-column: 2; --fx: 0.0875; --fy: 0.0975; }
  #s04 .card-s04 > :nth-child(11) { background-position: 46.632% 33.489%; }
  #s04 .card-s04 > :nth-child(13), #s04 .card-s04 > :nth-child(14), #s04 .card-s04 > :nth-child(15) { grid-row: 3; grid-column: 1; --fx: 0.1100; --fy: 0.0975; }
  #s04 .card-s04 > :nth-child(14) { background-position: 68.563% 33.489%; }
  #s04 .card-s04 > :nth-child(16), #s04 .card-s04 > :nth-child(17), #s04 .card-s04 > :nth-child(18) { grid-row: 3; grid-column: 2; --fx: 0.0950; --fy: 0.0975; }
  #s04 .card-s04 > :nth-child(17) { background-position: 91.093% 33.489%; }
  #s04 .card-s04 > :nth-child(19), #s04 .card-s04 > :nth-child(20), #s04 .card-s04 > :nth-child(21) { grid-row: 4; grid-column: 1; --fx: 0.0875; --fy: 0.1025; }
  #s04 .card-s04 > :nth-child(20) { background-position: 46.632% 60.187%; }
  #s04 .card-s04 > :nth-child(22), #s04 .card-s04 > :nth-child(23), #s04 .card-s04 > :nth-child(24) { grid-row: 4; grid-column: 2; --fx: 0.1100; --fy: 0.1025; }
  #s04 .card-s04 > :nth-child(23) { background-position: 68.563% 60.187%; }
  #s04 .card-s04 > :nth-child(25), #s04 .card-s04 > :nth-child(26), #s04 .card-s04 > :nth-child(27) { grid-row: 5; grid-column: 1; --fx: 0.0950; --fy: 0.1025; }
  #s04 .card-s04 > :nth-child(26) { background-position: 91.093% 60.187%; }
  #s04 .card-s04 > :nth-child(28), #s04 .card-s04 > :nth-child(29), #s04 .card-s04 > :nth-child(30) { grid-row: 5; grid-column: 2; --fx: 0.0875; --fy: 0.0950; }
  #s04 .card-s04 > :nth-child(29) { background-position: 46.632% 86.885%; }
  #s04 .card-s04 > :nth-child(31), #s04 .card-s04 > :nth-child(32), #s04 .card-s04 > :nth-child(33) { grid-row: 6; grid-column: 1; --fx: 0.0750; --fy: 0.0950; }
  #s04 .card-s04 > :nth-child(32) { background-position: 64.371% 86.885%; }
  #s04 .card-s04 > :nth-child(34), #s04 .card-s04 > :nth-child(35), #s04 .card-s04 > :nth-child(36) { grid-row: 6; grid-column: 2; --fx: 0.0775; --fy: 0.0950; }
  #s04 .card-s04 > :nth-child(35) { background-position: 80.539% 86.885%; }
  #s04 .card-s04 > :nth-child(37), #s04 .card-s04 > :nth-child(38), #s04 .card-s04 > :nth-child(39) { grid-row: 7; grid-column: 1 / 3; --fx: 0.0775; --fy: 0.0950; }
  #s04 .card-s04 > :nth-child(38) { background-position: 96.183% 86.885%; }
  #s04 .card-s04 > :nth-child(n+37) { --off: calc(25% + 6px); --tw: calc(50% - 6px); }

  /* ================================================================ s05: la domanda, foto, citazione, 4 azioni */
  #s05 > .eyebrow { grid-row: 1; }
  #s05 > .domanda-s05 { grid-row: 2; font-size: clamp(34px, 9.4vw, 42px) !important; line-height: 1.04 !important; }
  #s05 > .tipo-corpo { grid-row: 3; margin-top: 24px; }
  #s05 > .sfondo-s05 { grid-row: 4; grid-column: 1 / -1; margin-top: 40px; aspect-ratio: 816 / 620; overflow: hidden; }
  #s05 > .sfondo-s05 img { width: 188.24%; max-width: none; height: auto; margin: -9.8% 0 0 -88.24%; }
  #s05 > .citazione { grid-row: 5; margin-top: 28px; font-size: 24px !important; line-height: 1.25 !important;
    padding-left: 18px !important; }
  #s05 > .maiuscolo-s05 { grid-row: 6; margin-top: 44px; font-size: 13px !important; }
  #s05 > .filo-s05, #s05 > .divisore-s05 { display: none !important; }
  #s05 > .cerchio-s05 { width: 56px !important; height: 56px !important; margin-top: 24px; }
  #s05 > .titolo-s05 { margin-top: 14px; font-size: 20px !important; line-height: 1.2 !important; padding-right: 10px; }
  #s05 > :nth-child(10), #s05 > :nth-child(15) { grid-column: 2; }
  #s05 > :nth-child(11), #s05 > :nth-child(16) { grid-column: 2; }
  #s05 > :nth-child(12), #s05 > :nth-child(18) { grid-column: 3; }
  #s05 > :nth-child(13), #s05 > :nth-child(19) { grid-column: 3; }
  #s05 > :nth-child(10), #s05 > :nth-child(12) { grid-row: 7; }
  #s05 > :nth-child(11), #s05 > :nth-child(13) { grid-row: 8; align-self: start; }
  #s05 > :nth-child(15), #s05 > :nth-child(18) { grid-row: 9; margin-top: 30px; }
  #s05 > :nth-child(16), #s05 > :nth-child(19) { grid-row: 10; align-self: start; }

  /* ================================================================ s06: il Metodo, fondo verde scuro */
  #s06 { background: rgb(74,52,44); grid-template-columns: var(--g) 60px minmax(0, 1fr) var(--g); }
  #s06 > .eyebrow { grid-row: 1; }
  /* A.L.I.N.E.A.: tessera con il muro e il ramo della foto desktop, lettere in ordine sopra */
  #s06 > .sfondo-s06 { grid-row: 2; grid-column: 1 / -1; margin-top: 8px; aspect-ratio: 580 / 440; overflow: hidden; }
  #s06 > .sfondo-s06 { background: url(sfondi/s06-alinea-telefono.webp) center / 100% 100% no-repeat; }
  #s06 > .sfondo-s06 img { visibility: hidden; }   /* sul telefono: stesso ritaglio, tacca del pilastro chiusa */
  #s06 > .alinea-s06 { grid-row: 2; grid-column: 2 / 4; align-self: center; z-index: 1; --f: 0 !important; font-size: 0; }
  #s06 > .alinea-s06 span { font-size: clamp(54px, 15vw, 66px); height: auto !important; line-height: 1.02 !important;
    margin-left: calc(var(--dx) / 112 * .62em) !important; color: rgba(212,187,162,0.62) !important; }
  #s06 > .ramo-s06 { grid-row: 2; grid-column: 1 / -1; z-index: 2; align-self: start; width: 56.55% !important;
    margin-left: 43.45% !important; }
  #s06 > h2 { grid-row: 3; margin-top: 32px; font-size: var(--t-grande) !important; line-height: 1.02 !important; }
  #s06 > .menta-riga { grid-row: 4; margin-top: 20px; font-size: 19px !important; line-height: 1.45 !important; }
  #s06 > .disco-s06 { grid-column: 2; width: 48px !important; height: 48px !important; align-self: center; }
  #s06 > .disciplina-s06 { grid-column: 3; align-self: center; font-size: 25px !important; }
  #s06 > .testo-s06 { font-size: var(--t-corpo) !important; line-height: 1.6 !important; letter-spacing: 0 !important; }
  #s06 > :nth-child(8), #s06 > :nth-child(9) { grid-row: 5; margin-top: 40px; }
  #s06 > :nth-child(10) { grid-row: 6; margin-top: 12px; }
  #s06 > :nth-child(17) { grid-row: 7; }
  #s06 > :nth-child(11), #s06 > :nth-child(12) { grid-row: 8; }
  #s06 > :nth-child(13) { grid-row: 9; margin-top: 12px; }
  #s06 > :nth-child(18) { grid-row: 10; }
  #s06 > :nth-child(14), #s06 > :nth-child(15) { grid-row: 11; }
  #s06 > :nth-child(16) { grid-row: 12; margin-top: 12px; }
  #s06 > .divisore-s06 { grid-column: 2 / 4; width: auto !important; height: 1px !important; margin: 28px 0 !important;
    background: rgba(212,187,162,0.22) !important; }
  #s06 > :is(:nth-child(19), :nth-child(20), .linea-s06) { display: none !important; }
  #s06 > :nth-child(21) { grid-row: 13; margin-top: 44px; text-align: left !important; }
  /* il processo: timeline verticale */
  #s06 > .processo-s06 { grid-row: 14; margin-top: 36px; position: relative; display: grid; row-gap: 14px; }
  #s06 > .processo-s06::before { content: ""; position: absolute; left: 22px; top: 22px; bottom: 22px; width: 1px;
    background: rgba(212,187,162,0.45); }
  #s06 .puntino-s06 { display: none !important; }
  #s06 .passo-s06 { position: relative !important; display: flex; align-items: center; gap: 18px; text-align: left; }
  #s06 .cerchio-s06 { width: 44px; height: 44px; margin: 0; transform: none; flex: none; font-size: 17px; }
  #s06 .nome-passo-s06 { margin: 0; font-size: 22px; line-height: 1.2; }
  #s06 .nome-passo-s06 br { display: none; }
  #s06 > .finale-s06 { grid-row: 15; margin-top: 48px; font-size: 27px !important; line-height: 1.15 !important; }
  #s06 > :nth-child(25) { grid-row: 16; margin-top: 16px; }
  #s06 > .cta-s06 { grid-row: 17; margin-top: 30px; --h: 0; height: auto !important; min-height: 52px; padding: 14px 24px !important;
    font-size: var(--t-cta) !important; width: max-content !important; max-width: 100%; justify-self: start;
    font-family: var(--font-testo) !important; gap: 12px; justify-content: flex-start; }
}

/* ======================================================================= GRUPPO C (s07, s08, s09)
   Generato da strumenti/mobile_c.py: modificare li', non qui. */
@media (max-width: 767.98px) {
  #s07, #s08, #s09 {
    aspect-ratio: auto !important; height: auto; display: grid; padding: var(--ritmo) 0;
    grid-template-columns: var(--g) minmax(0, 1fr) minmax(0, 1fr) var(--g); align-content: start;
    background-image: none !important;
  }
  :is(#s07, #s08, #s09) > * { grid-column: 2 / 4; }
  :is(#s07, #s08, #s09) .a { position: static !important; translate: none !important; width: auto !important;
    height: auto; margin: 0; left: auto; top: auto; }
  :is(#s07, #s08, #s09) .righe-fisse { white-space: normal !important; }
  :is(#s07, #s08, #s09) .giunzione, :is(#s07, #s08, #s09) :is(.filo-v-s07, .filo-v-s08, .filo-v-s09, .divisore-s08, .divisore-s09) { display: none !important; }
  :is(#s07, #s08, #s09) :is(.tipo-corpo, .citazione, blockquote, .testo-voce-s08, .payoff-s09) br { display: none; }
  :is(#s07, #s08, #s09) > p:not(.eyebrow) { font-size: var(--t-corpo) !important; line-height: 1.6 !important; letter-spacing: 0 !important; }
  :is(#s07, #s08, #s09) > h2 { font-size: var(--t-grande) !important; line-height: 1.02 !important; }
  :is(#s07, #s08, #s09) > blockquote { font-size: 24px !important; line-height: 1.25 !important; color: #3f3b35 !important;
    text-shadow: none !important; border-left: 1px solid rgba(172,156,141,0.45) !important; padding-left: 18px !important; }
  :is(#s07, #s08, #s09) > picture { grid-column: 1 / -1; margin-top: 40px; }

  /* ================================================================ s07: testo, foto, citazione, 4 passi */
  #s07 > .eyebrow { grid-row: 1; }
  #s07 > h2 { grid-row: 2; }
  #s07 > p.forte { grid-row: 3; margin-top: 24px; }
  #s07 > .sfondo-s07 { aspect-ratio: 776 / 750; overflow: hidden; }
  #s07 > .sfondo-s07 img { width: 197.94%; max-width: none; height: auto; margin: -19.33% 0 0 -97.94%; }
  #s07 > .sfondo-s07 { grid-row: 4; margin-top: 40px !important; }
  #s07 > .citazione { grid-row: 5; margin-top: 32px !important; }
  #s07 > h2 { font-size: clamp(33px, 9.4vw, 40px) !important; }   /* "Qual è la leva che oggi" resta su una riga */
  #s07 > .passi-s07 { grid-row: 6; margin-top: 36px; position: relative; display: grid; row-gap: 22px; }
  #s07 > .passi-s07::before { content: ""; position: absolute; left: 19.5px; top: 20px; bottom: 20px; width: 1px; background: rgb(172,156,141); }
  #s07 .passo-s07 { position: relative !important; gap: 18px; }
  #s07 .cerchio-s07 { width: 40px; height: 40px; font-size: 16px; }
  #s07 .nome-s07 { font-size: 23px; white-space: normal; line-height: 1.2; }

  /* ================================================================ s08: testo, foto, 10 benefici 2x5, chiusura */
  #s08 > .eyebrow { grid-row: 1; }
  #s08 > h2 { grid-row: 2; }
  #s08 > p:not(.eyebrow) { grid-row: 3; margin-top: 24px; color: rgb(74,63,58) !important; }
  #s08 > .sfondo-s08 { aspect-ratio: 816 / 800; overflow: hidden; }
  #s08 > .sfondo-s08 img { width: 188.24%; max-width: none; height: auto; margin: -7.35% 0 0 -88.24%; }
  #s08 > .sfondo-s08 { grid-row: 4; margin-top: 40px !important; }
  #s08 > .voci-s08 { grid-row: 5; margin-top: 36px; display: grid; grid-template-columns: 1fr 1fr; column-gap: 16px; }
  #s08 .voce-s08 { position: static !important; translate: none !important; width: auto !important; margin: 0;
    display: flex; flex-direction: column; align-items: flex-start; gap: 12px; padding: 18px 0 20px;
    border-top: 1px solid rgba(172,156,141,0.6); }
  #s08 .cerchio-s08 { width: 48px; height: 48px; margin: 0 !important; }
  #s08 .testo-voce-s08 { font-size: 18px; line-height: 1.22; white-space: normal; }
  #s08 > .citazione-s08 { grid-row: 6; margin-top: 40px !important; font-size: 25px !important; }

  /* ================================================================ s09: testo, foto, citazione, 3 schede */
  #s09 > .eyebrow { grid-row: 1; }
  #s09 > h2 { grid-row: 2; }
  #s09 > p.forte { grid-row: 3; margin-top: 24px; }
  #s09 > p:not(.forte):not(.eyebrow) { grid-row: 4; margin-top: 14px; }
  #s09 > .sfondo-s09 { aspect-ratio: 876 / 600; overflow: hidden; }
  #s09 > .sfondo-s09 img { width: 175.34%; max-width: none; height: auto; margin: -6.85% 0 0 -75.34%; }
  #s09 > .sfondo-s09 { grid-row: 5; margin-top: 40px !important; }
  #s09 > .citazione-s09 { grid-row: 6; margin-top: 30px !important; }
  #s09 > .percorsi-s09 { grid-row: 7; margin-top: 40px; border-bottom: 1px solid rgba(172,156,141,0.6); }
  #s09 .percorso-s09 { position: static !important; translate: none !important; width: auto !important; margin: 0;
    display: grid; grid-template-columns: 52px 1fr; column-gap: 16px; align-items: center; text-align: left;
    padding: 20px 0; border-top: 1px solid rgba(172,156,141,0.6); }
  #s09 .cerchio-s09 { grid-row: 1 / 3; width: 52px; height: 52px; margin: 0; align-self: start; }
  #s09 .titolo-s09 { margin: 0; display: flex; flex-direction: row-reverse; justify-content: flex-end; align-items: baseline;
    gap: 10px; font-size: 26px; letter-spacing: .01em; }
  #s09 .titolo-s09 br { display: none; }
  #s09 .durata-s09 { font-size: 16px; font-family: var(--font-testo); letter-spacing: 0; color: rgb(97,12,39); }
  #s09 .durata-s09::before { content: "— "; }
  #s09 .payoff-s09 { margin-top: 6px; font-size: 16px; line-height: 1.5; }
}

/* ======================================================================= GRUPPO D (9.2, 9.3, s10, s11, piede)
   Generato da strumenti/mobile_d.py: modificare li', non qui. */
@media (max-width: 767.98px) {
  #s09b, #s09c, #s10, #s11 {
    aspect-ratio: auto !important; height: auto; display: grid; padding: var(--ritmo) 0;
    grid-template-columns: var(--g) minmax(0, 1fr) minmax(0, 1fr) var(--g); align-content: start;
    background-image: none !important;
  }
  :is(#s09b, #s09c, #s10, #s11) > * { grid-column: 2 / 4; }
  :is(#s09b, #s09c, #s10, #s11) .a { position: static !important; translate: none !important; width: auto !important;
    height: auto; margin: 0; left: auto; top: auto; }
  :is(#s09b, #s09c, #s10, #s11) .righe-fisse { white-space: normal !important; }
  :is(#s09b, #s09c, #s10, #s11) :is(.giunzione, [class*="filo-"], [class*="divisore-"]) { display: none !important; }
  :is(#s09b, #s09c, #s10, #s11) :is(.tipo-corpo, blockquote, .titolo-s09b, .nome-s09c, .titolo-fase-s10, .testo-s11) br { display: none; }
  :is(#s09b, #s09c, #s10, #s11) > h2 { font-size: var(--t-grande) !important; line-height: 1.02 !important; }
  :is(#s09b, #s09c, #s10) > h2 i { white-space: nowrap; }
  :is(#s09b, #s09c, #s10) > h2 i::before { content: "— "; }
  :is(#s09b, #s09c, #s10) > .tipo-sottotitolo { margin-top: 14px; font-size: var(--t-sotto) !important; line-height: 1.15 !important; }
  :is(#s09b, #s09c, #s10, #s11) > p:not(.eyebrow):not(.tipo-sottotitolo):not(.etichetta-fascia-s11) {
    font-size: var(--t-corpo) !important; line-height: 1.6 !important; letter-spacing: 0 !important; margin-top: 22px; }
  :is(#s09b, #s09c, #s10, #s11) > picture { grid-column: 1 / -1; }

  /* "La direzione": riquadro salvia, etichetta in alto, testo in corsivo (9.2, 9.3, s10) */
  #s09b > .citazione-s09b, #s09c > .citazione-s09c, #s10 > p.tipo-corpo:not(.forte) {
    margin-top: 32px !important; padding: 22px 22px 24px !important; background: rgb(212,187,162); border: 0 !important;
    font-family: var(--font-titoli) !important; font-style: italic; font-size: 21px !important; line-height: 1.35 !important;
    color: rgb(31,23,21) !important; text-shadow: none !important; letter-spacing: -.005em !important; }
  #s09b > .citazione-s09b::before, #s09c > .citazione-s09c::before, #s10 > p.tipo-corpo:not(.forte) strong {
    content: "La direzione"; display: block; margin-bottom: 10px; font-family: var(--font-testo); font-style: normal;
    font-size: 13px; font-weight: 500; letter-spacing: .09em; text-transform: uppercase; color: rgb(97,12,39); }

  /* ================================================================ 9.2 ALLINEA: basi, griglia 2 colonne */
  #s09b > .sfondo-s09b { aspect-ratio: 636 / 398; overflow: hidden; margin-top: 40px !important; }
  #s09b > .sfondo-s09b img { width: 241.51%; max-width: none; height: auto; margin: -39.31% 0 0 -141.51%; }
  #s09b > .eyebrow { grid-row: 1; } #s09b > h2 { grid-row: 2; } #s09b > .tipo-sottotitolo { grid-row: 3; }
  /* ordine: il paragrafo finisce con "lavoriamo per:" e l'elenco segue subito; "La direzione" chiude */
  #s09b > p.forte { grid-row: 4; } #s09b > .colonne-s09b { grid-row: 5; } #s09b > .sfondo-s09b { grid-row: 6; }
  #s09b > .citazione-s09b { grid-row: 7; }
  #s09b > .colonne-s09b { margin-top: 28px; display: grid; grid-template-columns: 1fr 1fr; column-gap: 16px; }
  #s09b .colonna-s09b { position: static !important; translate: none !important; width: auto !important; margin: 0;
    display: flex; flex-direction: column; align-items: flex-start; gap: 12px; text-align: left;
    padding: 18px 0 20px; border-top: 1px solid rgba(172,156,141,0.6); }
  #s09b .colonna-s09b:nth-child(5) { grid-column: 1 / -1; flex-direction: row; align-items: center; gap: 16px; }
  #s09b .colonna-s09b:nth-child(6) { display: none; }
  #s09b .cerchio-s09b { width: 48px; height: 48px; margin: 0; flex: none; }
  #s09b .titolo-s09b { margin: 0; font-size: 18px; line-height: 1.22; }

  /* ================================================================ 9.3 TRASFORMA: processo, timeline numerata */
  #s09c > .sfondo-s09c { aspect-ratio: 676 / 845; overflow: hidden; margin-top: 40px !important; }
  #s09c > .sfondo-s09c img { width: 227.22%; max-width: none; height: auto; margin: -17.75% 0 0 -127.22%; }
  #s09c > .eyebrow { grid-row: 1; } #s09c > h2 { grid-row: 2; } #s09c > .tipo-sottotitolo { grid-row: 3; }
  #s09c > p:not(.eyebrow):not(.tipo-sottotitolo) { grid-row: 4; } #s09c > .sfondo-s09c { grid-row: 5; }
  #s09c > .citazione-s09c { grid-row: 6; }
  #s09c > .passi-s09c { grid-row: 7; margin-top: 40px; position: relative; display: grid; row-gap: 26px; }
  #s09c > .passi-s09c::before { content: ""; position: absolute; left: 23px; top: 24px; bottom: 24px; width: 2px; background: rgb(97,12,39); }
  #s09c .passo-s09c { position: relative !important; translate: none !important; width: auto !important; margin: 0;
    display: flex; align-items: center; gap: 18px; }
  #s09c .cerchio-s09c { display: none; }
  #s09c .numero-s09c { order: -1; margin: 0; flex: none; width: 48px; height: 48px; border-radius: 50%; display: grid;
    place-items: center; background: rgb(239,236,233); border: 2px solid #4e634a; color: #2e3f2b; font-size: 18px; position: relative; }
  #s09c .nome-s09c { font-size: 22px; white-space: normal; line-height: 1.2; }

  /* ================================================================ s10 ESPANDI: continuita', nodi sottili */
  #s10 > .sfondo-s10 { aspect-ratio: 896 / 600; overflow: hidden; margin-top: 40px !important; }
  #s10 > .sfondo-s10 img { width: 171.43%; max-width: none; height: auto; margin: -6.70% 0 0 -71.43%; }
  #s10 > .eyebrow { grid-row: 1; } #s10 > h2 { grid-row: 2; } #s10 > .tipo-sottotitolo { grid-row: 3; }
  /* ordine: il paragrafo finisce con "fasi diverse:" e le 7 fasi seguono subito; poi foto, frase, direzione */
  #s10 > p.forte { grid-row: 4; } #s10 > p.tipo-corpo:not(.forte) { grid-row: 8; }
  #s10 > p.tipo-corpo:not(.forte) strong { font-weight: 500; }
  #s10 > .sfondo-s10 { grid-row: 6; }  /* dopo le fasi */
  #s10 > .citazione-s10 { grid-row: 7; margin-top: 32px !important; font-size: 27px !important; line-height: 1.22 !important;
    color: rgb(31,23,21) !important; text-shadow: none !important; border-left: 2px solid rgb(172,156,141) !important; padding-left: 20px !important; }
  #s10 > .fasi-s10 { grid-row: 5; margin-top: 24px; position: relative; display: grid; row-gap: 0; padding-left: 28px; }
  #s10 > .fasi-s10::before { content: ""; position: absolute; left: 5px; top: 18px; bottom: 18px; width: 1px; background: rgb(172,156,141); }
  #s10 .fase-s10 { position: relative !important; translate: none !important; width: auto !important; margin: 0; text-align: left; padding: 9px 0; }
  #s10 .fase-s10::before { content: ""; position: absolute; left: -28px; top: 17px; width: 11px; height: 11px; border-radius: 50%;
    background: rgb(239,236,233); border: 1.5px solid rgb(97,12,39); box-sizing: border-box; }
  #s10 .fase-s10:last-of-type::before { background: rgb(97,12,39); }
  #s10 .cerchio-s10 { display: none; }
  #s10 .titolo-fase-s10 { margin: 0; font-size: 20px; line-height: 1.25; }

  /* ================================================================ s11: scelta + evoluzione, chiusura leggera */
  #s11 > .sfondo-s11 { aspect-ratio: 836 / 410; overflow: hidden; margin-top: 40px !important; }
  #s11 > .sfondo-s11 img { width: 183.73%; max-width: none; height: auto; margin: -17.94% 0 0 -83.73%; }
  #s11 > .eyebrow { grid-row: 1; } #s11 > h2 { grid-row: 2; }
  #s11 > p.forte { grid-row: 3; } #s11 > p:not(.forte):not(.eyebrow):not(.etichetta-fascia-s11) { grid-row: 4; margin-top: 14px; }
  #s11 > .sfondo-s11 { grid-row: 5; }
  #s11 > .citazione-s11 { grid-row: 6; margin-top: 28px !important; font-size: 24px !important; line-height: 1.25 !important;
    color: #3f3b35 !important; text-shadow: none !important; border-left: 1px solid rgba(172,156,141,0.45) !important; padding-left: 18px !important; }
  #s11 > .etichetta-fascia-s11 { grid-row: 7; margin-top: 64px; font-family: var(--font-titoli) !important; font-size: 30px !important;
    line-height: 1.1 !important; letter-spacing: -.02em !important; text-transform: none !important; color: rgb(31,23,21) !important; }
  #s11 > .colonne-s11 { grid-row: 8; margin-top: 20px; counter-reset: passo; }
  #s11 .colonna-s11 { position: static !important; translate: none !important; width: auto !important; margin: 0;
    display: grid; grid-template-columns: 38px 1fr; text-align: left; padding: 16px 0; border-top: 1px solid rgba(172,156,141,0.6);
    counter-increment: passo; }
  #s11 .colonna-s11:last-of-type { border-bottom: 1px solid rgba(172,156,141,0.6); }
  #s11 .colonna-s11::before { content: counter(passo, decimal-leading-zero); font-family: var(--font-titoli); font-size: 17px;
    color: rgb(97,12,39); line-height: 1.5; }
  #s11 .cerchio-s11 { display: none; }
  #s11 .testo-s11 { margin: 0; font-size: 17.5px; line-height: 1.5; }

  /* ================================================================ piede: una colonna, gruppi con filetti */
  .piede { font-size: 17px; }
  .piede-griglia { grid-template-columns: 1fr; gap: 0; padding: 64px var(--g) 8px; }
  .piede-nome { font-size: 30px; }
  .piede-ruolo { margin: 8px 0 0; }
  .piede-descrizione { margin: 2px 0 24px; }
  .piede-prenota { min-height: 50px; padding: 0 24px; font-size: 17px; }
  .piede-marchio { padding-bottom: 32px; }
  .piede-colonna { padding: 22px 0 18px; border-top: 1px solid rgba(212,187,162,0.18); }
  .piede-titolo { font-size: 13px; letter-spacing: .09em; text-transform: uppercase; margin: 0 0 6px; }
  .piede li { margin: 0; }
  .piede li a { display: flex; align-items: center; min-height: 44px; overflow-wrap: anywhere; }
  .piede-firma { padding: 20px var(--g) 28px; font-size: 14px; }
}

/* ======================================================================= CORREZIONI AUDIT (telefono)
   Generato da strumenti/mobile_audit.py: modificare li', non qui. */
@media (max-width: 767.98px) {
  /* 1. respiro fra le sezioni: 56 px sopra e sotto (era 96); piu' aria all'ingresso di s06 e di s09 */
  :root { --section-space-mobile: 56px; --ritmo: var(--section-space-mobile); }
  #s06, #s09 { padding-top: 72px !important; }

  /* 2. l'etichetta generica "Percorsi A.L.I.N.E.A." resta solo in s09 */
  #s09b > .eyebrow, #s09c > .eyebrow, #s10 > .eyebrow, #s11 > .eyebrow { display: none !important; }

  /* 3. meno nature morte in fila: TRASFORMA vive nella timeline, s11 chiude senza foto */
  #s09c > .sfondo-s09c, #s11 > .sfondo-s11 { display: none !important; }

  /* 4. TRASFORMA: quattro fasi editoriali numerate, senza cerchi (s06 resta coi nodi) */
  #s09c > .passi-s09c { row-gap: 0; }
  #s09c > .passi-s09c::before { display: none; }
  #s09c .passo-s09c { display: grid; grid-template-columns: 58px 1fr; align-items: baseline; gap: 0; padding: 18px 0;
    border-top: 1px solid rgba(172,156,141,0.6); }
  #s09c .passo-s09c:last-of-type { border-bottom: 1px solid rgba(172,156,141,0.6); }
  #s09c .numero-s09c { width: auto; height: auto; border: 0; border-radius: 0; background: none; display: block;
    font-size: 34px; line-height: 1; color: rgb(97,12,39); letter-spacing: -.02em; }
  #s09c .nome-s09c { font-size: 22px; }

  /* 5. "La direzione" di ESPANDI come quella di ALLINEA e TRASFORMA */
  #s10 > p.tipo-corpo:not(.forte):not(.eyebrow):not(.tipo-sottotitolo) { font-size: 21px !important; line-height: 1.35 !important;
    letter-spacing: -.005em !important; }

  /* 7. riquadro A.L.I.N.E.A.: ingresso morbido di 22 px dal verde del fondo */
  #s06 > .sfondo-s06.a { position: relative !important; }
  #s06 > .sfondo-s06::before { content: ""; position: absolute; left: 0; right: 0; top: 0; height: 22px;
    background: linear-gradient(#16231b, rgba(22, 35, 27, 0)); pointer-events: none; }

  /* 8. logo in testata: area di tocco di almeno 44 px, stessa misura visiva */
  #s01 header .marchio { min-height: 44px; display: flex !important; flex-direction: column; justify-content: center; }
}

/* ======================================================================= MOBILE V2 — GRUPPO A (Per chi è, 6 dimensioni)
   Generato da strumenti/mobile_v2a.py: modificare li', non qui. */
@media (max-width: 767.98px) {
  #per-chi-e, #dimensioni {
    aspect-ratio: auto !important; height: auto; display: grid; align-content: start;
    grid-template-columns: var(--g) minmax(0, 1fr) minmax(0, 1fr) var(--g);
  }
  :is(#per-chi-e, #dimensioni) > * { grid-column: 2 / 4; }
  :is(#per-chi-e, #dimensioni) .a { position: static !important; translate: none !important; width: auto !important;
    height: auto; margin: 0; left: auto; top: auto; }
  :is(#per-chi-e, #dimensioni) .righe-fisse { white-space: normal !important; }
  :is(#per-chi-e, #dimensioni) :is(.giunzione, .filo-v2-v) { display: none !important; }

  /* ================================================================ Per chi è: crema -> azzurro -> crema */
  #per-chi-e { background: rgb(239,236,233); padding: var(--ritmo) 0; }
  #per-chi-e > .fascia-v2 { display: none; }
  #per-chi-e > .fascia-v2:nth-child(2) { display: block; grid-column: 1 / -1; grid-row: 5 / 7; }   /* la fascia azzurra */
  #per-chi-e > .eyebrow { grid-row: 1; }
  #per-chi-e > h2 { grid-row: 2; font-size: var(--t-grande) !important; line-height: 1.02 !important; text-wrap: balance; }
  #per-chi-e > h2 br { display: none; }
  #per-chi-e > p:nth-of-type(2) { grid-row: 3; margin-top: 22px; font-size: var(--t-corpo) !important; line-height: 1.55 !important; }
  #per-chi-e > p:nth-of-type(3) { grid-row: 4; margin-top: 12px; font-size: 16.5px !important; line-height: 1.55 !important; }
  #per-chi-e > h3:first-of-type { grid-row: 5; position: relative !important; z-index: 1; margin-top: 40px;
    font-size: var(--t-medio) !important; line-height: 1.05 !important; text-wrap: balance; }
  #per-chi-e > .elenco-v2 { grid-row: 6; position: relative; z-index: 1; margin: 18px 0 36px;
    display: grid; grid-template-columns: 1fr 1fr; column-gap: 16px; }
  #per-chi-e .elenco-v2 > .filo-v2 { display: none; }
  #per-chi-e .voce-v2 { display: grid; grid-template-columns: 14px 1fr; column-gap: 6px; align-items: baseline;
    padding: 10px 0 11px; border-top: 1px solid rgba(172,156,141,0.5);
    font-size: 16.5px !important; line-height: 1.34 !important; }
  #per-chi-e .voce-v2 br { display: none; }
  #per-chi-e .voce-v2 span:first-child { font-size: 13px; }
  #per-chi-e > h3:last-of-type { grid-row: 7; margin-top: 44px; font-size: var(--t-medio) !important; line-height: 1.02 !important; }
  #per-chi-e > p:nth-of-type(4) { grid-row: 8; margin-top: 20px; font-size: var(--t-corpo) !important; line-height: 1.55 !important; }
  #per-chi-e > .hanno-v2 { grid-row: 9; margin-top: 12px; font-size: 22px !important; line-height: 1.25 !important; }
  #per-chi-e > p:nth-of-type(6) { grid-row: 10; margin-top: 18px; font-size: var(--t-corpo) !important; line-height: 1.55 !important; }
  #per-chi-e > p:nth-of-type(7) { grid-row: 11; margin-top: 10px; font-size: 16.5px !important; line-height: 1.45 !important; }
  /* a 360 due colonne sono troppo strette per voci di tre-quattro righe: una sola colonna, solo li' */
  @media (max-width: 374.98px) {
    #per-chi-e > .elenco-v2 { grid-template-columns: 1fr; }
  }

  /* ================================================================ 6 dimensioni: continua il verde di s06 */
  #dimensioni { background: rgb(74,52,44); padding: 8px 0 var(--ritmo); }
  #dimensioni > .fascia-v2 { display: none; }
  #dimensioni > h2 { font-size: var(--t-medio) !important; line-height: 1.05 !important; text-wrap: balance; }
  #dimensioni > .filo-v2 { margin-top: 20px; }
  #dimensioni > .dimensioni-v2 { display: block; }
  /* una sequenza di dimensioni, non un processo: niente numeri, cerchi o linea continua;
     lettera grande a sinistra, nome e descrizione accanto, filetto sottile fra una e l'altra */
  #dimensioni .dimensione-v2 { display: grid; grid-template-columns: 68px 1fr; column-gap: 14px; align-items: start;
    padding: 18px 0 20px; border-bottom: 1px solid rgba(212,187,162,0.22); }
  #dimensioni .dimensione-v2:last-of-type { border-bottom: 0; padding-bottom: 0; }
  #dimensioni .lettera-v2 { grid-row: 1 / 3; height: auto; margin: -6px 0 0 -2px; font-size: 66px; line-height: 1; }
  #dimensioni .nome-v2 { font-size: 20px; line-height: 1.25; }
  #dimensioni .testo-v2 { margin-top: 6px; font-size: 16.5px; line-height: 1.5; }
  #dimensioni .testo-v2 br { display: none; }
}

/* ======================================================================= MOBILE V2 — GRUPPO B (Health Coaching, Chi sono)
   Generato da strumenti/mobile_v2b.py: modificare li', non qui. */
@media (max-width: 767.98px) {
  #health-coaching, #chi-sono {
    aspect-ratio: auto !important; height: auto; display: grid; align-content: start;
    grid-template-columns: var(--g) minmax(0, 1fr) minmax(0, 1fr) var(--g); background: rgb(239,236,233);
  }
  :is(#health-coaching, #chi-sono) > * { grid-column: 2 / 4; }
  :is(#health-coaching, #chi-sono) .a { position: static !important; translate: none !important; width: auto !important;
    height: auto; margin: 0; left: auto; top: auto; }
  :is(#health-coaching, #chi-sono) .righe-fisse { white-space: normal !important; }
  :is(#health-coaching, #chi-sono) :is(.giunzione, .filo-v2-v, .fascia-v2, .cerchio-v2) { display: none !important; }
  :is(#health-coaching, #chi-sono) :is(h2, h3) { text-wrap: balance; }
  :is(#health-coaching, #chi-sono) :is(h2, h3) br { display: none; }

  /* ================================================================ Health Coaching
     apertura -> foto -> frase chiave -> tre principi (titolo, testo, filetto) -> pannello azzurro di chiusura */
  #health-coaching { padding-top: var(--ritmo); }
  #health-coaching > .eyebrow { grid-row: 1; }
  #health-coaching > h2 { grid-row: 2; font-size: var(--t-medio) !important; line-height: 1.05 !important; }
  #health-coaching > p:nth-of-type(2) { grid-row: 3; margin-top: 20px; font-size: var(--t-corpo) !important; line-height: 1.55 !important; }
  #health-coaching > .foto-v2 { grid-row: 4; margin-top: 26px; aspect-ratio: 16 / 9; }
  #health-coaching > p:nth-of-type(3) { grid-row: 5; margin-top: 24px; padding-left: 16px; border-left: 1px solid rgba(172,156,141,0.45);
    font-size: 22px !important; line-height: 1.26 !important; }
  #health-coaching > h3:nth-of-type(1) { grid-row: 6; margin-top: 34px; }
  #health-coaching > p:nth-of-type(4) { grid-row: 7; }
  #health-coaching > h3:nth-of-type(2) { grid-row: 8; }
  #health-coaching > p:nth-of-type(5) { grid-row: 9; }
  #health-coaching > h3:nth-of-type(3) { grid-row: 10; }
  #health-coaching > p:nth-of-type(6) { grid-row: 11; }
  #health-coaching > :is(h3:nth-of-type(-n+3)) { font-size: 23px !important; line-height: 1.12 !important; }
  #health-coaching > :is(h3:nth-of-type(2), h3:nth-of-type(3)) { margin-top: 20px; padding-top: 18px; border-top: 1px solid rgba(172,156,141,0.6); }
  #health-coaching > :is(p:nth-of-type(4), p:nth-of-type(5), p:nth-of-type(6)) { margin-top: 8px; font-size: 16.5px !important; line-height: 1.46 !important; }
  /* pannello azzurro: una sola superficie, i due blocchi del desktop separati da un filetto:
     1) integrazione con Nutrizione e Medicina Funzionale; 2) capacita' di risposta, consolidamento, fiducia */
  #health-coaching > .fascia-v2:nth-child(2) { display: block !important; grid-column: 1 / -1; grid-row: 12 / 16; margin-top: 40px; }
  #health-coaching > h3:nth-of-type(4) { grid-row: 12; margin-top: 76px; }
  #health-coaching > p:nth-of-type(7) { grid-row: 13; }
  #health-coaching > h3:nth-of-type(5) { grid-row: 14; margin-top: 20px; padding-top: 18px; border-top: 1px solid rgba(172,156,141,0.5); }
  #health-coaching > p:nth-of-type(8) { grid-row: 15; margin-bottom: 40px; }
  #health-coaching > :is(h3:nth-of-type(4), h3:nth-of-type(5)) { position: relative !important; z-index: 1;
    font-size: 21px !important; line-height: 1.15 !important; }
  #health-coaching > :is(p:nth-of-type(7), p:nth-of-type(8)) { position: relative !important; z-index: 1; margin-top: 8px;
    font-size: 16.5px !important; line-height: 1.46 !important; }

  /* ================================================================ Chi sono
     titolo -> dettaglio verticale della foto -> quattro tappe (numero, titolo, testo, filetto) -> citazione */
  #chi-sono { padding: var(--ritmo) 0; }
  #chi-sono > .eyebrow { grid-row: 1; }
  #chi-sono > h2 { grid-row: 2; font-size: var(--t-grande) !important; line-height: 1.02 !important; }
  /* stesso scatto della hero, altro uso: dettaglio stretto su volto e busto, non a tutta larghezza.
     Per un secondo scatto basta sostituire foto/chi-sono.webp: il riquadro ritaglia con object-fit: cover */
  #chi-sono > .foto-chi-sono { grid-row: 3; margin-top: 24px; width: 60% !important; aspect-ratio: 4 / 5; justify-self: start; --fuoco: 50% 12%; }
  #chi-sono > .filo-v2 { display: none; }
  /* ogni tappa: numero piccolo e titolo sulla stessa riga (stessa cella), testo sotto, filetto fra una e l'altra */
  #chi-sono > p.numero-v2 { font-size: 13px !important; line-height: 22px !important; letter-spacing: .08em; color: rgb(97,12,39); }
  #chi-sono > h3 { padding-left: 34px; font-size: 22px !important; line-height: 1.15 !important; }
  #chi-sono > :is(p.numero-v2:nth-of-type(2), h3:nth-of-type(1)) { grid-row: 5; margin-top: 30px; }
  #chi-sono > p:nth-of-type(3) { grid-row: 6; }
  #chi-sono > :is(p.numero-v2:nth-of-type(4), h3:nth-of-type(2)) { grid-row: 7; }
  #chi-sono > p:nth-of-type(5) { grid-row: 8; }
  #chi-sono > :is(p.numero-v2:nth-of-type(6), h3:nth-of-type(3)) { grid-row: 9; }
  #chi-sono > p:nth-of-type(7) { grid-row: 10; }
  #chi-sono > :is(p.numero-v2:nth-of-type(8), h3:nth-of-type(4)) { grid-row: 11; }
  #chi-sono > p:nth-of-type(9) { grid-row: 12; }
  #chi-sono > :is(p.numero-v2:nth-of-type(4), p.numero-v2:nth-of-type(6), p.numero-v2:nth-of-type(8),
                  h3:nth-of-type(2), h3:nth-of-type(3), h3:nth-of-type(4)) { margin-top: 18px; padding-top: 16px; }
  #chi-sono > :is(p.numero-v2:nth-of-type(4), p.numero-v2:nth-of-type(6), p.numero-v2:nth-of-type(8)) { border-top: 1px solid rgba(172,156,141,0.6); }
  #chi-sono > :is(p:nth-of-type(3), p:nth-of-type(5), p:nth-of-type(7), p:nth-of-type(9)) { margin-top: 8px;
    font-size: 16.5px !important; line-height: 1.46 !important; }
  #chi-sono > blockquote.a { grid-row: 13; margin-top: 28px; font-size: 24px !important; line-height: 1.25 !important;
    padding-left: 18px !important; }
  #chi-sono > blockquote br { display: none; }
}

/* ======================================================================= MOBILE V2 — GRUPPO C (s09 percorsi, Kreo Agency)
   Generato da strumenti/mobile_v2c.py: modificare li', non qui. */
@media (max-width: 767.98px) {
  /* ================================================================ s09: tre righe editoriali cliccabili
     numero, nome — durata, payoff, freccia; tutta la riga porta all'approfondimento (#allinea, #trasforma, #espandi).
     "Scopri …" resta solo per chi usa un lettore di schermo: l'azione la dicono freccia e riga */
  #s09 .percorsi-s09 { counter-reset: percorso; }
  #s09 .percorsi-s09 > .percorso-s09 { position: relative !important; counter-increment: percorso;
    grid-template-columns: 30px 1fr 22px; column-gap: 12px; align-items: baseline; padding: 18px 0 20px; }
  #s09 .percorsi-s09 > .percorso-s09::before { content: counter(percorso, decimal-leading-zero); grid-column: 1; grid-row: 1;
    font-family: var(--font-testo); font-size: 13px; letter-spacing: .08em; color: rgb(97,12,39); }
  #s09 .percorsi-s09 .cerchio-s09 { display: none; }
  #s09 .percorsi-s09 .titolo-s09 { grid-column: 2; grid-row: 1; }
  #s09 .percorsi-s09 .payoff-s09 { grid-column: 2; grid-row: 2; }
  #s09 .percorsi-s09 .link-s09 { grid-column: 3; grid-row: 1 / 3; align-self: center; display: flex; color: rgb(31,23,21); }
  #s09 .percorsi-s09 .link-s09 span { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0);
    clip-path: inset(50%); white-space: nowrap; }
  #s09 .percorsi-s09 .link-s09 svg { width: 20px; height: 20px; fill: none; stroke: currentColor; stroke-width: 1.5; }
  #s09 .percorsi-s09 .link-s09::after { content: ""; position: absolute; inset: 0; }
  #s09 .percorsi-s09 .link-s09:focus-visible { outline: none; }
  #s09 .percorsi-s09 .link-s09:focus-visible::after { outline: 2px solid var(--etichetta); outline-offset: 2px; }

  /* ================================================================ Kreo Agency: firma del progetto, epilogo prima del piede
     segno diagonale viola e giallo -> logo ufficiale -> titolo -> testo -> portatile con la Home -> pulsante */
  #kreo-agency {
    aspect-ratio: auto !important; height: auto; display: grid; align-content: start;
    grid-template-columns: var(--g) minmax(0, 1fr) minmax(0, 1fr) var(--g);
    padding: var(--ritmo) 0; background: rgb(239,236,233); border-top: 1px solid rgba(172,156,141,0.6);
  }
  #kreo-agency > * { grid-column: 2 / 4; }
  #kreo-agency .a { position: static !important; translate: none !important; width: auto !important;
    height: auto; margin: 0; left: auto; top: auto; }
  #kreo-agency .righe-fisse { white-space: normal !important; }
  #kreo-agency > .fascia-v2 { display: none; }
  #kreo-agency::before { content: ""; grid-column: 2 / 4; grid-row: 1; justify-self: start; width: 46px; height: 14px; margin-bottom: 22px;
    background: linear-gradient(115deg, transparent 0 18%, var(--kreo-viola) 18% 52%, transparent 52% 60%,
      var(--kreo-giallo) 60% 94%, transparent 94%); }
  #kreo-agency > .logo-kreo { grid-row: 2; width: 132px !important; justify-self: start; }
  #kreo-agency > p.tipo-display { grid-row: 3; margin-top: 24px; font-size: 28px !important; line-height: 1.14 !important; }
  #kreo-agency > p.tipo-corpo { grid-row: 4; margin-top: 14px; font-size: var(--t-corpo) !important; line-height: 1.55 !important; }
  /* il portatile e' il visual: stessa foto del desktop, inquadrata sul computer (la Home V2 sullo schermo) */
  #kreo-agency > .foto-kreo { grid-row: 5; grid-column: 1 / -1; margin-top: 30px; height: auto !important; aspect-ratio: 4 / 3; }
  #kreo-agency > .foto-kreo img { object-position: 80% 50%; }
  /* pulsante: riconoscibile come Kreo (viola), ma a filo e non pieno, per non competere con "Prenota" */
  #kreo-agency > .cta.cta-kreo { grid-row: 6; margin-top: 28px; --h: 0; height: auto !important; min-height: 52px;
    width: max-content !important; max-width: 100%; justify-self: start; gap: 14px; padding: 0 24px !important;
    font-size: var(--t-cta) !important; background: transparent !important; color: var(--kreo-viola) !important;
    border: 1.5px solid var(--kreo-viola); box-shadow: none !important; }
  #kreo-agency > .cta.cta-kreo:hover { background: rgba(62, 17, 253, .07) !important; }
}

/* ======================================================================= MOBILE V2 — CORREZIONI AUDIT
   Difetti tecnici trovati dall'audit finale della V2 (strumenti/audit-mobile-v2.cjs), solo sotto 768 px. */
@media (max-width: 767.98px) {
  /* nome in testa al pannello del menu: bersaglio di tocco di almeno 44 px (era 21), stesso aspetto */
  .menu-telefono-marchio { display: inline-flex; align-items: center; min-height: 44px; }
}