/*
1. Reset CSS
2. Fonts
3. Main Setting
4. Basic elements
5. Header
6. Footer
7. Content
8. Popup
9. Media
	9.1 Wide screens
	9.2 Tablets
	9.3 Mobiles
*/

/**************************************/
/************ 1. Reset Css ************/
/**************************************/

html,body,div,span,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,cite,code,em,font,img,q,s,small,strong,b,i,center,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,article,aside,section,nav,header,footer,main,figure,figcaption,fgroup,time{margin:0;padding:0;border:0;outline:0;font-size:100%;vertical-align:baseline;background:transparent}
article,aside,section,nav,header,footer,main,figure,figcaption,fgroup,time{display:block}
html{word-wrap:break-word;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;-ms-text-size-adjust:100%;-moz-text-size-adjust:100%;-webkit-text-size-adjust:100%;-webkit-tap-highlight-color:transparent;-ms-touch-action:manipulation;touch-action:manipulation}
input::-moz-focus-inner{border:0;padding:0}
button::-moz-focus-inner{border:0;padding:0}
input[type=submit],input[type=button],button{cursor:pointer;-webkit-appearance:none;outline:none}
select,input,textarea,button{font-size:12px;font-family:'Montserrat',sans-serif;background:none;border:none;padding:0;margin:0;border-radius:0;box-shadow:none;-webkit-appearance:none;-moz-appearance:none;-webkit-focus-ring-color:none;outline:none}
body{font-size:16px;font-family:'Montserrat',sans-serif;background:var(--color-white);color:var(--color-grey);letter-spacing:.005em}
blockquote,q{quotes:none}
blockquote:before,blockquote:after,q:before,q:after{content:''}
:focus{outline:0}
:disabled{cursor:default}
*,*::before,*::after{-webkit-box-sizing:border-box;box-sizing:border-box}
ul li{list-style:none}
img{display:block;max-width:100%}
a{text-decoration:none;-webkit-transition:all .3s;-o-transition:all .3s;transition:all .3s;}

/**********************************/
/************ 2. Fonts ************/
/**********************************/

@font-face{
    font-family: 'Droid Serif';
    font-weight: normal;
    font-style: normal;
    font-display: swap;
    src: local('Droid Serif'),
    url('../fonts/DroidSerif.woff2') format('woff2'),
    url('../fonts/DroidSerif.woff') format('woff');
}

/*****************************************/
/************ 3. Main Setting ************/
/*****************************************/

:root {
    --color-accent: #5198a0;
    --color-dark-green: #5198a0;
    --color-grey: #686868;
    --color-grey-dark: #4f4f52;
    --color-grey-light: #a8a4a4;
    --color-grey-lightest: #d1d1d0;
    --color-gradient: linear-gradient(to bottom, #fbe293, #fcc03b);
    --color-white: #fff;
    --color-black: 0 0 0;
    --color-bg-light: #fcfbfa;
    --color-bg: #f8f6f4;
}

::-webkit-input-placeholder {color:var(--color-grey-light)}
::-moz-placeholder{color:var(--color-grey-light)}
:-moz-placeholder{color:var(--color-grey-light)}
:-ms-input-placeholder{color:var(--color-grey-light)}

#page {
    position: relative;
    overflow: hidden;
}

.wrap {
    width: 1200px;
    margin: 0 auto;
}

/*******************************************/
/************ 4. Basic elements ************/
/*******************************************/

h1,
h2,
h3 {
    font-family: 'Droid Serif', serif;
    letter-spacing: .025em;
    margin-bottom: 60px;
    font-weight: 400;
}

h1 {
    font-size: 44px;
    line-height: 60px;
}

h2 {
    font-size: 33px;
    text-align: center;
}

h3 {
    font-size: 30px;
    text-align: center;
    margin-bottom: 23px;
}

.color-accent {
    color: var(--color-accent);
}

.input {
    display: block;
    width: 230px;
    max-width: 100%;
    height: 56px;
    margin: 0 auto 10px;
    background-color: var(--color-white);
    border-radius: 100px;
    font-size: 12px;
    font-weight: 300;
    color: var(--color-grey-dark);
    letter-spacing: .025em;
    padding: 0 25px 2px 54px;
    background-size: 22px 22px;
    background-position: 20px center;
    background-repeat: no-repeat;
}
.logo, .logo-footer {
    font-family: 'Droid Serif', serif;
    font-weight: 600;
    font-size: 24px;
    max-width: 180px;
}

.input--user {
    background-image: url(../img/icon/user.png);
}

.input--phone {
    background-image: url(../img/icon/phone-call.png);
}

.btn {
    width: 320px;
    max-width: 100%;
    height: 71px;
    background: var(--color-gradient);
    border-radius: 50px;
    text-transform: uppercase;
    font-size: 14px;
    font-weight: 600;
    color: var(--color-grey);
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
    letter-spacing: .05em;
    position: relative;
}

.btn::before {
    content: '';
    position: absolute;
    top: 0;
    left: 2px;
    width: calc(100% - 4px);
    height: 100%;
    display: block;
    -webkit-box-shadow: 0 4px #de9a07;
            box-shadow: 0 4px #de9a07;
    z-index: -1;
    border-radius: inherit;
    -webkit-transition: all .5s;
    -o-transition: all .5s;
    transition: all .5s;
}

.btn:hover::before {
    opacity: 0;
}

.btn--small {
    width: 230px;
    height: 56px;
    font-size: 11px;
}

.btn--small::before {
    -webkit-box-shadow: 0 2px #de9a07;
            box-shadow: 0 2px #de9a07;
}

.swiper-button-prev,
.swiper-button-next {
    width: 40px;
    height: 40px;
    border-radius: 50%;
    background: var(--color-gradient);
    margin-top: -20px;
    z-index: 2;
}

.swiper-button-prev::after,
.swiper-button-next::after {
    content: '';
    background: url(../img/icon/arrow.png) no-repeat center;
    width: 8px;
    height: 15px;
    display: block;
}

.swiper-button-next {
    left: auto;
    right: calc(50% - 144px);
}

.swiper-button-next::after {
    -webkit-transform: rotate(180deg);
        -ms-transform: rotate(180deg);
            transform: rotate(180deg);
}

/***********************************/
/************ 5. Header ************/
/***********************************/

.header {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    padding: 10px 0;
    z-index: 5;
}

.header__wrap {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: start;
        -ms-flex-align: start;
            align-items: flex-start;
    -webkit-box-pack: justify;
        -ms-flex-pack: justify;
            justify-content: space-between;
}

.header__logo {
    margin-top: 5px;
}

.menu__btn {
    display: none;
}

.menu__list {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
}

.menu__item {
    margin: 0 21px;
}

.menu__link {
    color: var(--color-grey);
    font-size: 15px;
}

.menu__link:hover {
    color: var(--color-accent);
}

.header__menu {
    margin-top: 14px;
    margin-left: 10px;
}

.phone {
    letter-spacing: .025em;
    font-family: 'Droid Serif', serif;
    color: var(--color-grey-dark);
    background: var(--color-white);
    padding: 12px 27px 12px 17px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    border-radius: 25px;
}

.phone::before {
    content: '';
    background: url(../img/icon/phone.png) no-repeat left top 4px;
    width: 27px;
    height: 26px;
    display: block;
    border-right: 1px solid #f0e1db;
    padding: 4px 7px 3px 0;
    margin-right: 15px;
}

.phone:hover {
    color: var(--color-accent);
}

/***********************************/
/************ 6. Footer ************/
/***********************************/

.footer {
    background: var(--color-bg);
    padding: 26px 0 16px;
}

.footer__wrap {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: start;
        -ms-flex-align: start;
            align-items: flex-start;
}

.footer__logo {
    margin-top: 1px;
}

.footer__menu {
    margin-left: 96px;
}

.footer__menu .menu__list {
    display: -ms-grid;
    display: grid;
    -ms-grid-columns: 177px 10px 123px 10px 123px;
    grid-template-columns: 177px 123px 123px;
    -ms-grid-rows: 1fr 9px 1fr;
    grid-template-rows: 1fr 1fr;
    grid-gap: 9px 10px;
    grid-auto-flow: column;
    -webkit-box-align: start;
        -ms-flex-align: start;
            align-items: flex-start;
}

.footer__menu .menu__list > *:nth-child(1) {
    -ms-grid-row: 1;
    -ms-grid-column: 1;
}

.footer__menu .menu__list > *:nth-child(2) {
    -ms-grid-row: 3;
    -ms-grid-column: 1;
}

.footer__menu .menu__list > *:nth-child(3) {
    -ms-grid-row: 1;
    -ms-grid-column: 3;
}

.footer__menu .menu__list > *:nth-child(4) {
    -ms-grid-row: 3;
    -ms-grid-column: 3;
}

.footer__menu .menu__list > *:nth-child(5) {
    -ms-grid-row: 1;
    -ms-grid-column: 5;
}

.footer__menu .menu__list > *:nth-child(6) {
    -ms-grid-row: 3;
    -ms-grid-column: 5;
}

.footer__menu .menu__item {
    margin: 0;
}

.footer__menu .menu__link {
    font-size: 14px;
}

.footer__social {
    margin-left: 103px;
    margin-top: 1px;
}

.social__title {
    font-size: 12px;
    color: var(--color-grey-light);
    margin-bottom: 7px;
}

.social__list {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: end;
        -ms-flex-align: end;
            align-items: end;
}

.social__item {
    margin: 0 11px 10px 1px;
}

.social__link {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
    background: var(--color-gradient);
    border-radius: 50%;
    width: 36px;
    height: 36px;
}

.social__link:hover {
    -webkit-transform: translate(0, -3px);
        -ms-transform: translate(0, -3px);
            transform: translate(0, -3px);
}

.footer__call {
    margin-left: auto;
    margin-top: 2px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
    -webkit-box-align: end;
        -ms-flex-align: end;
            align-items: flex-end;
    -webkit-box-pack: start;
        -ms-flex-pack: start;
            justify-content: flex-start;
}

.footer__phone {
    background: none;
    padding: 0;
    font-size: 18px;
    border-radius: 0;
    margin-bottom: 11px;
}

.footer__phone::before {
    border: 0;
    width: 19px;
    height: 19px;
    background-position: center;
    margin-right: 11px;
    padding: 0;
}

.footer__callback {
    font-size: 13px;
    letter-spacing: .025em;
    color: #eabb56;
    border-bottom: 1px solid;
}

.footer__callback:hover {
    border-bottom-color: transparent;
}

/************************************/
/************ 7. Content ************/
/************************************/

.main {
    background: url(../img/bg/main.jpg) no-repeat center;
    padding: 189px 0 50px;
    position: relative;
    min-height: 850px;
    z-index: 2;
}

.main__title {
    width: 600px;
    max-width: 100%;
    margin-bottom: 53px;
}

.main__edge {
    display: -ms-grid;
    display: grid;
    -ms-grid-columns: 220px 10px 260px;
    grid-template-columns: 220px 260px;
    -ms-grid-rows: 1fr 30px 1fr;
    grid-template-rows: 1fr 1fr;
    grid-gap: 30px 10px;
    -webkit-box-align: start;
        -ms-flex-align: start;
            align-items: start;
    margin-bottom: 77px;
}

.main__edge > *:nth-child(1) {
    -ms-grid-row: 1;
    -ms-grid-column: 1;
}

.main__edge > *:nth-child(2) {
    -ms-grid-row: 1;
    -ms-grid-column: 3;
}

.main__edge > *:nth-child(3) {
    -ms-grid-row: 3;
    -ms-grid-column: 1;
}

.main__edge > *:nth-child(4) {
    -ms-grid-row: 3;
    -ms-grid-column: 3;
}

.main__edge-item {
    font-size: 15px;
    line-height: 19px;
    letter-spacing: .025em;
    position: relative;
    padding-left: 25px;
}

.main__edge-item::before {
    content: '';
    width: 16px;
    height: 16px;
    display: block;
    background: -o-radial-gradient(var(--color-accent) 3px, transparent 3px, transparent 7px, var(--color-accent) 8px);
    background: radial-gradient(var(--color-accent) 3px, transparent 3px, transparent 7px, var(--color-accent) 8px);
    border-radius: 50%;
    position: absolute;
    top: 3px;
    left: 0;
}

.main__edge-item b {
    font-weight: 500;
    display: block;
}

.main__edge-item br {
    display:  none;
}

.main__btn {
    width: 300px;
    font-size: 15px;
}

.main__price {
    width: 90px;
    height: 90px;
    border-radius: 50%;
    position: absolute;
    top: 272px;
    left: calc(50% + 246px);
    background: var(--color-white);
    text-align: center;
    border: 5px solid var(--color-white);
    -webkit-box-shadow: inset 0 0 0 1px #f0e1db, 0 0 16px rgb(180 166 160 / 8%);
            box-shadow: inset 0 0 0 1px #f0e1db, 0 0 16px rgb(180 166 160 / 8%);
    font-family: 'Droid Serif', serif;
    color: var(--color-accent);
    padding-top: 22px;
    padding-left: 4px;
}

.main__price-old {
    display: block;
    color: var(--color-grey);
    opacity: .5;
    text-decoration: line-through;
    font-family: 'Montserrat', sans-serif;
    font-size: 14px;
}

.main__price-info {
    font-size: calc(100% - 4px);
}

.popular {
    padding: 114px 0 10px;
}

.show-more-container {
    position: relative;
    overflow: hidden;
    -webkit-transition: all 1s;
    -o-transition: all 1s;
    transition: all 1s;
    margin-bottom: 50px;
}

.show-more-container::after {
    content: '';
    width: 100%;
    height: 150px;
    display: block;
    background: -o-linear-gradient(top, transparent, var(--color-white));
    background: -webkit-gradient(linear, left top, left bottom, from(transparent), to(var(--color-white)));
    background: linear-gradient(to bottom, transparent, var(--color-white));
    position: absolute;
    left: 0;
    bottom: 0;
    z-index: 2;
    opacity: 1;
    visibility: visible;
    -webkit-transition: all 1s;
    -o-transition: all 1s;
    transition: all 1s;
}

.show-more-container.active::after {
    opacity: 0;
    visibility: hidden;
}

.card-list {
    overflow: visible;
    margin-bottom: 50px;
}

.card-list__inner {
    display: -ms-grid;
    display: grid;
    -ms-grid-columns: 290px 13px 290px 13px 290px 13px 290px;
    grid-template-columns: repeat(4, 290px);
    -ms-grid-rows: -webkit-min-content;
    -ms-grid-rows: min-content;
    grid-template-rows: -webkit-min-content;
    grid-template-rows: min-content;
    grid-gap: 13px;
    -webkit-box-align: start;
        -ms-flex-align: start;
            align-items: start;
}

.card {
    border-radius: 15px;
    background: var(--color-white);
    -webkit-box-shadow: 0 0 43px rgb(var(--color-black) / 4%);
            box-shadow: 0 0 43px rgb(var(--color-black) / 4%);
    position: relative;
    z-index: 2;
    padding: 10px;
    max-width: 290px;
    margin: 0 auto;
}

.card::after {
    content: '';
    display: block;
    position: absolute;
    top: 10px;
    left: 10px;
    right: 10px;
    bottom: 10px;
    border: 1px solid rgb(240 225 219 / 30%);
    border-radius: 15px;
    z-index: -1;
}

.card__header {
    position: relative;
    border-radius: 15px 15px 0 0;
    overflow: hidden;
    padding-top: 100%;
}

.card__gallery {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}

.card__img-container {
    -webkit-box-flex: 1;
        -ms-flex: 1;
            flex: 1;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: end;
        -ms-flex-align: end;
            align-items: flex-end;
}

.card__img-container::after {
    content: '';
    display: block;
    width: 100%;
    height: 2px;
    margin: 0 4px 6px;
    background: var(--color-grey-lightest);
    border-radius: 5px;
}

.card__img-container.active::after {
    background: var(--color-gradient);
}

.card__img {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    opacity: 0;
    z-index: -1;
}

.card__img-container:nth-child(1) .card__img,
.card__img-container:hover .card__img {
    opacity: 1;
}

.card__sticker {
    position: absolute;
    top: 23px;
    right: 0;
    font-size: 11px;
    font-weight: 500;
    text-transform: uppercase;
    padding: 6px 17px 6px 19px;
    letter-spacing: .05em;
    z-index: 2;
}

.card__sticker::after {
    content: '';
    width: calc(100% + 5px);
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    display: block;
    background: var(--color-gradient);
    z-index: -1;
    border-radius: 4px 0 0 4px;
    -webkit-transform: skew(-23deg);
        -ms-transform: skew(-23deg);
            transform: skew(-23deg);
    -webkit-transform-origin: 100% 100%;
        -ms-transform-origin: 100% 100%;
            transform-origin: 100% 100%;
    -webkit-box-shadow: 0 0 16px rgb(180 166 160 / 8%);
            box-shadow: 0 0 16px rgb(180 166 160 / 8%);
}

.card__info {
    padding: 23px 19px 32px;
}

.card__attribute-list {
    margin-bottom: 21px;
}

.card__attribute-item {
    font-size: 14px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
        flex-wrap: wrap;
    -webkit-box-pack: end;
        -ms-flex-pack: end;
            justify-content: flex-end;
    -webkit-box-align: start;
        -ms-flex-align: start;
            align-items: flex-start;
    margin-bottom: 11px;
}

.card__attribute-title {
    letter-spacing: .01em;
    color: var(--color-grey-light);
    display: inline-block;
    margin-right: auto;
    text-align: left;
}

.card__attribute-info {
    color: var(--color-grey-dark);
    text-align: right;
}

.card__attribute-info-item {
    font-size: 13px;
    margin: 0 -5px 1px 10px;
    color: var(--color-grey-dark);
    cursor: pointer;
    display: block;
    padding: 2px 5px;
    position: relative;
    z-index: 2;
}

.card__attribute-info-item::after {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    display: block;
    z-index: -1;
    opacity: 0;
    background: var(--color-gradient);
    border-radius: 3px;
    -webkit-transition: all .3s;
    -o-transition: all .3s;
    transition: all .3s;
}

.card__attribute-info-item.active {
    cursor: default;
}

.card__attribute-info-item.active::after {
    opacity: 1;
}

.card__price {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: end;
        -ms-flex-pack: end;
            justify-content: flex-end;
    -webkit-box-align: end;
        -ms-flex-align: end;
            align-items: flex-end;
    font-size: 20px;
    letter-spacing: .025em;
    font-family: 'Droid Serif', serif;
    color: var(--color-accent);
    margin-bottom: 22px;
}

.card__price-old {
    font-size: 16px;
    color: var(--color-grey-light);
    text-decoration: line-through;
    margin-right: auto;
}

.card__btn {
    height: 52px;
}

.about {
    padding: 64px 0;
}

.about__inner {
    position: relative;
}

.about__img {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
}

.about__count {
    display:  none;
}

.about__list {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
        flex-wrap: wrap;
    -webkit-box-pack: justify;
        -ms-flex-pack: justify;
            justify-content: space-between;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
}

.about__item {
    text-align: right;
    width: 390px;
    position: relative;
    padding-right: 55px;
    margin: 206px 0 0 19px;
}

.about__item::before {
    content: '';
    width: 22px;
    height: 22px;
    display: block;
    background: var(--color-gradient);
    border-radius: 50%;
    position: absolute;
    top: 50%;
    right: 0;
    margin-top: -11px;
}

.about__item-img {
    display: none;
}

.about__item-title {
    font-size: 18px;
    font-weight: 500;
    color: var(--color-grey-dark);
    margin-bottom: 10px;
}

.about__text {
    line-height: 1.4;
}

.about__item:nth-child(-n+2) {
    margin-top: 54px;
}

.about__item:nth-child(-n+2) .about__item-title {
    margin-bottom: 6px;
}

.about__item:nth-child(2n) {
    text-align: left;
    margin-right: 15px;
    margin-left: 0;
    padding-right: 0;
    padding-left: 53px;
}

.about__item:nth-child(2n)::before {
    right: auto;
    left: 0;
}

.catalog {
    padding: 59px 0 51px;
    text-align: center;
}

.catalog__title br {
    display: none;
}

.catalog__text {
    margin-bottom: 29px;
}

.catalog__btn {
    font-size: 15px;
    margin-bottom: 40px;
}

.catalog__modal-catalog {
    display: none;
}

.use {
    background: var(--color-bg-light);
    padding: 74px 0 80px;
}

.use__list {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
        flex-wrap: wrap;
    -webkit-box-pack: justify;
        -ms-flex-pack: justify;
            justify-content: space-between;
}

.use__item {
    background: var(--color-white);
    border-radius: 15px;
    -webkit-box-shadow: 0 0 43px rgb(var(--color-black) / 4%);
            box-shadow: 0 0 43px rgb(var(--color-black) / 4%);
    width: 510px;
    margin-bottom: 30px;
    margin-left: 68px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    min-height: 242px;
    max-width: calc(50% - 80px);
}

.use__img {
    width: 145px;
    height: 145px;
    border-radius: 50%;
    padding: 6px;
    border: 1px solid #f0e1db;
    margin-left: -68px;
}

.use__info {
    margin-left: 22px;
    width: calc(100% - 130px);
}

.use__item-title {
    font-size: 18px;
    font-weight: 600;
    line-height: 22px;
    margin-bottom: 9px;
}

.use__text {
    line-height: 24px;
}

.use__text b {
    font-weight: 500;
}

.quiz {
    padding: 115px 0 120px;
}

.quiz__container {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    border-radius: 15px;
    -webkit-box-shadow: 0 0 43px rgb(var(--color-black) / 4%);
            box-shadow: 0 0 43px rgb(var(--color-black) / 4%);
    overflow: hidden;
    text-align: center;
    background: var(--color-white);
}

.quiz__inner {
    width: calc(100% - 330px);
    padding: 47px 0 0;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
}

.quiz__way {
    font-size: 12px;
    letter-spacing: .01em;
    color: var(--color-grey-light);
    margin-bottom: 25px;
}

.quiz__tracker {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
    margin-bottom: 34px;
}

.quiz__tracker-item {
    width: 61px;
    height: 7px;
    border-radius: 10px;
    background: #d1d1d0;
    margin: 0 5px 10px;
    position: relative;
    overflow: hidden;
}

.quiz__tracker-item::after {
    content: '';
    display: block;
    top: 0;
    left: 0;
    width: 0;
    height: 100%;
    background: var(--color-gradient);
    -webkit-transition: all .3s;
    -o-transition: all .3s;
    transition: all .3s;
}

.quiz__tracker-item--active::after {
    width: 100%;
}

.quiz__question-list {
    -webkit-box-flex: 1;
        -ms-flex: 1;
            flex: 1;
    width: 100%;
}

.quiz__question-inner {
    min-height: 100%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
    padding-bottom: 63px;
    position: relative;
}

.quiz__question-title {
    font-size: 20px;
    font-weight: 600;
    line-height: 28px;
    letter-spacing: .025em;
    color: var(--color-grey-dark);
    margin-bottom: 37px;
}

.quiz__answer-list {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
        flex-wrap: wrap;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
    margin: 0 auto;
}

.quiz__answer-list--2-column {
    width: 580px;
    max-width: 100%;
}

.quiz__answer {
    margin: 0 10px 38px;
    position: relative;
}

.quiz__answer-input {
    position: absolute;
    visibility: hidden;
    width: 0;
    height: 0;
}

.quiz__answer-img-container {
    position: relative;
    margin-bottom: 21px;
}

.quiz__answer-img-container::after {
    content: '';
    width: 34px;
    height: 34px;
    border: 3px solid var(--color-white);
    display: block;
    border-radius: 50%;
    position: absolute;
    bottom: 0;
    left: 50%;
    -webkit-transform: translate(-50%, 50%);
        -ms-transform: translate(-50%, 50%);
            transform: translate(-50%, 50%);
    background: #e1dfdd;
}

.quiz__answer-img {
    border-radius: 10px;
}

.quiz__answer-text {
    font-size: 14px;
    letter-spacing: .025em;
}

.quiz__answer-input:checked + .quiz__answer-img-container::after {
    background: url(../img/icon/checked.png) no-repeat 9px 9px, var(--color-gradient);
}

.quiz__answer-input:checked ~ .quiz__answer-text {
    font-weight: 500;
    color: var(--color-grey-dark);
}

.quiz__prev {
    margin: auto auto 0;
    opacity: .7;
}

.quiz__prev:hover {
    opacity: 1;
}

.quiz__next {
    margin: auto auto 0;
    width: 220px;
}

.quiz__next::after {
    content: '';
    width: 6px;
    height: 10px;
    background: url(../img/icon/arrow-small.png) no-repeat center;
    margin-left: 8px;
    margin-right: -5px;
}

.quiz__question-inner--no-padding {
    padding: 0;
}

.quiz__question-inner--bg-whatsapp::after {
    content: '';
    position: absolute;
    bottom: 0;
    left: 0;
    width: 473px;
    height: 528px;
    background: url(../img/bg/whatsapp.png) no-repeat center;
}

.quiz__question-inner--bg-instagram::after {
    content: '';
    position: absolute;
    bottom: -14px;
    left: 14px;
    width: 491px;
    height: 502px;
    background: url(../img/bg/instagram-v3.png) no-repeat center / contain;
}

.quiz__form {
    position: relative;
    z-index: 2;
    width: 410px;
    max-width: 100%;
    margin: 41px 0 0 414px;
}

.quiz__form-title {
    line-height: 24px;
    letter-spacing: .025em;
    margin-bottom: 34px;
}

.quiz__form-title b {
    font-weight: 600;
}

.quiz__form-option {
    margin-bottom: 17px;
}

.quiz__form-option-text {
    font-size: 14px;
    letter-spacing: .025em;
    color: var(--color-grey-light);
    margin-bottom: 24px;
}

.quiz__form-option-list {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
        flex-wrap: wrap;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
}

.quiz__form-option-item {
    position: relative;
    width: 89px;
    margin: 0 4px 8px;
    cursor: pointer;
}

.quiz__form-option-input {
    position: absolute;
    visibility: hidden;
    width: 0;
    height: 0;
}

.quiz__form-option-container {
    padding: 15px 6px 16px;
    -webkit-transition: all .3s;
    -o-transition: all .3s;
    transition: all .3s;
}

.quiz__form-option-input:checked + .quiz__form-option-container {
    background: var(--color-white);
    border-radius: 4px;
    -webkit-box-shadow: 0 0 43px rgb(var(--color-black) / 4%);
            box-shadow: 0 0 43px rgb(var(--color-black) / 4%);
}

.quiz__form-option-icon {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    height: 24px;
}

.quiz__form-option-name {
    font-size: 11px;
    letter-spacing: .01em;
    margin-top: 6px;
    border-bottom: 1px dashed;
    display: inline-block;
}

.quiz__form-option-name--whatsapp {
    color: #44f996;
}

.quiz__form-option-name--telegram {
    color: #a2e0ff;
}

.quiz__form-input {
    -webkit-box-shadow: 0 0 43px rgb(var(--color-black) / 4%);
            box-shadow: 0 0 43px rgb(var(--color-black) / 4%);
    width: 260px;
    padding-left: 64px;
    margin-bottom: 14px;
}

.quiz__form-input--phone {
    background: url(../img/icon/phone-call.png) no-repeat 20px center / 22px 22px, -o-linear-gradient(#f6f6f6, #f6f6f6) no-repeat 51px center / 1px 26px, var(--color-white);
    background: url(../img/icon/phone-call.png) no-repeat 20px center / 22px 22px, -webkit-gradient(linear, left top, left bottom, from(#f6f6f6), to(#f6f6f6)) no-repeat 51px center / 1px 26px, var(--color-white);
    background: url(../img/icon/phone-call.png) no-repeat 20px center / 22px 22px, linear-gradient(#f6f6f6, #f6f6f6) no-repeat 51px center / 1px 26px, var(--color-white);
}

.quiz__form-btn {
    width: 260px;
    margin-bottom: 28px;
}

.quiz__form-ps {
    color: var(--color-grey-light);
    font-size: 12px;
    letter-spacing: .01em;
}

.quiz__finish {
    position: relative;
    z-index: 2;
}

.quiz__finish-title {
    font-size: 20px;
    font-weight: 600;
    line-height: 28px;
    letter-spacing: .025em;
    margin-bottom: 14px;
}

.quiz__finish-text {
    line-height: 24px;
    letter-spacing: .025em;
    color: var(--color-grey-light);
    margin-bottom: 90px;
}

.quiz__lead {
    width: 410px;
    max-width: 100%;
    margin-left: 412px;
}

.quiz__lead-title {
    font-family: 'Droid Serif', serif;
    letter-spacing: 0;
    font-size: 20px;
    line-height: 30px;
    margin-bottom: 25px;
}

.quiz__lead-text {
    letter-spacing: .025em;
    margin-bottom: 27px;
}

.quiz__lead-list {
    margin-bottom: 38px;
}

.quiz__lead-item {
    font-size: 14px;
    color: var(--color-grey-light);
    margin-bottom: 11px;
}

.quiz__lead-btn {
    width: 260px;
}

.quiz__present {
    width: 330px;
    background: var(--color-bg);
    letter-spacing: 0;
    padding: 65px 0 80px;
}

.quiz__present-title {
    font-size: 18px;
    font-weight: 600;
    line-height: 24px;
    color: var(--color-grey-dark);
    max-width: 235px;
    margin: 0 auto 26px;
}

.quiz__present-main {
    font-size: 30px;
    color: var(--color-accent);
    font-family: 'Droid Serif', serif;
    letter-spacing: .025em;
    margin-bottom: 2px;
}

.quiz__present-main-discount {
    display: block;
    font-size: 48px;
    margin-top: 6px;
}

.quiz__present-first {
    line-height: 22px;
    max-width: 260px;
    margin: 0 auto 24px;
}

.quiz__present-img {
    margin-left: auto;
    margin-bottom: -18px;
}

.quiz__present-plus {
    font-family: 'Droid Serif', serif;
    font-size: 40px;
    color: var(--color-accent);
}

.quiz__present-second {
    line-height: 20px;
    letter-spacing: .025em;
    color: var(--color-grey-dark);
    max-width: 270px;
    margin: 0 auto 10px;
}

.quiz__present-second br {
    display: none;
}

.quiz__present-old-price {
    font-size: 18px;
    color: var(--color-grey-light);
    text-decoration: line-through;
    margin-bottom: 7px;
}

.quiz__present-price {
    font-family: 'Droid Serif', serif;
    font-size: 30px;
    text-transform: uppercase;
    letter-spacing: .025em;
    color: var(--color-accent);
}

.care {
    background: url(../img/bg/care.jpg) no-repeat center / cover;
    padding: 104px 0 120px;
    position: relative;
    z-index: 2;
}

.care__inner {
    width: 560px;
    max-width: 100%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
}

.care__title {
    text-align: left;
    margin-bottom: 45px;
    -webkit-box-ordinal-group: 2;
        -ms-flex-order: 1;
            order: 1;
}

.care__text {
    font-size: 18px;
    line-height: 28px;
    color: var(--color-grey-dark);
    margin-bottom: 35px;
    -webkit-box-ordinal-group: 3;
        -ms-flex-order: 2;
            order: 2;
}

.care__list {
    margin-left: 17px;
    margin-bottom: 29px;
    -webkit-box-ordinal-group: 4;
        -ms-flex-order: 3;
            order: 3;
}

.care__item {
    padding-left: 24px;
    position: relative;
    margin-bottom: 21px;
}

.care__item::before {
    content: '';
    width: 16px;
    height: 16px;
    display: block;
    background: -o-radial-gradient(var(--color-accent) 3px, transparent 3px, transparent 7px, var(--color-accent) 8px);
    background: radial-gradient(var(--color-accent) 3px, transparent 3px, transparent 7px, var(--color-accent) 8px);
    border-radius: 50%;
    position: absolute;
    top: 2px;
    left: 0;
}

.care__item br {
    display: none;
}

.care__video {
    position: absolute;
    top: 205px;
    left: calc(50% + 434px);
    font-size: 14px;
    letter-spacing: 0;
    color: var(--color-grey);
    background: rgb(255 255 255 / 80%);
    border-radius: 5px;
    width: 166px;
    padding: 10px 15px 11px 42px;
}

.care__video::before {
    content: '';
    width: 68px;
    height: 68px;
    border-radius: 50%;
    display: block;
    position: absolute;
    top: -5px;
    left: -37px;
    background: url(../img/icon/play.png) no-repeat top 20px left 26px, var(--color-gradient);
}

.care__btn {
    -webkit-box-ordinal-group: 5;
        -ms-flex-order: 4;
            order: 4;
}

.review {
    padding: 113px 0 120px;
}

.review__title {
    margin-bottom: 17px;
    letter-spacing: 0;
}

.review__text {
    text-align: center;
    letter-spacing: .025em;
    color: var(--color-grey-light);
    margin-bottom: 56px;
}

.review__item {
    width: auto;
    -webkit-transform: scale(.77);
        -ms-transform: scale(.77);
            transform: scale(.77);
    -webkit-transition: all .3s;
    -o-transition: all .3s;
    transition: all .3s;
}

.review__item--prev,
.review__item--next {
    -webkit-transform: scale(.89);
        -ms-transform: scale(.89);
            transform: scale(.89);
}

.review__item--center {
    -webkit-transform: scale(1);
        -ms-transform: scale(1);
            transform: scale(1);
}

.review__link {
    display: block;
    position: relative;
    margin: 0 5px;
}

.review__link::before {
    content: '';
    display: block;
    background: rgb(255 255 255 / 30%);
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    z-index: 2;
    -webkit-transition: all .3s;
    -o-transition: all .3s;
    transition: all .3s;
}

.review__item--prev .review__link::before,
.review__item--next .review__link::before {
    background: rgb(255 255 255 / 15%);
}

.review__item--center .review__link::before {
    background: rgb(255 255 255 / 0%);
}

.review__btn-prev {
    left: calc(50% - 144px);
}

.review__btn-next {
    left: auto;
    right: calc(50% - 144px);
}

.special {
    background: url(../img/bg/special.jpg) no-repeat center / cover;
    padding: 95px 0 93px;
    position: relative;
    z-index: 2;
}

.special__inner {
    width: 600px;
    margin-left: auto;
}

.special__title {
    text-align: left;
    font-size: 36px;
    max-width: 530px;
    margin-bottom: 26px;
}

.special__title br {
    display: none;
}

.special__old-price {
    color: var(--color-white);
    position: relative;
    z-index: 2;
    display: inline-block;
    padding: 13px 20px;
    margin-left: 5px;
    margin-bottom: 27px;
}

.special__old-price::after {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: var(--color-gradient);
    z-index: -1;
    -webkit-transform: skew(-13deg);
        -ms-transform: skew(-13deg);
            transform: skew(-13deg);
    border-radius: 4px;
}

.special__list {
    margin-bottom: 44px;
}

.special__item {
    position: relative;
    font-size: 18px;
    line-height: 24px;
    padding-left: 25px;
    margin-bottom: 17px;
}

.special__item::before {
    content: '';
    width: 16px;
    height: 16px;
    display: block;
    background: -o-radial-gradient(var(--color-accent) 3px, transparent 3px, transparent 7px, var(--color-accent) 8px);
    background: radial-gradient(var(--color-accent) 3px, transparent 3px, transparent 7px, var(--color-accent) 8px);
    border-radius: 50%;
    position: absolute;
    top: 5px;
    left: 1px;
}

.special__item br {
    display: none;
}

.special__text {
    font-size: 18px;
    line-height: 28px;
    color: var(--color-grey-dark);
    letter-spacing: .025em;
    max-width: 560px;
    margin-bottom: 26px;
}

.special__info {
    position: absolute;
    top: 217px;
    left: calc(50% - 510px);
    width: 130px;
    height: 130px;
    background: var(--color-white);
    border-radius: 50%;
    text-align: center;
    border: 5px solid var(--color-white);
    -webkit-box-shadow: 0 0 16px rgb(180 166 160 / 8%), inset 0 0 0 1px rgb(240 225 219 / 30%);
            box-shadow: 0 0 16px rgb(180 166 160 / 8%), inset 0 0 0 1px rgb(240 225 219 / 30%);
    color: var(--color-grey-light);
    letter-spacing: 0;
    padding-top: 26px;
    font-size: 14px;
}

.special__info span {
    color: var(--color-accent);
    font-family: 'Droid Serif', serif;
    font-size: 30px;
    line-height: calc(100% + 4px);
    display: block;
}

.showroom {
    padding: 113px 0 75px;
}

.showroom__inner {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
        -ms-flex-pack: justify;
            justify-content: space-between;
    -webkit-box-align: start;
        -ms-flex-align: start;
            align-items: flex-start;
}

.showroom__left {
    width: 750px;
    max-width: calc(100% - 20px - 370px - 60px);
    margin-right: 20px;
}

.showroom__title {
    text-align: left;
}

.showroom__map {
    position: relative;
}

.showroom__map-img {
    position: absolute;
    top: -134px;
    left: -67px;
    max-width: none;
}

.showroom__marker {
    position: absolute;
    top: 48px;
    left: 218px;
    z-index: 2;
}

.showroom__dot {
    position: absolute;
    z-index: 2;
}

.showroom__dot-img {
    width: 31px;
    height: 31px;
    background: var(--color-accent);
    border-radius: 50%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
}

.showroom__dot--gum {
    top: 257px;
    left: 210px;
}

.showroom__dot--area {
    top: 337px;
    left: 314px;
}

.showroom__info {
    position: absolute;
    top: 50%;
    left: 50%;
    width: 269px;
    background: var(--color-white);
    padding: 17px 16px 8px 24px;
    border-radius: 8px;
    -webkit-box-shadow: 0 0 43px rgb(var(--color-black) / 4%);
    box-shadow: 0 0 43px rgb(var(--color-black) / 4%);
    font-size: 12px;
    letter-spacing: 0;
    -webkit-transform: translate(0, -50%);
        -ms-transform: translate(0, -50%);
            transform: translate(0, -50%);
    z-index: -1;
}

.showroom__dot .showroom__info {
    width: -webkit-max-content;
    width: -moz-max-content;
    width: max-content;
    min-width: 100px;
    max-width: 269px;
    text-align: center;
    top: auto;
    bottom: calc(100% - 6px);
    -webkit-transform: translate(-50%, 0);
        -ms-transform: translate(-50%, 0);
            transform: translate(-50%, 0);
    padding: 10px 17px 13px;
}

.showroom__info-title {
    color: var(--color-grey-light);
    margin-bottom: 2px;
}

.showroom__info-text {
    margin-bottom: 12px;
}

.showroom__info-text--big {
    font-size: 14px;
}

.showroom__info-text a {
    color: var(--color-grey);
}

.showroom__info-text a:hover {
    color: var(--color-accent);
}

.showroom__form {
    margin-right: 60px;
}

.form {
    width: 370px;
    background: var(--color-bg);
    border-radius: 15px;
    text-align: center;
    padding: 59px 30px;
    position: relative;
    z-index: 2;
    max-width: 100%;
}

.form::after {
    content: '';
    display: block;
    position: absolute;
    top: 10px;
    left: 10px;
    right: 10px;
    bottom: 10px;
    border: 1px solid #f0e1db;
    border-radius: 15px;
    z-index: -1;
}

.form__title {
    font-family: 'Droid Serif', serif;
    font-size: 20px;
    line-height: 30px;
    letter-spacing: .025em;
    text-transform: uppercase;
    margin-bottom: 14px;
}

.form__option {
    margin-bottom: 5px;
}

.form__option-text {
    font-size: 14px;
    letter-spacing: .025em;
    color: var(--color-grey-light);
    margin-bottom: 23px;
}

.form__option-list {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: start;
        -ms-flex-align: start;
            align-items: flex-start;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
    -ms-flex-wrap: wrap;
        flex-wrap: wrap;
}

.form__option-item {
    margin: 0 13px 26px;
    cursor: pointer;
}

.form__option-input {
    position: absolute;
    visibility: hidden;
    width: 0;
    height: 0;
}

.form__option-icon {
    height: 26px;
    background-repeat: no-repeat;
    background-position: center;
    margin-bottom: 6px;
}

.form__option-icon--whatsapp {
    background-image: url(../img/icon/whatsapp-color.png);
}

.form__option-icon--viber {
    background-image: url(../img/icon/viber-active.png);
}

.form__option-icon--telegram {
    background-image: url(../img/icon/telegram.png);
}

.form__option-icon--email {
    background-image: url(../img/icon/email.png);
}

.form__option-name {
    font-size: 10px;
    color: #c4bfbf;
    border-bottom: 1px dotted;
}

.form__option-input:checked ~ .form__option-icon--whatsapp {
    background-image: url(../img/icon/whatsapp-active.png);
}

.form__option-input:checked ~ .form__option-icon--viber {
    background-image: url(../img/icon/viber-active.png);
}

.form__option-input:checked ~ .form__option-icon--telegram {
    background-image: url(../img/icon/telegram-active.png);
}

.form__option-input:checked ~ .form__option-icon--email {
    background-image: url(../img/icon/email-active.png);
}

.form__option-input:checked ~ .form__option-name {
    color: #fcc445;
}

.form__btn {
    font-size: 12px;
    margin-bottom: 20px;
}

.form__agreement {
    font-size: 11px;
    font-weight: 300;
    letter-spacing: 0;
    width: 215px;
    margin: 0 auto;
}

.instagram {
    padding: 145px 0 141px;
    position: relative;
    z-index: 2;
}

.instagram::after {
    content: '';
    width: 444px;
    height: 636px;
    display: block;
    background: url(../img/bg/instagram-v3.png) no-repeat center;
    position: absolute;
    bottom: 0;
    left: calc(50% + 56px);
}

.instagram__inner {
    width: 500px;
    max-width: 100%;
}

.instagram__title {
    text-align: left;
    letter-spacing: 0;
    margin-bottom: 34px;
}

.instagram__text {
    font-size: 18px;
    line-height: 30px;
    letter-spacing: .025em;
    color: var(--color-grey-dark);
    margin-bottom: 23px;
}

.instagram__list {
    margin-left: 40px;
    margin-bottom: 50px;
}

.instagram__item {
    position: relative;
    padding-left: 24px;
    margin-bottom: 21px;
}

.instagram__item::before {
    content: '';
    width: 16px;
    height: 16px;
    display: block;
    background: -o-radial-gradient(var(--color-accent) 3px, transparent 3px, transparent 7px, var(--color-accent) 8px);
    background: radial-gradient(var(--color-accent) 3px, transparent 3px, transparent 7px, var(--color-accent) 8px);
    border-radius: 50%;
    position: absolute;
    top: 2px;
    left: 0;
}

/**********************************/
/************ 8. Popup ************/
/**********************************/

.arcticmodal-overlay,
.arcticmodal-container { position: fixed; left: 0; top: 0; right: 0; bottom: 0; z-index: 1000; }
.arcticmodal-container { overflow: auto; margin: 0; padding: 0; border: 0; border-collapse: collapse; }
*:first-child+html .arcticmodal-container { height: 100% }
.arcticmodal-container_i { height: 100%; margin: 0 auto; }
.arcticmodal-container_i2 { padding: 10px 5px; margin: 0; border: 0; vertical-align: middle; }
.arcticmodal-error { padding: 20px; border-radius: 10px; background: #000; color: #fff; }
.arcticmodal-loading { width: 80px; height: 80px; border-radius: 10px; background: #000 url(../img/loading.gif) no-repeat 50% 50%; }

.modal {
    position: relative;
    z-index: 2;
    width: 890px;
    max-width: calc(100vw - 35px);
    background: var(--color-white);
    -webkit-box-shadow: 0 0 43px rgb(var(--color-black) / 4%);
            box-shadow: 0 0 43px rgb(var(--color-black) / 4%);
    border-radius: 15px;
}

.modal--small {
    width: 570px;
}

.modal::before {
    content: '';
    position: absolute;
    left: 0;
    bottom: 0;
    z-index: 2;
    display: block;
}

.modal--bg-whatsapp::before {
    background: url(../img/bg/whatsapp-v2.png) no-repeat center;
    width: 457px;
    height: 599px;
}

.modal--bg-tablet::before {
    background: url(../img/bg/tablet.png) no-repeat center;
    width: 361px;
    height: 552px;
}

.modal--bg-woman::before {
    background: url(../img/bg/woman.png) no-repeat center;
    width: 556px;
    height: 665px;
}

.modal--bg-catalog::before {
    background: url(../img/bg/catalog.png) no-repeat center;
    width: 510px;
    height: 690px;
}

.modal--bg-instagram::before {
    background: url(../img/bg/instagram-v3.png) no-repeat center / contain;
    width: 440px;
    height: 504px;
}

.modal::after {
    content: '';
    position: absolute;
    top: 20px;
    left: 20px;
    right: 20px;
    bottom: 20px;
    border: 1px solid #f0e1db;
    border-radius: 15px;
    z-index: 1;
}

.modal__close {
    position: absolute;
    right: 39px;
    top: 39px;
    fill: #e4e4e4;
    width: 20px;
    height: 20px;
    cursor: pointer;
    -webkit-transition: all .3s;
    -o-transition: all .3s;
    transition: all .3s;
    z-index: 4;
}

.modal__close:hover {
    fill: var(--color-accent);
}

.modal__inner {
    padding: 101px 50px 90px 410px;
    position: relative;
    z-index: 3;
}

.modal__info {
    min-height: 193px;
    margin-bottom: 25px;
}

.modal__title {
    font-size: 24px;
    line-height: 36px;
    letter-spacing: .025em;
    font-family: 'Droid Serif', serif;
    text-transform: uppercase;
    margin-bottom: 25px;
}

.modal__description {
    width: 440px;
    max-width: 100%;
    font-size: 18px;
    line-height: 24px;
    letter-spacing: .025em;
    color: var(--color-grey-light);
}

.modal__input {
    width: 330px;
    height: 71px;
    font-size: 16px;
    font-weight: 400;
    margin: 0 0 10px;
    -webkit-box-shadow: 0 0 43px rgb(var(--color-black) / 4%);
            box-shadow: 0 0 43px rgb(var(--color-black) / 4%);
    padding-left: 85px;
    letter-spacing: .1em;
}

.modal__input--user {
    background: url(../img/icon/user.png) no-repeat 22px center / 30px 30px, -o-linear-gradient(#f6f6f6, #f6f6f6) no-repeat 64px center / 1px 41px, var(--color-white);
    background: url(../img/icon/user.png) no-repeat 22px center / 30px 30px, -webkit-gradient(linear, left top, left bottom, from(#f6f6f6), to(#f6f6f6)) no-repeat 64px center / 1px 41px, var(--color-white);
    background: url(../img/icon/user.png) no-repeat 22px center / 30px 30px, linear-gradient(#f6f6f6, #f6f6f6) no-repeat 64px center / 1px 41px, var(--color-white);
}

.modal__input--phone {
    background: url(../img/icon/phone-call.png) no-repeat 22px center / 31px 31px, -o-linear-gradient(#f6f6f6, #f6f6f6) no-repeat 64px center / 1px 41px, var(--color-white);
    background: url(../img/icon/phone-call.png) no-repeat 22px center / 31px 31px, -webkit-gradient(linear, left top, left bottom, from(#f6f6f6), to(#f6f6f6)) no-repeat 64px center / 1px 41px, var(--color-white);
    background: url(../img/icon/phone-call.png) no-repeat 22px center / 31px 31px, linear-gradient(#f6f6f6, #f6f6f6) no-repeat 64px center / 1px 41px, var(--color-white);
}

.modal__btn {
    margin-top: 9px;
    margin-bottom: 20px;
    width: 330px;
}

.modal__agreement {
    font-size: 12px;
    font-weight: 300;
    letter-spacing: 0;
    width: 350px;
    max-width: 100%;
}

.modal__content {
    padding-top: 40px;
    padding-bottom: 63px;
}

.modal__content-title {
    font-family: 'Droid Serif', serif;
    font-size: 24px;
    line-height: 36px;
    letter-spacing: .025em;
    text-transform: uppercase;
    margin-bottom: 27px;
}

.modal__content-text {
    line-height: 24px;
    letter-spacing: .025em;
    color: var(--color-grey-light);
    width: 382px;
    max-width: 100%;
    margin-bottom: 55px;
}

.modal__content-btn {
    width: 330px;
}

.modal__inner--center {
    padding: 71px 40px;
    text-align: center;
}

.modal__inner--center .modal__info {
    min-height: auto;
    margin-bottom: 38px;
}

.modal__inner--center .modal__description,
.modal__inner--center .modal__input,
.modal__inner--center .modal__agreement {
    margin-left: auto;
    margin-right: auto;
}

.modal__map {
    padding: 70px 30px 30px;
}

.modal__map iframe {
    width: 100%;
    height: 300px;
    border-radius: 15px;
    border: 0;
}

/**********************************/
/************ 9. Media ************/
/**********************************/

/******************************************/
/************ 9.1 Wide screens ************/
/******************************************/

@media screen and (max-width: 1240px) {
    .wrap {
        padding: 0 10px;
        width: auto;
    }

    .menu__item {
        margin: 0 10px;
    }

    .main {
        min-height: auto;
        padding: 150px 0 100px;
    }

    .card-list__inner {
        -ms-grid-columns: calc(33.3333% - 26px / 3) 13px calc(33.3333% - 26px / 3) 13px calc(33.3333% - 26px / 3);
        grid-template-columns: repeat(3, calc(33.3333% - 26px / 3));
    }

    .about__item {
        width: calc(50% - 175px);
        margin-top: 233px;
        margin-right: 175px;
        margin-left: 0;
        min-height: 120px;
    }

    .about__item:nth-child(2n) {
        margin-left: 175px;
        margin-right: 0;
    }

    .about__item:nth-child(-n+2) {
        margin-top: 35px;
    }

    .about__item::before {
        top: 44px;
    }

    .about__text {
        font-size: 14px;
    }

    .quiz__answer {
        width: 230px;
        max-width: calc(33.3333% - 20px);
    }

    .quiz__answer-list {
        width: 100%;
    }

    .quiz__question-inner--bg-whatsapp::after,
    .quiz__question-inner--bg-instagram::after {
        display: none;
    }

    .quiz__form {
        margin-left: auto;
        margin-right: auto;
        margin: 0 auto;
    }

    .quiz__finish-text {
        margin-bottom: 50px;
    }

    .quiz__lead {
        margin-left: auto;
        margin-right: auto;
    }

    .special__info {
        left: calc(50% - 450px);
    }

    .footer__menu {
        margin-left: 50px;
    }

    .footer__menu .menu__list {
        -ms-grid-columns: 1fr 10px 1fr 10px 1fr;
        grid-template-columns: repeat(3, 1fr);
    }

    .footer__menu .menu__item {
        margin-right: 10px;
    }

    .footer__social {
        margin-left: 50px;
    }
}

/*************************************/
/************ 9.2 Tablets ************/
/*************************************/

@media screen and (max-width: 1024px) {
    .header__wrap {
        -webkit-box-pack: start;
            -ms-flex-pack: start;
                justify-content: flex-start;
        -webkit-box-align: center;
            -ms-flex-align: center;
                align-items: center;
    }

    .header__logo {
        margin: 0;
    }

    .menu {
        position: relative;
    }

    .header__menu {
        margin-top: 0;
        margin-left: 20px;
    }

    .menu__btn {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-align: center;
            -ms-flex-align: center;
                align-items: center;
        cursor: pointer;
    }

    .menu__btn-line {
        display: block;
        width: 30px;
        height: 3px;
        border-radius: 5px;
        background: var(--color-grey-light);
        margin: 4px 0;
        -webkit-transition: all .3s;
        -o-transition: all .3s;
        transition: all .3s;
    }

    .menu__btn-text {
        margin-left: 6px;
        color: var(--color-grey-light);
        -webkit-transition: all .3s;
        -o-transition: all .3s;
        transition: all .3s;
    }

    .menu__btn:hover .menu__btn-line {
        background: var(--color-accent);
    }

    .menu__btn:hover .menu__btn-text {
        color: var(--color-accent);
    }

    .menu__list {
        position: absolute;
        top: calc(100% + 5px);
        left: 0;
        background: var(--color-white);
        -webkit-box-shadow: 0 0 43px rgb(var(--color-black) / 4%);
                box-shadow: 0 0 43px rgb(var(--color-black) / 4%);
        padding: 10px;
        border-radius: 15px;
        z-index: 2;
        width: 210px;
        display: none;
    }

    .menu__list::after {
        content: '';
        display: block;
        position: absolute;
        top: 10px;
        left: 10px;
        right: 10px;
        bottom: 10px;
        border: 1px solid rgb(240 225 219 / 30%);
        border-radius: 15px;
        z-index: -1;
    }

    .menu__item {
        margin: 0;
    }

    .menu__link {
        display: block;
        padding: 8px 15px;
    }

    .header__phone {
        margin-left: auto;
        -webkit-box-shadow: 0 0 43px rgb(var(--color-black) / 4%);
                box-shadow: 0 0 43px rgb(var(--color-black) / 4%);
    }

    .main::after {
        content: '';
        background: var(--color-white);
        opacity: .7;
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        z-index: -1;
    }

    .popular {
        padding: 70px 0 10px;
    }

    .card-list__inner {
        -ms-grid-columns: calc(50% - 26px / 2) 13px calc(50% - 26px / 2);
        grid-template-columns: repeat(2, calc(50% - 26px / 2));
    }

    .about {
        padding: 40px 0;
    }

    .about__img {
        display: none;
    }

    .about__list {
        position: relative;
        top: auto;
        left: auto;
        -webkit-box-align: start;
            -ms-flex-align: start;
                align-items: flex-start;
    }

    .about__item,
    .about__item:nth-child(-n+2) {
        width: calc(50% - 20px);
        padding-left: 40px;
        padding-right: 0;
        text-align: left;
        margin: 0 0 40px;
        min-height: auto;
    }

    .about__item:nth-child(2n) {
        margin-left: auto;
        padding-left: 40px;
    }

    .about__item::before {
        right: auto;
        left: 0;
        top: 11px;
    }

    .use__item {
        max-width: calc(100% - 68px);
    }

    .use__list {
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
            -ms-flex-direction: column;
                flex-direction: column;
        -webkit-box-align: center;
            -ms-flex-align: center;
                align-items: center;
        -webkit-box-pack: center;
            -ms-flex-pack: center;
                justify-content: center;
    }

    .quiz {
        padding: 80px 0;
    }

    .quiz__container {
        -webkit-box-orient: vertical;
        -webkit-box-direction: reverse;
            -ms-flex-direction: column-reverse;
                flex-direction: column-reverse;
    }

    .quiz__present {
        width: 100%;
        padding: 25px 10px;
        font-size: 14px;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -ms-flex-wrap: wrap;
            flex-wrap: wrap;
        -webkit-box-align: center;
            -ms-flex-align: center;
                align-items: center;
        -webkit-box-pack: center;
            -ms-flex-pack: center;
                justify-content: center;
    }

    .quiz__present-img {
        display: none;
    }

    .quiz__present-title {
        width: 100%;
        max-width: 100%;
    }

    .quiz__present-plus {
        margin: 0 20px;
        width: 30px;
    }

    .quiz__present-column {
        max-width: calc((100% - 70px) / 2);
    }

    .quiz__present-first {
        margin-bottom: 0;
    }

    .quiz__inner {
        width: 100%;
    }

    .care {
        padding: 80px 0;
    }

    .care::after {
        content: '';
        background: var(--color-white);
        opacity: .5;
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        z-index: -1;
    }

    .review {
        padding: 80px 0;
    }

    .special {
        padding: 80px 0;
    }

    .special__inner {
        width: calc(50% + 105px);
    }

    .special__list {
        margin-bottom: 30px;
    }

    .special__item {
        font-size: 16px;
        line-height: 21px;
    }

    .special__item::before {
        top: 2px;
    }

    .special__text {
        font-size: 16px;
        line-height: 24px;
    }

    .special__info {
        left: calc(50% - 315px);
    }

    .showroom {
        padding: 80px 0;
    }

    .showroom__inner {
        display: block;
    }

    .showroom__left {
        max-width: 100%;
        width: 100%;
    }

    .showroom__title {
        text-align: center;
    }
    
    .showroom__map {
        height: 450px;
        width: 500px;
        margin: 0 auto;
        max-width: 100%;
        -webkit-transform: translate(-85px, 0);
            -ms-transform: translate(-85px, 0);
                transform: translate(-85px, 0);
    }

    .showroom__form {
        margin: 0 auto;
    }

    .instagram__text {
        font-size: 16px;
        line-height: 24px;
    }

    .instagram__list {
        margin-left: 0;
    }

    .footer {
        padding: 20px 0;
    }

    .footer__wrap {
        -webkit-box-pack: justify;
            -ms-flex-pack: justify;
                justify-content: space-between;
        -webkit-box-align: center;
            -ms-flex-align: center;
                align-items: center;
    }

    .footer__logo {
        margin: 0;
    }

    .footer__menu {
        display: none;
    }

    .footer__social {
        margin: 0;
    }

    .footer__call {
        margin: 0;
    }

    .social__list {
        -webkit-box-pack: center;
            -ms-flex-pack: center;
                justify-content: center;
    }

    .social__item {
        margin: 0 10px;
    }

    .modal--bg-whatsapp::before,
    .modal--bg-tablet::before,
    .modal--bg-woman::before,
    .modal--bg-catalog::before,
    .modal--bg-instagram::before {
       display: none;
    }

    .modal__inner {
        padding: 50px;
        text-align: center;
    }

    .modal__description {
        margin: 0 auto;
    }

    .modal__input {
        margin-left: auto;
        margin-right: auto;
    }

    .modal__agreement {
        margin-left: auto;
        margin-right: auto;
    }

    .modal__info {
        min-height: auto;
        margin-bottom: 40px;
    }

    .modal__content {
        padding: 0;
    }

    .modal__content-text {
        margin: 0 auto 40px;
    }

    .modal__content-title {
        margin-bottom: 20px;
    }

    .modal {
        width: 570px;
    }
}

/*************************************/
/************ 9.3 Mobiles ************/
/*************************************/

@media screen and (max-width: 768px) {
    .logo, .logo-footer {
        font-size: 20px;
        max-width: 155px;
    }
    body {
        font-size: 14px;
    }

    h1 {
        font-size: 30px;
        line-height: 1.2;
    }

    h2 {
        font-size: 27px;
        margin-bottom: 40px;
    }

    h3 {
        font-size: 24px;
    }

    .main {
        padding: 120px 0 70px;
    }

    .main__edge {
        margin-bottom: 50px;
    }

    .btn {
        width: 260px;
        height: 60px;
        font-size: 13px;
    }

    .card {
        margin-bottom: 30px;
    }

    .about__item,
    .about__item:nth-child(-n+2),
    .about__item:nth-child(2n) {
        width: calc(50% - 10px);
        padding-left: 28px;
    }

    .about__item::before {
        width: 18px;
        height: 18px;
    }

    .about__item-title {
        font-size: 16px;
    }

    .about__text {
        font-size: 13px;
    }

    .about {
        padding: 20px 0;
    }

    .catalog {
        padding: 30px 0;
    }

    .catalog__btn {
        margin-bottom: 20px;
    }

    .show-more-container {
        margin-bottom: 25px;
    }

    .use__img {
        width: 120px;
        height: 120px;
    }

    .use__info {
        width: calc(100% - 85px);
    }

    .use__item-title {
        font-size: 16px;
    }

    .use__text {
        font-size: 14px;
        line-height: 21px;
    }

    .use__item {
        min-height: auto;
        padding: 20px 0;
    }

    .use {
        padding: 70px 0;
    }

    .quiz {
        padding: 70px 0;
    }

    .quiz__present-main {
        font-size: 24px;
    }

    .quiz__present-main-discount {
        font-size: 40px;
    }

    .quiz__present {
        font-size: 12px;
    }

    .quiz__present-old-price {
        font-size: 16px;
    }

    .quiz__present-price {
        font-size: 24px;
    }

    .quiz__answer {
        max-width: calc(50% - 20px);
    }

    .quiz__answer-img-container {
        height: 150px;
    }

    .quiz__answer-img {
        -o-object-fit: cover;
           object-fit: cover;
        width: 100%;
        height: 100%;
        -o-object-position: center;
           object-position: center;
    }

    .quiz__form-title {
        margin-bottom: 20px;
    }

    .quiz__form-option-text {
        margin-bottom: 20px;
    }

    .quiz__finish-text {
        margin-bottom: 40px;
    }

    .quiz__form-ps {
        padding-bottom: 30px;
    }

    .quiz__finish {
        padding-bottom: 30px;
    }

    .care__text {
        font-size: 14px;
        line-height: 21px;
    }

    .care__list {
        margin-left: 0;
    }

    .care__item {
        margin-bottom: 15px;
    }

    .special::after {
        content: '';
        background: var(--color-white);
        opacity: .5;
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        z-index: -1;
    }

    .special__title {
        font-size: 27px;
        text-align: center;
    }

    .special__inner {
        width: 100%;
    }

    .special__info {
        top: auto;
        left: auto;
        right: 10px;
        bottom: 43px;
    }

    .instagram {
        padding: 20px 0 60px;
    }

    .instagram::after {
        display: none;
    }

    .instagram__inner {
        width: 100%;
    }

    .instagram__title {
        text-align: center;
    }

    .footer__social {
        display: none;
    }

    .modal__title {
        font-size: 18px;
        line-height: 27px;
        margin-bottom: 20px;
    }

    .modal__description {
        font-size: 16px;
    }

    .modal__info {
        margin-bottom: 20px;
    }

    .modal__input {
        height: 60px;
        width: 260px;
        font-size: 15px;
        padding: 0 15px 0 55px;
    }

    .modal__input--user {
        background: url(../img/icon/user.png) no-repeat 22px center / 20px 20px, var(--color-white);
    }

    .modal__input--phone {
        background: url(../img/icon/phone-call.png) no-repeat 22px center / 20px 20px, var(--color-white);
    }
}

@media screen and (max-width: 480px) {
    body {
        color: var(--color-grey-dark);
    }
    
    h1 {
        font-size: 20px;
        line-height: 1.4;
        width: 300px;
        max-width: 100%;
        margin-left: auto;
        margin-right: auto;
    }

    h2 {
        font-size: 18px;
        line-height: 22px;
        margin-bottom: 30px;
        width: 300px;
        max-width: 100%;
        margin-left: auto;
        margin-right: auto;
    }

    h3 {
        font-size: 16px;
        margin-bottom: 13px;
    }

    .wrap {
        padding:  0 15px;
    }

    .btn {
        width: 187px;
        height: 46px;
        font-size: 9px;
    }

    .btn::before {
        -webkit-box-shadow: 0 2px #de9a07;
        box-shadow: 0 2px #de9a07;
    }

    .input {
        width: 187px;
        height: 46px;
        font-size: 10px;
        margin-bottom: 9px;
        padding-left: 45px;
        background-size: 17px;
        background-position: left 18px center;
    }

    .header__logo {
        max-width: 68px;
        display: none;
    }

    .menu__btn-line {
        width: 17px;
        height: 1px;
        background: rgb(var(--color-black));
    }

    .menu__btn-text {
        display: none;
    }

    .menu__list {
        width: 190px;
        padding: 5px;
    }

    .menu__link {
        font-size: 14px;
        padding: 8px 15px;
        color: rgb(var(--color-black));
    }

    .menu__list::after {
        top: 5px;
        left: 5px;
        right: 5px;
        bottom: 5px;
    }

    .header__menu {
        margin-left: 10px;
    }

    .header__phone {
        padding: 0;
        background: transparent;
        font-size: 13px;
        color: rgb(var(--color-black));
    }

    .header__phone::before {
        border: 0;
        margin-right: 5px;
        width: 13px;
        height: 13px;
        padding: 0;
        background-position: center;
        background-size: contain;
    }


    .main {
        padding: 78px 0 218px;
        text-align: center;
        background: url(../img/bg/main-mobile-480.jpg) no-repeat bottom center var(--color-white); /* edeeee */
    }

    .main::after {
        display: none;
    }

    .main__title {
        margin-bottom: 15px;
        color: rgb(var(--color-black));
        width: 300px;
    }

    .main__edge {
        display: block;
        margin-bottom: 26px;
        color: rgb(var(--color-black));
    }

    .main__edge-item {
        display: table;
        margin-bottom: 16px;
        font-size: 13px;
        line-height: 17px;
        padding-left: 12px;
        max-width: 250px;
        text-align: left;
    }

    .main__edge-item::before {
        width: 5px;
        height: 5px;
        background: var(--color-accent);
        top: 6px;
    }

    .main__edge-item br {
        display: block;
    }

    .main__edge-item b {
        display: inline;
    }

    .popular {
        padding: 58px 0 30px;
    }

    .card-list {
        overflow: hidden;
        margin: 0 -15px 30px;
    }

    .card-list__inner {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        grid-gap: 0;
        grid-template: none;
    }

    .card {
        width: 233px;
        padding: 7px;
        margin-bottom: 0;
    }

    .card__sticker {
        top: 19px;
        font-size: 9px;
        padding: 5px 15px;
    }

    .card__info {
        padding: 20px 17px 27px;
        text-align: center;
    }

    .card__attribute-list {
        margin-bottom: 16px;
    }

    .card__attribute-item {
        font-size: 11px;
        margin-bottom: 9px;
    }

    .card__attribute-info-item {
        font-size: 11px;
        margin: -3px -5px 2px 5px;
    }

    .card__price {
        font-size: 16px;
        margin-bottom: 18px;
    }

    .card__price-old {
        font-size: 13px;
    }

    .card__btn {
        width: 171px;
        height: 41px;
    }

    .about {
        padding-bottom: 0;
    }

    .about__title {
        margin-bottom: 28px;
    }

    .about__list {
        display: block;
    }

    .about__img {
        display: block;
        position: relative;
        margin: 0 -9px 30px;
    }

    .about__count {
        display: block;
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
    }

    .about__count-item {
        width: 26px;
        height: 26px;
        display: block;
        background: var(--color-gradient);
        border-radius: 50%;
        line-height: 26px;
        text-align: center;
        font-size: 12px;
        font-family: 'Droid Serif', serif;
        position: absolute;
        top: 15.5%;
        left: 6%;
    }

    .about__count-item:nth-child(2) {
        top: auto;
        bottom: 14%;
    }

    .about__count-item:nth-child(3) {
        left: auto;
        right: 6.3%;
    }

    .about__count-item:nth-child(4) {
        left: auto;
        right: 6.3%;
        top: auto;
        bottom: 14%;
    }

    .about__item,
    .about__item:nth-child(-n+2),
    .about__item:nth-child(2n) {
        padding: 0;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -ms-flex-wrap: wrap;
            flex-wrap: wrap;
        -webkit-box-align: center;
            -ms-flex-align: center;
                align-items: center;
        margin-bottom: 29px;
        width: 100%;
    }

    .about__item::before {
        display: none;
    }

    .about__item-img {
        display: block;
        width: 70px;
        margin-right: 15px;
        margin-left: 9px;
    }

    .about__item-count {
        position: absolute;
        top: 0;
        left: 0;
        width: 26px;
        height: 26px;
        background: var(--color-gradient);
        border-radius: 50%;
        line-height: 26px;
        text-align: center;
        font-size: 12px;
        font-family: 'Droid Serif', serif;
    }

    .about__item-title,
    .about__item:nth-child(-n+2) .about__item-title {
        width: calc(100% - 9px - 70px - 15px);
        margin: 0;
    }

    .about__text {
        width: 100%;
        font-size: 14px;
        margin-top: 8px;
        line-height: 1.45;
    }

    .catalog {
        padding: 23px 0 17px;
    }

    .catalog__title br {
        display: block;
    }

    .show-more-container::after {
        display: none;
    }

    .catalog__modal-catalog {
        background: -webkit-gradient(linear, left top, left bottom, from(#96e9f2), to(#5ba9b2));
        background: -o-linear-gradient(top, #96e9f2, #5ba9b2);
        background: linear-gradient(to bottom, #96e9f2, #5ba9b2);
        color: var(--color-white);
        margin-bottom: 28px;
        display: -webkit-inline-box;
        display: -ms-inline-flexbox;
        display: inline-flex;
    }

    .catalog__modal-catalog::before {
        -webkit-box-shadow: 0 2px #5198a0;
                box-shadow: 0 2px #5198a0;
    }

    .catalog__sub-title,
    .catalog__text,
    .catalog__btn {
        display: none;
    }

    .show-more-container {
        overflow: visible;
    }

    .show-more-btn {
        display: none;
    }

    .use {
        padding: 46px 0 25px;
        background: var(--color-bg);
    }

    .use__title br {
        display: none;
    }

    .use__item {
        display: block;
        padding: 0 5px 38px;
        margin: 40px 0 25px;
        max-width: 100%;
    }

    .use__img {
        width: 80px;
        height: 80px;
        margin: -40px auto 10px;
    }

    .use__info {
        width: 100%;
        margin: 0;
        text-align: center;
    }

    .use__item-title {
        margin-bottom: 7px;
    }

    .use__text {
        line-height: 20px;
    }

    .use__text br {
        display:  none;
    }

    .quiz {
        padding: 53px 0 30px;
    }

    .quiz__container {
        margin: 0 -5px;
    }

    .quiz__present {
        padding: 13px 15px;
        -webkit-box-pack: start;
        -ms-flex-pack: start;
        justify-content: flex-start;
        background: url(../img/present.png) no-repeat right bottom var(--color-white);
        margin: 10px 10px 0;
        border: 1px solid #f0e1db;
        width: auto;
        border-radius: 15px;
    }

    .quiz__present-title {
        font-size: 12px;
        line-height: 21px;
        margin-bottom: 14px;
    }

    .quiz__present-plus {
        display: none;
    }

    .quiz__present-column {
        width: 100%;
        max-width: calc(100% - 40px);
        padding-left: 10px;
        position: relative;
        text-align: left;
        margin-bottom: 10px;
    }

    .quiz__present-column::before {
        content: '';
        position: absolute;
        top: 6px;
        left: 0;
        width: 5px;
        height: 5px;
        display: block;
        border-radius: 50%;
        background: var(--color-gradient);
    }

    .quiz__present-main,
    .quiz__present-main-discount,
    .quiz__present-price {
        display: inline;
        font-size: 14px;
    }

    .quiz__present-first,
    .quiz__present-second {
        display: inline;
        font-size: 10px;
        line-height: 1.4;
    }

    .quiz__present-second br {
        display: block;
    }

    .quiz__present-old-price {
        display: none;
    }

    .quiz__inner {
        padding-top: 30px;
    }

    .quiz__way {
        font-size: 10px;
        margin-bottom: 12px;
    }

    .quiz__tracker {
        margin-bottom: 8px;
    }

    .quiz__tracker-item {
        height: 5px;
        margin: 0 3px 10px;
        background: #f1f1f1;
    }

    .quiz__answer-img-container {
        height: auto;
        margin-bottom: 12px;
    }

    .quiz__answer-text {
        font-size: 10px;
    }

    .quiz__answer {
        margin-bottom: 25px;
    }

    .quiz__answer-img-container::after {
        width: 21px;
        height: 21px;
        background-size: contain;
        background-position: center;
    }

    .quiz__question-title {
        font-size: 13px;
        line-height: normal;
        margin-bottom: 22px;
    }

    .quiz__finish-text {
        font-size: 12px;
        line-height: 1.7;
        margin-bottom: 25px;
    }

    .quiz__finish-text br {
        display: none;
    }

    .quiz__lead-title {
        margin-bottom: 20px;
    }

    .quiz__lead-text {
        margin-bottom: 25px;
    }

    .quiz__lead-item {
        margin-bottom: 6px;
        font-size: 12px;
    }

    .quiz__lead-list {
        margin-bottom: 30px;
    }

    .care {
        background: url(../img/bg/tech-mobile.jpg) no-repeat bottom center;
        text-align: center;
        padding: 27px 0 20px;
    }

    .care::after {
        display: none;
    }

    .care__title {
        text-align: center;
        margin-bottom: 25px;
    }

    .care__item {
        padding-left: 15px;
        margin: 0 auto 9px;
        font-size: 13px;
        line-height: 17px;
        display: table;
        letter-spacing: .025em;
    }

    .care__item::before {
        width: 5px;
        height: 5px;
        background: var(--color-accent);
        top: 5px;
    }

    .care__item br {
        display: block;
    }

    .care__box {
        -webkit-box-ordinal-group: 4;
            -ms-flex-order: 3;
                order: 3;
        background: var(--color-white);
        border-radius: 15px;
        position: relative;
        z-index: 2;
        padding: 34px 20px 43px;
        max-width: 290px;
        margin: 0 auto -278px;
    }

    .care__box::after {
        content: '';
        display: block;
        position: absolute;
        top: 8px;
        left: 8px;
        right: 8px;
        bottom: 8px;
        border-radius: 15px;
        border: 1px solid #f0e1db;
        z-index: -1;
    }

    .care__text {
        font-size: 12px;
        line-height: 22px;
        margin-bottom: 20px;
    }

    .care__list {
        margin-bottom: 382px;
    }

    .review {
        padding: 314px 0 57px;
    }

    .review__title {
        margin-bottom: 8px;
    }

    .review__text {
        font-size: 11px;
        margin-bottom: 29px;
    }

    .review__list {
        margin: 0 -15px;
    }

    .review__item,
    .review__item--prev,
    .review__item--next {
        -webkit-transform: none;
            -ms-transform: none;
                transform: none;
    }
    
    .review__link {
        margin: 0 7px;
    }

    .review__link img {
        margin: 0 auto;
        max-width: 217px;
    }

    .special {
        background: url(../img/bg/special-mobile-480.jpg) no-repeat center bottom var(--color-bg-light);
        padding: 49px 0 50px;
    }

    .special::after {
        display: none;
    }

    .special__title {
        font-size: 18px;
        line-height: normal;
        margin-bottom: 20px;
    }

    .special__title br {
        display: block;
    }

    .special__old-price {
        padding: 9px 20px;
        margin-left: auto;
        margin-right: auto;
        display: table;
    }

    .special__list {
        margin-bottom: 135px;
    }

    .special__item {
        font-size: 13px;
        line-height: 17px;
        display: table;
        padding-left: 15px;
        margin: 0 auto 9px;
        letter-spacing: .025em;
        text-align: center;
    }

    .special__item::before {
        width: 5px;
        height: 5px;
        background: var(--color-accent);
        top: 5px;
    }

    .special__item br {
        display: block;
    }

    .special__info {
        position: relative;
        right: auto;
        bottom: auto;
        width: 79px;
        height: 79px;
        font-size: 9px;
        margin: 0 auto 102px;
        padding-top: 16px;
        border-width: 3px;
    }

    .special__info span {
        font-size: 18px;
        line-height: normal;
        margin-bottom: -1px;
    }

    .special__box {
        background: var(--color-white);
        border-radius: 15px;
        position: relative;
        z-index: 2;
        padding: 37px 20px 41px;
        max-width: 290px;
        margin: 0 auto -182px;
        text-align: center;
    }

    .special__box::after {
        content: '';
        display: block;
        position: absolute;
        top: 8px;
        left: 8px;
        right: 8px;
        bottom: 8px;
        border-radius: 15px;
        border: 1px solid #f0e1db;
        z-index: -1;
    }

    .special__text {
        font-size: 14px;
        line-height: 20px;
    }

    .showroom {
        padding: 221px 0 25px;
    }

    .showroom__title {
        position: relative;
        z-index: 2;
    }
    
    .showroom__map-img {
        width: 733px;
        top: 12px;
        left: -58px;
    }
    
    .showroom__marker {
        top: 122px;
        left: 128px;
    }
    
    .showroom__info {
        top: auto;
        bottom: calc(100% - 17px);
        -webkit-transform: translate(-50%, 0);
            -ms-transform: translate(-50%, 0);
                transform: translate(-50%, 0);
        width: 230px;
        font-size: 11px;
        padding-bottom: 10px;
    }
    
    .showroom__info-text--big {
        font-size: 12px;
    }
    
    .showroom__info-title {
        margin-bottom: 0;
    }
    
    .showroom__info-text {
        margin-bottom: 11px;
    }
    
    .showroom__dot-img {
        width: 26px;
        height: 26px;
        padding: 7px;
    }
    
    .showroom__dot--gum {
        top: 272px;
        left: 128px;
    }
    
    .showroom__dot--area {
        top: 323px;
        left: 200px;
    }
    
    .showroom__dot .showroom__info {
        min-width: 80px;
        max-width: 230px;
        bottom: calc(100% - 5px);
        font-size: 10px;
        padding: 11px 13px 8px;
    }
    
    .showroom__map {
        height: 386px;
        width: 290px;
        -webkit-transform: none;
            -ms-transform: none;
                transform: none;
    }

    .form {
        padding: 48px 20px 49px;
    }

    .form__title {
        font-size: 14px;
        line-height: normal;
        margin-bottom: 21px;
    }

    .form__option-text {
        font-size: 11px;
        margin-bottom: 19px;
    }

    .form__option-icon {
        height: 19px;
        background-size: contain;
        margin-bottom: 5px;
    }

    .form__option-name {
        font-size: 9px;
    }

    .form__option-item {
        margin: 0 6px 12px;
    }

    .form__btn {
        margin-bottom: 13px;
    }

    .form__agreement {
        font-size: 9px;
        width: 175px;
    }

    .instagram {
        padding: 29px 0 50px;
    }

    .instagram__title {
        margin-bottom: 0;
    }

    .instagram__title::after {
        content: '';
        display: block;
        background: url(../img/bg/instagram-v3.png) no-repeat top center / 222px;
        width: 222px;
        height: 296px;
        margin: 29px auto 0;
    }

    .instagram__box {
        background: var(--color-white);
        border-radius: 15px;
        position: relative;
        z-index: 2;
        padding: 29px 25px 39px;
        text-align: center;
    }

    .instagram__box::after {
        content: '';
        display: block;
        position: absolute;
        top: 8px;
        left: 8px;
        right: 8px;
        bottom: 8px;
        border-radius: 15px;
        border: 1px solid #f0e1db;
        z-index: -1;
    }

    .instagram__text {
        font-size: 14px;
        line-height: 20px;
        margin-bottom: 19px;
        text-align: left;
    }

    .instagram__list {
        margin-bottom: 28px;
        text-align: left;
    }

    .instagram__item {
        padding-left: 15px;
        font-size: 13px;
        line-height: 17px;
        letter-spacing: .025em;
        margin-bottom: 10px;
    }

    .instagram__item::before {
        width: 5px;
        height: 5px;
        top: 6px;
        left: 2px;
    }

    .footer {
        padding: 12px 0 8px;
    }

    .footer__logo {
        width: 68px;
        margin-top: 4px;
    }

    .footer__phone {
        font-size: 13px;
        margin-bottom: 5px;
    }

    .footer__phone::before {
        width: 13px;
        height: 13px;
        margin-right: 5px;
        background-size: contain;
    }

    .footer__wrap {
        -webkit-box-align: start;
            -ms-flex-align: start;
                align-items: flex-start;
    }

    .footer__callback {
        font-size: 11px;
    }

    .footer__callback {
        font-size: 12px;
    }

    .modal__close {
        right: 22px;
        top: 22px;
        width: 15px;
        height: 15px;
    }
    
    #modalProducts .modal__close {
        position: fixed;
        top: 37px;
        right: 46px;
        fill: var(--color-accent);
    }

    .modal__inner {
        padding: 30px;
    }

    .modal::after {
        top: 15px;
        left: 15px;
        right: 15px;
        bottom: 15px;
    }

    .modal__title br,
    .modal__description br {
        display: none;
    }

    .modal__description {
        font-size: 14px;
    }

    .modal__input {
        width: 230px;
        height: 56px;
        letter-spacing: .05em;
        font-size: 14px;
    }

    .modal__content-title {
        font-size: 18px;
        line-height: 27px;
    }

    .modal__content-text {
        font-size: 14px;
        line-height: 24px;
        margin-bottom: 30px;
    }
    
    .modal__catalog .card {
        margin: 0 auto 30px;
        max-width: 100%;
    }
    
    .modal__catalog .modal__description {
        font-size: 13px;
        line-height: normal;
        margin-bottom: 20px;
    }
    
    .modal__map {
        padding: 45px 25px 25px;
    }
}