/* ------------------------------------------------------------
                      COMMON STYLES
--------------------------------------------------------------*/

body{
    font-family: "Onest", sans-serif;
    background: #121212;
    color: #FFFFFF;
    font-weight: 400;
    position: relative;
}
.container{
    max-width: 1440px;
    margin: 0 auto;
    padding: 0 64px;
}
.section-title{
    font-family: var(--font-family);
    font-weight: 700;
    font-size: 24px;
    line-height: 100%;
    text-transform: uppercase;
    color: #fff;

    margin-bottom: 30px;
}
.button{
    display: flex;
    align-items: center;
    justify-content: center;

    width: 100%;
    border-radius: 10px;
    /*padding: 8px 24px;*/
    height: 48px;
    background: var(--fill-violet);

    font-family: var(--font-family);
    font-weight: 500;
    font-size: 18px;
    line-height: 100%;
    letter-spacing: 0.01em;
    text-align: center;
    color: var(--text-white);
    transition: all 0.3s ease;
}
.button:hover{
    background: var(--fill-violet-hover);
}
.button:disabled{
    background: var(--fill-gray);
    color: var(--text-gray-2);
}
.button.cart{
    background: transparent;
    border: 2px solid var(--fill-violet);
}
.section-padding_80_60{
    padding-top: 40px;
    padding-bottom: 60px;
}
.section-padding_60_80{
    padding-top: 60px;
    padding-bottom: 80px;
}
.section-padding_60_60{
    padding-top: 60px;
    padding-bottom: 60px;
}
.form-input{
    border: 1px solid var(--fill-dark-blue);
    border-radius: 8px;
    padding: 0 12px;
    width: 100%;
    height: 44px;
    background: transparent;
    font-family: var(--second-family), sans-serif;
    font-weight: 400;
    font-size: 12px;
    line-height: 133%;
    letter-spacing: 0.03em;
    color: var(--text-white);

    margin-bottom: 10px;

}
.form-input::placeholder{
    font-family: var(--second-family), sans-serif;
    font-weight: 400;
    font-size: 12px;
    line-height: 133%;
    letter-spacing: 0.03em;
    color: var(--text-gray);
}
.form-policy{
    margin-top: 10px;

    font-family: var(--font-family);
    font-weight: 400;
    font-size: 12px;
    line-height: 150%;
    color: var(--text-gray);
}
.form-policy a{
    font-family: var(--font-family);
    font-weight: 400;
    font-size: 12px;
    line-height: 150%;
    color: var(--text-gray);
    text-decoration: underline;
    text-decoration-skip-ink: none;
}
.owl-carousel .owl-item img{
    width: auto;
}
.owl-dots{
    display: flex;
    align-items: center;
    justify-content: center;
    column-gap: 15px;
}
.owl-dot {
    border-radius: 50%;
    background: transparent;
    border: 1px solid var(--fill-violet);
    transition: 0.3s ease;
    width: 11px;
    height: 11px;
    aspect-ratio: 1 / 1;
}
.owl-dot.active{
    background: var(--fill-violet);
}
.section-header{
    display: flex;
    align-items: center;
    justify-content: space-between;
}
/* ------------------------------------------------------------
                      INDEX.HTML STYLES
--------------------------------------------------------------*/

.mobile-catalog-section {
    display: none;
}

.logo-tablet {
    display: none;
}

.logo-mobile {
    display: none;
}

.mobile-button {
    display: none;
}

.header{
    background: linear-gradient(0deg, rgba(42, 45, 52, 0) 0%, #2a2d34 100%);
}
.header-top {
    height: 35px;
    padding: 5px 0;
}
.header-bottom {
    position: relative;
    padding: 24px 0;
    height: 80px;
}
.header-top .container {
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.header-contacts {
    display: flex;
    align-items: center;
    justify-content: flex-start;
    column-gap: 30px;
}

.header-phone {
    display: flex;
    align-items: center;
    justify-content: flex-start;
    column-gap: 4px;

    font-family: var(--font-family);
    font-weight: 400;
    font-size: 16px;
    line-height: 150%;
    color: var(--text-white);
}

.header-menu {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 100%;
    max-width: 215px;
    display: flex;
    align-items: center;
    justify-content: center;
    column-gap: 18px;
}
.header-menu-item-link {
    font-family: var(--font-family);
    font-weight: 400;
    font-size: 16px;
    line-height: 150%;
    color: var(--text-white);
}

.header-bottom.sticky{
    background: var(--bg-dark-blue);
    position: fixed;
    z-index: 990;
    top: 0;
    left: 0;
    width: 100%;
}

.header-bottom .container {
    display: flex;
    align-items: center;
    justify-content: space-between;
    column-gap: 10px;
}

.header-logo {
    max-width: 252px;
}
.header-search {
    display: flex;
    align-items: center;
    justify-content: center;
    border: 1px solid #fff;
    border-radius: 25px;
    padding: 7.5px;
    height: 32px;
    transition: all 0.3s ease;
}
.header-search-input {
    transition: all 0.5s ease;
    width: 100%;
    background: transparent;
    font-family: var(--third-family);
    font-weight: 400;
    font-size: 16px;
    line-height: 150%;
    color: var(--text-white);
}
.hover-search{
    width: 100%;
}
.hover-search:hover{
    border-radius: 8px;
}
.hover-search .header-search-input{
    width: 0;
}
.hover-search:hover .header-search-input{
    width: 260px;
}
.header-search-input::placeholder{
    font-family: var(--third-family);
    font-weight: 400;
    font-size: 16px;
    line-height: 150%;
    color: var(--text-gray);
}
.header-search-button {
    background: transparent;
    padding: 0;
}
.header-search-button:hover{
    background: transparent;
}
.header-bottom-right {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    column-gap: 24px;
}

.header-actions {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    column-gap: 10px;
}

.header-actions-mobile {
    display: none;
}

.header-action {
    aspect-ratio: 1 / 1;
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 32px;
    height: 32px;
}
.header-action img{
    width: 100%;
}
.header-action-count{
    position: absolute;
    top: -3px;
    right: -3px;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 14px;
    height: 14px;
    aspect-ratio: 1 / 1;

    font-family: var(--font-family);
    font-weight: 500;
    font-size: 9px;
    line-height: 100%;
    color: #fff;
    background: linear-gradient(360deg, #1e1f25 0%, #7d84bf 99.04%);
    border-radius: 50%;
}

.main-carousel-container {
    position: relative;
}
.main-carousel-item {
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    padding: 146px 34px 146px 34px;
    max-height: 420px;
}
.main-carousel-video-item{
    width: 100%;
    max-height: 420px;
    /* object-fit: cover; */
}
.main-carousel-item-title {
    font-family: var(--font-family);
    font-weight: 700;
    font-size: 36px;
    line-height: 100%;
    text-transform: uppercase;
    color: var(--color-neutral-darkest);
    margin-bottom: 10px;
}

.main-carousel-item-text {
    font-family: var(--font-family);
    font-weight: 400;
    font-size: 22px;
    line-height: 100%;
    color: var(--color-neutral-darkest);
    margin-bottom: 20px;
}
.main-carousel-item-button{
    height: 40px;
    max-width: 120px;

    font-family: var(--font-family);
    font-weight: 500;
    font-size: 16px;
    line-height: 100%;
    letter-spacing: 0.01em;
    text-align: center;
    color: var(--text-white);
    column-gap: 10px;
}
.carousel-prev,
.carousel-next{
    position: absolute;
    background: transparent;
    z-index: 2;
}
.main-carousel-prev {
    left: 64px;
    top: 50%;
    transform: translateY(-50%);
}
.main-carousel-next {
    right: 64px;
    top: 50%;
    transform: translateY(-50%);
}
.main-carousel-next img{
    transform: rotate(180deg);
}
.main-carousel-dots {
    margin-bottom: 60px;
}
.section-promo-carousel{
    border-radius: 40px 40px 0 0;
    padding-top: 20px;
    padding-bottom: 80px;
    margin-top: -40px;
    position: relative;
    z-index: 10;
    background: var(--bg-black);
}

.promo-carousel-item {
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    padding: 38px 0 38px 110px;
    height: 100%;
    min-height: 240px;
    border-radius: 10px;
}

.promo-carousel-item-title {
    font-family: var(--font-family);
    font-weight: 700;
    font-size: 34px;
    line-height: 100%;
    color: var(--text-white);

    margin-bottom: 10px;
    max-width: 240px;
}

.promo-carousel-item-text {
    font-family: var(--font-family);
    font-weight: 400;
    font-size: 18px;
    line-height: 100%;
    color: var(--text-white);

    margin-bottom: 20px;
    max-width: 240px;
}
.promo-carousel-item-button {
    height: 30px;
    max-width: 120px;
    font-family: var(--font-family);
    font-weight: 500;
    font-size: 16px;
    line-height: 100%;
    letter-spacing: 0.01em;
    text-align: center;
    color: var(--text-white);
    column-gap: 10px;
}
.promo-carousel-item-button img{
    width: 12px;
}
.promo-carousel .owl-item{
    height: 100%;
}
.section-advantages-title{
    font-size: 18px;
}
.advantages-items {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr 1fr;
    gap: 20px;
}

.advantages-item {
    border-radius: 10px;
    padding: 20px;
    background: linear-gradient(360deg, #1e1f25 0%, #7d84bf 99.04%);
    aspect-ratio: 1 / 1;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: space-between;
}


.advantages-item-icon {
    max-width: 160px;
    position: relative;
}
.advantages-item-icon img {
    top: 0;
    left: 0;
    width: 200px;
    height: 200px;
    display: block;
}
.advantages-item {
    background-image: url("./images/icons/advantages/1.jpg");
    background-size: 220px;
    background-color: #242831;
    background-repeat: no-repeat;
    background-position: center top;
}
.advantages-item-info {
    margin-top: auto;
}


.advantages-item-info{
    min-height: 92px;
}
.advantages-item-title {
    font-family: var(--font-family);
    font-weight: 600;
    font-size: 20px;
    line-height: 90%;
    letter-spacing: -0.01em;
    text-transform: uppercase;
    color: #e6e9ef;

    padding-bottom: 20px;
}

.advantages-item-text {
    font-family: var(--font-family);
    font-weight: 400;
    font-size: 16px;
    line-height: 120%;
    letter-spacing: 0.01em;
    color: var(--text-white);
}

.footer{
    padding: 40px 0;
    background: var(--bg-dark-blue);
}
.footer .container{
    max-width: 1280px;
    padding: 0 32px;
}
.footer-columns{
    display: grid;
    grid-template-columns: 2fr 3fr 2fr;
    column-gap: 40px;
}
.footer-form{
    max-width: 320px;
}
.footer-form-title{
    font-family: var(--font-family);
    font-weight: 600;
    font-size: 16px;
    line-height: 120%;
    color: var(--text-white);

    margin-bottom: 20px;
}
.footer-input-label{
    display: flex;
    align-items: center;
    justify-content: flex-start;
    column-gap: 8px;

    font-family: var(--font-family);
    font-weight: 700;
    font-size: 26px;
    line-height: 100%;
    text-transform: lowercase;
    color: var(--text-white);
    margin-bottom: 20px;
}
.footer-input-label span{
    font-size: 36px;
    text-transform: uppercase;
}
.footer-info {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: flex-start;
    row-gap: 32px;
}
.footer-logo {
    display: block;
    margin-bottom: 20px;
}
.footer-copyright {
    font-family: var(--font-family);
    font-weight: 400;
    font-size: 14px;
    line-height: 120%;
    color: var(--text-white);
}
.footer-socials {
    display: flex;
    align-items: center;
    justify-content: flex-start;
    column-gap: 5px;

    margin-bottom: 20px;
}
.footer-social {
    width: 24px;
    height: 24px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 3px;
    background: var(--fill-violet);
}

.footer-policy-link {
    font-family: var(--font-family),sans-serif;
    font-weight: 400;
    font-size: 14px;
    line-height: 150%;
    text-decoration: underline;
    text-decoration-skip-ink: none;
    color: var(--text-gray);
}

.footer-nav {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    column-gap: 40px;
}

.footer-nav-item {
    max-width: 133px;
    min-width: 133px;
}
.footer-nav-item:last-child {
    margin-top: -30px;
}
.footer-nav-item-title {
    margin-bottom: 8px;
    font-family: var(--font-family);
    font-weight: 600;
    font-size: 14px;
    line-height: 150%;
    text-transform: uppercase;
    color: var(--text-white);
}

.footer-nav-item-list {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
}

.footer-nav-item-list-link {
    font-family: var(--font-family);
    font-weight: 400;
    font-size: 14px;
    line-height: 100%;
    color: var(--text-white);
}
.footer-nav-item-list-link:not(:last-child) {
    margin-bottom: 7px;
}
.footer-form-button{
    font-family: var(--font6),sans-serif;
    font-weight: 900;
    font-size: 16px;
    line-height: 150%;
    color: var(--text-white);
}
.product-card {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: space-between;

    position: relative;
    width: 100%;
    max-width: 312px;
    border-radius: 10px;
    background: var(--bg-dark-gray);
    padding: 15px;
}
.product-card-promo{
    font-family: var(--font-family);
    font-weight: 600;
    font-size: 12px;
    line-height: 100%;
    letter-spacing: 0.01em;
    text-align: center;
    color: var(--text-white);
    position: absolute;
    top: 15px;
    left: 15px;
    display: flex;
    align-items: center;
    justify-content: center;

    border-radius: 0 5px 5px 5px;
    width: 45px;
    height: 17px;
    background: var(--accent-red);
}
.product-card-new{
    font-family: var(--font-family);
    font-weight: 600;
    font-size: 12px;
    line-height: 100%;
    letter-spacing: 0.01em;
    text-align: center;
    color: var(--text-dark);
    position: absolute;
    top: 37px;
    left: 15px;
    display: flex;
    align-items: center;
    justify-content: center;

    border-radius: 0 5px 5px 5px;
    padding: 0px 7px;
    width: 65px;
    height: 17px;
    background: var(--accent-green);
}

.product-card-bottom{
    width: 100%;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: space-between;
    height: 100%;
}
.product-card-image {
    height: 100%;
    max-width: 160px;
    max-height: 160px;
    margin: 0 auto 25px;
}
.product-card-image img{
    width: 100% !important;
    height: 100%;
    object-fit: cover;
}
.product-card-info {
    width: 100%;
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    margin-bottom: 10px;
}

.product-card-title {
    font-family: var(--font-family);
    font-weight: 400;
    font-size: 16px;
    line-height: 110%;
    letter-spacing: 0.01em;
    color: var(--text-white);
    max-width: 150px;
}

.product-card-price {
    font-family: var(--font-family);
    font-weight: 400;
    font-size: 18px;
    line-height: 110%;
    letter-spacing: 0.01em;
    text-align: right;
    color: var(--text-white);
}
.product-card-price-old{
    margin-top: 5px;
    font-family: var(--font-family);
    font-weight: 400;
    font-size: 16px;
    line-height: 110%;
    letter-spacing: 0.01em;
    text-align: right;
    color: var(--text-gray);
    text-decoration: line-through;
}

.product-card-actions {
    display: flex;
    align-items: center;
    justify-content: space-between;
    column-gap: 10px;
    width: 100%;
}

.product-card-action {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 37px;
    height: 37px;
    border: 1px solid var(--fill-gray);
    border-radius: 50%;
    aspect-ratio: 1 / 1;
}
.product-card-action img{
    width: 50% !important;
}
.product-card-button {
    width: 100%;
    margin-left: 5px;
    max-width: 183px;
    text-wrap: nowrap;

    font-family: var(--font-family);
    font-weight: 500;
    font-size: 18px;
    line-height: 100%;
    letter-spacing: 0.01em;
    text-align: center;
    color: var(--text-white);
}
.section-products{
    background: var(--bg-dark-blue);
}
.section-products-content{
    display: flex;
    align-items: flex-end;
    column-gap: 60px;
}
.section-products-tabs {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    row-gap: 10px;
}

.section-products-tab {
    cursor: pointer;
    position: relative;
    display: flex;
    align-items: center;
    justify-content: flex-start;

    border-radius: 10px;
    padding: 29px 28px 29px 48px;
    width: 285px;
    height: 98px;
    background: var(--bg-dark-gray);

    font-family: var(--font-family);
    font-weight: 600;
    font-size: 20px;
    line-height: 100%;
    color: var(--text-white);
}
.section-products-tab svg{
    position: absolute;
    top: 0;
    right: -27px;
    height: 100%;
}
.section-products-tab.active svg path{
    fill: var(--fill-violet);
}
.section-products-carousel-container{
    /*display: none;*/
    position: relative;
}
.section-products-carousel-container.active{
    display: block;
}
.section-products-carousel-container .owl-dots{
    position: absolute;
    top: 100px;
    right: 0;
}
.section-products-carousel-container .carousel-prev{
    position: absolute;
    top: 35%;
    left: 8px;
    width: 14px;
    z-index: 2;
}
.section-products-carousel-container .carousel-next{
    position: absolute;
    top: 35%;
    right: 8px;
    width: 14px;
    z-index: 2;
}
.section-products-carousel-container .carousel-next img{
    transform: rotate(180deg);
    width: 14px;
}

.section-products-carousels{
    overflow: hidden;
}

.section-readySets{
    padding-top: 40px;
}


.readySets-content {
    border-radius: 10px;
    background: var(--bg-dark-gray);
    padding: 50px 110px;
}

.readySets-content-top {
    display: grid;
    grid-template-columns: 1.1fr 2fr;
    column-gap: 101px;
    margin-bottom: 23px;
}

.readySets-content-info {
}

.readySets-content-title {
    font-family: var(--font-family);
    font-weight: 700;
    font-size: 28px;
    line-height: 100%;
    color: var(--text-white);
    margin-bottom: 25px;
}
.readySets-content-text{
    margin-bottom: 25px;
}
.readySets-content-text p{
    font-family: var(--font-family);
    font-weight: 400;
    font-size: 16px;
    line-height: 120%;
    letter-spacing: 0.01em;
    color: var(--text-white);
}
.readySets-content-text p:not(:last-child){
    margin-bottom: 15px;
}
.readySets-button {
    font-family: var(--font-family);
    font-weight: 500;
    font-size: 16px;
    line-height: 100%;
    letter-spacing: 0.01em;
    text-align: center;
    color: var(--text-white);

    height: 30px;
    max-width: 120px;
    column-gap: 10px;
}

.readySets-gallery-main-image {
    width: 100%;
    max-height: 365px;
}
.readySets-gallery-main-image img{
    width: 100%;
    height: auto;
    object-fit: cover;
}
.readySets-gallery-thumbnail{
    width: 100%;
    height: 100%;
    object-fit: cover;
    max-width: 208px;
    position: relative;
    cursor: pointer;
}
.readySets-gallery-thumbnail:after{
    content: "";
    z-index: 2;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    backdrop-filter: blur(4px);
    background: rgba(85, 84, 84, 0.6);
    border-radius: 10px;
}
.readySets-gallery-thumbnail-title{
    text-wrap: nowrap;
    z-index: 3;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    font-family: var(--font-family);
    font-weight: 700;
    font-size: 28px;
    line-height: 200%;
    text-align: center;
    color: var(--text-white);
}
.readySets-gallery-thumbnail img{
    width: 100%;
    height: 100%;
    border-radius: 10px;
}
.readySets-gallery-thumbnail.active:after {
    display: none;
}
.readySets-gallery-thumbnail.active .readySets-gallery-thumbnail-title{
    display: none;
}
.readySets-content-bottom {
    display: flex;
    align-items: center;
    justify-content: space-between;
    column-gap: 12px;
}

.readySets-content-mobile {
    display: none;
}

.cart-dropdown {
    position: absolute;
    z-index: 989;
    top: 80px;
    right: 0;
    width: 464px;
    height: auto;
    border-radius: 0 0 10px 10px;
    padding: 32px 64px 32px 32px;
    background: var(--bg-dark-blue);

    opacity: 0;
    visibility: hidden;
    transition: opacity 0.2s, visibility 0.2s;
}
.cart-dropdown.show{
    opacity: 1;
    visibility: visible;
}
.cart-dropdown-items {
    margin-bottom: 16px;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    row-gap: 8px;
}

.cart-dropdown-item {
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 100%;
}

.cart-dropdown-item-info {
    display: flex;
    align-items: center;
    justify-content: flex-start;
}

.cart-dropdown-item-image {
    width: 60px;
    height: 60px;
    margin-right: 8px;
}
.cart-dropdown-item-image img{
    width: 100%;
    height: 100%;
}
.cart-dropdown-item-title {
    font-family: var(--font-family);
    font-weight: 600;
    font-size: 16px;
    line-height: 100%;
    color: var(--text-white);

    margin-bottom: 5px;
}

.cart-dropdown-item-variant {
    font-family: var(--font-family);
    font-weight: 400;
    font-size: 14px;
    line-height: 100%;
    color: var(--text-white);
}

.cart-dropdown-item-price {
    font-family: var(--font-family);
    font-weight: 500;
    font-size: 16px;
    line-height: 100%;
    color: var(--text-white);
}
.cart-dropdown-button {
    font-family: var(--font-family);
    font-weight: 500;
    font-size: 16px;
    line-height: 100%;
    letter-spacing: 0.01em;
    text-align: center;
    color: var(--text-white);

    column-gap: 10px;
    border-radius: 0 10px 10px 10px;
    height: 30px;
    max-width: 190px;
}




.catalog-dropdown {
    position: absolute;
    left: 0;
    top: 80px;
    z-index: 989;
    width: 100%;
    height: auto;
    background: var(--bg-dark-blue);
    padding: 32px 0;

    opacity: 0;
    visibility: hidden;
    transition: opacity 0.2s, visibility 0.2s;
}
.catalog-dropdown.show{
    opacity: 1;
    visibility: visible;
}
.catalog-dropdown .container{
    display: grid;
    grid-template-columns: 1fr 1fr 1fr;
    grid-template-rows: 1fr 1fr 1fr;
    gap: 16px 32px;
}
.catalog-dropdown-section {
    display: flex;
    align-items: flex-start;
    justify-content: flex-start;
    column-gap: 12px;
    height: 100%;
}
.catalog-dropdown-section-icon{
    width: 24px;
    height: 24px;
    min-height: 24px;
    min-width: 24px;
}
.catalog-dropdown-section-icon img{
    width: 100%;
    height: 100%;
}

.catalog-dropdown-section-title {
    font-family: var(--font4);
    font-weight: 700;
    font-size: 16px;
    line-height: 100%;
    text-transform: uppercase;
    color: var(--text-white);
    margin-bottom: 10px;
}
.catalog-dropdown-section-list-link {
    display: block;
    font-family: var(--font-family);
    font-weight: 400;
    font-size: 16px;
    line-height: 100%;
    color: var(--text-white);
    transition: all 0.3s ease;
}
.catalog-dropdown-section-list-link:hover{
    color: var(--fill-violet);
}
.catalog-dropdown-section-list-link:not(:last-child) {
    margin-bottom: 5px;
    display: block;
}



/* ------------------------------------------------------------
                      CUSTOM SELECT
--------------------------------------------------------------*/

.custom-arrow{
    transition: all 0.3s ease;
}
.custom-select {
    position: relative;
    width: 100%;
}
.select-options.show {
    display: block;
}
.select-selected {
    cursor: pointer;
    display: flex;
    justify-content: space-between;
    align-items: center;
    /*change*/
    padding: 10px;
    color: #000;
    background: #fff;
}
.select-options {
    display: none;
    position: absolute;
    top: 100%;
    left: 0;
    right: 0;
    background: transparent;
    border: none;
    z-index: 100;
    overflow-y: auto;
}
.option {
    cursor: pointer;
    display: flex;
    justify-content: space-between;
    align-items: center;
    /*change*/
    padding: 10px;
    color: #000;
    background: #fff;

}



.header-option-select{
    width: auto;
}
.header-option-select-selected{
    background: transparent;
    padding: 0;
    display: flex;
    align-items: center;
    justify-content: flex-start;
    column-gap: 4px;
}
.header-option-select-placeholder{
    font-family: var(--font-family);
    font-weight: 400;
    font-size: 16px;
    line-height: 150%;
    color: var(--text-white);
}
.header-option-select-options{
    margin-left: 0;
    width: 300px;
    padding: 8px 28px;
    background: var(--bg-dark-gray);
}
.header-option-option{
    font-family: var(--font-family);
    font-weight: 400;
    font-size: 16px;
    line-height: 150%;
    color: var(--text-white);
    background: transparent;
    padding: 6px 0;
}
.header-option-option:hover{
    border-bottom: 1px solid var(--text-white) !important;
    background: var(--fill-violet-hover);
}
.header-option-option:not(:last-child){
    border-bottom: 1px solid var(--text-gray);
}
.header-options{
    display: flex;
    align-items: center;
    justify-content: flex-end;
    column-gap: 32px;
}
.header-option {
    position: relative;
}
.header-option:not(:last-child):after{
    content: "";
    position: absolute;
    height: 14px;
    width: 1px;
    right: -16px;
    top: 50%;
    transform: translateY(-50%);
    background: #fff;
}

.section-categories {
    padding: 10px 0;
}
.section-categories-items {
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.section-categories-item {
    width: 100%;
    position: relative;
}
.section-categories-item-title img {
    transition: transform 0.3s ease;
}
.section-categories-item-title.active img {
    transform: rotate(180deg);
}
.section-categories-item-title {
    cursor: pointer;
    font-family: var(--font-family);
    font-weight: 600;
    font-size: 16px;
    line-height: 110%;
    color: var(--text-white);

    display: flex;
    align-items: center;
    justify-content: space-between;
    column-gap: 5px;
    padding: 16px 10px;
    height: 68px;
}
.section-categories-item-title:not(:last-child){
    border-left: 1px solid var(--fill-dark-blue);
    margin-right: 5px;
}

.section-categories-item:last-child .section-categories-item-dropdown{
    width: calc(100% + 64px);
}
.section-categories-item-dropdown {
    position: absolute;
    width: 270px;
    z-index: 987;
    top: 68px;
    left: 0;
    display: none;
    padding: 10px 10px 32px 10px;
    background: var(--bg-black);
}
.section-categories-item-dropdown p{
    font-family: var(--font-family);
    font-weight: 400;
    font-size: 16px;
    line-height: 100%;
    color: var(--text-white);
}
.section-categories-item-dropdown p:not(:last-child){
    margin-bottom: 16px;
}










/* ------------------------------------------------------------
                      CATALOG.HTML STYLES
--------------------------------------------------------------*/


.catalog-title{
    font-family: var(--font-family);
    font-weight: 700;
    font-size: 24px;
    line-height: 100%;
    text-transform: uppercase;
    color: var(--text-white);

    padding-top: 20px;
    padding-bottom: 10px;
    border-bottom: 1px solid var(--fill-dark-blue);
    margin-bottom: 10px;
}
.breadcrumbs {
    padding-top: 16px;
    padding-bottom: 16px;
    display: flex;
    align-items: center;
    justify-content: flex-start;
    column-gap: 32px;
}
.breadcrumb {
    font-family: var(--font-family);
    font-weight: 500;
    font-size: 16px;
    line-height: 100%;
    color: var(--text-gray);
    position: relative;
}
.breadcrumb:last-child {
    color: var(--text-white);
}
.breadcrumb:not(:last-child):before{
    content: url("../images/icons/breadcrumb-icon.svg");
    position: absolute;
    right: -24px;
}
.catalog-products-body{
    display: grid;
    grid-template-columns: 1fr 1fr 1fr;
    gap: 20px;
}
.catalog-content{
    padding-top: 20px;
    padding-bottom: 40px;
}
.catalog-content .container{
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    column-gap: 40px;
}
.catalog-filters{
    width: 288px;
    min-width: 288px;
}
.catalog-products{
    width: calc(100% - 288px);
}
.catalog-blog{
    width: 100%;
}

.blog-card-image {
    width: 100%;
}


.catalog-small-screen-button {
    display: none;
}
.close-catalog-btn {
    display: none;
}
.catalog-sort-option-select{
    width: 300px;
}
.catalog-sort-option-select-selected{
    background: transparent;
    padding: 0;
    display: flex;
    align-items: center;
    justify-content: flex-end;
    column-gap: 4px;
}
.catalog-sort-option-select-placeholder{
    font-family: var(--font-family);
    font-weight: 400;
    font-size: 16px;
    line-height: 150%;
    color: var(--text-white);
}
.catalog-sort-option-select-options{
    margin-left: 0;
    width: 100%;
    padding: 8px 28px;
    background: var(--bg-dark-gray);
}
.catalog-sort-option-option{
    font-family: var(--font-family);
    font-weight: 400;
    font-size: 16px;
    line-height: 150%;
    color: var(--text-white);
    background: transparent;
    padding: 6px 0;
}
.catalog-sort-option-option:hover{
    border-bottom: 1px solid var(--text-white) !important;
    background: var(--fill-violet-hover);
}
.catalog-sort-option-option:not(:last-child){
    border-bottom: 1px solid var(--text-gray);
}
.catalog-sort-options{
    display: flex;
    align-items: center;
    justify-content: flex-end;
    column-gap: 32px;
}
.catalog-sort-option {
    position: relative;
}
.catalog-sort-option:not(:last-child):after{
    content: "";
    position: absolute;
    height: 14px;
    width: 1px;
    right: -16px;
    top: 50%;
    transform: translateY(-50%);
    background: #fff;
}

.catalog-products-tags {
    display: flex;
    align-items: center;
    justify-content: flex-start;
    gap: 10px;
    flex-wrap: wrap;
}

.catalog-products-tag {
    border-radius: 10px;
    padding: 8px 12px;
    background: var(--bg-dark-gray);
    display: flex;
    align-items: center;
    justify-content: center;
    column-gap: 8px;
}

.catalog-products-tag-name {
    text-wrap: nowrap;
    font-family: var(--font-family);
    font-weight: 400;
    font-size: 16px;
    line-height: 100%;
    color: var(--text-white);
}
.catalog-products-header{
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 20px;
}

.catalog-filter-search{
    border: 1px solid var(--fill-gray);
    border-radius: 10px;
    max-width: unset;
    margin-bottom: 10px;
    padding: 8px;
    height: auto;
}

.catalog-filter-search button img{
    width: 20px;
    height: 20px;
}
.catalog-filter-list-checkbox-wrapper {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 8px 0;
}
.catalog-filter-list-checkbox-wrapper > img{
    margin-left: 8px;
    transition: all 0.3s ease;
    cursor: pointer;
}
.catalog-filter-acc-header.ui-accordion-header-active .catalog-filter-list-checkbox-wrapper > img{
    transform: rotate(90deg);
}
.catalog-filter-list-checkbox-label {
    display: flex;
    align-items: center;
    justify-content: flex-start;
    column-gap: 8px;

    font-family: var(--font-family);
    font-weight: 400;
    font-size: 16px;
    line-height: 100%;
    color: var(--text-white);
}
.catalog-filter-list-checkbox-label span{
    cursor: pointer;
    margin: 0;
}
.catalog-filter-list-checkbox {
    appearance: none;
    -webkit-appearance: none;
    aspect-ratio: 1 / 1;
    border: 1px solid var(--fill-dark-blue);
    border-radius: 2px;
    width: 18px;
    height: 18px;
    background-color: transparent;
    cursor: pointer;
    transition: color 0.15s ease-in-out, background-color 0.15s ease-in-out, border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
}
.catalog-filter-list-checkbox:checked {
    border: 1px solid var(--fill-violet);

    background-image: url("../images/icons/check-icon.svg");
    background-position: center;
    background-repeat: no-repeat;
    background-size: 12px;
}

.catalog-filter-list-checkbox-value-count {
    font-family: var(--second-family);
    font-weight: 400;
    font-size: 14px;
    line-height: 150%;
    color: var(--fill-violet);
}

.catalog-filters-title {
    font-family: var(--font-family);
    font-weight: 700;
    font-size: 18px;
    line-height: 100%;
    text-transform: uppercase;
    color: var(--text-white);
    margin-bottom: 24px;
}

.catalog-filters-products-count {
    font-family: var(--font-family);
    font-weight: 400;
    font-size: 14px;
    line-height: 100%;
    color: var(--text-gray);
    margin-bottom: 14px;
}
.catalog-filter:first-child .catalog-filter-title{
    border-top: none;
}
.catalog-filter-title{
    padding-top: 20px;
    padding-bottom: 20px;
    font-family: var(--font-family);
    font-weight: 600;
    font-size: 18px;
    line-height: 100%;
    color: var(--text-white);
    border-top: 1px solid var(--fill-dark-blue);
}
.catalog-filter:not(:last-child){
    margin-bottom: 20px;
}
.catalog-filter-acc-header  .catalog-filter-list-checkbox-wrapper{
    justify-content: flex-start;
}
.catalog-filter-acc-body{
    margin-left: 40px;
}

/* Базовый input range */
.price-slider {
    -webkit-appearance: none;
    appearance: none;
    width: 100%;
    height: 4px;
    background: transparent;
    cursor: pointer;
}

/* Трэк (фон) */
.price-slider::-webkit-slider-runnable-track {
    height: 4px;
    background: linear-gradient(to right, var(--fill-violet) var(--pct, 0%), var(--fill-dark-blue) 0);
    border-radius: 2px;
}
.price-slider::-moz-range-track {
    height: 4px;
    background: var(--fill-dark-blue);
    border-radius: 2px;
}
.price-slider::-moz-range-progress {
    height: 4px;
    background: var(--fill-dark-blue);
    border-radius: 2px;
}

/* Бегунок */
.price-slider::-webkit-slider-thumb {
    -webkit-appearance: none;
    appearance: none;
    width: 20px;
    height: 20px;
    background: var(--fill-violet);
    box-shadow: 0 0 10px 0 rgba(0, 0, 0, 0.1);
    border-radius: 50%;
    border: 2px solid #7b82f1;
    margin-top: -8px;
    transition: transform .2s ease;
}
.price-slider::-webkit-slider-thumb:active {
    transform: scale(1.1);
}
.price-slider::-moz-range-thumb {
    width: 20px;
    height: 20px;
    background: var(--fill-violet);
    box-shadow: 0 0 10px 0 rgba(0, 0, 0, 0.1);
    border-radius: 50%;
    border: 2px solid #7b82f1;
    transition: transform .2s ease;
}
.price-slider::-moz-range-thumb:active {
    transform: scale(1.1);
}

/* Значение */
.price-value {
    margin-top: 24px;
    margin-left: 5px;

    font-family: var(--font-family);
    font-weight: 400;
    font-size: 16px;
    line-height: 100%;
    color: var(--text-white);
}




.catalog-filter-list-radio-item {
    display: flex;
    align-items: center;
    gap: 12px;
    font-family: var(--font-family);
    font-weight: 400;
    font-size: 16px;
    line-height: 100%;
    color: var(--text-white);
}

/* Скрываем стандартный input */
.catalog-filter-list-radio-input {
    position: absolute;
    opacity: 0;
    pointer-events: none;
}

/* Стилизация label как кастомной кнопки */
.catalog-filter-list-radio-label {
    position: relative;
    padding-left: 30px; /* место для кастомного кружка */
    cursor: pointer;
    transition: all 0.3s ease;
}

/* Кастомный кружок */
.catalog-filter-list-radio-label::before {
    content: "";
    position: absolute;
    left: 0;
    top: 50%;
    transform: translateY(-50%);
    width: 18px;
    height: 18px;
    border: 1px solid var(--fill-violet);
    border-radius: 50%;
    background: transparent;
    box-sizing: border-box;
}

/* Внутренняя точка при выборе */
.catalog-filter-list-radio-input:checked + .catalog-filter-list-radio-label::after {
    content: "";
    position: absolute;
    left: 5px;
    top: 50%;
    transform: translateY(-50%);
    width: 8px;
    height: 8px;
    background: var(--fill-violet);
    border-radius: 50%;
}



/*custom DualSlider*/


.dual-slider {
    width: 100%;
    position: relative;
    height: 76px;
}

.dual-slider-track {
    height: 4px;
    background: var(--fill-light);
    position: absolute;
    top: 16px;
    width: 100%;
}

.dual-slider-fill {
    height: 4px;
    background: var(--fill-violet);
    position: absolute;
    top: 16px;
}

.dual-slider input[type=range] {
    -webkit-appearance: none;
    appearance: none;
    position: absolute;
    width: 100%;
    background: none;
    pointer-events: none;
    margin: 0;
    top: 8px;
}

.dual-slider input[type=range]::-webkit-slider-thumb {
    -webkit-appearance: none;
    appearance: none;
    width: 20px;
    height: 20px;
    border-radius: 50%;
    box-shadow: 0 0 10px 0 rgba(0, 0, 0, 0.1);
    background: var(--fill-violet);
    cursor: pointer;
    pointer-events: auto;
    border: none;

    top: 8px;
}

.dual-slider-values {
    position: absolute;
    bottom: 16px;
    left: 0;
    width: 100%;
    display: flex;
    justify-content: space-between;
    font-family: var(--font-family);
    font-weight: 400;
    font-size: 16px;
    line-height: 100%;
    color: var(--text-white);
}

/*custom switch*/

#availability{
    display: none;
}
.catalog-filter-availability-slider {
    display: block;
    width: 40px;
    height: 24px;
    background: var(--fill-dark-blue);
    border-radius: 500px;
    position: relative;
    cursor: pointer;
}
.catalog-filter-availability-slider::before{
    content: "";
    position: absolute;
    left: 4px;
    top: 4px;
    border-radius: 50%;
    width: 16px;
    height: 16px;
    background: var(--fill-gray);
    aspect-ratio: 1 / 1;
    transition: 0.3s;
}
#availability:checked + .catalog-filter-availability-slider::before {
    transform: translateX(16px);
    background: var(--fill-violet);
}

.catalog-filter-button{
    font-family: var(--second-family);
    font-weight: 400;
    font-size: 16px;
    line-height: 150%;
    color: var(--text-white);

    border-radius: 10px;
    padding: 8px 16px 8px 10px;
    background: var(--bg-dark-blue);
    display: flex;
    align-items: center;
    justify-content: center;
    height: 40px;
    width: 100%;
    max-width: 170px;
    margin-top: 24px;
}

.catalog-products-pagination {
    margin-top: 40px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.catalog-products-pagination-arrow {
    display: flex;
    align-items: center;
    justify-content: center;
}
.catalog-products-pagination-arrow:first-child{
    transform: rotate(180deg);
}
.catalog-products-pagination-arrow.last svg path{
    stroke: var(--fill-gray);
}

.catalog-products-pagination-items {
    padding: 0 20px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.catalog-products-pagination-item {
    border-radius: 5px;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 40px;
    height: 40px;
    font-family: var(--second-family);
    font-weight: 400;
    font-size: 16px;
    line-height: 150%;
    text-align: center;
    color: var(--text-white);
}

.catalog-products-pagination-item.active {
    background: var(--bg-dark-blue);
}



/* ------------------------------------------------------------
                      CONDITIONS.HTML STYLES
--------------------------------------------------------------*/

.section-conditions-form {
    max-width: 1280px;
    border-radius: 10px;
    background: var(--bg-dark-blue);
    margin: 0 auto 64px;
    padding: 54.5px 0;
}

.conditions-form {
    max-width: 478px;
    margin: 0 auto;
}

.conditions-form-title {
    font-family: var(--font4);
    font-weight: 700;
    font-size: 48px;
    line-height: 100%;
    text-align: center;
    color: var(--text-white);
    margin-bottom: 15px;
}

.conditions-form-text {
    font-family: var(--font-family);
    font-weight: 400;
    font-size: 18px;
    line-height: 110%;
    text-align: center;
    color: var(--text-gray);
    margin-bottom: 40px;
}
.conditions-form-input {
    font-family: var(--second-family);
    font-weight: 400;
    font-size: 16px;
    line-height: 100%;
    letter-spacing: 0.03em;
    color: var(--text-white);
}
.conditions-form-input::placeholder {
    font-family: var(--second-family);
    font-weight: 400;
    font-size: 16px;
    line-height: 100%;
    letter-spacing: 0.03em;
    color: var(--text-gray);
}
.conditions-form-button {
    height: 40px;
    font-family: var(--font-family);
    font-weight: 700;
    font-size: 16px;
    line-height: 150%;
    color: var(--text-white);
}

.conditions-form-privacy {
    font-family: var(--second-family);
    font-weight: 400;
    font-size: 14px;
    line-height: 100%;
    color: var(--text-gray);
    margin-top: 12px;
}
.conditions-form-privacy a{
    font-family: var(--font-family);
    font-weight: 400;
    font-size: 16px;
    line-height: 100%;
    text-decoration: underline;
    text-decoration-skip-ink: none;
    color: var(--text-gray);
}


.conditions-header {
    max-width: 768px;
    margin: 0 auto 64px auto;
}

.conditions-title {
    font-family: var(--font-family);
    font-weight: 700;
    font-size: 24px;
    line-height: 100%;
    text-transform: uppercase;
    text-align: center;
    color: var(--text-white);

    margin-bottom: 24px;
}

.conditions-text {
    font-family: var(--font-family);
    font-weight: 400;
    font-size: 18px;
    line-height: 110%;
    text-align: left;
    color: var(--text-white);
}

.section-conditions-texts {
    max-width: 768px;
    margin: 0 auto 60px auto;
}

.section-conditions-texts p {
    margin-bottom: 20px;
}

.section-conditions-texts p strong {
    font-size: 18px;
}

.section-conditions-texts p:last-child {
    margin-bottom: 0;
}

.section-conditions-text {
    font-family: var(--font-family);
    font-weight: 400;
    font-size: 16px;
    line-height: 150%;
    color: var(--text-white);
    margin-bottom: 16px;
}

.section-conditions-text.bold {
    margin-top: 20px;
    font-family: var(--font-family);
    font-weight: 700;
    font-size: 20px;
    line-height: 140%;
    color: var(--text-white);
}

.section-conditions-thesis {
    margin-top: 36px;
    margin-bottom: 36px;

    font-family: var(--font-family);
    font-weight: 400;
    font-size: 20px;
    line-height: 140%;
    color: var(--text-white);
    padding-left: 22px;
    border-left: 2px solid var(--text-white);
}
.section-conditions-title {
    margin-top: 24px;
    margin-bottom: 20px;
    font-family: var(--font-family);
    font-weight: 700;
    font-size: 32px;
    line-height: 100%;
    color: var(--text-white);
}



.conditions-tabs {
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 64px 0;
}

.conditions-tab {
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;

    font-family: var(--second-family);
    font-weight: 400;
    font-size: 16px;
    line-height: 150%;
    color: var(--text-white);
    border-radius: 10px;
    padding: 0 16px;
    height: 40px;
    transition: 0.3s;
}
.conditions-tab.active{
    color: var(--fill-violet);
    background: var(--bg-dark-gray);
}
.conditions-content{
    display: none;
}
.conditions-content.active {
    display: block;
}

.conditions-delivery-price {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    max-width: 990px;
    margin: 0 auto 64px;
}
.conditions-delivery-price-column{
    width: 100%;
    max-width: 438px;
}
.conditions-delivery-price-title {
    font-family: var(--font-family);
    font-weight: 700;
    font-size: 32px;
    line-height: 120%;
    text-align: center;
    color: var(--text-white);
}

.conditions-delivery-price-text {
    font-family: var(--font-family);
    font-weight: 500;
    font-size: 20px;
    line-height: 120%;
    text-align: center;
    color: var(--text-gray);
}

.conditions-delivery-price-block {
    border-radius: 10px;
    padding: 20px 0px;
    background: var(--bg-dark-blue);
}
.conditions-delivery-price-block:first-child{
    margin-top: 35px;
    margin-bottom: 35px;
}
.conditions-delivery-price-block-text {
    font-family: var(--font-family);
    font-weight: 400;
    font-size: 18px;
    line-height: 150%;
    text-align: center;
    color: var(--text-white);
    margin-bottom: 16px;
}

.conditions-delivery-price-block-price {
    font-family: var(--font-family);
    font-weight: 600;
    font-size: 38px;
    line-height: 100%;
    text-align: center;
    color: var(--fill-violet);
}

.section-conditions-table {
    max-width: 952px;
    margin: 0 auto 64px auto;
}

.section-conditions-table-title {
    font-family: var(--font-family);
    font-weight: 700;
    font-size: 24px;
    line-height: 100%;
    text-transform: uppercase;
    color: var(--text-white);
    margin-bottom: 20px;
}

.conditions-table {
    display: grid;
    grid-template-columns: 3fr 1fr 1fr 1fr;
}

.conditions-table-item {
    padding: 16px 0;
    border: 1px solid var(--fill-dark-blue);

    font-family: var(--font-family);
    font-weight: 400;
    font-size: 16px;
    line-height: 150%;
    color: var(--text-white);

    display: flex;
    align-items: center;
    justify-content: center;
}
.conditions-table-item:nth-child(4n+1){
    border-left-color: transparent;
    justify-content: flex-start;
}
.conditions-table-item:nth-child(4n):not(:nth-child(4)){
    border-right-color: transparent;
}
.conditions-pay-methods {
    max-width: 996px;
    margin: 0 auto 80px auto;
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.conditions-pay-method {
    border-radius: 10px;
    padding: 20px;
    background: var(--bg-dark-blue);
    max-width: 300px;
}

.conditions-pay-method-header {
    margin-bottom: 24px;
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.conditions-pay-method-title {
    font-family: var(--font-family);
    font-weight: 700;
    font-size: 24px;
    line-height: 100%;
    text-transform: uppercase;
    text-align: center;
    color: var(--text-white);
}

.conditions-pay-method-icon {
    width: 41px;
    height: 41px;
}

.conditions-pay-method-text {
    font-family: var(--font-family);
    font-weight: 400;
    font-size: 16px;
    line-height: 120%;
    color: var(--text-white);
}

.conditions-image {
    padding: 48px 0;
}
.conditions-image img{
    width: 100%;
    object-fit: cover;
    height: 500px;
    border-radius: 10px;
}
.conditions-image-caption {
    margin-top: 8px;
    padding-left: 8px;
    border-left: 2px solid var(--text-white);
    font-family: var(--second-family);
    font-weight: 400;
    font-size: 14px;
    line-height: 150%;
    color: var(--text-white);
}

.conditions-support-items {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 40px;
}

.conditions-support-item {
    width: 100%;
    text-align: center;
    border-radius: 10px;
    padding: 20px 0px;
    max-width: 394px;
    background: var(--bg-dark-blue);
}

.conditions-support-item-title {
    font-family: var(--font-family);
    font-weight: 700;
    font-size: 24px;
    line-height: 130%;
    text-align: center;
    color: var(--text-white);
    margin-bottom: 24px;
}

.conditions-support-item-link {
    font-family: var(--font-family);
    font-weight: 400;
    font-size: 16px;
    line-height: 120%;
    text-align: center;
    color: var(--text-white);
}


.conditions-support-map{
    margin-bottom: 64px;
}
.conditions-support-map #map {
    width: 100%;
    aspect-ratio: 1312 / 543;
}

.conditions-support-form {
    max-width: 560px;
    margin: 0 auto 64px auto;
}

.conditions-support-form-title {
    font-family: var(--font-family);
    font-weight: 700;
    font-size: 24px;
    line-height: 100%;
    text-transform: uppercase;
    text-align: center;
    color: var(--text-white);
    margin-bottom: 10px;
}

.conditions-support-form-text {
    font-family: var(--second-family);
    font-weight: 400;
    font-size: 18px;
    line-height: 150%;
    text-align: center;
    color: var(--text-white);
}

.conditions-support-form-items {
    margin-top: 40px;
    margin-bottom: 30px;
}

.conditions-support-form-item {
    display: block;
}
.conditions-form-privacy a {
    font-size: inherit;
}
.conditions-support-form-item span{
    font-family: var(--font-family);
    font-weight: 400;
    font-size: 16px;
    line-height: 100%;
    letter-spacing: 0.03em;
    color: var(--text-white);
    display: block;
    margin-bottom: 5px;
    margin-top: 5px;
}
.conditions-support-form-input {
    font-family: var(--font-family);
    font-weight: 400;
    font-size: 16px;
    line-height: 100%;
    letter-spacing: 0.03em;
    color: var(--text-white);
    margin-bottom: 0;
}
.conditions-support-form-input::placeholder {
    font-family: var(--font-family);
    font-weight: 400;
    font-size: 16px;
    line-height: 100%;
    letter-spacing: 0.03em;
    color: var(--text-gray);
}
.conditions-support-form-textarea{
    resize: none;
    height: 120px;
    padding: 15px 12px;
    font-family: var(--font-family);
    font-weight: 400;
    font-size: 16px;
    line-height: 100%;
    letter-spacing: 0.03em;
    color: var(--text-white);
    margin: 0;
}
.conditions-support-form-textarea::placeholder {
    font-family: var(--font-family);
    font-weight: 400;
    font-size: 16px;
    line-height: 100%;
    letter-spacing: 0.03em;
    color: var(--text-gray);
}

.faqs-acc{
    max-width: 768px;
    margin: 0 auto;
    padding-bottom: 64px;
}
.faqs-acc .ui-accordion-header{
    display: flex;
    align-items: center;
    justify-content: space-between;
    font-family: var(--font-family);
    font-weight: 700;
    font-size: 18px;
    line-height: 100%;
    text-transform: uppercase;
    color: var(--text-white);
    padding: 27px 0;

    border-top: 1px solid var(--fill-dark-blue);
    cursor: pointer;
}
.faqs-acc .ui-accordion-header:last-of-type.ui-accordion-header-active{
    border-bottom-color: transparent;
}
.faqs-acc .ui-accordion-header.ui-accordion-header-active img{
    transform: rotate(180deg);
    transition: transform .3s;
}
.faqs-acc .ui-accordion-header .ui-accordion-header-icon{
    display: none;
}
.faqs-acc .ui-accordion-content{
    font-family: var(--font-family);
    font-weight: 400;
    font-size: 16px;
    line-height: 120%;
    color: var(--text-white);
    padding-bottom: 24px;
}
.condition-request-form{
    max-width: 768px;
    margin: 0 auto;
    padding-top: 64px;
    padding-bottom: 64px;
}
.condition-request-form-title {
    font-family: var(--font-family);
    font-weight: 700;
    font-size: 24px;
    line-height: 100%;
    text-transform: uppercase;
    text-align: center;
    color: var(--text-white);
    max-width: 724px;
    margin: 0 auto 20px auto;
}

.condition-request-form-text {
    font-family: var(--font-family);
    font-weight: 400;
    font-size: 16px;
    line-height: 120%;
    text-align: center;
    color: var(--text-white);

}
.condition-request-form-items{
    margin-top: 40px;

}
.back-button-wrapper{
    margin-top: 64px;
}
.back-button{
    display: flex;
    align-items: center;
    justify-content: flex-start;
    column-gap: 8px;

    border-radius: 10px;
    background: var(--bg-dark-blue);
    padding: 8px 16px 8px 10px;
    font-family: var(--second-family);
    font-weight: 400;
    font-size: 16px;
    line-height: 150%;
    color: var(--text-white);
    max-width: 105px;
}

.condition-request-form-button{
    font-size: 18px;
    font-weight: 500;
    height: 50px;
}

.condition-request-form-select-selected{
    background: transparent;
    border: 1px solid var(--fill-dark-blue);
    border-radius: 8px;
    padding: 10px 12px;
    display: flex;
    align-items: center;
    justify-content: space-between;
}
.condition-request-form-select-placeholder{
    font-family: var(--font-family);
    font-weight: 400;
    font-size: 16px;
    line-height: 150%;
    color: var(--text-white);
    margin: 0 !important;
}
.condition-request-form-select-options{
    width: 100%;
    padding: 0;
    background: var(--fill-dark-blue);
    border-radius: 8px;
}
.condition-request-form-option{
    border: 1px solid var(--fill-dark-blue);
    font-family: var(--font-family);
    font-weight: 400;
    font-size: 16px;
    line-height: 150%;
    color: var(--text-white);
    background: transparent;
    padding: 10px 12px;
}
.condition-request-form-option:hover{
    border-bottom: 1px solid var(--text-white) !important;
    background: var(--fill-violet-hover);
}
.condition-request-form-option:not(:last-child){
    border-bottom: 1px solid var(--text-gray);
}
.condition-request-forms{
    display: flex;
    align-items: center;
    justify-content: flex-end;
    column-gap: 32px;
}
.condition-request-form {
    position: relative;
}
.condition-request-form:not(:last-child):after{
    content: "";
    position: absolute;
    height: 14px;
    width: 1px;
    right: -16px;
    top: 50%;
    transform: translateY(-50%);
    background: #fff;
}

.condition-request-file-upload-wrapper{
    margin-bottom: 20px;
}
.condition-request-file-upload {
    display: block;
    font-family: var(--font-family);
    font-weight: 400;
    font-size: 16px;
    line-height: 100%;
    letter-spacing: 0.03em;
    text-decoration: underline;
    text-decoration-skip-ink: none;
    color: var(--fill-violet);
    cursor: pointer;
}

.condition-request-file-upload input {
    display: none;
}

.condition-request-preview {
    margin-top: 20px;
    display: flex;
    flex-wrap: wrap;
    gap: 15px;
}

.preview-item {
    position: relative;
    display: inline-block;
}

.preview-item img {
    max-width: 120px;
    max-height: 120px;
    border-radius: 10px;
    display: block;
}

.remove-btn {
    position: absolute;
    top: -5px;
    right: -5px;
    background: rgba(0,0,0,0.6);
    color: white;
    border: none;
    border-radius: 50%;
    width: 20px;
    height: 20px;
    font-size: 14px;
    cursor: pointer;
    line-height: 18px;
    text-align: center;
}



/* ------------------------------------------------------------
                      ACCOUNT.HTML STYLES
--------------------------------------------------------------*/


.account-tabs{
    padding: 12px 0;
}
.account-recommendations{
    padding: 60px 0 60px;
}
.account-recommendations-carousel-container{
    position: relative;
}
.account-recommendations-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 40px;
}

.account-recommendations-title {
    font-family: var(--font-family);
    font-weight: 700;
    font-size: 24px;
    line-height: 100%;
    text-transform: uppercase;
    color: var(--text-white);
}

.account-recommendations-carousel-prev,
.comparison-carousel-prev{
    left: 5px;
    top: 50%;
    transform: translateY(-50%);
}
.account-recommendations-carousel-next,
.comparison-carousel-next {
    right: 5px;
    top: 50%;
    transform: translateY(-50%);
}
.account-recommendations-carousel-next img{
    transform: rotate(180deg);
}
.comparison-carousel-next img{
    transform: rotate(180deg);
}

.account-profile-content{
    border-radius: 10px;
    padding: 40px;
    background: var(--bg-dark-blue);
}
.account-profile-content-item {
    position: relative;
    padding-bottom: 20px;
    border-bottom: 1px solid var(--fill-dark-blue);
    margin-bottom: 30px;
}
.account-profile-content-item:last-child{
    margin-bottom: 0;
}
.account-profile-info-view-mode {
    /*display: none;*/
    display: flex;
    align-items: center;
    justify-content: flex-start;
    column-gap: 20px;
}

.account-profile-image {
    width: 98px;
    height: 98px;
}
.account-profile-image img{
    width: 100%;
    height: 100%;
    object-fit: cover;
    border-radius: 50%;
}
.account-profile-name {
    font-family: var(--font-family);
    font-weight: 700;
    font-size: 28px;
    line-height: 100%;
    text-align: center;
    color: var(--text-white);

    margin-bottom: 24px;
}

.account-profile-main-bottom {
    display: flex;
    align-items: flex-start;
    column-gap: 24px;
}
.account-profile-dob-title,
.account-profile-gender-title,
.account-profile-phone-title,
.account-profile-mail-title,
.account-profile-password-title{
    font-family: var(--font-family);
    font-weight: 500;
    font-size: 16px;
    line-height: 100%;
    text-align: left;
    color: var(--text-gray);

    margin-bottom: 5px;
}

.account-profile-dob,
.account-profile-gender,
.account-profile-phone,
.account-profile-mail,
.account-profile-password{
    font-family: var(--font-family);
    font-weight: 400;
    font-size: 16px;
    line-height: 100%;
    text-align: left;
    color: var(--text-white);
}
.account-profile-edit-button {
    position: absolute;
    top: 0;
    right: 0;
    background: transparent;
    font-family: var(--second-family);
    font-weight: 400;
    font-size: 16px;
    line-height: 150%;
    color: var(--fill-violet);
}

.account-profile-info-edit-mode {
    display: none;
    /*display: flex;*/
    align-items: center;
    justify-content: flex-start;
    column-gap: 20px;
}

.account-profile-info-edit-mode .account-profile-main{
    display: flex;
    align-items: flex-end;
    column-gap: 24px;
}

.account-profile-change-image-button {
    width: 100%;
    background: transparent;
    font-family: var(--font-family),sans-serif;
    font-weight: 400;
    font-size: 12px;
    line-height: 100%;
    color: var(--fill-violet);

    margin-top: 10px;
}

.account-profile-main-left {
    display: flex;
    flex-direction: column;
    row-gap: 24px;
}

.account-profile-label {
    display: block;
}
.account-profile-label span{
    display: block;
    font-family: var(--font-family);
    font-weight: 500;
    font-size: 16px;
    line-height: 100%;
    text-align: left;
    color: var(--text-gray);
    margin-bottom: 5px;
}
.account-profile-label-radio span{
    margin-bottom: 20px;
}
.account-profile-input{
    width: 302px;
    margin: 0;
}
.account-profile-label-radios{
    display: flex;
    align-items: center;
    justify-content: flex-start;
    column-gap: 20px;
}
#profile-image-input{
    display: none;
}
.account-profile-title{
    font-family: var(--font-family);
    font-weight: 700;
    font-size: 22px;
    line-height: 100%;
    text-align: left;
    color: var(--text-white);
    margin-bottom: 24px;
}
.account-profile-data-main{
    display: flex;
    align-items: flex-start;
    flex-wrap: wrap;
    gap: 24px;

}
.account-profile-password-wrapper{
    width: 100%;
}

.account-profile-data-edit-mode{
    display: none;
}




.account-profile-firstEntry{
    font-family: var(--font-family);
    font-weight: 500;
    font-size: 16px;
    line-height: 100%;
    text-align: left;
    color: var(--text-gray);
    margin-bottom: 24px;
}
.account-profile-management-button{
    font-family: var(--second-family);
    font-weight: 400;
    font-size: 16px;
    line-height: 150%;
    color: var(--fill-violet);
}
.account-profile-exit-button{
    background: transparent;
    font-family: var(--second-family);
    font-weight: 400;
    font-size: 16px;
    line-height: 150%;
    color: var(--fill-violet);
}
.account-profile-management-button{
    position: absolute;
    top: 0;
    right: 0;
    background: transparent;
}

.favourites{
    border-radius: 10px;
}

.favourites-items{
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
}
.favourites-pagination-button{
    font-family: var(--second-family);
    font-weight: 400;
    font-size: 16px;
    line-height: 150%;
    color: var(--text-white);
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 8px 16px 8px 10px;
    background: var(--bg-dark-blue);
    border-radius: 10px;

    margin: 40px auto 0 auto;
}
.account-padding{
    padding-top: 40px;
    padding-bottom: 80px;
}

.account-header-top .favourites-pagination-button{
    margin: 0;
}

.account-header-top {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 20px;
}

.account-header-title {
    font-family: var(--font-family);
    font-weight: 700;
    font-size: 24px;
    line-height: 100%;
    text-transform: uppercase;
    color: var(--text-white);
}
.account-header-bottom {
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.account-header-filters {
    display: flex;
    align-items: center;
    justify-content: flex-start;
    column-gap: 12px;
}
.account-header-search{
    margin-bottom: 0;
    width: 275px;
    border: 1px solid var(--fill-gray);
    border-radius: 0 10px 10px 10px;
    padding: 0px 8px;
    width: 275px;
    height: 40px;
}
.account-header-search .header-search-button img{
    width: 20px;
    height: 20px;
}
.account-openFilters-button {
    background: transparent;
    border: 1px solid var(--text-white);
    padding: 7px 20px;
    display: flex;
    align-items: center;
    justify-content: center;
    column-gap: 12px;
    font-family: var(--second-family);
    font-weight: 400;
    font-size: 16px;
    line-height: 150%;
    color: var(--text-white);
}

.account-header-products-count {
    font-family: var(--font-family);
    font-weight: 400;
    font-size: 16px;
    line-height: 100%;
    text-align: right;
    color: var(--text-gray);
}
.bonusBalance {
    padding-top: 20px;
}
.bonusBalance-items {
    display: grid;
    grid-template-columns: 2fr 1fr 1fr;
    gap: 32px;
}

.bonusBalance-item {
    border-radius: 10px;
    background: var(--bg-dark-blue);
    padding: 20px;
}

.bonusBalance-item-title {
    font-family: var(--font4);
    font-weight: 700;
    font-size: 32px;
    line-height: 100%;
    color: var(--text-white);
}

.bonusBalance-item-balance {
    margin-top: 24px;
    margin-bottom: 32px;
    font-family: var(--font-family);
    font-weight: 500;
    font-size: 48px;
    line-height: 100%;
    text-align: left;
    color: var(--fill-violet);
}

.bonusBalance-item-button {
    font-family: var(--second-family);
    font-weight: 400;
    font-size: 16px;
    line-height: 150%;
    color: var(--text-white);

    display: flex;
    align-items: center;
    justify-content: center;
    padding: 8px 14px;
    background: var(--bg-dark-gray);
    border-radius: 10px;
}

.bonusBalance-item-text {
    margin-top: 16px;
    font-family: var(--second-family);
    font-weight: 400;
    font-size: 16px;
    line-height: 150%;
    color: var(--text-white);

    margin-bottom: 24px;
}

.bonusBalance-item-buttonGO {
    font-family: var(--second-family);
    font-weight: 400;
    font-size: 16px;
    line-height: 150%;
    color: var(--text-white);
    background: transparent;
    display: flex;
    align-items: center;
    justify-content: center;
    column-gap: 8px;
}
.accrualHistory{
    padding-top: 120px;
    padding-bottom: 120px;
}

.accrualHistory-table {
    display: grid;
    grid-template-columns: 2fr 3fr 1fr;
}

.accrualHistory-table-item {
    padding-top: 28px;
    padding-bottom: 28px;
    font-family: var(--font-family);
    font-weight: 400;
    font-size: 16px;
    line-height: 100%;
    color: var(--text-white);
    border-bottom: 1px solid var(--fill-dark-blue);
    display: flex;
    align-items: center;
    justify-content: flex-start;
}

.accrualHistory-table-header {
    font-family: var(--font-family);
    font-weight: 500;
    font-size: 16px;
    line-height: 100%;
    color: var(--text-white);
    padding-top: 20px;
    padding-bottom: 20px;
}
.accrualHistory-table-item:nth-child(3n){
    justify-content: flex-end;
    padding-right: 28px;
}
.accrualHistory-table-item:nth-child(3n-1){
    padding-right: 20px;
}
.myTasks-item {
    display: flex;
    align-items: flex-start;
    flex-direction: column;
    border-radius: 10px;
    background: var(--bg-dark-blue);
    padding: 24px 20px;
}
.myTasks{
    padding-top: 40px;
}
.myTasks-item-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 24px;
    width: 100%;
}

.myTasks-item-bonuses {
    font-family: var(--font-family);
    font-weight: 700;
    font-size: 24px;
    line-height: 100%;
    text-transform: uppercase;
    text-align: left;
    color: var(--text-white);
}

.myTasks-item-icon {
    width: 44px;
    height: 44px;
}
.myTasks-item-icon img{
    width: 100%;
    height: 100%;
    object-fit: cover;
}
.myTasks-item-body {
    margin-bottom: 24px;
}

.myTasks-item-title {
    font-family: var(--font-family);
    font-weight: 500;
    font-size: 18px;
    line-height: 100%;
    color: var(--text-white);
    margin-bottom: 8px;
}

.myTasks-item-text {
    font-family: var(--font-family);
    font-weight: 400;
    font-size: 16px;
    line-height: 100%;
    letter-spacing: 0.03em;
    color: var(--text-gray);
}

.myTasks-item-button {
    border-radius: 10px;
    padding: 11px 16px;
    min-width: 150px;

    font-family: var(--font-family);
    font-weight: 400;
    font-size: 16px;
    line-height: 100%;
    border: 1px solid transparent;
}

.myTasks-item-button.active {
    color: var(--text-white);
    background: var(--fill-violet);

}
.myTasks-item-button.process{
    color: var(--text-white);
    border: 1px solid var(--fill-violet);
    background: transparent;
}
.myTasks-item-button.blocked{
    color: var(--text-white);
    background: var(--fill-gray);

}
.myTasks-item-button.done{
    color: var(--fill-violet);
    background: var(--bg-dark-gray);
}
.myTasks-more-button{
    display: flex;
    align-items: center;
    justify-content: center;
    font-family: var(--font-family);
    font-weight: 500;
    font-size: 18px;
    line-height: 100%;
    letter-spacing: 0.01em;
    text-align: center;
    color: var(--text-white);
    border: 2px solid var(--fill-violet);
    border-radius: 10px;
    background: transparent;
    padding: 13.5px 40px;

    margin: 32px 0 0 auto;
}
.myTasks-carousel-dots{
    justify-content: flex-end;
    margin-top: 32px;
}


.basket-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    max-width: 780px;
    margin-bottom: 40px;
    margin-top: 32px;
}

.basket-main-actions {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    column-gap: 5px;
}

.basket-main-action {
    display: flex;
    align-items: center;
    justify-content: center;
    background: transparent;
}
.basket-content{
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    column-gap: 60px;
}

.bold{
    font-weight: 700 !important;
}
.basket-item {
    display: grid;
    grid-template-columns: 0.1fr 0.5fr 1.6fr 0.1fr 1.5fr;
    gap: 20px;
}

.basket-item-image {
    width: 100px;
    height: 100px;
}
.basket-item-image img{
    width: 100%;
    height: 100%;
    object-fit: cover;
    border-radius: 10px;
}
.basket-item-info {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: space-between;
    row-gap: 10px;
}

.basket-item-title {
    font-family: var(--font-family);
    font-weight: 500;
    font-size: 22px;
    line-height: 100%;
    color: var(--text-white);

    margin-bottom: 5px;
}

.basket-item-variant {
    font-family: var(--font-family);
    font-weight: 400;
    font-size: 16px;
    line-height: 100%;
    color: var(--text-white);
}

.basket-item-actions {
    display: flex;
    align-items: center;
    justify-content: flex-start;
    column-gap: 5px;
}

.basket-item-counter {
    display: flex;
    align-items: center;
    justify-content: center;
    background-color: transparent;
}

.basket-item-counter .btn{
    background: transparent;
}

.basket-item-counter .input {
    background: transparent;
    display: flex;
    align-items: center;
    justify-content: center;
    border: none;
    width: 40px;
    height: 40px;
    text-align: center;
    font-family: var(--font-family);
    font-weight: 500;
    font-size: 18px;
    line-height: 150%;
    color: var(--text-white);
}


.basket-price-wrapper {
    display: flex;
    align-items: center;
    justify-content: flex-end;
}

.basket-price {
    display: flex;
    align-items: center;
    justify-content: center;
    column-gap: 20px;
}

.basket-price-old {
    font-family: var(--font-family);
    font-weight: 500;
    font-size: 22px;
    line-height: 100%;
    text-decoration: line-through;
    color: var(--text-gray);
}
.basket-price-action{
    font-family: var(--font-family);
    font-weight: 500;
    font-size: 22px;
    line-height: 100%;
    color: var(--text-white);
}
.basket-price-current {
    font-family: var(--font-family);
    font-weight: 500;
    font-size: 22px;
    line-height: 100%;
    color: var(--text-white);
}

.basket-price-payBonuses {
    font-family: var(--second-family);
    font-weight: 400;
    font-size: 16px;
    line-height: 150%;
    color: var(--color-white);
    background: transparent;

    border: 2px solid var(--fill-violet);
    border-radius: 10px;
    padding: 10.5px 15.5px;
}
.basket-items{
    max-width: 780px;
}
.basket-item:not(:last-child){
    margin-bottom: 32px;
}

.basket-total-wrapper {
    max-width: 420px;
    width: 100%;
}

.basket-actions {
}
.basket-action {
    display: flex;
    align-items: center;
    justify-content: space-between;

    border: 1px solid var(--fill-violet);
    border-radius: 10px;
    padding: 20px;
    font-family: var(--font-family);
    font-weight: 700;
    font-size: 20px;
    line-height: 100%;
    color: var(--text-white);
}

.basket-action-bonus {
    font-family: var(--font-family);
    font-weight: 700;
    font-size: 20px;
    line-height: 100%;
    color: var(--fill-violet);
}

.basket-action-promotionsApplied {
    flex-direction: column;
    align-items: flex-start;
}

.basket-action-promotionsApplied-title {
    font-family: var(--font-family);
    font-weight: 700;
    font-size: 22px;
    line-height: 100%;
    color: var(--text-white);
    margin-bottom: 36px;
}

.basket-action-promotionsApplied-list {
    width: 100%;
}

.basket-action-promotionsApplied-list-item {
    position: relative;
    padding-left: 26px;

    width: 100%;
    display: flex;
    align-items: center;
    justify-content: space-between;
}
.basket-action-promotionsApplied-list-item:before {
    position: absolute;
    content: "—";
    top: 50%;
    transform: translateY(-50%);
    left: 0;
}
.basket-action-promotionsApplied-list-item:not(:last-child) {
    margin-bottom: 16px;
}
.basket-action-promotionsApplied-list-item-text {
    font-family: var(--font-family);
    font-weight: 300;
    font-size: 20px;
    line-height: 100%;
    color: var(--text-white);
}

.red {
    color: var(--accent-pink) !important;
}

.big {
    text-transform: uppercase !important;
}

.basket-action-promotionsApplied-list-item-price {
    font-family: var(--font-family);
    font-weight: 500;
    font-size: 20px;
    line-height: 100%;
    color: var(--text-white);
}

.basket-action-promotionsApplied-list-item-total {
    display: flex;
    align-items: center;
    justify-content: space-between;
    border-bottom: 1px solid var(--fill-dark-blue);
    padding-bottom: 18px;
}

.basket-action-promotionsApplied-list-item-total-title {
}

.basket-action-bonusBalance {
    flex-direction: column;
    justify-content: flex-start;
    align-items: flex-start;
}

.basket-action-bonusBalance-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 100%;
}
.basket-action-bonusBalance-row:first-child {
    margin-bottom: 36px;
}
.basket-action-bonusBalance-row:nth-child(2) {
    margin-bottom: 16px;
}
.basket-action-bonusBalance-row:last-child {
    padding-bottom: 18px;
    border-bottom: 1px solid var(--fill-dark-blue);
}
.basket-action-bonusBalance-left{
    display: flex;
    align-items: center;
    justify-content: flex-start;
    column-gap: 8px;

    font-family: var(--font-family);
    font-weight: 500;
    font-size: 20px;
    line-height: 100%;
    color: var(--text-white);
 }
.basket-action-bonusBalance-left a{
    display: flex;
    align-items: center;
    justify-content: center;
}
.basket-action-bonusBalance-left span{
    font-family: var(--font-family);
    font-weight: 700;
    font-size: 20px;
    line-height: 100%;
    color: var(--text-white);
}
.basket-total {
    border-radius: 10px;
    padding: 20px;
    background: var(--bg-dark-blue);
}

.basket-total-products {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 16px;
}

.basket-total-products-title,
.basket-total-discount-title{
    font-family: var(--font-family);
    font-weight: 500;
    font-size: 20px;
    line-height: 100%;
    color: var(--text-white);
}

.basket-total-delivery{
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding-bottom: 18px;
    border-bottom: 1px solid var(--fill-dark-blue);
}
.basket-total-products-price {
    font-family: var(--font-family);
    font-weight: 500;
    font-size: 20px;
    line-height: 100%;
    color: var(--text-white);
    text-decoration: line-through;
}
.basket-total-delivery-price{
    font-family: var(--font-family);
    font-weight: 500;
    font-size: 20px;
    line-height: 100%;
    color: var(--text-white);
}
.basket-total-discount {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 16px;
}

.basket-total-price-wrapper{
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding-top: 18px;
    padding-bottom: 36px;
}
.basket-total-discount-price {
    font-family: var(--font-family);
    font-weight: 500;
    font-size: 20px;
    line-height: 100%;
}

.basket-total-title {
    font-family: var(--font7);
    font-weight: 600;
    font-size: 24px;
    line-height: 120%;
    letter-spacing: -0.02em;
    color: var(--text-white);
}

.basket-total-price {
    font-family: var(--second-family);
    font-weight: 700;
    font-size: 24px;
    line-height: 140%;
    text-align: center;
    color: var(--text-white);
}


.orderHistory{
    padding-top: 40px;
    padding-bottom: 80px;
}
.orderHistory-table .ui-icon{
    display: none;
}
.orderHistory-table-item{
    padding: 16px 24px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    font-family: var(--font-family);
    font-weight: 400;
    font-size: 16px;
    line-height: 100%;
    color: var(--text-white);
}
.orderHistory-table-header .orderHistory-table-item{
    font-family: var(--font-family);
    font-weight: 700;
    font-size: 16px;
    line-height: 150%;
    color: var(--text-white);
}
.orderHistory-table-item:last-child{
    justify-content: flex-end;
    column-gap: 4px;
}
.orderHistory-table-row.ui-accordion-header-active .orderHistory-table-item:last-child img{
    transform: rotate(180deg);
    transition: .3s;
}
.orderHistory-table-row{
    cursor: pointer;
    display: grid;
    grid-template-columns: repeat(6,1fr);
    border-bottom: 1px solid var(--fill-dark-blue);
}
.orderHistory-table-item.completed{
    color: var(--accent-green);
}
.orderHistory-table-item.process{
    color: var(--accent-orange);
}

.orderHistory-table-content-left-row{
    display: flex;
    align-content: center;
    justify-content: space-between;
}
.orderHistory-table-content-left-row:nth-child(2){
    margin-bottom: 15px;
}
.orderHistory-table-content-left-row:nth-child(3){
    margin-bottom: 18px;
}
.orderHistory-table-content-left-row:last-child{
    padding-top: 10px;
    border-top: 1px solid var(--fill-dark-blue);
}

.orderHistory-table-content-left-items{
    margin-bottom: 20px;
}
.orderHistory-table-content-left-item {
    display: grid;
    grid-template-columns: 0.9fr 4fr 1fr 1fr;
    align-items: center;
}
.orderHistory-table-content-left-item:not(:last-child){
    margin-bottom: 5px;
}
.orderHistory-table-content-left-item-image {
    width: 72px;
    height: 72px;
}
.orderHistory-table-content-left-item-image img{
    width: 100%;
    height: 100%;
    object-fit: cover;
    border-radius: 5px;
}
.orderHistory-table-content-left-item-info {
}

.orderHistory-table-content-left-item-title {
    font-family: var(--font-family);
    font-weight: 500;
    font-size: 16px;
    line-height: 100%;
    color: var(--text-white);
    margin-bottom: 5px;
}

.orderHistory-table-content-left-item-variant {
    font-family: var(--font-family);
    font-weight: 400;
    font-size: 14px;
    line-height: 100%;
    color: var(--text-white);
}
.orderHistory-table-content-left-item-counter input{
    font-family: var(--second-family);
    font-weight: 500;
    font-size: 16px;
    line-height: 150%;
    color: var(--text-white);
}

.orderHistory-table-content-left-item-price {
    font-family: var(--font-family);
    font-weight: 500;
    font-size: 18px;
    line-height: 100%;
    color: var(--text-white);
    text-align: right;
}
.orderHistory-table-content-right-button{
    background: var(--bg-dark-blue);
}
.orderHistory-table-content-right-button:hover{
    background: var(--bg-dark-blue);
}
.orderHistory-table-content-right .button:not(:last-child){
    margin-bottom: 16px;
}
.orderHistory-table-content{
    display: grid;
    grid-template-columns: 4fr 2fr;
    padding: 20px 20px 60px 20px
}
.ui-accordion-content-active {
    height: initial!important;
}
.orderHistory-table-content-left{
    margin-right: 15%;
}
.orderHistory-table-content-right{
    max-width: 380px;
    width: 100%;
    margin-left: auto;
    margin-right: 0;
}

.deduct-bonuses-mobile {
    display: none;
}

.form-promo-mobile {
    display: none;
}

/* ---------------------------------------------------------------------------------------------
        popup
--------------------------------------------------------------------------------------------- */

.popup{
    position: fixed;
    z-index: 999;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    background-color: rgba(0, 0, 0, 0.8);
    display: flex;
    align-items: center;
    justify-content: center;
    transition: opacity 0.3s ease;
    pointer-events: none;
    opacity: 0;
    /*pointer-events: auto;*/
    /*opacity: 1;*/
}
.popup.active{
    pointer-events: auto;
    opacity: 1;
}
.popup-container{
    position: relative;
    background: var(--bg-dark-gray);
}
.close-popup{
    cursor: pointer;
    position: absolute;
    right: 20px;
    top: 20px;
}

.review-popup-container{
    border-radius: 24px;
    padding: 40px;
    max-width: 1300px;
    width: 100%;
}


.section-offers-item-rating-stars{
    display: flex;
    align-items: center;
    justify-content: center;
    column-gap: 4px;
}

.stars {
    margin: 32px 0;
}
.star {
    font-size: 24px;
    color: #555;
    cursor: pointer;
    transition: color 0.2s;
}
.star.active svg{
    fill: var(--accent-orange);
}
.review-textarea{
    resize: none;
    width: 100%;
    height: 120px;
    background: transparent;
    border: 1px solid var(--fill-dark-blue);
    border-radius: 8px;
    padding: 15px 12px;

    font-family: var(--font-family);
    font-weight: 400;
    font-size: 16px;
    line-height: 100%;
    letter-spacing: 0.03em;
    color: var(--text-white);
}
.review-textarea::placeholder{
    font-family: var(--font-family);
    font-weight: 400;
    font-size: 16px;
    line-height: 100%;
    letter-spacing: 0.03em;
    color: var(--text-gray);
}
.review-popup-privacy{
    font-family: var(--font-family);
    font-weight: 400;
    font-size: 16px;
    line-height: 100%;
    text-decoration: underline;
    text-decoration-skip-ink: none;
    color: var(--text-gray);
    margin-top: 15px;
}
.review-upload-box{
    margin-top: 24px;
    margin-bottom: 24px;
    display: flex;
    align-items: center;
    justify-content: flex-start;
}
.review-popup-title{
    margin-bottom: 10px;
    font-family: var(--font-family);
    font-weight: 700;
    font-size: 32px;
    line-height: 100%;
    color: var(--text-white);

}
.review-popup-article {
    font-family: var(--font-family);
    font-weight: 400;
    font-size: 16px;
    line-height: 100%;
    color: var(--text-gray);

    display: flex;
    align-content: center;
    justify-content: flex-start;
    column-gap: 10px;
}
.review-popup-article-copy {
    background: transparent;
    display: flex;
    align-items: center;
    justify-content: center;
}
.review-textarea-label span{
    font-family: var(--font-family);
    font-weight: 400;
    font-size: 16px;
    line-height: 100%;
    letter-spacing: 0.03em;
    color: var(--text-white);
    display: block;
    margin-bottom: 5px;
}

.review-popup-checkbox-label{
    margin-top: 15px;
}
.review-button-upload{
    cursor: pointer;
    border-radius: 10px;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 15px 20px;
    background: var(--fill-dark-blue);
    max-width: 183px;
    max-height: 48px;

    font-family: var(--font-family);
    font-weight: 500;
    font-size: 18px;
    line-height: 100%;
    letter-spacing: 0.01em;
    text-align: center;
    color: var(--text-white);
}

#review-previewContainer {
    display: flex;
    gap: 10px;
}
#review-previewContainer img {
    width: 80px;
    height: 80px;
    border-radius: 10px;
    object-fit: cover;
}
#review-previewContainer .preview-item:last-child {
    margin-right: 24px;
}



/* ------------------------------------------------------------
                      PRODUCT.HTML STYLES
--------------------------------------------------------------*/

.quickBuy-popup-container,
.quickBuyNum-popup-container{
    width: 100%;
    max-width: 560px;
    border-radius: 10px;
    padding: 64px 50px 30px 50px;
}

.quickBuy-form-title {
    font-family: var(--font4);
    font-weight: 700;
    font-size: 32px;
    line-height: 100%;
    text-transform: uppercase;
    text-align: center;
    color: var(--text-white);

    margin-bottom: 10px;
}

.quickBuy-form-text {
    font-family: var(--font-family);
    font-weight: 400;
    font-size: 16px;
    line-height: 100%;
    text-align: center;
    color: var(--text-white);
    margin-bottom: 32px;
    max-width: 234px;
    margin-left: auto;
    margin-right: auto;
}

.quickBuy-orderNum-button{
    max-width: 260px;
    margin-left: auto;
    margin-right: auto;
}



.section-char-table {
    max-width: 1000px;
    margin: 0 auto 80px auto;
}

.char-table {
    display: grid;
    grid-template-columns: 0.25fr 1fr 1fr 1fr 1fr;
}

.char-table-item {
    padding: 10px 17.5px;

    font-family: var(--second-family);
    font-weight: 400;
    font-size: 16px;
    line-height: 150%;
    text-align: center;
    color: var(--text-white);
    border: 1px solid var(--bg-dark-blue);
}

.char-table-item:nth-child(-n+5){
    font-weight: 700;
    font-size: 20px;
}
.char-table-item:nth-child(5n+1){
    border-left-color: transparent;

}
.char-table-item:nth-child(5n):not(:nth-child(5)){
    border-right-color: transparent;
}

.instruction-download{
    padding: 29px 0 24px 0;
    display: flex;
    align-items: center;
    justify-content: space-between;

    font-family: var(--font-family);
    font-weight: 500;
    font-size: 22px;
    line-height: 100%;
    color: var(--text-white);
    border-top: 1px solid var(--fill-dark-blue);
}
.instruction-download:last-child{
    border-bottom: 1px solid var(--fill-dark-blue);
}
.instructions .container{
    max-width: 1056px;
}
.product-review-sort-span{
    font-family: var(--font-family);
    font-weight: 400;
    font-size: 16px;
    line-height: 100%;
    color: var(--text-gray);
    display: block;
    margin-right: 10px;
}
.product-review-header{
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 40px;
}
.product-review-header-button{
    padding: 8px 14px 8px 14px;
    border-radius: 10px;
    background: var(--bg-dark-blue);
    font-family: var(--second-family);
    font-weight: 400;
    font-size: 16px;
    line-height: 150%;
    color: var(--text-white);
}


.section-offers-item-rating-stars{
    display: flex;
    align-items: center;
    justify-content: center;
    column-gap: 6px;
}

.product-review-item {
    border-radius: 10px;
    padding: 30px;
    background: var(--bg-dark-blue);
}

.product-review-item:not(:last-child){
    margin-bottom: 20px;
}
.product-review-item-header {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
}

.product-review-item-info {
    margin-bottom: 20px;
}

.product-review-item-author {
    margin-bottom: 5px;
    font-family: var(--font-family);
    font-weight: 700;
    font-size: 22px;
    line-height: 100%;
    color: var(--text-white);
}

.product-review-item-date {
    font-family: var(--font-family);
    font-weight: 400;
    font-size: 16px;
    line-height: 100%;
    color: var(--text-gray);
}

.product-review-item-text {
    font-family: var(--font-family);
    font-weight: 400;
    font-size: 18px;
    line-height: 120%;
    color: var(--text-white);

    margin-bottom: 30px;
    max-width: 870px;
}

.product-review-item-images {
    display: flex;
    align-items: center;
    justify-content: flex-start;
    column-gap: 10px;
}
.product-review-item-images img{
    width: 100px;
    height: 100px;
    object-fit: cover;
    border-radius: 10px;
}
.product-delivery .container{
    max-width: 1056px;
}
.product-delivery-table{
    display: grid;
    grid-template-columns: 2fr 1fr 1fr 1fr;
    margin-bottom: 20px;
}
.product-delivery-table .char-table-item{
    border-color: transparent;
    font-family: var(--font-family);
    font-weight: 400;
    font-size: 16px;
    line-height: 120%;
    color: var(--text-white);

}
.product-delivery-table .char-table-item:nth-child(-n+4){
    border-bottom: 1px solid var(--fill-dark-blue);
    font-weight: 700;
    font-size: 16px;
}
.product-delivery-table .char-table-item:nth-child(4n+1){
    text-align: left;
    padding-left: 0;
}
.product-delivery-title {
    font-family: var(--font-family);
    font-weight: 700;
    font-size: 22px;
    line-height: 100%;
    color: var(--text-white);
    margin-bottom: 5px;
}

.product-delivery-text {
    font-family: var(--second-family);
    font-weight: 700;
    font-size: 16px;
    line-height: 150%;
    color: var(--fill-violet);

    margin-bottom: 24px;
}

.product{
    background: #eaeaef;
    padding-bottom: 60px;
    padding-top: 40px;
    border-radius: 40px 40px 0 0;
}
.product-tabs{
    border-radius: 40px 40px 0 0;
    background: var(--bg-black);
    margin-top: -40px;
}
.product-header{
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 24px;
}
.product-header .breadcrumbs{
    padding: 0;
}
.product-header .breadcrumb:last-child{
    color: var(--text-dark);
}
.product-header .breadcrumb:not(:last-child):before {
    content: url(../images/icons/breadcrumb-icon_dark.svg);
}


.product-content{
    display: grid;
    grid-template-columns: 594fr 678fr;
    gap: 40px;
}
.product-gallery {
    display: grid;
    grid-template-columns: 80fr 504fr;
    column-gap: 10px;
    max-width: 100%;
    overflow: hidden;
    box-sizing: border-box;
}

.product-gallery-thumbnails {
    display: flex;
    flex-direction: column;
    height: auto;
    justify-content: flex-start;
    max-width: 80px;
    row-gap: 10px;
}
.product-gallery-thumbnails img{
    cursor: pointer;
    width: 100%;
    height: 100px;
    object-fit: cover;
}
.product-gallery-main-image {
    width: 100%;
    height: auto;
    overflow: hidden;
}
.product-gallery-main-image img{
    width: 100%;
    display: block;
    border-radius: 10px;
    object-fit: cover;
    height: 455px;
}
.product-title{
    font-family: var(--font4);
    font-weight: 700;
    font-size: 24px;
    line-height: 100%;
    color: var(--text-dark);
    margin-bottom: 15px;
}

.product-review {
    display: flex;
    align-items: center;
    justify-content: flex-start;
    column-gap: 8px;
    margin-bottom: 40px;
}

.product-review-count {
    font-family: var(--font-family);
    font-weight: 500;
    font-size: 18px;
    line-height: 150%;
    text-align: center;
    color: var(--text-dark);
}



.product-describe {
    margin-bottom: 40px;
}

.product-describe-title {
    font-family: var(--second-family);
    font-weight: 600;
    font-size: 18px;
    line-height: 100%;
    color: var(--text-dark);
    margin-bottom: 10px;
}

.product-describe-text {
    font-family: var(--second-family);
    font-weight: 400;
    font-size: 16px;
    line-height: 150%;
    color: var(--text-dark);
    margin-bottom: 10px;
}
.product-describe-link{
    display: block;
    font-family: var(--font-family);
    font-weight: 400;
    font-size: 16px;
    line-height: 150%;
    color: var(--text-dark);
    text-align: right;
    width: 100%;
}
.product-color {
    margin-bottom: 10px;
}
.product-color-text {
    font-family: var(--second-family);
    font-weight: 600;
    font-size: 18px;
    line-height: 100%;
    color: var(--text-dark);
    margin-bottom: 10px;
}

.product-color-tabs {
    display: flex;
    align-items: center;
    justify-content: flex-start;
    column-gap: 10px;
}
.product-color-tab{
    border: 3px solid transparent;
    border-radius: 10px;
    width: 80px;
    height: 80px;
}
.product-color-tab.active {
    border: 3px solid var(--fill-violet);
}

.product-price {
}
.product-available{
    font-family: var(--font-family);
    font-weight: 500;
    font-size: 16px;
    line-height: 150%;
    color: var(--text-gray);
}
.product-current-price {
    font-family: var(--font-family);
    font-weight: 500;
    font-size: 42px;
    line-height: 100%;
    color: var(--text-dark);
    text-align: right;
    margin-bottom: 5px;
}
.product-old-price span:first-child {
    font-family: var(--font-family);
    font-weight: 500;
    font-size: 18px;
    line-height: 100%;
    text-decoration: line-through;
    color: var(--text-gray);
    text-align: right;
}
.product-old-price-discount{
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 5px 5px 5px 0;
    width: 58px;
    height: 24px;
    background: var(--accent-red);
    margin-bottom: 5px;

    font-family: var(--font-family);
    font-weight: 600;
    font-size: 17px;
    line-height: 100%;
    letter-spacing: 0.01em;
    text-align: center;
    color: var(--text-white);
}
.product-wrapper{
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    margin-bottom: 24px;
}
.product-count{
    display: flex;
    align-items: center;
    justify-content: flex-start;
    column-gap: 10px;
    margin-bottom: 32px;
}
.product-old-price{
    text-align: right;
}
.product-count p{
    font-family: var(--font-family);
    font-weight: 500;
    font-size: 18px;
    line-height: 150%;
    color: var(--text-dark);
}
.basket-item-counter.product-counter input{
    font-family: var(--font-family);
    font-weight: 500;
    font-size: 18px;
    line-height: 150%;
    color: var(--text-dark);
}

.product-actions{
    display: flex;
    align-items: center;
    justify-content: flex-start;
    column-gap: 10px;
}
.product-action{
    display: flex;
    align-items: center;
    justify-content: center;
}
.open-quickBuy-popup{
    background: var(--fill-light);
    font-family: var(--font-family);
    font-weight: 500;
    font-size: 18px;
    line-height: 100%;
    letter-spacing: 0.01em;
    text-align: center;
    color: var(--text-dark);

    margin-top: 16px;
}
.open-quickBuy-popup:hover{
    background: var(--fill-light);
}
.product-buttons{
    display: grid;
    grid-template-columns: 1fr 1fr;
    margin-bottom: 20px;
    gap: 12px;
}
.product-buttons button{
    margin: 0;
}
.product-buttons button:nth-of-type(1):hover {
    background-color: #76798B;
    color: #AEAFB9;
}
.product-info-mini p{
    font-family: var(--second-family);
    font-weight: 400;
    font-size: 16px;
    line-height: 150%;
    color: var(--text-dark);
    text-align: left;
}
.product-info-mini p span{
    font-weight: 400;
}
.product-info-mini p:not(:last-child){
    margin-bottom: 5px;
}
.product-info-mini p a{
    font-family: var(--second-family);
    font-weight: 400;
    font-size: 16px;
    line-height: 150%;
    color: var(--text-dark);
    text-decoration: underline;
    text-decoration-skip-ink: none;
}

/* ------------------------------------------------------------
                      ORDER.HTML STYLES
--------------------------------------------------------------*/

.order{
    margin-bottom: 112px;
}
.order-title{
    margin-top: 40px;
    margin-bottom: 40px;

    font-family: var(--font4);
    font-weight: 700;
    font-size: 32px;
    line-height: 100%;
    text-transform: uppercase;
    color: var(--text-white);
}
.basket-total-button{
    margin-bottom: 36px;

}
.order-total-checkbox-label{
    margin-bottom: 10px;
}
.order-total{
    border-radius: 10px;
    padding: 20px;
    background: var(--bg-dark-blue);
}
.order-total-title{
    font-family: var(--second-family);
    font-weight: 700;
    font-size: 24px;
    line-height: 140%;
    color: var(--text-white);
    margin-bottom: 25px;
}
.order-total-items{
    margin-bottom: 36px;
}
.order-total-item {
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.order-total-item-title {
    font-family: var(--font-family);
    font-weight: 500;
    font-size: 16px;
    line-height: 100%;
    color: var(--text-white);
    margin-bottom: 5px;
}

.order-total-item-variant {
    font-family: var(--font-family);
    font-weight: 400;
    font-size: 16px;
    line-height: 100%;
    color: var(--text-white);
}

.order-total-item-price {
}
.order-total-item-price span:not(:last-child){
    margin-right: 8px;
    font-family: var(--font-family);
    font-weight: 500;
    font-size: 16px;
    line-height: 100%;
    color: var(--text-white);
}
.order-total-item-old-price {
    font-family: var(--font-family);
    font-weight: 500;
    font-size: 16px;
    line-height: 100%;
    text-decoration: line-through;
    color: var(--text-gray);
}
.order-total-item{
    padding-bottom: 5px;
    border-bottom: 1px solid var(--fill-dark-blue);
    margin-bottom: 10px;
}
.order-total-item:last-child{
    border-bottom: none;
    margin-top: 25px;
    margin-bottom: 0;
}
.order-total-item:last-child .order-total-item-price{
    font-family: var(--font-family);
    font-weight: 700;
    font-size: 22px;
    line-height: 100%;
    color: var(--text-white);
}
.order-form{
    width: 100%;
}
.order-form-map #map{
    width: 100%;
    aspect-ratio: 1312 / 543;
    margin-top: 20px;
}
.conditions-support-form-item span.order-form-title,
.order-form-title{
    font-family: var(--font-family);
    font-weight: 500;
    font-size: 22px;
    line-height: 100%;
    color: var(--text-white);
    margin-bottom: 20px;
}
.conditions-support-form-item.order-form-pickupPoint{
    margin-top: 60px;
    margin-bottom: 60px;
}

.deduct-bonuses{
    padding: 24px 0;
}
.deduct-bonuses-value{
    font-family: var(--font-family);
    font-weight: 600;
    font-size: 16px;
    line-height: 120%;
    color: var(--fill-violet);
    margin-left: auto;
    margin-right: 0;
    text-align: right;
}
.deduct-bonuses-value span{
    margin-right: 5px;
}
.deduct-bonuses-slider-text{
    font-family: var(--font-family);
    font-weight: 200;
    font-size: 16px;
    line-height: 100%;
    color: var(--text-gray);
    margin-bottom: 5px;
}
.deduct-bonuses-header {
    margin-bottom: 24px;
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.deduct-bonuses-balance-title {
    font-family: var(--font-family);
    font-weight: 700;
    font-size: 18px;
    line-height: 100%;
    color: var(--text-white);
}

.deduct-bonuses-balance {
    font-family: var(--font-family);
    font-weight: 600;
    font-size: 18px;
    line-height: 100%;
    color: var(--text-white);
}

.order-form-promocode{
    display: flex;
    align-items: flex-end;
    column-gap: 5px;
    justify-content: space-between;
    margin-bottom: 24px;
}
.order-form-promocode-button{
    background: var(--bg-dark-blue);
    font-family: var(--font-family);
    font-weight: 500;
    font-size: 18px;
    line-height: 100%;
    letter-spacing: 0.01em;
    text-align: center;
    color: var(--text-white);
    height: 44px;
    border-radius: 10px;
    padding: 0px 42px;
}

.order-form-promocode .conditions-support-form-item{
    margin: 0;
}
.payment{
    margin-top: 20px;
    margin-bottom: 20px;
}
.payment-options {
    display: flex;
    gap: 16px;
}
.payment-option,
.delivery-option {
    font-family: var(--font-family);
    font-weight: 400;
    font-size: 16px;
    line-height: 100%;
    color: var(--text-white);

    position: relative;
    padding: 12px 16px;
    border-radius: 10px;
    background: transparent;
    cursor: pointer;
    transition: 0.3s;
}

.payment-option.active,
.delivery-option.active {
    background: var(--bg-dark-gray);
    color: var(--fill-violet);
}

.payment-option input,
.delivery-option input {
    display: none;
}

.order-completed{
    margin: 40px auto 112px auto;
    width: 100%;
    max-width: 648px;
    text-align: center;
}
.order-completed-title {
    font-family: var(--font4);
    font-weight: 700;
    font-size: 32px;
    line-height: 120%;
    text-transform: uppercase;
    color: var(--text-white);

    margin-bottom: 15px;
    text-align: center;
}

.order-completed-text {
    font-family: var(--font-family);
    font-weight: 700;
    font-size: 22px;
    line-height: 110%;
    text-align: center;
    color: var(--text-gray);

    margin-bottom: 30px;
}

.order-completed-button {
    max-width: 352px;
    margin-bottom: 16px;
    margin-right: auto;
    margin-left: auto;
}
.order-completed-button:last-child {
    background: var(--bg-dark-blue);
}
.order-completed-button:last-child:hover{
    background: var(--bg-dark-blue);
}
.comparison-carousel-container{
    position: relative;
}
.comparison-content-title{
    font-family: var(--font4);
    font-weight: 700;
    font-size: 32px;
    line-height: 100%;
    text-align: left;
    color: var(--text-white);
    margin-bottom: 40px;
    margin-top: 40px;
}
.comparison-mobile {
    display: none;
}
.comparison-content{
    padding-top: 60px;
    padding-bottom: 40px;
}
.comparison-header{
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 80px;
}
.comparison-header-button{
    padding: 8px 13px;
    border-radius: 10px;
    background: var(--bg-dark-blue);
    font-family: var(--second-family);
    font-weight: 400;
    font-size: 16px;
    line-height: 150%;
    color: var(--text-white);
}

.comparison-tags {
    display: flex;
    justify-content: flex-start;
    column-gap: 10px;
}

.comparison-tag {
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    column-gap: 8px;

    background: var(--bg-dark-blue);
    font-family: var(--font-family);
    font-weight: 400;
    font-size: 16px;
    line-height: 100%;
    color: var(--text-gray);
    border-radius: 10px;
    padding: 8px 12px;
}

.comparison-tag.active {
    background: var(--bg-dark-gray);
    font-family: var(--font-family);
    font-weight: 400;
    font-size: 16px;
    line-height: 100%;
    color: var(--text-white);
}

.comparison-tag-delete{
    display: flex;
    align-items: center;
    justify-content: center;
    background: transparent;
}

.comparison{
    margin-top: 80px;
    border-radius: 10px;
    padding: 20px;
    background: var(--bg-dark-blue);
}
.comparison-title{
    font-family: var(--font-family);
    font-weight: 700;
    font-size: 22px;
    line-height: 100%;
    color: var(--text-white);
    margin-bottom: 40px;
}


.comparison-items {

}
.comparison-items .ui-accordion-header-icon{
    display: none;
}
.comparison-item-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 10px 0;
    border-bottom: 1px solid var(--fill-dark-blue);
    cursor: pointer;
}
.comparison-item-header:first-child {
    border-top: 1px solid var(--fill-dark-blue);
}
.comparison-item-header p{
    font-family: var(--font-family);
    font-weight: 700;
    font-size: 18px;
    line-height: 100%;
    color: var(--text-white);
}
.comparison-item-header.ui-accordion-header-active img{
    transform: rotate(180deg);
    transition: .3s;
}
.comparison-item {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    padding: 36px 0 15px 0;
    column-gap: 40px;
}

.comparison-item-column {
    font-family: var(--font-family);
    font-weight: 500;
    font-size: 16px;
    line-height: 100%;
    color: var(--text-white);
}

.comparison-item-column-title {
    margin-bottom: 16px;
}

.comparison-item-column-texts {
    display: grid;
    grid-template-rows: repeat(2, 1fr);
    row-gap: 16px;
}

.section-actionsMini{
    border-radius: 40px 40px 0 0;
    padding-top: 50px;
    padding-bottom: 50px;
    margin-top: -40px;
    position: relative;
    z-index: 10;
    background: var(--bg-black);
}


.actionsMini-item {
    border-radius: 10px;
    padding: 32px 16px 0px;
    position: relative;
    background: var(--bg-dark-gray);
}

.actionsMini-promo {
    position: absolute;
    z-index: 4;
    top: -22px;
    right: -12px;
    border-radius: 32px;
    padding: 8px;
    background: var(--fill-violet);
    font-family: var(--font-family);
    font-weight: 600;
    font-size: 22px;
    line-height: 140%;
    color: var(--text-white);
}

.actionsMini-carousel-container{
    position: relative;
    /*padding-left: calc((100% - 1440px) / 2 + 64px);*/
}
.actionsMini-carousel-next{
    position: absolute;
    z-index: 10;
    right: 64px;
    top: 50%;
    transform: translateY(-50%);
}
.actionsMini-item-title {
    font-family: var(--font-family);
    font-weight: 600;
    font-size: 22px;
    line-height: 120%;
    color: var(--text-white);
    width: calc(100% - 32px);
}

.actionsMini-item-img {
    width: 185px !important;
    height: 130px;
    margin-right: auto;
    margin-left: auto;
}
.actionsMini-carousel .owl-stage-outer{
    padding-top: 30px;
    padding-bottom: 30px;
}
.section-actionsBig{
    padding-top: 80px;
    padding-bottom: 80px;
}
.section-actionsBig-items {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 20px;
}

.section-actionsBig-item {
    border-radius: 10px;
    padding: 24px 54px;
    background: var(--bg-dark-gray);
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    align-items: center;
}
.section-actionsBig-item-promo {
    text-align: center;
    border: 1px solid var(--text-white);
    border-radius: 20px;
    padding: 6px 16px;
    background: transparent;
    max-width: 76px;
    margin-bottom: 10px;
}

.section-actionsBig-item-title {
    font-family: var(--font4);
    font-weight: 700;
    font-size: 34px;
    line-height: 100%;
    color: var(--text-white);
    margin-bottom: 8px;
}

.section-actionsBig-item-text {
    font-family: var(--font-family);
    font-weight: 400;
    font-size: 16px;
    line-height: 140%;
    color: var(--text-white);
    margin-bottom: 20px;
}
.section-actionsBig-item-image {
    text-align: right;
}
.section-actionsBig-item-image img{
    max-width: 185px;
    max-height: 187px;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.section-actionsBig-item-second{
    background: var(--fill-violet);
}
.section-actionsBig-item-second .section-actionsBig-item-title{
    font-family: var(--font-family);
    font-weight: 400;
    font-size: 22px;
    line-height: 140%;
    color: var(--text-white);

}
.section-actionsBig-item-second .button{
    background: var(--text-white);
    font-family: var(--font-family);
    font-weight: 500;
    font-size: 16px;
    line-height: 100%;
    letter-spacing: 0.01em;
    text-align: center;
    color: var(--fill-violet);
}

.actions-carousel{
    padding-top: 40px;
    padding-bottom: 80px;
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
}
.actions-carousel .container {
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.actions-carousel .breadcrumbs{
    padding: 0;
    margin-bottom: 80px;
}
.actions-carousel .breadcrumb:last-child{
    color: var(--text-dark);
}
.actions-carousel .breadcrumb:not(:last-child):before {
    content: url(../images/icons/breadcrumb-icon_dark.svg);
}
.actions-carousel .main-carousel-item-text{
    margin-bottom: 10px;
    max-width: 506px;
}
.actions-carousel-post-text{
    font-family: var(--font-family);
    font-weight: 400;
    font-size: 14px;
    line-height: 140%;
    color: var(--text-dark);
    margin-bottom: 40px;
}
.actions-carousel-action-block {
    border-radius: 10px;
    padding: 55px 30px 15px;
    background: var(--bg-black);
    position: relative;
    z-index: 3;
}

.actions-carousel-action-block-top {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 21px;
    column-gap: 32px;
}
.actions-carousel-action-block-days {
    font-family: var(--font3);
    font-weight: 700;
    font-size: 32px;
    line-height: 140%;
    color: var(--text-white);
}
.actions-carousel-action-block-days span:first-child{
    margin-right: 16px;
    position: relative;
}
.actions-carousel-action-block-days span:first-child:after{
    content: "";
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    right: -8px;
    width: 1px;
    height: 28px;
    background: var(--text-white);
}
.actions-carousel-action-block-days-text {
    font-family: var(--font-family);
    font-weight: 400;
    font-size: 22px;
    line-height: 140%;
    color: var(--text-white);
}

.actions-carousel-action-block-text {
    text-align: center;
    font-family: var(--font-family);
    font-weight: 400;
    font-size: 14px;
    line-height: 140%;
    color: var(--text-white);
}

.actions-carousel-action{
    text-align: center;
}
.actions-carousel-action > img{
    max-width: 320px;
    width: 100%;
    object-fit: cover;
    margin-bottom: -80px;
    position: relative;
    z-index: 2;
}

.section-actionsBig-more-button{
    max-width: 230px;
    margin: 80px auto 0 auto;
}

.login-form{
    max-width: 480px;
}
.login-form-change-link{
    text-align: right;
    margin-top: 5px;
    display: block;
    font-family: var(--font-family);
    font-weight: 400;
    font-size: 16px;
    line-height: 100%;
    color: var(--text-gray);
}

.login-form-bottom{
    margin-top: 25px;
    font-family: var(--second-family);
    font-weight: 400;
    font-size: 16px;
    line-height: 150%;
    text-align: center;
    color: var(--text-white);
}
.login-form-bottom a{
    font-family: var(--second-family);
    font-weight: 400;
    font-size: 16px;
    line-height: 150%;
    color: var(--fill-violet);
}

.recovery-steps {
    margin-top: 20px;
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.recovery-step {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    width: 32px;
    height: 32px;
    border: 1px solid var(--fill-gray);
    background: transparent;

    font-family: var(--font-family);
    font-weight: 500;
    font-size: 16px;
    line-height: 100%;
    color: var(--fill-gray);
}
.recovery-step:not(:last-child):after{
    content: "";
    position: absolute;
    left: 100%;
    top: 50%;
    transform: translateY(-50%);
    width: 192px;
    height: 2px;
    background: var(--fill-gray);
}
.recovery-step.fill{
    color: var(--text-white);
    background: var(--fill-violet);
    border: 1px solid var(--fill-violet);
}
.recovery-step.fill:after{
    background: var(--fill-violet);
}
.button-gray{
    background: var(--bg-dark-blue);
    margin-top: 10px;
}
.button-gray:hover{
    background: var(--bg-dark-blue);
}

.blog-recommendations{
    padding-bottom: 60px;
}

.blog-card{
    border-radius: 10px;
    padding: 15px;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: space-between;
    row-gap: 12px;
    background: var(--bg-dark-gray);
}
.blog-card-info{
    width: 100%;
}
.blog-card-bottom{
    width: 100%;
}
.blog-card-date{
    font-family: var(--font-family);
    font-weight: 400;
    font-size: 14px;
    line-height: 150%;
    color: var(--text-gray);
    margin-bottom: 8px;
}
.blog-card-title{
    font-family: var(--font-family);
    font-weight: 500;
    font-size: 16px;
    line-height: 150%;
    letter-spacing: 0.03em;
    color: var(--text-white);
    margin-bottom: 10px;
}


.catalog-blog-body{
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 32px 16px;
}

.blog-card-desc{
    font-family: var(--font-family);
    font-weight: 400;
    font-size: 14px;
    line-height: 150%;
    color: var(--text-white);
    margin-bottom: 10px;
}
.blog-card-image{
    height: 286px;
}
.blog-card-image img{
    height: 100%;
    width: 100%;
    object-fit: cover;
}
.blog-card-mini .blog-card-image{
    height: 212px;
}
.blog-card-mini .blog-card-image img{
    width: 100% !important;
}





.single-main{
    padding: 60px 0;
    background: var(--bg-dark-blue);
}
.single-main .breadcrumbs{
    margin-bottom: 30px;
}
.single-main-content {
    margin-right: auto;
    margin-left: auto;
    max-width: 604px;
    text-align: center;
}

.container {
}

.single-main-title {
    font-family: var(--font4);
    font-weight: 700;
    font-size: 64px;
    line-height: 100%;
    text-transform: uppercase;
    text-align: center;
    color: var(--text-white);
    margin-bottom: 30px;
}

.single-main-image {
    max-width: 331px;
    margin-right: auto;
    margin-left: auto;
    margin-bottom: 30px;
}
.single-main-image img{
    width: 100%;
    object-fit: cover;
    border-radius: 10px;
}
.single-main-subtitle {
    margin-right: auto;
    margin-left: auto;
    font-family: var(--font-family);
    font-weight: 400;
    font-size: 22px;
    line-height: 100%;
    text-align: center;
    color: var(--text-white);
    margin-bottom: 30px;
    max-width: 366px;
}

.single-main-desc {
    font-family: var(--font-family);
    font-weight: 400;
    font-size: 14px;
    line-height: 100%;
    text-align: center;
    color: var(--text-gray);

    display: flex;
    align-items: center;
    justify-content: space-between;
    max-width: 270px;
    margin-right: auto;
    margin-left: auto;
}

.single-socials {
    padding-top: 24px;
    padding-bottom: 40px;
    display: flex;
    align-items: center;
    justify-content: flex-end;
    column-gap: 7.5px;
}

.single-social {
    border-radius: 4px;
    background: var(--fill-violet);
    width: 36px;
    height: 36px;
    display: flex;
    align-items: center;
    justify-content: center;
}
.single-title{
    font-family: var(--font4);
    font-weight: 700;
    font-size: 48px;
    line-height: 120%;
    text-transform: uppercase;
    color: var(--text-white);
    padding: 24px 0;
}

.single-title-two{
    font-family: var(--font4);
    font-weight: 700;
    font-size: 32px;
    line-height: 130%;
    text-transform: uppercase;
    color: var(--text-white);
}
.conditions-images{
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 16px;
}
.section-conditions-list{
    padding-left: 20px;
    margin-bottom: 16px;
}
.section-conditions-list li{
    list-style: disc;
    font-family: var(--font-family);
    font-weight: 400;
    font-size: 16px;
    line-height: 150%;
    color: var(--text-white);
}
.about-content{
    padding-top: 40px;
}
.about-title{
    margin-bottom: 30px;
    font-size: 42px;
    line-height: 100%;
    text-transform: uppercase;
    text-align: center;
    color: var(--text-white);
}
.about-title span:last-child{
    font-family: var(--font4),sans-serif;
    font-weight: 400;
    display: block;
    text-align: center;
    margin-left: 240px;
}
.about-title span:first-child{
    font-family: var(--font4),sans-serif;
    font-weight: 400;
    display: block;
    text-align: center;
    margin-right: 240px;
}
.about-subtitle{
    max-width: 463px;
}
.about-advantages{
    margin-bottom: 120px;
}
.about-advantages-items{
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 10px;
}
.about-advantage{
    border-radius: 10px;
    padding: 40px 0px;
    background: var(--bg-dark-blue);
    text-align: center;
}
.about-advantage-title{
    font-family: var(--font4);
    font-weight: 700;
    font-size: 48px;
    line-height: 100%;
    color: var(--text-white);
    margin-bottom: 10px;

}
.about-advantage-text{
    font-family: var(--font-family);
    font-weight: 400;
    font-size: 16px;
    line-height: 100%;
    color: var(--text-white);
}
.about-mission {
    margin-bottom: 120px;
}

.about-mission-header {
    max-width: 527px;
    margin-left: auto;
    margin-right: auto;
    margin-bottom: 40px;
}

.about-mission-title {
    font-family: var(--font4);
    font-weight: 400;
    font-size: 42px;
    line-height: 100%;
    text-transform: uppercase;
    color: var(--text-white);
    margin-bottom: 20px;
    max-width: 506px;
}

.about-mission-text {
    font-family: var(--font-family);
    font-weight: 500;
    font-size: 18px;
    line-height: 100%;
    color: var(--text-white);
}

.about-mission-images {
    display: grid;
    grid-template-columns: 1fr 2fr 1fr;
    gap: 12px;
}
.about-mission-image {
    width: 100%;
    object-fit: cover;
}


.about-contacts-item-title{
    font-family: var(--font-family);
    font-weight: 700;
    font-size: 24px;
    line-height: 130%;
    text-align: center;
    color: var(--text-white);
    margin-bottom: 24px;
}
.about-contacts{
    margin-bottom: 40px;
}
.about-contacts-items {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 48px;
}

.about-contacts-item {
    text-align: center;
    padding: 20px;
    background: var(--bg-dark-blue);
    border-radius: 10px;
}
.about-table{
    margin-bottom: 120px;
}
.about-table-items {
    display: grid;
    grid-template-columns: 1fr 1fr 2fr;
}

.about-table-item {
    padding: 15px 10px;
    border-top: 1px solid var(--fill-dark-blue);
}
.about-table-item:nth-child(3n + 1) {
    font-family: var(--second-family);
    font-weight: 600;
    font-size: 20px;
    line-height: 100%;
    text-transform: uppercase;
    color: #878686;
}
.about-table-item:nth-child(3n + 2) {
    font-family: var(--second-family);
    font-weight: 600;
    font-size: 20px;
    line-height: 100%;
    text-transform: uppercase;
    color: var(--text-white);
}
.about-table-item:nth-child(3n + 3) {
    font-family: var(--second-family);
    font-weight: 400;
    font-size: 16px;
    line-height: 100%;
    color: var(--text-white);
}
.about-table-title{
    font-family: var(--font4);
    font-weight: 700;
    font-size: 24px;
    line-height: 100%;
    letter-spacing: 0.01em;
    text-transform: uppercase;
    color: var(--text-white);
    margin-bottom: 25px;
}

.site-map {
    padding: 32px 0 64px 0;
}
.site-map-items{
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 64px;
}
.site-map-item  h2{
    font-family: var(--font4);
    font-weight: 700;
    font-size: 24px;
    line-height: 100%;
    text-transform: uppercase;
    color: var(--text-white);
    margin-bottom: 32px;
}
.site-map-item  ul{

}
.site-map-item  ul li:not(:last-child){
    margin-bottom: 16px;
}
.site-map-item  ul li a{
    font-family: var(--font-family);
    font-weight: 400;
    font-size: 22px;
    line-height: 100%;
    color: var(--text-white);
}

.payment-text{
    margin-top: -10px;
    margin-bottom: 20px;
    font-family: var(--font-family);
    font-weight: 200;
    font-size: 16px;
    line-height: 100%;
    color: var(--text-gray);
}

.comparison-table {
    display: grid;
    grid-template-columns: repeat(5, 1fr);
}

.comparison-table-item {
    font-family: var(--font-family);
    font-weight: 400;
    font-size: 12px;
    line-height: 150%;
    text-align: center;
    color: var(--text-white);

    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    row-gap: 10px;
    padding: 19px;
    border-bottom: 1px solid var(--fill-dark-blue);
}

.comparison-table-item:nth-child(5n+1){
    font-weight: 700;
}
.actions-carousel-item-title{
    font-family: var(--font4);
    font-weight: 700;
    font-size: 56px;
    line-height: 100%;
    text-transform: uppercase;
    color: var(--color-neutral-darkest);
    margin-bottom: 10px;
}
.product-desc-title{
    font-family: var(--font4);
    font-weight: 700;
    font-size: 18px;
    line-height: 100%;
    text-transform: uppercase;
    color: var(--text-white);
    padding: 15px 0;
}
.product-desc-text{
    font-family: var(--second-family);
    font-weight: 400;
    font-size: 16px;
    line-height: 150%;
    color: var(--text-white);
    padding-bottom: 16px;
}

.product-presentation-container{
    max-width: 896px;
}
.product-presentation-container h2{
    font-family: var(--font4);
    font-weight: 700;
    font-size: 18px;
    line-height: 100%;
    text-transform: uppercase;
    color: var(--text-white);

    border-bottom: 1px solid var(--bg-dark-blue);
    padding: 10px;
}
.product-presentation-container h2:first-child{
    margin-bottom: 40px;
}
.product-presentation-container p{
    font-family: var(--font-family);
    font-weight: 400;
    font-size: 16px;
    line-height: 150%;
    color: var(--text-white);
    padding-bottom: 16px;
}

.conditions-image span{
    font-family: var(--font-family);
    font-weight: 400;
    font-size: 14px;
    line-height: 150%;
    color: var(--text-white);
    margin-top: 16px;
    display: block;
}
.order-labels{
    display: flex;
    flex-wrap: wrap;
    gap: 16px;
    margin-bottom: 20px;
}

.order-labels .conditions-support-form-item{
    width: calc(33% - 7px);
}
.order-labels .conditions-support-form-item:nth-child(4),
.order-labels .conditions-support-form-item:nth-child(5){
    width: calc(50% - 8px);
}



.order-selfDelivery-map{
    margin-top: 20px;
    margin-bottom: 20px;
}
.order-selfDelivery-map #map {
    width: 100%;
    aspect-ratio: 813 / 335;
}
.order-button{
    max-width: 170px;
}


/*.order-selfDelivery .condition-request-form-select-selected{*/
/*    max-width: 302px;*/
/*}*/

.conditions-support-form-item.required > span{
    position: relative;
}
.conditions-support-form-item.required > span:after{
    content: "*";
    color: var(--accent-red);
}


.conditions-support-form-item {
    margin-bottom: 20px;
}

.product-gallery-dots {
    display: none;
}

.section-actionsMini-mobile {
    display: none;
}

.mobile-block {
    display: none;
}

.mobile-button {
    display: none;
}

.header-bottom-mobile {
    display: none;
}



.catalog-empty {
    display: flex;
    align-items: center;
    width: 100%;
    justify-content: center;
    grid-column: span 3;
    padding: 80px 0;
}

.catalog-empty img {
    width: 14px;
    height: 14px;
    margin-right: 8px;
}

.catalog-empty span {
    display: block;
    width: 100%;
    text-align: center;
    margin-top: 10px;
}

.catalog-empty span a {
    color: #808ad8;
    text-decoration: underline;
}

.favourites-items-empty .catalog-empty {
    align-items: flex-start;
}

.deduct-bonuses-mobile {
    display: none;
}

.form-promo-mobile {
    display: none;
}

.status-promo.error {
    color: red;
}

.status-promo.success {
    color: green;
}

.promo-status-wrapper {
    margin-bottom: 12px;
}

.promo-status-wrapper-mobile {
    display: none;
}

.product-card {
    position: relative;
}

.product-card-image {
    position: relative;
}

.product-badges {
    position: absolute;
    top: 12px;
    left: 12px;
    display: flex;
    flex-direction: column;
    gap: 8px;
    z-index: 2;
}

.product-badge {
    font-size: 12px;
    font-weight: 600;
    line-height: 1;
    padding: 4px 8px;
    border-radius: 5px;
    border-top-left-radius: 0;
    color: white;
    text-transform: uppercase;
    white-space: nowrap;
    width: max-content;

}

.product-badge-discount {
    background-color: #ff3b30;
}

.product-badge-new {
    background-color: #A7BA5A;
    color: #1D1D1F;
}

div#city-popup>div {
    max-width: 300px!important;
}

.about-main {
    padding: 60px 0;
    background: linear-gradient(210.84deg, #393D55 0%, #1A1B23 100%);
}

.about-main .about-main-wrapper {
    padding: 0 55px;
}

.about-main .about-main-wrapper:nth-of-type(2) {
    margin-top: 116px;
}

.about-main .about-main-wrapper .about-main-content {
    display: flex;
    width: 100%;
}

.about-main .about-main-wrapper .about-main-content .about-main-info {
    width: 33%;
    padding-right: 37px;
}

.about-main .about-main-wrapper .about-main-content .about-main-info h1 {
    font-family: "AGAvalancheC";
    font-weight: 400;
    font-size: 30px;
    line-height: 47px;
    letter-spacing: 0;
    margin-bottom: 60px;
}

.about-main .about-main-wrapper .about-main-content .about-main-info .description {
    width: 100%;
}

.about-main .about-main-wrapper .about-main-content .about-main-info .description p {
    font-family: "Onest";
    font-weight: 400;
    font-size: 14px;
    line-height: 22px;
    letter-spacing: 0;
    color: #FFFFFF;
    margin-bottom: 20px;
    width: 100%;
}

.about-main .about-main-wrapper .about-main-content .about-main-info .description p:nth-of-type(1) {
    max-width: 260px;
}

.about-main .about-main-wrapper .about-main-content .about-main-info .description p:nth-of-type(3) {
    max-width: 310px;
}

.about-main .about-main-wrapper .about-main-content .about-main-info .description p:last-child {
    margin-bottom: 0;
}

.about-main .about-main-wrapper .about-main-content .about-main-info .description p strong {
    font-weight: 700;
}

.about-main .about-main-wrapper .about-main-content .about-main-dates {
    width: 27%;
    padding-left: 40px;
}

.about-main .about-main-wrapper .about-main-content .about-main-dates .about-date-item {
    width: 100%;
}

.about-main .about-main-wrapper .about-main-content .about-main-dates .about-date-item:nth-of-type(1) .about-date-subtitle {
    max-width: 190px;
}

.about-main .about-main-wrapper .about-main-content .about-main-dates .about-date-item:nth-of-type(2) .about-date-subtitle {
    max-width: 210px;
}

.about-main .about-main-wrapper .about-main-content .about-main-dates .about-date-item .about-date-title {
    font-family: "Onest";
    font-weight: 700;
    font-size: 60px;
    line-height: 93px;
    letter-spacing: 0;
    color: #868DC4;
}

.about-main .about-main-wrapper .about-main-content .about-main-dates .about-date-item .about-date-subtitle {
    font-family: "AGAvalancheC";
    font-weight: 400;
    font-size: 20px;
    line-height: 24px;
    letter-spacing: 0;
    text-transform: uppercase;
    color: #FFFFFF;
}

.about-main .about-main-wrapper .about-main-content .about-main-map {
    width: 40%;
}

.about-main .about-main-wrapper .about-main-content .about-main-map img {
    width: 100%;
    height: 287px;
    object-fit: contain;
}

.about-main .about-main-wrapper .about-main-years {
    display: flex;
    align-items: center;
    padding: 0 38px;
    justify-content: space-between;
    position: relative;
}

.about-main .about-main-wrapper .about-main-years:after {
    content: "";
    display: block;
    height: 2px;
    width: 100%;
    background-color: #868DC4;
    position: absolute;
    left: 0;
}

.about-main .about-main-wrapper .about-main-years .about-year-item {
    width: 80px;
    min-width: 80px;
    height: 80px;
    display: flex;
    align-items: center;
    justify-content: center;
    background-color: #868DC4;
    border-radius: 50%;
    font-family: "Onest";
    font-weight: 400;
    font-size: 14px;
    line-height: 22px;
    letter-spacing: 0;
    position: relative;
    z-index: 1;
    cursor: pointer;
}

.modal-dialog {
    position: fixed;
    right: 0;
    top: 0;
    z-index: 99999;
    opacity: 0;
    width: 100%;
    height: 100%;
    overflow-y: auto;
    justify-content: center;
    align-items: center;
    visibility: hidden;
    transition: opacity .5s ease-in-out;
    display: flex;
    background: #363434E5;
}

.modal-dialog .modal-body {
    width: 100%;
    max-width: 560px;
    margin: auto;
    position: relative;
    background-color: #2A2D34;
    padding: 64px 60px;
    border-radius: 10px;
}

.modal-dialog.modal-closing {
    opacity: 0;
    transition: 0.5s;
}

.modal-dialog.modal-opening {
    opacity: 1;
    display: flex;
    animation: fadeIn .5s ease;
    visibility: visible;
    pointer-events: initial;
}

.modal-dialog .modal-content {
    width: 100%;
}

.modal-dialog .modal-open {
    overflow: hidden;
    pointer-events: none;
}

.modal-dialog .modal-close {
    position: absolute;
    right: 10px;
    top: 10px;
    border: none;
    cursor: pointer;
    background-image: url(/wp-content/themes/juris/images/icons/close-modal-ico.svg);
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;
    background-color: transparent;
    width: 24px;
    height: 24px;
    padding: 0;
}

@keyframes fadeIn {
    0% {
        opacity: 0;
    }
    0.1% {
        opacity: 0;
    }
    100% {
        opacity: 1;
    }
}

body.modal-open {
    overflow: hidden;
}

.modal-year-info .modal-logo {
    width: 100%;
    margin-bottom: 32px;
    display: flex;
    justify-content: center;
}

.modal-year-info .modal-logo img {
    max-width: 251px;
    width: 100%;
    object-fit: contain;
}

.modal-year-info .modal-description {
    width: 100%;
}

.modal-year-info .modal-description p {
    font-family: "Onest";
    font-weight: 400;
    font-size: 16px;
    line-height: 140%;
    color: #ffffff;
}