.banners{display: grid;gap: 12px;grid-template-columns: 1fr 1fr}.banner{position: relative;isolation: isolate;display: flex;align-items: flex-end;min-height: 168px;padding: 18px;overflow: hidden;border-radius: 22px;background: var(--bgc);color: #fff;transition: transform .25s, box-shadow .25s}.banner::after{content: "";position: absolute;inset: 0;z-index: -1;background: linear-gradient(to top, rgba(0, 0, 0, .6), rgba(0, 0, 0, 0) 72%)}.banner-img{position: absolute;inset: 0;z-index: -2;width: 100%;height: 100%;object-fit: cover;transition: transform .5s}.banner-shoe{position: absolute;z-index: -2;inset-inline-end: -6%;inset-block-start: 6%;width: 64%;height: auto;opacity: .95;--shoe-line: rgba(255, 255, 255, .35);filter: drop-shadow(0 14px 10px rgba(0, 0, 0, .3));transition: transform .5s}.banner-text{display: flex;flex-direction: column;align-items: flex-start;gap: 2px}.banner-count{font-size: .8rem;font-weight: 700}.banner-title{display: block;font-size: clamp(1.6rem, 6vw, 2.7rem);font-weight: 900;line-height: 1.15}.banner-cta{display: inline-flex;align-items: center;gap: 6px;margin-block-start: 10px;padding: 8px 16px;border-radius: 999px;background: #fff;color: #0a0a0a;font-weight: 800;font-size: .85rem}.banner-cta .ic{width: 16px;height: 16px}.b-men{grid-column: 1 / -1;min-height: 230px}.b-sale{grid-column: 1 / -1;min-height: 140px}@media (hover: hover){.banner:hover{transform: translateY(-3px);box-shadow: var(--shadow)}.banner:hover .banner-img, .banner:hover .banner-shoe{transform: scale(1.05)}}@media (min-width: 900px){.banners{grid-template-columns: 1.35fr 1fr 1fr;grid-template-rows: 200px 200px;gap: 16px}.b-men{grid-column: 1;grid-row: 1 / 3;min-height: 0;padding: 26px}.b-women{grid-column: 2;grid-row: 1}.b-kids{grid-column: 3;grid-row: 1}.b-sale{grid-column: 2 / 4;grid-row: 2;min-height: 0}.b-men .banner-title{font-size: clamp(2.6rem, 4.4vw, 3.6rem)}}.hero-video, .hero-shade{display: none}@media (min-width: 720px){.hero.has-video{--hero-bg: #09090b;--hero-fg: #fff;--hero-sub: #e4e4e7;--hero-em: #b9f23a;--hero-ridge: #fff;background-image: var(--poster, none);background-size: cover;background-position: center}.hero.has-video::before{display: none}.hero-video{display: block;position: absolute;inset: 0;z-index: -2;width: 100%;height: 100%;object-fit: cover;opacity: 0;transition: opacity .6s}.hero-video.on{opacity: 1}.hero-shade{display: block;position: absolute;inset: 0;z-index: -1;background: linear-gradient(rgba(0, 0, 0, .55), rgba(0, 0, 0, .72))}}