/* Stable media frames and one coordinated controller for each animation. */
.product-section .grid { align-items: stretch; }
.product-section .grid[data-loading="true"] { min-height: 450px; }
.product-section .grid > .card { display: flex; flex-direction: column; height: 100%; }
.card > .card-meta { display: flex; flex-direction: column; flex: 1 1 auto; min-height: 0; }
.card > .card-image-wrapper, .card > .card-meta > * { flex-shrink: 0; }
.card > .card-meta > .product-description { margin-bottom: auto; padding-bottom: 22px; }
.card > .card-meta > .action-row { margin-top: 0; }
.card .card-image-wrapper, .card .card-image-container { background: #ffffff; }
.card .product-photo-switch { position: relative; aspect-ratio: 1; width: 100%; height: auto; }
.card .product-photo-switch > .card-img-premium {
    position: absolute; inset: 0; width: 100%; height: 100%; max-height: none;
    object-fit: contain; margin: 0;
}
.card .product-photo-primary[data-loading="1"] { visibility: hidden; }
.card .card-image-wrapper > img[hidden] { display: none !important; }
.card .product-photo-switch > .image-fallback {
    position: absolute; inset: 0; display: grid; place-items: center; padding: 16px;
}
.main-banner-video {
    display: block; width: 100%; height: auto;
    aspect-ratio: auto var(--banner-ratio, 16 / 9); object-fit: contain;
}
html .product-section .grid > .card {
    animation: none !important; animation-timeline: auto !important; opacity: 1;
}
html.motion-ready .product-section {
    transition: opacity .45s ease .08s, transform .6s cubic-bezier(.22,.8,.25,1) .08s;
}
html.motion-ready .product-section:not(.section-visible) { opacity: 0; transform: translate3d(0,32px,0); }
html.motion-ready .product-section.section-visible { opacity: 1; transform: none; }
html.motion-ready .product-section.section-visible .grid > .card {
    animation: performance-card-in .35s ease both !important;
    animation-timeline: auto !important;
}
html.motion-ready .product-section.section-visible .grid > .card:nth-child(2) { animation-delay: .06s !important; }
html.motion-ready .product-section.section-visible .grid > .card:nth-child(n+3) { animation-delay: .12s !important; }
@keyframes performance-card-in { from { opacity: 0; } to { opacity: 1; } }
@media (hover: hover) and (pointer: fine) {
    .product-section .card { transition: transform .23s ease, border-color .23s ease; }
    .product-section .card:hover, html:not([data-shop-input-mode="pointer"]) .product-section .card:focus-within {
        transform: translateY(-5px); box-shadow: 0 14px 32px rgba(48,27,39,.11);
    }
    .card .product-photo-switch > .product-photo-primary,
    .card .product-photo-switch > .product-photo-secondary {
        transition: opacity .3s ease, transform .35s cubic-bezier(.2,.7,.2,1);
    }
}
@media (max-width: 820px) {
    .navbar { backdrop-filter: none; -webkit-backdrop-filter: none; background: rgba(255,255,255,.98); }
}
@media (prefers-reduced-motion: reduce) {
    html.motion-ready .product-section, html.motion-ready .product-section:not(.section-visible) {
        opacity: 1 !important; transform: none !important; transition: none !important;
    }
    html .product-section .grid > .card,
    html.motion-ready .product-section.section-visible .grid > .card {
        animation: none !important; opacity: 1 !important; transform: none !important;
    }
}
/* BEGIN MEDIA RATIO */
:root { --banner-ratio: 631 / 344; }
/* END MEDIA RATIO */

/* independent product card heights */
html .product-section .grid {
    align-items: start;
}
html .product-section .grid > .catalog-family-slot {
    align-self: start;
    height: auto;
    min-height: 0;
}
html .product-section .grid > .card,
html .product-section .grid > .catalog-family-slot > .card {
    align-self: start;
    height: auto;
    min-height: 0;
    flex: 0 0 auto;
}
/* end independent product card heights */