/*
Theme Name: Turandot Jewelry Theme
Description: Ювелирный магазин Turandot
Version: 1.0
Text Domain: turandot-jewelry
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
*/

@font-face {
    font-family: 'Open Sans';
    src: url('assets/fonts/OpenSans.ttf') format('truetype');
    font-weight: 400;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Open Sans';
    src: url('assets/fonts/opensans-medium.ttf') format('truetype');
    font-weight: 500;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'FoglihtenNo06';
    src: url('assets/fonts/FoglihtenNo06_076.otf') format('opentype');
    font-weight: 500;
    font-style: normal;
    font-display: swap;
}

.mobile {display: none!important;}

body {margin: 0; padding: 0; color: #333333; font-size: 18px; font-family: 'Open Sans', Arial, sans-serif;}
body a {color: #333333; text-decoration: none;}
h1, h2 {font-family: 'FoglihtenNo06', Arial, sans-serif; font-size: 50px; text-transform: uppercase; font-weight: 500;}
h3 {font-family: 'FoglihtenNo06', Arial, sans-serif; font-size: 36px; text-transform: uppercase; font-weight: 500;}
h4 {font-family: 'FoglihtenNo06', Arial, sans-serif; font-size: 24px; text-transform: uppercase; font-weight: 500;}
p {line-height: 145%;}
section {margin-top: 100px; margin-bottom: 100px;}
* {outline: none;}
img {max-width: 100%;}

.page-content h1 {font-size: 70px; margin: 0; margin-bottom: 40px;}

blockquote {
    margin: 30px auto;
    position: relative;
    max-width: 900px;
    padding: 15px 45px;
    border: 1px solid rgba(140, 140, 140, 0.2);
    text-align: center;
}

blockquote::before {
    content: "";
    position: absolute;
    width: 60px;
    height: 50px;
    top: 12px;
    left: 12px;
    background-image: url('assets/images/quote.svg');
    background-size: contain;
}


blockquote p {
    font-style: italic;
}

blockquote cite {
    display: block;
    font-weight: 700;
    font-style: normal;
}

@media (max-width: 768px) {
    blockquote.quote-card {
        margin: 1.5rem 1rem;
        padding: 2rem 1.5rem 1.5rem;
    }
    blockquote.quote-card::before {
        font-size: 4rem;
        left: 0.75rem;
        top: 0;
    }
    blockquote.quote-card p {
        font-size: 1rem;
    }
}

.post-navigation {
    margin: 60px 0;
    padding: 30px 0 40px;
    border-top: 1px solid #8C8C8C;
    border-bottom: 1px solid #8C8C8C;
}

.post-navigation__container {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: 40px;
}

.post-navigation__link {
    flex: 1;
    max-width: 50%;
    text-decoration: none;
    color: inherit;
    transition: all 0.3s ease;
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.post-navigation__link:hover {

}

.post-navigation__link--prev {
    text-align: left;
}

.post-navigation__link--next {
    text-align: right;
}

.post-navigation__text {
    color: #8C8C8C;
    display: block;
    font-size: 12px;
}

.post-navigation__link:hover .post-navigation__text {

}

.post-navigation__title {
    display: block;
    transition: color 0.3s ease;
    word-wrap: break-word;
}

.post-navigation__link:hover .post-navigation__title {

}

.post-navigation__empty {
    flex: 1;
    max-width: 50%;
}


@media (max-width: 768px) {
    .post-navigation__container {
        gap: 30px;
    }

    .post-navigation__link,
    .post-navigation__empty {
        max-width: 100%;
        width: 100%;
    }

    .post-navigation__link--prev,
    .post-navigation__link--next {
        text-align: left;
    }

    .post-navigation__title {
        font-size: 15px;
    }
}

@media (max-width: 480px) {
    .post-navigation {
        margin: 40px 0;
        padding: 30px 0;
    }

    .post-navigation__text {
        font-size: 12px;
    }

    .post-navigation__title {
        font-size: 14px;
    }
}

.container {max-width: 1340px; width: 100%; margin: 0 auto;}
.full-width {width: 100%;}
.half-width {max-width: 660px;}
.medium-width {max-width: 900px;}
.large-width {max-width: 1110px;}
.text-center {text-align: center;}
.justify-center {justify-content: center;}
.flex-column {display: flex; flex-direction: column;}

.bg-white {background-color: #fff;}
.bg-gray {background-color: #FBFBFB;}

.flex {display: flex;}
.flex-1 {flex: 1;}
.mt-40 {margin-top: 40px;}
.mt-100 {margin-top: 100px;}
.no-margin {margin: 0;}
.no-padding {padding: 0;}
.no-border {border: 0px!important;}

.btn {display: inline-flex; cursor: pointer; padding: 20px 60px; font-size: 16px; border: 1px solid #333333; text-transform: uppercase; transition: 0.3s ease all;}
.btn:hover {background-color: #333333; color: #FFFFFF;}
.btn-gray {background-color: #333333; color: #FFFFFF;}
.btn-gray:hover {background-color: #FFFFFF; color: #333333;}
.btn-white {border-color: #FFFFFF; color: #FFFFFF;}
.btn-white:hover {background-color: #FFFFFF; color: #333333;}

header, .menu-mobile__header {width: 100%; display: flex; height: 60px; border-bottom: 1px solid #333333; z-index: 1;}
.header__left {display: flex; width: 130px; height: 100%; align-items: center;}
.header__logo {font-family: 'FoglihtenNo06', Arial, sans-serif; font-size: 17px;}
.header__center {display: flex; align-items: center; justify-content: center; border: 1px solid #333333; border-top: 0; border-bottom: 0; flex: 1;}
.header__center ul.primary-menu {list-style: none; display: flex; gap: 110px; margin: 0; padding: 0;}
.header__center ul.primary-menu li {display: inline-flex; text-transform: uppercase; font-size: 14px;}
.home header {position: absolute; top: 0; left: 0; border-color: #FFFFFF; color: #FFFFFF;}
.home.admin-bar header {top: 32px;}
.home header a {color: #FFFFFF;}
.home .header__center {border-color: #FFFFFF;}

.header__right {display: flex; position: relative;}
.header__icons {float: right; display: flex; align-items: center; margin-left: 50px; gap: 30px;}
.header__icons a {width: 20px; height: 20px; background-size: cover;}
.header__icons a.search-icon {background-image: url('assets/images/search-icon.svg');}
.header__icons a.basket-icon, .header__basket a.basket-icon {background-image: url('assets/images/like.svg'); position: relative;}
.header__basket {flex: 1;}
.header__basket a.basket-icon {display: block; height: 40px; width: 40px; background-size: cover; float: right; margin-right: 20px;}
.header__icons a.phone-icon {background-image: url('assets/images/phone-icon.svg');}
.home .header__icons a, .home .header__basket a.basket-icon {filter: brightness(0) invert(1);}
.header__icons a.basket-icon span, .header__basket a.basket-icon span {
    font-size: 10px;
    border-radius: 50%;
    background-color: #fff;
    width: 15px;
    height: 15px;
    border: 1px solid #333333;
    justify-content: center;
    bottom: -7px;
    right: -7px;
    position: absolute;
}

.main-screen {position: relative;}
.main-screen::before {content: ''; position: absolute; top: 0; left: 0; width: 100%; height: 100%; background-color: rgba(0, 0, 0, 0.4);}

.main-collection {width: 100%; gap: 20px; display: flex;}
.collection-slider, .collection-block {flex: 1 1 calc(50% - 10px);
    align-items: center;
    display: flex;
    flex-direction: column;
    justify-content: center;
    height: auto;
}

.catalog-nav {position: absolute; z-index: 999; top: 75px; left: 0; width: 100%; padding: 15px 0; opacity: 0; visibility: hidden; transition: opacity 0.3s ease, visibility 0.3s ease;}
.catalog-nav.is-visible {
    opacity: 1;
    visibility: visible;
}
.admin-bar .catalog-nav {top: 107px;}
.catalog-nav .container {display: flex; gap: 50px;}
.catalog-nav__links {width: 50%; justify-content: space-between;}
.catalog-nav__label {margin-top: 10px; font-size: 16px; font-weight: 500;}
.catalog-nav ul {list-style: none; margin: 0; padding: 0; margin-top: 15px;}
.catalog-nav ul li {font-size: 14px; line-height: 30px;}
.catalog-nav__preview {display: flex; width: 50%; background-size: cover; height: auto; min-height: 250px; background-position: center; position: relative;}
.catalog-nav__preview::after {
    content: '';
    position: absolute;
    inset: 0; 
    background-image: var(--hover-image, none);
    background-size: cover;
    background-position: center;
    opacity: var(--hover-opacity, 0);
    transition: opacity 0.4s ease-in-out;
    pointer-events: none;
}

.search-container {position: absolute; z-index: 999; top: 75px; right: 85px; width: 360px; opacity: 0; visibility: hidden; transition: opacity 0.3s ease, visibility 0.3s ease;}
.search-container.is-active {
    opacity: 1;
    visibility: visible;
    transform: translateY(0);
}
.search-form {position: relative; border: 1px solid #333333;}
.search-form input {width: 100%; height: 50px; font-size: 16px; border: 0; text-indent: 15px; padding-right: 50px; box-sizing: border-box;}
.search-form__icon {position: absolute; width: 20px; height: 20px; background: url('assets/images/search-icon.svg'); background-size: cover; top: 15px; right: 15px; border: 0;}
.search-form__icon.cancel {background: url('assets/images/search-close.svg'); cursor: pointer;}
.search-container .search-results {display: none; margin-top: 10px; background-color: #ffffff; border: 1px solid #333333; padding: 15px;}
.search-result-item {
    display: flex;
    align-items: center;
    padding: 12px 16px;
    border-bottom: 1px solid #333333;
    text-decoration: none;
    font-size: 16px;
    color: #333333!important;
}

.search-result-item:last-child {
    border-bottom: none;
}


.search-result-item__image {
    width: 80px;
    height: 80px;
    margin-right: 15px;
    flex-shrink: 0;
}

.search-result-item__image img {
    width: 100%;
    height: 100%;
    object-fit: contain;
}

.search-result-item__info {
    flex: 1;
}

.search-result-item__name {
    font-weight: 500;
    margin-bottom: 10px;
    text-transform: uppercase;
    font-family: 'FoglihtenNo06', Arial, sans-serif;
}

.search-result-item__price {
    font-weight: 600;
}

.search-no-results,
.search-loading,
.search-error {
    padding: 15px;
    font-weight: 500;
}

.search-btn {width: 100%; height: 60px; align-items: center; justify-content: center; padding: 0; margin-top: 25px; color: #333333;}
.search-results-count {font-size: 16px; font-family: 'Open Sans', Arial, sans-serif;}


.breadcrumbs__list {list-style: none; margin: 0; padding: 0; display: block; margin-top: 35px; margin-bottom: 40px;;}
.breadcrumbs__item {display: inline-block; font-size: 14px;}
.breadcrumbs__item a {color: #8C8C8C;}
.breadcrumbs__sep {display: inline-block; margin: 0 10px; color: #8C8C8C;}

.main-text-block {gap: 20px;}
.main-text-block .flex {flex: 1;}
.main-text-block h3 {margin-bottom: 40px;}


.latest-news {width: 100%; gap: 20px; display: flex; flex-wrap: wrap;}
.latest-news .news-item {flex: 1 1 calc(50% - 10px); min-width: 0;}
.latest-news .news-item__img img {width: 100%; height: 320px; object-fit: cover; object-position: center;}
.latest-news .news-item__title {margin-top: 20px; font-size: 24px; line-height: 33px; display: inline-block;}
.latest-news .news-item__excerpt p {display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; height: calc(1.5em * 2)}

.grid {display: flex; flex-wrap: wrap; width: 100%;}
.grid__item {display: flex; width: 50%; aspect-ratio: 1 / 1; overflow: hidden; position: relative; flex-direction: column; justify-content: center; box-sizing: border-box;}

.news__thumbnail img {width: 100%; object-fit: cover; max-height: 500px;}

section.contact-form {margin-bottom: -110px;}
.contact-form {padding: 50px 0;}
.contact-form__head {font-family: 'FoglihtenNo06', Arial, sans-serif; font-size: 36px; margin-bottom: 40px;}
        .form-row {
            display: flex;
            gap: 30px;
            margin-bottom: 30px;
        }

        .form-group {
            flex: 1;
            position: relative;
        }

        .form-group.full-width {
            width: 100%;
        }

        .form-group label {
            display: block;
            font-size: 16px;
            color: #666;
            margin-bottom: 8px;
            font-weight: 400;
        }

        .form-group input[type="text"],
        .form-group input[type="tel"],
        .form-group textarea {
            width: 100%;
            padding: 12px 0;
            font-size: 16px;
            border: none;
            border-bottom: 1px solid #333;
            background: transparent;
            outline: none;
            color: #666;
        }

        .checkbox-group {
            display: flex;
            align-items: center;
            gap: 10px;
            margin-top: 30px;
        }

        .text-center .checkbox-group {justify-content: center;}

        .checkbox-group input[type="checkbox"] {
            width: 18px;
            height: 18px;
            margin-top: 2px;
            cursor: pointer;
            accent-color: #333;
        }

        .checkbox-group label {
            font-size: 12px;
            color: #666;
            cursor: pointer;
            line-height: 1.4;
        }

        .checkbox-group label a {
            color: #666;
            text-decoration: underline;
        }

        .checkbox-group label a:hover {
            color: #333;
        }

        @media (max-width: 768px) {
            .form-row {
                flex-direction: column;
                gap: 20px;
            }
        }

.contact-form .btn {padding: 20px 120px; margin-top: 30px;}


footer {border-top: 1px solid #333333; border-bottom: 1px solid #333333; margin-top: 110px; font-size: 14px; background: #333; color: #FFFFFF;}
footer a {font-size: 14px; color: #FFFFFF;}
.footer__left {width: 220px; padding: 25px 0 20px; flex-direction: column;}
.footer__left a {font-size: 12px; display: inline-block;}
.footer__col span {font-size: 12px; display: block;}
.footer__col {display: flex; flex-direction: column; border-left: 1px solid #333333; flex: 1; padding: 15px 5px 20px; text-align: center; gap: 10px;}
.footer__col p {margin: 0; white-space: nowrap;}
a.footer__logo {font-family: 'FoglihtenNo06', Arial, sans-serif; font-size: 24px; font-weight: 500; margin-bottom: 20px;}
ul.footer-menu {display: flex; flex-direction: column; gap: 10px; list-style: none; margin: 0; padding: 0;}

/* Catalog */
h1.woocommerce-products-header__title {margin-bottom: 40px;}
.products-count {font-size: 16px; text-transform: uppercase; float: left;}
.products-order {
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: 16px;
	float: right;
}

.sort-label {
    color: #8C8C8C;
    text-transform: uppercase;
    user-select: none;
}

.sort-select-container {
    position: relative;
    display: inline-flex;
    align-items: center;
    gap: 6px;
    cursor: pointer;
    padding: 4px 0;
    color: #333;
    transition: color 0.2s;
}

.sort-select-container:hover {
    color: #000;
}

.sort-select-value {
    text-transform: lowercase;
    font-weight: 500;
}

.sort-select-arrow {
    font-size: 10px;
    transition: transform 0.3s ease;
    color: #999;
}

.sort-select-container.active .sort-select-arrow {
    transform: rotate(180deg);
}

.sort-select-dropdown {
    position: absolute;
    top: 100%;
    right: 0;
    background: #fff;
    border: 1px solid #333333;
    min-width: 220px;
    z-index: 999;
    display: none;
    margin-top: 8px;
}

.sort-select-dropdown.active {
    display: block;
}

.sort-select-option {
    padding: 10px 16px;
    cursor: pointer;
    transition: background 0.2s;
    display: flex;
    justify-content: space-between;
    align-items: center;
    font-size: 14px;
    color: #333;
    text-transform: lowercase;
}

.sort-select-option:hover {
    background: #f5f5f5;
}

.sort-select-option.active {
    font-weight: 600;
    background: #fafafa;
}

.sort-select-option.active::after {
    content: '';
    background-image: url('assets/images/sort-active.svg');
    width: 16px;
    height: 16px;
}

.sort-select-option[data-value="rating"] {display: none;}

.products-order form.woocommerce-ordering {
    position: absolute;
    opacity: 0;
    pointer-events: none;
    width: 1px;
    height: 1px;
    overflow: hidden;
}

.product-item__link {font-family: 'FoglihtenNo06', Arial, sans-serif; display: block; text-align: center;}
.product-item__descr {font-size: 14px; text-align: center;}
.catalog-top {min-height: 20px; position: relative;}
.woocommerce ul.products {margin-top: 40px;}
.woocommerce ul.products li.product .price {font-weight: 600; font-size: 16px; color: #333333; display: block; text-align: center;}
.woocommerce ul.products li.product .wc-forward {display: none;}
.woocommerce ul.products li.product .button.add_to_cart_button {font-size: 0; position: absolute; width: 40px; height: 40px; top: 8px; right: 8px; /*border: 1px solid #333333; border-radius: 0;*/ background-color: transparent; background-image: url(assets/images/like.svg); background-size: 24px; background-repeat: no-repeat; background-position: center;}
.woocommerce ul.products li.product .button.add_to_cart_button:hover, .woocommerce ul.products li.product .button.add_to_cart_button.added, .woocommerce ul.products li.product .button.add_to_cart_button.in-cart {background-image: url(assets/images/like_active.svg);}

/* Product */
h1.product_title {font-size: 32px;}
.product-brand {margin-bottom: 10px;}
.product-brand__link {font-size: 16px; text-decoration: underline;}
.single-product div.product p.price {color: #333333; font-size: 24px;}
.product-buttons {display: flex; gap: 20px;}
.product-buttons .btn {display: inline-block; width: 50%; text-align: center; padding: 0; height: 60px; line-height: 60px;}
.js-custom-cart {display: none !important;}

.product-spoilers-block {
    margin-top: 20px;
    margin-bottom: 30px;
}

.spoiler-item {
    border-bottom: 1px solid #8C8C8C;
}

.spoiler-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 18px 0;
    cursor: pointer;
    user-select: none;
    transition: opacity 0.2s ease;
}

.spoiler-header:hover {
    opacity: 0.7;
}

.spoiler-title {
    font-size: 16px;
    font-weight: 400;
}

.spoiler-icon {
    width: 8px;
    height: 9px;
    position: relative;
    transition: transform 0.3s ease;
    background-image: url('assets/images/arrow-down.svg');
}

.spoiler-item.active .spoiler-icon {
    transform: rotate(180deg);
}

.spoiler-content {
    max-height: 0;
    overflow: hidden;
    transition: max-height 0.3s ease;
}

.spoiler-item.active .spoiler-content {
    max-height: 1000px;
}

.spoiler-content-inner {
    padding: 0 0 20px 0;
    font-size: 15px;
    line-height: 1.6;
    color: #555;
}

.spoiler-content-inner p {
    margin-bottom: 10px;
}

.spoiler-content-inner p:last-child {
    margin-bottom: 0;
}

.product-props {
    display: flex;
    flex-direction: column;
    font-size: 14px;
}

.prop-row {
    display: flex;
    align-items: baseline;
    margin-bottom: 14px;
}

.prop-label {
    font-weight: 600;
    color: #666;
    white-space: nowrap;
    flex-shrink: 0;
}

.prop-filler {
    flex-grow: 1; /* Занимает всё свободное пространство */
    border-bottom: 1px dotted #d1d1d1; /* Сам пунктир */
    margin: 0 12px; /* Отступы от текста до пунктира */
    position: relative;
    top: -4px; /* Легкая корректировка, чтобы пунктир был ровно по центру текста */
}

.prop-value {
    color: #333;
    text-align: right;
    flex-shrink: 0; /* Не даем значению сжиматься, если оно короткое */
    max-width: 60%; /* Ограничиваем ширину, чтобы длинные значения переносились */
}

@media (max-width: 768px) {
    .prop-row {
        flex-direction: column;
        align-items: flex-start;
        gap: 4px;
        margin-bottom: 16px;
    }
    
    .prop-filler {
        display: none;
    }
    
    .prop-label {
        font-size: 13px;
        color: #888;
        font-weight: 400;
    }
    
    .prop-value {
        font-size: 15px;
        text-align: left;
        max-width: 100%;
    }
}


.product-stones {
    font-size: 14px;
    color: #666;
}

.stones-row {
    display: flex;
    align-items: baseline;
    column-gap: 14px;
}

.stones-row--head {
    padding-bottom: 8px;
    border-bottom: 1px solid #d1d1d1;
}

.stones-row--head .stones-cell {
    font-size: 12px;
    font-weight: 600;
    color: #666;
    text-transform: uppercase;
    letter-spacing: 0.04em;
}

.stones-cell--name a.stones-link {
    color: #333;
    text-decoration: none;
    border: none;
    border-bottom: 1px dotted #333;
    transition: all 0.2s ease;
    opacity: 1;
}

.stones-cell--name a.stones-link:hover {
    opacity: 0.7;
}

.stone-item {
    padding: 12px 0;
    border-bottom: 1px solid #ececec;
}

.stone-item:last-child {
    border-bottom: none;
    padding-bottom: 4px;
}

.stones-cell {
    min-width: 0;
    flex: 1 1 0;
}

.stones-cell--name {
    flex: 2 1 0;
    font-weight: 600;
    color: #333;
}

.stones-origin {
    display: flex;
    gap: 8px;
    margin-top: 10px;
    font-size: 13px;
}

.stones-origin-label {
    font-size: 12px;
    font-weight: 600;
}

.stones-origin-value {
    color: #555;
    line-height: 1.5;
}


@media (max-width: 768px) {
    .stones-row--head {
        display: none;
    }

    .stones-row {
        flex-wrap: wrap;
        row-gap: 6px;
        column-gap: 18px;
    }

    .stones-cell {
        flex: 0 0 auto;
    }

    .stones-cell--name {
        flex: 0 0 100%;
        font-size: 15px;
    }

    .stones-cell--qty::before    { content: 'Кол-во: ';  color: #999; }
    .stones-cell--weight::before { content: 'Вес: ';     color: #999; }
    .stones-cell--color::before  { content: 'Цвет: ';    color: #999; }
    .stones-cell--cut::before    { content: 'Огранка: '; color: #999; }
    .stones-cell--purity::before { content: 'Чистота: '; color: #999; }
}

.product-description {width: 100%; overflow: hidden;}

@media (min-width: 768px) {
    /* 1. Основной контейнер делаем флексом */
    .woocommerce-product-gallery {
        display: flex;
        flex-direction: row;
        gap: 20px;
        align-items: flex-start;
    }

    /* 2. Колонка миниатюр слева */
    .woocommerce-product-gallery .flex-control-nav.flex-control-thumbs {
        display: flex;
        flex-direction: column;
        gap: 20px;
        order: 1;
        width: 95px;
        margin: 0 !important;
        padding: 0 !important;
        overflow: unset !important;
    }

    .woocommerce-product-gallery .flex-control-nav.flex-control-thumbs li {
        width: 100% !important;
        margin: 0 !important;
    }

    .woocommerce-product-gallery .flex-control-nav.flex-control-thumbs li img {
        width: 100%;
        height: auto;
        border: 1px solid transparent;
        opacity: 0.7;
        transition: all 0.2s ease-in-out;
        cursor: pointer;
        display: block;
    }

    .woocommerce-product-gallery .flex-control-nav.flex-control-thumbs li img.flex-active,
    .woocommerce-product-gallery .flex-control-nav.flex-control-thumbs li img:hover {
        border-color: #333333;
        opacity: 1;
    }

    .woocommerce-product-gallery .flex-viewport {
        order: 2;
        flex: 1; 
        margin: 0 !important;
        overflow: hidden; 
    }
    

    .woocommerce-product-gallery .woocommerce-product-gallery__wrapper {

    }
}

/* Cart */

.cart-page h1 {font-size: 70px;}

.cart__items-count {font-family: 'Open Sans', Arial, sans-serif; font-size: 16px; display: inline-block;}

.clear-cart-link {
    font-size: 14px;
    color: #666;
    text-decoration: underline;
    transition: color 0.3s;
}

.clear-cart-link:hover {
    color: #1a1a1a;
}

.cart-layout {
    display: grid;
    grid-template-columns: 1fr 450px;
    gap: 100px;
}

.cart-items-list {
    display: flex;
    flex-direction: column;
    margin-top: 20px;
}

.cart-item {
    display: flex;
    gap: 30px;
    align-items: center;
    padding: 20px 0;
    border-top: 1px solid #8C8C8C;
}

.cart-item:last-child {
    border-bottom: 1px solid #8C8C8C;
}

.cart-item-image {
    flex: 0 0 130px;
    width: 130px;
}

.cart-item-image img {
    width: 100%;
    height: auto;
    display: block;
    border-radius: 4px;
}

.cart-item-details {
    flex: 1 1 auto;
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 20px;
}

.cart-item-name {font-weight: 600; font-size: 16px;}

.cart-item-meta p {
    font-size: 14px;
    color: #777;
    margin: 6px 0;
    line-height: 135%;
}

.cart-item-meta span {
    color: #333;
    font-weight: 500;
}

.cart-item-right {
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    gap: 100px;
    flex: 0 0 auto;
}

.cart-item-price {
    font-size: 16px;
    white-space: nowrap;
}


.cart-item-remove {
    align-self: flex-end;
}

.cart-item-remove:hover {
    background-color: #333333;
}

.remove-btn {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 50px;
    height: 50px;
    border: 1px solid #333333;
    text-decoration: none;
    transition: all 0.3s;
    background-image: url('assets/images/basket-remove.svg');
    background-size: 20px;
    background-position: center;
    background-repeat: no-repeat;
}

.remove-btn:hover {
    filter: brightness(0) invert(1);
}

.cart-form-section {

}

.form-title {
    font-size: 24px;
    font-weight: 500;
    line-height: 1.5;
    margin-bottom: 20px;
}

.cart-order-form .form-group {
    margin-bottom: 20px;
}
.cart-order-form .checkbox-group {margin-top: 20px;}

.cart-order-form input {
    width: 100%;
    padding: 15px 0;
    border: none;
    border-bottom: 1px solid #ccc;
    font-size: 16px;
    font-family: inherit;
    outline: none;
    background: transparent;
    transition: border-color 0.3s;
    color: #1a1a1a;
}

.cart-order-form input:focus,
.cart-order-form textarea:focus {
    border-bottom-color: #1a1a1a;
}

.cart-order-form textarea {
    resize: vertical;
    min-height: 100px;
}

.checkbox-group {
    display: flex;
    align-items: flex-start;
    gap: 12px;
}

.checkbox-group input[type="checkbox"] {
    margin-top: 3px;
    flex-shrink: 0;
}

.checkbox-group label {
    font-size: 13px;
    color: #666;
    line-height: 1.5;
    cursor: pointer;
}

.submit-btn {
    width: 100%;
    padding: 22px;
    border: 1px solid #1a1a1a;
    background: transparent;
    font-size: 15px;
    letter-spacing: 2.5px;
    text-transform: uppercase;
    cursor: pointer;
    transition: all 0.3s;
    margin-top: 10px;
    font-weight: 500;
    color: #1a1a1a;
}

.submit-btn:hover {
    background: #1a1a1a;
    color: #fff;
}

.submit-btn:disabled {
    opacity: 0.6;
    cursor: not-allowed;
}

.form-message {
    margin-top: 20px;
    padding: 15px;
    display: none;
}

.form-message.success {
    display: block;
    background: #d4edda;
    color: #155724;
    border: 1px solid #c3e6cb;
}

.form-message.error {
    display: block;
    background: #f8d7da;
    color: #721c24;
    border: 1px solid #f5c6cb;
}

.cart-empty {margin-top: 150px;}

@media (max-width: 1024px) {
    .cart-layout {
        grid-template-columns: 1fr;
        gap: 60px;
    }
    
    .cart-form-section {
        padding-left: 0;
        border-left: none;
        border-top: 1px solid #e0e0e0;
        padding-top: 50px;
    }
    
    .cart-title-text {
        font-size: 42px;
    }
}

@media (max-width: 768px) {
    .cart-item {
        grid-template-columns: 90px 1fr;
        gap: 15px;
    }
    
    .cart-item-price,
    .cart-item-remove {
        grid-column: 2;
    }
    
    .cart-item-remove {
        justify-self: end;
    }
    
    .cart-header {
        flex-direction: column;
        gap: 20px;
    }
    
    .cart-title-text {
        font-size: 36px;
    }
}

@media (max-width: 480px) {
    .cart-item {
        grid-template-columns: 1fr;
        text-align: center;
    }
    
    .cart-item-image {
        justify-self: center;
    }
    
    .cart-item-price,
    .cart-item-remove {
        grid-column: 1;
        justify-self: center;
    }
    
    .cart-item-meta {
        text-align: left;
    }
}

.posts {
    width: 100%;
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 20px;
}

.post {
    gap: 20px;
    display: flex;
    flex-direction: column;
}

.post__img img {
    width: 100%;
    height: 320px;
    object-fit: cover;
    object-position: center;
    display: block;
}

.post__title {
    font-size: 24px;
    line-height: 33px;
    display: inline-block;
}

.post__excerpt p {
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    line-height: 135%;
    height: calc(1.5em * 2); 
    margin: 10px 0 0 0;
}

.post .btn {display: block; width: 205px; margin: 0 auto;}

@media (max-width: 992px) {
    .posts {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 576px) {
    .posts {
        grid-template-columns: 1fr;
    }
}

.news {
    width: 100%;
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 20px;
}
.news .news-item {
    gap: 20px;
    display: flex;
    flex-direction: column;
}
.news .news-item__img img {
    width: 100%;
    height: 200px;
    object-fit: cover;
    object-position: center;
    display: block;
}
.news .news-item__title {
    font-size: 18px;
    display: inline-block;
    font-weight: 600;
}
.news .news-item__excerpt p {
    font-size: 14px;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    line-height: 135%;
    height: calc(1.5em * 2); 
    margin: 0;
}

.news .news-item__date {font-size: 12px; color: #8C8C8C;}

.brand-header {margin-top: -100px; margin-bottom: 120px; display: flex; position: relative; height: 800px;}
.tax-product_brand h1 {font-size: 70px; margin: 160px 0 25px;}
.brand-description {border: 1px solid #333333; padding: 50px 20px; box-sizing: border-box; background-color: #ffffff;}
h2.brand-description__title {font-size: 36px; margin: 0; }
.brand-header__img {position: absolute; top: 0; right: 0; width: 800px; height: 800px; z-index: -1;}
.brand-header__img img {height: 100%; object-fit: cover;}

.woocommerce-error, .woocommerce-info, .woocommerce-message {border: 1px solid #333333 !important; background: transparent; padding: 15px;}
.woocommerce-error::before, .woocommerce-info::before, .woocommerce-message::before {display: none!important;}
.woocommerce-error .button {display: none!important;}

.products-filter {font-size: 16px; text-transform: uppercase; float: left; margin-left: 40px; cursor: pointer; position: relative;}
.products-filter::after {content: ''; width: 12px; height: 12px; background-image: url('assets/images/filter-burger.svg'); display: inline-block; margin-left: 5px;}
.products-filter sub {display: none;}
    
.custom-filters-wrapper {
    position: absolute;
    display: none;
    background: #fff;
    border: 1px solid #8C8C8C;
    padding: 24px 30px;
    margin-bottom: 30px;
    z-index: 999;
    top: 30px;
}

.custom-filters-wrapper.active {display: flex;}


.filters-grid {
    display: flex;
}

.filter-column {
    border-right: 1px solid #8C8C8C;
    padding: 0 50px;
}

.filter-column:first-child {
    padding-left: 0;
}

.filter-column:last-child {
    border-right: none;
    padding-right: 0;
}

.filter-column p {font-size: 16px; font-weight: 600; margin-top: 0;}

.filter-options {
    max-height: 220px;
    overflow: hidden;
    transition: max-height 0.3s ease;
}

.filter-options.expanded {
    max-height: 600px;
}

.filter-option {
    margin-bottom: 10px;
}

.filter-option label {
    display: flex;
    align-items: center;
    cursor: pointer;
    font-size: 14px;
    color: #8C8C8C;
    transition: color 0.2s;
    user-select: none;
}

.filter-option label:hover {
    color: #333;
}

.filter-option input[type='checkbox'] {
    margin-right: 10px;
    width: 16px;
    height: 16px;
    cursor: pointer;
    accent-color: #333;
    flex-shrink: 0;
}

/* Стили для неактивных (недоступных) опций фильтра */
.filter-option.disabled {
    opacity: 0.4;
    cursor: not-allowed;
    pointer-events: none; /* Запрещает клики по всему блоку */
}


/* Опционально: индикатор загрузки при AJAX-запросе */
body.filter-loading .filters-grid {
    opacity: 0.7;
    pointer-events: none;
    transition: opacity 0.2s ease;
}

/* ============================================
   КНОПКА "ПОКАЗАТЬ ЕЩЕ"
   ============================================ */
.show-more-btn {
    background: none;
    border: none;
    color: #8C8C8C;
    cursor: pointer;
    font-size: 14px;
    padding: 8px 0 0 0;
    margin-top: 4px;
    display: flex;
    align-items: center;
    gap: 6px;
    transition: color 0.2s;
}

.show-more-btn:hover {
    color: #333;
}

.show-more-btn span {
    font-size: 10px;
    transition: transform 0.2s;
    display: inline-block;
}

.show-more-btn.expanded span {
    transform: rotate(180deg);
}

/* ============================================
   БЛОК ЦЕНЫ
   ============================================ */
.price-filter {
    margin-bottom: 20px;
}

.price-inputs {
    display: flex;
    gap: 12px;
    align-items: flex-start;
    margin-bottom: 16px;
}

.price-input-group {
    flex: 1;
}

.price-input-group label {
    display: block;
    font-size: 12px;
    color: #8C8C8C;
    margin-bottom: 6px;
}

.price-input-group input[type="number"] {
    width: 100%;
    padding: 8px 10px;
    border: 1px solid #8C8C8C;
    font-size: 14px;
    color: #333;
    background: #fff;
    box-sizing: border-box;
    border-radius: 0;
    -moz-appearance: textfield;
}

.price-input-group input[type="number"]::-webkit-outer-spin-button,
.price-input-group input[type="number"]::-webkit-inner-spin-button {
    -webkit-appearance: none;
    margin: 0;
}

.price-input-group input[type="number"]:focus {
    outline: none;
    border-color: #333;
}

.price-input-separator {
    display: flex;
    align-items: center;
    padding-top: 22px;
    color: #8C8C8C;
    font-size: 14px;
}

/* ============================================
   СЛАЙДЕР ЦЕНЫ
   ============================================ */
.price-slider {
    margin: 16px 8px 20px 8px;
    height: 4px;
    position: relative;
}

/* Сброс стандартных стилей jQuery UI */
.price-slider .ui-slider {
    background: #8C8C8C;
    border: none;
    border-radius: 2px;
    height: 4px;
    position: relative;
}

/* Активная область между ползунками */
.price-slider .ui-slider-range {
    background: #333;
    border-radius: 2px;
    height: 4px;
    position: absolute;
    top: 0;
}

/* Ползунки (handle) */
.price-slider .ui-slider-handle {
    background: #fff;
    border: 2px solid #8C8C8C;
    width: 16px;
    height: 16px;
    border-radius: 50%;
    cursor: pointer;
    position: absolute;
    top: 50%;
    transform: translate(-50%, -50%);
    margin-top: 0;
    outline: none;
    transition: border-color 0.2s, box-shadow 0.2s;
    z-index: 2;
}

.price-slider .ui-slider-handle:hover {
    border-color: #333;
    box-shadow: 0 0 0 3px rgba(51, 51, 51, 0.1);
}

.price-slider .ui-slider-handle:focus {
    outline: none;
    border-color: #333;
}

.price-slider .ui-slider-handle.ui-state-active {
    border-color: #333;
}

/* ============================================
   КНОПКИ ПРИМЕНИТЬ / СБРОСИТЬ
   ============================================ */
.apply-filters-btn {
    background: #333;
    color: #fff;
    border: 1px solid #333;
    padding: 10px 24px;
    font-size: 14px;
    font-weight: 500;
    cursor: pointer;
    margin-top: 10px;
    transition: all 0.2s;
    border-radius: 0;
    width: 100%;;
}

.apply-filters-btn:hover {
    background: #8C8C8C;
    border-color: #8C8C8C;
}

.reset-filters-btn {
    background: #fff;
    color: #8C8C8C;
    border: 1px solid #8C8C8C;
    padding: 10px 24px;
    font-size: 14px;
    font-weight: 500;
    cursor: pointer;
    margin-top: 10px;
    transition: all 0.2s;
    border-radius: 0;
    width: 100%;
}

.reset-filters-btn:hover {
    color: #333;
    border-color: #333;
}

/* ============================================
   ИНДИКАТОР ЗАГРУЗКИ
   ============================================ */
.filter-loading {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: rgba(255, 255, 255, 0.9);
    display: none;
    justify-content: center;
    align-items: center;
    z-index: 999;
}

.filter-loading.active {
    display: flex;
}

.spinner {
    border: 3px solid #8C8C8C;
    border-top: 3px solid #333;
    border-radius: 50%;
    width: 36px;
    height: 36px;
    animation: spin 0.8s linear infinite;
}

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

footer .agreement-link {font-size: 12px;}

.modal-wrapper {width: 100%; height: 100%; position: fixed; left: 0; top: 0; z-index: 9999; background: rgba(25, 25, 25, 0.6); display: flex; justify-content: center; align-items: center; visibility: hidden; opacity: 0; transition: 0.3s ease all; }
.modal-open .modal-wrapper {visibility: visible; opacity: 1;}
.modal {background: #FFFFFF; padding: 40px; padding-top: 80px; visibility: hidden; opacity: 0; text-align: center; max-width: 580px; position: relative; display: none; flex-direction: column; align-items: center;}
.modal.show {visibility: visible; opacity: 1; display: flex;}
.modal.modal-banner {max-width: 1100px; padding: 0;}
.modal.modal-banner::before {
    content: '';
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    background: linear-gradient(to right, rgba(0, 0, 0, 0.8) 0%, rgba(0, 0, 0, 0.7123) 50%, rgba(0, 0, 0, 0) 100%);
    pointer-events: none;
    z-index: 1;
}

.modal.modal-banner img {
    position: relative;
    z-index: 0;
}
.modal__header {font-family: 'FoglihtenNo06', Arial, sans-serif; font-size: 32px; margin-bottom: 25px;}
.modal__close {position: absolute; width: 32px; height: 32px; background-size: cover; background-image: url('assets/images/close-icon.svg'); top: 20px; right: 20px; cursor: pointer; opacity: 1; transition: 0.3s ease all; z-index: 999;}
.modal__close:hover {opacity: 0.7;}
.modal-banner .modal__close {filter: brightness(0) invert(1);}
.modal-banner .modal__content {position: absolute; top: 50px; left: 40px; color: #fff; max-width: 530px; text-align: left; z-index: 99;}
.modal-banner .btn {position: absolute; left: 40px; bottom: 50px; z-index: 99;}
.modal-order .modal__header {font-size: 24px; max-width: 420px;}
.modal-order p {margin-top: 0;}
.modal-order form {max-width: 450px;}
.modal-order .checkbox-group {text-align: left;}
.modal-order .checkbox-group label {font-size: 12px;}
.modal-order .btn {margin-top: 40px;}
.modal.modal-order .form-row {gap: 0; margin-bottom: 30px;}

.main-menu__mobile {position: fixed; width: 100%; height: 100%; left: 0; top: 0; background: #FFFFFF; z-index: 999;}
ul.mobile-menu {list-style: none; display: flex; flex-direction: column; gap: 30px; margin: 0; padding: 0; margin-top: 35px;}
ul.mobile-menu li, .search__label {text-transform: uppercase;}
.search__label {margin: 30px 0 10px;}
.main-menu__mobile .search-container {
    position: relative;
    left: 0;
    opacity: 1;
    width: 100%;
    visibility: visible;
    top: 0;
}

body.no-scroll {
    overflow: hidden;
}

.collection-swiper {
    position: relative;
    overflow: hidden;
    width: 660px;
    padding-bottom: 50px;
}

.collection-swiper .swiper-wrapper {
    width: 100%;
}

.collection-swiper .swiper-slide {
    height: auto;
    box-sizing: border-box;
}

.collection-swiper ul.products li.product {width: 100%;}

.collection-swiper .product img {
    width: 100%;
    height: auto;
    display: block;
}

.collection-swiper .swiper-pagination {
    bottom: 0;
    left: 0;
    right: 0;
    text-align: center;
}

.collection-swiper .swiper-pagination-bullet {
    width: 12px;
    height: 12px;
    background: #d0d0d0;
    opacity: 1;
    margin: 0 5px !important;
    transition: background 0.3s ease, transform 0.3s ease;
}

.collection-swiper .swiper-pagination-bullet-active {
    background: #000;
    transform: scale(1.2);
}

.active-filters-wrapper {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 10px;
    float: left;
    font-size: 16px;
    margin-left: 25px;
}

.active-filters {
    display: flex;
    flex-wrap: wrap;
    gap: 15px;
    flex: 1;
}

.active-filter-tag {
    display: flex;
    color: #8C8C8C;
    align-items: center;
    gap: 5px;
}


.remove-filter {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 16px;
    height: 16px;
    text-decoration: none;
    color: #8C8C8C;
}


.reset-all-filters {
    font-size: 14px;
    border-bottom: 1px solid #333;
    white-space: nowrap;
    margin-left: 15px;
}

.reset-all-filters:hover {border-bottom: 0px;}

@media (max-width: 768px) {
    .main-collection {flex-direction: column;}
    .collection-slider, .collection-block {flex: 100%;}
    .collection-swiper {width: 100%;}
    .collection-swiper ul.products li.product {width: 100%!important;}
    .collection-slider {order: 2;}
    .collection-block .btn {width: 100%;}
}

@media (max-width: 768px) {
    html {margin-top: 0!important;}
    html #wpadminbar {display: none!important;}
    .desktop {display: none!important;}
    .mobile {display: block!important;}
    body {font-size: 16px;}
    h1, h2 {font-size: 40px;}
    h2.brand-description__title {font-size: 32px;}
    h3 {font-size: 30px;}
    section {margin-top: 80px; margin-bottom: 80px;}
    .container {box-sizing: border-box; padding-left: 15px; padding-right: 15px;}
    .btn {display: flex; padding: 0; height: 60px; justify-content: center; align-items: center;}
    header .container, .menu-mobile__header .container {justify-content: space-between; align-items: center;}
    .home.admin-bar header {top: 0;}
    .header__burger {width: 40px; height: 40px; background-size: cover; background-image: url('assets/images/burger-icon.svg');}
    .header__burger.open {background-image: url('assets/images/burger_close-icon.svg');}
    .home header .header__burger {filter: brightness(0) invert(1);}
    .main-menu__mobile {display: none!important; overflow-y: auto;}
    .main-menu__mobile.open {display: block!important;}
    .main-menu__mobile .search-results {position: relative;}
    .main-menu__mobile .search-container {padding-bottom: 30px;}
    .main-screen img {height: 500px; object-fit: cover;}
    .main-text-block {flex-direction: column;}
    .main-text-block h3 {margin-bottom: 25px;}
    .latest-news {flex-direction: column; gap: 30px;}
    .contact-form .btn {padding: 0;}
    .checkbox-group label {text-align: left;}
    
    .mobile-catalog {z-index: 9999; display: none!important; position: fixed; top: 62px; left: 0; background: #FFFFFF; width: 100%; height: 100%; overflow-y: auto; padding: 30px 0px; box-sizing: border-box;}
    .mobile-catalog.open {display: flex!important;}
    .mobile-catalog__top {display: flex; position: relative; justify-content: center;}
    .mobile-catalog__close {position: absolute; left: 0; font-size: 14px; color: #8C8C8C;}
    .mobile-catalog__title {font-family: 'FoglihtenNo06', Arial, sans-serif; font-size: 24px;}
    .mobile-catalog__links {margin-top: 30px; padding-bottom: 90px;}
    .mobile-catalog .catalog-nav__links {flex-direction: column; width: 100%;}
    .mobile-catalog .catalog-nav__links ul {list-style: none; margin: 0; padding: 0; margin-top: 10px;}
    .mobile-catalog .catalog-nav__links ul li {line-height: 30px;}
    .mobile-catalog .catalog-nav__links ul li a {font-size: 14px;}
    .mobile-catalog .catalog-nav__links .flex-column {border-top: 1px solid #8C8C8C; padding: 10px 0 15px;}
    ul.mobile-menu li.menu-item-21 {position: relative; display: flex; align-items: center;}
    ul.mobile-menu li.menu-item-21::after {content: ''; position: absolute; right: 0; display: flex; width: 8px; height: 8px; background-image: url('assets/images/arrow-right.svg');}
    
    .news__thumbnail img {max-height: 200px;}
    .news .news-item__excerpt p {display: block; overflow: unset; height: auto;}
    
    .post__excerpt p {display: block; height: auto;}
    .post .btn {display: flex; width: 100%;}
    
    .about-page .grid {flex-wrap: unset; flex-direction: column;}
    .about-page .grid__item {width: 100%; max-height: 100%; aspect-ratio: auto; padding: 0!important;}
    .about-page .grid__item:nth-child(1) {order: 1;}
    .about-page .grid__item:nth-child(2) {order: 2;}
    .about-page .grid__item:nth-child(3) {order: 4;}
    .about-page .grid__item:nth-child(4) {order: 3;}
    .about-page .grid__item:nth-child(5) {order: 5;}
    .about-page .grid__item:nth-child(6) {order: 6;}
    .about-page h2 {font-size: 26px;}
    
    footer {padding: 20px 0;}
    .footer-container {flex-direction: column; gap: 25px}
    .footer__left {width: 100%; text-align: center; padding: 0;}
    a.footer__logo {width: 220px; margin-bottom: 15px;}
    .footer__col {border: 0; padding: 0;}
    .footer__col.mobile {display: flex!important;}
    
    .catalog-top {display: flex; justify-content: space-between;}
    .products-order {display: none;}
    .custom-filters-wrapper {position: fixed; top: 60px; left: 0; width: 100%; height: 100%; flex-direction: column; box-sizing: border-box; overflow-y: auto;}
    .filters__top {display: flex!important; justify-content: center; position: relative;}
    .filters__title {font-family: 'FoglihtenNo06', Arial, sans-serif; font-size: 24px;}
    .filters__close {position: absolute; right: 0; font-size: 14px; color: #8C8C8C;}
    .filters-grid {flex-direction: column; margin-top: 5px;}
    .filter-column {padding: 20px 0; border: 0; border-bottom: 1px solid #8C8C8C;}
    .filter-column:last-child {padding-bottom: 50px;}
    .products-filter sub {display: inline-flex; font-size: 10px; margin-left: 3px;}
    
    .active-filters-wrapper {flex-direction: column; align-items: flex-start; gap: 15px;}
    .active-filters {width: 100%;}
    .reset-all-filters {align-self: flex-end;}    
    
    .product-item__link {font-family: 'Open Sans', Arial, sans-serif; margin-bottom: 10px;}
    .woocommerce ul.products li.product .button.add_to_cart_button {width: 20px; height: 20px;}
    .product-item__descr {display: none;}
    .product-buttons {flex-direction: column;}
    .product-buttons .btn {width: 100%;}
    ul.products {display: flex; flex-wrap: wrap; gap: 10px;}
    ul.products::before {display: none!important;}
    ul.products li.product {float: none!important; width: calc(50% - 5px)!important; display: flex; flex-direction: column; margin-bottom: 30px!important;}
    ul.products li.product .price {margin-top: auto;}
    
    .cart-page h1 {font-size: 50px;}    
    .cart-item-image {width: 75px; flex: 0 0 75px;}
    .cart-item-name {text-align: left;}
    
    .tax-product_brand h1 {margin: 0;}
    .brand-header {margin-top: 0; margin-bottom: 80px; height: auto; flex-direction: column;}
    .brand-header__img {width: 100%; height: 300px; margin-top: 20px; top: unset; position: relative;}

    .page-content h1 {font-size: 50px;}
    .news {grid-template-columns: repeat(1, 1fr);}
    .news .news-item {text-align: center; gap: 15px;}
    .news .news-item__date {text-align: right;}
    
    .contacts-page {flex-direction: column;}
    .contacts-buttons {flex-direction: column;}
    .contacts-buttons .btn {flex: auto!important;}
    .contacts-page #map {width: 100%; height: 300px;}
    
    .page-id-3 h1, .page-id-84 h1 {font-size: 32px; letter-spacing: -3px;}
    .page-id-3 h2, .page-id-84 h2 {font-size: 26px;}
    
    .modal.modal-banner {max-width: 100%; height: 450px;}
    .modal.modal-banner img {height: 100%; object-fit: cover;}
    .modal-banner .modal__content {top: 60px; padding: 0 20px; text-align: center; left: 0;}
    .modal-banner .btn {left: 5%; width: 90%; bottom: 25px;}
}

.woocommerce-product-gallery .flex-viewport .gallery-custom-nav {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    pointer-events: none;
    z-index: 20;
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.woocommerce-product-gallery .flex-viewport .gallery-custom-nav button {
    position: relative;
    background-color: transparent; /* Убрал белый фон, так как размер маленький */
    border: 0;
    width: 6px;   /* Фиксированная ширина */
    height: 18px;   /* Фиксированная высота */
    cursor: pointer;
    pointer-events: auto;
    padding: 0;
    margin: 0 10px;
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
}

/* Стили для изображения внутри кнопки */
.woocommerce-product-gallery .flex-viewport .gallery-custom-nav button img {
    width: 100%;
    height: 100%;
    object-fit: contain; /* Или cover, если нужно заполнить всю область */
    display: block;
}

/* Поворот левой стрелки на 180 градусов */
.woocommerce-product-gallery .flex-viewport .gallery-custom-nav button.arrow-left img {
    transform: rotate(180deg);
}

/* Ховер эффект (опционально, можно убрать если мешает) */
.woocommerce-product-gallery .flex-viewport .gallery-custom-nav button:hover {
    opacity: 0.7;
}


@media only screen and (max-width: 767px) {
    /* Скрываем увеличенное изображение зума на мобильных */
    .woocommerce-product-gallery .zoomImg {
        display: none !important;
    }
    
    /* Отключаем перехват касаний скриптом зума, чтобы клик и свайп работали естественно */
    .woocommerce-product-gallery .woocommerce-product-gallery__image {
        pointer-events: none !important;
    }
    
    /* Возвращаем возможность кликнуть на ссылку (для открытия лайтбокса/фотосвайпа) */
    .woocommerce-product-gallery .woocommerce-product-gallery__image a {
        pointer-events: auto !important;
        display: block;
    }
}