/* =====================================================================
   ART IMAGE — V50
   Mobile:
   - Home bloccata: niente scroll verticale, logo fermo
   - Menu: tutti e 5 i pulsanti con la stessa identica altezza
   - "Quadri" leggermente più larga dentro il pulsante
   - Galleria/Quadri: testi superiori ancora più leggibili
   ===================================================================== */

@media screen and (max-width:820px) {

  /* ---------------------------------------------------------
     HOME BLOCCATA
     Il logo resta fermo e la Home non scorre verticalmente.
     Il menu resta fisso in basso.
     --------------------------------------------------------- */
  html:has(body.ai-home-page) {
    height:100% !important;
    overflow:hidden !important;
  }

  body.ai-home-page {
    height:100dvh !important;
    min-height:100dvh !important;
    max-height:100dvh !important;
    overflow-y:hidden !important;
    overflow-x:hidden !important;
    padding-bottom:0 !important;
  }

  body.ai-home-page #aiMobileBrandV45 {
    position:fixed !important;
    z-index:200 !important;
    top:0 !important;
    left:0 !important;
    right:0 !important;
    width:100% !important;
    margin:0 !important;
  }

  /* Il contenuto Home resta dentro la prima videata, senza generare scroll. */
  body.ai-home-page #imPage {
    height:100dvh !important;
    min-height:100dvh !important;
    max-height:100dvh !important;
    overflow:hidden !important;
    padding-top:clamp(238px, 55vw, 280px) !important;
    padding-bottom:126px !important;
    box-sizing:border-box !important;
  }

  body.ai-home-page #imContent {
    height:100% !important;
    min-height:0 !important;
    max-height:100% !important;
    overflow:hidden !important;
  }

  /* L'animazione rimane nella zona centrale della schermata. */
  body.ai-home-page #aiMobileHomeSlideshow.ai-mobile-home-active {
    margin-top:clamp(48px, 11vw, 66px) !important;
    margin-bottom:0 !important;
    max-height:calc(100dvh - clamp(238px, 55vw, 280px) - 178px) !important;
    overflow:hidden !important;
  }

  /* ---------------------------------------------------------
     MENU: STESSA IDENTICA ALTEZZA PER TUTTI I 5 PULSANTI
     --------------------------------------------------------- */
  #aiMobileBottomNavV45 {
    grid-template-rows:48px 48px !important;
    align-items:stretch !important;
  }

  #aiMobileBottomNavV45 .ai-v45-bottom-link,
  #aiMobileBottomNavV45 .ai-v45-home,
  #aiMobileBottomNavV45 .ai-v45-galleria,
  #aiMobileBottomNavV45 .ai-v45-quadri,
  #aiMobileBottomNavV45 .ai-v45-acquisti,
  #aiMobileBottomNavV45 .ai-v45-contatti {
    height:48px !important;
    min-height:48px !important;
    max-height:48px !important;
    align-self:stretch !important;
    box-sizing:border-box !important;
  }

  /* Le immagini restano centrate nella stessa altezza. */
  #aiMobileBottomNavV45 .ai-v45-bottom-link img {
    max-height:30px !important;
    width:auto !important;
    height:auto !important;
    margin:auto !important;
  }

  /* "Quadri" un po' più larga, senza modificare il pulsante. */
  #aiMobileBottomNavV45 .ai-v45-quadri img {
    transform:scaleX(1.12) !important;
    transform-origin:center center !important;
    max-width:90% !important;
  }

  /* ---------------------------------------------------------
     GALLERIA + QUADRI:
     ancora più leggibili SENZA box.
     Bianco pieno + contorno scuro + alone nero più profondo.
     --------------------------------------------------------- */
  body.ai-gallery-page .ai-top-note-text,
  body.ai-quadri-page .ai-top-note-text,
  body.ai-gallery-page .ai-top-note-text *,
  body.ai-quadri-page .ai-top-note-text * {
    color:#fff !important;
    -webkit-text-fill-color:#fff !important;
    font-family:'Segoe Print' !important;
    font-weight:600 !important;

    -webkit-text-stroke:.55px rgba(0,0,0,1) !important;

    text-shadow:
      -1.5px -1.5px 1px #000,
       1.5px -1.5px 1px #000,
      -1.5px  1.5px 1px #000,
       1.5px  1.5px 1px #000,
       0 0 3px #000,
       0 0 6px #000,
       0 0 10px #000,
       0 0 16px rgba(0,0,0,1),
       0 0 24px rgba(0,0,0,.88) !important;
  }

  body.ai-gallery-page .ai-top-note-link,
  body.ai-gallery-page .ai-top-note-link *,
  body.ai-quadri-page .ai-top-note-link,
  body.ai-quadri-page .ai-top-note-link * {
    color:#ff2418 !important;
    -webkit-text-fill-color:#ff2418 !important;
    font-weight:600 !important;

    -webkit-text-stroke:.48px rgba(0,0,0,1) !important;

    text-shadow:
      -1.4px -1.4px 1px #000,
       1.4px -1.4px 1px #000,
      -1.4px  1.4px 1px #000,
       1.4px  1.4px 1px #000,
       0 0 4px #000,
       0 0 8px #000,
       0 0 14px #000,
       0 0 20px rgba(0,0,0,.92) !important;
  }
}

@media screen and (max-width:360px) {
  body.ai-home-page #imPage {
    padding-top:225px !important;
    padding-bottom:112px !important;
  }

  body.ai-home-page #aiMobileHomeSlideshow.ai-mobile-home-active {
    margin-top:40px !important;
    max-height:calc(100dvh - 225px - 156px) !important;
  }

  #aiMobileBottomNavV45 {
    grid-template-rows:44px 44px !important;
  }

  #aiMobileBottomNavV45 .ai-v45-bottom-link,
  #aiMobileBottomNavV45 .ai-v45-home,
  #aiMobileBottomNavV45 .ai-v45-galleria,
  #aiMobileBottomNavV45 .ai-v45-quadri,
  #aiMobileBottomNavV45 .ai-v45-acquisti,
  #aiMobileBottomNavV45 .ai-v45-contatti {
    height:44px !important;
    min-height:44px !important;
    max-height:44px !important;
  }
}