/* Misting Istanbul V91 - Slider + Fan CTA Responsive UX Final - 2026-08-08 */

/* HOME SLIDER
   Mobile/tablet use a stable viewport ratio instead of fixed/clamped heights.
   This prevents stretching, black bands and inconsistent slide heights. */
@media (max-width: 991px){
  .mi-home .mi-image-slider,
  .mi-home .mi-slider-viewport,
  .mi-home .mi-slider-track{
    width:100%!important;
    min-height:0!important;
    height:auto!important;
    background:#061d2b!important;
  }
  .mi-home .mi-slider-viewport,
  .mi-home .mi-slider-track{
    aspect-ratio:16 / 6.35!important;
  }
  .mi-home .mi-slider-slide,
  .mi-home .mi-slider-slide>a,
  .mi-home .mi-slider-slide picture{
    width:100%!important;
    height:100%!important;
    min-height:0!important;
  }
  .mi-home .mi-slider-slide img{
    display:block!important;
    width:100%!important;
    height:100%!important;
    min-height:0!important;
    max-height:none!important;
    aspect-ratio:auto!important;
    object-fit:cover!important;
    object-position:center center!important;
    background:#061d2b!important;
    transform:none!important;
  }
  .mi-home .mi-slider-bottom{display:none!important}
  .mi-home .mi-slider-arrow{
    width:40px!important;height:40px!important;
    font-size:29px!important;
    backdrop-filter:none!important;-webkit-backdrop-filter:none!important;
  }
}

/* Phone: slightly taller visual field for legibility/touch UX. */
@media (max-width: 576px){
  .mi-home .mi-slider-viewport,
  .mi-home .mi-slider-track{aspect-ratio:16 / 7.15!important}
  .mi-home .mi-slider-slide img{object-position:center center!important}
  .mi-home .mi-slider-arrow{width:36px!important;height:36px!important;font-size:26px!important}
  .mi-home .mi-slider-prev{left:8px!important}
  .mi-home .mi-slider-next{right:8px!important}
}

@media (max-width: 390px){
  .mi-home .mi-slider-viewport,
  .mi-home .mi-slider-track{aspect-ratio:16 / 7.45!important}
  .mi-home .mi-slider-arrow{width:34px!important;height:34px!important;font-size:24px!important}
}

/* FAN PRODUCT GROUP CTA
   Keep supplied product photography fully inside its frame on every viewport.
   No image is allowed to overflow or be cropped by object-fit:cover. */
.mi-home .mi-fan-card-v21{overflow:hidden!important}
.mi-home .mi-fan-card-media-v21{
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  width:100%!important;
  aspect-ratio:4 / 3!important;
  min-height:0!important;
  padding:12px!important;
  box-sizing:border-box!important;
  overflow:hidden!important;
  background:linear-gradient(180deg,#edf8fc 0%,#e6f2f8 100%)!important;
}
.mi-home .mi-fan-card-media-v21 img{
  display:block!important;
  width:100%!important;
  height:100%!important;
  max-width:100%!important;
  max-height:100%!important;
  object-fit:contain!important;
  object-position:center center!important;
  transform:none!important;
  transition:opacity .22s ease!important;
}
.mi-home .mi-fan-card-v21:hover .mi-fan-card-media-v21 img{
  transform:none!important;
  opacity:.98!important;
}

@media (max-width: 991px){
  .mi-home .mi-fan-card-media-v21{
    aspect-ratio:4 / 3!important;
    padding:10px!important;
  }
}
@media (max-width: 576px){
  .mi-home .mi-fan-card-media-v21{
    aspect-ratio:16 / 11!important;
    padding:8px!important;
  }
}

/* Prevent image/content seams and accidental overflow in the card shell. */
.mi-home .mi-fan-card-v21,
.mi-home .mi-fan-card-media-v21,
.mi-home .mi-fan-card-content-v21{min-width:0!important;max-width:100%!important;box-sizing:border-box!important}
