/* Core Web Vitals / CLS stabilization
   Keep critical geometry stable before images, fonts and Owl Carousel finish loading. */

html { overflow-y: scroll; }

/* Header logo: reserve a stable box. HTML width/height provide intrinsic ratio. */
.logoheader {
  width: 240px;
  height: auto;
  max-width: 100%;
  aspect-ratio: 3 / 1;
  object-fit: contain;
}

/* Main hero keeps its 1185x400 geometry before Owl initialization. */
.slider.main,
.owl-slider,
.owl-slider .owl-stage-outer,
.owl-slider .item {
  width: 100%;
}
.owl-slider .item { aspect-ratio: 1185 / 400; }
.owl-slider .sliderimg {
  display: block;
  width: 100%;
  height: auto;
  aspect-ratio: 1185 / 400;
  object-fit: cover;
}

/* Prevent the uninitialized carousel from stacking every slide vertically. */
.owl-slider:not(.owl-loaded) > .item:not(:first-child) { display: none; }
.owl-slider:not(.owl-loaded) > .item:first-child { display: block; }

/* Generated product thumbnails are 300x200; reserve that ratio before decoding. */
.img-pro-wnd { aspect-ratio: 3 / 2; }
.img-pro-wnd > img,
.img-pro-wnd img {
  aspect-ratio: 3 / 2;
  width: 100%;
  height: 100% !important;
  object-fit: contain;
}

/* Lazy images should occupy their declared/inherited box before lozad swaps data-src. */
img.lozad { display: block; }

/* Keep card rows stable while carousel JS initializes. */
.owl-wnd:not(.owl-loaded),
.owl-newest:not(.owl-loaded),
.owl-send:not(.owl-loaded) {
  min-height: 1px;
}

/* Avoid layout-affecting transitions on the sticky header. */
.c-header.js-header {
  transform: translateZ(0);
}

@media (max-width: 991.98px) {
  .logoheader { width: 180px; }
}

/* DebugBear scroll CLS fix: keep sticky header in flow. */
@media (min-width: 768px) {
  .c-header.js-header,
  .c-header.js-header.fixed {
    position: -webkit-sticky !important;
    position: sticky !important;
    top: -75px !important;
    right: auto !important;
    width: 100% !important;
    -webkit-transform: none !important;
    transform: none !important;
    transition: none !important;
    z-index: 10;
    background-color: #fff;
  }
}