@font-face {
    font-family: 'Greycliff CF';
    src: url('../fonts/GreycliffCF-Regular.woff2') format('woff2'),
        url('../fonts/GreycliffCF-Regular.woff') format('woff');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Greycliff CF';
    src: url('../fonts/GreycliffCF-Medium.woff2') format('woff2'),
        url('../fonts/GreycliffCF-Medium.woff') format('woff');
    font-weight: 500;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Greycliff CF';
    src: url('../fonts/GreycliffCF-Bold.woff2') format('woff2'),
        url('../fonts/GreycliffCF-Bold.woff') format('woff');
    font-weight: bold;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Greycliff CF';
    src: url('../fonts/GreycliffCF-Light.woff2') format('woff2'),
        url('../fonts/GreycliffCF-Light.woff') format('woff');
    font-weight: 300;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Greycliff CF';
    src: url('../fonts/GreycliffCF-ExtraBold.woff2') format('woff2'),
        url('../fonts/GreycliffCF-ExtraBold.woff') format('woff');
    font-weight: 900;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Quincy CF';
    src: url('../fonts/QuincyCF-Regular.woff2') format('woff2'),
        url('../fonts/QuincyCF-Regular.woff') format('woff');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Quincy CF';
    src: url('../fonts/QuincyCF-Bold.woff2') format('woff2'),
        url('../fonts/QuincyCF-Bold.woff') format('woff');
    font-weight: bold;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Quincy CF';
    src: url('../fonts/QuincyCF-Black.woff2') format('woff2'),
        url('../fonts/QuincyCF-Black.woff') format('woff');
    font-weight: 900;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Quincy CF';
    src: url('../fonts/QuincyCF-Medium.woff2') format('woff2'),
        url('../fonts/QuincyCF-Medium.woff') format('woff');
    font-weight: 500;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Campton';
    src: url('../fonts/Campton-Light.woff2') format('woff2'),
        url('../fonts/Campton-Light.woff') format('woff');
    font-weight: 300;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Campton';
    src: url('../fonts/Campton-SemiBold.woff2') format('woff2'),
        url('../fonts/Campton-SemiBold.woff') format('woff');
    font-weight: 600;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Montserrat';
    src: url('../fonts/Montserrat-ExtraBold.woff2') format('woff2'),
        url('../fonts/Montserrat-ExtraBold.woff') format('woff');
    font-weight: bold;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Montserrat';
    src: url('../fonts/Montserrat-Medium.woff2') format('woff2'),
        url('../fonts/Montserrat-Medium.woff') format('woff');
    font-weight: 500;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Montserrat';
    src: url('../fonts/Montserrat-SemiBold.woff2') format('woff2'),
        url('../fonts/Montserrat-SemiBold.woff') format('woff');
    font-weight: 600;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Montserrat';
    src: url('../fonts/Montserrat-ExtraLight.woff2') format('woff2'),
        url('../fonts/Montserrat-ExtraLight.woff') format('woff');
    font-weight: 200;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Montserrat';
    src: url('../fonts/Montserrat-Light.woff2') format('woff2'),
        url('../fonts/Montserrat-Light.woff') format('woff');
    font-weight: 300;
    font-style: normal;
    font-display: swap;
}

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

@font-face {
    font-family: 'Montserrat';
    src: url('../fonts/Montserrat-Thin.woff2') format('woff2'),
        url('../fonts/Montserrat-Thin.woff') format('woff');
    font-weight: 100;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Montserrat';
    src: url('../fonts/Montserrat-Black.woff2') format('woff2'),
        url('../fonts/Montserrat-Black.woff') format('woff');
    font-weight: 900;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Montserrat';
    src: url('../fonts/Montserrat-Bold.woff2') format('woff2'),
        url('../fonts/Montserrat-Bold.woff') format('woff');
    font-weight: bold;
    font-style: normal;
    font-display: swap;
}

* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

ul {list-style: none;}

img {
    max-width: 100%;
    height: auto;
}

:root {
    --akcent: #9998d2;
    --akcent_2: #6a62b7;
    --greycliff: 'Greycliff CF', sans-serif;
    --quincy: 'Quincy CF', sans-serif;
    --campton: 'Campton', sans-serif;
    --montserrat: 'Montserrat', sans-serif;
    --hover: #000;
    --color: #0c0c0c;
    --purple: #6a62b7;
    --puplelight: #f3f4f8;
}

body {
    font: 15px/1.6 var(--greycliff);
    color: var(--color);
}

a {text-decoration: none;}

h2.title {
    font: 48px/1.15 var(--quincy);
    text-align: center;
}
h2.title span {font-weight: 500;}
h2.title sup {
    font-size: 25px;
    line-height: 0;
}

p.subtitle {
    text-align: center;
    font-size: 18px;
    margin-top: 8px;
}

.center {
    width: 100%;
    max-width: 1230px;
    min-width: 250px;
    margin: 0 auto;
    padding: 0 15px;
}

.d-none {display: none !important;}
.tx-c {text-align: center;}
.tx-l {text-align: left;}
.tx-r {text-align: right;}

.wrapper {
    overflow: hidden;
    max-width: 1920px;
    margin: 0 auto;
}

.btn {
    height: 55px;
    display: inline-flex;
    background: var(--akcent);
    border-radius: 12px;
    justify-content: center;
    align-items: center;
    font-size: 18px;
    font-weight: 500;
    color: #fff;
    padding: 0 60px;
    position: relative;
    overflow: hidden;
    animation: shadow-pulse 3s infinite;
    transition: all 0.3s;
}
.btn span {
    position: relative;
    z-index: 2;
}
.btn:hover {background: var(--akcent_2);}

@keyframes shadow-pulse {
    0% {box-shadow: 0 0 0 0 rgba(0,0,0,.7);}
    50% {box-shadow: 0 0 0 0 rgba(0,0,0,.3);}
    to {box-shadow: 0 0 0 20px transparent;}
}

.btn-group {display: inline-block;}
.btn-group p {
    text-align: center;
    font-size: 15px;
    line-height: 1.7;
    margin-top: 20px;
}

.icon {
    display: inline-block;
    line-height: 0;
}

/* HEADER
-------------------------------------- */
.header {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    z-index: 9999;
}

.head-line {
    height: 55px;
    background: var(--akcent);
    display: grid;
    grid-template-columns: 1fr 1fr;
}
.head-line .left, 
.head-line .right {
    display: flex;
    align-items: center; 
    position: relative;
}
.head-line .left {
    padding-right: 35px;
    justify-content: flex-end;
}
.head-line .left:after {
    content: '';
    display: inline-block;
    border-top: 0px solid transparent;
    border-left: 30px solid var(--akcent);
    border-bottom: 55px solid transparent;
    position: absolute;
    top: 0;
    left: 100%;
    margin-left: -15px;
    z-index: 2;
}
.head-line .left i {
    display: inline-block;
    width: 18px;
    height: 15px;
    background: url(../img/ic-arr.png) no-repeat;
    margin-right: 8px;
}

.head-line .right {
    background: #fff;
    padding-left: 45px;
}
.head-line .right:after {
    content: '';
    display: inline-block;
    border-top: 55px solid transparent;
    border-right: 30px solid #fff;
    border-bottom: 0 solid transparent;
    position: absolute;
    top: 0;
    right: 100%;
    margin-right: -15px;
    z-index: 2;
}

.head-line .right .text {margin-left: 15px;}
.head-line .right .text p:first-child {
    font-weight: normal;
    text-transform: uppercase;
    font-size: 12px;
    line-height: 1.1;
    color: var(--akcent_2);
}
.head-line .right .text p:last-child {
    font-weight: normal;
    text-transform: uppercase;
    font-size: 20px;
    line-height: 1.1;
    color: var(--akcent_2);
}

.head-btn {
    font-size: 20px;
    color: #fff;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: all 0.3s;
}

.head-btn strong {
    padding-right: 13px;
}
.head-btn span {
    position: relative;
    padding-left: 13px;
}
.head-btn span:after {
    content: '';
    display: inline-block;
    height: 20px;
    width: 2px;
    background: #fff;
    position: absolute;
    top: 50%;
    left: 0;
    transform: translate(-1px, -50%);
    transition: all 0.3s;
}

.head-main {padding: 30px 30px 0 30px;}
.head-main .inner {
    max-width: 1880px;
    position: relative;
    border-radius: 8px;
    background: rgba(255,255,255,.4);
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 13px 100px;
    background: rgb(255 255 255 / 90%);
    backdrop-filter: blur( 5px );
    border: 1px solid rgba(255,255,255,.05);
}

.nav ul {
    display: flex;
    align-items: center;
}
.nav ul li + li {margin-left: 20px;}
.nav ul li a {
    color: #0c0c0c;
    transition: all 0.3s;
}
.nav ul li a:hover {text-shadow: 0 0 1px #0c0c0c;}

.logo {
    display: inline-block;
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    line-height: 0;
    cursor: inherit;
    max-width: 200px;
}
.logo img {
    display: block;
    width: 100%;
}

.head-btn_2 {
    display: inline-flex;
    border-radius: 8px;
    background: var(--akcent_2);
    min-height: 50px;
    color: #fff;
    font-weight: 500;
    font-size: 16px;
    min-width: 235px;
    justify-content: center;
    align-items: center;
    overflow: hidden;
    position: relative;
    transition: all 0.3s;
}
.head-btn_2 span {
    position: relative;
    top: -1px;
}
.head-btn_2:hover {background: #9998D2;}

/* TIMER
-------------------------------------- */
.timer {
    display: flex;
    align-items: center;
}

.digit {
    display: inline-block;
    font-size: 23px;
    font-weight: 300;
    color: rgb(255, 255, 255);
    height: 25px;
    line-height: 1.2;
}

.time-part-wrapper {
    margin-right: 13px;
    position: relative;
    background: #6a62b7;
    border-radius: 2px;
    line-height: 0;
    width: 39px;
    height: 34px;
    display: flex;
    align-items: center;
    justify-content: center;
}
.time-part-wrapper:after {
    content: ":";
    display: block;
    width: 30px;
    height: 25px;
    position: absolute;
    top: 0px;
    right: -34px;
    color: #163648;
    font-size: 24px;
    line-height: 1.2;
}
.timer .time-part-wrapper:last-child {margin-right: 0;}
.timer .time-part-wrapper:last-child:after {display: none;}

.time-part {
    width: 15px;
    text-align: center;
    height: 25px;
    overflow: hidden;
    display: inline-block;
    margin-left: 0;
    box-sizing: border-box;
}
.time-part .digit-wrapper {
    animation-timing-function: cubic-bezier(1, 0, 1, 0);
}
.time-part.minutes.tens .digit-wrapper {
    animation-name: minutes-tens;
    animation-duration: 3600s;
    animation-iteration-count: 3;
}
.time-part.minutes.ones .digit-wrapper {
    animation-name: minutes-ones;
    animation-duration: 600s;
    animation-iteration-count: 6;
}
.time-part.seconds.tens .digit-wrapper {
    animation-name: seconds-tens;
    animation-duration: 60s;
    animation-iteration-count: 60;
}
.time-part.seconds.ones .digit-wrapper {
    animation-name: seconds-ones;
    animation-duration: 10s;
    animation-iteration-count: 360;
}
.time-part.hundredths.tens .digit-wrapper {
    animation-name: hundredths-tens;
    animation-duration: 1s;
    animation-iteration-count: 3600;
}
.time-part.hundredths.ones .digit-wrapper {
    animation-name: hundredths-ones;
    animation-duration: 0.1s;
    animation-iteration-count: 36000;
}

@keyframes minutes-tens {
    0% {
        transform: translateY(-25px);
    }
    10% {
        transform: translateY(-50px);
    }
    20% {
        transform: translateY(-75px);
    }
    30% {
        transform: translateY(-100px);
    }
    40% {
        transform: translateY(-125px);
    }
    50% {
        transform: translateY(-150px);
    }
    60% {
        transform: translateY(-175px);
    }
    70% {
        transform: translateY(-200px);
    }
    80% {
        transform: translateY(-225px);
    }
    90% {
        transform: translateY(-250px);
    }
}
@keyframes minutes-ones {
    0% {
        transform: translateY(-25px);
    }
    10% {
        transform: translateY(-50px);
    }
    20% {
        transform: translateY(-75px);
    }
    30% {
        transform: translateY(-100px);
    }
    40% {
        transform: translateY(-125px);
    }
    50% {
        transform: translateY(-150px);
    }
    60% {
        transform: translateY(-175px);
    }
    70% {
        transform: translateY(-200px);
    }
    80% {
        transform: translateY(-225px);
    }
    90% {
        transform: translateY(-250px);
    }
}
@keyframes seconds-tens {
    0% {
        transform: translateY(-25px);
    }
    16.66667% {
        transform: translateY(-50px);
    }
    33.33333% {
        transform: translateY(-75px);
    }
    50% {
        transform: translateY(-100px);
    }
    66.66667% {
        transform: translateY(-125px);
    }
    83.33333% {
        transform: translateY(-150px);
    }
}
@keyframes seconds-ones {
    0% {
        transform: translateY(-25px);
    }
    10% {
        transform: translateY(-50px);
    }
    20% {
        transform: translateY(-75px);
    }
    30% {
        transform: translateY(-100px);
    }
    40% {
        transform: translateY(-125px);
    }
    50% {
        transform: translateY(-150px);
    }
    60% {
        transform: translateY(-175px);
    }
    70% {
        transform: translateY(-200px);
    }
    80% {
        transform: translateY(-225px);
    }
    90% {
        transform: translateY(-250px);
    }
}
@keyframes hundredths-tens {
    0% {
        transform: translateY(-25px);
    }
    10% {
        transform: translateY(-50px);
    }
    20% {
        transform: translateY(-75px);
    }
    30% {
        transform: translateY(-100px);
    }
    40% {
        transform: translateY(-125px);
    }
    50% {
        transform: translateY(-150px);
    }
    60% {
        transform: translateY(-175px);
    }
    70% {
        transform: translateY(-200px);
    }
    80% {
        transform: translateY(-225px);
    }
    90% {
        transform: translateY(-250px);
    }
}
@keyframes hundredths-ones {
    0% {
        transform: translateY(-25px);
    }
    10% {
        transform: translateY(-50px);
    }
    20% {
        transform: translateY(-75px);
    }
    30% {
        transform: translateY(-100px);
    }
    40% {
        transform: translateY(-125px);
    }
    50% {
        transform: translateY(-150px);
    }
    60% {
        transform: translateY(-175px);
    }
    70% {
        transform: translateY(-200px);
    }
    80% {
        transform: translateY(-225px);
    }
    90% {
        transform: translateY(-250px);
    }
}

/* HOME
-------------------------------------- */
.home {
    position: relative;
    margin-top: 55px;
}
.home .center {
    position: absolute;
    left: 50%;
    bottom: 150px;
    transform: translateX(-50%);
    z-index: 2;
    color: #fff;
}

.home .derm {
    position: absolute;
    z-index: 2;
    right: 55px;
    bottom: 40px;
    display: flex;
    justify-content: center;
    align-items: center;
}
.home .derm img:first-child {
    animation: 25s linear 0s normal none infinite running rot;
} 
.home .derm img:last-child {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}

@keyframes rot {
    0% {transform: rotate(0);}
    100% {transform: rotate(360deg);}
}

.home h1 {
    color: #fff;
    font: 500 82px/1.2 var(--quincy);
}
.home h1 i {color: #fff !important;}

.home p {
    margin: 10px 0 50px;
    font-size: 25px;
    font-weight: 500;
}
.home .center img {
    max-width: 240px;
    margin-top: 50px;
}
.home .btn {
    animation: shadow-pulse2 3s infinite;
}
@keyframes shadow-pulse2 {
    0% {box-shadow: 0 0 0 0 rgba(255,255,255,.7);}
    50% {box-shadow: 0 0 0 0 rgba(255,255,255,.3);}
    to {box-shadow: 0 0 0 20px transparent;}
}

.home .splide {
    position: relative;
    pointer-events: none;
}
.home .splide__arrow {display: none;}
.home .splide__slide {
    min-height: 795px;
    max-height: 795px;
    overflow: hidden;
    display: flex;
    transition: opacity 2000ms cubic-bezier(0.25, 1, 0.5, 1) 0s !important;
}
.home .splide__slide img {
    width: 100%;
    display: block;
    object-fit: cover;
    object-position: center;
}

.home .splide__pagination {
    padding: 0;
    bottom: 22px;
    display: flex;
    align-items: center;
    margin-top: 0;
    position: absolute;
}
.home .splide__pagination li {margin: 0 8px;}
.home .splide__pagination__page {
    opacity: 1;
    width: 75px;
    height: 7px;
    background: #6b6a6f;
    border-radius: 0;
    transition: all 0.3s;
}
.home .splide__pagination__page.is-active {
    transform: none;
    background: #43425d;
}

/* RECOMMENDED
-------------------------------------- */ 
.recommended {padding: 50px 0 70px;}
.recommended .center {max-width: 1010px;}
.recommended .splide {
    margin-top: 35px;
    visibility: visible;
}
.recommended ul {
    display: flex !important;
    justify-content: space-between;
    margin-top: 50px;
    font-family: var(--quincy);
    text-align: center;
}
.recommended ul h3 {
    font-size: 64px;
    font-weight: normal;
    line-height: 1.1;
}
.recommended ul p {
    font-size: 24px;
    line-height: 1.3;
}

/* LOGOS
-------------------------------------- */ 
.logos {
    padding: 20px 0;
    background: #f1f1f1;
}
.logos .splide {
    position: relative;
    pointer-events: none;
}
.logos .splide__arrow {display: none;}
.logos .splide__slide {
    display: flex;
    align-items: center;
    justify-content: center;
}

/* TRANSFORM
-------------------------------------- */ 
.transform {
    background: url(../img/bg-transform.jpg) no-repeat right top;
    background-size: cover;
    min-height: 850px;
    display: flex;
    align-items: center;
    position: relative;
}

.transform h2.title {text-align: left;}
.transform .center {position: relative;}
.transform .center > p {
    font-size: 18px;
    margin-top: 20px;
    margin-bottom: 40px;
}
.transform .center > p span {font-weight: 500;}

.transform .circle {
    position: absolute;
    top: 60px;
    right: 110px;
}

/* GALLERY
-------------------------------------- */ 
.gallery .splide {pointer-events: none;}
.gallery .splide__slide img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
}

/* HAIR
-------------------------------------- */ 
.hair {padding-top: 65px;}
.hair .center lottie-player {
    width: 45px;
    margin-bottom: 15px;
    display: inline-block !important;
}
.hair-product {
    margin-top: 50px;
    display: grid;
    grid-template-columns: 50% 50%;
}
.hair-product .thumb img {
    display: block;
    object-fit: cover;
    object-position: center;
    height: 100%;
    width: 100%;
}

.hair-product .text {
    display: flex;
    align-items: center;
    padding: 40px;
    justify-content: center;
}
.hair-product .text small {
    font-size: 14px;
    margin-bottom: 5px;
    color: #7a7979;
    display: inline-block;
}
.hair-product .text h3 {
    font: normal 30px/1.2 var(--quincy);
}
.hair-product > .text > .inner > p {
    font-size: 14px;
    margin-top: 20px;
}
.hair-product .text ul {
    margin-top: 30px;
    margin-bottom: 30px;
}
.hair-product .text ul li {
    display: flex;
    align-items: center;
    line-height: 1.3;
}
.hair-product .text ul li i {
    width: 18px;
    height: 18px;
    background: url(../img/ic-checkmark.png) no-repeat;
    margin-right: 15px;
    position: relative;
    top: 1px;
}
.hair-product .text ul li + li {margin-top: 15px;}
.hair-product .text h4 {
    font: 24px/1.4 var(--quincy);
    margin-bottom: 30px;
}

/* REVIEWS
-------------------------------------- */ 
.reviews {
    background: var(--puplelight);
    padding: 80px 0;
}   
.reviews .center {max-width: 1400px;}
.reviews lottie-player {
    max-width: 65px;
    margin-bottom: 15px;
    display: inline-block !important;
}

.reviews .tx-c {margin-bottom: 35px;}
.reviews .tx-c > h3 {font: 36px/1.2 var(--quincy);}
.reviews .tx-c img {margin-top: 15px;}

.reviews .splide {
    margin-left: -20px;
    margin-right: -20px;
}
.reviews .splide__slide {padding: 20px;} 
.reviews .splide__slide .inner {
    background: #fff;
    border-radius: 13px;
    padding: 15px 15px 35px 15px;
    height: 100%;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    box-shadow: 0 0 15px 5px rgba(0,0,0,.02);
}
.reviews .splide__slide p {
    font-size: 14px;
    margin: 30px 0 15px 0;
}
.reviews .splide__slide div {margin-top: auto;}
.reviews .splide .splide__pagination {display: flex;}

.splide__arrow {display: none;}
.splide__pagination {
    position: static;
    padding: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-top: 30px;
}
.splide__pagination__page {
    width: 9px;
    height: 9px;
    background: #e2e1f1;
    margin: 0 5px;
}
.splide__pagination__page.is-active {
    transform: none;
    background: var(--akcent_2);
}

.reviews-foot {margin-top: 40px;}
.reviews-foot > lottie-player {
    max-width: 50px;
    display: inline-block !important;
}

.ic-coma {
    display: inline-block;
    width: 45px;
    height: 35px;
    background: url(../img/ic-coma.png);
}

.reviews-foot {text-align: center;}
.reviews-foot h4 {
    font: 33px/1.3 var(--quincy);
    margin: 30px 0 30px 0;
}
.reviews-foot h4 span {font-weight: 500;}
.reviews-foot .signature lottie-player {
    max-width: 160px;
    display: inline-block !important;
}
.reviews-foot p {
    font-size: 17px;
    color: #606060;
}

/* PRODUCTS
-------------------------------------- */ 
.products .row {
    display: grid;
    grid-template-columns: 50% 50%;
}
.products .thumb {overflow: hidden;}
.products .thumb img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
}

.products .text {
    padding: 40px;
    background: #fff;
    display: flex;
    align-items: center;
    justify-content: center;
}

.tags {
    display: flex;
    align-items: center;
    justify-content: flex-start;
}
.tags span {
    padding: 2px 13px;
    background: #f7f7f7;
    border-radius: 12px;
    font-size: 14px;
    font-weight: 300;
}
.tags span + span {margin-left: 20px;}

.products h3 {
    margin-top: 40px;
    margin-bottom: 40px;
    font: 500 30px/1.2 var(--quincy);
}
.products p + p {margin-top: 30px;}

.products ul {margin-top: 40px;}
.products ul li {
    display: flex;
    align-items: center;
    line-height: 1.3;
}
.products ul li i {
    width: 18px;
    height: 18px;
    min-width: 18px;
    background: url(../img/ic-checkmark.png) no-repeat;
    margin-right: 15px;
    position: relative;
    top: 1px;
}
.products ul li + li {margin-top: 15px;}

/* INGRADIENTS
-------------------------------------- */ 
.ingradients {
    padding: 60px 0 45px 0;
    background: var(--puplelight);
}
.ingradients .center {max-width: 1500px;}
.ingradients lottie-player {
    max-width: 50px;
    margin-bottom: 15px;
    display: inline-block !important;
}

.ingradients .splide {
    visibility: visible;
    margin: 25px 0 40px 0;
    margin-left: -46px;
    margin-right: -46px;
}
.ingradients .splide__slide {padding: 20px 23px;}
.ingradients .splide__slide .inner {
    background: #f7f6fa;
    border-radius: 13px;
    box-shadow: 0 0 20px 10px rgba(0,0,0,.02);
    padding: 25px 20px 45px 20px;
    height: 100%;
    text-align: center;
    transition: all 0.3s;
}
.ingradients .splide__slide .inner:hover {
    box-shadow: 0 2px 20px 0 rgba(146,146,146,0.5);
}
.ingradients .splide__slide h3 {
    margin-top: 25px;
    font-size: 24px;
    font-weight: normal;
}
.ingradients .splide__slide p {
    margin-top: 10px;
    font-size: 14px;
    line-height: 1.3;
}

.ingradients .splide__pagination {display: flex !important;}

/* RESULTS
-------------------------------------- */ 
.results .center {
    position: relative;
    max-width: 1500px;
}

.results-content {
    padding: 50px 0 50px 0;
    max-width: 850px;
}
.results-content h2 {
    text-align: left;
    margin-bottom: 25px;
}
.results-content h2 sup {font-size: 25px;}
.results-content .splide__slide {
    display: grid;
    grid-template-columns: 445px 400px;
    align-items: center;
    justify-content: flex-start;
}
.results-content .splide__pagination {justify-content: flex-start;}

.results-content .splide-thumb {
    position: relative;
}
.results-content .splide-thumb > div {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    display: grid;
    grid-template-columns: 50% 50%;
}
.results-content .splide-thumb > div div {position: relative;}
.results-content .splide-thumb > div span {
    display: inline-block;
    background: #9998d2;
    color: #fff;
    text-align: center;
    font-weight: 500;
    font-size: 14px;
    min-width: 77px;
    border-radius: 3px;
    position: absolute;
    left: 4px;
    bottom: 4px;
}
.results-content .splide-text {padding: 0 30px;}
.results-content .splide-text p {
    font-size: 16px;
    font-weight: 300;
    padding: 25px 0 20px 0;
}
.results-content .splide-text h3 {
    font: 20px/1.2 var(--quincy);
    color: var(--akcent);
}

.results-thumb {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    overflow: hidden;
}
.results-thumb img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
}

/* JOURNEY
-------------------------------------- */ 
.journey {
    background: var(--puplelight);
    padding: 75px 0;
}
.journey lottie-player {
    max-width: 55px;
    display: inline-block !important;
    margin-bottom: 15px;
}
.journey .journey-list {
    visibility: visible;
    margin: 10px 0 50px;
}
.journey .journey-list ul {
    display: grid !important;
    grid-template-columns: repeat(3, 275px);
    justify-content: center;
    grid-gap: 0 55px;
    text-align: center;
}
.journey .journey-list li h4 {
    font-weight: bold;
    font-size: 15px;
    margin-bottom: 15px;
}
.journey .journey-list li .image {
    min-height: 100px;
    display: flex;
    justify-content: center;
    align-items: center;
}
.journey .journey-list li p {font-size: 14px;}

.journey .splide-reviews {
    max-width: 720px;
    margin: 55px auto 0;
    visibility: visible;
}
.journey .splide-reviews p {
    text-align: center;
    font: 29px/1.4 var(--quincy);
}

/* GIFT
-------------------------------------- */ 
.gifts {
    padding: 70px 0 30px 0;
    background: url(../img/bg-gift.jpg) no-repeat center bottom;
    background-size: cover;
}
.gifts .center {
    display: flex;
    justify-content: space-between;
    max-width: 1300px;
}

.gifts p.subtitle {
    text-align: left;
    font-size: 14px;
    letter-spacing: 1px;
    color: #0c0c0c;
}
.gifts h2.title {
    font-size: 58px;
    text-align: left;
}
.gifts .left p:not(.subtitle) {font-size: 18px;}
.gifts .left h3 {
    margin-top: 20px;
    font: normal 34px/1 var(--quincy);
}
.gifts .left h3 span {position: relative;}
.gifts .left h3 span:after {
    content: '';
    display: inline-block;
    width: 74px;
    height: 27px;
    background: url(../img/strikethrough.png) no-repeat;
    position: absolute;
    top: 50%;
    left: 0;
    transform: translateY(-50%);
}
.gifts .left small {
    display: inline-block;
    font: normal 18px/1 var(--quincy);
    margin-bottom: 25px;
}

.gifts .thumb {
    margin-top: 90px;
    line-height: 0;
}

.gifts .right {margin-top: 90px;}

.gifts .quote {
    position: relative;
    margin-bottom: 20px;
}
.gifts .quote span {font: normal 34px/1 var(--quincy);}
.gifts .quote:before {
    content: '“';
    display: inline-block;
    font: normal 90px/1 var(--quincy);
    position: absolute;
    top: 0;
    right: 100%;
    margin-top: -20px;
    opacity: 0.82;
}
.gifts .quote:after {
    content: '”';
    display: inline-block;
    font: normal 90px/0 var(--quincy);
    opacity: 0.82;
    position: relative;
    top: 45px;
}

.gifts .right div p:first-child {
    font-size: 18px;
    font-weight: 300;
}
.gifts .right div p:nth-child(2) {
    font: 300 14.5px var(--montserrat);
    color: #3b3b3b;
    margin-bottom: 15px;
}

/* WOMEN
-------------------------------------- */ 
.women {
    padding: 40px 0 0 0;
    position: 10;
}
.women .center .tx-c lottie-player {
    max-width: 60px;
    display: inline-block !important;
    margin-bottom: 15px;
}

.love-video {
    margin-top: 40px;
    display: flex;
    flex-wrap: wrap;
}
.love-video .item {
    width: 20%;
    position: relative;
    min-height: 200px;
    display: flex;
    align-items: flex-start;
}
.love-video .item:after {
    content: '';
    display: block;
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    background: #000;
    opacity: 0.5;
    z-index: 1;
    transition: all 0.3s;
}
.love-video .item:hover:after {opacity: 0;}
.love-video .item img {
    opacity: 1;
    transition: 0.2s linear;
    object-fit: cover;
    object-position: center;
    height: 100%;
    width: 100%;
}
.love-video .item:hover img {
    opacity: 1;
}
.love-video .item div {
    background: url(https://res.cloudinary.com/conversion-labs-inc/image/upload/v1619520345/shapiromd/landing-page/1/img/play-btn.png) center/cover no-repeat;
    width: 40px;
    height: 40px;
    display: inline-block;
    position: absolute !important;
    top: 50%;
    left: 50%;
    margin-top: -20px;
    margin-left: -20px;
    cursor: pointer;
    position: relative;
    z-index: 2;
}

/* SALE
-------------------------------------- */ 
.sale {
    display: grid;
    grid-template-columns: 1fr 570px 1fr;
}

.sale-thumb img {
    display: block;
    object-fit: cover;
    object-position: center;
    width: 100%;
    height: 100%;
}

.sale-text {padding: 50px 50px 40px 80px;}
.sale-text h5 {
    font-weight: 500;
    font-size: 16px;
    color: #606060;
    text-transform: uppercase;
    margin-bottom: 5px;
}
.sale-text h3 {
    font-size: 47px;
    font-weight: bold;
    line-height: 1.1;
    text-transform: uppercase;
    color: var(--purple);
}
.sale-text img {
    margin: 15px 0 30px 0;
    display: block;
    width: 100%;
}
.sale-text .excerpt {
    color: #3b3b3b;
    font-size: 20px;
    margin-bottom: 40px;
    position: relative;
}
.sale-text .excerpt:before,
.sale-text .excerpt:after {
    content: '';
    display: inline-block;
    font: bold 75px/0 Georgia, sans-serif;
    color: #e2e1f0;
    position: absolute;
}
.sale-text .excerpt:before {
    content: '“';
    top: 28px;
    right: 100%;
}
.sale-text .excerpt:after {
    content: '”';
    bottom: -8px;
    left: 100%;
    margin-left: -38px;
}

.sale-doctor {
    padding-top: 50px;
    display: flex;
    justify-content: flex-start;
    align-items: flex-start;
}
.sale-doctor .inner {
    text-align: center;
    padding-bottom: 40px;
}
.sale .signature {margin-top: 15px;}
.sale .signature [data-src="signature"] {
    max-width: 170px;
    min-height: 65px;
    display: inline-block;
    margin-top: 5px;
}
.sale .signature p {
    font-size: 18px;
    font-weight: 300;
    color: #000;
}
.sale .signature p:last-child {
    color: #3b3b3b;
    font-size: 15px;
    font-family: Montserrat, sans-serif;
}

/* REVIEWS MORE
-------------------------------------- */ 
.reviewsmore {
    background: #f3f4f8;
    padding: 90px 0 45px 0;
}
.reviewsmore h3 {
    font-size: 36px;
    font-weight: 500;
    line-height: 1.2;
}
.reviewsmore h3 sup {
    font-size: 0.5em;
}
.reviewsmore > .center:last-child {padding-top: 50px;}
.reviewsmore > .center > h2.title {
    font-size: 30px;
    margin-bottom: 30px;
}
.reviewsmore > .center > h2.title sup {
    font-size: 1.2rem;
}

.reviewsmore-head {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    margin-top: 10px;
}
.reviewsmore-head .rating {
    display: flex;
    align-items: center;
}
.reviewsmore-head .rating span {
    font-size: 60px;
    font-weight: 500;
    margin-right: 20px;
    line-height: 1;
}
.reviewsmore-head .rating p {
    font-size: 15px;
    line-height: 1;
    margin-top: 4px;
}
.reviewsmore-head p {
    font-size: 18px;
}

.reviewsmore-verified {
    background: #fff;
    padding: 30px 25px;
    margin-top: 25px;
    display: flex;
    align-items: center;
    margin-bottom: 30px;
}
.reviewsmore-verified img {margin-right: 30px;}
.reviewsmore-verified h4 {font-size: 16px;}
.reviewsmore-verified p {font-size: 16px;}
.reviewsmore-verified p b {font-weight: 500;}

.reviewsmore-item {
    padding: 40px 30px 30px 30px;
    background: #fff;
    position: relative;
    display: flex;
}
.reviewsmore-item:after {
    content: '';
    display: inline-block;
    height: 1px;
    background: #d1d1d1;
    position: absolute;
    left: 30px;
    right: 30px;
    bottom: 0;
}
.reviewsmore-item .left {min-width: 230px;}
.reviewsmore-item h3 {
    font-size: 24px;
    font-weight: 500;
    margin-bottom: 10px;
}

.reviewsmore-item .left > div {
    display: flex;
    align-items: center;
    font-size: 15px;
}
.reviewsmore-item .left > div i {
    width: 18px;
    height: 18px;
    min-width: 18px;
    background: url(../img/ic-checkmark.png) no-repeat;
    margin-right: 5px;
    position: relative;
    top: 1px;
}

.reviewsmore-item .helpful {
    margin-top: 25px;
    max-height: 30px;
    display: inline-flex;
    justify-content: center;
    align-items: center;
    border: 2px solid #e5e5e5;
    border-radius: 5px;
    width: 130px;
    font-size: 14px;
    font-weight: 500;
    color: #b1b1b1;
    min-height: 32px;
    transition: all 0.3s ease;
    user-select: none;
}
.reviewsmore-item .helpful:hover {
    border-color: var(--akcent_2);
    color: var(--akcent_2);
}
.reviewsmore-item .helpful.active {
    border-color: var(--akcent);
    color: var(--akcent);
}
.reviewsmore-item .helpful i {
    display: inline-block;
    width: 40px;
    margin-right: -5px;
    margin-top: -14px;
    margin-left: -10px;
}
.reviewsmore-item h4 {
    font-size: 18px;
    font-weight: 500;
    margin-top: 10px;
    margin-bottom: 10px;
}
.reviewsmore-item p {font-size: 16px;}
.reviewsmore-item:last-child:after {display: none;}

/* POPUP
-------------------------------------- */
.popup-overlay {
    position: fixed;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    z-index: 99999;
    background: rgba(0,0,0,.8);
}
.nav-active .popup-overlay {
    background: rgba( 255, 255, 255, 0.05 );
    backdrop-filter: blur( 5px );
    z-index: 999;
}

.popup {
    position: fixed;
    top: 0;
    left: 50%;
    z-index: 999991;
    transform: translateX(-50%);
}

.popup-overlay,
.popup {
    display: none;
    opacity: 0;
}

.popup-overlay.active,
.popup.active {
    display: block;
    opacity: 1;
/*    animation: opacity 0.1s linear forwards;*/
}

.popup-close {
    position: fixed;
    top: 0;
    right: 0;
    width: 45px;
    height: 45px;
    background: rgba(30, 30, 30, 0.6);
    display: flex;
    justify-content: center;
    align-items: center;
    border: none;
    cursor: pointer;
}
.popup-close svg {
    width: 25px;
    height: 25px;
}
.popup-close svg path {
    fill: #fff;
    stroke-width: 0;
}

.popup-video {
    width: 100%;
    height: 100%;
}

@keyframes opacity {100% {opacity: 1;}}

.popup iframe {
    width: 100%;
    height: 100%;
    border: none;
}

/* ANIMATION
-------------------------------------- */
.animated {
    opacity: 0;
    transition: opacity 500ms;
}

.animated.show {
    animation: fade-bottom 0.6s ease-in-out both;
}

@keyframes fade-bottom {
    0% {
        transform: translateY(50px);
        opacity: 0;
    }

    100% {
        transform: translateY(0);
        opacity: 1;
    }
}

/* FOOTER
-------------------------------------- */
.footer {margin-top: 30px;}
.footer .center {
    max-width: 1300px;
    padding: 0 15px;
}
.footer .center:last-child {
    padding-bottom: 40px;
    line-height: 1.2;
}
.footer-main {
    display: grid;
    grid-template-columns: 260px 1fr 260px;
    border-top: 1px solid rgba(0,0,0,.1);
}
.footer-main div {
    display: flex;
    justify-content: center;
    align-items: center;
    flex-wrap: wrap;
    text-align: center;
    padding: 15px 15px;
    border-left: 1px solid rgba(0,0,0,.1);
    color: #999;
}
.footer-main div:first-child {border-left: none;}
.footer-main div:first-child img {margin-right: 10px;}
.footer-main div.middle {
    padding-left: 0;
    padding-right: 0;
}
.footer-main div.middle p {margin-left: auto;}
.footer-main .bbb {
    display: inline-block;
    max-width: 100px;
    margin: 0 auto;
}

.footer-main .social {
    display: inline-block;
    color: #888;
    margin: 0 13px;
    line-height: 0;
    transition: all 0.3s;
}
.footer-main .social:hover {color: var(--akcent_2);}
.footer-main .social:first-child svg {max-width: 12px;}
.footer-main .social svg {max-width: 20px;}
.footer-main .social:last-child svg {max-width: 18px;}

.footer-copy {
    border-top: 1px solid rgba(0,0,0,.1);
    display: flex;
    justify-content: space-between;
    padding-top: 20px !important;
    padding-bottom: 40px !important;
}
.footer-copy ul {
    display: flex;
    align-items: center;
}
.footer-copy ul li a {
    position: relative;
    margin-right: 20px;
    color: #999;
    transition: all 0.3s;
}
.footer-copy ul li a:hover {color: var(--akcent_2);}
.footer-copy ul li a:after {
    content: "";
    position: absolute;
    top: 50%;
    right: -10px;
    transform: translateY(-50%);
    width: 100%;
    height: 60%;
    border-right: 1px solid #bbbcbc;
    z-index: -1;
    margin-top: 2px;
}
.footer-copy ul li:last-child a:after {display: none;}
.footer-copy .copy {color: #999;}

@media screen and (max-width: 1600px) {
    /* HEADER */
    .head-main .inner {padding: 13px 50px;}

    /* TRANSFORM */
    .transform {min-height: 700px;}
    .transform .circle {right: 60px;}
}

@media screen and (max-width: 1500px) {
    /* TRANSFORM */
    .transform {min-height: 600px;}

    /* HAIR */
    .hair-product > .text > .inner > p br {display: none;}

    /* PRODUCTS */
    .products .text p br {display: none;}

    /* RESULTS */
    .results .center {max-width: 1400px;}
}

@media screen and (max-width: 1400px) {
    .results-thumb {width: 450px;}
}

@media screen and (max-width: 1300px) {
    body {font-size: 14px;}
    h2.title {font-size: 35px;}
    p.subtitle {
        font-size: 13px;
        margin-top: 5px;
    }

    .center {max-width: 1000px;}

    .btn {
        height: 43px;
        font-size: 14px;
        padding: 0 45px;
    }
    .btn-group p {
        text-align: center;
        font-size: 12px;
        line-height: 1.7;
        margin-top: 10px;
    }

    /* HEADER */
    .head-line {height: 45px;}
    .head-line .left:after {border-bottom: 45px solid transparent;}
    .head-line .right:after {border-top: 45px solid transparent;}
    .head-line .right .text p:first-child {font-size: 9px;}
    .head-line .right .text p:last-child {font-size: 15px;}
    .head-btn {font-size: 15px;}

    .head-main {padding: 15px 15px 0 15px;}
    .head-main .inner {padding: 10px 20px;}
    .nav ul li + li {margin-left: 10px;}
    .logo {max-width: 170px;}
    .head-btn_2 {
        min-height: 40px;
        font-size: 14px;
        min-width: 190px;
    }

    /* HOME */
    .home {margin-top: 45px;}
    .home .center {
        bottom: 125px;
        padding: 0 15px;
    }
    .home h1 {font-size: 65px;}
    .home p {
        margin: 5px 0 40px;
        font-size: 19px;
    }
    .home .center img {
        max-width: 175px;
        margin-top: 40px;
    }
    .home .derm {max-width: 120px;}
    .home .derm img:last-child {max-width: 90px;}
    
    .home .splide__slide {
        min-height: 650px;
        max-height: 650px;
    }
    .home .splide__pagination__page {
        width: 55px;
        height: 5px;
    }

    /* RECOMMENDED */
    .recommended {padding: 40px 0 55px;}
    .recommended .center {max-width: 750px;}
    .recommended ul h3 {font-size: 45px;}
    .recommended ul p {font-size: 18px;}
    .recommended ul {margin-top: 35px;}

    /* LOGOS */
    .logos {padding: 15px 0;}

    /* TRANSFORM */
    .transform {min-height: 450px;}
    .transform .center > p {
        font-size: 14px;
        margin-top: 10px;
        margin-bottom: 30px;
    }
    .transform .circle {
        top: 40px;
        right: 50px;
        max-width: 130px;
    }

    /* HAIR */
    .hair {padding-top: 40px;}
    .hair-product {margin-top: 40px;}
    .hair-product .text small {font-size: 10px;}
    .hair-product .text h3 {font-size: 25px;}
    .hair-product .text > .inner > p {
        font-size: 14px;
        margin-top: 15px;
    }
    .hair-product .text ul {
        margin-top: 20px;
        margin-bottom: 20px;
    }
    .hair-product .text h4 {
        margin-bottom: 20px;
        font-size: 18px;
    }

    /* REVIEWS */
    .reviews {padding: 50px 0;}
    .reviews .tx-c {margin-bottom: 20px;}
    .reviews .tx-c > h3 {font-size: 27px;}
    .reviews .tx-c img {
        margin-top: 10px;
        max-width: 200px;
    }

    .reviews .splide {
        margin-left: -15px;
        margin-right: -15px;
    }
    .reviews .splide__slide {padding: 15px;}

    .splide__pagination {margin-top: 20px;}

    .reviews-foot h4 {
        font-size: 23px;
        margin: 20px 0 20px 0;
    }
    .reviews-foot p {font-size: 14px;}

    /* PRODUCTS */
    .products .text {padding: 20px;}

    .tags span {
        padding: 2px 10px;
        font-size: 12px;
    }

    .products h3 {
        margin-top: 20px;
        margin-bottom: 20px;
        font-size: 25px;
    }
    .products p + p {margin-top: 15px;}
    .products ul {margin-top: 20px;}

    /* INGRADIENTS */
    .ingradients {padding: 40px 0 35px 0;}
    .ingradients .splide .splide__list {
        display: flex !important;
        grid-template-columns: inherit;
    }
    .ingradients .splide {
        margin-left: -15px;
        margin-right: -15px;
        margin: 20px 0 30px 0;
    }
    .ingradients .splide__slide {padding: 20px 15px;}
    .ingradients .splide__slide h3 {
        margin-top: 10px;
        font-size: 18px;
    }
    .ingradients .splide__slide p {
        margin-top: 5px;
        font-size: 13px;
    }
    .ingradients .splide__slide p br {display: none;}

    /* RESULTS */
    .results .center {
        max-width: 1100px;
    }
    .results-content {
        padding: 40px 0 40px 0;
        max-width: 650px;
    }
    .results-content .splide__slide {
        grid-template-columns: 305px 330px;
    }
    .results-content .splide-text {padding: 0 20px;}
    .results-content .splide-text p {
        font-size: 13px;
        font-weight: 300;
        padding: 20px 0 10px 0;
    }
    .results-thumb {
        width: 350px;
    }

    /* JOURNEY */
    .journey {padding: 50px 0;}
    .journey .journey-list {margin: 0 0 40px;}
    .journey .journey-list ul {
        grid-template-columns: repeat(3, 254px);
        grid-gap: 0 45px;
    }
    .journey .journey-list li h4 {
        font-size: 13px;
        margin-bottom: 10px;
    }
    .journey .journey-list li p {font-size: 13px;}

    .journey .splide-reviews {
        max-width: 550px;
        margin: 40px auto 0;
    }
    .journey .splide-reviews p {font-size: 20px;}

    /* GIFTS */
    .gifts {padding: 50px 0 20px 0;}
    .gifts .center {max-width: 1000px;}
    .gifts p.subtitle {font-size: 10px;}
    .gifts h2.title {font-size: 40px;}
    .gifts .left p:not(.subtitle) {font-size: 14px;}
    .gifts .left h3 {font-size: 24px;}
    .gifts .left small {font-size: 14px;}

    .gifts .right {margin-top: 60px;}
    .gifts .quote span {font-size: 25px;}
    .gifts .quote:before {
        margin-top: -15px;
        font-size: 70px;
    }
    .gifts .quote:after {
        top: 37px;
        font-size: 70px;
    }
    .gifts .right div p:first-child {font-size: 15px;}
    .gifts .right div p:nth-child(2) {font-size: 12px;}
    .gifts .right img {max-width: 170px;}

    .gifts .thumb {
        margin-top: 50px;
        max-width: 350px;
    }

    /* SALE */
    .sale {grid-template-columns: 1fr 365px 1fr;}

    .sale-text {padding: 40px 30px 0 40px;}
    .sale-text h5 {font-size: 13px;}
    .sale-text h3 {font-size: 30px;}
    .sale-text img {margin-bottom: 15px;}
    .sale-text .excerpt {
        font-size: 13px;
        margin-bottom: 15px;
    }
    .sale-text .excerpt:before, 
    .sale-text .excerpt:after {
        font-size: 50px;
    }
    .sale-text .excerpt:before {top: 24px;}
    .sale-text .excerpt:after {
        bottom: -4px;
        margin-left: -34px;
    }

    .sale-doctor {padding-right: 15px;}
    .sale-doctor img {max-width: 250px;}
    .sale .signature [data-src="signature"] {
        max-width: 120px;
        min-height: 46px;
    }
    .sale .signature p {font-size: 14px;}
    .sale .signature p:last-child {font-size: 12px;}

    /* FOOTER */
    .footer-copy {
        flex-direction: column;
        align-items: center;
    }
    .footer-copy ul {
        flex-wrap: wrap;
        justify-content: center;
        text-align: center;
    }
    .footer-copy .copy {margin-top: 10px;}
    .footer-main .middle {flex-direction: column;}
    .footer-main .middle p {margin-right: auto;}
    .footer-main .bbb {margin-top: 10px;}
}

@media screen and (max-width: 991px) {
    h2.title {font-size: 30px;}

    /* HEADER */
    .head-btn {font-size: 14px;}
    .nav,
    .head-btn_2 {
        display: none;
        opacity: 0;
    }
    .head-main .inner {padding: 20px 15px;}
    body.nav-active .head-main .inner {background: none;}

    .nav {
        position: absolute;
        top: 0;
        left: 0;
        right: 0;
        padding-top: 50px;
        padding-bottom: 25px;
        z-index: -1;
        background: rgba(255,255,255,.9);
        align-items: center;
        justify-content: center;
        border-radius: 8px;
    }
    .nav ul {
        display: block;
        text-align: center;
    }
    .nav ul li + li {
        margin-left: 0;
        margin-top: 7px;
    }
    .nav ul li a {
        font-weight: bold;
        font-size: 15px;
        text-transform: uppercase;
        color: var(--akcent_2);
    }
    .nav ul li a.btn {
        color: #fff;
        font-weight: 500;
    }

    .btn-nav {
        display: block !important;
        width: 35px;
        height: 17px;
        background: none;
        border: none;
        margin-left: auto;
        position: relative;
        z-index: 9991;
    }
    .btn-nav span {
        display: block;
        width: 100%;
        height: 3px;
        background: var(--purple);
        transform-origin: center;
        transition: all 0.3s;
    }
    .btn-nav span + span {margin-top: 4px;}
    body.nav-active .btn-nav span {
        position: absolute;
        top: 50%;
        margin-top: -1.5px;
    }
    body.nav-active .btn-nav span:first-child {transform: rotate(45deg);}
    body.nav-active .btn-nav span:last-child {transform: rotate(-45deg);}
    body.nav-active .btn-nav span:nth-child(2) {display: none;}

    body.nav-active .nav {
        display: flex;
        animation: opacity 0.5s linear forwards;
    }

    /* HOME */
    .home .center {
        bottom: 100px;
        padding: 0 15px;
    }
    .home h1 {font-size: 50px;}
    .home p {
        margin: 0px 0 30px;
        font-size: 15px;
    }
    .home .center img {
        max-width: 165px;
        margin-top: 30px;
    }

    .home .splide__slide {
        min-height: 500px;
        max-height: 500px;
    }

    /* TRANSFORM */
    .transform {min-height: 350px;}
    .transform .circle {
        top: 25px;
        right: 20px;
        max-width: 120px;
    }
    .transform .center > p {font-size: 12px;}

    /* HAIR */
    .hair-product .text {padding: 25px;}
    .hair-product .text h4 br {display: none;}

    /* PRODUCTS */
    .products ul li i {margin-right: 7px;}

    /* RESULTS */
    .results-content .splide__slide {grid-template-columns: 240px 290px;}
    .results-content .splide-text h3 {font-size: 15px;}
    .results-thumb {width: 230px;}

    /* JOURNEY */
    .journey .journey-list ul {
        grid-gap: 0 15px;
        grid-template-columns: repeat(3, 235px);
    }
    .journey .journey-list li p br {display: none;}

    /* GIFTS */
    .gifts .thumb {max-width: 300px;}
    .gifts h2.title {font-size: 30px;}
    .gifts .left p:not(.subtitle) {font-size: 13px;}
    .gifts .left h3 {font-size: 20px;}
    .gifts .left h3 span:after {
        width: 70px;
        height: 25px;
        background-size: 70px;
    }

    .gifts .quote span {font-size: 20px;}
    .gifts .quote:before {
        margin-top: -12px;
        font-size: 60px;
    }
    .gifts .quote:after {
        top: 32px;
        font-size: 60px;
    }
    .gifts .right div p:first-child {font-size: 12px;}
    .gifts .right div p:nth-child(2) {font-size: 10px;}
    .gifts .right img {max-width: 140px;}

    .gifts .thumb {max-width: 250px;}

    /* SALE */
    .sale {grid-template-columns: 1fr 270px 1fr;}
    .sale-text {padding: 20px 15px 0 25px;}
    .sale-text h5 {font-size: 12px;}
    .sale-text h3 {font-size: 23px;}
    .sale-text img {margin: 10px 0 15px 0;}
    .sale-text .excerpt {
        font-size: 13px;
        line-height: 1.3;
    }
    .sale-text .excerpt br {display: none;}
    .sale-text .excerpt:before, 
    .sale-text .excerpt:after {
        font-size: 40px;
    }
    .sale-text .excerpt:before {top: 19px;}
    .sale-text .excerpt:after {
        bottom: -22px;
        margin-left: 1px;
        display: inline-block;
        position: relative;
        left: inherit;
    }

    .sale-doctor {padding-top: 20px;}
    .sale-doctor .inner {padding-bottom: 25px;}
    .sale-doctor img {max-width: 200px;}
    .sale .signature p {font-size: 13px;}
    .sale .signature p:last-child {font-size: 11px;}

    /* REVIEWSMORE */
    .reviewsmore > .center > h2.title {font-size: 25px;}
    .reviewsmore-head .rating {text-align: center;}
    .reviewsmore-head .rating img {
        margin-top: 5px;
        margin-bottom: 3px;
    }
    .reviewsmore-head .rating img + p {font-weight: 500;}
    .reviewsmore-head .rating img + p + p {font-size: 14px;}

    /* FOOTER */
    .footer-main {grid-template-columns: 1fr;}
    .footer-main div {
        border-bottom: 1px solid rgba(0,0,0,.1);
        border-left: none;
        padding: 20px 15px;
    }

    .footer-copy {border-top: none;}
}

@media screen and (max-width: 750px) {
    body {font-size: 15px;}
    h2.title {font-size: 29px;}
    h2.title sup {font-size: 17px;}

    p.subtitle {
        font-size: 16px;
        margin-top: 10px;
    }

    .btn {
        height: 50px;
        font-size: 16px;
        padding: 0 60px;
    }
    .btn-group p {font-size: 13px;}

    .h-750 {display: none !important;}
    .s-750 {display: block !important;}

    .splide__pagination__page {
        width: 12px;
        height: 12px;
        margin: 0 7px;
    }

    .btn-fixed {
        position: fixed;
        left: 0;
        right: 0;
        bottom: 0;
        background: #fff;
        padding: 10px;
        z-index: 999;
        display: block !important;
        border: none;
        color: #fff;
        font-family: var(--greycliff);
        line-height: 1.5;
    }
    .btn-fixed .inner {
        background: var(--akcent);
        text-align: center;
        padding: 10px;
        animation: shadow-pulse 3s infinite;
    }
    .btn-fixed .big {
        font-weight: 500;
        font-size: 17px;
    }
    .btn-fixed .big span {vertical-align: middle;}
    .btn-fixed .big:after {
        content: '';
        display: inline-block;
        border: solid #fff;
        vertical-align: middle;
        border-width: 2px 2px 0 0;
        padding: 2.5px;
        transform-origin: center;
        transform: rotate(45deg);
        margin-left: 2px;
        position: relative;
        top: 0.5px;
    }
    .btn-fixed .small {font-size: 16px;}

    .head-line {
        height: inherit;
        display: block;
    }
    .head-line .left:after,
    .head-line .right:after {display: none;}

    .head-line .left {
        display: block;
        text-align: center;
        padding-right: 0;
        padding: 5px 15px;
    }
    .head-btn {font-weight: 500;}

    .head-line .right {
        justify-content: center;
        padding: 5px 0;
    }
    .head-line .right .d-none {
        color: var(--akcent_2);
        font-size: 14px;
    }

    .time-part-wrapper {
        width: 30px;
        height: 27px;
        margin-right: 10px;
    }
    .time-part-wrapper:after {
        width: 30px;
        height: 15px;
        right: -33px;
        font-size: 18px;
    }
    .time-part {
        height: 20px;
        width: 11px;
    }
    .digit {
        font-size: 17px;
        height: 25px;
    }

    .head-line .right .text {
        margin-left: 5px;
    }
    .head-line .right .text p:last-child {
        font-size: 12px;
    }
    .head-line .right .d-none  {
        font-size: 12px;
        padding-right: 5px;
        text-transform: uppercase;
    }

    .logo {max-width: 140px;}
    .head-main .inner {padding: 15px 15px;}

    .btn-nav {
        width: 25px;
        height: 15px;
    }
    .btn-nav span {height: 2px;}
    .btn-nav span + span {margin-top: 3px;}

    /* HOME */
    .home {margin-top: 70px;}
    .home h1 {font-size: 45px;}
    .home p {
        font-size: 20px;
        line-height: 1.4;
    }
    .home .btn {display: none;}
    .home .center {bottom: 80px;}
    .home .center img {margin-top: 85px;}
    .home .derm {display: none;}

    .home .splide__pagination li {margin: 0 3px;}
    .home .splide__pagination__page {
        width: 45px;
        height: 4px;
    }

    /* RECOMMENDED */
    .recommended {padding: 40px 0 40px;}
    .recommended .center {padding: 0 0;}
    .recommended ul h3 {font-size: 48px;}
    .recommended ul p {font-size: 20px;}
    .recommended ul {justify-content: inherit;}
    .logos .splide__slide img {max-width: 70px;}
    .recommended .splide__pagination {
        justify-content: center;
        display: block !important;
    }

    /* LOGOS */
    .logos {padding: 10px 0;}
    .logos .splide__slide img {max-width: 80px;}
    .logos .splide__slide.four img,
    .logos .splide__slide.five img {max-width: 60px;}

    /* TRANSFORM */
    .transform {
        background: #dad2c9 url(../img/bg-transformmob.jpg) no-repeat center bottom;
        background-size: 100% auto;
        padding-bottom: 500px;
        padding-top: 50px;
    }
    .transform .center > p {
        font-size: 15px;
        margin-top: 20px;
        margin-bottom: 0;
    }
    .transform .btn-group {display: none;}
    .transform .circle {
        top: 240px;
        right: 10px;
        max-width: 100px;
    }

    /* GALLERY */
    .gallery .splide__pagination {display: none;}

    /* HAIR */
    .hair-product {
        margin-top: 30px;
        display: block;
    }
    .hair-product .text > .inner > p {
        margin-top: 20px;
        font-size: 15px;
    }
    .hair-product .text ul {
        margin-top: 30px;
        margin-bottom: 30px;
    }
    .hair-product .text h4 {
        text-align: center;
        font-size: 23px;
    }
    .hair-product .text small {font-size: 14px;}
    .hair-product .text h3 {font-size: 29px;}
    .hair-product .btn-group {
        display: block;
        text-align: center;
        margin-top: 30px;
    }

    /* REVIEWS */
    .reviews {
        background: #f3f4f8;
        padding-bottom: 0;
        padding-top: 20px;
    }
    .reviews .splide__pagination {margin-top: 40px;}
    .reviews-foot {
        background: #fff;
        padding: 30px 15px 50px;
        margin-right: -15px;
        margin-left: -15px;
        margin-top: 50px;
    }
    .reviews-foot h4 {
        margin: 20px 0 30px 0;
        font-size: 21px;
    }
    .reviews .tx-c > h3 {
        font-size: 29px;
        margin-top: 10px;
    }

    /* PRODUCTS */
    .products .row {grid-template-columns: 1fr;}
    .products .inner {
        display: flex;
        flex-direction: column;
    }

    .products h3 {
        margin-top: 10px;
        margin-bottom: 15px;
        font-size: 29px;
        order: -1;
    }
    .products .tags {margin-bottom: 30px;}
    .products p + p {margin-top: 20px;}
    .products ul {margin-top: 30px;}
    .products .text.reverse {order: 1;}
    .products .text {padding: 25px 15px 40px 15px;}
    .products ul li + li {margin-top: 20px;}

    /* INGRADIENTS */
    .ingradients .splide {
        margin-left: -15px;
        margin-right: -15px;
    }
    .ingradients .splide__slide .inner {padding: 25px 20px 30px 20px;}
    .ingradients .splide__slide h3 {font-size: 23px;}
    .ingradients .splide__slide p {font-size: 16px;}
    .ingradients .splide__slide p br {display: none;}

    /* RESULTS */
    .results h2.title {text-align: center;}
    .results h2.title b {font-weight: normal;}
    .results-content {max-width: inherit;}
    .results-thumb {display: none;}
    .results-content .splide__slide {grid-template-columns: 1fr;}
    .results-content .splide-text {padding: 20px 0 0 0;}

    .tags span {
        padding: 4px 22px;
        font-size: 14px;
    }

    .results-content .splide-text p {font-size: 16px;}
    .results-content .splide-text h3 {font-size: 23px;}
    .results-content .splide__pagination {justify-content: center;}

    /* JOURNEY */
    .journey .journey-list {
        margin-left: -15px;
        margin-right: -15px;
        margin-top: 40px;
    }
    .journey .journey-list ul.splide__list {
        display: flex !important;
        grid-gap: inherit;
        grid-template-columns: inherit;
        justify-content: inherit;
    }
    .journey .journey-list .splide__slide {padding: 0 15px;}
    .journey .journey-list li .image {
        min-height: 53px;
        margin-bottom: 15px;
    }
    .journey .journey-list li h4 {font-size: 14px;}
    .journey .journey-list li p br {display: none;}
    .journey .journey-list ul.splide__pagination {
        grid-template-columns: inherit;
        display: flex !important;
        grid-gap: inherit;
        margin-top: 30px;
    }

    .journey .splide-reviews {
        max-width: inherit;
        margin: 30px auto 0;
    }
    .journey .splide-reviews .splide__pagination {display: none;}
    .journey .splide-reviews p br {display: none;}
    .journey .tx-c.d-none {margin-top: 30px;}

    /* ORDER */
    .gifts {
        background: url(../img/bg-giftmob.jpg) no-repeat center bottom;
        background-size: cover;
        padding: 30px 0 30px 0;
    }
    .gifts .center {flex-direction: column;}
    .gifts p.subtitle {font-size: 15px;}
    .gifts h2.title {font-size: 45px;}
    .gifts h2.title + img {
        max-width: 90px;
        margin-top: 10px;
        margin-bottom: 8px;
    }
    .gifts .left p:not(.subtitle) {font-size: 17px;}
    .gifts .left h3 {font-size: 34px;}
    .gifts .left small {font-size: 19px;}
    .gifts .btn {display: none;}

    .gifts .thumb {
        max-width: inherit;
        margin-top: 10px;
        margin-right: -15px;
    }

    .gifts .right {
        margin-top: 20px;
        display: flex;
        flex-direction: column;
        align-items: center;
    }
    .gifts .quote span {
        font-size: 25px;
        line-height: 1.3;
        margin-right: -15px;
    }
    .gifts .quote:after {right: -18px;}
    .gifts .right div p:first-child {font-size: 16px;}
    .gifts .right div p:nth-child(2) {font-size: 13px;}
    .gifts .right img {display: none;}

    /* LOVE VIDEO */
    .love-video .item {
        width: 33.33%;
        min-height: 150px;
    }

    /* SALE */
    .sale {grid-template-columns: 1fr;}
    .sale-thumb {
        order: 1;
        position: relative;
    }
    .sale-thumb .circle {
        position: absolute;
        top: 25px;
        left: 20px;
        max-width: 110px;
    }
    .sale-doctor {display: none;}
    .sale-text {padding: 45px 15px 45px 15px;}
    .sale-text h5 {font-size: 17px;}
    .sale-text h3 {font-size: 42px;}
    .sale-text .excerpt {
        font-size: 18px;
        margin-top: 25px;
        padding: 0 15px;
    }
    .sale-text .excerpt br {display: none;}
    .sale-text .excerpt:before {margin-right: -13px;}
    .sale-text .excerpt:after {
        bottom: -21px;
        margin-left: 0;
        position: relative;
        left: inherit;
    }

    .sale .signature {text-align: right;}
    .sale .signature p {font-size: 15px;}
    .sale .signature p:last-child {font-size: 12.3px;}

    .sale .btn-group {
        order: 1;
        text-align: center;
        margin: 35px 0;
    }

    /* REVIEWSMORE */
    .reviewsmore {padding: 45px 0 45px 0;}
    .ic-user {
        display: inline-block;
        width: 70px;
        height: 35px;
        background: url(../img/ic-user.png);
        background-size: 70px;
        margin-bottom: 30px;
    } 
    .reviewsmore > .center > h3 {
        font-size: 25px;
        text-align: center;
    }
    .reviewsmore-head {
        align-items: center;
        margin-top: 10px;
        flex-direction: column;
    }
    .reviewsmore-verified {padding: 15px;}
    .reviewsmore-item {
        display: flex;
        flex-direction: column;
        padding: 25px 20px;
    }
    .reviewsmore-item:after {
        left: 20px;
        right: 20px;
    }
    .reviewsmore-item .left {
        min-width: inherit;
        margin-bottom: 20px;
        display: flex;
        justify-content: space-between;
    }
    .reviewsmore-item .left + div {
        display: flex;
        flex-direction: column;
        align-items: flex-start;
    }
    .reviewsmore-item .left + div img {
        max-width: 150px;
        width: 100%;
    }
    .reviewsmore-item h3 {margin-bottom: 0;}
    .reviewsmore-item .left .helpful {display: none;}
    .reviewsmore > .center.tx-c h2.title br {display: none;}  
    .reviewsmore > .center:last-child {padding-top: 30px;}
    .reviewsmore-item p + .helpful {
        display: inline-flex !important;
        margin-left: auto;
        margin-bottom: 5px;
    }

    /* FOOTER */
    .footer .center:last-child {padding-bottom: 120px !important;}
}

@media screen and (max-width: 413px) {
    h2.title {font-size: 26px;}
    p.subtitle {font-size: 14px;}

    .tags span {
        padding: 4px 15px;
        font-size: 13px;
    }

    /* HEADER */
    .head-line .right .d-none {font-size: 11px;}
    .head-line .right .text p:last-child {font-size: 11px;}

    /* RECOMMENDED */
    .recommended ul h3 {font-size: 38px;}
    .recommended ul p {font-size: 15px;}

    /* TRANSFORM */
    .transform .center > p {font-size: 14px;}
    .transform .circle {
        top: 245px;
        max-width: 90px;
    }

    /* REVIEWS */
    .reviews .tx-c > h3 {font-size: 22px;}

    /* GIFTS */
    .gifts p.subtitle {font-size: 12px;}
    .gifts h2.title {font-size: 41px;}
    .gifts .left p:not(.subtitle) {font-size: 15px;}
    .gifts .quote span {font-size: 22px;}
    .gifts .right div p:first-child {font-size: 14px;}
    .gifts .right div p:nth-child(2) {font-size: 11.5px;}
    .gifts .left h3 span:after {
        width: 70px;
        height: 25px;
        background-size: 70px;
    }

    /* SALE */
    .sale-text h3 {font-size: 35px;}
}

@media screen and (max-width: 370px) {
    /* HEADER */
    .head-line .right .d-none {font-size: 11.5px;}
    .head-line .right .text p:last-child {font-size: 11.5px;}
}