/* ART IMAGE v44 — final overrides loaded last */
html, body { overflow-x: hidden !important; }

/* Old menus are completely hidden. The only visible menu is V44. */
#imMnMn, #imMnMnGraphics, #aiMobileHeader { display:none !important; }

#aiUnifiedNavV44 { box-sizing:border-box !important; background:#000 !important; }
#aiUnifiedNavV44 .ai-v44-link { position:absolute !important; display:block !important; margin:0 !important; padding:0 !important; background:transparent !important; }
#aiUnifiedNavV44 .ai-v44-link img { display:block !important; width:100% !important; height:auto !important; max-width:none !important; margin:0 !important; padding:0 !important; }

/* ACTIVE ITEM: only color changes. Same exact PNG/canvas/position. */
body.ai-home-page #aiUnifiedNavV44 .ai-v44-home img,
body.ai-gallery-page #aiUnifiedNavV44 .ai-v44-galleria img,
body.ai-quadri-page #aiUnifiedNavV44 .ai-v44-quadri img,
body.ai-shop-page #aiUnifiedNavV44 .ai-v44-acquisti img,
body.ai-contact-page #aiUnifiedNavV44 .ai-v44-contatti img {
  filter: brightness(0) saturate(100%) invert(84%) sepia(97%) saturate(1750%) hue-rotate(1deg) brightness(102%) contrast(104%) !important;
}

/* =========================================================
   DESKTOP — all dimensions are viewport percentages.
   This makes the visible menu stay physically stable even if
   Chrome has a different zoom level for one local file.
   Reference visual size = the larger Quadri menu the user likes.
   ========================================================= */
@media screen and (min-width:821px) {
  #aiUnifiedNavV44 {
    position:fixed !important;
    z-index:20000 !important;
    top:0 !important;
    bottom:0 !important;
    left:3vw !important;
    width:9.45vw !important;
    min-width:0 !important;
    min-height:100vh !important;
    background-image:url('menu.png') !important;
    background-repeat:no-repeat !important;
    background-position:left top !important;
    background-size:100% auto !important;
    overflow:visible !important;
  }
  #aiUnifiedNavV44 .ai-v44-mobile-logo { display:none !important; }
  #aiUnifiedNavV44 .ai-v44-link { left:0 !important; width:100% !important; transform:none !important; }
  #aiUnifiedNavV44 .ai-v44-home     { top:13.85vw !important; }
  #aiUnifiedNavV44 .ai-v44-galleria { top:19.20vw !important; }
  #aiUnifiedNavV44 .ai-v44-quadri   { top:24.55vw !important; }
  #aiUnifiedNavV44 .ai-v44-acquisti { top:29.90vw !important; }
  #aiUnifiedNavV44 .ai-v44-contatti { top:35.25vw !important; }

  /* Original note style restored exactly: Segoe Print, 19/25px. */
  body.ai-gallery-page .ai-top-note-text,
  body.ai-gallery-page .ai-top-note-text .fs19,
  body.ai-quadri-page .ai-top-note-text,
  body.ai-quadri-page .ai-top-note-text .fs19 {
    font-family:'Segoe Print' !important;
    font-size:19px !important;
    line-height:25px !important;
    font-weight:400 !important;
    color:#fff !important;
  }

  /* The note stays pinned to the upper-right edge and shrinks leftwards. */
  body.ai-gallery-page .ai-top-toolbar,
  body.ai-quadri-page .ai-top-toolbar {
    display:flex !important;
    width:100% !important;
    max-width:100% !important;
    min-width:0 !important;
    box-sizing:border-box !important;
    align-items:flex-start !important;
    justify-content:flex-end !important;
    float:none !important;
    overflow:visible !important;
  }
  body.ai-gallery-page .ai-top-toolbar > div:first-child,
  body.ai-gallery-page .ai-top-toolbar > div:nth-child(2),
  body.ai-quadri-page .ai-top-toolbar > div:first-child,
  body.ai-quadri-page .ai-top-toolbar > div:nth-child(2) { display:none !important; }
  body.ai-gallery-page .ai-top-note-column,
  body.ai-quadri-page .ai-top-note-column {
    flex:0 1 auto !important;
    width:auto !important;
    max-width:calc(100% - 14px) !important;
    min-width:0 !important;
    margin:0 8px 0 auto !important;
    padding:4px 0 8px 8px !important;
    box-sizing:border-box !important;
    text-align:right !important;
    overflow:visible !important;
    float:none !important;
  }
  body.ai-gallery-page .ai-top-note-column > div,
  body.ai-gallery-page .ai-top-note-column [id^="imCellStyle_"],
  body.ai-gallery-page .ai-top-note-column [id^="imTextObject_"],
  body.ai-gallery-page .ai-top-note-column .text-tab-content,
  body.ai-gallery-page .ai-top-note-column .text-inner,
  body.ai-quadri-page .ai-top-note-column > div,
  body.ai-quadri-page .ai-top-note-column [id^="imCellStyle_"],
  body.ai-quadri-page .ai-top-note-column [id^="imTextObject_"],
  body.ai-quadri-page .ai-top-note-column .text-tab-content,
  body.ai-quadri-page .ai-top-note-column .text-inner {
    width:auto !important; max-width:100% !important; min-width:0 !important;
    box-sizing:border-box !important; overflow:visible !important; text-align:right !important;
  }
  body.ai-gallery-page .ai-top-note-text,
  body.ai-quadri-page .ai-top-note-text {
    display:block !important;
    width:auto !important;
    max-width:100% !important;
    min-width:0 !important;
    white-space:normal !important;
    overflow-wrap:normal !important;
    word-break:normal !important;
    text-align:right !important;
  }
  body.ai-gallery-page .ai-top-note-link,
  body.ai-quadri-page .ai-top-note-link {
    display:inline-block !important;
    white-space:nowrap !important;
    color:#d678d7 !important;
    text-decoration:underline !important;
    font-family:'Segoe Print' !important;
    font-size:19px !important;
    line-height:25px !important;
  }
}

/* =========================================================
   PHONE / VERTICAL TABLET — all geometry in vw, not px.
   Logo fixed; all five menu words use the lower Quadri layout.
   ========================================================= */
@media screen and (max-width:820px) {
  #imPage { width:100% !important; max-width:none !important; margin:0 !important; }
  #imContent, #imContentGraphics { width:100% !important; max-width:100% !important; margin-left:0 !important; box-sizing:border-box !important; }

  #aiUnifiedNavV44 {
    position:relative !important;
    z-index:20000 !important;
    width:100vw !important;
    height:73vw !important;
    max-height:none !important;
    margin:0 !important;
    padding:0 !important;
    overflow:visible !important;
  }
  #aiUnifiedNavV44 .ai-v44-mobile-logo {
    display:block !important;
    position:absolute !important;
    z-index:2 !important;
    top:.4vw !important;
    left:48.4% !important;
    width:47vw !important;
    height:auto !important;
    max-width:none !important;
    transform:translateX(-50%) !important;
  }
  #aiUnifiedNavV44 .ai-v44-link {
    z-index:5 !important;
    width:30vw !important;
    transform:translateX(-50%) !important;
  }
  #aiUnifiedNavV44 .ai-v44-home { left:18% !important; top:37vw !important; }
  #aiUnifiedNavV44 .ai-v44-contatti { left:82% !important; top:37vw !important; }
  #aiUnifiedNavV44 .ai-v44-galleria { left:31% !important; top:50vw !important; }
  #aiUnifiedNavV44 .ai-v44-acquisti { left:69% !important; top:50vw !important; }
  #aiUnifiedNavV44 .ai-v44-quadri { left:50% !important; top:62vw !important; }

  /* Home slideshow keeps the breathing room requested by the user. */
  body.ai-home-page #aiMobileHomeSlideshow.ai-mobile-home-active { margin-top:10vw !important; margin-bottom:6px !important; }

  body.ai-home-page .ai-home-top-row { position:relative !important; height:0 !important; min-height:0 !important; margin:0 !important; padding:0 !important; overflow:visible !important; z-index:35 !important; }
  body.ai-home-page .ai-home-top-row > .ai-home-top-col { height:0 !important; min-height:0 !important; margin:0 !important; padding:0 !important; overflow:visible !important; }
  body.ai-home-page .ai-home-top-row .ai-language-picker { position:absolute !important; top:1.5vw !important; left:1.5vw !important; margin:0 !important; z-index:60 !important; }

  /* Original mobile note typography/style restored. */
  body.ai-gallery-page .ai-top-note-text,
  body.ai-gallery-page .ai-top-note-text .fs19,
  body.ai-quadri-page .ai-top-note-text,
  body.ai-quadri-page .ai-top-note-text .fs19 {
    font-family:'Segoe Print' !important;
    font-size:clamp(11px,3.5vw,17px) !important;
    line-height:1.35 !important;
    font-weight:400 !important;
    color:#fff !important;
  }
  body.ai-gallery-page .ai-top-toolbar,
  body.ai-quadri-page .ai-top-toolbar {
    display:flex !important; width:100% !important; max-width:100% !important; min-width:0 !important;
    box-sizing:border-box !important; justify-content:flex-end !important; align-items:flex-start !important;
    float:none !important; overflow:visible !important; padding:1.2vw 1.8vw 1vw !important;
  }
  body.ai-gallery-page .ai-top-toolbar > div:first-child,
  body.ai-gallery-page .ai-top-toolbar > div:nth-child(2),
  body.ai-quadri-page .ai-top-toolbar > div:first-child,
  body.ai-quadri-page .ai-top-toolbar > div:nth-child(2) { display:none !important; }
  body.ai-gallery-page .ai-top-note-column,
  body.ai-quadri-page .ai-top-note-column {
    width:auto !important; max-width:100% !important; min-width:0 !important; margin:0 0 0 auto !important;
    padding:0 !important; text-align:right !important; float:none !important; box-sizing:border-box !important;
  }
  body.ai-gallery-page .ai-top-note-column > div,
  body.ai-gallery-page .ai-top-note-column [id^="imCellStyle_"],
  body.ai-gallery-page .ai-top-note-column [id^="imTextObject_"],
  body.ai-gallery-page .ai-top-note-column .text-tab-content,
  body.ai-gallery-page .ai-top-note-column .text-inner,
  body.ai-quadri-page .ai-top-note-column > div,
  body.ai-quadri-page .ai-top-note-column [id^="imCellStyle_"],
  body.ai-quadri-page .ai-top-note-column [id^="imTextObject_"],
  body.ai-quadri-page .ai-top-note-column .text-tab-content,
  body.ai-quadri-page .ai-top-note-column .text-inner { width:auto !important; max-width:100% !important; min-width:0 !important; overflow:visible !important; text-align:right !important; }
  body.ai-gallery-page .ai-top-note-text,
  body.ai-quadri-page .ai-top-note-text { display:block !important; width:auto !important; max-width:100% !important; white-space:normal !important; text-align:right !important; }
  body.ai-gallery-page .ai-top-note-text,
  body.ai-quadri-page .ai-top-note-text,
  body.ai-gallery-page .ai-top-note-text .fs19,
  body.ai-quadri-page .ai-top-note-text .fs19 {
    -webkit-text-fill-color:#ffffff !important;
    -webkit-text-stroke:.48px rgba(0,0,0,1) !important;
    text-shadow:-1px -1px 1px #000,1px -1px 1px #000,-1px 1px 1px #000,1px 1px 1px #000,0 0 4px #000,0 0 8px rgba(0,0,0,1),0 0 13px rgba(0,0,0,.94),0 0 20px rgba(0,0,0,.72) !important;
  }
  body.ai-gallery-page .ai-top-note-link,
  body.ai-quadri-page .ai-top-note-link {
    display:inline-block !important; white-space:nowrap !important; color:#ff2418 !important;
    -webkit-text-fill-color:#ff2418 !important;
    -webkit-text-stroke:.34px rgba(0,0,0,1) !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,.96) !important;
    text-decoration:underline !important; font-family:'Segoe Print' !important; font-size:inherit !important; line-height:inherit !important;
  }
}

/* =========================================================
   GALLERY / QUADRI PREVIEWS
   All items, including the first three, are in the same masonry.
   Force a uniform card width in every column.
   ========================================================= */
body.ai-gallery-page .ai-fluid-grid,
body.ai-quadri-page .ai-fluid-grid { width:100% !important; max-width:100% !important; box-sizing:border-box !important; }
body.ai-gallery-page .ai-masonry-column,
body.ai-quadri-page .ai-masonry-column { min-width:0 !important; }
body.ai-gallery-page .ai-masonry-column > .ai-grid-item,
body.ai-quadri-page .ai-masonry-column > .ai-grid-item,
body.ai-gallery-page .ai-masonry-column .ai-preview-frame,
body.ai-quadri-page .ai-masonry-column .ai-preview-frame { width:100% !important; max-width:none !important; box-sizing:border-box !important; }
body.ai-gallery-page .ai-masonry-column img.ai-hd-preview,
body.ai-quadri-page .ai-masonry-column img.ai-hd-preview { width:100% !important; max-width:none !important; height:auto !important; display:block !important; margin:0 auto !important; }
