.bag-explorer{overflow:hidden}.bag-explorer .heading{align-items:center;gap:24px}.bag-explorer h2{margin-bottom:12px}.bag-controls{display:flex;gap:8px}.bag-controls button,.bag-navigation button{font:inherit;font-size:14px;cursor:pointer;border:1px solid #b7c8c5;background:white;color:#173f3b;padding:12px 18px;border-radius:40px}.bag-controls button:disabled{opacity:.4;cursor:default}.bag-track{display:flex;gap:24px;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:thin;scrollbar-color:#779a90 #e8efeb;overscroll-behavior-x:contain;padding:12px 0 24px;touch-action:pan-x pan-y;cursor:grab}.bag-track:active{cursor:grabbing}.bag-slide{flex:0 0 100%;min-width:0;display:grid;grid-template-columns:1fr 1fr;gap:clamp(24px,5vw,80px);align-items:center;scroll-snap-align:center;border-top:3px solid var(--bag-color);padding:24px 32px;background:#fff}.bag-visual{position:relative;display:flex;justify-content:center;min-width:0}.bag-volume{position:absolute;top:10px;left:0;border:1px solid var(--bag-color);color:var(--bag-color);border-radius:50%;height:64px;width:64px;display:grid;place-items:center;font-size:18px;font-weight:700;z-index:1;background:#fff}.bag-window{width:min(100%,280px);aspect-ratio:1/1.8;background-image:var(--bag-source);background-repeat:no-repeat;transition:transform .65s cubic-bezier(.2,.7,.2,1)}.bag-window.trio{background-size:300% auto;background-position-y:50%}.bag-window.duo{background-size:264% auto;background-position-y:50%}.trio.bag-position-0{background-position-x:0%}.trio.bag-position-1{background-position-x:50%}.trio.bag-position-2{background-position-x:100%}.duo.bag-position-0{background-position-x:18%}.duo.bag-position-1{background-position-x:82%}.bag-slide.is-active .bag-window{transform:translateY(-6px) rotate(-2deg)}.bag-properties h3{font-size:clamp(28px,4vw,48px);line-height:1.1;color:var(--bag-color);margin:12px 0 20px}.bag-properties p{font-size:16px;line-height:1.6}.bag-properties dl{margin:24px 0 8px}.bag-properties dl div{display:flex;justify-content:space-between;gap:16px;padding:12px 0;border-bottom:1px solid #dde6e1}.bag-properties dt{font-size:16px}.bag-properties dd{font-size:16px;font-weight:700;margin:0;color:var(--bag-color)}.bag-properties .bag-note,.bag-properties .bag-basis{font-size:14px;color:#48635d}.bag-navigation{display:flex;gap:8px;flex-wrap:wrap;margin-top:20px}.bag-navigation button{border-left:5px solid var(--bag-color)}.bag-navigation button[aria-pressed=true]{background:var(--bag-color);color:#fff;border-color:var(--bag-color)}.bag-status{font-size:14px;color:#48635d}.bag-explorer.is-ready .bag-properties{opacity:.45;transform:translateY(14px);transition:opacity .45s,transform .45s}.bag-explorer.is-ready .is-active .bag-properties{opacity:1;transform:none}.bag-explorer button:focus-visible,.bag-track:focus-visible{outline:3px solid #143f3c;outline-offset:4px}@media(max-width:700px){.bag-explorer .heading{display:block}.bag-controls{margin-top:18px}.bag-slide{padding:16px;grid-template-columns:1fr;gap:4px}.bag-window{width:180px}.bag-volume{left:calc(50% - 145px);width:50px;height:50px}.bag-properties h3{font-size:30px;margin:8px 0 12px}.bag-properties dl{margin-top:12px}.bag-properties dl div{padding:8px 0}.bag-navigation button{padding:9px 12px}.bag-track{align-items:stretch}}@media(prefers-reduced-motion:reduce){.bag-window,.bag-properties{transition:none!important;transform:none!important;scroll-behavior:auto!important}}
.bag-window.open-bag{width:min(100%,320px);aspect-ratio:1/1.25;background-position-y:50%}.open-position-0{background-size:335% auto;background-position-x:0%}.open-position-1{background-size:305% auto;background-position-x:46%}.open-position-2{background-size:275% auto;background-position-x:100%}.bag-angle-controls{display:flex;gap:8px;margin:20px 0}.bag-angle-controls button{font:inherit;font-size:14px;padding:10px 16px;border:1px solid #b7c8c5;background:#fff;color:#173f3b;cursor:pointer;border-radius:24px}.bag-angle-controls button[aria-pressed=true]{background:#173f3b;color:#fff}.bag-controls{flex-wrap:wrap}@media(max-width:700px){.bag-window.open-bag{width:220px}}

/* Keep every 50 L blend on the same image and heading baseline. */
.collection-50l .bag-slide{align-items:start;align-content:start}
.collection-50l .bag-visual{height:520px;align-items:center}
.collection-50l .bag-window{height:480px;width:auto;max-width:100%;flex:none;transform:none!important}
.collection-50l .bag-properties{min-width:0;align-self:start}
.collection-50l .bag-properties .eyebrow{min-height:1.6em;margin-top:0}
.collection-50l .bag-properties dd{flex-shrink:0}
@media(max-width:700px){
 .collection-50l .bag-slide{grid-template-rows:340px auto;row-gap:24px;padding:16px}
 .collection-50l .bag-visual{height:340px;width:100%}
 .collection-50l .bag-window{height:310px;width:auto;max-width:100%}
 .collection-50l .bag-volume{top:15px;left:0}
 .collection-50l .bag-properties{width:100%}
 .collection-50l .bag-properties .eyebrow{min-height:3.2em;margin:0 0 12px}
}
