/* Reserve carousel geometry before deferred Swiper initialization.
   Counts/gaps mirror main.js and are checked by tests/js/layout-reservation.test.cjs. */
.swiper:is(.main-slider, .second-slider, .model-slider, .channel-slider, .home-shorts-slider, .cam-slider, .cam-slider-ntv) {
    display: block;
}
.swiper {
    --layout-slides: 1;
    --layout-gap: 20px;
}
.main-slider, .cam-slider { --layout-slides: 1.35; }
.second-slider, .model-slider, .channel-slider { --layout-slides: 2.25; --layout-gap: 10px; }
.home-shorts-slider { --layout-slides: 1.75; --layout-gap: 12px; }
@media (min-width: 568px) {
    .main-slider, .cam-slider { --layout-slides: 1.75; }
    .home-shorts-slider { --layout-slides: 2.75; --layout-gap: 16px; }
}
@media (min-width: 768px) {
    .main-slider, .cam-slider { --layout-slides: 2; }
    .second-slider { --layout-slides: 3; --layout-gap: 20px; }
    .channel-slider { --layout-slides: 4.25; }
    .home-shorts-slider { --layout-slides: 3.25; --layout-gap: 20px; }
}
@media (min-width: 1024px) {
    .main-slider, .cam-slider { --layout-slides: 3; }
    .second-slider { --layout-slides: 4; }
    .model-slider { --layout-slides: 3.25; }
    .channel-slider { --layout-slides: 6.25; }
    .home-shorts-slider { --layout-slides: 4.25; }
}
@media (min-width: 1160px) {
    .main-slider, .cam-slider { --layout-slides: 4; }
    .second-slider { --layout-slides: 6; }
    .model-slider { --layout-slides: 5.25; }
    .channel-slider { --layout-slides: 8.25; }
}
@media (min-width: 1280px) {
    .main-slider { --layout-slides: 5; }
    .second-slider { --layout-slides: 8; }
    .model-slider { --layout-slides: 6.25; }
    .channel-slider { --layout-slides: 10.25; }
    .home-shorts-slider { --layout-slides: 5.25; }
}
.swiper:is(.main-slider, .second-slider, .model-slider, .channel-slider, .home-shorts-slider, .cam-slider, .cam-slider-ntv) > .swiper-wrapper {
    height: auto;
    align-items: stretch;
}
.swiper:is(.main-slider, .second-slider, .model-slider, .channel-slider, .home-shorts-slider, .cam-slider, .cam-slider-ntv) > .swiper-wrapper > .swiper-slide {
    height: auto;
}
.swiper:is(.main-slider, .second-slider, .model-slider, .channel-slider, .home-shorts-slider, .cam-slider, .cam-slider-ntv):not(.swiper-initialized) > .swiper-wrapper > .swiper-slide {
    width: calc((100% - (var(--layout-slides) - 1) * var(--layout-gap)) / var(--layout-slides));
    margin-right: var(--layout-gap);
}

/* Explicit frame ratios work even when images are slow or unavailable. */
.swiper.model-slider .swiper-slide .item .card-slider { padding-bottom: 0; aspect-ratio: 2 / 3; }
.swiper.channel-slider .swiper-slide .item .card-slider { padding-bottom: 0; aspect-ratio: 1 / 1; }
.swiper:is(.main-slider, .second-slider, .cam-slider, .cam-slider-ntv) .card-slider { padding-bottom: 0; aspect-ratio: 16 / 9; }
.home-shorts__card .media { height: 0; padding-bottom: 100%; }

/* Product photos can vary in orientation. Contain them in one stable frame,
   including when a visitor switches the gallery thumbnail. */
.product-image-main { aspect-ratio: 1 / 1; object-fit: contain; }
.cam-lazy { position: relative; }
.cam-lazy .cam-preview { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
#recent-videos-container { min-height: 60vh; }
.recent-updates { min-height: 48px; display: flex; align-items: center; gap: 12px; margin-bottom: 12px; }
.recent-updates button { cursor: pointer; padding: 8px 14px; border-radius: 6px; }