/* CLEARFIX */
.cf:before, .cf:after { content: " "; display: table; }
.cf:after { clear: both; }
img { display: block; }

/* BASE */
html { scroll-padding-top: 160px; }
.lp-fullwidth { background: linear-gradient(180deg, #171E38 0%, #1D002E 100%); }
.lp-container { width: 100%; max-width: 100%; margin: 0 auto; position: relative; padding: 0 20px; 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-mobShow { display: none; }

/* FONTS */
@font-face {
    font-family: 'GTAArtDeco Condensed';
    src: url('https://static.re-store.ru/promo/fonts/GTAArtDeco/GTAArtDeco-CondensedBold.eot');
    src: local('GTAArtDeco Condensed Bold'), local('GTAArtDeco-CondensedBold'),
    url('https://static.re-store.ru/promo/fonts/GTAArtDeco/GTAArtDeco-CondensedBold.eot?#iefix') format('embedded-opentype'),
    url('https://static.re-store.ru/promo/fonts/GTAArtDeco/GTAArtDeco-CondensedBold.woff2') format('woff2'),
    url('https://static.re-store.ru/promo/fonts/GTAArtDeco/GTAArtDeco-CondensedBold.woff') format('woff'),
    url('https://static.re-store.ru/promo/fonts/GTAArtDeco/GTAArtDeco-CondensedBold.ttf') format('truetype');
    font-weight: bold;
    font-style: normal;
    font-display: swap;
}

/* BUTTON */
.lp-btn-group { text-align: center; margin: 80px 0 0; }
.lp-btn { display: inline-block; font: 500 16px/24px 'Graphik-Medium-Cy', sans-serif; padding: 12px 24px; box-sizing: border-box; color:#fff; text-align: center; cursor: pointer; border-radius: 6px; -webkit-transition: 0.25s; transition: 0.25s; text-decoration: none; }
.lp-btn--blue { background-color: #378BE7; }
.lp-btn--blue:hover { background-color: #327ED1; }
.lp-btn--blue:active { background-color: #2865A7; }
.lp-btn--pink { background-color: #ed5aae; }
.lp-btn--pink:hover { background-color: #ff5bb9; }
.lp-btn--pink:active { background-color: #ff5bb9; }
.lp-btn--white { background-color: #fff; color: #242424; box-shadow: 0 0 16px 0 rgba(255, 255, 255, 0.75); }
.lp-btn--white:hover { background-color: #fff; opacity: .85; }
.lp-btn--white:active { background-color: #fff; }
.lp-btn--black { background-color: #000; }
.lp-btn--black:hover { background-color: #333; }

/* BILLBOARD */
.lp-billboard { }

/* INTRO */
.lp-intro { text-align: center; background: transparent url('https://static.re-store.ru/promo/grand-theft-auto-vi/images/bg-01.jpg') 0 0 no-repeat; background-size: cover; }
.lp-intro__descr { max-width: 1040px; margin: 0 auto; padding: 145px 20px; box-sizing: border-box; font: 500 38px/90% 'Graphik-Medium-Cy', sans-serif; letter-spacing: -1.33px; background: linear-gradient(90deg, #FEAF6C 8%, #F0938B 54%, #F48DD8 92%); background-clip: text; -webkit-background-clip: text; -webkit-text-fill-color: transparent; }

/* VIDEO */
.lp-video-container { position: relative; overflow: hidden; }
.lp-video {}
.lp-video video { display: block; width: 100% }
.lp-video-container .lp-btn { position: absolute; bottom: 40px; left: 50%; transform: translateX(-50%); }

/* WELCOME */
.lp-welcome-container { background: transparent url('https://static.re-store.ru/promo/grand-theft-auto-vi/images/bg-02.jpg') left bottom no-repeat; background-size: cover; overflow: hidden; }
.lp-welcome-row { margin: 100px 70px 570px; display: -ms-flexbox; display: -webkit-flex; display: flex; -webkit-justify-content: flex-start; -ms-flex-pack: flex-start; justify-content:flex-start; -webkit-flex-direction: row-reverse; -ms-flex-direction: row-reverse; flex-direction: row-reverse; -webkit-flex-wrap: wrap; -ms-flex-wrap: wrap; flex-wrap: wrap; gap: 64px; }
.lp-welcome-col-media { width: calc(46% - 32px); }
.lp-welcome-col-content { width: calc(54% - 32px); }
.lp-welcome__img {}
.lp-welcome__wrapper { max-width: 600px; }
.lp-welcome__title { font: 700 60px/90% 'GTAArtDeco Condensed', sans-serif; text-transform: uppercase; margin-bottom: 20px; background: linear-gradient(90deg, #CCD6FF 0%, #FFCFA8 43%, #FF68C2 100%); background-clip: text; -webkit-background-clip: text; -webkit-text-fill-color: transparent; }
.lp-welcome__descr { }
.lp-welcome__descr p { font: 500 22px/100% 'Graphik-Medium-Cy', sans-serif; letter-spacing: -0.77px; color: #fff; padding: 0; margin: 20px 0 0 0; }
.lp-welcome__descr p:first-child { margin-top: 0; }

/* SECTION */
.lp-container-01 { background: transparent url('https://static.re-store.ru/promo/grand-theft-auto-vi/images/bg-03.jpg') left bottom no-repeat; background-size: cover; }
.lp-container-02 { background: transparent url('https://static.re-store.ru/promo/grand-theft-auto-vi/images/bg-04.jpg') no-repeat; background-position: left 0 bottom 320px; background-size: cover; }
.lp-section { margin: 20px 0; display: -ms-flexbox; display: -webkit-flex; display: flex; -webkit-justify-content: flex-start; -ms-flex-pack: flex-start; justify-content:flex-start; -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-section__img {}
.lp-section-col {  }
.lp-section-colContent { width: 340px; }
.lp-section-colMedia-1-01 { flex: 1.32; }
.lp-section-colMedia-1-02 { flex: 1; }
.lp-section-1 { margin: 20px; }

.lp-section-2 { margin: 60px 20px 20px 80px; }
.lp-section-colMedia-2-01 { width: calc(50% - 10px); }
.lp-section-2 .lp-section-colContent { width: calc(50% - 10px); }
.lp-section-2 .lp-hero ~ .lp-section__img { margin-top: 50px; }

.lp-section-3 { max-width: 1060px; }
.lp-section-colMedia-3-01 { width: 700px; max-width: 100%; }

.lp-section-4 { margin-top: 60px; }
.lp-section-colMedia-4-01 { width: 340px; }
.lp-section-colMedia-4-02 { flex: 1; max-width: 680px; margin-top: -80px; }

.lp-section-5 { max-width: 880px; margin: -90px 0 0 360px; align-items: flex-end; }
.lp-section-colMedia-5-01 { flex: 1; }

.lp-section-6 { margin-top: 60px; }
.lp-section-colMedia-6-01 { flex: 1; }

/* HERO */
.lp-hero { width: 340px; }
.lp-hero__title { font: 700 60px/90% 'GTAArtDeco Condensed', sans-serif; text-transform: uppercase; color: #FFE8CB; }
.lp-hero__subtitle { margin: 40px 0 16px; font: 500 22px/100% 'Graphik-Medium-Cy', sans-serif; letter-spacing: -0.77px; color: #CBC8FF; }
.lp-hero__descr p { font: 500 18px/100% 'Graphik-Medium-Cy', sans-serif; letter-spacing: -0.45px; color: #fff; padding: 0; margin: 16px 0 0 0; }
.lp-welcome__descr p:first-child { margin-top: 0; }
.lp-hero__subtitle--color-2 { color: #FF98E5; }

/* BAR */
.lp-bar { overflow: auto; position: relative;  }
.lp-bar .simplebar-track.simplebar-horizontal { border-radius: 10px; height: 4px; background: #FBDFF0; margin: 22px 0 0; position: relative; }
.lp-bar .simplebar-scrollbar:before { border-radius: 10px; background: #FF5CB9; opacity: 1!important; top: 0; bottom: 0; left: 0; right: 0; }


/* HERO */
.lp-heros { width: 340px; }

/* heros */
.lp-heros { width: 100%; max-width: 2000px; margin: 0 auto; overflow: hidden; }
.lp-heros-wrapper { height: 814px; max-height: 814px; margin: 0 -10%; display: -ms-flexbox; display: -webkit-flex; display: flex; -webkit-justify-content: space-between; -ms-flex-pack: space-between; justify-content: space-between; -webkit-flex-direction: row; -ms-flex-direction: row; flex-direction: row; -webkit-flex-wrap: nowrap; -ms-flex-wrap: nowrap; flex-wrap: nowrap; gap: 20px; }
.lp-heros-item { width: 16%; height: 100%; overflow: hidden; cursor: pointer; transition: .5s; transform: skewX(-18deg); position: relative; }
.lp-heros-item:first-child { width: 26%; min-width: 26%; }
.lp-heros-item:last-child { width: 26%; min-width: 26%; }
.lp-heros-item-inner { width: 260%; height: 100%; margin: 0 -80%; transition: .5s;  transform: skewX(14deg); }
.lp-heros-item img { width: 100%; height: 100%; object-fit: cover; max-height: 100%;  }

.lp-heros-item-bg { position:absolute; left:0; top:0; right: 0; bottom: 0; background: linear-gradient(180deg, rgba(52, 9, 69, 0.00) 50%, #340945 100%); transition: .5s; opacity: 1; }
.lp-heros-item__title { font: 700 clamp(24px, calc(0px + 3.125vw), 45px)/100% 'GTAArtDeco Condensed', sans-serif; text-transform: uppercase; color: #FFE8CB; text-align: center; position: absolute; top: 600px; left: 50%; transform: translateX(-50%); transition: .5s; opacity: 1;  }
.lp-heros-item:nth-child(1) img { object-position: 28% 0; }
.lp-heros-item:nth-child(2) img { object-position: 40% 0; }
.lp-heros-item:nth-child(3) img { object-position: 8% 0; }
.lp-heros-item:nth-child(4) img { object-position: 72% 0; }
.lp-heros-item:nth-child(5) img { }

.lp-heros-item:nth-child(1) .lp-heros-item__title { transform: translateX(-22%); }
.lp-heros-item:nth-child(2) .lp-heros-item__title { transform: translateX(-130%); }
.lp-heros-item:nth-child(3) .lp-heros-item__title { transform: translateX(-90%); }
.lp-heros-item:nth-child(4) .lp-heros-item__title { transform: translateX(-130%); }
.lp-heros-item:nth-child(5) .lp-heros-item__title { transform: translateX(-130%); }

@media (hover: hover) and (pointer: fine) {
    .lp-heros-item-bg { transition: .5s; opacity: 0; }
    .lp-heros-item:hover .lp-heros-item-bg { transition: .5s; opacity: 1; }
    .lp-heros-item__title { transition: .5s; opacity: 0;  }
    .lp-heros-item:hover .lp-heros-item__title { transition: .5s; opacity: 1;  }

    .lp-heros-item:hover { width: 20%; transition: .5s; }
    .lp-heros-item:first-child:hover { width: 26%; }
    .lp-heros-item:last-child:hover { width: 26%; }
}





@media (hover: hover) and (pointer: fine) { }

@media only screen and (max-width: 1200px) {
    /* SECTION */
    .lp-section-colMedia-3-01 { flex: 1; }

    .lp-section-colMedia-4-02 { margin-top: 0; }

    /* heros */
    .lp-heros-wrapper { height: 700px; max-height: 700px; }
    .lp-heros-item__title { top: 500px; }
    .lp-heros-item:nth-child(1) .lp-heros-item__title { transform: translateX(-18%); }
    .lp-heros-item:nth-child(2) .lp-heros-item__title { transform: translateX(-120%); }
    .lp-heros-item:nth-child(3) .lp-heros-item__title { transform: translateX(-84%); }
    .lp-heros-item:nth-child(4) .lp-heros-item__title { transform: translateX(-120%); }
    .lp-heros-item:nth-child(5) .lp-heros-item__title { transform: translateX(-120%); }
}

@media only screen and (max-width: 1024px) {
    /* BASE */
    .lp-container { padding: 0 20px; }
    .lp-tabletHide { display: none; }

    /* WELCOME */
    .lp-welcome-container { background: transparent url('https://static.re-store.ru/promo/grand-theft-auto-vi/images/bg-02.jpg') 15% bottom no-repeat; background-size: cover; }
    .lp-welcome__title { font: 700 48px/90% 'GTAArtDeco Condensed', sans-serif; }
    .lp-welcome__descr p { font: 500 18px/100% 'Graphik-Medium-Cy', sans-serif; letter-spacing: -0.45px; }

    /* SECTION */
    .lp-section-colMedia-4-02 { max-width: 100%; width: 100%; flex: initial; order: -1; margin: 0 0 40px; }
    .lp-section-5 { margin: 60px 0 0; }

    /* heros */
    .lp-heros-wrapper { height: 400px; max-height: 400px; }
    .lp-heros-item__title { top: 300px; }
    .lp-heros-item:nth-child(1) .lp-heros-item__title { transform: translateX(-13%); }
    .lp-heros-item:nth-child(2) .lp-heros-item__title { transform: translateX(-110%); }
    .lp-heros-item:nth-child(3) .lp-heros-item__title { transform: translateX(-79%); }
    .lp-heros-item:nth-child(4) .lp-heros-item__title { transform: translateX(-110%); }
    .lp-heros-item:nth-child(5) .lp-heros-item__title { transform: translateX(-110%); }
}

@media only screen and (max-width: 768px) {
    /* BASE */
    .lp-container { padding: 0 12px; }
    .lp-desktop { display: none; }
    .lp-mobHide { display: none; }
    .lp-mobShow { display: block; }

    /* INTRO */
    .lp-intro { background: transparent url('https://static.re-store.ru/promo/grand-theft-auto-vi/images/bg-01--m.jpg') 0 0 no-repeat; background-size: cover; }
    .lp-intro__descr { padding: 87px 10px; box-sizing: border-box; font: 500 30px/90% 'Graphik-Medium-Cy', sans-serif; letter-spacing: -1.05px; }

    /* VIDEO */
    .lp-video { margin: 0 -20%; }
    .lp-video-container .lp-btn { bottom: 26px; }

    /* WELCOME */
    .lp-welcome-container { background: transparent url('https://static.re-store.ru/promo/grand-theft-auto-vi/images/bg-02.jpg') no-repeat; background-position: left 20% top 160px; background-size: cover; }
    .lp-welcome-row { margin: 70px 12px 85px; -webkit-flex-direction: column; -ms-flex-direction: column; flex-direction: column; }
    .lp-welcome-col-media { width: 100%; }
    .lp-welcome-col-content { width: 100%; }
    .lp-welcome__img { margin: 0 12px; }
    .lp-welcome__title { max-width: 240px; }

    /* HERO */
    .lp-hero { width: initial; }
    .lp-hero__title { font: 700 48px/90% 'GTAArtDeco Condensed', sans-serif; }
    .lp-hero__subtitle { margin: 16px 0 10px; font: 500 18px/100% 'Graphik-Medium-Cy', sans-serif; letter-spacing: -0.45px; }

    /* BAR */
    .lp-bar { margin: 0 0 70px; padding: 0 12px; box-sizing: border-box; }
    .lp-bar__img { width: 1007px; }

    /* SECTION */
    .lp-container-02 { background-position: left 0 bottom 0; }

    .lp-section { margin: 20px 0; -webkit-flex-direction: column; -ms-flex-direction: column; flex-direction: column; }
    .lp-section__img {}
    .lp-section-col {  }
    .lp-section-colContent { width: 100%; }
    .lp-section-colMedia-1-01 { width: 100%; flex: initial; margin-bottom: 40px; }
    .lp-section-colMedia-1-02 { width: 100%; flex: initial; }
    .lp-section-1 {  }

    .lp-section-2 { margin: 60px 0 20px; }
    .lp-section-colMedia-2-01 { width: 100%; }
    .lp-section-2 .lp-section-colContent { width: 100%; }
    .lp-section-2 .lp-hero ~ .lp-section__img { margin-top: 60px; }

    .lp-section-4 { margin: 60px 0; }
    .lp-section-colMedia-4-01 { width: 100%; }
    .lp-section-5 { margin: 60px 0; }
    .lp-section-6 { margin: 60px 0; }
    .lp-section-colMedia-6-01 { order:-1; }

}

@media only screen and (max-width: 600px) {
    /* VIDEO */
    .lp-video { margin: 0 -40%; }
}






