/* Three tightly framed, opaque hoodie cutouts on black. */
.mf-hoodies{background:#070707;color:#fff;isolation:isolate;perspective:1100px}
.hw-city{position:absolute;inset:0;background:url('assets/streetwear/city.png') left center/cover no-repeat;opacity:.1;mask-image:linear-gradient(90deg,#000,transparent 70%)}
.hw-wash{position:absolute;inset:0;background:radial-gradient(ellipse at 74% 45%,#28282b 0%,#101012 40%,#070707 74%);opacity:.87}
.hw-copy{position:absolute;left:5vw;top:15%;width:31%;z-index:5;pointer-events:none}
.hw-kicker{font-size:9px;letter-spacing:.2em;font-weight:700;margin:0 0 29px;display:flex;align-items:center;gap:9px}
.hw-kicker>span{width:6px;height:6px;background:#ed302d;display:inline-block}
.hw-copy h2{font-family:Arial,Helvetica,sans-serif;font-size:clamp(44px,5.35vw,100px);font-weight:900;line-height:.94;letter-spacing:-.065em;margin:0}
.hw-intro{margin:25px 0 13px;font-size:10px;font-weight:800;letter-spacing:.15em}
.hw-description{font-size:13px;line-height:1.65;margin:0 0 28px;color:#c6c6c6}
.hw-view{display:flex;pointer-events:auto;width:max-content;max-width:100%;border:1px solid #ffffff55;background:#111}
.hw-view button{min-height:47px;border:0;background:none;color:#dededb;font:700 9px Arial,Helvetica,sans-serif;letter-spacing:.1em;padding:0 16px;cursor:pointer}
.hw-view button[aria-pressed=true]{background:#fff;color:#141414}
.hw-view button>span{margin-left:20px;font-size:19px;font-weight:400}
.hw-view button:hover{background:#ddd;color:#141414}
.hw-note{margin:25px 0 0;font-size:8px;letter-spacing:.15em;color:#929292}
.hw-products{position:absolute;left:36%;right:2%;top:6%;bottom:12%;pointer-events:none;perspective:1100px}
.hw-shot{position:absolute;mix-blend-mode:normal;opacity:1;will-change:transform;filter:drop-shadow(0 22px 16px #0009);aspect-ratio:1;transform:rotate(var(--hw-angle))}
.hw-face{position:absolute;inset:0;visibility:hidden;transform-origin:50% 45%}
.hw-face.is-visible{visibility:visible;animation:hw-angle-enter .32s ease-out both}
.hw-face svg{display:block;width:100%;height:auto;overflow:hidden}
.hw-main{width:66%;left:17%;top:0;--hw-angle:-2deg;--hw-lift:-13px;--hw-sway:1deg;z-index:3}
.hw-support{width:55%;left:-6%;top:14%;--hw-angle:-14deg;--hw-lift:11px;--hw-sway:-1deg;z-index:1}
.hw-third{width:55%;right:-5%;top:11%;--hw-angle:13deg;--hw-lift:-12px;--hw-sway:1deg;z-index:2}
.mf-hoodies.is-active .hw-main{animation:hw-float 4s ease-in-out infinite}
.mf-hoodies.is-active .hw-support{animation:hw-float 4s ease-in-out -1s infinite}
.mf-hoodies.is-active .hw-third{animation:hw-float 4s ease-in-out -2s infinite}
.hw-product-label{position:absolute;right:3%;bottom:0;color:#d4d4d4;font-size:8px;letter-spacing:.16em;display:flex;align-items:center;gap:12px;z-index:4}
.hw-label-rule{width:36px;height:1px;background:#888}
.hw-colour-control{position:absolute;z-index:6;left:54%;bottom:4%;display:flex;align-items:center;gap:19px;color:#ccc}
.hw-colour-title{font-size:8px;font-weight:700;letter-spacing:.13em}
.hw-swatches{display:flex;gap:17px}
.hw-swatches button{position:relative;width:26px;height:26px;border:1px solid #ffffff60;border-radius:50%;padding:0;background:var(--hoodie-colour);cursor:pointer}
.hw-swatches button:before{content:'';position:absolute;inset:-5px;border:1px solid transparent;border-radius:50%}
.hw-swatches button[aria-pressed=true]:before{border-color:#fff}
.hw-swatches button span{position:absolute;top:38px;left:50%;transform:translateX(-50%);font-size:7px;letter-spacing:.08em;font-family:Arial,Helvetica,sans-serif;color:#eee;opacity:0;white-space:nowrap}
.hw-swatches button:hover span,.hw-swatches button:focus-visible span{opacity:1}
.hw-edge{position:absolute;right:1.4%;top:22px;writing-mode:vertical-rl;color:#a2a2a2;font-size:8px;letter-spacing:.15em}
.mf-hoodies button:focus-visible{outline:2px solid #ed302d;outline-offset:6px}
.mf-selectors{flex-wrap:wrap}.mf-selectors button{white-space:nowrap}
.mf-hoodies:not(.hw-running) .hw-shot{animation-play-state:paused!important}
@keyframes hw-float{0%,100%{transform:translate3d(0,0,0) rotate(var(--hw-angle))}50%{transform:translate3d(0,var(--hw-lift),0) rotate(calc(var(--hw-angle) + var(--hw-sway)))}}
@keyframes hw-angle-enter{from{transform:translate3d(8px,0,0) rotateY(-12deg) scale(.985)}to{transform:translate3d(0,0,0) rotateY(0) scale(1)}}
@media(min-width:1900px){.hw-products{left:39%;right:4%;top:2%}.hw-main{width:63%;left:18.5%}.hw-support,.hw-third{width:53%}}
@media(max-width:1000px) and (min-width:701px){.hw-copy{top:19%;width:32%}.hw-copy h2{font-size:clamp(37px,5vw,50px)}.hw-products{left:38%;top:20%;right:2%}.hw-main{width:69%;left:15.5%}.hw-support{top:14%}.hw-third{top:11%}.hw-colour-title{display:none}.hw-colour-control{left:62%;bottom:6%}.hw-description{font-size:12px}.hw-kicker{font-size:8px;letter-spacing:.11em}.hw-view button{padding:0 12px;font-size:8px}}
@media(max-width:700px){
 .mf-stage{height:790px}
 .hw-copy{left:7%;right:7%;top:6%;width:auto}
 .hw-kicker{margin-bottom:19px;font-size:8px}.hw-copy h2{font-size:clamp(43px,11.5vw,68px)}
 .hw-intro{margin:16px 0 9px;font-size:9px}
 .hw-description{font-size:12px;line-height:1.5;margin:0}.hw-description br{display:none}
 .hw-view{position:absolute;right:0;top:114px}.hw-view button{font-size:8px;padding:0 12px;min-height:41px}.hw-view button>span{display:none}.hw-note{display:none}
 .hw-products{left:2%;right:2%;top:39%;bottom:12%}
 .hw-main{width:73%;left:13.5%;top:0;--hw-lift:-10px}
 .hw-support{width:60%;left:-6%;top:15%;--hw-lift:9px}
 .hw-third{width:60%;right:-6%;top:12%;--hw-lift:-9px}
 .hw-product-label{bottom:0;right:7%;font-size:7px}
 .hw-colour-control{left:0;right:0;bottom:4%;justify-content:center;gap:18px}.hw-colour-title{font-size:7px;max-width:75px;line-height:1.5}
 .hw-edge{font-size:7px;right:3%;top:26px}.preview-header nav a{display:none}.preview-header nav .streetwear-nav{display:block}
 .mf-selectors{justify-content:flex-start;gap:4px 18px}.mf-selectors button{font-size:8px}
}
@media(max-width:390px){.hw-view{top:186px;left:0;right:auto}.hw-products{top:43%}.hw-description{display:none}}
@media(prefers-reduced-motion:reduce){.mf-hoodies *, .mf-hoodies.is-active *{animation:none!important;transition:none!important}}