/* savorani-guscio.css — le riparazioni del guscio (index-3 / header-2).
   GENERATO da tools/savorani-shell.mjs: si modifica LI', non qui.
   Solo difetti oggettivi: senza queste righe qualcosa non funziona o non
   si legge. Colori, corpi e spaziature stanno in savorani.css, caricato dopo.
   Le motivazioni sono in tools/alpi-shell.mjs (GUSCIO_CSS, 1-6) e in
   docs/savorani-regia.md §5 (S2, S4). */

/* --- 1. Immagini con width/height dichiarati (CLS): main.css ha
   img{max-width:100%} senza height:auto -------------------------------- */
img { height: auto; }

/* --- 2. Il tondo del menu esiste solo dove il menu serve ---------------
   Sopra i 992px le voci sono nella barra e il pannello off-canvas e' vuoto
   (meanmenu clona solo sotto la sua soglia). 993 e non 992: e' la soglia
   del tema. */
@media only screen and (min-width: 993px) {
  .header .primary-header-inner .header-right-wrap .sidebar-icon { display: none; }
}
.eg-menu-toggle { min-width: 44px; min-height: 44px; }

/* --- 3. Le fasce scure senza fotografia: main.css conta sulla foto ----- */
.bg-img,
.cta-bg,
.footer-bg {
  background-color: var(--tl-color-bg-1, #1C1C1D);
}

/* --- 4. Il pannello off-canvas chiuso non e' tabbabile ----------------- */
.mobile-side-menu {
  visibility: hidden;
  transition: transform .5s ease, visibility 0s linear .5s;
}
.mobile-side-menu.is-open {
  visibility: visible;
  transition: transform .5s ease, visibility 0s;
}

/* --- 5. Senza JavaScript: niente attesa infinita, e un menu ------------
   La classe `js` la scrive lo script in linea nella testa. Se resta
   `no-js`: via il preloader (lo rimuove main.js), via il tondo (il
   pannello non lo riempirebbe nessuno) e la <ul> torna una riga di link
   veri in testata, sotto il lockup. Specificita' calcolata per battere
   `.header .primary-header-inner .header-menu-wrap ul{display:none}`. */
.no-js .preloader { display: none; }
.no-js .header .primary-header-inner .header-right-wrap .sidebar-icon { display: none; }
@media only screen and (max-width: 992px) {
  .no-js .header { position: static; }
  .no-js .header .primary-header { background-color: #191919; }
  .no-js .header .primary-header-inner { flex-wrap: wrap; }
  .no-js .header .primary-header-inner .header-center-wrap { flex: 1 0 100%; order: 3; }
  .no-js .header .primary-header-inner .header-menu-wrap ul {
    display: flex;
    flex-wrap: wrap;
    gap: 4px 18px;
  }
  .no-js .header .primary-header-inner .header-menu-wrap ul li { margin: 0; }
  .no-js .header .primary-header-inner .header-menu-wrap ul li a {
    display: inline-block;
    padding: 11px 0;   /* 44px di bersaglio anche senza savorani.css */
  }
  /* il lockup mobile e' gia' in testata: nella riga delle voci il logo
     sarebbe il secondo marchio a dieci pixel dal primo */
  .no-js .header .primary-header-inner .header-menu-wrap ul li.site-logo { display: none; }
}

/* --- 6. Moto ridotto ----------------------------------------------------
   Senza queste righe, a moto ridotto, i blocchi che GSAP non ha ancora
   rivelato restano a opacity:0 per sempre. */
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration: .001ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: .001ms !important;
    scroll-behavior: auto !important;
  }
  .slide-anim, .fade-top, .fade-wrapper > *, [data-text-animation] {
    opacity: 1 !important;
    transform: none !important;
  }
}

/* --- 7. L'HERO DI INDEX-3 DIPENDE DAL JAVASCRIPT (trappola S2) --------
   main.css: `.slider-section{opacity:0;visibility:hidden}` finche'
   slider.js non aggiunge `.slider-ready` (80ms dopo il preloader), e
   `[data-animation]{opacity:0}` finche' non parte l'animazione. Se lo
   script non arriva o muore, l'H1 della pagina non esiste per nessuno.
   Sul ramo .no-js e a moto ridotto l'hero e' visibile da subito; con il
   JavaScript vivo restano le entrate del tema. */
.no-js .slider-section { opacity: 1; visibility: visible; }
.no-js [data-animation] { opacity: 1; }
@media (prefers-reduced-motion: reduce) {
  .slider-section { opacity: 1 !important; visibility: visible !important; }
  [data-animation] { opacity: 1 !important; }
}

/* --- 8. DUE MARCHI, UNO PER VOLTA (trappola S4) --------------------------
   header-2 mostra il logo dentro la <ul> del menu, che il tema nasconde
   sotto i 992px: li' il marchio e' quello nello slot della lente
   (.eg-lockup-mobile). Sopra i 993 si vede solo quello del menu. «Home» e'
   una voce del solo pannello mobile (regia §1): nella barra non c'e'. */
@media only screen and (min-width: 993px) {
  .eg-lockup-mobile { display: none; }
  .header .primary-header-inner .header-menu-wrap ul li.eg-solo-mobile { display: none; }
}