.kp-hero{position:relative}.kp-hero .swiper{overflow:hidden}.kp-hero__slide{height:auto}@media screen and (min-width:750px){.kp-hero__slide{width:calc((min(var(--kp-hero-basis, 1280px),100vw) - (var(--kp-hero-per-view, 3) - 1) * var(--kp-hero-gap, 18px)) / var(--kp-hero-per-view, 3))}}.kp-hero__card{position:relative;display:block;overflow:hidden;border-radius:var(--kp-hero-radius, 20px);aspect-ratio:var(--kp-hero-aspect, 4 / 5);background:#0000000a}.kp-hero__media,.kp-hero__media img,.kp-hero__media svg{width:100%;height:100%}.kp-hero__media img{object-fit:cover;display:block}.kp-hero__card--overlay:after{content:"";position:absolute;top:0;right:0;bottom:0;left:0;z-index:1;background:linear-gradient(180deg,#0000 55%,#00000073);pointer-events:none}.kp-hero__content{position:absolute;inset-inline:0;inset-block-end:0;z-index:2;display:flex;flex-direction:column;gap:.4rem;padding:2.4rem 2rem 3rem;text-align:center}.kp-hero__content--light{color:#fff}.kp-hero__content--dark{color:#111}.kp-hero__eyebrow{font-size:1.2rem;font-weight:500;letter-spacing:.08em;text-transform:uppercase}.kp-hero__heading{margin:0;font-size:2.4rem;font-weight:500;line-height:1.25;color:inherit}.kp-hero__text{margin:0;font-size:1.4rem;opacity:.85}.kp-hero--pop .swiper{padding-block:1.6rem 2.8rem}.kp-hero--pop .kp-hero__card{transform:scale(.92);transition:transform .6s cubic-bezier(.22,.61,.36,1),box-shadow .6s cubic-bezier(.22,.61,.36,1)}.kp-hero--pop .swiper-slide-active .kp-hero__card{transform:scale(1);box-shadow:0 14px 34px #0000002e}.kp-hero__btn{position:absolute;inset-block-start:50%;transform:translateY(-50%);z-index:3;display:none;align-items:center;justify-content:center;width:4rem;height:4rem;padding:0;border:none;border-radius:50%;background:#ffffffe6;color:#111;cursor:pointer;box-shadow:0 2px 8px #0000001f;transition:background .2s ease,transform .2s ease}.kp-hero__btn:hover{background:#fff}.kp-hero__btn--prev{inset-inline-start:1.2rem}.kp-hero__btn--next{inset-inline-end:1.2rem}.kp-hero__btn svg{width:1.6rem;height:1.6rem}@media screen and (min-width:750px){.kp-hero__btn{display:flex}}.kp-hero__pagination.swiper-pagination{position:static;display:flex;justify-content:center;gap:.8rem;margin-block-start:1.6rem}.kp-hero__pagination .swiper-pagination-bullet{width:.8rem;height:.8rem;margin:0;border-radius:50%;background:currentColor;opacity:.25;transition:opacity .2s ease,transform .2s ease}.kp-hero__pagination .swiper-pagination-bullet-active{opacity:1;transform:scale(1.25)}
/*# sourceMappingURL=/cdn/shop/t/67/assets/kp-hero-banner.css.map */
