/* Image-only collection. Native scrolling remains usable when JavaScript is unavailable. */
.brand-experience .brand-showcase {
    --gallery-slide-width:72%;
    --gallery-gap:clamp(20px,2.5vw,48px);
    --gallery-top:72px;
    position:relative;
    padding:var(--gallery-top) 0 26px;
    background:#fafaf8;
    overflow:hidden;
}
.brand-experience .brand-showcase [hidden] { display:none !important; }
.brand-experience .brand-showcase-viewport {
    width:100%;
    overflow-x:auto;
    overflow-y:hidden;
    scroll-snap-type:x mandatory;
    scroll-padding-inline:14%;
    scrollbar-width:thin;
    scrollbar-color:#aebfba transparent;
    overscroll-behavior-x:contain;
}
.brand-experience .brand-showcase-track {
    position:relative;
    display:flex;
    align-items:center;
    width:100%;
    gap:var(--gallery-gap);
    padding:0 14%;
}
.brand-experience .brand-showcase-slide {
    position:relative;
    flex:0 0 100%;
    min-width:0;
    scroll-snap-align:center;
}
.brand-experience .brand-showcase-visual {
    position:relative;
    width:100%;
    aspect-ratio:16 / 9;
    overflow:hidden;
    background:#f1f0ec;
}
.brand-experience .brand-showcase-image-link { display:block; width:100%; height:100%; }
.brand-experience .brand-showcase-visual img {
    display:block;
    width:100%;
    height:100%;
    object-fit:contain;
    user-select:none;
    -webkit-user-drag:none;
}
.brand-experience .brand-showcase-fallback {
    position:absolute;
    inset:0;
    display:grid;
    place-items:center;
    background:#f1f0ec;
}
.brand-experience .brand-showcase-fallback svg { width:48px; height:48px; stroke:#7b9188; stroke-width:1; }
.brand-experience .is-gallery-enhanced .brand-showcase-viewport {
    overflow:hidden;
    scroll-snap-type:none;
    touch-action:pan-y pinch-zoom;
    cursor:grab;
}
.brand-experience .is-gallery-enhanced .brand-showcase-track {
    padding:0;
    transition:transform 700ms cubic-bezier(.22,.7,.2,1);
}
.brand-experience .is-gallery-enhanced .brand-showcase-slide { flex-basis:var(--gallery-slide-width); }
.brand-experience .is-gallery-enhanced .brand-showcase-visual {
    transform:scale(.94);
    opacity:.78;
    transition:transform 700ms cubic-bezier(.22,.7,.2,1),opacity 700ms ease;
}
.brand-experience .is-gallery-enhanced .is-active .brand-showcase-visual { transform:scale(1); opacity:1; }
.brand-experience .is-gallery-enhanced .brand-showcase-visual img { transform:scale(1.24); transition:transform 700ms cubic-bezier(.22,.7,.2,1); }
.brand-experience .is-gallery-enhanced .is-active .brand-showcase-visual img { transform:scale(1); }
.brand-experience .is-gallery-resetting .brand-showcase-track,
.brand-experience .is-gallery-resetting .brand-showcase-visual,
.brand-experience .is-gallery-resetting .brand-showcase-visual img,
.brand-experience .is-gallery-dragging .brand-showcase-track,
.brand-experience .is-gallery-dragging .brand-showcase-visual { transition:none; }
.brand-experience .is-gallery-dragging .brand-showcase-viewport { cursor:grabbing; }
.brand-experience .brand-showcase-controls { display:flex; justify-content:center; align-items:center; min-height:64px; margin-top:16px; padding:0 80px; }
.brand-experience .brand-showcase-nav,
.brand-experience .brand-showcase-pause {
    display:grid;
    place-items:center;
    width:44px;
    height:44px;
    padding:10px;
    border:1px solid #9eaba6;
    border-radius:50%;
    background:rgb(250 250 248 / .94);
    color:#234c44;
    cursor:pointer;
    transition:background .2s,border-color .2s;
}
.brand-experience .brand-showcase-nav {
    position:absolute;
    z-index:2;
    top:calc(var(--gallery-top) + var(--gallery-image-height, 0px) / 2);
    transform:translate(-50%,-50%);
}
.brand-experience .brand-showcase-prev { left:calc(14% - var(--gallery-gap) / 2); }
.brand-experience .brand-showcase-next { left:calc(86% + var(--gallery-gap) / 2); }
.brand-experience .brand-showcase-pause { position:absolute; right:clamp(20px,4.5vw,80px); bottom:36px; }
.brand-experience .brand-showcase-nav svg,
.brand-experience .brand-showcase-pause svg { width:22px; height:22px; fill:none; stroke:currentColor; stroke-width:1.6; stroke-linecap:round; stroke-linejoin:round; }
.brand-experience .brand-showcase-pause [data-icon-play] { fill:currentColor; stroke-width:1; }
.brand-experience .brand-showcase-dots { display:flex; justify-content:center; flex-wrap:wrap; gap:0 2px; max-width:600px; }
.brand-experience .brand-showcase-dot { display:grid; place-items:center; width:32px; height:44px; padding:0; border:0; background:transparent; cursor:pointer; }
.brand-experience .brand-showcase-dot span { display:block; width:7px; height:7px; border-radius:20px; background:#b0b9b5; transition:width .35s,background .35s; }
.brand-experience .brand-showcase-dot[aria-pressed="true"] span { width:28px; background:#24554e; }
.brand-experience .brand-showcase button:focus-visible,
.brand-experience .brand-showcase-image-link:focus-visible { outline:2px solid #26786d; outline-offset:3px; }
.brand-experience .brand-showcase-viewport:focus-visible { outline:2px solid #26786d; outline-offset:-3px; }
.brand-experience .is-single .brand-showcase-viewport { overflow:hidden; cursor:default; }
.brand-experience .is-single .brand-showcase-track { justify-content:center; padding:0; transform:none !important; }
.brand-experience .is-single .brand-showcase-slide { flex:0 0 var(--gallery-slide-width); }
.brand-experience .is-single .brand-showcase-visual { transform:none; opacity:1; }
@media (hover:hover) and (pointer:fine) {
    .brand-experience .brand-showcase-nav:hover,
    .brand-experience .brand-showcase-pause:hover { background:#fff; border-color:#315c50; }
}
@media (max-width:991px) {
    .brand-experience .brand-showcase { --gallery-top:52px; --gallery-gap:22px; }
    .brand-experience .brand-showcase-nav { width:40px; height:40px; padding:8px; }
}
@media (max-width:767px) {
    .brand-experience .brand-showcase { --gallery-slide-width:100%; --gallery-gap:16px; --gallery-top:36px; padding-bottom:18px; }
    .brand-experience .brand-showcase-viewport { width:calc(100% - 32px); margin-inline:16px; scroll-padding-inline:0; }
    .brand-experience .brand-showcase-track { padding:0; }
    .brand-experience .brand-showcase-slide { flex-basis:100%; }
    .brand-experience .brand-showcase-visual { aspect-ratio:4 / 3; }
    .brand-experience .brand-showcase-controls { margin-top:12px; padding:0 56px; min-height:56px; }
    .brand-experience .brand-showcase-nav { width:36px; height:44px; border:0; border-radius:2px; background:rgb(250 250 248 / .78); padding:8px; }
    .brand-experience .brand-showcase-prev { left:34px; }
    .brand-experience .brand-showcase-next { left:calc(100% - 34px); }
    .brand-experience .brand-showcase-pause { width:36px; height:36px; padding:7px; right:16px; bottom:28px; }
    .brand-experience .brand-showcase-dot { width:28px; }
    .brand-experience .brand-showcase-dot[aria-pressed="true"] span { width:23px; }
}
.brand-experience.is-motion-paused .brand-showcase *,
.brand-experience.is-experience-paused .brand-showcase * { transition:none !important; }
@media (prefers-reduced-motion:reduce) {
    .brand-experience .brand-showcase * { transition:none !important; scroll-behavior:auto !important; }
}
