/* Geometry must be available before images and carousel JavaScript load. */
.navbar-brand img[src$="/logo_2021.png"] {
  width: 142px;
  height: 41px;
}

/* Catalog thumbnails are rendered in a consistent 4:3 image box. */
img[src*="/photos/cat_thumbs/"] {
  aspect-ratio: 4 / 3;
  object-fit: contain;
}

/* Keep differently shaped product photos inside a stable gallery box. */
.main-prod-img {
  width: 100%;
  aspect-ratio: 4 / 3;
  object-fit: contain;
}
.prod_thumb_inside[src*="/photos/sys_thumbs/"],
.prod_thumb_inside[src*="/photos/bundle_thumbs/"] {
  width: 84px;
  height: 66px;
  object-fit: contain;
}

/* Reserve both the banner and navigation row, even before Tiny Slider starts. */
.home-banner-grid .tns-carousel:not(.tns-carousel-inner) {
  --banner-ratio: 1170 / 612;
  padding-bottom: 46px;
}
#homeCarouselTop { --banner-ratio: 1200 / 325; }
.home-banner-grid .tns-carousel:not(.tns-carousel-inner)::before {
  content: "";
  display: block;
  aspect-ratio: var(--banner-ratio);
}
.home-banner-grid .tns-carousel:not(.tns-carousel-inner) > .tns-carousel-inner,
.home-banner-grid .tns-carousel:not(.tns-carousel-inner) > .tns-outer {
  position: absolute;
  inset: 0;
}
.home-banner-grid .tns-carousel-inner:not(.tns-slider) > a {
  flex: 0 0 100%;
}
.home-banner-grid .tns-carousel-inner img {
  display: block;
  width: 100%;
  aspect-ratio: var(--banner-ratio);
  object-fit: contain;
}
.home-banner-grid .tns-carousel:not(.tns-carousel-inner) .tns-nav {
  height: 46px;
  white-space: nowrap;
}

/* Animate the floating button without animating layout coordinates. */
.btn-scroll-top {
  right: 1.25rem;
  transform: translateX(5rem);
  transition: transform .25s ease-in-out, opacity .25s ease-in-out;
}
.btn-scroll-top.show { transform: translateX(0); }
.navbar-sticky-spacer { flex: none; overflow-anchor: none; }
@media print { .navbar-sticky-spacer { display: none !important; } }
