/* ==================================================
   RESPONSIVE
   V3.7 — riscritto: dalla V3.7 esiste UN'UNICA geometria orizzontale
   (larghezza app = min(100% del device, 430px), vedi .mobile-shell in
   css/layout.css), quindi le vecchie soglie min-width:768/1024/1440px
   NON rappresentano piu' "tablet/desktop reali diversi dal telefono":
   rappresentano solo il monitor ESTERNO, che non deve mai influenzare
   la composizione interna della shell (padding, font-size, larghezza
   slide) — quello lo fa gia' `calc(N * var(--vw))` risolvendo su
   1cqw della shell stessa. Ogni regola qui sotto e' stata riverificata
   una per una:
   - se cambiava padding/font-size/flex-basis SOLO perche' il monitor
     era piu' largo (senza che la shell cambiasse larghezza) è stata
     RIMOSSA (non solo commentata: erano scorrette per definizione nella
     nuova architettura, non solo "storiche");
   - se produceva lo stesso risultato visivo della regola base (perche'
     un'altra regola, con la stessa specificita' ma caricata dopo,
     riportava sempre il valore a quello corretto) era CODICE MORTO
     anche prima della V3.7 — rimossa per chiarezza, verificato che
     nessuna pagina dipendesse dal valore intermedio;
   - il blocco sotto i 374px resta invariato nel principio (corrisponde
     a telefoni realmente stretti: sotto i 430px la shell = larghezza
     del device, quindi max-width:374px sul viewport esterno equivale
     esattamente a "shell piu' stretta di 374px" — nessuna incoerenza).
   Dettaglio completo di ogni singola rimozione in V3_7_NOTE.md. */

/* ---------- TELEFONI MOLTO PICCOLI (shell <374px) ---------- */
@media (max-width: 374px) {
  .display-title {
    font-size: clamp(2.25rem, calc(11 * var(--vw)), 3rem);
  }

  .horizontal-story-panel {
    flex-basis: calc(90 * var(--vw));
  }

  /* V1.9 — la iOS 3 riusa .horizontal-story-panel ma ogni slide deve
     restare a piena larghezza della card (non "sbirciare" la slide
     successiva come nel rail generico, vedi css/components.css). Le
     classi-card hanno gia' un proprio `flex:0 0 100%` di base (vedi
     css/hero.css, css/ios-extra-cards.css): questa reassert serve solo
     a battere, sui telefoni molto stretti, il valore sopra se mai un
     giorno risultasse piu' specifico — innocua, tenuta per sicurezza. */
  .ios2a-panel,
  .ios3-panel,
  .ios4-panel,
  .ios6-panel,
  .ios-book-panel,
  .ios-thanks-panel {
    flex-basis: 100%;
  }

  /* V3.7 — hardening richiesto esplicitamente per shell <374px: meno
     gutter/padding, mai testo illeggibile. Vedi anche i clamp() gia'
     presenti su tutte le tipografie (si stringono da soli con --vw). */
  :root {
    --card-gutter: clamp(8px, calc(2.6 * var(--vw)), 22px);
    --scene-gap: clamp(16px, calc(4.2 * var(--vw)), 40px);
  }

  .container,
  .container-wide {
    padding-inline: var(--space-sm);
  }

  /* V3.7 — misurato via Playwright: a 320px di shell il gruppo CTA
     "a sticker" della iOS 4/iOS 5 (due bottoni fissi in rem, non
     scalati da --vw, sempre stati cosi' nel progetto — vedi
     .button-primary/.button-secondary in components.css) eccedeva il
     bordo destro della card di 8-10px sulle slide 4A e 5A (Bambino
     Interiore), quel tanto che basta a far tagliare visivamente
     l'ultimo bottone dall'overflow:hidden del pannello. Nessuna delle
     altre slide (4B, 5B, 5C) e' interessata: li' il margin-left del
     calibratore lascia gia' abbastanza margine. Un padding leggermente
     ridotto sui due bottoni SOLO qui (mai sotto una dimensione ancora
     comodamente toccabile, resta ben oltre i 44px minimi) recupera lo
     spazio mancante senza toccare le altre slide ne' i bottoni identici
     usati altrove nel sito. */
  .ios4-panel__cta .button-primary,
  .ios4-panel__cta .button-secondary {
    padding-inline: 1.4rem;
  }
}

/* ==================================================
   V3.6 — regole storiche legate al MONITOR esterno (768/1024/1440px),
   in conflitto con "stessa composizione della shell ovunque" della
   V3.7. RIMOSSE (non solo commentate) dopo verifica che:
   (a) i sei selettori-card (.ios2a-panel/.ios3-panel/.ios4-panel/
       .ios6-panel/.ios-book-panel/.ios-thanks-panel) hanno GIA' un
       proprio `flex:0 0 100%` di base, non gated da alcun media query
       (css/hero.css, css/ios-extra-cards.css) — la differenziazione
       `.horizontal-story-panel{flex-basis:56/34/26 * var(--vw)}` per
       questi selettori non ha MAI avuto effetto visivo reale (veniva
       sempre riportata a 100% dalla reassert list, quando presente in
       lista — vedi il bug V3.4/V3.5 corretto in V3.6): codice morto,
       rimosso;
   (b) `.container`/`.container-wide` vivono SEMPRE dentro
       `.mobile-shell` (max-width:430px): il loro proprio `max-width`
       (40rem/75rem, vedi css/variables.css) non si applica mai perche'
       lo spazio disponibile e' gia' quello, piu' stretto, della shell —
       ma il loro `padding-inline` era davvero diverso da mobile a
       desktop (var(--space-md) → var(--space-lg) a 768px, di nuovo
       invariato a 1024/1440px): questo SI' cambiava la composizione a
       parita' di larghezza di shell, esattamente l'esempio esplicito
       fatto nella richiesta V3.7 — rimosso, resta sempre
       var(--space-md);
   (c) `.media-edge` allo stesso modo cambiava margine da
       var(--space-md) a var(--space-lg) solo per il monitor esterno —
       rimosso, resta sempre il valore base;
   (d) `.site-nav__item a{font-size:...}` a 1440px usava una formula
       DIVERSA (clamp(2.5rem, calc(4*var(--vw)), 4rem) invece della
       base clamp(1.75rem, calc(6*var(--vw))+0.5rem, 3.25rem)): a
       parita' di larghezza di shell (430px) i due clamp restituiscono
       due dimensioni di testo diverse (rispettivamente ~40px e ~34px)
       — cioe' lo stesso identico identico voce di menu, nella stessa
       shell da 430px, con un font-size diverso solo perche' il monitor
       esterno e' >=1440px: esattamente il difetto vietato dal punto 18
       della richiesta V3.7 ("430x900 vs 1440x900... NON accettabile:
       diversi font-size CSS"). Rimosso, resta sempre la formula base;
   (e) `.split-section`/`.split-section--reverse` a 1024px: componente
       MAI usato in nessuna delle 12 pagine HTML (verificato via grep) —
       codice morto anche prima della V3.7, rimosso;
   (f) l'hint "Scorri lateralmente" nascosto a 1024px era gia' stato
       disattivato in V3.6 (commentato, non riattivato qui).
   ================================================== */
