/* CLEARFIX */
.cf:before, .cf:after { content: " "; display: table; }
.cf:after { clear: both; }
img { display: block; }

/* BASE */
.lp-fullwidth { overflow: hidden; }
.lp-container { width: 100%; max-width: 1320px; margin: 0 auto; position: relative; padding: 0 40px; box-sizing: border-box; -moz-font-feature-settings: "kern"; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; }
sub, sup { font-size: 40%; top: -1.2em; }
.lp-container img { max-width: 100%; }
.lp-desktop {}
.lp-mobile { display: none; }

/* HEAD */
.lp-head { margin: 80px 0; font: 500 48px/90% 'Graphik-Medium-Cy', sans-serif; letter-spacing: -1.68px; text-align: center; }

/* SECTION */
.lp-section { margin-bottom: 100px; }

/* CAT */
.lp-cat-group { margin: 0 auto; display: -ms-flexbox; display: -webkit-flex; display: flex; -webkit-justify-content: center; -ms-flex-pack: center; justify-content: center; -webkit-flex-direction: row; -ms-flex-direction: row; flex-direction: row; -webkit-flex-wrap: wrap; -ms-flex-wrap: wrap; flex-wrap: wrap; gap: 20px; }
.lp-cat { min-height: 540px; width: calc(50% - 10px); border-radius: 10px; overflow: hidden; position: relative; color: #fff; text-decoration: none; }
.lp-cat__cover { height: 100%; }
.lp-cat__cover img { height: 100%; object-fit: cover; -webkit-transition: 0.6s; transition: 0.6s; }
.lp-cat__cover--left img { object-position: top left; }
.lp-cat__wrapper { position: absolute; left: 5px; top: 50px; right: 5px; z-index: 1; text-align: center; }
.lp-cat__title { font: 500 38px/90% 'Graphik-Medium-Cy', sans-serif; letter-spacing: -1.33px; margin-bottom: 12px; position: relative; z-index: 1; }
.lp-cat__descr { font: 500 22px/100% 'Graphik-Medium-Cy', sans-serif; letter-spacing: -0.77px; margin-bottom: 12px; position: relative; z-index: 1; }
.lp-cat--big { width: 100%; }
.lp-cat--small { width: calc(33.333333333% - 14px); min-height: 460px; }
.lp-cat--black { color: #000; }
.lp-cat__title-s { font: 500 22px/100% 'Graphik-Medium-Cy', sans-serif; letter-spacing: -0.77px; margin-bottom: 12px; position: relative; z-index: 1; }
.lp-cat__price { font: 500 38px/90% 'Graphik-Medium-Cy', sans-serif; letter-spacing: -1.33px; margin-bottom: 24px; position: relative; z-index: 1; }

.lp-cat-group--iphone { margin-top: 70px; }
.lp-cat-group--iphone .lp-cat { overflow: initial; border-radius: 0; }
.lp-cat-group--iphone .lp-cat::after { display: block; content: ' '; position: absolute; bottom: -63px; height: 193px; width: 120%; margin: 0 -10%; opacity: 0.9; background: radial-gradient(50% 50% at 50% 50%, #F16830 0%, rgba(241, 104, 48, 0.99) 6.67%, rgba(241, 104, 48, 0.96) 13.33%, rgba(241, 104, 48, 0.92) 20%, rgba(241, 104, 48, 0.85) 26.67%, rgba(241, 104, 48, 0.77) 33.33%, rgba(241, 104, 48, 0.67) 40%, rgba(241, 104, 48, 0.56) 46.67%, rgba(241, 104, 48, 0.44) 53.33%, rgba(241, 104, 48, 0.33) 60%, rgba(241, 104, 48, 0.23) 66.67%, rgba(241, 104, 48, 0.15) 73.33%, rgba(241, 104, 48, 0.08) 80%, rgba(241, 104, 48, 0.04) 86.67%, rgba(241, 104, 48, 0.01) 93.33%, rgba(241, 104, 48, 0.00) 100%); }
.lp-cat-group--iphone .lp-cat__wrapper { left: 32px; text-align: left; }
.lp-cat-group--iphone .lp-cat__inner { overflow: hidden; border-radius: 10px; position: relative; z-index: 1; }

.lp-cat-group + div.lp-cat-group { margin: 100px auto; }
.lp-cat .lp-btn { margin-top: 12px; }

/* BANNER */
.lp-banner { display: block; margin: 0 0 20px; border-radius: 10px; overflow: hidden; }
.lp-banner-features { display: block; border-radius: 10px; overflow: hidden; }


/* SLIDER PRODUCT */
.lp-slider-product { overflow: initial; }
.lp-slider-product .swiper-slide { }
.lp-slider-product .swiper-pagination-bullets { bottom: 0; }
.lp-slider-product .swiper-pagination-bullet { background: #000; opacity: .2; }
.lp-slider-product .swiper-pagination-bullet-active { background: #000; opacity: 1; }
.lp-slider-product .swiper-navigation-icon { display: none; }









@media only screen and (max-width: 1100px) { }

@media only screen and (max-width: 1024px) {
    /* BASE */
    .lp-container { padding: 0 20px; }
}

@media only screen and (max-width: 900px) {
    /* BASE */
    .lp-container { padding: 0 12px; }
    /* HEAD */
    .lp-head { margin: 40px 0; font: 500 38px/90% 'Graphik-Medium-Cy', sans-serif; letter-spacing: -1.33px; text-align: center; }
    /* SECTION */
    .lp-section { margin-bottom: 60px; }

}

@media only screen and (max-width: 680px) {
    /* SLIDER PRODUCT */
    .lp-slider-product { padding-bottom: 20px; }
}