.supra-hero{position:relative;width:100%;height:clamp(320px,44vh,540px);overflow:hidden;background:var(--supra-ink)}@media(min-width:768px){.supra-hero{height:clamp(480px,70vh,760px)}}@media(min-width:1100px){.supra-hero{height:clamp(580px,80vh,880px)}}.supra-hero__viewport{position:absolute;top:0;right:0;bottom:0;left:0}.supra-hero__slide{position:absolute;top:0;right:0;bottom:0;left:0;opacity:0;visibility:hidden;transition:opacity .9s var(--ease-out-soft),visibility .9s var(--ease-out-soft);pointer-events:none;will-change:opacity}.supra-hero__slide[data-active=true]{opacity:1;visibility:visible;pointer-events:auto;z-index:2}.supra-hero__img{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:100%;object-fit:cover;transform:scale(1.06);transition:transform 7s linear}.supra-hero__slide[data-active=true] .supra-hero__img{transform:scale(1)}.supra-hero__scrim{position:absolute;top:0;right:0;bottom:0;left:0;background:linear-gradient(180deg,transparent 0%,transparent 45%,rgba(10,10,10,.35) 75%,rgba(10,10,10,.6) 100%);pointer-events:none;z-index:1}.supra-hero__slide[data-align=center] .supra-hero__scrim{background:radial-gradient(ellipse at center,#0a0a0a80,#0a0a0a33,#0a0a0a80)}.supra-hero__content{position:absolute;top:0;right:0;bottom:0;left:0;z-index:2;display:flex;flex-direction:column;justify-content:flex-end;padding-bottom:clamp(48px,10vh,128px);padding-top:clamp(48px,12vh,128px)}.supra-hero__copy{max-width:min(720px,85%);color:var(--supra-paper);opacity:0;transform:translateY(16px);animation:supra-hero-reveal .9s var(--ease-out-soft) .2s forwards}.supra-hero__slide[data-theme=dark] .supra-hero__copy{color:var(--supra-ink)}@keyframes supra-hero-reveal{to{opacity:1;transform:translateY(0)}}.supra-hero__slide[data-align=center] .supra-hero__content{align-items:center;justify-content:center;text-align:center;padding-bottom:0}.supra-hero__slide[data-align=right] .supra-hero__content{align-items:flex-end;text-align:right}.supra-hero__eyebrow{color:currentColor;margin-bottom:var(--space-5)}.supra-hero__eyebrow:before{background:currentColor}.supra-hero__headline{margin:0 0 var(--space-5);white-space:pre-line;letter-spacing:-.04em}.supra-hero__sub{margin:0 0 var(--space-6);max-width:520px;opacity:.92}.supra-hero__cta{background:var(--supra-paper);color:var(--supra-ink);border-color:var(--supra-paper)}.supra-hero__cta:hover{background:var(--supra-accent);color:var(--supra-paper);border-color:var(--supra-accent)}.supra-hero__slide[data-theme=dark] .supra-hero__cta{background:var(--supra-ink);color:var(--supra-paper);border-color:var(--supra-ink)}.supra-hero__corner{position:absolute;top:clamp(24px,4vh,48px);right:var(--gutter);color:var(--supra-paper);opacity:.7}.supra-hero__slide[data-theme=dark] .supra-hero__corner{color:var(--supra-ink)}.supra-hero__controls{position:absolute;bottom:clamp(20px,4vh,40px);right:var(--gutter);z-index:5;display:flex;align-items:center;gap:var(--space-3)}.supra-hero__arrow{width:44px;height:44px;display:inline-flex;align-items:center;justify-content:center;background:#f6f4ef1a;border:1px solid rgba(246,244,239,.3);color:var(--supra-paper);cursor:pointer;transition:background var(--t-fast) var(--ease-out-soft),border-color var(--t-fast) var(--ease-out-soft);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px)}.supra-hero__arrow:hover{background:var(--supra-paper);color:var(--supra-ink);border-color:var(--supra-paper)}.supra-hero__arrow svg{width:18px;height:18px}.supra-hero__dots{display:flex;gap:var(--space-2);padding:0 var(--space-3)}.supra-hero__dot{width:28px;height:2px;background:#f6f4ef59;border:0;cursor:pointer;padding:0;transition:background var(--t-fast) var(--ease-out-soft)}.supra-hero__dot[aria-selected=true]{background:var(--supra-paper)}.supra-hero__dot:hover{background:#f6f4efb3}.supra-hero__progress{position:absolute;left:0;right:0;bottom:0;height:2px;background:#f6f4ef26;z-index:5}.supra-hero__progress-bar{height:100%;width:0;background:var(--supra-paper);transition:width .1s linear}@media(max-width:768px){.supra-hero{height:clamp(560px,90vh,720px)}.supra-hero__headline{font-size:clamp(48px,14vw,80px)}.supra-hero__controls{bottom:16px;gap:var(--space-2)}.supra-hero__arrow{width:40px;height:40px}.supra-hero__dot{width:20px}}
/*# sourceMappingURL=/cdn/shop/t/76/assets/supra-hero-carousel.css.map */