/* ==========================================
   ZYVEN CO. SHOP HERO BANNER
========================================== */

.zyven-shop-banner {
    position: relative;
    isolation: isolate;

    display: flex;
    align-items: center;

    min-height: 560px;
    overflow: hidden;

    color: #ffffff;

    background-color: #080808;
    background-image: url("../images/shop-banner.png");
    background-position: center;
    background-size: cover;
    background-repeat: no-repeat;
}

/* Dark Overlay */

.shop-banner-overlay {
    position: absolute;
    inset: 0;
    z-index: -1;

    background: linear-gradient(90deg,
            rgba(0, 0, 0, 0.92) 0%,
            rgba(0, 0, 0, 0.78) 30%,
            rgba(0, 0, 0, 0.30) 58%,
            rgba(0, 0, 0, 0.08) 100%);
}

/* Container */

.shop-banner-container {
    padding: 65px 5.5%;
}

/* Banner Content */

.shop-banner-content {
    width: 100%;
    max-width: 650px;

    animation: shopBannerReveal 0.9s ease both;
}

/* Eyebrow */

.shop-banner-eyebrow {
    display: flex;
    align-items: center;
    gap: 18px;

    margin-bottom: 24px;

    color: #ffffff;
    font-size: 13px;
    font-weight: 600;
    letter-spacing: 5px;
}

.eyebrow-line {
    display: block;

    width: 85px;
    height: 1px;

    background: #ffffff;
}

/* Main Heading */

.shop-banner-content h1 {
    margin: 0 0 22px;

    color: #ffffff;

    font-family: Georgia, "Times New Roman", serif;
    font-size: clamp(52px, 6vw, 88px);
    font-weight: 700;
    line-height: 1.08;
    letter-spacing: -2px;
}

.shop-banner-content h1 span {
    color: #e6bd68;
}

/* Description */

.shop-banner-description {
    max-width: 500px;

    margin-bottom: 30px;

    color: rgba(255, 255, 255, 0.88);
    font-size: 17px;
    font-weight: 400;
    line-height: 1.8;
}

/* CTA Button */

.shop-banner-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 22px;

    min-height: 54px;
    padding: 0 27px;

    color: #111111;
    background: #ffffff;

    border: 1px solid #e6bd68;
    border-radius: 4px;

    font-size: 14px;
    font-weight: 700;
    letter-spacing: 0.5px;
    text-transform: uppercase;
    text-decoration: none;

    transition:
        background 0.3s ease,
        color 0.3s ease,
        transform 0.3s ease;
}

.shop-banner-btn i {
    font-size: 19px;

    transition: transform 0.3s ease;
}

.shop-banner-btn:hover {
    color: #111111;
    background: #f4d897;

    transform: translateY(-3px);
}

.shop-banner-btn:hover i {
    transform: translateX(5px);
}

/* Feature Highlights */

.shop-banner-features {
    display: flex;
    align-items: center;
    gap: 25px;

    margin-top: 45px;
}

.shop-banner-feature {
    display: flex;
    align-items: center;
    gap: 14px;
}

.shop-banner-feature>i {
    color: #e6bd68;
    font-size: 34px;
}

.shop-banner-feature h3 {
    margin: 0 0 4px;

    color: #e6bd68;
    font-family: Georgia, "Times New Roman", serif;
    font-size: 27px;
    font-weight: 700;
}

.shop-banner-feature p {
    margin: 0;

    color: rgba(255, 255, 255, 0.90);
    font-size: 14px;
    font-weight: 400;
    white-space: nowrap;
}

.shop-feature-divider {
    width: 1px;
    height: 55px;

    flex-shrink: 0;

    background: rgba(230, 189, 104, 0.65);
}

/* Entry Animation */

@keyframes shopBannerReveal {

    from {
        opacity: 0;
        transform: translateY(20px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }

}


/* ==========================================
   TABLET RESPONSIVE
========================================== */

@media (max-width: 991.98px) {

    .zyven-shop-banner {
        min-height: 520px;
        background-position: 58% center;
    }

    .shop-banner-overlay {
        background: linear-gradient(90deg,
                rgba(0, 0, 0, 0.94) 0%,
                rgba(0, 0, 0, 0.82) 42%,
                rgba(0, 0, 0, 0.40) 75%,
                rgba(0, 0, 0, 0.20) 100%);
    }

    .shop-banner-container {
        padding: 55px 35px;
    }

    .shop-banner-content {
        max-width: 560px;
    }

    .shop-banner-content h1 {
        font-size: clamp(48px, 7vw, 70px);
    }

    .shop-banner-features {
        gap: 18px;
        margin-top: 38px;
    }

    .shop-banner-feature {
        gap: 10px;
    }

    .shop-banner-feature>i {
        font-size: 27px;
    }

    .shop-banner-feature h3 {
        font-size: 23px;
    }

    .shop-banner-feature p {
        font-size: 12px;
    }

    .shop-feature-divider {
        height: 45px;
    }

}


/* ==========================================
   MOBILE RESPONSIVE
========================================== */

@media (max-width: 575.98px) {

    /* .zyven-shop-banner {
        min-height: 570px;

        align-items: flex-start;

        background-position: 65% center;
    } */

    /* .zyven-shop-banner {
        min-height: auto;
        height: auto;

        background-size: 100% auto;
        background-position: top center;
        background-repeat: no-repeat;

        align-items: flex-start;
    } */






    @media (max-width: 575.98px) {

        .zyven-shop-banner {
            min-height: 0;
            aspect-ratio: 16 / 9;

            background-size: contain;
            background-position: top center;
            background-repeat: no-repeat;
        }

    }


    /* .shop-banner-overlay {
        background: linear-gradient(
            90deg,
            rgba(0, 0, 0, 0.91) 0%,
            rgba(0, 0, 0, 0.78) 58%,
            rgba(0, 0, 0, 0.48) 100%
        );
    } */

    .shop-banner-overlay {
        background: linear-gradient(180deg,
                rgba(0, 0, 0, 0.45) 0%,
                rgba(0, 0, 0, 0.75) 45%,
                rgba(0, 0, 0, 0.96) 100%);
    }

    .shop-banner-container {
        padding: 260px 20px 35px;
    }

    .shop-banner-content {
        max-width: 100%;
    }

    .shop-banner-eyebrow {
        gap: 12px;

        margin-bottom: 22px;

        font-size: 10px;
        letter-spacing: 3px;
    }

    .eyebrow-line {
        width: 45px;
    }

    .shop-banner-content h1 {
        margin-bottom: 20px;

        font-size: clamp(42px, 11vw, 58px);
        line-height: 1.12;
        letter-spacing: -1px;
    }

    .shop-banner-description {
        max-width: 330px;

        margin-bottom: 25px;

        font-size: 14px;
        line-height: 1.8;
    }

    .shop-banner-btn {
        min-height: 49px;
        gap: 15px;
        padding: 0 18px;

        font-size: 12px;
    }

    .shop-banner-features {
        align-items: flex-start;
        justify-content: space-between;
        gap: 10px;

        margin-top: 38px;
    }

    .shop-banner-feature {
        flex: 1;

        flex-direction: column;
        align-items: flex-start;
        gap: 8px;

        min-width: 0;
    }

    .shop-banner-feature>i {
        font-size: 25px;
    }

    .shop-banner-feature h3 {
        font-size: 22px;
    }

    .shop-banner-feature p {
        font-size: 11px;
        white-space: normal;
        line-height: 1.5;
    }

    .shop-feature-divider {
        height: 65px;
        margin-top: 5px;
    }

}

/* Respect Reduced Motion Preferences */

@media (prefers-reduced-motion: reduce) {

    .shop-banner-content {
        animation: none;
    }

    .shop-banner-btn,
    .shop-banner-btn i {
        transition: none;
    }

}


/* ==========================================
   ZYVEN CO. COMPACT COLLECTION STRIP
========================================== */

.zyven-collection-strip {
    padding: 16px 0 24px;
    background: #080808;
}

.zyven-collection-strip .container-fluid {
    padding-left: 25px;
    padding-right: 25px;
}

/* Collection Card */

.collection-strip-card {
    position: relative;
    isolation: isolate;

    display: flex;
    align-items: flex-end;

    width: 100%;
    height: 190px;

    padding: 16px;

    overflow: hidden;

    background-color: #191919;
    background-position: center;
    background-size: cover;
    background-repeat: no-repeat;

    border: 1px solid rgba(212, 175, 95, 0.25);
    border-radius: 8px;

    color: #ffffff;
    text-decoration: none;

    transition:
        border-color 0.3s ease,
        transform 0.3s ease;
}

/* Background Images */

.collection-strip-men {
    background-image: url("../images/collection-men.jpg");
}

.collection-strip-women {
    background-image: url("../images/collection-women.jpg");
}

.collection-strip-mens-premium {
    background-image: url("../images/collection-mens-premium.jpg");
}

.collection-strip-womens-premium {
    background-image: url("../images/collection-womens-premium.jpg");
}

/* Dark Gradient */

.collection-strip-overlay {
    position: absolute;
    inset: 0;
    z-index: -1;

    background: linear-gradient(180deg,
            rgba(0, 0, 0, 0.02) 20%,
            rgba(0, 0, 0, 0.35) 55%,
            rgba(0, 0, 0, 0.90) 100%);

    transition: background 0.3s ease;
}

/* Text Content */

.collection-strip-content {
    position: relative;
    z-index: 1;

    min-width: 0;
    padding-right: 28px;
}

.collection-strip-content h3 {
    margin: 0 0 7px;

    color: #ffffff;

    font-family: Georgia, "Times New Roman", serif;
    font-size: 23px;
    font-weight: 700;
    line-height: 1.1;

    overflow-wrap: anywhere;
}

.collection-strip-content p {
    margin: 0;

    color: rgba(255, 255, 255, 0.90);
    font-size: 12px;
    font-weight: 400;
    line-height: 1.4;
}

/* Gold Arrow */

.collection-strip-arrow {
    position: absolute;
    right: 13px;
    bottom: 15px;
    z-index: 2;

    width: 30px;
    height: 30px;

    display: flex;
    align-items: center;
    justify-content: center;

    flex-shrink: 0;

    color: #111111;
    background: #ffffff;

    border-radius: 50%;

    font-size: 15px;

    transition:
        background 0.3s ease,
        transform 0.3s ease;
}

/* Hover */

.collection-strip-card:hover {
    color: #ffffff;

    border-color: #e6bd68;
    transform: translateY(-3px);
}

.collection-strip-card:hover .collection-strip-arrow {
    background: #f5d996;
    transform: translateX(3px);
}


/* ==========================================
   TABLET
========================================== */

@media (max-width: 991.98px) {

    .zyven-collection-strip .container-fluid {
        padding-left: 20px;
        padding-right: 20px;
    }

    .collection-strip-card {
        height: 180px;
        padding: 14px;
    }

    .collection-strip-content h3 {
        font-size: 22px;
    }

}


/* ==========================================
   MOBILE
========================================== */

@media (max-width: 575.98px) {

    .zyven-collection-strip {
        padding: 12px 0 20px;
    }

    .zyven-collection-strip .container-fluid {
        padding-left: 12px;
        padding-right: 12px;
    }

    .zyven-collection-strip .row {
        --bs-gutter-x: 10px;
        --bs-gutter-y: 10px;
    }

    .collection-strip-card {
        height: 145px;
        padding: 10px;

        border-radius: 6px;
    }

    .collection-strip-content {
        padding-right: 0;
    }

    .collection-strip-content h3 {
        margin-bottom: 5px;
        font-size: clamp(16px, 4.2vw, 21px);
        line-height: 1.15;
    }

    .collection-strip-content p {
        max-width: 115px;
        font-size: 10px;
        line-height: 1.4;
    }

    .collection-strip-arrow {
        right: 8px;
        bottom: 9px;

        width: 25px;
        height: 25px;

        font-size: 12px;
    }

    .collection-strip-card:hover {
        transform: none;
    }

}


/* Very Small Phones */

@media (max-width: 360px) {

    .collection-strip-card {
        height: 130px;
        padding: 8px;
    }

    .collection-strip-content h3 {
        font-size: 15px;
    }

    .collection-strip-content p {
        font-size: 9px;
    }

    .collection-strip-arrow {
        width: 22px;
        height: 22px;

        right: 6px;
        bottom: 7px;

        font-size: 11px;
    }

}


/* ==========================================
   ZYVEN CO. SHOP PRODUCTS
========================================== */

.zyven-shop-products {
    padding: 75px 0;

    color: #171717;
    background: #ffffff;
}

.shop-products-container {
    padding-left: 35px;
    padding-right: 35px;
}


/* Section Heading */

.shop-products-heading {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 20px;

    margin-bottom: 38px;
}

.shop-products-eyebrow {
    display: inline-block;

    margin-bottom: 12px;

    color: #a5823e;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 4px;
}

.shop-products-heading h2 {
    margin-bottom: 12px;

    font-family: Georgia, "Times New Roman", serif;
    font-size: clamp(32px, 4vw, 46px);
    font-weight: 700;
}

.shop-products-heading h2 span {
    color: #a5823e;
}

.shop-products-heading p {
    margin: 0;

    color: #777777;
    font-size: 14px;
    line-height: 1.7;
}

.shop-products-count {
    display: flex;
    align-items: center;
    gap: 8px;

    padding-bottom: 8px;

    color: #777777;
    font-size: 13px;
}

.shop-products-count span:first-child {
    color: #111111;
    font-size: 24px;
    font-weight: 700;
}


/* Sidebar */

.shop-filter-sidebar {
    padding: 23px 19px;

    background: #ffffff;

    border: 1px solid #e8e8e8;
    border-radius: 5px;
}

.shop-filter-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;

    padding-bottom: 20px;

    border-bottom: 1px solid #e8e8e8;
}

.shop-filter-header h3 {
    margin: 0;

    font-size: 19px;
    font-weight: 700;
}

.shop-filter-header h3 i {
    margin-right: 7px;
    color: #a5823e;
}

.shop-reset-btn {
    padding: 0;

    color: #8d6d30;
    background: #ffffff;

    border: none;

    font-size: 12px;
    font-weight: 600;
}


/* Filter Groups */

.shop-filter-group {
    padding: 20px 0;

    border-bottom: 1px solid #eeeeee;
}

.shop-filter-title {
    display: flex;
    align-items: center;
    justify-content: space-between;

    width: 100%;
    padding: 0;

    color: #191919;
    background: #ffffff;

    border: none;

    font-size: 15px;
    font-weight: 700;
    text-align: left;
}

.shop-filter-title i {
    color: #a5823e;
    font-size: 17px;
}

.shop-filter-options {
    padding-top: 18px;
}

.shop-filter-options.is-collapsed {
    display: none;
}


/* Checkbox */

.shop-checkbox {
    display: flex;
    align-items: center;
    gap: 10px;

    margin-bottom: 14px;

    color: #5f5f5f;
    font-size: 13px;

    cursor: pointer;
}

.shop-checkbox:last-child {
    margin-bottom: 0;
}

.shop-checkbox input {
    width: 16px;
    height: 16px;
    flex-shrink: 0;

    accent-color: #a5823e;

    cursor: pointer;
}


/* Price Inputs */

.shop-price-inputs {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 9px;
}

.shop-price-inputs label {
    display: block;

    margin-bottom: 7px;

    color: #777777;
    font-size: 11px;
    font-weight: 600;
}

.shop-price-inputs input {
    width: 100%;
    min-width: 0;

    padding: 10px 7px;

    color: #111111;
    background: #ffffff;

    border: 1px solid #dddddd;
    border-radius: 3px;

    font-size: 12px;
}

.shop-price-inputs input:focus {
    outline: none;
    border-color: #a5823e;
}

.shop-apply-price {
    width: 100%;

    margin-top: 12px;
    padding: 10px;

    color: #111111;
    background: #ffffff;

    border: 1px solid #a5823e;
    border-radius: 3px;

    font-size: 12px;
    font-weight: 700;

    transition:
        color 0.3s ease,
        border-color 0.3s ease;
}

.shop-apply-price:hover {
    color: #8d6d30;
    border-color: #8d6d30;
}


/* Size Options */

.shop-size-options {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

.shop-size-options label {
    cursor: pointer;
}

.shop-size-options input {
    position: absolute;
    opacity: 0;
    pointer-events: none;
}

.shop-size-options label span {
    width: 38px;
    height: 36px;

    display: flex;
    align-items: center;
    justify-content: center;

    color: #555555;
    background: #ffffff;

    border: 1px solid #dddddd;
    border-radius: 3px;

    font-size: 12px;
    font-weight: 600;

    transition:
        color 0.2s ease,
        border-color 0.2s ease;
}

.shop-size-options input:checked+span {
    color: #8d6d30;
    border-color: #a5823e;
}


/* Colour Swatches */

.shop-colour-options {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
}

.shop-colour-options label {
    cursor: pointer;
}

.shop-colour-filter {
    position: absolute;
    opacity: 0;
    pointer-events: none;
}

.colour-swatch {
    display: block;

    width: 27px;
    height: 27px;

    border: 2px solid #dddddd;
    border-radius: 50%;

    outline: 2px solid transparent;
    outline-offset: 2px;

    transition: outline-color 0.2s ease;
}

.shop-colour-filter:checked+.colour-swatch {
    outline-color: #a5823e;
}

.colour-black {
    background: #171717;
}

.colour-white {
    background: #ffffff;
}

.colour-brown {
    background: #795548;
}

.colour-blue {
    background: #344d75;
}

.colour-beige {
    background: #d8c3a5;
}

.colour-green {
    background: #49684b;
}


/* Clear Filters */

.shop-clear-filters {
    width: 100%;

    margin-top: 20px;
    padding: 12px;

    color: #111111;
    background: #ffffff;

    border: 1px solid #222222;
    border-radius: 3px;

    font-size: 13px;
    font-weight: 700;

    transition:
        color 0.3s ease,
        border-color 0.3s ease;
}

.shop-clear-filters:hover {
    color: #8d6d30;
    border-color: #a5823e;
}


/* Mobile Filter Button */

.shop-mobile-filter-btn {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;

    width: 100%;
    padding: 13px 15px;

    color: #111111;
    background: #ffffff;

    border: 1px solid #dddddd;
    border-radius: 3px;

    font-size: 13px;
    font-weight: 700;
}

.shop-mobile-filter-btn>i:first-child {
    color: #a5823e;
}


/* Toolbar */

.shop-products-toolbar {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 20px;

    margin-bottom: 25px;
    padding-bottom: 18px;

    border-bottom: 1px solid #e8e8e8;
}

.shop-category-tabs {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 8px;
}

.shop-category-tab {
    padding: 9px 12px;

    color: #555555;
    background: #ffffff;

    border: 1px solid #e3e3e3;
    border-radius: 3px;

    font-size: 12px;
    font-weight: 600;

    transition:
        color 0.2s ease,
        border-color 0.2s ease;
}

.shop-category-tab:hover,
.shop-category-tab.active {
    color: #8d6d30;
    border-color: #a5823e;
}


/* Sorting */

.shop-sort-wrapper {
    display: flex;
    align-items: center;
    gap: 9px;

    flex-shrink: 0;
}

.shop-sort-wrapper label {
    color: #777777;
    font-size: 12px;
    white-space: nowrap;
}

.shop-sort-wrapper select {
    max-width: 180px;
    padding: 10px 25px 10px 10px;

    color: #222222;
    background-color: #ffffff;

    border: 1px solid #dddddd;
    border-radius: 3px;

    font-size: 12px;
}

.shop-sort-wrapper select:focus {
    outline: none;
    border-color: #a5823e;
}


/* Product Cards */

.shop-product-card {
    height: 100%;
    overflow: hidden;

    background: #ffffff;

    border: 1px solid #eeeeee;
    border-radius: 4px;

    transition:
        box-shadow 0.3s ease,
        transform 0.3s ease;
}

.shop-product-card:hover {
    box-shadow: 0 9px 25px rgba(0, 0, 0, 0.08);
    transform: translateY(-3px);
}


/* Product Image */

.shop-product-image {
    position: relative;
    overflow: hidden;

    background: #f4f3f0;
}

.shop-product-image-link {
    display: block;
}

.shop-product-image img {
    display: block;

    width: 100%;
    aspect-ratio: 3 / 4;

    object-fit: cover;

    transition: transform 0.5s ease;
}

.shop-product-card:hover .shop-product-image img {
    transform: scale(1.04);
}


/* Product Badge */

.shop-product-badge {
    position: absolute;
    top: 11px;
    left: 10px;

    padding: 6px 9px;

    color: #111111;
    background: #e8c779;

    font-size: 10px;
    font-weight: 700;
    text-transform: uppercase;
}


/* Wishlist */

.shop-wishlist-btn {
    position: absolute;
    top: 9px;
    right: 9px;

    width: 35px;
    height: 35px;

    display: flex;
    align-items: center;
    justify-content: center;

    color: #222222;
    background: #ffffff;

    border: 1px solid #eeeeee;
    border-radius: 50%;

    font-size: 17px;

    transition:
        color 0.2s ease,
        border-color 0.2s ease;
}

.shop-wishlist-btn:hover,
.shop-wishlist-btn.is-active {
    color: #a83232;
    border-color: #a83232;
}


/* Quick View */

.shop-quick-view {
    position: absolute;
    right: 8px;
    bottom: 8px;
    left: 8px;

    padding: 10px;

    color: #111111;
    background: #ffffff;

    border: 1px solid #dddddd;
    border-radius: 2px;

    font-size: 12px;
    font-weight: 700;

    opacity: 0;
    transform: translateY(8px);

    transition:
        opacity 0.25s ease,
        transform 0.25s ease;
}

.shop-product-card:hover .shop-quick-view,
.shop-quick-view:focus-visible {
    opacity: 1;
    transform: translateY(0);
}


/* Product Information */

.shop-product-info {
    padding: 15px 13px;
}

.shop-product-category {
    display: block;

    margin-bottom: 7px;

    color: #9a7b3d;
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 0.7px;
    text-transform: uppercase;
}

.shop-product-info h3 {
    margin: 0 0 9px;

    font-size: 14px;
    font-weight: 700;
    line-height: 1.5;
}

.shop-product-info h3 a {
    color: #222222;
    text-decoration: none;
}

.shop-product-info h3 a:hover {
    color: #8d6d30;
}


/* Rating */

.shop-product-rating {
    display: flex;
    align-items: center;
    gap: 7px;

    margin-bottom: 10px;
}

.shop-product-rating span {
    color: #b18a43;
    font-size: 12px;
    letter-spacing: 1px;
}

.shop-product-rating small {
    color: #888888;
    font-size: 11px;
}


/* Price */

.shop-product-price {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 8px;

    margin-bottom: 14px;
}

.shop-product-price span {
    color: #111111;
    font-size: 16px;
    font-weight: 700;
}

.shop-product-price del {
    color: #999999;
    font-size: 12px;
}


/* Add to Cart */

.shop-add-cart {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 9px;

    width: 100%;
    min-height: 40px;
    padding: 10px;

    color: #111111;
    background: #ffffff;

    border: 1px solid #222222;
    border-radius: 3px;

    font-size: 12px;
    font-weight: 700;

    transition:
        color 0.3s ease,
        border-color 0.3s ease;
}

.shop-add-cart:hover {
    color: #8d6d30;
    border-color: #a5823e;
}


/* No Products */

.shop-no-products {
    padding: 65px 20px;

    text-align: center;

    border: 1px solid #eeeeee;
}

.shop-no-products[hidden] {
    display: none !important;
}

.shop-no-products>i {
    color: #a5823e;
    font-size: 42px;
}

.shop-no-products h3 {
    margin: 15px 0 8px;

    font-family: Georgia, "Times New Roman", serif;
    font-size: 26px;
}

.shop-no-products p {
    color: #777777;
    font-size: 14px;
}

.shop-no-products-reset {
    padding: 11px 20px;

    color: #111111;
    background: #ffffff;

    border: 1px solid #a5823e;

    font-size: 13px;
    font-weight: 700;
}


/* Product Count */

.shop-products-bottom {
    margin-top: 28px;
    padding-top: 18px;

    border-top: 1px solid #eeeeee;
}

.shop-products-bottom p {
    margin: 0;

    color: #777777;
    font-size: 13px;
}

.shop-products-bottom span {
    color: #111111;
    font-weight: 700;
}


/* ==========================================
   TABLET RESPONSIVE
========================================== */

@media (max-width: 991.98px) {

    .zyven-shop-products {
        padding: 55px 0;
    }

    .shop-products-container {
        padding-left: 22px;
        padding-right: 22px;
    }

    .shop-filter-sidebar {
        display: none;
    }

    .shop-filter-sidebar.is-open {
        display: block;
    }

    .shop-products-toolbar {
        align-items: flex-start;
        flex-direction: column;
    }

    .shop-category-tabs {
        width: 100%;
    }

    .shop-sort-wrapper {
        width: 100%;
        justify-content: flex-end;
    }

}


/* ==========================================
   MOBILE RESPONSIVE
========================================== */

@media (max-width: 575.98px) {

    .zyven-shop-products {
        padding: 40px 0;
    }

    .shop-products-container {
        padding-left: 12px;
        padding-right: 12px;
    }

    .shop-products-heading {
        align-items: flex-start;
        margin-bottom: 25px;
    }

    .shop-products-eyebrow {
        font-size: 9px;
        letter-spacing: 2px;
    }

    .shop-products-heading h2 {
        font-size: 30px;
        line-height: 1.25;
    }

    .shop-products-heading p {
        font-size: 12px;
    }

    .shop-products-count {
        gap: 5px;
        font-size: 10px;
    }

    .shop-products-count span:first-child {
        font-size: 20px;
    }

    .shop-filter-sidebar {
        padding: 18px 14px;
    }

    .shop-products-toolbar {
        gap: 16px;
        margin-bottom: 18px;
    }

    .shop-category-tabs {
        flex-wrap: nowrap;

        overflow-x: auto;
        padding-bottom: 5px;

        scrollbar-width: thin;
    }

    .shop-category-tab {
        flex-shrink: 0;

        padding: 9px 11px;

        font-size: 11px;
        white-space: nowrap;
    }

    .shop-sort-wrapper {
        justify-content: space-between;
    }

    .shop-sort-wrapper select {
        max-width: 190px;
    }

    .shop-product-info {
        padding: 11px 9px;
    }

    .shop-product-category {
        font-size: 9px;
        letter-spacing: 0.3px;
    }

    .shop-product-info h3 {
        font-size: 12px;
        line-height: 1.45;
    }

    .shop-product-rating {
        gap: 4px;
    }

    .shop-product-rating span {
        font-size: 10px;
        letter-spacing: 0;
    }

    .shop-product-rating small {
        font-size: 10px;
    }

    .shop-product-price {
        gap: 6px;
        margin-bottom: 11px;
    }

    .shop-product-price span {
        font-size: 14px;
    }

    .shop-product-price del {
        font-size: 10px;
    }

    .shop-add-cart {
        gap: 5px;
        min-height: 37px;
        padding: 8px 4px;

        font-size: 10px;
    }

    .shop-product-badge {
        top: 7px;
        left: 6px;

        padding: 5px 6px;

        font-size: 8px;
    }

    .shop-wishlist-btn {
        top: 6px;
        right: 6px;

        width: 29px;
        height: 29px;

        font-size: 14px;
    }

    .shop-quick-view {
        display: none;
    }

}

/* ========================================product-detail page========================================== */

/* ==========================================
   ZYVEN CO. PRODUCT DETAILS
========================================== */

.zyven-product-page {
    --zyven-gold: #e6bd68;
    --zyven-gold-dark: #ad873d;
    --zyven-black: #101010;
    --zyven-border: #303030;

    padding: 20px 0 60px;

    color: #ffffff;
    background: #101010;
}

.zyven-product-container {
    max-width: 1600px;

    margin: 0 auto;
    padding-left: 35px;
    padding-right: 35px;
}


/* Breadcrumb */

.zyven-product-breadcrumb {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 10px;

    margin-bottom: 25px;

    color: #b9b9b9;
    font-size: 12px;
    line-height: 1.8;
}

.zyven-product-breadcrumb a {
    color: #d0d0d0;
    text-decoration: none;

    transition: color 0.25s ease;
}

.zyven-product-breadcrumb a:hover {
    color: var(--zyven-gold);
}

.zyven-product-breadcrumb i {
    color: #777777;
    font-size: 10px;
}

.zyven-product-breadcrumb span {
    color: #ffffff;
}


/* Main Layout */

.zyven-product-layout {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    align-items: start;
    gap: 35px;
}


/* ==========================================
   PRODUCT GALLERY
========================================== */

.zyven-product-gallery {
    display: grid;
    grid-template-columns: 76px minmax(0, 1fr);
    align-items: start;
    gap: 14px;

    min-width: 0;
}

.zyven-product-thumbnails {
    display: flex;
    flex-direction: column;
    gap: 10px;
}

.zyven-product-thumb {
    display: block;

    width: 100%;
    aspect-ratio: 3 / 4;

    padding: 3px;

    overflow: hidden;

    background: #191919;

    border: 1px solid #3c3c3c;
    border-radius: 4px;

    cursor: pointer;

    transition: border-color 0.25s ease;
}

.zyven-product-thumb.active,
.zyven-product-thumb:hover {
    border-color: var(--zyven-gold);
}

.zyven-product-thumb img {
    display: block;

    width: 100%;
    height: 100%;

    object-fit: cover;

    border-radius: 2px;
}


/* Main Image */

.zyven-product-main-image {
    position: relative;

    width: 100%;
    aspect-ratio: 3 / 4;

    overflow: hidden;

    background: #1b1b1b;

    border: 1px solid #3a3327;
    border-radius: 5px;
}

.zyven-product-main-image>img {
    display: block;

    width: 100%;
    height: 100%;

    object-fit: cover;

    transition: opacity 0.25s ease;
}


/* Premium Badge */

.zyven-product-badge {
    position: absolute;
    top: 18px;
    left: 18px;
    z-index: 2;

    padding: 9px 14px;

    color: #111111;
    background: var(--zyven-gold);

    font-size: 11px;
    font-weight: 800;
    letter-spacing: 1px;
}


/* Gallery Wishlist */

.zyven-product-gallery-wishlist {
    position: absolute;
    top: 15px;
    right: 15px;
    z-index: 2;

    width: 42px;
    height: 42px;

    display: flex;
    align-items: center;
    justify-content: center;

    color: #171717;
    background: #ffffff;

    border: 1px solid #ddd8ce;
    border-radius: 50%;

    font-size: 20px;

    transition: 0.25s ease;
}

.zyven-product-gallery-wishlist:hover,
.zyven-product-gallery-wishlist.is-active {
    color: var(--zyven-gold);
    border-color: var(--zyven-gold);
}


/* Image Zoom Button */

.zyven-product-zoom {
    position: absolute;
    right: 14px;
    bottom: 14px;
    z-index: 2;

    width: 39px;
    height: 39px;

    display: flex;
    align-items: center;
    justify-content: center;

    color: #ffffff;
    background: rgba(0, 0, 0, 0.65);

    border: 1px solid #777777;
    border-radius: 4px;

    font-size: 17px;

    transition: 0.25s ease;
}

.zyven-product-zoom:hover {
    color: #111111;
    background: var(--zyven-gold);
    border-color: var(--zyven-gold);
}


/* ==========================================
   PRODUCT INFORMATION
========================================== */

.zyven-product-info {
    min-width: 0;
    padding-top: 2px;
}

.zyven-product-category {
    margin-bottom: 12px;

    color: var(--zyven-gold);
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 4px;
}


/* Title */

.zyven-product-title-row {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 15px;

    margin-bottom: 12px;
}

.zyven-product-title-row h1 {
    margin: 0;

    color: #ffffff;
    font-family: Georgia, "Times New Roman", serif;
    font-size: clamp(30px, 3vw, 44px);
    font-weight: 700;
    line-height: 1.18;
}

.zyven-product-sku {
    flex-shrink: 0;
    padding-top: 8px;

    color: #a8a8a8;
    font-size: 10px;
}


/* Rating */

.zyven-product-rating {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 8px;

    margin-bottom: 20px;

    color: #dddddd;
    font-size: 13px;
}

.zyven-product-stars {
    display: flex;
    gap: 2px;

    color: var(--zyven-gold);
    font-size: 16px;
}

.zyven-product-rating a {
    color: #bdbdbd;
    text-decoration: none;
}

.zyven-product-rating a:hover {
    color: var(--zyven-gold);
}


/* Price */

.zyven-product-price-row {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 15px;

    margin-bottom: 17px;
}

.zyven-product-current-price {
    color: var(--zyven-gold);
    font-size: 31px;
    font-weight: 800;
}

.zyven-product-old-price {
    color: #a4a4a4;
    font-size: 15px;
}

.zyven-product-discount {
    padding: 7px 10px;

    color: #111111;
    background: var(--zyven-gold);

    border-radius: 3px;

    font-size: 11px;
    font-weight: 800;
}


/* Description */

.zyven-product-short-description {
    max-width: 620px;

    margin: 0 0 25px;

    color: #c7c7c7;
    font-size: 14px;
    line-height: 1.8;
}


/* Option Heading */

.zyven-product-option {
    margin-bottom: 23px;
}

.zyven-product-option-heading {
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 12px;

    margin-bottom: 13px;

    color: #ffffff;
    font-size: 13px;
    font-weight: 600;
}


/* ==========================================
   COLOUR SELECTION
========================================== */

.zyven-product-colours {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 12px;
}

.zyven-colour-option {
    width: 43px;
    height: 43px;

    padding: 0;

    background: var(--product-colour);

    border: 2px solid #555555;
    border-radius: 50%;

    box-shadow: inset 0 0 0 3px #101010;

    cursor: pointer;

    transition:
        border-color 0.25s ease,
        transform 0.25s ease;
}

.zyven-colour-option:hover {
    transform: scale(1.05);
}

.zyven-colour-option.active {
    border-color: var(--zyven-gold);
    outline: 1px solid var(--zyven-gold);
    outline-offset: 3px;
}


/* ==========================================
   SIZE SELECTION
========================================== */

.zyven-product-size-section {
    margin-bottom: 24px;
}

.zyven-size-guide {
    display: inline-flex;
    align-items: center;
    gap: 7px;

    padding: 0;

    color: var(--zyven-gold);
    background: transparent;

    border: 0;
    border-bottom: 1px solid var(--zyven-gold);

    font-size: 12px;
    font-weight: 600;
}

.zyven-product-sizes {
    display: flex;
    flex-wrap: wrap;
    gap: 9px;
}

.zyven-size-option {
    min-width: 45px;
    height: 42px;

    padding: 0 12px;

    color: #ffffff;
    background: #101010;

    border: 1px solid #4a4a4a;
    border-radius: 3px;

    font-size: 12px;
    font-weight: 600;

    cursor: pointer;

    transition:
        color 0.25s ease,
        background 0.25s ease,
        border-color 0.25s ease;
}

.zyven-size-option:hover,
.zyven-size-option.active {
    color: #111111;
    background: var(--zyven-gold);
    border-color: var(--zyven-gold);
}

.zyven-product-size-message {
    min-height: 0;

    margin: 9px 0 0;

    color: var(--zyven-gold);
    font-size: 12px;
}


/* ==========================================
   QUANTITY & STOCK
========================================== */

.zyven-product-quantity-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 20px;

    margin-bottom: 24px;
}

.zyven-product-quantity {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 15px;

    color: #ffffff;
    font-size: 13px;
    font-weight: 600;
}

.zyven-quantity-control {
    display: flex;
    align-items: center;

    height: 40px;

    border: 1px solid #444444;
    border-radius: 3px;

    overflow: hidden;
}

.zyven-quantity-control button {
    width: 39px;
    height: 100%;

    color: #171717;
    background: #ffffff;

    border: 0;

    font-size: 16px;

    transition: background 0.25s ease;
}

.zyven-quantity-control button:hover {
    color: #111111;
    background: var(--zyven-gold);
}

.zyven-quantity-control input {
    width: 42px;
    height: 100%;

    padding: 0;

    color: #ffffff;
    background: #101010;

    border: 0;
    border-right: 1px solid #444444;
    border-left: 1px solid #444444;

    text-align: center;
    font-size: 13px;

    appearance: textfield;
}

.zyven-quantity-control input::-webkit-inner-spin-button,
.zyven-quantity-control input::-webkit-outer-spin-button {
    margin: 0;
    appearance: none;
}


/* Stock */

.zyven-product-stock {
    display: flex;
    align-items: flex-start;
    gap: 9px;
}

.zyven-stock-indicator {
    width: 10px;
    height: 10px;

    flex-shrink: 0;

    margin-top: 5px;

    background: #c9a45c;
    border-radius: 50%;
}

.zyven-product-stock strong {
    display: block;

    color: #8d6d30;
    font-size: 13px;
    font-weight: 700;
}

.zyven-product-stock p {
    margin: 3px 0 0;

    color: #b7b7b7;
    font-size: 11px;
}


/* ==========================================
   PURCHASE BUTTONS
========================================== */

.zyven-product-actions {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    gap: 12px;

    margin-bottom: 10px;
}

.zyven-add-to-cart,
.zyven-buy-now {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 10px;

    min-height: 51px;

    padding: 12px 15px;

    border: 1px solid var(--zyven-gold);
    border-radius: 4px;

    font-size: 13px;
    font-weight: 700;

    transition:
        color 0.25s ease,
        background 0.25s ease,
        border-color 0.25s ease;
}

.zyven-add-to-cart {
    color: #111111;
    background: var(--zyven-gold);
}

.zyven-add-to-cart:hover {
    color: #111111;
    background: #f4d894;
}

.zyven-buy-now {
    color: #171717;
    background: #ffffff;
}

.zyven-buy-now i {
    color: var(--zyven-gold);
}

.zyven-buy-now:hover {
    color: #111111;
    background: var(--zyven-gold);
}

.zyven-buy-now:hover i {
    color: #111111;
}

.zyven-product-action-message {
    min-height: 0;

    margin: 0 0 15px;

    color: var(--zyven-gold);
    font-size: 12px;
    line-height: 1.6;
}


/* ==========================================
   BENEFITS
========================================== */

.zyven-product-benefits {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 20px 14px;

    margin-top: 25px;
    padding-top: 22px;

    border-top: 1px solid #2d2d2d;
}

.zyven-benefit-item {
    display: flex;
    align-items: center;
    gap: 11px;

    min-width: 0;
}

.zyven-benefit-item>i {
    flex-shrink: 0;

    color: var(--zyven-gold);
    font-size: 25px;
}

.zyven-benefit-item strong {
    display: block;

    margin-bottom: 4px;

    color: #ffffff;
    font-size: 11px;
    font-weight: 700;
}

.zyven-benefit-item span {
    display: block;

    color: #aaaaaa;
    font-size: 10px;
    line-height: 1.5;
}


/* ==========================================
   IMAGE ZOOM MODAL
========================================== */

.zyven-product-image-modal {
    position: fixed;
    inset: 0;
    z-index: 9999;

    display: none;
    align-items: center;
    justify-content: center;

    padding: 30px;

    background: rgba(0, 0, 0, 0.94);
}

.zyven-product-image-modal.is-open {
    display: flex;
}

.zyven-product-image-modal>img {
    display: block;

    max-width: min(100%, 800px);
    max-height: 85vh;

    object-fit: contain;
}

.zyven-modal-close {
    position: absolute;
    top: 20px;
    right: 25px;

    width: 42px;
    height: 42px;

    display: flex;
    align-items: center;
    justify-content: center;

    color: #ffffff;
    background: #171717;

    border: 1px solid #666666;
    border-radius: 50%;

    font-size: 18px;
}


/* ==========================================
   TABLET RESPONSIVE
========================================== */

@media (max-width: 991.98px) {

    .zyven-product-container {
        padding-left: 22px;
        padding-right: 22px;
    }

    .zyven-product-layout {
        grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
        gap: 22px;
    }

    .zyven-product-gallery {
        grid-template-columns: 58px minmax(0, 1fr);
        gap: 9px;
    }

    .zyven-product-title-row {
        flex-direction: column;
        gap: 5px;
    }

    .zyven-product-title-row h1 {
        font-size: 31px;
    }

    .zyven-product-sku {
        padding-top: 0;
    }

    .zyven-product-current-price {
        font-size: 27px;
    }

    .zyven-product-benefits {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

}


/* ==========================================
   MOBILE RESPONSIVE
========================================== */

@media (max-width: 767.98px) {

    .zyven-product-page {
        padding: 16px 0 40px;
    }

    .zyven-product-container {
        padding-left: 15px;
        padding-right: 15px;
    }

    .zyven-product-breadcrumb {
        gap: 7px;

        margin-bottom: 18px;

        font-size: 10px;
    }

    .zyven-product-layout {
        grid-template-columns: minmax(0, 1fr);
        gap: 27px;
    }

    /* Gallery */

    .zyven-product-gallery {
        grid-template-columns: 58px minmax(0, 1fr);
        gap: 10px;
    }

    .zyven-product-thumbnails {
        gap: 8px;
    }

    .zyven-product-thumb {
        border-radius: 3px;
    }

    .zyven-product-main-image {
        aspect-ratio: 4 / 5;
    }

    .zyven-product-badge {
        top: 10px;
        left: 10px;

        padding: 7px 9px;

        font-size: 9px;
    }

    .zyven-product-gallery-wishlist {
        top: 9px;
        right: 9px;

        width: 34px;
        height: 34px;

        font-size: 17px;
    }

    .zyven-product-zoom {
        right: 9px;
        bottom: 9px;

        width: 33px;
        height: 33px;

        font-size: 14px;
    }

    /* Product Information */

    .zyven-product-category {
        margin-bottom: 9px;

        font-size: 10px;
        letter-spacing: 3px;
    }

    .zyven-product-title-row {
        flex-direction: column;
        gap: 7px;

        margin-bottom: 10px;
    }

    .zyven-product-title-row h1 {
        font-size: clamp(28px, 7vw, 36px);
        line-height: 1.2;
    }

    .zyven-product-sku {
        font-size: 10px;
    }

    .zyven-product-rating {
        gap: 7px;
        margin-bottom: 17px;

        font-size: 12px;
    }

    .zyven-product-stars {
        font-size: 14px;
    }

    .zyven-product-price-row {
        gap: 11px;
        margin-bottom: 14px;
    }

    .zyven-product-current-price {
        font-size: 29px;
    }

    .zyven-product-old-price {
        font-size: 13px;
    }

    .zyven-product-discount {
        padding: 6px 8px;
        font-size: 10px;
    }

    .zyven-product-short-description {
        margin-bottom: 22px;

        font-size: 13px;
        line-height: 1.8;
    }

    .zyven-product-option {
        margin-bottom: 23px;
    }

    .zyven-product-option-heading {
        margin-bottom: 14px;
        font-size: 13px;
    }

    .zyven-colour-option {
        width: 39px;
        height: 39px;
    }

    .zyven-product-size-section {
        margin-bottom: 23px;
    }

    .zyven-product-sizes {
        gap: 8px;
    }

    .zyven-size-option {
        min-width: 42px;
        height: 40px;
        padding: 0 10px;
    }

    .zyven-product-quantity-row {
        align-items: flex-start;
        gap: 17px;

        margin-bottom: 22px;
    }

    .zyven-product-quantity {
        gap: 9px;
    }

    .zyven-quantity-control {
        height: 38px;
    }

    .zyven-quantity-control button {
        width: 34px;
    }

    .zyven-quantity-control input {
        width: 34px;
    }

    .zyven-product-stock strong {
        font-size: 12px;
    }

    .zyven-product-stock p {
        font-size: 10px;
    }

    .zyven-product-actions {
        grid-template-columns: minmax(0, 1fr);
        gap: 10px;
    }

    .zyven-add-to-cart,
    .zyven-buy-now {
        min-height: 49px;
        font-size: 13px;
    }

    .zyven-product-benefits {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 18px 12px;

        margin-top: 22px;
        padding-top: 20px;
    }

    .zyven-benefit-item {
        gap: 8px;
    }

    .zyven-benefit-item>i {
        font-size: 22px;
    }

    .zyven-benefit-item strong {
        font-size: 10px;
    }

    .zyven-benefit-item span {
        font-size: 9px;
    }

}


/* Extra Small Phones */

@media (max-width: 360px) {

    .zyven-product-container {
        padding-left: 10px;
        padding-right: 10px;
    }

    .zyven-product-gallery {
        grid-template-columns: 46px minmax(0, 1fr);
        gap: 7px;
    }

    .zyven-product-thumbnails {
        gap: 6px;
    }

    .zyven-product-title-row h1 {
        font-size: 27px;
    }

    .zyven-product-current-price {
        font-size: 26px;
    }

    .zyven-product-quantity-row {
        flex-direction: column;
        align-items: flex-start;
    }

}


/* Reduced Motion */

@media (prefers-reduced-motion: reduce) {

    .zyven-product-page *,
    .zyven-product-image-modal * {
        scroll-behavior: auto !important;
        transition: none !important;
        animation: none !important;
    }

}


/* ==========================================
   ZYVEN CO. PRODUCT INFORMATION SECTION
========================================== */

.zyven-product-details-info {
    --info-gold: #e6bd68;
    --info-border: #303030;

    padding: 0 35px 55px;

    color: #ffffff;
    background: #101010;
}

.zyven-details-info-container {
    display: grid;
    grid-template-columns: minmax(250px, 315px) minmax(0, 1fr);
    gap: 20px;

    max-width: 1530px;
    margin: 0 auto;
}


/* ==========================================
   LEFT TABS
========================================== */

.zyven-details-tabs {
    align-self: start;

    overflow: hidden;

    border: 1px solid var(--info-border);
    border-radius: 5px;
}

.zyven-details-tab {
    position: relative;

    display: flex;
    align-items: center;
    gap: 13px;

    width: 100%;
    min-height: 45px;

    padding: 13px 17px;

    color: #e5e5e5;
    background: #101010;

    border: 0;
    border-bottom: 1px solid #292929;

    font-size: 13px;
    font-weight: 500;
    text-align: left;

    transition:
        color 0.25s ease,
        background 0.25s ease;
}

.zyven-details-tab:last-child {
    border-bottom: 0;
}

.zyven-details-tab>i:first-child {
    flex-shrink: 0;

    color: #d0d0d0;
    font-size: 19px;
}

.zyven-details-tab>span {
    flex: 1;
}

.zyven-details-tab .zyven-tab-arrow {
    color: #b9b9b9;
    font-size: 12px;

    transition: transform 0.25s ease;
}

.zyven-details-tab:hover {
    color: var(--info-gold);
    background: #181611;
}

.zyven-details-tab:hover>i:first-child {
    color: var(--info-gold);
}

.zyven-details-tab.active {
    color: var(--info-gold);
    background: #1b1811;

    box-shadow: inset 3px 0 0 var(--info-gold);
    font-weight: 700;
}

.zyven-details-tab.active>i:first-child,
.zyven-details-tab.active .zyven-tab-arrow {
    color: var(--info-gold);
}

.zyven-details-tab.active .zyven-tab-arrow {
    transform: translateX(3px);
}

.zyven-details-tab:focus-visible {
    outline: 2px solid var(--info-gold);
    outline-offset: -3px;
}


/* ==========================================
   RIGHT CONTENT PANEL
========================================== */

.zyven-details-content {
    min-width: 0;
}

.zyven-details-panel {
    min-height: 100%;
    padding: 25px 27px;

    background:
        linear-gradient(135deg,
            rgba(230, 189, 104, 0.025),
            transparent 50%),
        #101010;

    border: 1px solid var(--info-border);
    border-radius: 5px;

    animation: zyvenInfoFade 0.3s ease;
}

.zyven-details-panel[hidden] {
    display: none !important;
}

@keyframes zyvenInfoFade {
    from {
        opacity: 0;
        transform: translateY(5px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}

.zyven-details-eyebrow {
    display: block;

    margin-bottom: 9px;

    color: var(--info-gold);
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 2px;
}

.zyven-details-panel>h2 {
    margin: 0 0 13px;

    color: #ffffff;
    font-family: Georgia, "Times New Roman", serif;
    font-size: 28px;
    font-weight: 700;
    line-height: 1.3;
}

.zyven-details-intro {
    margin: 0 0 19px;

    color: #c6c6c6;
    font-size: 13px;
    line-height: 1.85;
}


/* ==========================================
   DESCRIPTION FEATURES
========================================== */

.zyven-details-feature-list {
    display: grid;
    gap: 10px;

    margin: 0 0 24px;
    padding: 0;

    list-style: none;
}

.zyven-details-feature-list li {
    display: flex;
    align-items: flex-start;
    gap: 10px;

    color: #d3d3d3;
    font-size: 13px;
    line-height: 1.7;
}

.zyven-details-feature-list li i {
    flex-shrink: 0;

    margin-top: 3px;

    color: var(--info-gold);
    font-size: 14px;
}


/* Highlight Card */

.zyven-details-highlight {
    display: flex;
    align-items: flex-start;
    gap: 15px;

    padding: 16px;

    background: rgba(230, 189, 104, 0.055);

    border: 1px solid rgba(230, 189, 104, 0.2);
    border-radius: 4px;
}

.zyven-details-highlight>i {
    flex-shrink: 0;

    color: var(--info-gold);
    font-size: 24px;
}

.zyven-details-highlight h3 {
    margin: 0 0 6px;

    color: #ffffff;
    font-size: 14px;
    font-weight: 700;
}

.zyven-details-highlight p {
    margin: 0;

    color: #bdbdbd;
    font-size: 12px;
    line-height: 1.7;
}


/* ==========================================
   SPECIFICATIONS
========================================== */

.zyven-specifications-table {
    border-top: 1px solid #333333;
}

.zyven-specification-row {
    display: grid;
    grid-template-columns: minmax(120px, 0.8fr) minmax(0, 1.2fr);
    gap: 15px;

    padding: 13px 10px;

    border-bottom: 1px solid #2d2d2d;
}

.zyven-specification-row:nth-child(odd) {
    background: rgba(255, 255, 255, 0.018);
}

.zyven-specification-row span {
    color: #a9a9a9;
    font-size: 12px;
    line-height: 1.6;
}

.zyven-specification-row strong {
    color: #eeeeee;
    font-size: 12px;
    font-weight: 600;
    line-height: 1.6;
}

.zyven-details-note {
    margin: 17px 0 0;

    color: #a9a9a9;
    font-size: 11px;
    line-height: 1.8;
}


/* ==========================================
   SIZE & FIT
========================================== */

.zyven-size-fit-card {
    display: flex;
    align-items: flex-start;
    gap: 15px;

    margin-bottom: 24px;
    padding: 17px;

    background: #171717;

    border: 1px solid #333333;
    border-radius: 4px;
}

.zyven-size-fit-icon {
    flex-shrink: 0;

    width: 43px;
    height: 43px;

    display: flex;
    align-items: center;
    justify-content: center;

    color: var(--info-gold);
    background: #252015;

    border-radius: 4px;

    font-size: 24px;
}

.zyven-size-fit-card h3 {
    margin: 0 0 6px;

    color: #ffffff;
    font-size: 14px;
    font-weight: 700;
}

.zyven-size-fit-card p {
    margin: 0;

    color: #bcbcbc;
    font-size: 12px;
    line-height: 1.7;
}

.zyven-size-chart-wrapper>h3 {
    margin: 0 0 13px;

    color: #ffffff;
    font-size: 15px;
    font-weight: 700;
}

.zyven-size-chart-scroll {
    width: 100%;
    overflow-x: auto;
}

.zyven-size-chart {
    width: 100%;
    min-width: 440px;

    border-collapse: collapse;
}

.zyven-size-chart th,
.zyven-size-chart td {
    padding: 12px 10px;

    border: 1px solid #333333;

    text-align: left;
    font-size: 11px;
}

.zyven-size-chart th {
    color: var(--info-gold);
    background: #1a1812;

    font-weight: 700;
}

.zyven-size-chart td {
    color: #d1d1d1;
    background: #111111;
}


/* ==========================================
   CARE INSTRUCTIONS
========================================== */

.zyven-care-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 13px;

    margin-bottom: 22px;
}

.zyven-care-item {
    padding: 19px 16px;

    background: #171717;

    border: 1px solid #303030;
    border-radius: 4px;

    transition:
        border-color 0.25s ease,
        transform 0.25s ease;
}

.zyven-care-item:hover {
    border-color: rgba(230, 189, 104, 0.5);
    transform: translateY(-2px);
}

.zyven-care-item>i {
    display: inline-block;

    margin-bottom: 12px;

    color: var(--info-gold);
    font-size: 25px;
}

.zyven-care-item h3 {
    margin: 0 0 8px;

    color: #ffffff;
    font-size: 14px;
    font-weight: 700;
}

.zyven-care-item p {
    margin: 0;

    color: #bcbcbc;
    font-size: 12px;
    line-height: 1.8;
}


/* ==========================================
   DELIVERY & RETURNS
========================================== */

.zyven-delivery-list {
    display: grid;
    gap: 0;
}

.zyven-delivery-item {
    display: flex;
    align-items: flex-start;
    gap: 15px;

    padding: 17px 0;

    border-bottom: 1px solid #303030;
}

.zyven-delivery-item:first-child {
    padding-top: 0;
}

.zyven-delivery-icon {
    flex-shrink: 0;

    width: 43px;
    height: 43px;

    display: flex;
    align-items: center;
    justify-content: center;

    color: var(--info-gold);
    background: #1d1a13;

    border: 1px solid #393020;
    border-radius: 4px;

    font-size: 21px;
}

.zyven-delivery-item h3 {
    margin: 1px 0 6px;

    color: #ffffff;
    font-size: 14px;
    font-weight: 700;
}

.zyven-delivery-item p {
    margin: 0;

    color: #bdbdbd;
    font-size: 12px;
    line-height: 1.8;
}


/* ==========================================
   TABLET RESPONSIVE
========================================== */

@media (max-width: 991.98px) {

    .zyven-product-details-info {
        padding-left: 22px;
        padding-right: 22px;
    }

    .zyven-details-info-container {
        grid-template-columns: minmax(220px, 0.8fr) minmax(0, 1.2fr);
        gap: 15px;
    }

    .zyven-details-tab {
        gap: 9px;
        padding: 12px;
        font-size: 12px;
    }

    .zyven-details-panel {
        padding: 22px 20px;
    }

    .zyven-details-panel>h2 {
        font-size: 25px;
    }

}


/* ==========================================
   MOBILE RESPONSIVE
========================================== */

@media (max-width: 767.98px) {

    .zyven-product-details-info {
        padding: 0 15px 40px;
    }

    .zyven-details-info-container {
        grid-template-columns: minmax(0, 1fr);
        gap: 15px;
    }

    /* Horizontally scrollable tabs */

    .zyven-details-tabs {
        display: flex;

        width: 100%;

        overflow-x: auto;
        overflow-y: hidden;

        border-radius: 4px;

        scrollbar-width: thin;
        scrollbar-color: #65512d #171717;
    }

    .zyven-details-tab {
        flex: 0 0 auto;

        width: auto;
        min-height: 46px;

        gap: 8px;

        padding: 12px 14px;

        border-right: 1px solid #292929;
        border-bottom: 0;

        white-space: nowrap;

        font-size: 12px;
    }

    .zyven-details-tab>i:first-child {
        font-size: 16px;
    }

    .zyven-details-tab .zyven-tab-arrow {
        display: none;
    }

    .zyven-details-tab.active {
        box-shadow: inset 0 -3px 0 var(--info-gold);
    }

    .zyven-details-panel {
        padding: 21px 17px;
    }

    .zyven-details-eyebrow {
        font-size: 9px;
        letter-spacing: 1.6px;
    }

    .zyven-details-panel>h2 {
        font-size: 25px;
    }

    .zyven-details-intro {
        font-size: 12px;
        line-height: 1.8;
    }

    .zyven-details-feature-list {
        gap: 12px;
    }

    .zyven-details-feature-list li {
        font-size: 12px;
    }

    .zyven-details-highlight {
        gap: 11px;
        padding: 13px;
    }

    .zyven-details-highlight>i {
        font-size: 21px;
    }

    .zyven-details-highlight h3 {
        font-size: 13px;
    }

    .zyven-details-highlight p {
        font-size: 11px;
    }

    .zyven-specification-row {
        grid-template-columns: minmax(95px, 0.8fr) minmax(0, 1.2fr);
        gap: 10px;
        padding: 12px 8px;
    }

    .zyven-specification-row span,
    .zyven-specification-row strong {
        font-size: 11px;
        overflow-wrap: anywhere;
    }

    .zyven-size-fit-card {
        gap: 12px;
        padding: 13px;
    }

    .zyven-size-fit-icon {
        width: 38px;
        height: 38px;
        font-size: 21px;
    }

    .zyven-care-grid {
        gap: 10px;
    }

    .zyven-care-item {
        padding: 15px 12px;
    }

    .zyven-care-item>i {
        font-size: 22px;
    }

    .zyven-care-item h3 {
        font-size: 13px;
    }

    .zyven-care-item p {
        font-size: 11px;
        line-height: 1.7;
    }

    .zyven-delivery-item {
        gap: 11px;
        padding: 15px 0;
    }

    .zyven-delivery-icon {
        width: 37px;
        height: 37px;
        font-size: 18px;
    }

    .zyven-delivery-item h3 {
        font-size: 13px;
    }

    .zyven-delivery-item p {
        font-size: 11px;
    }

}


/* Extra Small Phones */

@media (max-width: 360px) {

    .zyven-product-details-info {
        padding-left: 10px;
        padding-right: 10px;
    }

    .zyven-details-panel {
        padding: 17px 12px;
    }

    .zyven-details-tab {
        padding: 11px;
        font-size: 11px;
    }

    .zyven-care-grid {
        grid-template-columns: minmax(0, 1fr);
    }

}


/* Reduced Motion */

@media (prefers-reduced-motion: reduce) {

    .zyven-details-panel,
    .zyven-care-item,
    .zyven-details-tab {
        animation: none !important;
        transition: none !important;
    }

}


/* ==========================================
   ZYVEN CO. RELATED PRODUCTS
========================================== */

.zyven-related-products {
    padding: 10px 35px 65px;

    color: #171717;
    background: #ffffff;
}

.zyven-related-container {
    max-width: 1530px;
    margin: 0 auto;
}


/* Heading */

.zyven-related-heading {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 20px;

    margin-bottom: 25px;
}

.zyven-related-eyebrow {
    display: block;

    margin-bottom: 8px;

    color: #8d6d30;
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 2.5px;
}

.zyven-related-heading h2 {
    margin: 0 0 8px;

    color: #171717;
    font-family: Georgia, "Times New Roman", serif;
    font-size: clamp(28px, 3vw, 37px);
    font-weight: 700;
}

.zyven-related-heading h2 span {
    color: #8d6d30;
}

.zyven-related-heading p {
    margin: 0;

    color: #666666;
    font-size: 12px;
    line-height: 1.7;
}


/* Navigation */

.zyven-related-navigation {
    display: flex;
    align-items: center;
    gap: 9px;

    flex-shrink: 0;
}

.zyven-related-view-all {
    display: inline-flex;
    align-items: center;
    gap: 8px;

    margin-right: 10px;
    padding: 8px 0;

    color: #8d6d30;
    background: transparent;

    font-size: 12px;
    font-weight: 700;
    text-decoration: none;

    transition: color 0.25s ease;
}

.zyven-related-view-all:hover {
    color: #8d6d30;
}

.zyven-related-arrow {
    width: 36px;
    height: 36px;

    display: flex;
    align-items: center;
    justify-content: center;

    color: #171717;
    background: #ffffff;

    border: 1px solid #ddd8ce;
    border-radius: 50%;

    font-size: 13px;

    transition: 0.25s ease;
}

.zyven-related-arrow:hover {
    color: #111111;
    background: #ffffff;
    border-color: #e6bd68;
}


/* Product Grid */

.zyven-related-grid {
    display: grid;
    grid-template-columns: repeat(5, minmax(0, 1fr));
    gap: 16px;
}


/* Product Card */

.zyven-related-card {
    position: relative;

    min-width: 0;
    overflow: hidden;

    background: #ffffff;

    border: 1px solid #e7e3da;
    border-radius: 5px;

    transition:
        border-color 0.3s ease,
        transform 0.3s ease;
}

.zyven-related-card:hover {
    border-color: #a9884c;
    transform: translateY(-3px);
}


/* Product Image */

.zyven-related-image {
    position: relative;

    display: block;

    width: 100%;
    aspect-ratio: 3 / 4;

    overflow: hidden;

    background: #f4f3f0;
}

.zyven-related-image img {
    display: block;

    width: 100%;
    height: 100%;

    object-fit: cover;

    transition: transform 0.5s ease;
}

.zyven-related-card:hover .zyven-related-image img {
    transform: scale(1.045);
}


/* Badges */

.zyven-related-badge {
    position: absolute;
    top: 10px;
    left: 9px;
    z-index: 1;

    padding: 6px 8px;

    color: #111111;
    background: #e6bd68;

    font-size: 9px;
    font-weight: 800;
    letter-spacing: 0.5px;
}

.zyven-related-badge.premium {
    color: #111111;
    background: #f0d18c;
}


/* Wishlist */

.zyven-related-wishlist {
    position: absolute;
    top: 9px;
    right: 9px;
    z-index: 2;

    width: 34px;
    height: 34px;

    display: flex;
    align-items: center;
    justify-content: center;

    color: #171717;
    background: #ffffff;

    border: 1px solid #ddd8ce;
    border-radius: 50%;

    font-size: 16px;

    transition: 0.25s ease;
}

.zyven-related-wishlist:hover,
.zyven-related-wishlist.is-active {
    color: #111111;
    background: #e6bd68;
    border-color: #e6bd68;
}


/* Product Information */

.zyven-related-info {
    padding: 14px 12px 12px;
}

.zyven-related-category {
    display: block;

    margin-bottom: 7px;

    color: #8d6d30;
    font-size: 9px;
    font-weight: 700;
    letter-spacing: 1px;
}

.zyven-related-info h3 {
    margin: 0 0 8px;

    font-size: 13px;
    font-weight: 600;
    line-height: 1.5;
}

.zyven-related-info h3 a {
    color: #222222;
    text-decoration: none;

    transition: color 0.25s ease;
}

.zyven-related-info h3 a:hover {
    color: #e6bd68;
}


/* Rating */

.zyven-related-rating {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 5px;

    margin-bottom: 9px;

    color: #a5823e;
    font-size: 11px;
}

.zyven-related-rating>i {
    font-size: 11px;
}

.zyven-related-reviews {
    color: #999999;
    font-size: 10px;
}


/* Price */

.zyven-related-price {
    display: flex;
    align-items: center;
    gap: 8px;

    margin-bottom: 11px;

    color: #8d6d30;
    font-size: 17px;
    font-weight: 800;
}


/* Colour Swatches */

.zyven-related-swatches {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 8px;

    margin-bottom: 13px;
}

.zyven-related-swatch {
    width: 17px;
    height: 17px;

    padding: 0;

    background: var(--swatch-color);

    border: 1px solid #777777;
    border-radius: 50%;

    box-shadow: inset 0 0 0 2px #ffffff;

    cursor: pointer;

    transition:
        outline-color 0.25s ease,
        transform 0.25s ease;
}

.zyven-related-swatch:hover {
    transform: scale(1.1);
}

.zyven-related-swatch.active {
    outline: 1px solid #e6bd68;
    outline-offset: 2px;
}


/* Quick Add */

.zyven-related-add {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;

    width: 100%;
    min-height: 37px;

    padding: 9px 7px;

    color: #171717;
    background: #ffffff;

    border: 1px solid #65502b;
    border-radius: 3px;

    font-size: 11px;
    font-weight: 700;

    transition: 0.25s ease;
}

.zyven-related-add:hover {
    color: #111111;
    background: #e6bd68;
    border-color: #e6bd68;
}


/* ==========================================
   TABLET RESPONSIVE
========================================== */

@media (max-width: 1100px) {

    .zyven-related-products {
        padding-right: 22px;
        padding-left: 22px;
    }

    .zyven-related-grid {
        grid-template-columns: repeat(3, minmax(0, 1fr));
        gap: 14px;
    }

}


/* ==========================================
   MOBILE RESPONSIVE
========================================== */

@media (max-width: 767.98px) {

    .zyven-related-products {
        padding: 10px 15px 45px;
    }

    .zyven-related-heading {
        align-items: flex-start;
        flex-direction: column;
        gap: 15px;

        margin-bottom: 20px;
    }

    .zyven-related-heading h2 {
        font-size: 29px;
    }

    .zyven-related-heading p {
        font-size: 11px;
    }

    .zyven-related-navigation {
        width: 100%;
        justify-content: flex-end;
    }

    .zyven-related-view-all {
        margin-right: auto;
    }

    .zyven-related-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 13px;
    }

    .zyven-related-info {
        padding: 11px 9px;
    }

    .zyven-related-category {
        font-size: 8px;
        letter-spacing: 0.7px;
    }

    .zyven-related-info h3 {
        font-size: 12px;
    }

    .zyven-related-price {
        font-size: 15px;
    }

    .zyven-related-wishlist {
        top: 7px;
        right: 7px;

        width: 30px;
        height: 30px;

        font-size: 14px;
    }

    .zyven-related-badge {
        top: 7px;
        left: 6px;

        padding: 5px 6px;
        font-size: 8px;
    }

    .zyven-related-add {
        min-height: 35px;
        font-size: 10px;
    }

}


/* Extra Small Phones */

@media (max-width: 360px) {

    .zyven-related-products {
        padding-right: 10px;
        padding-left: 10px;
    }

    .zyven-related-grid {
        gap: 9px;
    }

    .zyven-related-info {
        padding: 9px 7px;
    }

    .zyven-related-info h3 {
        font-size: 11px;
    }

    .zyven-related-price {
        font-size: 14px;
    }

}


/* Reduced Motion */

@media (prefers-reduced-motion: reduce) {

    .zyven-related-card,
    .zyven-related-image img,
    .zyven-related-wishlist,
    .zyven-related-add {
        transition: none;
    }

}

/* =========================================product detail page ends  ============================================== */

/* =========================================================
   ZYVEN CO. WOMEN'S COLLECTION — alternating black / ivory UI
   Scoped to .wc-page to protect all other pages.
========================================================= */
.wc-page {
    --wc-black: #080909;
    --wc-black2: #101111;
    --wc-gold: #f2bd4d;
    --wc-ivory: #f8f6f1;
    --wc-ink: #111;
    --wc-muted: #a7a7a7;
    color: var(--wc-ink);
    font-family: 'Montserrat', sans-serif;
    overflow: hidden;
    background: var(--wc-black)
}

.wc-page * {
    box-sizing: border-box
}

.wc-page img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover
}

.wc-page a {
    text-decoration: none
}

.wc-kicker {
    display: block;
    font-size: 10px;
    line-height: 1.5;
    font-weight: 700;
    letter-spacing: 4px;
    color: var(--wc-gold);
    margin-bottom: 8px
}

.wc-page h2,
.wc-page h3,
.wc-page h1 {
    font-family: 'Cormorant Garamond', Georgia, serif;
    font-weight: 600
}

.wc-page h2 {
    font-size: clamp(27px, 3vw, 39px);
    line-height: 1.02;
    margin: 0
}

.wc-page h2 em,
.wc-page h1 em {
    font-style: normal;
    color: var(--wc-gold)
}

.wc-hero {
    position: relative;
    min-height: 580px;
    display: flex;
    align-items: center;
    padding: 34px 6.5%;
    color: #fff;
    background: #070808 url('../images/hero-women.jpg') center 40%/cover no-repeat;
    border-bottom: 1px solid #292929;
    isolation: isolate
}

.wc-hero-shade {
    position: absolute;
    inset: 0;
    z-index: -1;
    background: linear-gradient(90deg, rgba(4, 5, 5, .98) 0%, rgba(4, 5, 5, .86) 31%, rgba(4, 5, 5, .2) 59%, rgba(4, 5, 5, .05) 100%)
}

.wc-hero-copy {
    max-width: 410px;
    position: relative;
    z-index: 1
}

.wc-hero h1 {
    font-size: clamp(43px, 5vw, 67px);
    line-height: .98;
    letter-spacing: -1.5px;
    margin: 10px 0 17px
}

.wc-hero-copy p {
    font-size: 12px;
    line-height: 1.7;
    color: #d1d1d1;
    max-width: 325px;
    margin-bottom: 17px
}

.wc-hero-actions {
    display: flex;
    gap: 10px;
    flex-wrap: wrap
}

.wc-btn {
    min-height: 39px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    padding: 0 18px;
    font-size: 9px;
    font-weight: 800;
    letter-spacing: .5px;
    text-transform: uppercase;
    transition: transform .25s, background .25s, color .25s;
    border-radius: 2px
}

.wc-btn:hover {
    transform: translateY(-2px)
}

.wc-btn-gold {
    background: var(--wc-gold);
    color: #080808;
    border: 1px solid var(--wc-gold)
}

.wc-btn-gold:hover {
    background: #ffd477;
    color: #080808
}

.wc-btn-outline {
    color: #fff;
    border: 1px solid #888;
    background: rgba(0, 0, 0, .3)
}

.wc-btn-outline:hover {
    color: var(--wc-gold);
    border-color: var(--wc-gold)
}

.wc-hero-note {
    margin-top: 18px;
    color: #c4c4c4;
    font-size: 8px;
    letter-spacing: 2px
}

.wc-hero-note b {
    color: var(--wc-gold);
    padding: 0 6px
}

.wc-hero-seal {
    position: absolute;
    right: 7%;
    top: 38%;
    width: 95px;
    height: 95px;
    border: 1px solid rgba(242, 189, 77, .65);
    border-radius: 50%;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    text-align: center;
    color: var(--wc-gold);
    gap: 6px
}

.wc-hero-seal span {
    font-family: Georgia, serif;
    font-size: 19px
}

.wc-hero-seal small {
    font-size: 7px;
    letter-spacing: 1px;
    line-height: 1.5;
    color: #fff
}

.wc-hero-seal b {
    font-size: 13px
}

.wc-hero-count {
    position: absolute;
    right: 5.5%;
    bottom: 17px;
    color: #fff;
    font-size: 9px;
    letter-spacing: 1px;
    display: flex;
    gap: 9px;
    align-items: center
}

.wc-hero-count span {
    width: 28px;
    height: 28px;
    border: 1px solid #999;
    border-radius: 50%;
    display: grid;
    place-items: center;
    font-size: 15px
}

.wc-categories {
    padding: 20px 4.5% 24px;
    background: var(--wc-ivory);
    color: #101010
}

.wc-section-heading {
    display: flex;
    justify-content: space-between;
    align-items: end;
    gap: 20px;
    margin: 0 0 17px
}

.wc-section-heading .wc-kicker {
    color: #a87314;
    margin-bottom: 4px
}

.wc-section-heading h2 em {
    color: #c78c27
}

.wc-text-link {
    color: #171717;
    font-size: 9px;
    font-weight: 800;
    letter-spacing: 1px;
    white-space: nowrap
}

.wc-text-link i {
    color: #b37b1e;
    margin-left: 5px
}

.wc-category-row {
    display: grid;
    grid-template-columns: repeat(8, minmax(0, 1fr));
    gap: 14px
}

.wc-category {
    color: #171717;
    text-align: center;
    font-size: 9px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: .3px
}

.wc-category span {
    display: block;
    width: clamp(66px, 8.5vw, 95px);
    aspect-ratio: 1;
    border-radius: 50%;
    padding: 3px;
    margin: 0 auto 8px;
    border: 1px solid #d7b77b;
    overflow: hidden;
    background: #e7dfd2;
    transition: transform .25s, box-shadow .25s
}

.wc-category img {
    border-radius: 50%;
    transition: transform .4s
}

.wc-category:hover span {
    transform: translateY(-4px);
    box-shadow: 0 7px 18px #0002
}

.wc-category:hover img {
    transform: scale(1.08)
}

.wc-promos {
    padding: 18px 3.5%;
    background: var(--wc-black);
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 14px
}

.wc-promo {
    min-height: 155px;
    position: relative;
    display: flex;
    align-items: center;
    overflow: hidden;
    background-color: #171717;
    background-size: cover;
    background-position: center;
    border: 1px solid rgba(242, 189, 77, .5);
    border-radius: 3px;
    color: #fff;
    isolation: isolate
}

.wc-promo:before {
    content: '';
    position: absolute;
    inset: 0;
    z-index: -1;
    background: linear-gradient(90deg, rgba(0, 0, 0, .87), rgba(0, 0, 0, .45) 48%, rgba(0, 0, 0, .03))
}

.wc-promo-summer {
    background-image: url('../images/collection-women.jpg')
}

.wc-promo-ethnic {
    background-image: url('../images/women-ethnic.jpg')
}

.wc-promo>div {
    padding: 18px 5%;
    max-width: 62%
}

.wc-promo>div>span {
    font-size: 9px;
    letter-spacing: 2px
}

.wc-promo h3 {
    font-size: clamp(23px, 3vw, 35px);
    line-height: .93;
    margin: 7px 0
}

.wc-promo p {
    font-size: 10px;
    color: #e1e1e1;
    margin: 8px 0 12px
}

.wc-promo .wc-btn {
    min-height: 32px;
    padding: 0 13px;
    font-size: 8px
}

.wc-products-section {
    background: var(--wc-ivory);
    color: #151515;
    padding: 25px 3.5% 30px
}

.wc-products-heading {
    margin-bottom: 15px
}

.wc-products-heading h2 {
    font-size: clamp(27px, 3vw, 37px)
}

.wc-sort {
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: 9px
}

.wc-sort select {
    background: #fff;
    border: 1px solid #d9d6cf;
    padding: 8px 10px;
    min-width: 105px;
    font-size: 10px;
    color: #111;
    border-radius: 3px
}

.wc-shop-layout {
    display: grid;
    grid-template-columns: 190px minmax(0, 1fr);
    gap: 16px
}

.wc-filters {
    border: 1px solid #e0ddd5;
    border-radius: 4px;
    padding: 13px;
    background: #fbfaf7;
    align-self: start
}

.wc-filter-top {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding-bottom: 11px;
    border-bottom: 1px solid #e6e2da;
    font-size: 12px
}

.wc-filter-top button {
    border: 0;
    background: none;
    color: #a87314;
    font-size: 9px;
    font-weight: 700
}

.wc-filter-group {
    padding: 12px 0;
    border-bottom: 1px solid #e9e5dd
}

.wc-filter-group:last-child {
    border-bottom: 0
}

.wc-filter-group h4 {
    font-family: 'Montserrat', sans-serif;
    font-size: 10px;
    font-weight: 800;
    margin: 0 0 7px
}

.wc-filter-group>label {
    display: flex;
    align-items: center;
    gap: 6px;
    font-size: 10px;
    margin: 5px 0;
    color: #484848
}

.wc-filter-group input[type=checkbox] {
    accent-color: #b47d20
}

.wc-filter-group label small {
    margin-left: auto;
    color: #888;
    font-size: 9px
}

.wc-filter-group input[type=range] {
    width: 100%;
    accent-color: #dba83e
}

.wc-price-values {
    display: flex;
    justify-content: space-between;
    font-size: 9px;
    color: #555;
    margin-top: 5px
}

.wc-size-options {
    display: flex;
    flex-wrap: wrap;
    gap: 4px
}

.wc-size-options button {
    min-width: 25px;
    height: 24px;
    border: 1px solid #d4d0c7;
    background: #fff;
    font-size: 8px;
    border-radius: 2px
}

.wc-size-options button.active,
.wc-color-options button.active {
    outline: 2px solid #d6a02c;
    outline-offset: 1px
}

.wc-color-options {
    display: flex;
    gap: 8px;
    flex-wrap: wrap
}

.wc-color-options button {
    width: 17px;
    height: 17px;
    border-radius: 50%;
    background: var(--swatch);
    border: 1px solid #aaa
}

.wc-rating-filter button {
    display: block;
    border: 0;
    background: none;
    padding: 2px 0;
    font-size: 9px;
    color: #444
}

.wc-rating-filter button span {
    color: #e5a52b;
    font-size: 13px;
    letter-spacing: -1px;
    margin-right: 4px
}

.wc-rating-filter button.active {
    font-weight: 800;
    color: #a87314
}

.wc-product-toolbar {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 10px;
    margin-bottom: 12px
}

.wc-product-tabs {
    display: flex;
    gap: 5px;
    flex-wrap: wrap
}

.wc-product-tabs button {
    padding: 7px 10px;
    background: transparent;
    border: 1px solid #ddd8ce;
    border-radius: 3px;
    font-size: 8px;
    font-weight: 700;
    text-transform: uppercase;
    color: #242424
}

.wc-product-tabs button.active,
.wc-product-tabs button:hover {
    background: var(--wc-gold);
    border-color: var(--wc-gold);
    color: #111
}

.wc-product-toolbar>span {
    font-size: 9px;
    color: #777;
    white-space: nowrap
}

.wc-product-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 12px
}

.wc-product-card {
    min-width: 0;
    border: 1px solid #dfdbd2;
    background: #fff;
    border-radius: 4px;
    overflow: hidden;
    transition: transform .25s, box-shadow .25s
}

.wc-product-card:hover {
    transform: translateY(-3px);
    box-shadow: 0 8px 22px #00000012
}

.wc-product-image {
    position: relative;
    aspect-ratio: .82;
    overflow: hidden;
    background: #e9e0d6
}

.wc-product-image img {
    transition: transform .45s
}

.wc-product-card:hover .wc-product-image img {
    transform: scale(1.04)
}

.wc-badge {
    position: absolute;
    top: 8px;
    left: 8px;
    background: var(--wc-gold);
    color: #111;
    padding: 5px 7px;
    font-size: 7px;
    font-weight: 800;
    border-radius: 2px
}

.wc-wishlist {
    position: absolute;
    right: 7px;
    top: 7px;
    width: 25px;
    height: 25px;
    border: 0;
    border-radius: 50%;
    background: #ffffffdc;
    color: #222;
    display: grid;
    place-items: center;
    font-size: 13px
}

.wc-wishlist.active {
    color: #c3263c
}

.wc-product-info {
    padding: 8px
}

.wc-product-info h3 {
    font-family: 'Montserrat', sans-serif;
    font-size: 10px;
    font-weight: 700;
    margin: 0 0 4px;
    line-height: 1.35;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis
}

.wc-stars {
    color: #e6a628;
    font-size: 10px;
    letter-spacing: -1px;
    white-space: nowrap
}

.wc-stars small {
    color: #888;
    letter-spacing: 0;
    font-size: 8px
}

.wc-price {
    display: flex;
    align-items: center;
    gap: 5px;
    flex-wrap: wrap;
    margin: 5px 0 8px
}

.wc-price strong {
    font-size: 11px;
    color: #a66d08
}

.wc-price del {
    font-size: 8px;
    color: #999
}

.wc-price>span {
    margin-left: auto;
    background: #fff1d2;
    color: #8d5d0a;
    font-size: 7px;
    font-weight: 800;
    padding: 4px;
    border-radius: 2px
}

.wc-product-actions {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 5px
}

.wc-product-actions button {
    min-height: 27px;
    padding: 4px 2px;
    font-size: 7px;
    font-weight: 800;
    border-radius: 2px;
    white-space: nowrap
}

.wc-add-cart {
    background: #fff;
    border: 1px solid #222;
    color: #111
}

.wc-buy-now {
    background: var(--wc-gold);
    border: 1px solid var(--wc-gold);
    color: #111
}

.wc-no-results {
    padding: 35px;
    text-align: center;
    font-size: 13px;
    color: #666
}

.wc-promise {
    padding: 27px 4.5% 30px;
    background: var(--wc-black);
    color: #fff;
    text-align: center;
    border-top: 1px solid #252525
}

.wc-promise .wc-kicker {
    margin-bottom: 5px;
    font-size: 8px
}

.wc-promise h2 {
    font-size: clamp(25px, 3vw, 35px);
    margin-bottom: 18px
}

.wc-promise-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 12px
}

.wc-promise-grid article {
    border: 1px solid #343434;
    border-radius: 3px;
    padding: 16px 10px 13px;
    background: linear-gradient(145deg, #0c0d0d, #080909)
}

.wc-promise-grid i {
    font-size: 29px;
    color: var(--wc-gold)
}

.wc-promise-grid h3 {
    font-family: 'Cormorant Garamond', Georgia, serif;
    font-size: 16px;
    margin: 8px 0 4px
}

.wc-promise-grid p {
    font-size: 9px;
    line-height: 1.5;
    color: #aaa;
    max-width: 165px;
    margin: 0 auto
}

.wc-closing {
    position: relative;
    min-height: 190px;
    padding: 28px 7%;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
    background: #080909 url('../images/premium-women.jpg') center/cover no-repeat;
    color: #fff;
    isolation: isolate
}

.wc-closing:before {
    content: '';
    position: absolute;
    inset: 0;
    z-index: -1;
    background: linear-gradient(90deg, rgba(0, 0, 0, .05) 0%, rgba(0, 0, 0, .55) 38%, rgba(0, 0, 0, .96) 100%)
}

.wc-closing-copy {
    margin-left: 35%;
}

.wc-closing-copy .wc-kicker {
    font-size: 8px;
    margin-bottom: 5px
}

.wc-closing h2 {
    font-size: clamp(30px, 4vw, 44px);
    margin: 0 0 3px
}

.wc-closing-copy p {
    font-size: 8px;
    letter-spacing: 2px;
    color: #d7d0c4;
    margin: 7px 0 13px
}

.wc-closing-mark {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    width: 82px;
    height: 82px;
    border: 1px solid var(--wc-gold);
    border-radius: 50%;
    color: var(--wc-gold);
    flex-shrink: 0
}

.wc-closing-mark span {
    font-family: Georgia, serif;
    font-size: 21px
}

.wc-closing-mark b {
    font-size: 7px;
    letter-spacing: 1px;
    color: #fff
}

.wc-closing-mark small {
    position: absolute;
    right: 7%;
    bottom: 18px;
    font-size: 7px;
    letter-spacing: 1px;
    color: #c6bba8
}

@media(max-width:991px) {
    .wc-hero {
        min-height: 310px;
        padding-left: 5%
    }

    .wc-hero-seal {
        right: 4%;
        width: 78px;
        height: 78px
    }

    .wc-category-row {
        grid-template-columns: repeat(4, 1fr);
        row-gap: 16px
    }

    .wc-shop-layout {
        grid-template-columns: 165px minmax(0, 1fr);
        gap: 10px
    }

    .wc-product-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 10px
    }

    .wc-product-tabs button {
        padding: 7px 8px
    }

    .wc-closing-copy {
        margin-left: 28%
    }

    .wc-promo {
        min-height: 145px
    }
}

@media(max-width:767px) {
    .wc-hero {
        min-height: 365px;
        padding: 30px 22px;
        align-items: flex-end;
        background-position: 60% center
    }

    .wc-hero-shade {
        background: linear-gradient(0deg, rgba(0, 0, 0, .95), rgba(0, 0, 0, .55) 53%, rgba(0, 0, 0, .1))
    }

    .wc-hero-copy {
        max-width: 100%
    }

    .wc-hero h1 {
        font-size: 48px
    }

    .wc-hero-copy p {
        max-width: 290px
    }

    .wc-hero-seal {
        top: 18px;
        right: 18px;
        width: 67px;
        height: 67px
    }

    .wc-hero-seal small {
        font-size: 6px
    }

    .wc-hero-count {
        display: none
    }

    .wc-categories {
        padding: 22px 16px
    }

    .wc-section-heading {
        align-items: center
    }

    .wc-section-heading h2 {
        font-size: 29px
    }

    .wc-category-row {
        grid-template-columns: repeat(4, minmax(0, 1fr));
        gap: 17px 7px
    }

    .wc-category span {
        width: min(18vw, 78px)
    }

    .wc-category {
        font-size: 8px
    }

    .wc-promos {
        grid-template-columns: 1fr;
        padding: 14px 12px;
        gap: 10px
    }

    .wc-promo {
        min-height: 155px
    }

    .wc-promo>div {
        max-width: 68%;
        padding-left: 16px
    }

    .wc-promo h3 {
        font-size: 31px
    }

    .wc-products-section {
        padding: 22px 12px
    }

    .wc-products-heading {
        align-items: flex-start
    }

    .wc-products-heading h2 {
        font-size: 29px
    }

    .wc-sort {
        flex-direction: column;
        align-items: flex-end;
        gap: 4px
    }

    .wc-shop-layout {
        grid-template-columns: 1fr
    }

    .wc-filters {
        display: grid;
        grid-template-columns: 1fr 1fr;
        gap: 0 15px;
        padding: 10px 12px
    }

    .wc-filter-top {
        grid-column: 1/-1
    }

    .wc-filter-group {
        padding: 9px 0
    }

    .wc-filter-group label {
        font-size: 9px
    }

    .wc-product-toolbar {
        align-items: flex-start;
        flex-direction: column
    }

    .wc-product-tabs {
        width: 100%
    }

    .wc-product-tabs button {
        font-size: 8px
    }

    .wc-product-toolbar>span {
        align-self: flex-end
    }

    .wc-product-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 9px
    }

    .wc-product-info {
        padding: 7px
    }

    .wc-product-info h3 {
        font-size: 9px
    }

    .wc-price {
        gap: 4px
    }

    .wc-price strong {
        font-size: 10px
    }

    .wc-price>span {
        font-size: 6px
    }

    .wc-product-actions button {
        font-size: 6.5px
    }

    .wc-promise {
        padding: 25px 14px
    }

    .wc-promise-grid {
        grid-template-columns: repeat(2, 1fr);
        gap: 8px
    }

    .wc-promise-grid article {
        padding: 13px 7px
    }

    .wc-promise-grid i {
        font-size: 25px
    }

    .wc-promise-grid h3 {
        font-size: 15px
    }

    .wc-promise-grid p {
        font-size: 8px
    }

    .wc-closing {
        min-height: 220px;
        padding: 25px 18px;
        background-position: 35% center;
        align-items: flex-end
    }

    .wc-closing:before {
        background: linear-gradient(0deg, rgba(0, 0, 0, .98), rgba(0, 0, 0, .65) 55%, rgba(0, 0, 0, .05))
    }

    .wc-closing-copy {
        margin: 0;
        max-width: 78%
    }

    .wc-closing h2 {
        font-size: 33px
    }

    .wc-closing-mark {
        position: absolute;
        right: 15px;
        top: 15px;
        width: 60px;
        height: 60px
    }

    .wc-closing-mark span {
        font-size: 16px
    }

    .wc-closing-mark small {
        right: 15px;
        bottom: 10px
    }
}

@media(max-width:380px) {
    .wc-hero h1 {
        font-size: 42px
    }

    .wc-category span {
        width: 62px
    }

    .wc-category {
        font-size: 7px
    }

    .wc-product-grid {
        gap: 7px
    }

    .wc-product-actions {
        grid-template-columns: 1fr
    }

    .wc-product-actions button {
        min-height: 25px
    }

    .wc-filters {
        grid-template-columns: 1fr
    }

    .wc-closing-copy {
        max-width: 100%
    }
}


/* MEN'S PREMIUM COLLECTION PAGE CSS
   Copy this entire block into the existing assets/css/shop.css file.
   No new CSS/JS file is required. All selectors are scoped with .mp- to avoid affecting other pages.
*/
.mp-premium-page {
    --mp-black: #070908;
    --mp-black-2: #10110f;
    --mp-gold: #f4bd45;
    --mp-gold-dark: #b77a13;
    --mp-cream: #fbfaf7;
    --mp-ink: #121212;
    --mp-muted: #6d6b66;
    color: var(--mp-ink);
    font-family: inherit;
    overflow: hidden
}

.mp-premium-page * {
    box-sizing: border-box
}

.mp-premium-page img {
    display: block;
    max-width: 100%
}

.mp-premium-page a {
    text-decoration: none
}

.mp-eyebrow {
    display: block;
    font-size: 10px;
    font-weight: 800;
    letter-spacing: 3.2px;
    line-height: 1.6;
    color: var(--mp-gold-dark)
}

.mp-hero {
    position: relative;
    min-height: 360px;
    display: flex;
    align-items: center;
    padding: 38px clamp(24px, 7.5vw, 100px);
    background: #050605 url('../images/hero-premium.jpg') center 40%/cover no-repeat;
    color: #fff;
    isolation: isolate
}

.mp-hero:before {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(90deg, rgba(3, 4, 3, .98) 0%, rgba(3, 4, 3, .88) 28%, rgba(3, 4, 3, .34) 58%, rgba(3, 4, 3, .12) 100%);
    z-index: -1
}

.mp-hero__content {
    width: min(430px, 52%);
    position: relative;
    z-index: 1
}

.mp-hero .mp-eyebrow {
    color: var(--mp-gold);
    margin-bottom: 10px
}

.mp-hero h1 {
    font-family: Georgia, 'Times New Roman', serif;
    font-weight: 400;
    font-size: clamp(38px, 4.2vw, 58px);
    line-height: .98;
    letter-spacing: -1.4px;
    margin: 0 0 12px;
    color: #fff
}

.mp-hero h1 span {
    display: block;
    color: var(--mp-gold)
}

.mp-hero p {
    max-width: 350px;
    font-size: 13px;
    line-height: 1.65;
    color: #e4e2dc;
    margin: 0 0 16px
}

.mp-hero__actions {
    display: flex;
    gap: 10px;
    flex-wrap: wrap
}

.mp-btn {
    min-height: 40px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 14px;
    padding: 0 17px;
    font-size: 9px;
    font-weight: 800;
    letter-spacing: .5px;
    text-transform: uppercase;
    border: 1px solid transparent;
    transition: background .2s, color .2s, border-color .2s
}

.mp-btn--gold {
    background: var(--mp-gold);
    color: #111;
    border-color: var(--mp-gold)
}

.mp-btn--gold:hover {
    background: #ffd16a;
    border-color: #ffd16a;
    color: #111
}

.mp-btn--outline {
    color: #fff;
    border-color: #aaa;
    background: rgba(0, 0, 0, .25)
}

.mp-btn--outline:hover {
    border-color: var(--mp-gold);
    color: var(--mp-gold)
}

.mp-hero__notes {
    display: flex;
    align-items: center;
    gap: 10px;
    flex-wrap: wrap;
    margin-top: 20px;
    font-size: 8px;
    letter-spacing: 1.7px;
    color: #d7d5cf
}

.mp-hero__notes i {
    width: 3px;
    height: 3px;
    background: var(--mp-gold);
    border-radius: 50%
}

.mp-hero__seal {
    position: absolute;
    right: 6.5%;
    top: 36%;
    width: 105px;
    height: 105px;
    border: 1px solid rgba(244, 189, 69, .7);
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    text-align: center;
    padding: 12px;
    color: #fff
}

.mp-hero__seal span {
    font-size: 15px;
    color: var(--mp-gold)
}

.mp-hero__seal strong {
    font-size: 8px;
    letter-spacing: 1px;
    margin: 6px 0 3px
}

.mp-hero__seal small {
    font-size: 7px;
    letter-spacing: 1px
}

.mp-hero__count {
    position: absolute;
    right: 5.5%;
    bottom: 22px;
    display: flex;
    align-items: center;
    gap: 9px;
    font-size: 10px;
    color: #fff
}

.mp-hero__count span {
    width: 29px;
    height: 29px;
    border: 1px solid #aaa;
    border-radius: 50%;
    display: grid;
    place-items: center;
    font-size: 16px
}

.mp-light-section {
    background: var(--mp-cream);
    color: var(--mp-ink)
}

.mp-categories {
    padding: 20px clamp(22px, 4vw, 42px) 24px
}

.mp-section-heading {
    display: flex;
    justify-content: space-between;
    align-items: end;
    gap: 20px;
    margin-bottom: 12px
}

.mp-section-heading h2,
.mp-products-heading h2,
.mp-promise h2,
.mp-closing-banner h2 {
    font-family: Georgia, 'Times New Roman', serif;
    font-size: clamp(26px, 3vw, 34px);
    font-weight: 400;
    letter-spacing: -.5px;
    line-height: 1.12;
    margin: 2px 0 0
}

.mp-section-heading h2 em,
.mp-products-heading h2 em,
.mp-promise h2 em,
.mp-closing-banner h2 em {
    font-style: normal;
    color: var(--mp-gold-dark)
}

.mp-text-link {
    font-size: 9px;
    font-weight: 800;
    letter-spacing: 1px;
    color: #222;
    white-space: nowrap;
    padding-bottom: 7px
}

.mp-text-link span {
    color: var(--mp-gold-dark);
    font-size: 15px;
    margin-left: 8px
}

.mp-category-grid {
    display: grid;
    grid-template-columns: repeat(7, minmax(0, 1fr));
    gap: 16px
}

.mp-category {
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    color: #111;
    min-width: 0
}

.mp-category img {
    width: clamp(78px, 9.2vw, 112px);
    aspect-ratio: 1/1;
    object-fit: cover;
    object-position: center 25%;
    border-radius: 50%;
    border: 1px solid #ddc79c;
    background: #e7e0d5;
    transition: transform .25s
}

.mp-category:hover img {
    transform: translateY(-4px)
}

.mp-category span {
    font-size: 9px;
    line-height: 1.45;
    letter-spacing: .5px;
    font-weight: 800;
    margin-top: 8px
}

.mp-promo-section {
    background: var(--mp-black);
    padding: 16px clamp(18px, 3.5vw, 36px);
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 14px
}

.mp-promo-card {
    min-height: 190px;
    position: relative;
    display: flex;
    align-items: center;
    overflow: hidden;
    border: 1px solid rgba(244, 189, 69, .48);
    border-radius: 3px;
    background: #10110f;
    color: #fff;
    isolation: isolate
}

.mp-promo-card:after {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(90deg, rgba(3, 4, 3, .92) 0%, rgba(3, 4, 3, .74) 35%, rgba(3, 4, 3, .12) 76%, rgba(3, 4, 3, .05));
    z-index: -1
}

.mp-promo-card__copy {
    padding: 22px 26px;
    position: relative;
    z-index: 2;
    width: 58%
}

.mp-promo-card__copy>span {
    font-size: 9px;
    letter-spacing: 2.5px;
    font-weight: 700
}

.mp-promo-card h3 {
    font-family: Georgia, 'Times New Roman', serif;
    font-size: clamp(25px, 3vw, 35px);
    line-height: 1.02;
    font-weight: 400;
    margin: 8px 0 7px
}

.mp-promo-card p {
    font-size: 11px;
    margin: 0 0 13px;
    color: #e3e0da
}

.mp-promo-card .mp-btn {
    min-height: 36px;
    padding: 0 14px;
    font-size: 8px
}

.mp-promo-card>img {
    position: absolute;
    inset: 0 0 0 auto;
    width: 70%;
    height: 100%;
    object-fit: contain;
    object-position: right center;
    z-index: -2
}

.mp-promo-card--ethnic>img {
    width: 65%;
    object-position: right center
}

.mp-products-section {
    padding: 22px clamp(20px, 3.5vw, 36px) 28px
}

.mp-products-heading {
    display: grid;
    grid-template-columns: auto 1fr auto;
    align-items: end;
    gap: 16px;
    margin-bottom: 14px
}

.mp-products-heading .mp-eyebrow {
    font-size: 9px;
    letter-spacing: 2.5px
}

.mp-products-heading h2 {
    font-size: clamp(24px, 2.8vw, 32px);
    white-space: nowrap
}

.mp-product-tabs {
    display: flex;
    gap: 5px;
    align-items: center;
    justify-content: center;
    flex-wrap: wrap
}

.mp-product-tabs button {
    background: #fff;
    border: 1px solid #e2dfd8;
    padding: 9px 10px;
    font-size: 8px;
    font-weight: 800;
    color: #222;
    cursor: pointer
}

.mp-product-tabs button.is-active {
    background: var(--mp-gold);
    border-color: var(--mp-gold)
}

.mp-sort {
    font-size: 9px;
    display: flex;
    align-items: center;
    gap: 7px;
    white-space: nowrap
}

.mp-sort select {
    padding: 8px 10px;
    border: 1px solid #ddd8ce;
    background: #fff;
    min-width: 92px;
    font: inherit;
    color: #222
}

.mp-shop-layout {
    display: grid;
    grid-template-columns: minmax(215px, 250px) minmax(0, 1fr);
    gap: 18px;
    align-items: start
}

.mp-filter-panel {
    padding: 18px 17px;
    border: 1px solid #e0ddd5;
    border-radius: 4px;
    background: #fff;
    font-size: 12px;
    box-shadow: 0 3px 14px rgba(30, 25, 15, .035)
}

.mp-filter-title {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding-bottom: 13px;
    border-bottom: 1px solid #e8e4dc;
    font-size: 15px
}

.mp-filter-title button {
    border: 0;
    background: transparent;
    color: #a56c09;
    font-size: 10px;
    font-weight: 700;
    cursor: pointer
}

.mp-filter-group {
    padding: 14px 0;
    border-bottom: 1px solid #e9e5de
}

.mp-filter-group:last-child {
    border-bottom: 0;
    padding-bottom: 2px
}

.mp-filter-group h3 {
    font-size: 12px;
    margin: 0 0 10px;
    font-weight: 800
}

.mp-filter-group>label {
    display: flex;
    align-items: center;
    gap: 7px;
    margin: 8px 0;
    color: #393833;
    font-size: 11px;
    line-height: 1.35
}

.mp-filter-group input[type=checkbox] {
    width: 15px;
    height: 15px;
    accent-color: #c99020;
    flex: 0 0 auto;
    margin: 0
}

.mp-filter-group label small {
    margin-left: auto;
    color: #858078;
    font-size: 10px
}

.mp-range {
    width: 100%;
    accent-color: #d8a638;
    display: block;
    margin: 10px 0
}

.mp-range-values {
    display: flex;
    justify-content: space-between;
    color: #716d66;
    font-size: 10px
}

.mp-size-options {
    display: flex;
    gap: 5px;
    flex-wrap: wrap
}

.mp-size-options button {
    min-width: 32px;
    height: 31px;
    border: 1px solid #ded9cf;
    background: #fff;
    font-size: 10px;
    cursor: pointer
}

.mp-size-options button:focus,
.mp-size-options button:hover {
    background: #111;
    color: #fff;
    border-color: #111
}

.mp-color-options {
    display: flex;
    gap: 9px;
    flex-wrap: wrap
}

.mp-color {
    width: 21px;
    height: 21px;
    border-radius: 50%;
    border: 1px solid #aaa;
    cursor: pointer
}

.mp-color--black {
    background: #111
}

.mp-color--white {
    background: #fff
}

.mp-color--beige {
    background: #cdb08b
}

.mp-color--navy {
    background: #142c48
}

.mp-color--green {
    background: #17492e
}

.mp-color--brown {
    background: #69452c
}

.mp-filter-group--rating p {
    margin: 7px 0;
    font-size: 11px;
    color: #555
}

.mp-filter-group--rating p span {
    color: #d69a22;
    letter-spacing: 1px;
    font-size: 13px
}

.mp-product-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 14px
}

.mp-product-card {
    min-width: 0;
    background: #fff;
    border: 1px solid #e5e1d8;
    border-radius: 4px;
    overflow: hidden;
    box-shadow: 0 3px 12px rgba(28, 24, 15, .045);
    transition: transform .2s, box-shadow .2s
}

.mp-product-card:hover {
    transform: translateY(-3px);
    box-shadow: 0 8px 20px rgba(28, 24, 15, .1)
}

.mp-product-image {
    height: clamp(155px, 17vw, 220px);
    position: relative;
    background: #e8e0d3;
    overflow: hidden
}

.mp-product-image img {
    width: 100%;
    height: 100%;
    object-fit: contain;
    object-position: center center;
    background: #e8e0d3
}

.mp-badge {
    position: absolute;
    top: 9px;
    left: 9px;
    padding: 6px 8px;
    background: var(--mp-gold);
    color: #17130a;
    font-size: 8px;
    font-weight: 900;
    letter-spacing: .3px
}

.mp-wishlist {
    position: absolute;
    top: 8px;
    right: 8px;
    width: 28px;
    height: 28px;
    border: 1px solid rgba(255, 255, 255, .65);
    border-radius: 50%;
    background: rgba(0, 0, 0, .35);
    color: #fff;
    font-size: 20px;
    line-height: 1;
    cursor: pointer
}

.mp-product-info {
    padding: 10px 10px 11px
}

.mp-product-info h3 {
    font-size: 11px;
    line-height: 1.35;
    font-weight: 700;
    margin: 0 0 4px;
    min-height: 29px
}

.mp-rating {
    font-size: 11px;
    letter-spacing: .2px;
    color: #d99b22;
    white-space: nowrap
}

.mp-rating small {
    font-size: 9px;
    letter-spacing: 0;
    color: #777
}

.mp-price-row {
    display: flex;
    align-items: center;
    gap: 5px;
    flex-wrap: wrap;
    margin: 7px 0 9px
}

.mp-price-row strong {
    font-size: 12px;
    color: #a56b08
}

.mp-price-row del {
    font-size: 9px;
    color: #999
}

.mp-price-row>span {
    margin-left: auto;
    background: #fff0d1;
    color: #9a650c;
    padding: 4px 5px;
    font-size: 8px;
    font-weight: 800
}

.mp-product-actions {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 5px
}

.mp-product-actions button {
    min-height: 30px;
    padding: 4px 3px;
    font-size: 8px;
    font-weight: 800;
    letter-spacing: .15px;
    border: 1px solid #1b1b1b;
    background: #fff;
    color: #151515;
    cursor: pointer
}

.mp-product-actions button+button {
    background: var(--mp-gold);
    border-color: var(--mp-gold)
}

.mp-product-actions button:hover {
    filter: brightness(.96)
}

.mp-promise {
    background: var(--mp-black);
    color: #fff;
    padding: 22px clamp(20px, 4vw, 42px) 26px;
    border-top: 1px solid #25241f
}

.mp-promise__heading {
    text-align: center;
    margin-bottom: 16px
}

.mp-promise__heading .mp-eyebrow {
    font-size: 8px;
    letter-spacing: 2.3px;
    color: var(--mp-gold)
}

.mp-promise h2 {
    font-size: 26px;
    color: #fff;
    margin-top: 4px
}

.mp-promise h2 em {
    color: var(--mp-gold)
}

.mp-promise-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 12px
}

.mp-promise-grid article {
    min-height: 100px;
    border: 1px solid #37352f;
    border-radius: 3px;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    text-align: center;
    padding: 13px 8px
}

.mp-promise-grid article>span {
    font-size: 30px;
    color: var(--mp-gold);
    line-height: 1;
    margin-bottom: 7px
}

.mp-promise-grid h3 {
    font-family: Georgia, 'Times New Roman', serif;
    font-size: 13px;
    font-weight: 400;
    margin: 0 0 5px
}

.mp-promise-grid p {
    font-size: 10px;
    line-height: 1.45;
    color: #c5c2bb;
    margin: 0
}

.mp-closing-banner {
    display: grid;
    grid-template-columns: 1fr 1fr minmax(95px, .3fr);
    min-height: 190px;
    background: #080908;
    color: #fff;
    align-items: stretch;
    overflow: hidden
}

.mp-closing-banner__image {
    min-height: 190px;
    overflow: hidden
}

.mp-closing-banner__image img {
    width: 100%;
    height: 100%;
    min-height: 190px;
    object-fit: cover;
    object-position: center 35%
}

.mp-closing-banner__copy {
    align-self: center;
    padding: 22px 26px
}

.mp-closing-banner__copy .mp-eyebrow {
    font-size: 8px;
    letter-spacing: 2px;
    color: var(--mp-gold)
}

.mp-closing-banner h2 {
    font-size: clamp(25px, 3vw, 35px);
    margin: 4px 0 7px;
    color: #fff
}

.mp-closing-banner p {
    font-size: 11px;
    line-height: 1.6;
    color: #d4d1c9;
    margin: 0 0 14px
}

.mp-closing-banner .mp-btn {
    min-height: 35px
}

.mp-closing-banner__mark {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    gap: 8px;
    border-left: 1px solid #292720;
    margin: 20px 0;
    color: var(--mp-gold);
    font-size: 9px;
    letter-spacing: 1px
}

.mp-closing-banner__mark strong {
    width: 54px;
    height: 54px;
    border: 1px solid var(--mp-gold);
    border-radius: 50%;
    display: grid;
    place-items: center;
    font-family: Georgia, serif;
    font-size: 24px;
    font-weight: 400
}

@media(min-width:1500px) {
    .mp-hero {
        min-height: 630px
    }

    .mp-product-image {
        height: 245px
    }

    .mp-product-info {
        padding: 13px
    }

    .mp-filter-panel {
        padding: 22px
    }

    .mp-promo-card {
        min-height: 225px
    }
}

@media(max-width:1200px) {
    .mp-products-heading {
        grid-template-columns: 1fr auto
    }

    .mp-product-tabs {
        grid-column: 1/-1;
        grid-row: 2;
        justify-content: flex-start;
        order: 3
    }

    .mp-sort {
        grid-column: 2;
        grid-row: 1
    }

    .mp-shop-layout {
        grid-template-columns: 220px minmax(0, 1fr);
        gap: 12px
    }

    .mp-product-grid {
        grid-template-columns: repeat(3, minmax(0, 1fr));
        gap: 12px
    }

    .mp-category-grid {
        gap: 10px
    }

    .mp-promo-card__copy {
        padding: 18px
    }

    .mp-promo-card>img {
        width: 74%
    }
}

@media(max-width:760px) {
    .mp-hero {
        min-height: 390px;
        padding: 34px 24px;
        background-position: 58% center
    }

    .mp-hero:before {
        background: linear-gradient(90deg, rgba(3, 4, 3, .95), rgba(3, 4, 3, .78) 52%, rgba(3, 4, 3, .25))
    }

    .mp-hero__content {
        width: min(420px, 82%)
    }

    .mp-hero h1 {
        font-size: clamp(36px, 8vw, 49px)
    }

    .mp-hero__seal {
        right: 18px;
        top: auto;
        bottom: 70px;
        width: 78px;
        height: 78px;
        padding: 7px
    }

    .mp-hero__seal strong {
        font-size: 6px
    }

    .mp-hero__seal small {
        font-size: 6px
    }

    .mp-hero__count {
        right: 20px;
        bottom: 15px
    }

    .mp-hero__notes {
        max-width: 280px;
        gap: 7px;
        font-size: 7px
    }

    .mp-categories {
        padding: 20px 18px
    }

    .mp-section-heading h2 {
        font-size: 27px
    }

    .mp-category-grid {
        grid-template-columns: repeat(4, minmax(0, 1fr));
        row-gap: 17px
    }

    .mp-category img {
        width: clamp(72px, 18vw, 100px)
    }

    .mp-category span {
        font-size: 8px
    }

    .mp-promo-section {
        grid-template-columns: 1fr;
        padding: 14px
    }

    .mp-promo-card {
        min-height: 205px
    }

    .mp-promo-card__copy {
        width: 62%;
        padding: 18px
    }

    .mp-promo-card h3 {
        font-size: 30px
    }

    .mp-promo-card>img {
        width: 70%;
        object-fit: contain;
        object-position: right center
    }

    .mp-products-section {
        padding: 20px 14px
    }

    .mp-products-heading {
        grid-template-columns: 1fr auto;
        gap: 10px
    }

    .mp-products-heading h2 {
        white-space: normal;
        font-size: 26px
    }

    .mp-product-tabs {
        grid-column: 1/-1;
        grid-row: 2;
        flex-wrap: nowrap;
        overflow-x: auto;
        justify-content: flex-start;
        padding-bottom: 4px
    }

    .mp-product-tabs button {
        flex: 0 0 auto
    }

    .mp-sort {
        font-size: 8px
    }

    .mp-sort select {
        min-width: 80px;
        padding: 7px 5px
    }

    .mp-shop-layout {
        grid-template-columns: 1fr
    }

    .mp-filter-panel {
        padding: 13px
    }

    .mp-filter-group {
        padding: 11px 0
    }

    .mp-filter-group>label {
        display: inline-flex;
        margin: 5px 10px 5px 0
    }

    .mp-filter-group label small {
        margin-left: 2px
    }

    .mp-filter-group--rating {
        display: none
    }

    .mp-product-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 10px
    }

    .mp-product-image {
        height: clamp(170px, 52vw, 270px)
    }

    .mp-product-info {
        padding: 9px
    }

    .mp-product-info h3 {
        font-size: 10px
    }

    .mp-price-row {
        gap: 4px
    }

    .mp-price-row>span {
        font-size: 7px
    }

    .mp-product-actions button {
        font-size: 7px;
        min-height: 29px
    }

    .mp-promise {
        padding: 22px 14px
    }

    .mp-promise-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 9px
    }

    .mp-promise-grid article {
        min-height: 112px
    }

    .mp-closing-banner {
        grid-template-columns: 1fr 1.2fr;
        min-height: 170px
    }

    .mp-closing-banner__image,
    .mp-closing-banner__image img {
        min-height: 170px
    }

    .mp-closing-banner__copy {
        padding: 16px
    }

    .mp-closing-banner__mark {
        display: none
    }

    .mp-closing-banner h2 {
        font-size: 27px
    }
}

@media(max-width:420px) {
    .mp-hero {
        min-height: 420px;
        padding: 30px 18px;
        background-position: 62% center
    }

    .mp-hero__content {
        width: 100%;
        max-width: 285px
    }

    .mp-hero h1 {
        font-size: 37px
    }

    .mp-hero p {
        font-size: 12px;
        max-width: 270px
    }

    .mp-hero__seal {
        display: none
    }

    .mp-hero__actions {
        gap: 7px
    }

    .mp-btn {
        padding: 0 11px;
        font-size: 8px
    }

    .mp-section-heading h2 {
        font-size: 24px
    }

    .mp-text-link {
        font-size: 8px
    }

    .mp-category-grid {
        gap: 14px 7px
    }

    .mp-category img {
        width: 68px
    }

    .mp-category span {
        font-size: 7px
    }

    .mp-promo-card {
        min-height: 185px
    }

    .mp-promo-card__copy {
        width: 70%;
        padding: 14px
    }

    .mp-promo-card h3 {
        font-size: 26px
    }

    .mp-promo-card p {
        font-size: 10px
    }

    .mp-promo-card>img {
        width: 75%
    }

    .mp-products-heading h2 {
        font-size: 23px
    }

    .mp-sort {
        grid-column: 1/-1;
        grid-row: 3;
        justify-self: start
    }

    .mp-product-image {
        height: 175px
    }

    .mp-badge {
        font-size: 7px;
        padding: 5px
    }

    .mp-wishlist {
        width: 25px;
        height: 25px
    }

    .mp-price-row strong {
        font-size: 11px
    }

    .mp-price-row del {
        font-size: 8px
    }

    .mp-price-row>span {
        margin-left: 0
    }

    .mp-product-actions {
        grid-template-columns: 1fr
    }

    .mp-product-actions button {
        min-height: 29px
    }

    .mp-closing-banner {
        grid-template-columns: 1fr
    }

    .mp-closing-banner__image {
        height: 155px;
        min-height: 155px
    }

    .mp-closing-banner__image img {
        height: 155px;
        min-height: 155px;
        object-position: center 32%
    }

    .mp-closing-banner__copy {
        padding: 20px
    }

    .mp-closing-banner h2 {
        font-size: 30px
    }
}

/* INTERACTIVE STATES — Men's Premium filters */
.mp-premium-page .mp-size-options button.is-selected {
    background: #111;
    color: #fff;
    border-color: #111
}

.mp-premium-page .mp-color.is-selected {
    outline: 2px solid #c58a19;
    outline-offset: 3px
}

.mp-premium-page .mp-rating-filter {
    display: block;
    border: 0;
    background: transparent;
    padding: 4px 0;
    text-align: left;
    font: inherit;
    color: #555;
    cursor: pointer
}

.mp-premium-page .mp-rating-filter span {
    color: #d69a22;
    letter-spacing: 1px
}

.mp-premium-page .mp-rating-filter.is-selected {
    font-weight: 800;
    color: #111
}

.mp-premium-page .mp-product-actions button.is-added {
    background: #f5f0e4;
    border-color: #c9a45c;
    color: #72571f
}

.mp-premium-page .mp-wishlist.is-wishlisted {
    color: #f4bd45;
    border-color: #f4bd45
}

/* =======================================WOMEN PREMIMUM PAGE CSS START================== */

/* WOMEN'S PREMIUM COLLECTION — append to existing assets/css/shop.css */
.wpc-page {
    --wpc-gold: #f4c447;
    --wpc-ink: #090a09;
    --wpc-paper: #fffefa;
    background: var(--wpc-paper);
    color: #111;
    font-family: inherit;
    overflow: hidden
}

.wpc-page *,
.wpc-page *:before,
.wpc-page *:after {
    box-sizing: border-box
}

.wpc-page img {
    display: block;
    max-width: 100%
}

.wpc-page a {
    color: inherit;
    text-decoration: none
}

.wpc-page button,
.wpc-page select {
    font: inherit;
    cursor: pointer
}

.wpc-eyebrow {
    font-size: 10px;
    line-height: 1.4;
    font-weight: 800;
    letter-spacing: 3px;
    color: #b77a12;
    margin: 0 0 7px
}

.wpc-hero {
    position: relative;
    isolation: isolate;
    min-height: clamp(420px, 34vw, 570px);
    display: flex;
    align-items: center;
    background: #090909;
    color: #fff;
    overflow: hidden
}

.wpc-hero-image {
    position: absolute;
    z-index: -2;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center 30%
}

.wpc-hero-overlay {
    position: absolute;
    z-index: -1;
    inset: 0;
    background: linear-gradient(90deg, #050505f7 0%, #050505dc 27%, #05050555 49%, #05050508 75%, #05050548 100%)
}

.wpc-hero-inner {
    width: min(1500px, 86%);
    margin: 0 auto;
    padding: 54px 0;
    position: relative
}

.wpc-hero .wpc-eyebrow {
    color: var(--wpc-gold)
}

.wpc-hero h1,
.wpc-section-title h2,
.wpc-promise h2,
.wpc-closing h2 {
    font-family: Georgia, "Times New Roman", serif;
    font-weight: 500;
    letter-spacing: -.8px
}

.wpc-hero h1 {
    font-size: clamp(42px, 4.3vw, 72px);
    line-height: .92;
    margin: 0 0 18px;
    max-width: 630px
}

.wpc-hero h1 em,
.wpc-section-title h2 em,
.wpc-promise h2 em {
    font-style: normal;
    color: var(--wpc-gold)
}

.wpc-hero-description {
    font-size: clamp(12px, .95vw, 15px);
    line-height: 1.5;
    color: #f0eee9;
    margin: 0;
    max-width: 420px
}

.wpc-hero-actions {
    gap: 10px;
    margin-top: 18px
}

.wpc-button {
    min-height: 42px;
    padding: 0 19px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 9px;
    font-weight: 900;
    letter-spacing: .5px;
    transition: transform .2s, background .2s
}

.wpc-button:hover {
    transform: translateY(-2px)
}

.wpc-button-gold {
    background: var(--wpc-gold);
    border: 1px solid var(--wpc-gold);
    color: #111 !important
}

.wpc-button-outline {
    border: 1px solid #ddd;
    color: #fff !important;
    background: #1115
}

.wpc-hero-caption {
    font-size: 9px;
    letter-spacing: 2.3px;
    margin: 17px 0 0;
    color: #fff
}

.wpc-hero-caption i {
    font-style: normal;
    color: var(--wpc-gold);
    padding: 0 6px
}

.wpc-hero-seal {
    position: absolute;
    right: 5.5%;
    top: 34%;
    width: 100px;
    height: 100px;
    border: 1px solid #d9aa22;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    text-align: center;
    gap: 7px;
    color: white
}

.wpc-hero-seal strong {
    font: 26px Georgia, serif;
    color: var(--wpc-gold)
}

.wpc-hero-seal span {
    font-size: 8px;
    line-height: 1.35;
    font-weight: 800
}

.wpc-hero-seal b {
    color: var(--wpc-gold)
}

.wpc-hero-pagination {
    position: absolute;
    right: 5%;
    bottom: 22px;
    display: flex;
    align-items: center;
    gap: 9px;
    font-size: 10px;
    color: white
}

.wpc-hero-pagination span {
    width: 29px;
    height: 29px;
    border: 1px solid #ddd;
    border-radius: 50%;
    display: grid;
    place-items: center;
    font-size: 16px
}

.wpc-categories {
    background: #fff;
    padding: 22px max(4%, calc((100% - 1450px)/2)) 18px
}

.wpc-section-title {
    align-items: end;
    margin-bottom: 12px
}

.wpc-section-title .wpc-eyebrow {
    margin-bottom: 3px
}

.wpc-section-title h2 {
    font-size: clamp(27px, 2.8vw, 40px);
    line-height: 1.05;
    margin: 0
}

.wpc-view-all {
    font-size: 10px;
    font-weight: 900;
    white-space: nowrap;
    padding-bottom: 6px
}

.wpc-category-row {
    display: grid;
    grid-template-columns: repeat(7, minmax(0, 1fr));
    gap: 14px
}

.wpc-category-row a {
    min-width: 0;
    gap: 7px
}

.wpc-category-row img {
    width: clamp(78px, 8.3vw, 125px);
    aspect-ratio: 1;
    border-radius: 50%;
    object-fit: cover;
    object-position: center 25%;
    background: #e7d5c2;
    border: 1px solid #eadbc4;
    transition: transform .25s
}

.wpc-category-row a:hover img {
    transform: translateY(-3px)
}

.wpc-category-row b {
    font-size: 9px;
    line-height: 1.4;
    min-height: 25px
}

.wpc-promotions {
    background: #090a09;
    padding: 10px 2%;
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px
}

.wpc-promo-card {
    position: relative;
    isolation: isolate;
    min-height: clamp(155px, 15vw, 235px);
    display: flex;
    align-items: center;
    overflow: hidden;
    background: #1b160f;
    color: #fff !important
}

.wpc-promo-card>img {
    position: absolute;
    z-index: -2;
    inset: 0;
    width: 100%;
    height: 130%;
    object-fit: cover;
    object-position: center
}

.wpc-promo-shade {
    position: absolute;
    z-index: -1;
    inset: 0;
    background: linear-gradient(90deg, #050505e8 0%, #050505a8 38%, #05050518 78%)
}

.wpc-promo-copy {
    padding: 22px 7%
}

.wpc-promo-copy small {
    font-size: 9px;
    letter-spacing: 2.4px;
    font-weight: 800
}

.wpc-promo-copy strong {
    font: 500 clamp(25px, 2.8vw, 39px)/1.02 Georgia, serif;
    margin: 10px 0 5px
}

.wpc-promo-copy>span {
    font-size: 11px;
    margin-bottom: 11px
}

.wpc-promo-copy>b {
    background: var(--wpc-gold);
    color: #111;
    padding: 10px 14px;
    font-size: 9px
}

.wpc-products {
    background: #fff;
    padding: 18px max(4%, calc((100% - 1450px)/2)) 24px
}

.wpc-products-title {
    margin-bottom: 10px
}

.wpc-sort-label {
    font-size: 10px;
    white-space: nowrap
}

.wpc-sort-label select {
    background: #fff;
    border: 1px solid #ddd5c9;
    padding: 8px 10px;
    font-size: 11px
}

.wpc-catalog {
    min-width: 0
}

.wpc-shop-layout {
    display: grid;
    grid-template-columns: 220px minmax(0, 1fr);
    gap: 14px;
    align-items: start
}

.wpc-filter-panel {
    background: #fff;
    border: 1px solid #e0dacf;
    padding: 15px 13px;
    border-radius: 3px
}

.wpc-filter-heading {
    padding-bottom: 12px;
    margin-bottom: 12px;
    border-bottom: 1px solid #e8e2d9
}

.wpc-filter-heading h3 {
    font-size: 14px;
    margin: 0
}

.wpc-filter-heading button {
    border: 0;
    background: none;
    color: #b57910;
    font-size: 10px;
    font-weight: 800
}

.wpc-filter-group {
    padding-bottom: 12px;
    margin-bottom: 12px;
    border-bottom: 1px solid #e8e2d9
}

.wpc-filter-group:last-child {
    border-bottom: 0;
    margin-bottom: 0
}

.wpc-filter-group h4 {
    font-size: 11px;
    margin: 0 0 8px;
    font-weight: 800
}

.wpc-filter-group>label {
    display: flex;
    align-items: center;
    gap: 7px;
    margin: 6px 0;
    font-size: 11px;
    color: #454545
}

.wpc-filter-group input {
    accent-color: #d4a62e
}

.wpc-filter-group label small {
    margin-left: auto;
    color: #888;
    font-size: 10px
}

#wpc-price {
    width: 100%;
    display: block;
    accent-color: #e7b93d
}

.wpc-price-labels {
    font-size: 10px;
    color: #666;
    margin-top: 6px
}

.wpc-size-options {
    display: flex;
    flex-wrap: wrap;
    gap: 5px
}

.wpc-size-options label {
    display: flex;
    align-items: center;
    justify-content: center;
    min-width: 30px;
    min-height: 29px;
    padding: 4px;
    border: 1px solid #e5e1db;
    background: #fafafa;
    font-size: 9px
}

.wpc-size-options input {
    position: absolute;
    opacity: 0
}

.wpc-size-options label:has(input:checked) {
    background: #ffedb8;
    border-color: #c18d21
}

.wpc-color-options {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 9px
}

.wpc-color-options label {
    position: relative
}

.wpc-color-options input {
    position: absolute;
    opacity: 0
}

.wpc-color-options i {
    display: block;
    width: 19px;
    height: 19px;
    border-radius: 50%;
    background: var(--swatch);
    border: 1px solid #bbb;
    outline: 2px solid transparent;
    outline-offset: 2px
}

.wpc-color-options input:checked+i {
    outline-color: #c18d21
}

.wpc-rating-filter label span {
    color: #efa91e;
    letter-spacing: -1px
}

.wpc-tabs {
    display: flex;
    flex-wrap: wrap;
    gap: 5px;
    margin: 0 0 9px
}

.wpc-tabs button {
    border: 1px solid #e7e3dc;
    background: #f9f8f6;
    padding: 9px 10px;
    font-size: 8px;
    font-weight: 900;
    white-space: nowrap
}

.wpc-tabs button.active,
.wpc-tabs button:hover {
    background: var(--wpc-gold);
    border-color: var(--wpc-gold)
}

.wpc-results {
    font-size: 10px;
    color: #777;
    margin: 0 0 8px
}

.wpc-product-grid {
    --bs-gutter-x: 12px;
    --bs-gutter-y: 12px
}

.wpc-product-card {
    position: relative;
    min-width: 0;
    background: white;
    border: 1px solid #e5dfd6;
    overflow: hidden;
    transition: box-shadow .2s, transform .2s
}

.wpc-product-card[hidden] {
    display: none !important
}

.wpc-product-card:hover {
    transform: translateY(-2px);
    box-shadow: 0 7px 20px #00000012
}

.wpc-product-photo {
    display: block;
    width: 100%;
    aspect-ratio: 3/3.2;
    background: #eee4d8;
    overflow: hidden
}

.wpc-product-photo img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center 25%;
    transition: transform .3s
}

.wpc-product-card:hover .wpc-product-photo img {
    transform: scale(1.025)
}

.wpc-badge {
    position: absolute;
    top: 7px;
    left: 7px;
    background: var(--wpc-gold);
    color: #111;
    font-size: 8px;
    font-weight: 900;
    padding: 6px 8px
}

.wpc-wishlist {
    position: absolute;
    right: 7px;
    top: 7px;
    width: 27px;
    height: 27px;
    border: 1px solid #fff9;
    border-radius: 50%;
    background: #1118;
    color: #fff;
    font-size: 19px;
    line-height: 1
}

.wpc-wishlist.active {
    color: #ff8d9c
}

.wpc-product-info {
    padding: 8px 8px 9px
}

.wpc-product-info h3 {
    font-size: 10px;
    line-height: 1.35;
    margin: 0 0 5px;
    font-weight: 800
}

.wpc-stars {
    font-size: 11px;
    line-height: 1;
    color: #efa91e;
    margin: 0 0 5px;
    white-space: nowrap
}

.wpc-stars small {
    font-size: 9px;
    color: #888
}

.wpc-price {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 5px;
    margin: 0 0 7px
}

.wpc-price strong {
    font-size: 11px;
    color: #a86a10
}

.wpc-price del {
    font-size: 8px;
    color: #999
}

.wpc-price b {
    font-size: 8px;
    color: #9d6506;
    background: #fff0c8;
    padding: 5px;
    margin-left: auto
}

.wpc-actions {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 5px
}

.wpc-actions button {
    min-height: 28px;
    padding: 4px 2px;
    border: 1px solid #d2ccc2;
    background: #fff;
    font-size: 7.5px;
    font-weight: 900;
    white-space: nowrap
}

.wpc-actions .wpc-buy-now {
    background: var(--wpc-gold);
    border-color: var(--wpc-gold)
}

#wpc-empty {
    padding: 25px;
    text-align: center;
    background: #fafafa;
    border: 1px dashed #d8d0c3;
    font-size: 13px
}

#wpc-empty[hidden] {
    display: none
}

.wpc-promise {
    background: #090a09;
    color: #fff;
    text-align: center;
    padding: 20px 4% 18px
}

.wpc-promise>.wpc-eyebrow {
    color: var(--wpc-gold);
    font-size: 8px;
    margin-bottom: 5px
}

.wpc-promise h2 {
    font-size: clamp(25px, 2.4vw, 34px);
    margin: 0 0 14px
}

.wpc-promise h2 em {
    color: var(--wpc-gold)
}

.wpc-promise-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    border: 1px solid #45433d;
    border-radius: 3px
}

.wpc-promise-grid article {
    padding: 12px 8px
}

.wpc-promise-grid article+article {
    border-left: 1px solid #45433d
}

.wpc-promise-grid article>span {
    font-size: 34px;
    line-height: 1;
    color: var(--wpc-gold)
}

.wpc-promise-grid h3 {
    font-size: 11px;
    margin: 5px 0 4px
}

.wpc-promise-grid p {
    font-size: 10px;
    line-height: 1.35;
    color: #d2d0c9;
    margin: 0
}

.wpc-closing {
    position: relative;
    isolation: isolate;
    min-height: clamp(240px, 24vw, 380px);
    display: flex;
    align-items: center;
    background: #19130e;
    color: #fff;
    overflow: hidden
}

.wpc-closing>img {
    position: absolute;
    z-index: -2;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center 10%
}

.wpc-closing-overlay {
    position: absolute;
    z-index: -1;
    inset: 0;
    background: linear-gradient(90deg, #0000 25%, #0004 50%, #000d 78%)
}

.wpc-closing-copy {
    width: 44%;
    margin: auto;
    padding: 35px 5% 35px 15px
}

.wpc-closing-copy .wpc-eyebrow {
    color: var(--wpc-gold)
}

.wpc-closing h2 {
    font-size: clamp(29px, 3vw, 46px);
    line-height: 1.02;
    margin: 0 0 17px
}

@media(min-width:1500px) {
    .wpc-shop-layout {
        grid-template-columns: 260px minmax(0, 1fr)
    }

    .wpc-product-info {
        padding: 11px
    }

    .wpc-product-info h3 {
        font-size: 12px
    }

    .wpc-actions button {
        font-size: 9px;
        min-height: 33px
    }
}

@media(min-width:761px) and (max-width:1100px) {
    .wpc-shop-layout {
        grid-template-columns: 205px minmax(0, 1fr);
        gap: 10px
    }

    .wpc-product-card {
        width: 33.33333333%
    }

    .wpc-tabs button {
        padding: 8px
    }

    .wpc-category-row {
        gap: 8px
    }
}

@media(max-width:760px) {
    .wpc-hero {
        min-height: clamp(640px, 100svh, 820px);
        align-items: flex-end
    }

    .wpc-hero-image {
        object-position: 72% 24%
    }

    .wpc-hero-overlay {
        background: linear-gradient(0deg, #050505f5 0%, #050505bd 45%, #05050512 100%)
    }

    .wpc-hero-inner {
        width: 90%;
        padding: clamp(300px, 45svh, 390px) 0 34px
    }

    .wpc-hero h1 {
        font-size: clamp(39px, 9vw, 55px)
    }

    .wpc-hero-description br {
        display: none
    }

    .wpc-hero-seal {
        width: 72px;
        height: 72px;
        right: 4%;
        top: 8%;
        gap: 3px
    }

    .wpc-hero-seal strong {
        font-size: 19px
    }

    .wpc-hero-seal span {
        font-size: 6px
    }

    .wpc-hero-pagination {
        display: none
    }

    .wpc-categories {
        padding: 22px 4%
    }

    .wpc-section-title h2 {
        font-size: clamp(25px, 5vw, 33px)
    }

    .wpc-category-row {
        grid-template-columns: repeat(4, minmax(0, 1fr));
        gap: 17px 8px
    }

    .wpc-category-row img {
        width: min(100%, 100px)
    }

    .wpc-category-row b {
        font-size: 8px
    }

    .wpc-promotions {
        grid-template-columns: 1fr;
        padding: 12px 3%;
        gap: 10px
    }

    .wpc-promo-card {
        min-height: 250px
    }

    .wpc-promo-card>img {
        height: 100%;
        object-position: 70% center
    }

    .wpc-promo-card:first-child>img {
        object-position: 73% center
    }

    .wpc-promo-copy {
        padding: 18px
    }

    .wpc-products {
        padding: 22px 3%
    }

    .wpc-shop-layout {
        grid-template-columns: 1fr
    }

    .wpc-filter-panel {
        padding: 13px
    }

    .wpc-filter-group>label {
        display: inline-flex;
        width: 47%;
        vertical-align: top
    }

    .wpc-tabs {
        flex-wrap: nowrap;
        overflow-x: auto;
        padding-bottom: 5px
    }

    .wpc-tabs button {
        flex: 0 0 auto
    }

    .wpc-product-grid {
        --bs-gutter-x: 10px;
        --bs-gutter-y: 10px
    }

    .wpc-product-info h3 {
        font-size: 11px
    }

    .wpc-price strong {
        font-size: 12px
    }

    .wpc-actions button {
        min-height: 36px;
        font-size: 8px
    }

    .wpc-promise {
        padding: 25px 4%
    }

    .wpc-promise-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr))
    }

    .wpc-promise-grid article+article {
        border-left: 0
    }

    .wpc-promise-grid article:nth-child(even) {
        border-left: 1px solid #45433d
    }

    .wpc-promise-grid article:nth-child(n+3) {
        border-top: 1px solid #45433d
    }

    .wpc-closing {
        min-height: clamp(440px, 72svh, 560px);
        align-items: flex-end
    }

    .wpc-closing>img {
        object-position: 72% 24%
    }

    .wpc-closing-overlay {
        background: linear-gradient(0deg, #000e 0%, #0009 42%, #0000 100%)
    }

    .wpc-closing-copy {
        width: 100%;
        padding: clamp(250px, 42svh, 340px) 6% 30px
    }
}

@media(max-width:390px) {
    .wpc-section-title {
        align-items: flex-start
    }

    .wpc-view-all {
        font-size: 9px
    }

    .wpc-hero-actions .wpc-button {
        padding: 0 12px;
        font-size: 9px
    }

    .wpc-product-info {
        padding: 7px 6px
    }

    .wpc-actions {
        grid-template-columns: 1fr
    }

    .wpc-price b {
        margin-left: 0
    }
}

/* ==============================================appppppppppppppppppppppppppp */



/* =====================================WOMENS PREMIMUM PAGE CSS END  ========================*/
