@charset "utf-8";

/* ------------------------------- RESET ------------------------------- */

html {margin: 0; padding: 0; height: 100%;}
body, div, span, ul, ol, li, h1, h2, h3, h4, h5, h6, pre, a, font, small, strong, b, u, i, center, label, form, fieldset,
input, button, textarea, img, p, table, tr, th, td, dl, dt, dd {
    margin: 0; padding: 0; border: 0; outline: 0; font-size: 100%; background: transparent;
}
table {border-collapse: collapse; border-spacing: 0;}
ol, ul, li {list-style: none;}
h1, h2, h3, h4, h5, h6 {font-size: 100%; font-weight: normal;}
input, button, textarea, select, optgroup, option {
    font-family: inherit; font-size: inherit; font-style: inherit; font-weight: inherit;
}
input, button, textarea, select {font-size: 100%; display: block;}
input[type=text], input[type=submit], textarea{-webkit-appearance: none;}
input[type=text]::placeholder {color: #929BAD; font-size: 14px;}
input:-webkit-autofill {
    -webkit-box-shadow: inset 0 0 0 50px #F6F6F6 !important; -webkit-text-fill-color: #000000 !important; color: #000000 !important;
}
select {outline: 0;}
:focus {outline: none;}
* {-webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box;}
*:before, *:after {-webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box;}
::-moz-focus-inner {border: 0; padding: 0;}

:root {
    --primary-orange: #F0482D;
    --primary-white: #FFFFFF;
    --primary-lidht-blue: #FAFAFD;
}

/* ------------------------------- DEFAULT ------------------------------- */

html {-webkit-tap-highlight-color: rgba(0, 0, 0, 0); scroll-behavior: smooth;}
body {
    background: #FFFFFF; color: #000000; font-family: 'Montserrat', sans-serif; display: flex; flex-direction: column; min-width: 375px;
    min-height: 100vh; font-size: 16px; line-height: 130%;
}
div, label {display: block;}
a {text-decoration: none; color: #151515; cursor: pointer;}
.wrap {padding: 0 60px; margin: 0 auto; width: 100%; max-width: 1600px;}
.items {display: flex;}
.items > div {flex-grow: 1; flex-basis: 0;}

h2 {font-size: 50px; font-family: AdamantC, sans-serif; color: #1E4A42; line-height: 130%;}

.btn_primary {
    display: block; line-height: 56px; text-align: center; font-size: 16px; font-weight: 600; height: 56px; cursor: pointer; border-radius: 12px;
    user-select: none; padding: 0 30px; background: #1E4A42; color: #FFFFFF; transition: .3s ease-in-out;
}
.btn_primary:hover {background: #173731;}

.dn {display: none !important;}

@media only screen and (max-width: 1024px) {
    .wrap {padding: 0 32px;}
    .btn_primary {font-size: 16px; height: 46px; line-height: 46px;}
    h2 {font-size: 24px; line-height: 120%;}
}

@media only screen and (max-width: 800px) {
    .wrap {padding: 0 16px;}
}

/* -------------------------------- MODAL --------------------------------- */

#modal {
    position: fixed; top: 0; bottom: 0; left: 0; width: 100%; height: 100%; overflow: hidden;
    display: none; opacity: 0; filter: alpha(opacity=0); background: rgba(0, 0, 0, 0.60); backdrop-filter: blur(10px); z-index: 1000;
}
#modal_container {
    overflow-y: auto; z-index: 1001; top: 0; bottom: 0; left: 0; width: 100%; height: 100%;
    text-align: left; direction: ltr; position: fixed;
}
#modal.active {display: block; opacity: 1; filter: alpha(opacity=100);}
#modal_overlay {position: absolute; width: 100%; min-height: 100%; left: 0; top: 0; display: flex; align-items: center;}
#modal_content {position: relative; height: auto; margin: 20px auto; padding: 0; overflow: hidden; width: 100%;}
.modal_close {position: absolute; right: 25px; top: 25px; cursor: pointer; color: #FFFFFF; opacity: .7; transition: .3s ease-in-out;}
.modal_close:hover {opacity: 1;}

@media only screen and (max-width: 1024px) {
    #modal_content {padding: 0;}
    .modal_close {right: 16px; top: 20px;}
}

#filters_modal {background: #FFFBEC; border-radius: 50px; padding: 50px 0;}
#filters_modal > .title {
    font-size: 40px; font-family: 'AdamantC', sans-serif; color: #1E4A42; line-height: 130%; padding: 0 50px 20px;
    border-bottom: 1px solid #1E4A42;
}
#filters_modal > .filter {padding: 20px 50px; border-bottom: 1px solid #1E4A42;}
#filters_modal > .filter:last-of-type {border-bottom: none;}
#filters_modal > .filter > .title {font-size: 30px; margin-bottom: 20px; color: #1E4A42; line-height: 130%;}
#filters_modal > .filter > .properties {display: flex; flex-wrap: wrap;}
#filters_modal > .filter > .properties > button {
    padding: 8px 20px; font-size: 18px; color: #1E4A42; background: #A7D1AB; border-radius: 20px;
    margin-right: 10px; margin-bottom: 10px; cursor: pointer; transition: .3s ease-in-out;
}
#filters_modal > .filter > .properties > button.active {background: #1E4A42; color: #A7D1AB;}

#blog_modal {background: #FFFFFF; padding: 40px;}
#blog_modal .modal_close {color: #000000;}
#blog_modal > h2 {font-size: 32px; font-weight: 700; font-family: 'Montserrat', sans-serif; line-height: 130%; margin-bottom: 20px;}
#blog_modal > .date {margin-bottom: 20px; color: rgba(0, 0, 0, .5); font-size: 14px;}
#blog_modal > img {width: 100%; display: block; margin-bottom: 20px;}
#blog_modal > article p {font-size: 18px; color: #000000; line-height: 130%; margin-bottom: 1rem;}
#blog_modal > article ol {list-style-type: decimal; padding-inline-start: 40px;}
#blog_modal > article ol > li {display: list-item !important; list-style-type: decimal; font-size: 18px; color: #000000; margin-bottom: 5px; line-height: 130%;}
#blog_modal > article ul {list-style-type: disc; padding-inline-start: 40px;}
#blog_modal > article ul > li {display: list-item !important; list-style-type: disc; font-size: 18px; color: #000000; margin-bottom: 5px; line-height: 130%;}

@media only screen and (max-width: 1024px) {
    #blog_modal {padding: 20px;}
    #blog_modal > h2 {font-size: 22px;}
    #blog_modal > article p {font-size: 16px;}
    #blog_modal > article ol {padding-inline-start: 20px;}
    #blog_modal > article ol > li {font-size: 16px;}
    #blog_modal > article ul {padding-inline-start: 20px;}
    #blog_modal > article ul > li {font-size: 16px;}
}

/* -------------------------------- MENU --------------------------------- */

#menu {position: fixed; width: 100%; top: 0; z-index: 25; padding: 20px 0; transition: .3s ease-in-out; border-bottom: transparent;}
#menu.sticky, #menu.dark, #menu.mobile {background: #FFFFFF; color: #1E4A42; border-bottom: 1px solid #1E4A42;}
#menu.sticky > .wrap svg, #menu.dark > .wrap svg, #menu.mobile > .wrap svg {color: #1E4A42;}
#menu.sticky > .wrap .btn_primary, #menu.dark > .wrap .btn_primary, #menu.mobile > .wrap .btn_primary {border: 1px solid #1E4A42; color: #1E4A42;}
#menu.sticky > .wrap > a.logo, #menu.dark > .wrap > a.logo, #menu.mobile > .wrap > a.logo {filter: none;}
#menu > .wrap {display: flex; align-items: center;}
#menu > .wrap svg {width: 30px; height: 30px; margin-right: 12px; color: #FFFFFF; cursor: pointer; transition: .3s ease-in-out;}
#menu > .wrap svg.big {height: 40px; position: relative; top: -10px;}
#menu > .wrap > a:not(.btn_primary):not(.logo) {height: 30px; display: block;}
#menu > .wrap > a.logo {width: 170px; margin-right: auto; filter: grayscale(1) brightness(1000%); transition: .3s ease-in-out;}
#menu > .wrap > a.logo > img {width: 100%;}
#menu > .wrap .btn_primary {
    color: #FFFFFF; background: none; border: 1px solid #FFFFFF; height: 46px; line-height: 46px;
    font-size: 16px; font-weight: 600; font-family: Inter, sans-serif; margin-left: 15px;
}

.burger_menu {display: none;}
.burger_menu > svg:last-child {display: none;}
#menu.mobile .burger_menu > svg:first-child {display: none;}
#menu.mobile .burger_menu > svg:last-child {display: block;}

#mobile_menu {display: none; position: sticky; top: 63px; background: #FFFFFF; height: calc(100vh - 63px); z-index: 20;}
#mobile_menu.active {display: block; overflow-y: auto;}
#mobile_menu .switch_language > span.active {color: #D2054E;}
.mobile_menu {
    display: flex; flex-direction: column; align-items: flex-start; padding: 40px 0; border-top: 1px solid rgba(255, 255, 255, 0.20);
    height: calc(100vh - 65px); max-height: 400px;
}
.mobile_menu > .links {
    display: flex; flex-direction: column; align-items: flex-start; font-size: 16px; color: #000000; line-height: 130%; padding: 0 20px;
}
.mobile_menu > .links a {margin-bottom: 12px; text-align: left; padding-left: 32px;}
.mobile_menu > .cart {margin-top: auto; padding: 24px 20px 0; border-top: 1px solid #5454541A; width: 100%;}
.mobile_menu > .cart a {font-size: 16px; line-height: 20px; color: #151515; display: flex; align-items: center;}
.mobile_menu > .cart a > svg {margin-right: 12px;}
.mobile_menu > .cart > a:not(:last-child) {margin-bottom: 12px;}
.mobile_menu > .profile {margin-bottom: auto; padding: 0 20px 24px; border-bottom: 1px solid #5454541A; width: 100%;}
.mobile_menu > .profile a {font-size: 16px; line-height: 20px; color: #151515; display: flex; align-items: center;}
.mobile_menu > .profile a > svg {margin-right: 12px;}
.mobile_menu > .contacts {padding: 45px 0; border-bottom: 1px solid #5454541A; width: 100%; color: #151515; font-weight: 600; font-size: 15px; text-transform: uppercase;}
.mobile_menu > .contacts > a {display: block; text-decoration: underline;}
.mobile_menu > .retail {padding: 45px 0; border-bottom: 1px solid #5454541A; width: 100%; color: #151515; font-weight: 600; font-size: 15px; text-transform: uppercase; display: flex; flex-wrap: wrap;}
.mobile_menu > .retail > p {width: 100%;}
.mobile_menu > .retail > a {display: block; text-decoration: underline; width: 44px;}
.mobile_menu > .retail > a > img {display: block; width: 100%;}
.mobile_menu .line {width: 220px; height: 1px; min-height: 1px; background: rgba(255, 255, 255, 0.20); margin-bottom: 20px;}

@media only screen and (max-width: 1024px) {
    #menu {padding: 20px 0;}
    #menu > .wrap > a.logo {width: 120px;}
    #menu > .wrap .btn_primary {display: none;}
    #menu > .wrap > a:not(.btn_primary):not(.logo) {height: 24px;}
    #menu > .wrap svg {width: 24px; height: 24px; margin-right: 12px;}
    #menu > .wrap > svg:nth-child(5) {display: none;}
    .burger_menu {display: block; height: 24px; min-width: 24px; cursor: pointer;}
    .burger_menu > svg {margin-right: 0 !important;}
    #menu > .wrap svg.big {top: -13px;}
}

/* -------------------------------- AUTH --------------------------------- */

#auth {height: 100%; padding-top: 200px; padding-bottom: 80px;}
#auth .wrap {max-width: 1200px;}
#auth > .wrap > h1 {font-family: AdamantC, sans-serif; font-size: 70px; color: #1E4A42; text-align: center; line-height: 100%; margin-bottom: 74px;}
#auth.settings > .wrap > h1 {display: flex; align-items: center; text-align: center;}
#auth.settings > .wrap > h1 > a {display: flex; align-items: center;}
#auth.settings > .wrap > h1 > a > svg {width: 50px; height: 50px; color: #1E4A42; margin-right: 50px;}
.input_group_flex {display: flex;}
.input_group_flex > div {margin-right: 50px; width: 50%;}
.input_group_flex > div:last-child {margin-right: 0;}
.input_group {margin-bottom: 20px; position: relative;}
.input_group > label {font-size: 20px; font-weight: 600; color: #002B00; line-height: 100%; margin-bottom: 12px;}
.input_group > label > span {color: #E80000;}
.input_group > input {border: 1px solid #22534A; border-radius: 8px; width: 100%; height: 56px; line-height: 56px; padding: 0 24px; font-size: 20px; transition: .3s ease-in-out;}
.input_group > textarea {border: 1px solid #22534A; border-radius: 8px; width: 100%; height: 150px; line-height: 130%; padding: 24px; font-size: 20px; transition: .3s ease-in-out;}
.input_group.error > input {border: 1px solid #E80000;}
.input_group > span.error {font-size: 22px; color: #E80000; margin-top: 12px; display: block; line-height: 0; height: 0; opacity: 0; transition: .3s ease-in-out;}
.input_group > span.error:not(:empty) {line-height: 21px; height: 21px; opacity: 1;}
.input_group > .list {
    width: 100%; background: #FFFFFF; min-height: 40px; position: absolute; top: calc(100% + 12px); border: 1px solid #22534A; border-radius: 8px;
    opacity: 0; visibility: hidden; transition: .3s ease-in-out; overflow: hidden; max-height: 250px; overflow-y: auto; z-index: 5;
}
.input_group > .list:not(:empty).active {opacity: 1; visibility: visible;}
.input_group > .list > div {width: 100%; padding: 20px; cursor: pointer; transition: .3s ease-in-out;}
.input_group > .list > div:hover {background: #1E4A42; color: #FFFFFF;}
.radio_group {margin-bottom: 12px; display: flex; align-items: center;}
.radio_group > label {font-size: 20px; color: #002B00; line-height: 130%;}
.radio_group > label > span {color: #E80000;}
.radio_group > input {margin-right: 12px; accent-color: #1E4A42; width: 16px; height: 16px;}
#auth > .wrap > .btn_primary {width: 100%; border-radius: 8px; height: 56px; line-height: 56px;}
#auth > .wrap > p {width: 100%; text-align: center; font-size: 22px; font-weight: 600; color: #002B00; margin-top: 32px; display: block;}
#auth > .wrap > p.desc {font-size: 43px; text-align: left; margin-bottom: 24px; line-height: 130%;}
#auth > .wrap > p > a {color: #1E4A42;}
.success_settings_update {
    padding: 40px; background: rgba(0, 255, 0, 0.5); border-radius: 14px; margin-top: 50px; text-align: center;
    font-size: 28px; line-height: 0; opacity: 0; height: 0; transition: .3s ease-in-out;
}
.success_settings_update.active {opacity: 1; height: 100%; line-height: 120%;}

@media only screen and (max-width: 1024px) {
    #auth {padding-top: 100px;}
    #auth > .wrap > h1 {font-size: 26px; margin-bottom: 40px;}
    #auth.settings > .wrap > h1 > a > svg {width: 16px; height: 16px; margin-right: 12px;}
    #auth > .wrap > .btn_primary {height: 46px; line-height: 46px; font-size: 16px; border-radius: 8px;}
    #auth > .wrap > p {font-size: 16px; margin-top: 20px;}
    .input_group {margin-bottom: 20px;}
    .input_group > label {font-size: 16px; margin-bottom: 12px;}
    .input_group > input {height: 46px; line-height: 46px; font-size: 16px; border-radius: 8px;}
    .input_group_flex > div {margin-right: 0; width: 100%;}
    .input_group_flex {display: block;}
    .input_group > span.error {font-size: 14px; margin-top: 8px;}
    .input_group > span.error:not(:empty) {line-height: 16px; height: 16px;}
    .radio_group > label {font-size: 16px;}
    #auth > .wrap > p.desc {font-size: 20px;}
}

/* -------------------------------- ABOUT --------------------------------- */

#about {margin-top: 100px; z-index: 3; background: #FFFBEC; padding: 60px 0; border-radius: 60px; overflow: hidden;}
#about .about {display: none;}
#about .about.active {display: block;}
#about .about > h2 {margin-bottom: 40px;}
#about .about > p {font-size: 20px; font-weight: 500; line-height: 130%; color: #1E4A42; margin-bottom: 2rem;}
#about .about > .controls {display: flex; align-items: center; -webkit-justify-content: flex-end;}
#about .about > .controls > .circle {width: 28px; height: 28px; border-radius: 14px; background: #1E4A42; margin-right: 20px;}
#about .about > .controls > .circle.active {background: #D3D938;}
#about .about > .controls > svg {cursor: pointer;}
#about .about > .controls > svg:last-child {margin-left: 30px;}

@media only screen and (max-width: 1024px) {
    #about {padding: 40px 0; margin-top: 24px; border-radius: 10px;}
    #about h2 {margin-bottom: 10px;}
    #about .about > p {font-size: 16px; line-height: 150%;}
    #about .about > .controls > .circle {margin-left: 0; margin-right: 12px;}
    #about .about > .controls > svg {width: 32px; height: 32px;}
    #about .about > .controls > svg:last-child {margin-left: 12px;}
}

/* -------------------------------- WHY US --------------------------------- */

#why_us {padding: 90px 0;}
#why_us > .wrap > h2 {text-align: center; margin-bottom: 20px;}
#why_us > .wrap > .desc {text-align: center; margin: 0 auto 40px; font-size: 20px; font-weight: 500; color: #1E4A42; line-height: 130%; max-width: 900px;}
.why_us {display: flex; flex-wrap: wrap;}
.why_us > div {width: calc(50% - 30px); margin-bottom: 40px; display: flex; align-items: flex-start;}
.why_us > div > img {height: 120px; min-width: 120px; width: 120px; object-fit: contain; margin-right: 40px;}
.why_us > div > div > .title {font-size: 30px; font-weight: 600; color: #1E4A42; line-height: 120%; margin-bottom: 20px;}
.why_us > div > div > .desc {font-size: 16px;}
.why_us > div:nth-child(2n) {margin-left: 60px;}
.why_us > div:nth-last-child(-n+2) {margin-bottom: 0;}

@media only screen and (max-width: 1024px) {
    #why_us {padding: 40px 0;}
    #why_us > .wrap > .desc {font-size: 16px; line-height: 130%; margin-bottom: 40px;}
    #why_us > .wrap > h2 {margin-bottom: 10px;}
    .why_us {flex-direction: column;}
    .why_us > div {width: 100%; margin-bottom: 20px;}
    .why_us > div:nth-child(2n) {margin-left: 0;}
    .why_us > div > img {height: 60px; min-width: 60px; width: 60px; margin-right: 20px;}
    .why_us > div > div > .title {font-size: 18px; margin-bottom: 12px;}
    .why_us > div > div > .desc {font-size: 14px;}
    .why_us > div:nth-last-child(-n+2) {margin-bottom: 12px;}
    .why_us > div:last-child {margin-bottom: 0;}
}

/* -------------------------------- COUNTRIES --------------------------------- */

#countries {padding: 90px 0; background: #1E4A42;}
.countries {background: #FFFBEC; border-radius: 20px; padding: 40px;}
.countries > h2 {text-align: center; margin-bottom: 40px;}
.countries > .items > a {display: block; margin-right: 90px; width: 25%; padding: 15px 40px; border: 1px solid #000000; border-radius: 20px;}
.countries > .items > a > img {display: block; width: 100%;}
.countries > .items > a > p {font-size: 20px; font-weight: 500; text-align: center; margin-top: 8px;}
.countries > .items > a:last-child {margin-right: 0;}

@media only screen and (max-width: 1200px) {
    .countries > .items > a {margin-right: 20px;}
}

@media only screen and (max-width: 1024px) {
    #countries {padding: 40px 0;}
    .countries > h2 {margin-bottom: 10px;}
    .countries {border-radius: 10px; padding: 20px;}
    .countries > .items {flex-direction: column;}
    .countries > .items > a {width: 100%; margin-right: 0; margin-bottom: 20px; padding: 15px; border-radius: 10px;}
    .countries > .items > a > img {border-radius: 10px; max-width: 200px; margin: 0 auto;}
    .countries > .items > a > p {font-size: 16px;}
}

/* -------------------------------- NEWS --------------------------------- */

#news {padding: 90px 0;}
#news.main {padding: 140px 0 90px;}
#news h2 {text-align: center; margin-bottom: 44px;}
#news .items {flex-wrap: wrap;}
#news .items > div {width: calc(25% - 15px); flex-grow: unset; flex-basis: unset; display: flex; flex-direction: column; margin-right: 20px; margin-bottom: 20px; cursor: pointer;}
#news .items > div:nth-child(4n) {margin-right: 0;}
#news .items > div > img {display: block; width: 100%; border-radius: 36px 36px 0 0;}
#news .items > div > p {padding: 20px; background: #1E4A42; border-radius: 0 0 36px 36px; display: block; height: 100%; color: #FFFFFF; font-size: 16px; font-weight: 500; line-height: 130%;}

@media only screen and (max-width: 1024px) {
    #news {padding: 40px 0;}
    #news h2 {margin-bottom: 20px;}
    #news .items {flex-direction: column;}
    #news .items > div {width: 100%; margin-right: 0; margin-bottom: 20px;}
    #news .items > div > img {object-fit: cover; height: 200px; border-radius: 10px 10px 0 0;}
    #news .items > div > p {border-radius: 0 0 10px 10px; padding: 20px; font-size: 16px;}
}

/* ------------------------------- HEADER ------------------------------- */

#header {background: url(/images/backgrounds/header.jpg) center / cover no-repeat; border-radius: 0 0 60px 60px; height: 100vh; padding-bottom: 90px; z-index: 2; position: relative;}
#header > .wrap {height: 100%; display: flex; flex-direction: column;}
#header > .wrap > img {width: 100%; max-width: 1000px; margin: 220px auto auto;}
#header > .wrap > .header_group {display: flex;}
#header > .wrap > .header_group > .btn_primary {background: #FFFFFF; color: #1E4A42;}
#header > .wrap > .header_group > .btn_primary:hover {background: #1E4A42; color: #FFFFFF;}
.header_contacts {margin-left: auto; display: flex; align-items: center;}
.header_contacts > a {margin-left: 20px; height: 36px; line-height: 36px; font-size: 22px; font-weight: 600; font-family: Inter, sans-serif; color: #FFFFFF;}
.header_contacts > a:first-child {margin-left: 0;}
.header_contacts > a > svg {width: 36px; height: 36px;}

@media only screen and (max-width: 1200px) {
    #header > .wrap > .header_group > .header_contacts {flex-wrap: wrap; -webkit-justify-content: flex-end; width: 340px;}
    #header > .wrap > .header_group > .header_contacts > a:last-child {width: 100%; margin-top: 32px; text-align: right;}
}

@media only screen and (max-width: 1024px) {
    #header {padding-bottom: calc(50vh - 20px); height: 100vh; border-radius: 0;}
    #header > .wrap > .header_group {-webkit-justify-content: center;}
    #header > .wrap > .header_group > .header_contacts {display: none;}
    #header > .wrap > img {margin-top: 120px;}
}

/* ------------------------------- CAROUSEL ------------------------------- */

#carousel {margin-top: -60px; background: #FFFBEC; padding: 120px 0; overflow: hidden;}
.carousel .item {display: flex; align-items: center; padding-right: 150px; position: relative;}
.carousel .item > img {width: 140px; height: 140px; object-fit: contain; border-radius: 20px;}
.carousel .item > .info {font-size: 14px; line-height: 100%; margin-left: 50px;}
.carousel .item > .info > .title {font-weight: 500;}
.carousel .item > .info > .price {font-weight: 500; margin-top: 1rem;}

@media only screen and (max-width: 1024px) {
    #carousel {margin-top: -10px; padding: 40px 0;}
    .carousel .item {padding-right: 12px;}
    .carousel .item > .info {margin-left: 12px; font-size: 12px;}
}

/* ------------------------------- YERBA ------------------------------- */

#yerba {margin-top: -60px; border-radius: 60px; z-index: 2; background: #FFFFFF; position: relative; padding: 60px 0 60px 0;}
.yerba_img_group {display: flex;}
.yerba_img_group > img:nth-child(1) {display: block; width: 20%; object-fit: contain; object-position: bottom; margin-right: 60px;}
.yerba_img_group > img:nth-child(2) {display: block; width: calc(80% - 60px); object-fit: contain;}
.yerba_info {margin-top: 60px;}
.yerba_info > .title {font-family: 'AdamantC', sans-serif; font-size: 60px; color: #1E4A42; line-height: 130%;}
.yerba_info > .desc {font-family: 'Inter', sans-serif; font-size: 24px; font-weight: 400; color: #1D1D1B; line-height: 130%;}
.yerba_info > .desc > a {font-weight: 700; color: #1E4A42;}
.yerba_info > .btn_group {display: flex; margin-top: 40px;}
.yerba_info > .btn_group > .btn_primary {font-family: 'Inter', sans-serif; font-size: 20px; margin-right: 60px; font-weight: 400;}

#yerba_info {margin-top: -60px; padding: 84px 0 84px; background: #FFFBEC;}
.yerba_info_tab {line-height: 150%; font-size: 15px; font-family: 'Inter', sans-serif; color: #1E4A42; max-height: 0; opacity: 0; max-width: 700px; transition: opacity .3s ease-in-out; visibility: hidden;}
.yerba_info_tab.active {max-height: 100%; opacity: 1; visibility: visible;}

@media only screen and (max-width: 1024px) {
    #yerba {margin-top: -10px; padding: 20px 0; border-radius: 0;}
    .yerba_img_group > img:nth-child(1) {display: none;}
    .yerba_img_group > img:nth-child(2) {width: 100%;}
    .yerba_info {margin-top: 30px;}
    .yerba_info > .title {font-size: 30px; line-height: 130%;}
    .yerba_info > .desc {font-size: 16px; line-height: 130%;}
    .yerba_info > .btn_group {flex-wrap: wrap;}
    .yerba_info > .btn_group > .btn_primary {font-size: 10px; margin-right: 8px; margin-bottom: 8px; padding: 0 8px; white-space: nowrap;}
    #yerba_info {margin-top: -10px; padding: 40px 0;}
    .yerba_info_tab {font-size: 14px;}
}

/* ------------------------------- CAROUSEL ------------------------------- */

.carousel_products {margin-top: -60px; background: #FFFFFF; border-radius: 60px; padding: 60px 0; z-index: 2; overflow: hidden;}
.carousel_products h2 {margin-bottom: 40px;}
.carousel_products_info .item {width: 25%; padding-right: 60px; height: 100%; min-height: fit-content; display: flex; flex-direction: column;}
.carousel_products_info .item > .img_group {position: relative; border-radius: 30px; aspect-ratio: 1 / 1; overflow: hidden;}
.carousel_products_info .item > .img_group > img {width: 100%; height: 100%; background: #EDEDED; display: block; object-fit: cover;}
.carousel_products_info .item > .img_group > svg {cursor: pointer; color: #000000; position: absolute; right: 20px; top: 10px;}
.carousel_products_info .item > .title {font-size: 18px; font-weight: 700; text-align: center; max-width: 220px; padding: 20px 0 14px; margin: 0 auto; cursor: pointer;}
.carousel_products_info .item > .price {font-size: 18px; text-align: center; margin-bottom: 30px; cursor: pointer;}
.carousel_products_info .item > .btn_primary {border: 1px solid #000000; color: #FFFFFF; font-size: 16px; height: 44px; line-height: 44px; margin-top: auto;}
.carousel_products_info .item > .count {display: none;}
.carousel_products_info .item.selected > .count {display: flex; align-items: center; font-size: 18px; max-width: 250px; width: 100%; margin: auto auto 0; height: 44px;}
.carousel_products_info .item.selected > .count > span:nth-child(1) {margin-right: auto;}
.carousel_products_info .item.selected > .count > span:nth-child(2) {text-align: center; cursor: pointer; font-size: 16px;}
.carousel_products_info .item.selected > .count > span:nth-child(3) {margin-left: auto;}
.carousel_products_info .item.selected > .count > span:nth-child(1), .carousel_products_info .item.selected > .count > span:nth-child(3) {
    cursor: pointer; padding: 4px 8px; border-radius: 8px; background: #1E4A42; color: #FFFFFF; width: 30px;
    text-align: center; user-select: none;
}
.carousel_products_info .item.selected > .btn_primary {display: none;}

@media only screen and (max-width: 1024px) {
    .carousel_products {margin-top: -10px; border-radius: 0; padding: 40px 0;}
    .carousel_products h2 {margin-bottom: 40px;}
    .carousel_products_info .item {width: 80%; max-width: 400px;}
    .carousel_products .flickity-button {display: none;}
    .carousel_products .item > .img_group {aspect-ratio: unset; height: 200px;}
    .carousel_products .item > .img_group > img {height: 200px; object-fit: contain; background: none;}
}

/* ------------------------------- KIT ------------------------------- */

.kit {padding-bottom: 120px;}
.kit_info {padding: 200px 100px 300px 0; color: #FFFFFF;}
.kit_info .title {font-family: AdamantC, sans-serif; font-size: 48px; margin-bottom: 12px; text-align: right; line-height: 120%;}
.kit_info .desc {font-size: 20px; margin-bottom: 50px; line-height: 120%; max-width: 340px; margin-left: auto;}
.kit_info .btn_primary {max-width: 340px; margin-left: auto; background: #FFFFFF; color: #002B00;}
.kit_flex {display: flex; margin-top: -60px;}
.kit_flex .item {width: calc(25% - 45px); height: 100%; min-height: fit-content; margin-right: 60px; display: flex; flex-direction: column;}
.kit_flex .item:nth-of-type(4) {margin-right: 0;}
.kit_flex > div:last-child {margin-right: 0;}
.kit_flex .item > .img_group {position: relative; border-radius: 30px; overflow: hidden;}
.kit_flex .item > .img_group > img {width: 100%; height: auto; display: block; object-fit: cover;}
.kit_flex .item > .img_group > svg {cursor: pointer; color: #000000; position: absolute; right: 20px; top: 10px;}
.kit_flex .item > .title {font-size: 18px; text-align: center; max-width: 220px; margin: 20px auto 0;}
.kit_flex .item > .price {font-size: 18px; text-align: center; margin-bottom: 30px;}
.kit_flex .item > .btn_primary {border: 1px solid #000000; color: #FFFFFF; font-size: 16px; height: 44px; line-height: 44px; margin-top: auto;}

@media only screen and (max-width: 1024px) {
    .kit {overflow: hidden;}
    .kit_flex {margin-top: -20px;}
    .kit_info {padding: 20px 0 40px; border-radius: 10px 10px 0 0; background-size: cover !important;}
    .kit_info .title {font-size: 24px; text-align: left;}
    .kit_info .desc {font-size: 16px; margin-bottom: 30px;}
    .kit_flex .item {width: 80%; height: 100%; min-height: fit-content; margin-right: 0; padding-right: 60px;}
    .kit_flex .flickity-button {display: none;}
}

/* ------------------------------- REFERENCE ------------------------------- */

#reference {margin-top: -60px; background: #1E4A42; padding: 180px 0;}

.reference_item {padding: 20px 24px 20px; border-bottom: 1px solid #FFFFFF;}
.reference_head {display: flex; align-items: center; font-size: 20px; font-weight: 500; color: #FFFFFF; cursor: pointer;}
.reference_head > div:last-child {
    min-width: 40px; width: 40px; height: 40px; background: #FFFFFF; border-radius: 20px; transition: .3s ease-in-out;
    margin-left: auto; color: #4F0D0A; font-size: 36px; font-weight: 400; text-align: center; line-height: 40px; user-select: none;
}
.reference_item.active .reference_head > div:last-child {rotate: 135deg;}
.reference_body {max-height: 0; opacity: 0; overflow: hidden; color: #FFFFFF; font-size: 18px; padding-right: 60px;}
.reference_body > a {color: #FFFFFF; font-size: 18px; display: block; margin-bottom: 12px; text-decoration: underline;}
.reference_item.active .reference_body {max-height: 1000px; opacity: 1; padding-top: 20px;}

@media only screen and (max-width: 1024px) {
    #reference {margin-top: -10px; padding: 40px 0;}
    .reference_item {padding: 12px 0;}
    .reference_head {font-size: 16px;}
    .reference_head > div:last-child {min-width: 20px; width: 20px; height: 20px; font-size: 18px; line-height: 20px;}
    .reference_body > a {font-size: 14px;}
}

/* ------------------------------- CATALOG ------------------------------- */

#catalog {padding: 90px 0;}
#catalog > img {width: 100%; display: block;}
#catalog h1 {font-size: 50px; font-family: AdamantC, sans-serif; text-align: center; color: #1E4A42; padding-top: 80px; padding-bottom: 50px; line-height: 130%;}
.catalog {display: flex; flex-wrap: wrap; -webkit-justify-content: center;}
.catalog > a {display: block; width: calc(50% - 40px); margin-bottom: 40px; margin-right: 40px; position: relative;}
.catalog > a > p {
    font-size: 36px; font-family: AdamantC, sans-serif; color: #195804; text-align: left; position: absolute;
    top: calc(50% - 20px); left: 40px; line-height: 120%; max-width: 300px;
}
.catalog > a > img {width: 100%; display: block;}
.catalog > a:nth-child(2n) {margin-right: 0;}
.catalog > a:last-child {margin-right: 0;}

@media only screen and (max-width: 1024px) {
    #catalog {padding-bottom: 40px;}
    #catalog h1 {font-size: 32px; padding-top: 30px; padding-bottom: 20px;}
    .catalog > a {width: 100%; max-width: 700px; margin-right: 0; margin-bottom: 20px;}
}

@media only screen and (max-width: 600px) {
    .catalog > a:last-child {margin-bottom: 0;}
    .catalog > a > p {font-size: 26px;}
}

/* ------------------------------- PROFILE ------------------------------- */

#profile {padding: 130px 0 90px;}
#profile .discount {padding: 40px; background: #1E4A42; color: #FFFFFF;}
#profile .discount > p:first-child {font-size: 42px; font-weight: 700; line-height: 120%;}
#profile .discount > p:last-child {font-size: 24px; margin-top: 100px; text-align: right; width: 100%;}
#profile .title {font-size: 36px; font-weight: 700; color: #1E4A42; padding-top: 40px; line-height: 130%;}
#profile a {margin-top: 20px; display: block; font-size: 20px; font-weight: 700; line-height: 130%;}
#profile a.logout {margin-top: 150px; font-weight: 400; display: flex; align-items: center; max-width: 500px;}
#profile a.logout > svg {width: 40px; height: 40px; margin-left: auto;}

@media only screen and (max-width: 1024px) {
    #profile {padding: 100px 0 60px;}
    #profile .discount {padding: 20px;}
    #profile .discount > p:first-child {font-size: 26px;}
    #profile .discount > p:last-child {font-size: 16px;}
    #profile .title {font-size: 26px; padding-top: 20px;}
    #profile a {font-size: 16px; margin-top: 20px;}
    #profile a.logout {margin-top: 80px;}
    #profile a.logout > svg {width: 20px; height: 20px;}
}

/* ------------------------------- PRODUCT ------------------------------- */

#product {padding: 240px 0 90px;}
.product {display: flex;}
.product > img {width: 50%; height: fit-content; display: block; margin-right: 60px;}
.product > .info > h1 {font-size: 24px; font-weight: 700; line-height: 130%; margin-bottom: 8px;}
.product > .info > .article_number {font-size: 16px; line-height: 130%; margin-bottom: 20px;}
.product > .info > .price {font-size: 18px; line-height: 130%; margin-bottom: 20px;}
.product > .info > .btn_group {display: flex; align-items: center;}
.product > .info > .btn_group > svg {margin-left: 20px; width: 30px; height: 30px; cursor: pointer;}
.product > .info > .desc {margin-top: 30px;}
.product > .info > .title {font-weight: 500; margin-top: 30px; margin-bottom: 8px;}
.product > .info > .characteristic {margin-bottom: 8px;}

.product > .info > .btn_group > .count {display: none;}
.product > .info > .btn_group > .btn_primary {border: 1px solid #000000; color: #FFFFFF; font-size: 16px; height: 44px; line-height: 44px; margin-top: auto;}
.product.selected > .info > .btn_group > .btn_primary {display: none;}
.product.selected > .info > .btn_group > .count {display: flex; align-items: center; font-size: 18px; max-width: 150px; width: 100%; margin: 0; height: 44px;}
.product.selected > .info > .btn_group > .count > span:nth-child(1) {margin-right: auto;}
.product.selected > .info > .btn_group > .count > span:nth-child(2) {text-align: center; cursor: pointer; font-size: 16px;}
.product.selected > .info > .btn_group > .count > span:nth-child(3) {margin-left: auto;}
.product.selected > .info > .btn_group > .count > span:nth-child(1), .product.selected > .info > .btn_group > .count > span:nth-child(3) {
    cursor: pointer; padding: 4px 8px; border-radius: 8px; background: #1E4A42; color: #FFFFFF; width: 30px;
    text-align: center; user-select: none;
}

@media only screen and (max-width: 1024px) {
    #product {padding: 100px 0 40px;}
    .product {flex-direction: column; align-items: center;}
    .product > img {width: 100%; max-width: 600px; margin-right: 0; margin-bottom: 20px;}
    .product > .info {width: 100%;}
}

/* ------------------------------- PRODUCTS ------------------------------- */

#products {padding-bottom: 80px; position: relative;}
#products > img {width: 100%; display: block; margin-bottom: 60px;}
#products > h1 {
    position: absolute; top: 200px; left: 0; width: 100%; text-align: center;
    color: #FFFFFF; font-size: 7vw; font-family: 'AdamantC', sans-serif;
    letter-spacing: 0.05em;
}
#products .filters {display: flex; align-items: center;}
#products .filters > button {display: flex; align-items: center; text-decoration: underline; margin-right: 60px; cursor: pointer;}
#products .filters > button > svg {display: block; margin-right: 12px;}
#products .filters > select {padding: 8px 20px; border: 1px solid #000000; border-radius: 6px;}
#products .filters > input {margin-left: auto; padding: 8px 20px; border: 1px solid #000000; border-radius: 6px;}
.products {display: flex; flex-wrap: wrap; gap: 60px; padding-top: 60px;}
.products .banner {width: 100%;}
.products .item {width: calc(25% - 45px); display: flex; flex-direction: column;}
.products .item > .img_group {position: relative; border-radius: 30px; aspect-ratio: 1 / 1; overflow: hidden;}
.products .item > .img_group > img {cursor: pointer; width: 100%; height: 100%; background: #EDEDED; display: block; object-fit: cover;}
.products .item > .img_group > svg {cursor: pointer; color: #000000; position: absolute; right: 20px; top: 10px;}
.products .item > .title {font-size: 18px; font-weight: 700; text-align: center; max-width: 220px; margin: 0 auto; padding: 20px 0 14px; cursor: pointer;}
.products .item > .price {font-size: 18px; text-align: center; margin-bottom: 30px; cursor: pointer;}
.products .item > .count {display: none;}
.products .item > .btn_primary {border: 1px solid #000000; color: #FFFFFF; font-size: 16px; height: 44px; line-height: 44px; margin-top: auto;}
.products .item.selected > .btn_primary {display: none;}
.products .item.selected > .count {display: flex; align-items: center; font-size: 18px; max-width: 250px; width: 100%; margin: auto auto 0; height: 44px;}
.products .item.selected > .count > span:nth-child(1) {margin-right: auto;}
.products .item.selected > .count > span:nth-child(2) {text-align: center; cursor: pointer; font-size: 16px;}
.products .item.selected > .count > span:nth-child(3) {margin-left: auto;}
.products .item.selected > .count > span:nth-child(1), .products .item.selected > .count > span:nth-child(3) {
    cursor: pointer; padding: 4px 8px; border-radius: 8px; background: #1E4A42; color: #FFFFFF; width: 30px;
    text-align: center; user-select: none;
}

.paginator {display: flex; align-items: center; margin-top: 40px;}
.paginator > a:first-child {margin-left: auto;}
.paginator > a {
    background: #EDEDED; width: 40px; height: 40px; line-height: 40px; text-align: center; border-radius: 4px;
    margin: 0 6px; font-size: 18px; font-weight: 500; transition: .3s ease-in-out;
}
.paginator > a:hover {background: #d6d3d3;}
.paginator > a.active {background: #1E4A42; color: #FFFFFF;}

@media only screen and (max-width: 1200px) {
    .products .item {width: calc(33.333% - 40px);}
    .products .item:nth-of-type(-n+10) {order: 1;}
    .products .item:not(:nth-of-type(-n+10)) {order: 3;}
    .products .banner {order: 2;}
}

@media only screen and (max-width: 1024px) {
    .products .item {width: calc(50% - 30px);}
    .products .item:nth-of-type(-n+6) {order: 1;}
    .products .item:not(:nth-of-type(-n+6)) {order: 3;}
    .products .banner {order: 2;}
    #products {padding-bottom: 40px;}
}

@media only screen and (max-width: 800px) {
    #products .filters > select {padding: 8px 12px; margin-bottom: 20px; width: 100%; max-width: 400px;}
    #products .filters {flex-direction: column; align-items: flex-start;}
    #products .filters > button {margin-right: 0; margin-bottom: 20px;}
    #products .filters > input {margin-left: 0; padding: 8px 12px; width: 100%; max-width: 400px;}
}

@media only screen and (max-width: 600px) {
    #products > img {margin-bottom: 40px; min-height: 400px; object-fit: cover;}
    .products .banner {display: none;}
    .products .item {width: 100%;}
    .products {gap: 20px; padding-top: 40px;}
    .products .item > .img_group {aspect-ratio: unset; height: 200px;}
    .products .item > .img_group > img {height: 200px; object-fit: contain; background: none;}
}

/* ------------------------------- FAVOURITE ------------------------------- */

#favourite {padding: 90px 0 240px; background: #FFFFFF;}
#favourite h1 {font-size: 50px; font-family: AdamantC, sans-serif; text-align: center; color: #1E4A42; padding-top: 80px; padding-bottom: 40px; line-height: 130%;}
.not_found {font-size: 18px; font-weight: 600; text-align: center; margin: 0 auto 20px;}
.btn_primary.not_found {margin: 0 auto; max-width: 400px;}

@media only screen and (max-width: 1024px) {
    #favourite {padding: 40px 0 120px;}
    #favourite h1 {font-size: 28px; padding-top: 60px; padding-bottom: 20px;}
}

/* ------------------------------- ORDERS ------------------------------- */

#orders {padding: 90px 0; background: #FFFFFF;}
#orders h1 {font-size: 50px; font-family: AdamantC, sans-serif; text-align: center; color: #1E4A42; padding-top: 40px; padding-bottom: 40px; line-height: 130%;}
.orders > .tabs {display: flex; align-items: center; margin-bottom: 40px;}
.orders > .tabs > p {font-size: 20px; font-weight: 500; color: #1E4A42; margin-right: 40px; cursor: pointer; border-bottom: 1px solid transparent; transition: .3s ease-in-out;}
.orders > .tabs > p.active {border-bottom: 1px solid #1E4A42;}
.orders > .tabs > p:last-child {margin-right: 0;}
.orders > .orders_tab {display: none;}
.orders > .orders_tab.active {display: block;}
.orders > .orders_tab > div {padding: 30px; border-radius: 20px; border: 1px solid #00000024; margin-bottom: 20px; position: relative;}
.orders > .orders_tab > div > .date {font-weight: 500; font-size: 20px; margin-bottom: 10px;}
.orders > .orders_tab > div > .price {font-weight: 500; font-size: 20px; margin-bottom: 30px;}
.orders > .orders_tab > div > .status {position: absolute; right: 30px; top: 30px; padding: 12px 16px; border-radius: 40px;}
.orders > .orders_tab > div > .status.green {background: green; color: #FFFFFF;}
.orders > .orders_tab > div > .status.red {background: red; color: #FFFFFF;}
.orders > .orders_tab > div > .items {display: flex; flex-wrap: wrap;}
.orders > .orders_tab > div > .items > a {display: block;}
.orders > .orders_tab > div > .items > a > img {width: 140px; height: 140px; object-fit: cover; border-radius: 20px; border: 1px solid #00000024; margin-right: 20px; margin-bottom: 20px;}
.orders > .orders_tab > p {font-size: 16px;}
.orders > .orders_tab > p > a {text-decoration: underline;}

@media only screen and (max-width: 1024px) {
    #orders {padding: 40px 0;}
    #orders h1 {font-size: 28px; padding-top: 60px;padding-bottom: 40px;}
    .orders > .tabs {margin-bottom: 20px;}
    .orders > .tabs > p {font-size: 16px;}
    .orders > .orders_tab > div {padding: 20px;}
    .orders > .orders_tab > div > .date {font-size: 16px;}
    .orders > .orders_tab > div > .price {font-size: 16px;}
    .orders > .orders_tab > div > .items > a > img {width: 90px; height: 90px; margin-right: 10px; margin-bottom: 10px;}
    .orders > .orders_tab > div > .status {right: 20px; top: 20px;}
}

/* ------------------------------- CART ------------------------------- */

#cart {padding: 90px 0; background: #FFFFFF;}
#cart h1 {font-size: 50px; font-family: AdamantC, sans-serif; text-align: center; color: #1E4A42; padding-top: 40px; padding-bottom: 40px; line-height: 130%;}
.cart {display: flex;}
.cart_products {width: 60%; margin-right: 30px;}
.cart_products .item {display: flex; align-items: flex-start; padding-top: 30px; padding-bottom: 30px; padding-right: 30px; border-bottom: 1px solid #00000038; position: relative;}
.cart_products .item:last-of-type {border-bottom: none;}
.cart_products .item > img {min-width: 170px; width: 170px; height: 170px; object-fit: cover; background: #EDEDED; border-radius: 30px; margin-right: 20px; cursor: pointer;}
.cart_products .item > .info {width: 100%;}
.cart_products .item > .info > .title {font-size: 20px; font-weight: 700; margin-bottom: 8px; line-height: 130%; cursor: pointer;}
.cart_products .item > .info > .price {font-size: 20px; font-weight: 700; line-height: 130%; margin-left: auto; display: block; width: fit-content; cursor: pointer;}
.cart_products .item > .info > .count {display: flex; align-items: center; font-size: 18px; width: 100%; max-width: 130px; margin-left: auto; margin-bottom: 20px; margin-right: 50px;}
.cart_products .item > .info > .count > span:nth-child(1) {margin-right: auto;}
.cart_products .item > .info > .count > span:nth-child(2) {text-align: center; cursor: pointer; font-size: 16px; margin: 0 20px;}
.cart_products .item > .info > .count > span:nth-child(3) {margin-left: auto;}
.cart_products .item > .info > .count > span:nth-child(1), .cart_products .item > .info > .count > span:nth-child(3) {
    cursor: pointer; padding: 4px 8px; border-radius: 8px; background: #1E4A42; color: #FFFFFF; width: 30px;
    text-align: center; user-select: none; min-width: 30px;
}
.cart_products .item > .info > .delete {
    padding: 8px; border-radius: 30px; border: 1px solid #00000033; width: 30px; display: flex; align-items: center; -webkit-justify-content: center;
    position: absolute; right: 30px; top: 30px; cursor: pointer;
}
.cart > .info {width: 40%;}
.cart > .info > .title {font-size: 26px; font-weight: 700; color: #1E4A42; margin-bottom: 20px; line-height: 130%;}
.cart > .info > .property {position: relative; font-size: 16px; line-height: 130%; margin-bottom: 12px;}
.cart > .info > .property::after {content: ''; position: absolute; bottom: 3px; left: 0; right: 20px; border-bottom: 1px dotted #ccc;}
.cart > .info > .property > span:first-child {z-index: 1; background: #FFFFFF; position: relative; padding-right: 10px;}
.cart > .info > .property > span:last-of-type {z-index: 1; background: #FFFFFF; position: relative; padding-left: 10px; float: right;}
.cart > .info > .btn_primary {margin-top: 40px;}

#cart .not_found {font-size: 18px; font-weight: 600; text-align: left; margin: 0 auto 20px;}
#cart .btn_primary.not_found {margin: 0; width: fit-content;}

@media only screen and (max-width: 1024px) {
    #cart {padding: 40px 0;}
    #cart h1 {font-size: 28px; padding-top: 60px; padding-bottom: 40px;}
    .cart {flex-direction: column;}
    .cart_products {width: 100%; margin-right: 0;}
    .cart_products .item {padding-right: 0; padding-top: 12px; padding-bottom: 12px; align-items: flex-start;}
    .cart_products .item > img {min-width: 90px; width: 90px; height: 90px; object-fit: cover;}
    .cart_products .item > .info > .count {margin-bottom: 6px; max-width: 100px; margin-left: 0; margin-right: 0;}
    .cart_products .item > .info > .count > span:nth-child(2) {margin: 0 8px;}
    .cart_products .item > .info > .title {font-size: 16px;}
    .cart_products .item > .info > .price {font-size: 16px; margin-left: 0;}
    .cart_products .item > .info > .delete {top: 12px; right: 0;}
    .cart > .info {width: 100%; margin-top: 40px;}
    .cart > .info > .title {font-size: 20px;}
    .cart > .info > .property {font-size: 16px;}
    .cart > .info > .btn_primary {font-size: 16px;}
    #cart .not_found {font-size: 16px; text-align: center; margin: 0 auto 20px;}
    #cart .btn_primary.not_found {margin: 0 auto; width: 100%; max-width: 400px;}
}

/* ------------------------------- PAYMENT SUCCESS ------------------------------- */

#payment_success {padding: 90px 0; background: #FFFFFF;}
#payment_success h1 {max-width: 600px; margin: 0 auto; font-size: 50px; font-family: AdamantC, sans-serif; text-align: center; color: #1E4A42; padding-top: 40px; padding-bottom: 40px; line-height: 130%;}
#payment_success p {max-width: 600px; margin: 0 auto; font-size: 18px; text-align: center;}
#payment_success .btn_primary {max-width: 400px; margin: 40px auto 0;}

@media only screen and (max-width: 1024px) {
    #payment_success {padding: 40px 0;}
    #payment_success h1 {font-size: 28px; padding-top: 60px; padding-bottom: 20px;}
    #payment_success .btn_primary {margin: 20px auto 0;}
}

/* ------------------------------- PAYMENT ------------------------------- */

#payment {padding: 90px 0; background: #FFFFFF;}
#payment h1 {font-size: 50px; font-family: AdamantC, sans-serif; text-align: center; color: #1E4A42; padding-top: 40px; padding-bottom: 40px; line-height: 130%;}
.payment {display: flex;}
.payment .info {width: 100%;}
.payment .info > .title {font-size: 24px; font-weight: 700; color: #1E4A42; line-height: 130%; margin-bottom: 20px;}
.payment .info > .delivery_type {display: none; margin-top: 20px;}
.payment .info > .delivery_type > .title {font-size: 24px;font-weight: 700; color: #1E4A42; margin-bottom: 20px; line-height: 130%;}
.payment .info > .delivery_type > .desc {font-size: 20px; margin-bottom: 20px; line-height: 130%; transition: .3s ease-in-out; opacity: 1;}
.payment .info > .delivery_type > .desc.no_active {opacity: 0;}
.payment .info > .delivery_type.active {display: block;}
#payment .info > .property {position: relative; font-size: 20px; line-height: 130%; margin-bottom: 12px;}
#payment .info > .property::after {content: ''; position: absolute; bottom: 3px; left: 0; right: 20px; border-bottom: 1px dotted #ccc;}
#payment .info > .property > span:first-child {z-index: 1; background: #FFFFFF; position: relative; padding-right: 10px;}
#payment .info > .property > span:last-of-type {z-index: 1; background: #FFFFFF; position: relative; padding-left: 10px; float: right;}
#payment .info > .btn_primary {margin-top: 20px;}

#payment .cart_products {width: 30%; height: 100%; min-width: 500px; margin-right: 0; margin-left: 30px; position: sticky; top: 100px;}
#payment .cart_products .item {padding-right: 0; padding-top: 12px; padding-bottom: 12px; align-items: flex-start;}
#payment .cart_products .item > img {min-width: 90px; width: 90px; height: 90px; object-fit: cover;}
#payment .cart_products .item > .info > .count {margin-bottom: 6px; max-width: 100px; margin-left: 0; margin-right: 0;}
#payment .cart_products .item > .info > .count > span:nth-child(2) {margin: 0 8px;}
#payment .cart_products .item > .info > .title {font-size: 16px;}
#payment .cart_products .item > .info > .price {font-size: 16px; margin-left: 0;}
#payment .cart_products .item > .info > .delete {top: 12px; right: 0;}
#payment .not_found {font-size: 18px; font-weight: 600; text-align: left; margin: 0 auto 20px;}
#payment .btn_primary.not_found {margin: 0; width: fit-content;}

@media only screen and (max-width: 1024px) {
    #payment {padding: 40px 0;}
    #payment h1 {font-size: 28px; padding-top: 60px; padding-bottom: 40px;}
    #payment .not_found {font-size: 16px; text-align: center; margin: 0 auto 20px;}
    #payment .btn_primary.not_found {margin: 0 auto; width: 100%; max-width: 400px;}
    #payment .cart_products {width: 100%; max-width: 100%; min-width: 0; margin-left: 0; margin-bottom: 40px; position: relative; top: 0;}
    .payment {flex-direction: column-reverse;}
    .payment .info > .title {font-size: 20px;}
    #payment .info > .property {font-size: 16px;}
}

/* ------------------------------- CATALOGS ------------------------------- */

#catalogs {margin-top: -60px; background: #FFFBEC; padding: 200px 0;}
#catalogs.white {background: #FFFFFF;}
.catalogs {display: flex;}
.catalogs > div {width: 50%; margin-right: 60px; background: #1E4A42; border-radius: 90px; position: relative; padding: 80px 50px 80px 230px; color: #FFFFFF; cursor: pointer;}
.catalogs > div > .title {font-size: 48px; font-family: AdamantC, sans-serif; line-height: 100%; margin-bottom: 22px; z-index: 2; position: relative;}
.catalogs > div > .desc {font-size: 16px; font-weight: 700; line-height: 140%; z-index: 2; position: relative;}
.catalogs > div:nth-child(1) > img {position: absolute; left: calc(-404px / 2); top: calc(50% - 624px / 2); width: 624px; user-select: none;}
.catalogs > div:nth-child(2) > img {position: absolute; left: calc(-140px / 2); top: calc(50% - 340px / 2); width: 340px; user-select: none;}
.catalogs > div:last-child {margin-right: 0;}

@media only screen and (max-width: 1250px) {
    .catalogs {flex-direction: column; align-items: center}
    .catalogs > div {width: 100%; max-width: 600px; margin-bottom: 180px; margin-right: 0;}
    .catalogs > div:last-child {margin-bottom: 0;}
}

@media only screen and (max-width: 1024px) {
    #catalogs {margin-top: -10px; padding: 60px 0;}
    .catalogs > div {padding: 40px 40px 40px 120px; border-radius: 32px; margin-bottom: 30px;}
    .catalogs > div:nth-child(1) > img {width: 250px; left: -75px; top: -50px;}
    .catalogs > div:nth-child(2) > img {width: 180px; left: -30px; top: -30px;}
    .catalogs > div > .title {font-size: 24px;}
    .catalogs > div > .desc {font-size: 14px;}
}

/* ------------------------------- MARKETPLACES ------------------------------- */

#marketplaces {padding: 90px 0;}
#marketplaces h2 {
    font-family: 'Montserrat', sans-serif; font-size: 50px; font-weight: 700; color: #000000;
    text-align: center; margin-bottom: 30px;
}
#marketplaces h2 > span {font-weight: 700; color: #1E4A42;}
.marketplaces {display: flex; -webkit-justify-content: center;}
.marketplaces > a {width: 220px; height: 44px; margin-right: 40px; border: 3px solid #1E4A42; border-radius: 100px; padding: 4px 20px;}
.marketplaces > a > img {width: 100%; height: 100%; object-fit: contain;}
.marketplaces > a:last-child {margin-right: 0;}

@media only screen and (max-width: 1024px) {
    #marketplaces {padding: 40px 0;}
    #marketplaces h2 {font-size: 24px; margin-bottom: 12px;}
    .marketplaces {flex-direction: column;}
    .marketplaces > a {width: 100%; margin: 0 auto 12px; border: 1px solid #1E4A42; max-width: 400px;}
    .marketplaces > a:last-child {margin-right: auto;}
}

/* ------------------------------- REQUEST ------------------------------- */

#request {padding: 90px 0; background: #FFFBEC;}
#request h2 {
    font-family: 'Montserrat', sans-serif; font-size: 32px; font-weight: 500; letter-spacing: 1px;
    text-align: center; line-height: 110%; color: #000000; margin-bottom: 40px;
}
#request h2 > span {color: #1E4A42;}
.request {max-width: 1000px; margin: 0 auto; background: #1E4A42; color: #FFFFFF; padding: 40px; border-radius: 20px;}
.request > .input_group {font-size: 20px; margin-bottom: 24px;}
.request > .input_group > label {margin-bottom: 8px; color: #FFFFFF;}
.request > .input_group > input {border: none; border-radius: 0; border-bottom: 1px solid #FFFFFF; color: #FFFFFF; width: 100%; padding: 0 12px;}
.request > .btn_primary {
    background: #FFFFFF; height: 40px; line-height: 40px; border-radius: 20px;
    font-weight: 700; color: #000000; margin-bottom: 30px;
}
.request > .agree {color: #FFFFFF; font-size: 14px; font-weight: 400; text-decoration: underline;}

@media only screen and (max-width: 1024px) {
    #request {padding: 40px 0;}
    #request h2 {font-size: 18px; margin-bottom: 20px;}
    .request {border-radius: 10px; padding: 20px;}
    .request > .input_group {font-size: 16px;}
    .request > .agree {font-size: 12px;}
}

/* ------------------------------- REVIEWS ------------------------------- */

#reviews {background: #1E4A42; padding: 90px 0;}
.reviews {display: flex; align-items: flex-end;}
.reviews > .info {max-width: 800px; color: #FFFFFF; font-size: 20px; font-weight: 500; line-height: 120%; margin-right: 40px;}
.reviews > .info > span {display: block; color: #FFF000;}
.reviews > .view {display: flex; align-items: center; margin-left: auto; min-width: 620px; position: relative;}
.reviews > .view > img.authors {width: 170px; margin-right: 30px;}
.reviews > .view > img.line {position: absolute; left: 0; bottom: 100%; display: block;}
.reviews > .view > div {font-size: 20px; font-weight: 600; color: #FFFFFF; line-height: 120%;}
.reviews > .view > div > a {font-size: 20px; font-weight: 700; color: #FFF000;}

@media only screen and (max-width: 1200px) {
    .reviews {flex-direction: column; align-items: flex-start;}
    .reviews > .info {margin-right: 0; padding-right: 400px; max-width: 100%; margin-bottom: 30px;}
    .reviews > .view > img.line {rotate: 45deg; width: 260px; left: 180px; bottom: 180px;}
}

@media only screen and (max-width: 1024px) {
    #reviews {padding: 40px 0; overflow: hidden;}
    .reviews > .info {padding-right: 100px; font-size: 16px; min-width: 430px; width: 430px;}
    .reviews > .view {min-width: 0;}
    .reviews > .view > img.line {width: 170px; left: 230px; bottom: 160px; rotate: 75deg;}
    .reviews > .view > div {font-size: 16px;}
    .reviews > .view > div > a {font-size: 16px;}
    .reviews > .view > img.authors {width: 90px;}
}

/* ------------------------------- DELIVERY ------------------------------- */

#delivery {padding: 90px 0; background: #FFFBEC; overflow: hidden; z-index: 3;}
#delivery h1 {font-size: 50px; font-family: AdamantC, sans-serif; text-align: center; color: #1E4A42; padding-top: 40px; padding-bottom: 40px; line-height: 130%;}
.delivery_banner {width: 100%; display: block;}
.delivery {display: flex; flex-wrap: wrap; align-items: flex-start;}
.delivery > div:nth-child(2n) {margin-right: 0;}
.delivery_item {width: calc(50% - 10px); margin-right: 20px; margin-bottom: 20px;}
.delivery_head {
    display: flex; align-items: center; font-size: 16px; font-weight: 500; color: #000000; cursor: pointer; padding: 20px 24px 20px;
    border: 1px solid #1E4A42; background: #FFE294; border-radius: 20px;
}
.delivery_head > div:last-child {
    min-width: 40px; width: 40px; height: 40px; background: #1E4A42; border-radius: 20px; transition: .3s ease-in-out;
    margin-left: auto; color: #FCD116; font-size: 36px; font-weight: 400; text-align: center; line-height: 40px;
}
.delivery_item.active .delivery_head {border-radius: 20px 20px 0 0; border-bottom: none;}
.delivery_item.active .delivery_head > div:last-child {rotate: 135deg;}
.delivery_body {max-height: 0; opacity: 0; overflow: hidden; color: #000000; font-size: 18px; padding-right: 60px;}
.delivery_item.active .delivery_body {
    max-height: 1000px; opacity: 1; background: #FFE294; padding: 0 24px 20px;
    border: 1px solid #1E4A42; border-radius: 0 0 20px 20px; border-top: none;
}

@media only screen and (max-width: 1024px) {
    #delivery {padding: 40px 0;}
    #delivery h1 {font-size: 28px; padding-top: 60px; padding-bottom: 20px;}
    .delivery_item {width: 100%; margin-right: 0; margin-bottom: 20px;}
    .delivery_head {border-radius: 10px; font-size: 16px; padding: 12px;}
    .delivery_head > div:last-child {font-size: 16px; min-width: 20px; width: 20px; height: 20px; line-height: 20px;}
    .delivery_item.active .delivery_head {border-radius: 10px 10px 0 0;}
    .delivery_body {font-size: 16px;}
    .delivery_item.active .delivery_body {border-radius: 0 0 10px 10px; padding: 0 12px 12px;}
}

/* ------------------------------- CONTACTS ------------------------------- */

#contacts {padding: 90px 0; background: #FFFFFF;}
#contacts.main {background: #FFFBEC; border-radius: 0 0 72px 72px;}
#contacts h1 {font-size: 50px; font-family: AdamantC, sans-serif; text-align: center; color: #1E4A42; padding-top: 40px; padding-bottom: 40px; line-height: 130%;}
.contacts {display: flex; align-items: center;}
#contacts.delivery {margin-top: -60px; padding: 0; background: none;}
#contacts.delivery .contacts {background: #FFFBEC; border-radius: 20px; padding: 40px;}
.contacts > .map {width: 50%; margin-right: 120px; border-radius: 20px; overflow: hidden;}
.contacts > .info {width: 50%;}
.contacts > .info > h2 {font-size: 50px; font-weight: 600; font-family: 'Montserrat', sans-serif; letter-spacing: 0; line-height: 100%; color: #000000; margin-bottom: 20px;}
.contacts > .info > a, .contacts > .info > div {font-size: 20px; line-height: 100%; color: #000000; margin-bottom: 20px; display: flex; align-items: center;}
.contacts > .info > div > img {margin-right: 12px;}
.contacts > .info > .socials {display: flex; align-items: center;}
.contacts > .info > .socials > a {color: #000000; margin-left: 24px;}

@media only screen and (max-width: 1024px) {
    #contacts {padding: 40px 0;}
    #contacts.main {border-radius: 0 0 10px 10px;}
    .contacts {flex-direction: column;}
    .contacts > .map {width: 100%; border-radius: 10px; margin-right: 0; margin-bottom: 20px;}
    .contacts > .info {width: 100%;}
    #contacts h1 {font-size: 28px; padding-top: 60px; padding-bottom: 20px;}
    .contacts > .info > h2 {font-size: 24px; margin-bottom: 20px;}
    .contacts > .info > a, .contacts > .info > div {font-size: 16px; margin-bottom: 12px;}
    .contacts > .info > div > img {width: 20px;}
    .contacts > .info > .socials > a {margin-left: 12px;}
    .contacts > .info > .socials > a > svg {width: 20px;}
    #contacts.delivery {margin-top: -10px;}
    #contacts.delivery .contacts {border-radius: 10px; padding: 20px;}
}

/* ------------------------------- FOOTER ------------------------------- */

#footer {padding: 40px 0; background: #1E4A42; margin-top: auto;}
#footer #reference {display: none;}
.footer {display: flex;}
.footer > div {
    width: 16.667%; padding-right: 40px; display: flex; flex-direction: column; color: #FFFFFF;
    font-family: Inter, sans-serif; font-size: 14px; font-weight: 500;
}
.footer > div:nth-child(1) {margin-right: auto;}
.footer > div:nth-child(4) {min-width: 200px;}
.footer > div:last-child {padding-right: 0;}
.footer > div > img {width: 100%; display: block; margin-bottom: 24px;}
.footer > div > .title {font-size: 18px; font-weight: 700; margin-bottom: 14px; line-height: 120%;}
.footer > div > a {color: #FFFFFF; margin-bottom: 8px;}
.footer .requisites p {color: #FFFFFF !important;}
.sub_footer .copyright {font-size: 16px; font-family: Inter, sans-serif; color: #FFFFFF; text-align: center; margin-top: 60px;}

@media only screen and (max-width: 1024px) {
    #footer {padding: 40px 0;}
    #footer #reference {display: block; padding: 0 0 40px;}
    #footer #reference .wrap {padding: 0; margin: 0;}
    .footer {flex-wrap: wrap;}
    .footer > div > img {max-width: 250px; margin: 0 auto 24px;}
    .footer > div {width: 50%; padding-right: 20px; margin-bottom: 20px;}
    .footer > div:nth-child(1) {width: 100%; order: 1; padding-right: 0; margin-bottom: 20px;}
    .footer > div:nth-child(1) > .requisites {text-align: center;}
    .footer > div:nth-child(2) {order: 8;}
    .footer > div:nth-child(3) {order: 3;}
    .footer > div:nth-child(4) {order: 4; padding-right: 0; min-width: 0;}
    .footer > div:nth-child(5) {order: 6;}
    .footer > div:nth-child(6) {order: 5; width: 100%; padding-right: 0;}
    .footer > div:nth-child(7) {order: 7;}
    .header_contacts > a {font-size: 16px;}
    .header_contacts > a > svg {width: 32px; height: 32px;}
    .header_contacts > a {margin-left: 0; margin-right: 12px;}
    .sub_footer .copyright {font-size: 16px; margin-top: 20px;}
    .sub_footer .header_contacts {-webkit-justify-content: center;}
    .footer > div:nth-last-child(-n+4) {display: none;}
}

/* ------------------------------- DOC ------------------------------- */

.doc {padding: 130px 0 90px;}
.doc h1 {font-size: 24px; font-weight: 700; margin-bottom: 1.5rem; line-height: 120%;}
.doc section {margin-bottom: 1rem;}
.doc p {font-size: 18px; line-height: 130%;}

/* ------------------------------- FLICKITY ------------------------------- */

.flickity-enabled {position: relative;}
.flickity-enabled:focus {outline: none;}

.flickity-viewport {position: relative; height: 100%;}
.flickity-slider {position: absolute; width: 100%; height: 100%;}

/* draggable */

.flickity-enabled.is-draggable {
    -webkit-tap-highlight-color: transparent; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none;
    user-select: none;
}
.flickity-enabled.is-draggable .flickity-viewport {cursor: move; width: 100%; cursor: -webkit-grab; cursor: grab;}
.flickity-enabled.is-draggable .flickity-viewport.is-pointer-down {cursor: -webkit-grabbing; cursor: grabbing;}

/* flickity-button */

.flickity-button {position: absolute; background: hsla(0, 0%, 100%, 0.75); border: none; color: #333;}
.flickity-button:hover {background: white; cursor: pointer;}
.flickity-button:focus {outline: none;}
.flickity-button:active {opacity: 0.6;}
.flickity-button:disabled {opacity: 0; cursor: auto; pointer-events: none;}

.flickity-button-icon {fill: currentColor; color: #FFFFFF; width: 25px;}


/* previous/next buttons */

.flickity-prev-next-button {width: 60px; height: 60px; padding: 16px; top: 50%; transform: translateY(-50%); background: #1E4A42; border-radius: 50px; transition: .3s ease-in-out;}
.flickity-prev-next-button:hover {background: #173731;}
.flickity-prev-next-button:focus {outline: none !important;}
.flickity-prev-next-button.no-svg {color: #777;}
.flickity-prev-next-button.previous {left: -25px;}
.flickity-prev-next-button.next {right: -25px;}

/* page dots */

.flickity-page-dots {
    position: absolute; width: 100%; bottom: -25px; padding: 0; margin: 0; list-style: none; text-align: center; line-height: 1;
}
.flickity-rtl .flickity-page-dots {direction: rtl;}
.flickity-page-dots .dot {
    display: inline-block; width: 10px; height: 10px; margin: 0 8px; background: #333; border-radius: 50%; opacity: 0.25;
    cursor: pointer;
}
.flickity-page-dots .dot.is-selected {opacity: 1;}

/* ------------------------------- SCROLL ------------------------------- */

html.has-scroll-smooth {overflow: hidden;}
html.has-scroll-dragging {-webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none;}
.has-scroll-smooth body {overflow: hidden;}
.has-scroll-smooth [data-scroll-container] {min-height: 100vh;}
[data-scroll-direction="horizontal"] [data-scroll-container] {height: 100vh; display: inline-block; white-space: nowrap;}
[data-scroll-direction="horizontal"] [data-scroll-section] {
    display: inline-block; vertical-align: top; white-space: nowrap; height: 100%;
}
.c-scrollbar {
    position: absolute; right: 0; top: 0; width: 11px; height: 100vh; transform-origin: center right;
    transition: transform 0.3s, opacity 0.3s; opacity: 0; z-index: 99999;
}
.c-scrollbar:hover {transform: scaleX(1);}
.c-scrollbar:hover, .has-scroll-scrolling .c-scrollbar, .has-scroll-dragging .c-scrollbar {opacity: 1;}
[data-scroll-direction="horizontal"] .c-scrollbar {width: 100%; height: 10px; top: auto; bottom: 0; transform: scaleY(1);}
[data-scroll-direction="horizontal"] .c-scrollbar:hover {transform: scaleY(1.3); }
.c-scrollbar_thumb {
    position: absolute; top: 0; right: 0; background-color: rgba(0, 0, 0, 0.4); width: 7px;
    border-radius: 10px; margin: 2px; cursor: grab;
}
.has-scroll-dragging .c-scrollbar_thumb {cursor: grabbing;}
[data-scroll-direction="horizontal"] .c-scrollbar_thumb {right: auto; bottom: 0;}

.is-inview {opacity: 1 !important; transform: none !important;}
.anim {transform: translateY(70px); opacity: 0; transition: 1s ease-in-out;}
.split-parent {overflow: hidden;}
.split-child {display: inline-block; top: -3px;}

@media (max-width: 1024px) {
    .anim_text {transform: none; opacity: 1;}
}

html.lenis{height:auto;}
.lenis.lenis-smooth{scroll-behavior:auto}
.lenis.lenis-smooth [data-lenis-prevent]{overscroll-behavior:contain}
.lenis.lenis-stopped{overflow:hidden}
.lenis.lenis-scrolling iframe{pointer-events:none}