/* =====================================================================
   ART IMAGE — V48
   Mobile:
   - scritte superiori centrate e leggibili SENZA box nero
   - Home: logo -1/8 rispetto alla v47, fondo nero sfumato nello sfondo
   - Home: sfondo abbassato e animazione leggermente rialzata
   - menu: striscia continua vetro nero + pulsanti ancora più lucidi
   ===================================================================== */

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

  /* ---------------------------------------------------------
     HOME: sfondo abbassato SOLO qui.
     Il nero del logo si fonde gradualmente nell'immagine.
     --------------------------------------------------------- */
  body.ai-home-page {
    background-color:#000 !important;
    background-image:url('responsive-bg.jpg') !important;
    background-repeat:no-repeat !important;
    background-position:center 215px !important;
    background-size:cover !important;
    background-attachment:fixed !important;
  }

  body.ai-home-page #aiMobileBrandV45 {
    height:clamp(238px, 55vw, 280px) !important;
    background:
      linear-gradient(
        to bottom,
        #000 0%,
        #000 55%,
        rgba(0,0,0,.98) 67%,
        rgba(0,0,0,.80) 79%,
        rgba(0,0,0,.42) 90%,
        rgba(0,0,0,0) 100%
      ) !important;
    overflow:visible !important;
  }

  /* circa 1/8 più piccolo rispetto alla v47 */
  body.ai-home-page #aiMobileBrandV45 img {
    width:clamp(244px, 56.5vw, 287px) !important;
    top:0 !important;
  }

  body.ai-home-page #aiMobileBrandV45::after {
    display:none !important;
  }

  /* Animazione un po' più in alto rispetto alla v47,
     ma mantiene aria sotto al logo. */
  body.ai-home-page #aiMobileHomeSlideshow.ai-mobile-home-active {
    margin-top:clamp(64px, 14.5vw, 84px) !important;
    margin-bottom:10px !important;
  }

  /* ---------------------------------------------------------
     SCRITTE SUPERIORI: CENTRATE, SENZA BOX.
     Mantengo Segoe Print, bianco + link rosso.
     La leggibilità viene da contorno e alone scuro diffuso.
     --------------------------------------------------------- */
  body.ai-gallery-page .ai-note-toolbar,
  body.ai-quadri-page .ai-note-toolbar {
    display:flex !important;
    justify-content:center !important;
    align-items:flex-start !important;
    width:100% !important;
    max-width:100% !important;
    margin:0 !important;
    padding:8px 10px 7px !important;
    box-sizing:border-box !important;
  }

  body.ai-gallery-page .ai-top-note-column,
  body.ai-quadri-page .ai-top-note-column {
    width:100% !important;
    max-width:100% !important;
    margin:0 auto !important;
    padding:0 !important;
    text-align:center !important;
  }

  body.ai-gallery-page .ai-top-note-text,
  body.ai-quadri-page .ai-top-note-text {
    display:block !important;
    width:100% !important;
    max-width:100% !important;
    margin:0 auto !important;
    padding:0 !important;
    border:0 !important;
    border-radius:0 !important;
    background:none !important;
    box-shadow:none !important;
    text-align:center !important;
    color:#fff !important;
    -webkit-text-fill-color:#fff !important;
    font-family:'Segoe Print' !important;
    font-size:clamp(14px, 3.8vw, 18px) !important;
    line-height:1.42 !important;
    font-weight:400 !important;
    -webkit-text-stroke:.32px rgba(0,0,0,.95) !important;
    text-shadow:
      -1px -1px 1px rgba(0,0,0,1),
       1px -1px 1px rgba(0,0,0,1),
      -1px  1px 1px rgba(0,0,0,1),
       1px  1px 1px rgba(0,0,0,1),
       0 0 4px rgba(0,0,0,1),
       0 0 8px rgba(0,0,0,.95),
       0 0 14px rgba(0,0,0,.72) !important;
  }

  body.ai-gallery-page .ai-top-note-text *,
  body.ai-quadri-page .ai-top-note-text * {
    font-family:'Segoe Print' !important;
    font-size:inherit !important;
    line-height:inherit !important;
    text-align:center !important;
  }

  body.ai-gallery-page .ai-top-note-link,
  body.ai-quadri-page .ai-top-note-link,
  body.ai-gallery-page .ai-top-note-link *,
  body.ai-quadri-page .ai-top-note-link * {
    color:#ff2418 !important;
    -webkit-text-fill-color:#ff2418 !important;
    white-space:nowrap !important;
    text-shadow:
      -1px -1px 1px #000,
       1px -1px 1px #000,
      -1px  1px 1px #000,
       1px  1px 1px #000,
       0 0 5px #000,
       0 0 10px rgba(0,0,0,.95),
       0 0 15px rgba(0,0,0,.72) !important;
  }

  /* Acquisti: stessa logica, sempre centrata, niente box. */
  body.ai-shop-page .ai-order-note-text {
    display:block !important;
    width:100% !important;
    max-width:100% !important;
    margin:12px auto 16px !important;
    padding:0 10px !important;
    box-sizing:border-box !important;
    border:0 !important;
    border-radius:0 !important;
    background:none !important;
    box-shadow:none !important;
    text-align:center !important;
    color:#fff !important;
    -webkit-text-fill-color:#fff !important;
    font-family:'Segoe Print' !important;
    font-size:clamp(16px, 4.2vw, 20px) !important;
    line-height:1.42 !important;
    font-weight:400 !important;
    -webkit-text-stroke:.32px rgba(0,0,0,.96) !important;
    text-shadow:
      -1px -1px 1px #000,
       1px -1px 1px #000,
      -1px  1px 1px #000,
       1px  1px 1px #000,
       0 0 5px #000,
       0 0 9px rgba(0,0,0,.96),
       0 0 15px rgba(0,0,0,.72) !important;
  }

  body.ai-shop-page .ai-order-note-text *,
  body.ai-shop-page .ai-order-note-link {
    font-family:'Segoe Print' !important;
    font-size:inherit !important;
    text-align:center !important;
  }

  body.ai-shop-page .ai-order-note-link {
    color:#ff2418 !important;
    -webkit-text-fill-color:#ff2418 !important;
    text-shadow:
      -1px -1px 1px #000,
       1px -1px 1px #000,
      -1px  1px 1px #000,
       1px  1px 1px #000,
       0 0 5px #000,
       0 0 10px #000 !important;
  }

  /* ---------------------------------------------------------
     MENU: striscia continua nera/vetro, niente "box dietro".
     Pulsanti ancora più lucidi.
     --------------------------------------------------------- */
  #aiMobileBottomNavV45 {
    left:0 !important;
    right:0 !important;
    width:auto !important;
    max-width:none !important;
    min-width:0 !important;
    border-radius:0 !important;
    border:0 !important;
    border-top:1px solid rgba(255,255,255,.16) !important;
    overflow:hidden !important;
    background:
      linear-gradient(
        180deg,
        rgba(34,34,38,.82) 0%,
        rgba(9,9,12,.96) 34%,
        rgba(0,0,0,.995) 100%
      ) !important;
    box-shadow:
      0 -8px 22px rgba(0,0,0,.66),
      inset 0 1px 0 rgba(255,255,255,.13) !important;
    backdrop-filter:blur(15px) saturate(130%) !important;
    -webkit-backdrop-filter:blur(15px) saturate(130%) !important;
    padding-left:8px !important;
    padding-right:8px !important;
  }

  #aiMobileBottomNavV45 .ai-v45-bottom-link {
    border:1px solid rgba(255,255,255,.28) !important;
    border-radius:14px !important;
    background:
      linear-gradient(
        180deg,
        rgba(75,75,82,.84) 0%,
        rgba(33,33,38,.90) 24%,
        rgba(9,9,12,.97) 63%,
        rgba(0,0,0,1) 100%
      ) !important;
    box-shadow:
      inset 0 1px 0 rgba(255,255,255,.46),
      inset 0 3px 8px rgba(255,255,255,.11),
      inset 0 -2px 5px rgba(0,0,0,.85),
      0 3px 8px rgba(0,0,0,.58) !important;
  }

  #aiMobileBottomNavV45 .ai-v45-bottom-link::before {
    left:7px !important;
    right:7px !important;
    top:3px !important;
    height:46% !important;
    border-radius:11px 11px 50% 50% / 10px 10px 42% 42% !important;
    background:
      linear-gradient(
        180deg,
        rgba(255,255,255,.33) 0%,
        rgba(255,255,255,.13) 48%,
        rgba(255,255,255,.03) 78%,
        rgba(255,255,255,0) 100%
      ) !important;
  }

  /* Lingua mobile: resta solo testo + freccia, senza bordi. */
  body .ai-language-picker-mobile,
  body .ai-language-picker-mobile .ai-language-select {
    border:0 !important;
    box-shadow:none !important;
    background:transparent !important;
  }
}

@media screen and (max-width:360px) {
  body.ai-home-page #aiMobileBrandV45 {
    height:225px !important;
  }

  body.ai-home-page #aiMobileBrandV45 img {
    width:238px !important;
  }

  body.ai-home-page #aiMobileHomeSlideshow.ai-mobile-home-active {
    margin-top:54px !important;
  }
}