.when-section{--wtw-accent: #C4A882;--wtw-text-headline: #1A1714;--wtw-text-body: rgba(42, 34, 32, .72);--wtw-radius: 3px;--wtw-shadow-card: 0 1px 3px rgba(42, 34, 32, .05), 0 4px 16px rgba(42, 34, 32, .06);padding:clamp(64px,8vw,96px) clamp(40px,6vw,80px);background:#fff;font-family:Plus Jakarta Sans,sans-serif}.when-section .when-mosaic{display:grid;grid-template-columns:1.15fr 1fr;grid-template-rows:repeat(3,1fr);grid-template-areas:"a b" "a c" "a d";gap:0;aspect-ratio:4 / 3;margin-bottom:clamp(40px,5vw,64px);border-radius:var(--wtw-radius);overflow:hidden}.when-section .when-mosaic-tile{position:relative;overflow:hidden;background:#2a22200a}.when-section .when-mosaic-tile img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .6s ease-out}.when-section .when-mosaic-tile:hover img{transform:scale(1.03)}.when-section .when-mosaic-tile:nth-child(1){grid-area:a}.when-section .when-mosaic-tile:nth-child(2){grid-area:b}.when-section .when-mosaic-tile:nth-child(3){grid-area:c}.when-section .when-mosaic-tile:nth-child(4){grid-area:d}.when-section .when-mosaic-tile--empty{background:linear-gradient(135deg,#c4a88214,#2a22200a)}.when-section .when-header{margin-bottom:clamp(32px,4vw,48px)}.when-section .when-label{font-size:10px;font-weight:700;letter-spacing:.16em;text-transform:uppercase;color:var(--wtw-accent);margin-bottom:12px}.when-section .when-headline{font-family:Plus Jakarta Sans,sans-serif!important;font-style:normal!important;text-transform:none!important;font-size:clamp(20px,2.5vw,28px);font-weight:700;letter-spacing:-.02em;color:var(--wtw-text-headline);line-height:1.2;margin:0}.when-section .when-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:clamp(16px,2vw,24px)}.when-section .when-card{padding:clamp(20px,2.5vw,28px);background:#ffffff80;border:1px solid rgba(42,34,32,.06);border-radius:var(--wtw-radius);transition:all .2s ease-out}.when-section .when-card:hover{background:#ffffffd9;box-shadow:var(--wtw-shadow-card)}.when-section .when-card-occasion{font-size:13px;font-weight:600;color:var(--wtw-text-headline);margin-bottom:8px}.when-section .when-card-desc{font-size:13px;font-weight:300;color:var(--wtw-text-body);line-height:1.55}@media(min-width:769px){.when-section{display:grid;grid-template-columns:1.1fr 1fr;column-gap:clamp(40px,5vw,72px);align-items:stretch}.when-section .when-mosaic{margin-bottom:0;aspect-ratio:auto;position:absolute;top:0;right:0;bottom:0;left:0;height:auto;width:auto}.when-section .when-mosaic-wrap{position:relative;min-height:0}.when-section .when-mosaic-tile{min-height:0}.when-section .when-right{display:flex;flex-direction:column;min-width:0}.when-section .when-header{margin-bottom:clamp(16px,2vw,24px)}.when-section .when-grid{grid-template-columns:1fr;gap:clamp(10px,1.2vw,14px)}.when-section .when-card{padding:clamp(16px,1.8vw,22px) clamp(18px,2vw,26px);display:flex;align-items:baseline;gap:clamp(14px,2vw,24px)}.when-section .when-card-occasion{flex:0 0 clamp(110px,12vw,150px);margin-bottom:0}.when-section .when-card-desc{flex:1}}@media(max-width:768px){.when-section .when-grid{grid-template-columns:repeat(2,1fr)}.when-section .when-mosaic{margin-left:calc(-1*clamp(40px,6vw,80px));margin-right:calc(-1*clamp(40px,6vw,80px));border-radius:0;aspect-ratio:5 / 4}}@media(max-width:480px){.when-section .when-grid{grid-template-columns:1fr}}
/*# sourceMappingURL=/cdn/shop/t/56/assets/when-to-wear.css.map */