.occasion-popout{--occasion-ink: #621e3e;--occasion-ground: #fff8fa;--occasion-rule: rgb(98 30 62 / 20%);display:block;width:100%;margin-block:0 24px;color:var(--occasion-ink);background:var(--occasion-ground)}.occasion-popout *,.occasion-popout *:before,.occasion-popout *:after{box-sizing:border-box}.occasion-popout__inner{max-width:1440px;margin-inline:auto;padding:20px 16px 16px}.occasion-popout__intro{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:8px 12px}.occasion-popout .occasion-popout__intro h2{margin:0;color:var(--occasion-ink);font-family:var(--font-premium--family);font-size:24px;font-style:normal;font-weight:900;line-height:1.06;letter-spacing:-.02em;text-transform:uppercase;text-wrap:balance}.occasion-popout__all{display:inline-flex;align-items:center;min-height:44px;width:fit-content;color:var(--occasion-ink);font-family:var(--font-body--family);font-size:14px;font-weight:700;text-underline-offset:4px;text-decoration:underline}.occasion-popout__controls{display:flex;grid-column:2;grid-row:1 / span 2;gap:8px}.occasion-popout__controls[hidden],.occasion-popout__progress[hidden]{display:none}.occasion-popout__controls button{display:grid;place-items:center;width:44px;height:44px;padding:0;color:var(--occasion-ink);background:transparent;border:1px solid var(--occasion-ink);border-radius:50%;cursor:pointer;transition:color .16s ease,background-color .16s ease}.occasion-popout__controls svg{width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round}.occasion-popout__controls button:disabled{opacity:.32;cursor:default}.occasion-popout__frame{min-width:0;overflow:hidden;container-type:inline-size}.occasion-popout__rail{--occasion-photo-width: clamp(118px, 34vw, 156px);--occasion-side-bleed: calc(var(--occasion-photo-width) / 8);--occasion-top-bleed: calc(var(--occasion-photo-width) * 5 / 28);display:grid;grid-auto-flow:column;grid-auto-columns:var(--occasion-photo-width);gap:8px;margin:0;padding:calc(var(--occasion-top-bleed) + 4px) var(--occasion-side-bleed) 4px;overflow-x:auto;overflow-y:hidden;overscroll-behavior-inline:contain;scroll-behavior:smooth;scroll-snap-type:x mandatory;scroll-padding-inline:var(--occasion-side-bleed);scrollbar-width:none;isolation:isolate;list-style:none}.occasion-popout__rail::-webkit-scrollbar{display:none}.occasion-popout__rail>li{position:relative;min-width:0;z-index:1;scroll-snap-align:start}.occasion-popout__rail>li:nth-child(3n+1){z-index:2}.occasion-popout__rail>li:nth-child(3n+2){z-index:3}.occasion-popout__rail>li:focus-within{z-index:4}.occasion-popout__card{display:block;color:var(--occasion-ink);text-decoration:none}.occasion-popout__media{position:relative;display:block;aspect-ratio:14 / 19;overflow:visible}.occasion-popout__media img{position:absolute;top:calc(-100% * 160 / 1216);left:-12.5%;display:block;width:125%;max-width:none;height:auto;object-fit:contain;pointer-events:none}.occasion-popout__label{display:flex;align-items:flex-start;min-height:52px;padding:12px 2px 0;font-family:var(--button-font-family-primary);font-size:14px;font-weight:var(--button-font-weight-primary);line-height:1.15;text-transform:var(--button-text-case-primary);overflow-wrap:normal}.occasion-popout__progress{height:4px;width:min(76%,520px);margin:8px auto 0;overflow:hidden;background:var(--occasion-rule);border-radius:4px}.occasion-popout__progress span{display:block;width:18%;height:100%;background:var(--occasion-ink);border-radius:inherit}.occasion-popout :is(a,button):focus-visible{outline:2px solid var(--occasion-ink);outline-offset:3px}.occasion-popout__rail:focus-visible{outline:2px solid var(--occasion-ink);outline-offset:-2px}.occasion-popout__rail.is-mouse-dragging{scroll-snap-type:none;scroll-behavior:auto}@media(any-hover:hover)and (any-pointer:fine){.occasion-popout__rail.has-mouse-drag,.occasion-popout__rail.has-mouse-drag a{cursor:grab;user-select:none;-webkit-user-select:none}.occasion-popout__rail.is-mouse-dragging,.occasion-popout__rail.is-mouse-dragging a{cursor:grabbing}.occasion-popout__card:hover .occasion-popout__label{text-decoration:underline;text-underline-offset:4px}.occasion-popout__controls button:hover:not(:disabled){background:var(--occasion-ink);color:var(--occasion-ground)}}@media(max-width:820px){.occasion-popout__intro{grid-template-columns:minmax(0,1fr)}.occasion-popout__controls{display:none}}@media(min-width:821px){.occasion-popout{width:min(calc(100% - 48px),1392px);margin:24px auto 32px;border-radius:24px}.occasion-popout__inner{display:grid;grid-template-columns:minmax(190px,.78fr) minmax(0,3.2fr);gap:clamp(24px,3vw,48px);align-items:center;padding:28px 32px}.occasion-popout__intro{display:flex;flex-direction:column;align-items:flex-start;gap:12px}.occasion-popout .occasion-popout__intro h2{max-width:10ch;font-size:clamp(30px,3.2vw,44px)}.occasion-popout__rail{--occasion-photo-width: clamp(144px, 23.5cqw, 220px);gap:16px}.occasion-popout__label{min-height:56px}.occasion-popout__controls{margin-top:4px}}@media(min-width:1100px){.occasion-popout__rail{--occasion-photo-width: clamp(170px, 19.2cqw, 220px)}}@media(prefers-reduced-motion:reduce){.occasion-popout__rail{scroll-behavior:auto}.occasion-popout__controls button{transition:none}}
/*# sourceMappingURL=/cdn/shop/t/92/assets/rosarium-occasion-popout.css.map */