/* Cart benefits progress bar (free shipping + 10% at 6 bottles, 15% at 12) */
.cart-progress {
    flex: 0 0 auto;
    padding: 6px 6px 46px;
}
.cart-progress__lead {
    font-size: 13px;
    color: #4a4a4a;
    margin: 0 0 20px;
    text-align: left;
}
.cart-progress__track {
    position: relative;
    height: 4px;
    background: #e6e3dc;
    border-radius: 4px;
    margin: 0 14px;
}
.cart-progress__fill {
    position: absolute;
    left: 0;
    top: 0;
    bottom: 0;
    background: #2f9e6f;
    border-radius: 4px;
    transition: width 0.45s ease;
}
.cart-progress__point {
    position: absolute;
    top: 50%;
    transform: translate(-50%, -50%);
}
.cart-progress__dot {
    display: block;
    width: 14px;
    height: 14px;
    border-radius: 50%;
    background: #fff;
    border: 2px solid #cfcabf;
    transition: border-color 0.3s ease, background 0.3s ease;
}
.cart-progress__point.is-reached .cart-progress__dot {
    background: #2f9e6f;
    border-color: #2f9e6f;
}
.cart-progress__caption {
    position: absolute;
    top: 20px;
    left: 50%;
    transform: translateX(-50%);
    /* Wraps instead of forcing one long line — the first milestone now names two
       benefits (free shipping + 10%), which was wide enough at nowrap to run into
       the second milestone's caption a few characters away. */
    white-space: normal;
    width: max-content;
    max-width: 108px;
    text-align: center;
    line-height: 1.25;
}
.cart-progress__point:last-child .cart-progress__caption {
    left: auto;
    right: 0;
    transform: none;
    text-align: right;
}
.cart-progress__caption strong {
    display: block;
    font-size: 12px;
    color: #2a2a2a;
    font-weight: 600;
}
.cart-progress__caption small {
    font-size: 10px;
    color: #8a857a;
    text-transform: uppercase;
    letter-spacing: 0.04em;
}
.cart-progress__point.is-reached .cart-progress__caption strong {
    color: #2f9e6f;
}

/* Single-product quantity stepper (next to Add to cart) */
.vinaria-buy-row {
    margin-top: 12px;
}
.vinaria-qty-stepper {
    border: 1px solid #1a1a1a;
}
.vinaria-qty-btn {
    width: 42px;
    border: none;
    background: transparent;
    font-size: 20px;
    line-height: 1;
    cursor: pointer;
    color: #1a1a1a;
    transition: background 0.15s ease;
}
.vinaria-qty-btn:hover {
    background: #efece4;
}
.vinaria-qty-input {
    width: 52px;
    border: none;
    border-left: 1px solid #d9d5cc;
    border-right: 1px solid #d9d5cc;
    text-align: center;
    font-size: 15px;
    background: transparent;
    -moz-appearance: textfield;
    appearance: textfield;
}
.vinaria-qty-input::-webkit-outer-spin-button,
.vinaria-qty-input::-webkit-inner-spin-button {
    -webkit-appearance: none;
    margin: 0;
}

/* Prevent the phantom horizontal scrollbar caused by the full-width (100vw)
   mega menu: 100vw includes the vertical scrollbar, overflowing the page by
   ~15px. overflow-x: clip removes the horizontal scroll without breaking
   position: sticky (unlike overflow: hidden). */
html {
    overflow-x: clip;
}

/* Checkout city autocomplete (NovaPost settlements) */
.co-city-autocomplete {
    position: relative;
}
.co-city-suggestions {
    position: absolute;
    top: calc(100% + 4px);
    left: 0;
    right: 0;
    z-index: 1000;
    margin: 0;
    padding: 4px 0;
    list-style: none;
    background: #fff;
    border: 1px solid #e2e2e2;
    border-radius: 8px;
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.12);
    max-height: 280px;
    overflow-y: auto;
}
.co-city-suggestions[hidden] {
    display: none;
}
.co-city-suggestion {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 12px;
    padding: 9px 14px;
    cursor: pointer;
    line-height: 1.2;
}
.co-city-suggestion:hover,
.co-city-suggestion:focus {
    background: #f4f2ee;
}
.co-city-suggestion small {
    color: #8a8a8a;
    white-space: nowrap;
}

.h-60px {
    height: 60px;
}
.h-80px {
    height: 80px;
}
.h-100px {
    height: 100px;
}
.h-400px {
    height: 400px;
}
.header-icon {
    position: relative;
}
.cart-counter {
    position: absolute;
    top: -9px;
    right: -15px;
    width: 20px;
    height: 20px;
    line-height: 20px;
    font-size: 12px;
}
.label-input-field input,
.label-input-field textarea,
.label-input-field select {
    width: 100%;
    padding: 16px 24px;
    border-radius: 4px;
    border: 1px solid #e4e4e4;
    outline: 0;
}
.label-input-field label {
    .gama-vintage-layout {
        background: #efefee;
    }

    .gama-vintage-panel {
        display: flex;
        flex-direction: column;
        min-height: 100%;
    }

    .gama-vintage-intro {
        padding: 30px 24px 32px;
    }

    .gama-vintage-breadcrumb {
        font-size: 11px;
        color: #7f7f7a;
        margin: 0;
    }

    .gama-vintage-tabs {
        display: flex;
        flex-wrap: wrap;
        gap: 8px;
    }

    .gama-vintage-tab {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        border: 1px solid #d3d3d0;
        padding: 7px 12px;
        font-size: 10px;
        line-height: 1;
        letter-spacing: 0.08em;
        text-transform: uppercase;
        text-decoration: none;
        color: #2a2a28;
        background: #f4f4f3;
        transition: all 0.22s ease;
    }

    .gama-vintage-tab:hover,
    .gama-vintage-tab:focus,
    .gama-vintage-tab.is-active {
        border-color: #101010;
        color: #101010;
        background: #fff;
    }

    .gama-vintage-heading {
        font-family: "Inter", "Segoe UI", sans-serif;
        font-size: clamp(46px, 8vw, 78px);
        line-height: 0.94;
        letter-spacing: 0.01em;
        font-weight: 500;
        color: #0f0f0f;
        word-break: break-word;
    }

    .gama-vintage-description {
        max-width: 430px;
        font-size: 13px;
        line-height: 1.65;
        color: #151515;
    }

    .gama-vintage-products {
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 1px;
        background: #dbdbd9;
    }

    .gama-vintage-card {
        background: #efefee;
    }

    .gama-vintage-card--empty {
        grid-column: span 2;
    }

    .gama-vintage-card__link {
        display: flex;
        flex-direction: column;
        min-height: 360px;
        padding: 10px 14px 12px;
        text-decoration: none;
        color: #121212;
    }

    .gama-vintage-card__badge {
        align-self: flex-end;
        font-size: 9px;
        letter-spacing: 0.1em;
        text-transform: uppercase;
        margin-bottom: 6px;
        color: #343431;
    }

    .gama-vintage-card__media {
        flex: 1;
        display: flex;
        align-items: center;
        justify-content: center;
        overflow: hidden;
    }

    .gama-vintage-card__media img {
        width: 100%;
        max-width: 190px;
        height: auto;
        transition: transform 0.28s ease;
    }

    .gama-vintage-card__title {
        margin: 8px 0 0;
        font-size: 12px;
        font-weight: 500;
        line-height: 1.35;
        color: #131313;
    }

    .gama-vintage-card__link:hover .gama-vintage-card__media img,
    .gama-vintage-card__link:focus .gama-vintage-card__media img {
        transform: scale(1.03);
    }

    .gama-vintage-banner {
        min-height: 100%;
    }

    .gama-vintage-banner img,
    .gama-vintage-banner__video {
        display: block;
        width: 100%;
        height: 100%;
        min-height: 760px;
        object-fit: cover;
    }

    .range-wine-card__media {
        position: relative;
        overflow: hidden;
        min-height: 260px;
    }

    .range-wine-card__media img,
    .range-wine-card__media video {
        position: absolute;
        inset: 0;
        width: 100%;
        height: 100%;
        object-fit: cover;
        transition:
            opacity 0.3s ease,
            transform 0.3s ease;
    }

    .range-wine-card__image {
        opacity: 1;
        transform: scale(1);
    }

    .range-wine-card__video {
        opacity: 0;
    }

    .range-wine-card--has-video .range-wine-card__image {
        opacity: 0;
    }

    .range-wine-card--has-video .range-wine-card__video {
        opacity: 1;
    }

    .range-wine-card--has-video:hover .range-wine-card__image {
        opacity: 1;
        transform: scale(1.04);
    }

    .range-wine-card--has-video:hover .range-wine-card__video {
        opacity: 0;
    }

    .gama-products-section {
        background: #fff;
    }

    @media (max-width: 1199.98px) {
        .gama-vintage-intro {
            padding: 24px 16px 24px;
        }

        .gama-vintage-banner img,
        .gama-vintage-banner__video {
            min-height: 520px;
        }
    }

    @media (max-width: 767.98px) {
        .gama-vintage-products {
            grid-template-columns: 1fr;
        }

        .gama-vintage-card__link {
            min-height: 300px;
        }

        .gama-vintage-card--empty {
            grid-column: span 1;
        }

        .gama-vintage-banner img,
        .gama-vintage-banner__video {
            min-height: 380px;
        }
    }
    box-shadow:
        0 0.125rem 0.3rem -0.0625rem rgba(0, 0, 0, 0.1),
        0 0.275rem 0.75rem -0.0625rem rgba(249, 250, 251, 0.06) !important;
}

#toast-container [dir="rtl"] > .toast-success {
    background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 512 512' width='512' height='512'%3E%3Cpath fill='%2371dd37' d='M96 110l-32 30.5L325.7 402L448 280l-32-30.5l-90.3 90.4L96 110z'/%3E%3C/svg%3E") !important;
}

#toast-container > .toast-warning {
    background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 512 512' width='512' height='512'%3E%3Cpath fill='%23ffab00' d='M32 464h448L256 48 32 464zm248-64h-48v-48h48v48zm0-80h-48v-96h48v96z'/%3E%3C/svg%3E") !important;
    background-size: 24px;
}

#toast-container > .toast-warning .toast-close-button {
    background-color: #fcac00 !important;
    -webkit-box-shadow:
        0 0.125rem 0.3rem -0.0625rem rgba(0, 0, 0, 0.1),
        0 0.275rem 0.75rem -0.0625rem rgba(249, 250, 251, 0.06) !important;
    box-shadow:
        0 0.125rem 0.3rem -0.0625rem rgba(0, 0, 0, 0.1),
        0 0.275rem 0.75rem -0.0625rem rgba(249, 250, 251, 0.06) !important;
}

#toast-container:not(.toast-bottom-full-width, .toast-top-full-width) > div {
    width: 25rem !important;
}

.toast-progress {
    position: absolute;
    bottom: 0;
    top: auto;
    opacity: 0.2;
    height: 0.1875rem;
    background-color: #212b36;
    border-bottom-right-radius: 0.3125rem;
    border-bottom-left-radius: 0.3125rem;
}

[dir="rtl"] .toast-progress {
    left: auto;
    right: 0;
}

.toast-close-button {
    position: absolute;
    top: 0;
    text-shadow: none;
    border-top-right-radius: 0.25rem;
    padding: 0.2rem 0.45rem !important;
    -webkit-transition: all 0.23s ease 0.1s;
    transition: all 0.23s ease 0.1s;
    opacity: 1 !important;
    line-height: 0.98;
}

html:not([dir="rtl"]) .toast-close-button {
    right: 0 !important;
}

[dir="rtl"] .toast-close-button {
    left: -7px !important;
    right: auto !important;
}

@media (max-width: 419.98px) {
    .toast {
        width: 300px !important;
    }
}
#toast-container .toast-close-button {
    font-weight: 300;
    color: #f4f6f8 !important;
    background-color: #ffffff;
    -webkit-box-shadow:
        0 0.125rem 0.3rem -0.0625rem rgba(0, 0, 0, 0.1),
        0 0.275rem 0.75rem -0.0625rem rgba(249, 250, 251, 0.06);
    box-shadow:
        0 0.125rem 0.3rem -0.0625rem rgba(0, 0, 0, 0.1),
        0 0.275rem 0.75rem -0.0625rem rgba(249, 250, 251, 0.06);
}

#toast-container > .toast-success,
#toast-container > .toast-success .toast-message a,
#toast-container > .toast-success .toast-message label {
    background-color: #ffffff !important;
    color: #20b250;
}
#toast-container > .toast-error,
#toast-container > .toast-error .toast-message a,
#toast-container > .toast-error .toast-message label {
    background-color: #ffffff !important;
    color: #e03a1d;
}
#toast-container > .toast-info,
#toast-container > .toast-info .toast-message a,
#toast-container > .toast-info .toast-message label {
    background-color: #ffffff !important;
    color: #0d5abf;
}
#toast-container > .toast-warning,
#toast-container > .toast-warning .toast-message a,
#toast-container > .toast-warning .toast-message label {
    background-color: #ffffff !important;
    color: #fcac00;
}
#toast-container > .toast-success .toast-close-button,
#toast-container > .toast-error .toast-close-button,
#toast-container > .toast-info .toast-close-button,
#toast-container > .toast-warning .toast-close-button {
    color: #ffffff !important;
}
/* toastr */

.address-delete-modal {
    max-width: 700px !important;
}

.min-h-400 {
    min-height: 400px !important;
}

.avatar-icon {
    width: 1.75rem;
    height: 1.75rem;
    line-height: 1.75rem;
}

.vertical-product-card .card-btn {
    z-index: 1;
}

body {
    padding-top: 0;
    scrollbar-gutter: stable both-edges;
}

.site-header {
    position: relative;
    top: 0;
    left: 0;
    right: 0;
    z-index: 1050;
    min-height: 60px;
    background: transparent;
    transition:
        background-color 0.28s ease,
        box-shadow 0.28s ease,
        color 0.28s ease;
}

body.header-absolute .site-header {
    position: absolute;
    /* Absolute is relative to the padding box, so body's padding-top doesn't move
       it — offset it explicitly to sit below the fixed announcement bar. */
    top: var(--announce-height, 0px);
}

.site-header-link,
.site-header-brand {
    color: #1e1e1e;
    transition: color 0.28s ease;
    display: flex;
    align-items: center;
    justify-content: center;
}

.site-header-link {
    background: transparent;
    border: 0;
    padding: 0;
}

.site-header-mega {
    position: relative;
}

.site-header-mega::after {
    content: "";
    position: absolute;
    top: 100%;
    left: 0;
    width: min(920px, 88vw);
    height: 14px;
}

.site-header-link--mega {
    gap: 6px;
}

.site-header-link--mega::after {
    content: "\f078";
    font-family: "Font Awesome 6 Free";
    font-weight: 900;
    font-size: 10px;
    line-height: 1;
    margin-top: 2px;
    transition: transform 0.2s ease;
}

.site-header-mega-menu {
    position: absolute;
    top: 100%;
    left: -40px;
    min-width: min(100vw, 100vw);
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    transform: translateY(0);
    transition:
        opacity 0.2s ease,
        transform 0.2s ease,
        visibility 0.2s ease;
    z-index: 9999999 !important;
}
.new_site_menu {
    background: #ffffff;
    margin-top: 25px;
    border: 1px solid rgba(20, 20, 20, 0.12);
    box-shadow: 0 22px 48px rgba(0, 0, 0, 0.14);
    padding: 28px;
}

.site-header-mega-menu__inner {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 24px;
}

.site-header-mega-menu__title {
    margin: 0 0 10px;
    font-size: 13px;
    font-weight: 700;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    color: #111;
}

.site-header-mega-menu__list {
    list-style: none;
    margin: 0;
    padding: 0;
    display: grid;
    gap: 8px;
}

.site-header-mega-menu__link {
    display: inline-flex;
    font-size: 14px;
    line-height: 1.45;
    color: #333;
    text-decoration: none;
    transition: color 0.2s ease;
}

.site-header-mega-menu__link:hover,
.site-header-mega-menu__link:focus-visible {
    color: #000;
}

.site-header-mega:hover .site-header-mega-menu,
.site-header-mega:focus-within .site-header-mega-menu {
    opacity: 1;
    visibility: visible;
    pointer-events: auto;
    transform: translateY(0);
}

.site-header-mega:hover .site-header-link--mega::after,
.site-header-mega:focus-within .site-header-link--mega::after {
    transform: rotate(180deg);
}

@media (max-width: 1199.98px) {
    .site-header-mega-menu {
        min-width: min(760px, 88vw);
    }

    .site-header-mega-menu__inner {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

.site-header-brand-logo {
    display: block;
    object-fit: contain;
    width: 100%;
    height: 100%;
}
.site-header-mobile__brand .site-header-brand-logo {
    height: 40px;
    max-width: 250px;
}

.site-header-brand-logo.logo-black {
    filter: brightness(0) saturate(100%);
}

.site-header-badge {
    background: rgba(255, 255, 255, 0.9);
    color: #1e1e1e;
}

.site-header-cart-toggle {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 34px;
    height: 34px;
    border: 0;
    background: transparent;
    color: inherit;
    padding: 0;
}

.site-header-cart-toggle svg {
    width: 14px;
    height: 19px;
}

.site-header-cart-text {
    width: auto;
    gap: 5px;
    font-size: 14px;
    font-weight: 400;
    letter-spacing: 0.04em;
    text-transform: uppercase;
}

.site-header-cart-text .cart-label {
    line-height: 1;
}

.site-header-cart-indicator {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    line-height: 1;
}

.site-header-cart-indicator--dot {
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: currentColor;
    opacity: 0.45;
}

.site-header-cart-indicator--count {
    min-width: 18px;
    height: 18px;
    padding: 0 5px;
    border-radius: 999px;
    background: #000;
    color: #fff;
    font-size: 11px;
    font-weight: 600;
}

.gshop-header-cart {
    position: relative;
}

.cart-box-wrapper {
    position: fixed !important;
    inset: 0 !important;
    top: 0 !important;
    right: 0 !important;
    bottom: 0 !important;
    left: 0 !important;
    min-width: 0 !important;
    padding-top: 0 !important;
    width: auto !important;
    z-index: 1200;
    display: flex;
    justify-content: flex-end;
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    transition:
        opacity 0.24s ease,
        visibility 0.24s ease;
}

.cart-box-backdrop {
    position: absolute;
    inset: 0;
    border: 0;
    background: rgba(0, 0, 0, 0.56);
    padding: 0;
}

.gshop-header-cart.is-open .cart-box-wrapper {
    opacity: 1;
    visibility: visible;
    pointer-events: auto;
}

/* Disable legacy hover-to-open behavior from base theme CSS */
.gshop-header-cart:not(.is-open):hover .cart-box-wrapper,
.gshop-header-cart:not(.is-open):focus-within .cart-box-wrapper {
    opacity: 0 !important;
    visibility: hidden !important;
    pointer-events: none !important;
    top: 0 !important;
}

.gshop-header-cart.is-open:hover .cart-box-wrapper,
.gshop-header-cart.is-open:focus-within .cart-box-wrapper {
    opacity: 1 !important;
    visibility: visible !important;
    pointer-events: auto !important;
    top: 0 !important;
}

body.cart-drawer-open {
    overflow-y: scroll;
    overflow-x: hidden;
    scrollbar-gutter: stable both-edges;
}

.site-header-mobile__toggle,
.site-header-mobile__icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 42px;
    height: 42px;
    border-radius: 999px;
    border: 1px solid rgba(16, 24, 40, 0.12);
    background: rgba(255, 255, 255, 0.92);
    color: #1e1e1e;
    text-decoration: none;
    box-shadow: 0 10px 25px rgba(15, 23, 42, 0.06);
}

.site-header-search-link,
.site-header-mobile__toggle,
.site-header-mobile__icon,
.site-header-search-link:hover,
.site-header-search-link:focus,
.site-header-mobile__icon:hover,
.site-header-mobile__icon:focus,
.site-header-mobile__toggle:hover,
.site-header-mobile__toggle:focus {
    color: #000 !important;
}

.site-header-search-panel {
    position: fixed;
    inset: 0;
    /* Above the mobile header (z-index 1100) and its offcanvas (1110). At mobile
       widths .is-search-open hides the header's own content but the <header> box
       itself (backdrop-filter, opaque background, min-height: 72px) stayed put
       and outranked the panel — it sat on top of the panel's own title/close
       button, and taps landing on that empty strip bubbled to the document
       "click outside" handler and closed the panel right after it opened. */
    z-index: 1120;
    padding: 0;
    background: rgba(12, 12, 12, 0.2);
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    transition:
        opacity 0.24s ease,
        visibility 0.24s ease;
    overflow-y: auto;
}

.site-header-search-panel.is-open {
    opacity: 1;
    visibility: visible;
    pointer-events: auto;
}

.site-header-search-shell {
    width: 100%;
    margin: 0;
    background: #f1f1f1;
    border: 0;
    padding: 0;
    min-height: 100vh;
}

.site-header-search-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.75rem;
    margin-bottom: 0;
    padding: 10px 14px;
    border-bottom: 1px solid rgba(17, 17, 17, 0.12);
}

.site-header-search-title {
    font-size: 0.86rem;
    letter-spacing: 0.06em;
    font-weight: 500;
    color: #1b1b1b;
}

.site-header-search-close {
    width: 34px;
    height: 34px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border: 0;
    border-radius: 0;
    background: transparent;
    color: #111;
    font-size: 1.1rem;
    line-height: 1;
    padding: 0;
}

.site-header-search-toolbar {
    display: flex;
    align-items: center;
    justify-content: flex-start;
    gap: 0;
    margin: 10px 14px 0;
}

.site-header-search-input-wrap {
    flex: 1 1 480px;
    min-width: 0;
    display: flex;
    align-items: center;
    gap: 0.65rem;
    background: #fff;
    border: 1px solid rgba(17, 17, 17, 0.1);
    padding: 0.65rem 0.8rem;
}

.site-header-search-input-wrap i {
    color: #4f4f4f;
    font-size: 0.9rem;
}

.site-header-search-input {
    width: 100%;
    border: 0;
    background: transparent;
    color: #111;
    font-size: 0.95rem;
    line-height: 1.4;
    padding: 0;
}

.site-header-search-input:focus {
    outline: none;
}

.site-header-search-input::placeholder {
    color: #8b8b8b;
}

.site-header-search-nav {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    z-index: 5;
    pointer-events: none;
}

.site-header-search-nav--prev {
    left: 10px;
}

.site-header-search-nav--next {
    right: 10px;
}

.site-header-search-arrow {
    width: 38px;
    height: 38px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border: 1px solid #d5d5d2;
    border-radius: 999px;
    background: #f8f8f7;
    color: #7d7d7b;
    transition:
        background-color 0.2s ease,
        color 0.2s ease,
        border-color 0.2s ease;
    pointer-events: auto;
}

.site-header-search-arrow:hover,
.site-header-search-arrow:focus {
    background: #efefec;
    color: #5f5f5d;
    border-color: #c8c8c4;
}

.site-header-search-arrow:disabled {
    opacity: 0;
    pointer-events: none;
}

.site-header-search-products-wrap {
    position: relative;
    margin-top: 10px;
}

.site-header-search-products {
    display: flex;
    align-items: stretch;
    gap: 0.8rem;
    overflow-x: auto;
    overflow-y: hidden;
    padding: 0 4px 14px;
    scrollbar-width: thin;
    scroll-behavior: smooth;
}

.site-header-search-product-item {
    flex: 0 0 calc((100% - 2.4rem) / 4);
    min-width: calc((100% - 2.4rem) / 4);
    background: #f7f7f7;
}

.site-header-search-empty {
    width: 100%;
    padding: 2rem 1rem;
    text-align: center;
    color: #5e5e5e;
    font-size: 0.92rem;
}

.site-header.is-search-open .site-header-mobile,
.site-header.is-search-open .site-header-desktop-row {
    display: none !important;
}

.site-header-mobile__toggle {
    padding: 0;
    gap: 4px;
    flex-direction: column;
}

.site-header-mobile__toggle span {
    display: block;
    width: 16px;
    height: 1.5px;
    background: currentColor;
    border-radius: 999px;
}

.site-header-mobile__brand {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 0;
}

.site-header-mobile__cart-toggle {
    width: auto;
    min-width: 42px;
    height: 42px;
    padding: 0 12px;
    border-radius: 999px;
    background: rgba(255, 255, 255, 0.92);
    color: #1e1e1e;
    box-shadow: 0 10px 25px rgba(15, 23, 42, 0.06);
}

.site-header-mobile__cart-toggle:hover,
.site-header-mobile__cart-toggle:focus {
    color: #000;
}

.site-header-mobile__icon svg {
    width: 14px;
    height: 19px;
}

.site-header-offcanvas {
    /* Full-page mobile menu (Typology-style) instead of a narrow side panel. */
    width: 100vw !important;
    max-width: 100%;
    overflow-x: hidden;
    border-right: 0;
    background: linear-gradient(180deg, #fcfbf7 0%, #f4f1e8 100%);
}

/* The body is a flex column; mt-auto on the quiz button pins it to the bottom. */
.site-header-offcanvas .offcanvas-body {
    min-height: 0;
}

.site-header-offcanvas__quiz {
    width: 100%;
    border: 0;
    background: #111;
    color: #fff;
    text-transform: uppercase;
    letter-spacing: 0.08em;
    font-size: 0.9rem;
    font-weight: 600;
    padding: 14px 20px;
    border-radius: 999px;
    margin-top: 16px;
}

.site-header-offcanvas__quiz:hover,
.site-header-offcanvas__quiz:focus {
    background: #333;
}

/* The category submenu is layered over the still-open main mobile menu (it is toggled
   by JS via the .show class, not a second bootstrap Offcanvas). Keep it above the main
   panel so it fully covers it while sliding in. */
.site-header-offcanvas--submenu {
    z-index: 1200;
    /* Hidden off to the right by default. The open/close transform is set inline by
       the submenu JS (openSubmenu/closeSubmenu) — a class rule wouldn't reliably beat
       Bootstrap's offcanvas transform here, but an inline !important always does.
       No transition, so the inline transform applies instantly and never sticks. */
    transform: translateX(100%) !important;
    transition: none !important;
}

/* Parked at translateX(100%) the panel sits a full viewport to the right, which added
   375px of horizontal scroll to every page. It has no transition, so there is no
   slide to preserve — taking it out of layout while closed costs nothing. */
.site-header-offcanvas--submenu:not(.show) {
    display: none;
}

.site-header-offcanvas__eyebrow {
    display: inline-flex;
    align-items: center;
    max-width: 100%;
    overflow: hidden;
}

/* Kept deliberately short: the whole menu has to fit inside 100dvh on a small
   phone (where the browser chrome leaves ~560px), otherwise the panel scrolls. */
.site-header-offcanvas__logo {
    display: block;
    width: auto;
    max-width: 100%;
    height: 62px;
    object-fit: contain;
    filter: brightness(0) saturate(100%);
}

.site-header-offcanvas__title {
    font-family: Georgia, "Times New Roman", serif;
    font-size: 1.75rem;
    margin-top: 0.35rem;
}

.site-header-offcanvas__nav {
    margin-top: 0.5rem;
}

.site-header-offcanvas__accordion {
    display: grid;
    gap: 0;
}

.site-header-offcanvas__accordion-item {
    border-radius: 16px;
    background: rgba(255, 255, 255, 0.72);
    border: 1px solid rgba(16, 24, 40, 0.06);
    overflow: hidden;
}

.site-header-offcanvas__accordion-toggle {
    width: 100%;
    border: 0;
    background: transparent;
    color: #1e1e1e;
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0.95rem 1rem;
    font-size: 0.86rem;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.site-header-offcanvas__accordion-toggle i {
    font-size: 0.9rem;
    opacity: 0.65;
    transition: transform 0.22s ease;
}

.site-header-offcanvas__accordion-toggle:not(.collapsed) i {
    transform: rotate(90deg);
}

.site-header-offcanvas__accordion-body {
    display: grid;
    gap: 0.45rem;
    padding: 0 0.8rem 0.9rem;
}

/* Submenu rows match the main menu: flat, separated by a hairline. */
.site-header-offcanvas__sublink {
    color: #1e1e1e;
    text-decoration: none;
    border-radius: 0;
    border: 0;
    border-bottom: 1px solid rgba(16, 24, 40, 0.12);
    background: transparent;
    padding: 1.05rem 0.25rem;
    font-size: 0.78rem;
    letter-spacing: 0.04em;
    transition: opacity 0.2s ease;
}

.site-header-offcanvas__sublink:hover,
.site-header-offcanvas__sublink:focus {
    opacity: 0.6;
}

.site-header-offcanvas__sublink--all {
    font-weight: 600;
}

/* Minimalist (Typology-style) rows: flat, no cards — just a hairline separator. */
.site-header-offcanvas__link {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0.82rem 0.25rem;
    border-radius: 0;
    text-decoration: none;
    color: #1e1e1e;
    background: transparent;
    border: 0;
    border-bottom: 1px solid rgba(16, 24, 40, 0.12);
    font-size: 0.86rem;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.site-header-offcanvas__link--button {
    width: 100%;
    text-align: left;
    font: inherit;
    cursor: pointer;
}

.site-header-offcanvas__link::after {
    content: ">";
    font-size: 0.9rem;
    opacity: 0.5;
}

/* Accordion rows: no ">" chevron — they carry a +/− toggle instead. The plain
   "All products" shortcut is a leaf link, so it drops the chevron too. */
.site-header-offcanvas__acc-trigger::after,
.site-header-offcanvas__link--plain::after {
    content: none;
}

.site-header-offcanvas__acc-item {
    border-bottom: 1px solid rgba(16, 24, 40, 0.12);
}

.site-header-offcanvas__acc-trigger {
    border-bottom: 0 !important;
    width: 100%;
}

/* +/− indicator: a single glyph swapped by the open state. */
.site-header-offcanvas__acc-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 18px;
    height: 18px;
    flex-shrink: 0;
    line-height: 1;
}

.site-header-offcanvas__acc-icon::before {
    content: "+";
    font-size: 1.35rem;
    font-weight: 300;
    color: #1e1e1e;
}

.site-header-offcanvas__acc-trigger[aria-expanded="true"] .site-header-offcanvas__acc-icon::before {
    content: "\2212"; /* minus sign */
}

/* Collapsed by default; jQuery slideToggle animates the height. */
.site-header-offcanvas__acc-panel {
    display: none;
}

.site-header-offcanvas__acc-panel-inner {
    display: grid;
    gap: 0;
    padding-bottom: 0.4rem;
}

.site-header-offcanvas__acc-panel-inner .site-header-offcanvas__sublink {
    padding: 0.62rem 0.9rem;
}

/* The accordion item already draws a bottom border, so the last sublink's own
   border doubled up under "Toate produsele". Drop it. */
.site-header-offcanvas__acc-panel-inner .site-header-offcanvas__sublink:last-child {
    border-bottom: 0;
}

/* One consistent font size across every menu row (main links, category triggers,
   submenu links and the quiz button). */
.site-header-offcanvas__link,
.site-header-offcanvas__accordion-toggle,
.site-header-offcanvas__sublink,
.site-header-offcanvas__quiz {
    font-size: 0.9rem !important;
    letter-spacing: 0.06em;
}

.site-header-offcanvas__panel {
    padding: 1rem;
    border-radius: 18px;
    background: rgba(255, 255, 255, 0.72);
    border: 1px solid rgba(16, 24, 40, 0.06);
}

.site-header-offcanvas__label {
    font-size: 0.68rem;
    letter-spacing: 0.14em;
    color: #111;
}

.site-header-offcanvas__currency {
    border: 1px solid rgba(16, 24, 40, 0.1);
    background: #fff;
    color: #1e1e1e;
    border-radius: 999px;
    min-width: 58px;
    padding: 0.55rem 0.85rem;
    font-size: 0.78rem;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.site-header-offcanvas__currency.is-active {
    background: #1e1e1e;
    color: #fff;
    border-color: #1e1e1e;
}

.site-header-offcanvas__subtotal {
    font-size: 1rem;
    color: #1e1e1e;
}

.site-header-offcanvas__count {
    font-size: 0.68rem;
    letter-spacing: 0.14em;
    color: #111;
}

.site-header-offcanvas .btn-primary {
    background: #000 !important;
    border-color: #000 !important;
    color: #fff !important;
    box-shadow: none !important;
}

.site-header-offcanvas .btn-primary:hover,
.site-header-offcanvas .btn-primary:focus {
    background: #fff !important;
    border-color: #000 !important;
    color: #000 !important;
}

.site-header-offcanvas .btn-close {
    opacity: 1;
    filter: grayscale(1) contrast(1.4);
}

.site-header-offcanvas__back {
    border: 0;
    background: transparent;
    color: #1e1e1e;
    display: inline-flex;
    align-items: center;
    gap: 0.45rem;
    padding: 0;
    font-size: 0.72rem;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.site-header-offcanvas__submenu-title {
    font-size: 1.9rem;
    line-height: 1.1;
    margin-bottom: 1.1rem;
    color: #111;
}

/* The hairline under each row already separates them, so the extra grid gap only
   added dead space between subcategories. */
.site-header-offcanvas__submenu-links {
    display: grid;
    gap: 0;
}

.site-header-offcanvas__submenu-links .site-header-offcanvas__sublink {
    padding: 0.72rem 0.25rem;
}

.apt_cart_box {
    position: relative;
    width: min(460px, 100vw);
    height: 100vh;
    /* White across the whole drawer — head, scroll area and footer — not just the
       body div, which used to sit as a white block on a beige panel. */
    background: #fff;
    border: 0;
    border-radius: 0;
    box-shadow: none;
    margin-left: auto;
    display: grid;
    grid-template-rows: auto 1fr;
    z-index: 1;
    box-sizing: border-box;
    overflow: hidden;
    scrollbar-gutter: stable;
    overscroll-behavior: contain;
}

.cart-drawer-scroll {
    /* The drawer itself no longer scrolls as one block. It is a column:
       the product list scrolls internally, while the totals + checkout footer
       stay pinned and always visible (no more overlap with many products). */
    display: flex;
    flex-direction: column;
    min-height: 0;
    min-width: 0;
    overflow: hidden;
    scrollbar-gutter: stable;
    overscroll-behavior: contain;
}

.cart-drawer-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.75rem;
    background: #fff;
    border-bottom: 1px solid #e1dfdc;
    padding: 26px 24px 18px;
}

.cart-drawer-title {
    font-size: 16px;
    line-height: 1.2;
    letter-spacing: 0.02em;
    color: #191919;
    font-weight: 500;
}

.cart-drawer-head-meta {
    display: inline-flex;
    align-items: center;
    gap: 12px;
}

.cart-drawer-count {
    min-width: 28px;
    height: 28px;
    border-radius: 999px;
    background: #121212;
    color: #fff;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 12px;
    font-weight: 600;
}

.cart-drawer-close {
    border: 0;
    background: transparent;
    color: #111;
    width: 30px;
    height: 30px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0;
}

.cart-drawer-body {
    display: flex;
    flex-direction: column;
    flex: 1 1 auto;
    min-height: 0;
    background: #fff;
    padding: 0 24px 18px;
    min-width: 0;
    overflow: hidden;
}

.cart-navbar-wrapper {
    /* The product list is the ONLY part that scrolls: it flexes to fill the space
       between the progress bar and the totals, and scrolls internally when there
       are many products — so the totals + checkout button never get overlapped.
       !important overrides the theme's fixed 300px cap + own scrollbar. */
    flex: 1 1 auto;
    min-height: 0;
    max-height: none !important;
    height: auto !important;
    overflow-y: auto !important;
    overflow-x: hidden;
    border-bottom: 1px solid #e1dfdc;
    padding: 8px 0;
    min-width: 0;
}

.cart-navbar-item + .cart-navbar-item {
    border-top: 1px solid #eceae8;
}

.cart-navbar-thumb {
    width: 58px;
    min-width: 58px;
    height: 78px;
    border-radius: 0;
    overflow: hidden;
    background: #f6f6f6;
}

.cart-navbar-thumb img {
    width: 100%;
    height: 100%;
    object-fit: contain;
}

.cart-navbar-item {
    padding: 14px 0;
}

/* Two columns now — the price moved into the controls row, so it no longer needs a
   column of its own. */
.cart-navbar-product {
    display: grid;
    grid-template-columns: 58px minmax(0, 1fr);
    align-items: center;
    gap: 14px;
    min-width: 0;
}

.cart-navbar-content {
    min-width: 0;
}

.cart-navbar-content h6 {
    font-size: 15px;
    line-height: 1.35;
    font-weight: 500;
    color: #151515;
    margin: 0;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.cart-navbar-link {
    color: #151515;
    font-size: 14px;
    text-decoration: none;
}

/* Full-width flex row so the price can be pushed to the far right, in line with the
   quantity stepper and the delete icon. No wrapping — it must stay one line. */
.cart-navbar-controls {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-top: 10px;
    max-width: 100%;
    flex-wrap: nowrap;
}

.cart-navbar-qty {
    display: inline-flex;
    align-items: center;
    border: 1px solid #d9d7d4;
    height: 34px;
    background: #fff;
}

.cart-navbar-qty-btn {
    width: 30px;
    height: 32px;
    border: 0;
    background: transparent;
    color: #202020;
    font-size: 17px;
    line-height: 1;
    padding: 0;
}

.cart-navbar-qty-value {
    min-width: 30px;
    text-align: center;
    font-size: 14px;
    color: #1f1f1f;
}

.cart-navbar-line-price {
    font-size: 13px;
    color: #161616;
    font-weight: 500;
    white-space: nowrap;
    /* Pins it to the right edge of the controls row. */
    margin-left: auto;
    text-align: right;
}

.cart-navbar-empty {
    padding: 20px 0;
    text-align: center;
    color: #767676;
}

.cart-drawer-totals {
    flex: 0 0 auto;
    border-bottom: 1px solid #e1dfdc;
    padding: 16px 0 14px;
}

.cart-drawer-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    font-size: 14px;
    color: #232323;
    line-height: 1.4;
}

.cart-drawer-row > span:first-child {
    flex: 1 1 auto;
    text-align: left;
}

.cart-drawer-row > span:last-child {
    flex: 0 0 auto;
    text-align: right;
    white-space: nowrap;
}

.cart-drawer-row--total {
    font-weight: 600;
    margin-top: 2px;
}

.cart-drawer-gift {
    flex: 0 0 auto;
    margin-top: 14px;
    width: 100%;
    border: 0;
    border-bottom: 1px solid #e1dfdc;
    background: transparent;
    color: #1f1f1f;
    font-size: 15px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 10px 0 16px;
}

.cart-drawer-footer {
    flex: 0 0 auto;
    background: #fff;
    border-top: 1px solid #e1dfdc;
    padding: 16px 24px 28px;
    min-width: 0;
    overflow-x: hidden;
}

.apt_cart_box * {
    box-sizing: border-box;
}

.cart-drawer-checkout {
    display: flex;
    width: 100%;
    align-items: center;
    justify-content: center;
    background: #111;
    color: #fff !important;
    border: 1px solid #111;
    text-decoration: none;
    font-size: 14px;
    letter-spacing: 0.06em;
    font-weight: 600;
    text-transform: uppercase;
    min-height: 48px;
    padding: 0.5rem 0.75rem;
    text-align: center;
    white-space: normal;
    word-break: break-word;
}

.cart-drawer-view-cart {
    display: inline-block;
    margin-top: 12px;
    color: #222;
    font-size: 13px;
    text-decoration: underline;
}

/* Header cart hover palette: black/white only */
.gshop-header-cart .header-icon,
.gshop-header-cart .header-icon:hover,
.gshop-header-cart .header-icon:focus,
.gshop-header-cart:hover .header-icon,
.gshop-header-cart:focus-within .header-icon {
    color: #000;
}

.gshop-header-cart:hover .header-icon svg path,
.gshop-header-cart:focus-within .header-icon svg path {
    fill: currentColor;
}

.apt_cart_box a,
.apt_cart_box a h6,
.apt_cart_box .items-content h6,
.apt_cart_box .items-content .h6,
.apt_cart_box .cart-navbar-link,
.apt_cart_box .text-primary,
.apt_cart_box .remove_cart_btn {
    color: #000 !important;
}

.apt_cart_box a:hover,
.apt_cart_box a:hover h6,
.apt_cart_box .items-content h6:hover,
.apt_cart_box .items-content .h6:hover,
.apt_cart_box .cart-navbar-link:hover,
.apt_cart_box .remove_cart_btn:hover,
.apt_cart_box .remove_cart_btn:focus {
    color: #000 !important;
}

.apt_cart_box .btn-secondary,
.apt_cart_box .btn-primary {
    border-radius: 0;
    box-shadow: none;
    font-weight: 600;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    transition: all 0.2s ease;
}

.apt_cart_box .btn-secondary {
    background: #fff !important;
    color: #000 !important;
    border: 1px solid #000 !important;
}

.apt_cart_box .btn-secondary:hover,
.apt_cart_box .btn-secondary:focus {
    background: #000 !important;
    color: #fff !important;
    border-color: #000 !important;
}

.apt_cart_box .btn-primary {
    background: #000 !important;
    color: #fff !important;
    border: 1px solid #000 !important;
}

.apt_cart_box .btn-primary:hover,
.apt_cart_box .btn-primary:focus {
    background: #fff !important;
    color: #000 !important;
    border-color: #000 !important;
}

.apt_cart_box .remove_cart_btn {
    border: 0;
    background: transparent;
    padding: 0;
    font-size: 12px;
}

@media (max-width: 767.98px) {
    .apt_cart_box {
        width: 100%;
    }

    .cart-drawer-body {
        padding: 0 16px 12px;
    }

    .cart-drawer-head,
    .cart-drawer-footer {
        padding-left: 16px;
        padding-right: 16px;
    }
}

.best-seller-section__eyebrow {
    font-family: "Playfair Display", serif;
    /* Slightly scaled down maximum size from 2.5rem to 1.8rem for better balance */
    font-size: clamp(1rem, 1.8vw, 1.6rem);
    /* Adding subtle tracking makes light, thin fonts look highly premium */
    letter-spacing: 0.06em;
    border-bottom: 1px solid rgba(16, 24, 40, 0.12);
    padding-bottom: 0.5rem;
    /* Hairline/Thin weight for maximum elegance */
    font-weight: 100;
}

.best-seller-section__title {
    font-family: "Inter", "Segoe UI", sans-serif;
    font-size: clamp(2rem, 4vw, 4rem);
    line-height: 0.95;
    letter-spacing: 0%;
    font-weight: 500;
}

.best-seller-section__link {
    letter-spacing: 0%;
    border-bottom: 1px solid currentColor;
    padding-bottom: 0.1rem;
    font-size: 13px;
}

@media (max-width: 575.98px) {
    .best-seller-section__link {
        font-size: 11px;
    }
    .vertical-product-card__label {
        font-size: 8px !important;
    }
    .vertical-product-card__title {
        font-size: 14px !important;
        /* Tighter line-height so a 2-line name sits closer to the price. */
        line-height: 1.25 !important;
    }
    .vertical-product-card__price,
    .vertical-product-card__price .product-pricing,
    .vertical-product-card__price .fw-bold,
    .vertical-product-card__price small {
        /* Smaller so the new + struck-through old price fit on one line on the
           narrow 2-per-row card. */
        font-size: 12px !important;
        line-height: 1.25 !important;
    }
    .vertical-product-card__price::before {
        margin-right: 3px !important;
    }
    .vertical-product-card__price .text-decoration-line-through {
        margin-left: 4px !important;
        font-size: 11px !important;
    }

    /* Small badge overlaying the photo; the promo period is a text line under
       the price (never on the bottle). */
    .vertical-product-card__discount-badge {
        font-size: 9px;
        padding: 4px 6px;
    }
    .vertical-product-card__discount-period {
        font-size: 10px;
        margin-top: 3px;
    }
    /* Keep the range name (top-right) from running into the -10% badge
       (top-left): smaller pill, capped width, wraps instead of overflowing. */
    .vertical-product-card--has-offer .vertical-product-card__top-right {
        max-width: calc(100% - 58px);
    }
    .vertical-product-card--has-offer .vertical-product-card__wine-type {
        font-size: 0.56rem;
        padding: 4px 8px;
        letter-spacing: 0.04em;
        line-height: 1.15;
        white-space: normal;
        text-align: center;
        max-width: 100%;
    }

    /* A small, even 5px of breathing room around the name + price on mobile
       (applies to every product-listing page since they share this card). */
    .vertical-product-card .card-body {
        max-height: none !important;
        padding: 5px !important;
        row-gap: 5px !important;
    }

    .vertical-product-card__meta-row {
        /* Small gap between the name and the price when the name wraps to a
           second line (the price drops onto its own line). */
        row-gap: 2px !important;
        /* Vertically center name + price so the (slightly taller) inline-block
           price no longer sits a couple of pixels below the name. */
        align-items: center !important;
    }
}

.vertical-product-card__media {
    position: relative;
    width: 100%;
    max-width: 512px;
    /* Taller frame so a full bottle (cap to base) fits with far less cropping. */
    height: 640px;
    max-height: 640px;
    min-height: 640px;
    margin-left: auto;
    margin-right: auto;
    background: #f3f4f1 !important;
}

.vertical-product-card > .card {
    position: relative;
    overflow: hidden;
    background-color: #f3f4f1 !important;
}

.vertical-product-card,
.vertical-product-card .card,
.vertical-product-card__media,
.vertical-product-card__media-frame,
.vertical-product-card__asset-view,
.vertical-product-card__video {
    border-radius: 0 !important;
}

.vertical-product-card__media-frame {
    position: relative;
    isolation: isolate;
    width: 100%;
    overflow: hidden;
}

.vertical-product-card__asset-view {
    position: relative;
    display: flex;
    align-items: flex-end;
    justify-content: center;
    width: 100%;
    max-height: 100%;
    height: 100%;
    overflow: hidden;
}

.vertical-product-card__label {
    font-size: 0.72rem;
    letter-spacing: 0.08em;
    z-index: 2;
    color: #111;
    transition: color 0.22s ease;
}

.vertical-product-card__wine-type {
    font-size: 0.65rem;
    letter-spacing: 0.08em;
    z-index: 2;
    color: #666;
    background-color: rgba(255, 255, 255, 0.9);
    padding: 6px 12px;
    border-radius: 3px;
    font-weight: 500;
    transition: all 0.22s ease;
    backdrop-filter: blur(2px);
}

/* Single award/distinction icon, centered under the label (flex column + gap-4). */
.vertical-product-card__award {
    /* Mobile: keep the award badge small so it doesn't cover the bottle image.
       Fixed square box + contain → every medal renders the same size regardless
       of the source image's aspect ratio. */
    width: 42px;
    height: 42px;
    z-index: 2;
    object-fit: contain;
}

/* Desktop: make the award badge more prominent. */
@media (min-width: 768px) {
    .vertical-product-card__award {
        width: 92px;
        height: 92px;
    }
}

/* Mobile: right-align the award (and any label pill above it) to the card's right
   edge. With the default align-items:center, the small mobile badge was centered
   under the wider label pill and sat short of the right edge. */
@media (max-width: 767.98px) {
    /* !important is required to beat Bootstrap's .align-items-center utility
       (applied inline on the element) which itself uses !important. */
    .vertical-product-card__top-right {
        align-items: flex-end !important;
        text-align: right;
    }

    /* Best-seller cards are the largest on mobile, so their medals can be bigger
       than the 42px used by the tight 2-per-row grid — without covering the bottle. */
    .best-seller-slide .vertical-product-card__award {
        width: 60px;
        height: 60px;
    }
}

.vertical-product-card:hover .vertical-product-card__wine-type {
    background-color: rgba(255, 255, 255, 1);
    color: #333;
}

.vertical-product-card,
.vertical-product-card:hover,
.vertical-product-card:focus,
.vertical-product-card:focus-visible {
    box-shadow: none !important;
}

.vertical-product-card__review {
    position: absolute;
    top: 12px;
    left: 14px;
    /* Above the hover preview video (z-index 5) so the rating stays visible
       while the video is playing on hover. */
    z-index: 6;
    display: inline-flex;
    align-items: center;
    gap: 0.15rem;
    color: #fff;
    font-size: 0.66rem;
    line-height: 1;
    text-shadow: 0 1px 4px rgba(0, 0, 0, 0.35);
    opacity: 0;
    transform: translateY(-4px);
    transition:
        opacity 0.22s ease,
        transform 0.22s ease;
}

.vertical-product-card__review-star--muted {
    opacity: 0.35;
}

.vertical-product-card__review-count {
    margin-left: 3px;
    font-size: 0.66rem;
    font-weight: 500;
    color: #fff;
}

.vertical-product-card__image {
    display: block;
    width: 100%;
    max-width: 512px;
    /* Matches the taller frame; centred so any residual crop is shared evenly
       between cap and base instead of eating one end. */
    height: 620px;
    max-height: 620px;
    margin: 0 auto;
    object-fit: cover;
    object-position: center;
}

.vertical-product-card__video {
    position: absolute;
    inset: 0;
    display: block;
    width: 100%;
    height: 100%;
    max-width: none;
    max-height: none;
    margin: 0;
    object-fit: cover;
    opacity: 0;
    pointer-events: none;
    z-index: 5;
    transition: opacity 0.16s ease;
}

.js-product-preview-card.is-preview-active .vertical-product-card__video {
    opacity: 1;
}

.js-product-preview-card.is-preview-active {
    position: relative;
}

/* .card is a flex column (Bootstrap default); .media has a fixed/explicit
   height but this wrapper otherwise only takes its .card-body content's
   natural height. flex:1 makes it consume all remaining space down to the
   card's true bottom edge, so the full-bleed video (a sibling, absolute
   inset:0 on .card) is never left showing an uncovered gap beneath it. */
.vertical-product-card__meta-wrap {
    flex: 1;
    min-height: 0;
}

/* CTAs sit hard against the bottom of the card — 10px of breathing room and no
   more. Two equal columns (grid 1fr 1fr) guarantee a clean 50/50 split regardless
   of the button labels; align-items:end keeps them on the baseline. */
.vertical-product-card__preview-cta {
    position: absolute;
    inset: 0;
    display: grid;
    grid-template-columns: 1fr 1fr;
    align-items: end;
    align-content: end;
    gap: 8px;
    padding: 0 12px 10px;
    z-index: 6;
    opacity: 0;
    pointer-events: none;
}

/* When both buttons are present they share the row equally. */
/* The two halves of the CTA row are the preview button and the cart control
   wrapper (which holds either the add button or the qty stepper). Both are direct
   flex children, so the 50/50 split must sit on THEM — not on the inner cart-btn,
   which is nested one level down. */
.vertical-product-card__preview-cta .vertical-product-card__preview-btn,
.vertical-product-card__preview-cta .vertical-product-card__cart-control {
    flex: 1 1 0;
    min-width: 0;
}

.vertical-product-card__preview-cta .vertical-product-card__preview-btn {
    padding: 0 8px;
    text-align: center;
    line-height: 1.1;
    white-space: normal;
    overflow-wrap: anywhere;
}

/* On narrow cards (tablet & mobile) the long RO labels won't fit side by side,
   so stack the two CTAs vertically — each takes the full card width. */
@media (max-width: 991.98px) {
    /* Narrow cards: the long RO labels won't fit side by side, so collapse to a
       single stacked column. */
    .vertical-product-card__preview-cta {
        grid-template-columns: 1fr;
        gap: 6px;
    }
}

.vertical-product-card__cart-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    height: 36px;
    padding: 0 18px;
    border: 0;
    background: #151515;
    color: #fff;
    text-transform: uppercase;
    text-decoration: none;
    font-family: "Inter", "Segoe UI", sans-serif;
    font-size: 12px;
    font-weight: 600;
    letter-spacing: 0.04em;
    cursor: pointer;
    box-shadow: none !important;
    position: relative;
    z-index: 7;
    transition: background 0.22s ease, color 0.22s ease;
}

.vertical-product-card__cart-btn:hover,
.vertical-product-card__cart-btn:focus {
    background: #000;
    color: #fff;
    box-shadow: none !important;
}

.vertical-product-card__cart-btn:disabled {
    opacity: 0.6;
    cursor: default;
}

/* Quantity stepper: same footprint as the add-to-cart button it replaces. */
.vertical-product-card__cart-control {
    width: 100%;
}

.vertical-product-card__qty {
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 100%;
    height: 36px;
    background: #151515;
    color: #fff;
    user-select: none;
}

.vertical-product-card__qty-btn {
    flex: 0 0 40px;
    height: 100%;
    border: 0;
    background: transparent;
    color: #fff;
    font-size: 18px;
    line-height: 1;
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

.vertical-product-card__qty-btn:hover,
.vertical-product-card__qty-btn:focus {
    background: rgba(255, 255, 255, 0.14);
}

.vertical-product-card__qty-value {
    flex: 1 1 auto;
    text-align: center;
    font-family: "Inter", "Segoe UI", sans-serif;
    font-size: 13px;
    font-weight: 600;
    letter-spacing: 0.04em;
}

.vertical-product-card__preview-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    height: 36px;
    padding: 0 18px;
    border: 0;
    background: #fff;
    color: #151515;
    text-transform: uppercase;
    text-decoration: none;
    font-family: "Inter", "Segoe UI", sans-serif;
    font-size: 12px;
    font-weight: 600;
    letter-spacing: 0.04em;
    cursor: pointer;
    box-shadow: none !important;
    position: relative;
    z-index: 7;
}

.vertical-product-card__preview-btn:hover,
.vertical-product-card__preview-btn:focus {
    box-shadow: none !important;
    color: #151515;
}

.js-product-preview-card.is-preview-active .vertical-product-card__preview-cta {
    opacity: 1;
    pointer-events: auto;
}

.vertical-product-card:hover .vertical-product-card__label,
.vertical-product-card:focus-within .vertical-product-card__label,
.js-product-preview-card.is-preview-active .vertical-product-card__label {
    color: #fff;
}

.vertical-product-card:hover .vertical-product-card__review,
.vertical-product-card:focus-within .vertical-product-card__review,
.js-product-preview-card.is-preview-active .vertical-product-card__review {
    opacity: 1;
}

.vertical-product-card__meta-row {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-wrap: wrap;
    gap: 0 8px;
    width: 100%;
    text-align: center;
}

.vertical-product-card__title {
    font-family: "Inter", "Segoe UI", sans-serif;
    font-weight: 500 !important;
    font-style: normal;
    font-size: 20px;
    line-height: 20px;
    letter-spacing: 0.35px;
    display: inline;
    vertical-align: middle;
    color: #111;
}

.vertical-product-card__price,
.vertical-product-card__price .product-pricing,
.vertical-product-card__price .fw-bold,
.vertical-product-card__price small {
    font-family: "Inter", "Segoe UI", sans-serif;
    font-weight: 500 !important;
    font-style: normal;
    font-size: 20px;
    line-height: 20px;
    letter-spacing: 0.35px;
    vertical-align: middle;
}

.vertical-product-card__title a,
.vertical-product-card__price,
.vertical-product-card__price .product-pricing,
.vertical-product-card__price .fw-bold {
    color: #111 !important;
}

.vertical-product-card__title a,
.vertical-product-card__price .product-pricing {
    display: inline;
}

.vertical-product-card__price {
    white-space: nowrap;
}

/* Vertically center the new price and the struck-through old price so the old
   price sits in line with the new one instead of dropping lower.
   `!important` overrides Bootstrap's `.d-inline-block` on the wrapper. */
.vertical-product-card__price .product-pricing {
    display: inline-flex !important;
    align-items: center;
    line-height: 1;
}

/* Discount badge + (desktop) period, top-left of the card media. */
.vertical-product-card__offer {
    z-index: 3;
    display: inline-flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 5px;
}

.vertical-product-card__discount-badge {
    font-size: 11px;
    font-weight: 700;
    line-height: 1;
    color: #fff;
    background: #1a1a1a;
    padding: 5px 8px;
    border-radius: 999px;
    letter-spacing: 0.02em;
}

/* Base = under-price period (a small line, shown on mobile). */
.vertical-product-card__discount-period {
    display: block;
    margin-top: 4px;
    font-size: 11px;
    font-weight: 500;
    line-height: 1;
    color: #8a8a8a;
    letter-spacing: 0.01em;
    text-align: center;
}

/* On-image period pill under the badge (shown on desktop). */
.vertical-product-card__discount-period--onimage {
    margin-top: 0;
    font-size: 10px;
    font-weight: 600;
    color: #3a3a3a;
    background: rgba(255, 255, 255, 0.92);
    padding: 4px 7px;
    border-radius: 999px;
    text-align: left;
    white-space: nowrap;
}

/* Desktop: period on the image (under the %); hide the under-price copy. */
@media (min-width: 576px) {
    .vertical-product-card__discount-period--underprice {
        display: none;
    }
}

/* Mobile: period under the price; hide the on-image copy. */
@media (max-width: 575.98px) {
    .vertical-product-card__discount-period--onimage {
        display: none;
    }
}

.vertical-product-card__price::before {
    content: "-";
    display: inline-block;
    margin-right: 8px;
}

.vertical-product-card .card-body {
    font-family: "Inter", "Segoe UI", sans-serif;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    max-height: 140px;
    overflow: hidden;
}

.js-product-preview-card.is-preview-active .card-body {
    opacity: 0;
    visibility: hidden;
}

.vertical-product-card__price .product-pricing {
    font-size: 0.98rem;
    color: inherit;
}

.vertical-product-card__price .text-danger1,
.vertical-product-card__price .text-muted1,
.vertical-product-card__price .text-secondary {
    color: inherit !important;
}

.vertical-product-card__price .fw-bold {
    font-weight: 400 !important;
    font-family: "Inter", "Segoe UI", sans-serif;
}

.range-wine-card__media {
    height: 550.48px;
    background: #f3f4f1 !important;
    position: relative;
}

.range-wine-slider {
    position: relative;
}

.range-wine-slider__viewport {
    overflow-x: auto;
    overflow-y: hidden;
    scroll-behavior: smooth;
    scrollbar-width: none;
    -ms-overflow-style: none;
    padding: 24px 0 12px;
}

.range-wine-slider__viewport::-webkit-scrollbar {
    display: none;
}

.range-wine-slider__track {
    display: flex;
    align-items: stretch;
    gap: 24px;
}

.range-wine-slider__item {
    flex: 0 0 min(22vw, 320px);
    min-width: 220px;
}

.range-wine-slider__nav {
    position: absolute;
    top: 46%;
    transform: translateY(-50%);
    width: 56px;
    height: 56px;
    border-radius: 999px;
    border: 1px solid rgba(0, 0, 0, 0.12);
    background: rgba(255, 255, 255, 0.92);
    color: #262626;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 26px;
    font-weight: 300;
    line-height: 1;
    z-index: 4;
    transition:
        opacity 0.22s ease,
        background-color 0.22s ease,
        color 0.22s ease;
}

.range-wine-slider__nav:disabled {
    opacity: 0;
    pointer-events: none;
}

.range-wine-slider__nav:hover,
.range-wine-slider__nav:focus {
    background: #fff;
    color: #111;
}

.range-wine-slider__nav--prev {
    left: 8px;
}

.range-wine-slider__nav--next {
    right: 8px;
}
/* The wrapper anchor link stays completely still to act as a stable hover hit-box */
.col-6 .text-decoration-none.d-block {
    position: relative;
    display: block;
    height: 100%;
}

.range-wine-card {
    transition: transform 0.35s cubic-bezier(0.25, 1, 0.5, 1);
    position: relative;
    backface-visibility: hidden;
}

/* FIX: The pseudo-element is now attached to the static link wrapper, 
   ensuring it never moves away from the cursor */
.col-6 .text-decoration-none.d-block::before {
    content: "";
    position: absolute;
    inset: 0;
    bottom: -25px;
    pointer-events: auto;
    z-index: 10; /* Keeps the hit-box active */
}

.range-wine-card__media {
    position: relative;
    isolation: isolate;
    overflow: hidden;
}

.range-wine-card__media img,
.range-wine-card__default-image,
.range-wine-card__product-image,
.range-wine-card__video {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.range-wine-card__default-image,
.range-wine-card__product-image {
    transition:
        opacity 0.35s cubic-bezier(0.25, 1, 0.5, 1),
        transform 0.35s cubic-bezier(0.25, 1, 0.5, 1);
    display: block;
    opacity: 1;
    z-index: 1;
}

.range-wine-card__product-image {
    opacity: 0;
    z-index: 3;
    object-fit: contain !important;
    object-position: center;
    padding: 28px;
}

.range-wine-card__video {
    opacity: 1;
    z-index: 2;
    transition:
        opacity 0.35s cubic-bezier(0.25, 1, 0.5, 1),
        transform 0.35s cubic-bezier(0.25, 1, 0.5, 1);
    transform: scale(1);
    pointer-events: none; /* Crucial: stops video elements from stealing pointer focus */
}

.range-wine-card--has-video .range-wine-card__default-image {
    opacity: 1;
}

/* Spumante card: the glass-tower clip was cropped at the top (the top glass got
   cut). Anchor the media to the top so the first glass is fully visible. */
.range-wine-card--spumante .range-wine-card__video,
.range-wine-card--spumante .range-wine-card__default-image {
    object-position: center top;
}

.range-wine-card--has-product-image:hover .range-wine-card__product-image,
.range-wine-card--has-product-image:focus-within
    .range-wine-card__product-image {
    opacity: 1;
    transform: scale(1);
}

.range-wine-card--has-product-image:hover .range-wine-card__video,
.range-wine-card--has-product-image:focus-within .range-wine-card__video,
.range-wine-card--has-product-image:hover .range-wine-card__default-image,
.range-wine-card--has-product-image:focus-within
    .range-wine-card__default-image {
    opacity: 0;
}

/* FIX: Hover state is now triggered by hovering the PARENT link, 
   but the animation is applied to the child card. This kills the loop! */
.col-6 .text-decoration-none.d-block:hover .range-wine-card,
.col-6 .text-decoration-none.d-block:focus-within .range-wine-card {
    transform: translateY(-20px);
}

/* Scale effects triggered via parent hover */
.col-6 .text-decoration-none.d-block:hover .range-wine-card__media img,
.col-6 .text-decoration-none.d-block:focus-within .range-wine-card__media img,
.col-6 .text-decoration-none.d-block:hover .range-wine-card__video,
.col-6 .text-decoration-none.d-block:focus-within .range-wine-card__video {
    transform: scale(1.05);
}

/* Video fade triggered via parent hover */
.col-6
    .text-decoration-none.d-block:hover
    .range-wine-card--has-video
    .range-wine-card__video,
.col-6
    .text-decoration-none.d-block:focus-within
    .range-wine-card--has-video
    .range-wine-card__video {
    opacity: 0;
}

.col-6
    .text-decoration-none.d-block:hover
    .range-wine-card--has-product-image
    .range-wine-card__product-image,
.col-6
    .text-decoration-none.d-block:focus-within
    .range-wine-card--has-product-image
    .range-wine-card__product-image {
    opacity: 1;
}

.col-6
    .text-decoration-none.d-block:hover
    .range-wine-card--has-product-image
    .range-wine-card__default-image,
.col-6
    .text-decoration-none.d-block:focus-within
    .range-wine-card--has-product-image
    .range-wine-card__default-image {
    opacity: 0;
}

.range-wine-card__meta {
    padding: 16px 4px 0;
    text-align: center;
    overflow: hidden;
}

.range-wine-card__title {
    display: inline-block;
    margin: 0;
    color: #111;
    font-family: "Inter", "Segoe UI", sans-serif;
    font-size: clamp(0.92rem, 0.8vw, 1rem);
    letter-spacing: 0.06em;
    line-height: 1.2;
    font-weight: 500;
    transition: letter-spacing 0.28s ease;
}

.col-6 .text-decoration-none.d-block:hover .range-wine-card__title,
.col-6 .text-decoration-none.d-block:focus-within .range-wine-card__title {
    letter-spacing: 0.08em;
}

.home-story-section__frame {
    min-height: 1000px;
}

.home-story-section__image {
    min-height: 1000px;
    max-height: 1000px;
}

/* On mobile the story banner fills the screen like the hero (the fixed 1000px
   above is a desktop measure and would overflow a phone viewport). */
@media (max-width: 767.98px) {
    .home-story-section__frame,
    .home-story-section__image {
        min-height: 100vh;
        max-height: 100vh;
    }
}

.home-story-section__brand-mark {
    width: fit-content;
}

.home-story-section__bird {
    font-size: clamp(3rem, 4vw, 4.25rem);
    line-height: 1;
}

.home-story-section__meta {
    font-size: 0.56rem;
    letter-spacing: 0.2em;
    line-height: 1.5;
}

.home-story-section__title {
    font-family: Georgia, "Times New Roman", serif;
    font-size: clamp(2.25rem, 4.8vw, 4rem);
    line-height: 0.95;
    font-weight: 400;
    letter-spacing: -0.03em;
}

.home-story-section__subtitle {
    font-size: 0.58rem;
    letter-spacing: 0.22em;
    opacity: 0.95;
}

.home-story-section__subtitle--wine-story {
    max-width: 460px;
    line-height: 1.55;
}

.home-story-section__button {
    color: #fff;
    width: 394px;
    border: 1px solid rgba(255, 255, 255, 0.65);
    background: rgba(255, 255, 255, 0.08);
    font-size: 0.68rem;
    letter-spacing: 0.1em;
    padding-top: 0.65rem;
    padding-bottom: 0.65rem;
}

.home-story-section__button:hover {
    color: #111;
    background: rgba(255, 255, 255, 0.92);
    border-color: rgba(255, 255, 255, 0.92);
}

/* Mobile & tablet: larger brand mark and the two CTAs stacked one per row. */
@media (max-width: 991.98px) {
    .home-story-section__brand-mark {
        max-width: 420px;
        width: min(420px, calc(100vw - 48px));
        height: auto;
    }

    .home-story-section__actions {
        flex-direction: column;
        flex-wrap: nowrap;
        width: 100%;
    }

    .home-story-section__actions .home-story-section__button {
        width: min(360px, calc(100vw - 48px));
    }
}

@media (max-width: 991.98px) {
    .vertical-product-card__media {
        max-width: 100%;
        height: auto;
        max-height: none;
        min-height: 0;
        aspect-ratio: 512 / 681;
    }

    .vertical-product-card__asset-view {
        height: 100%;
        max-height: 100%;
    }

    .vertical-product-card__image {
        width: 100%;
        height: 100%;
        max-width: 100%;
        max-height: 100%;
    }

    .vertical-product-card__video {
        object-fit: cover;
    }

    .range-wine-card__media {
        height: 220px;
    }

    .range-wine-slider__track {
        gap: 14px;
    }

    .range-wine-slider__item {
        flex: 0 0 min(64vw, 300px);
        min-width: min(64vw, 300px);
    }

    .range-wine-slider__nav {
        width: 46px;
        height: 46px;
        font-size: 22px;
    }

    .range-wine-card__meta {
        padding-top: 12px;
    }

    .range-wine-card__title {
        font-size: clamp(0.82rem, 2.6vw, 0.92rem);
        letter-spacing: 0.05em;
    }

    .range-wine-card:hover .range-wine-card__title,
    .range-wine-card:focus-within .range-wine-card__title {
        letter-spacing: 0.06em;
    }

    /* Tablets only — phones get the full-screen (90vh) treatment further up. */
    @media (min-width: 768px) {
        .home-story-section__frame,
        .home-story-section__image {
            min-height: 380px;
            max-height: 380px;
        }
    }
}

body.home-page .site-header {
    background: transparent;
}

body.home-page .site-header-link,
body.home-page .site-header-brand,
body.home-page .site-header .dropdown-toggle,
body.home-page .site-header .fa-magnifying-glass,
body.home-page .site-header .site-header-cart-toggle {
    color: #fff;
}

body.home-page .site-header .site-header-mobile .site-header-search-link,
body.home-page .site-header .site-header-mobile .site-header-mobile__toggle,
body.home-page .site-header .site-header-mobile .site-header-mobile__icon,
body.home-page .site-header .site-header-mobile .site-header-cart-toggle {
    color: #000 !important;
}

body.home-page
    .site-header
    .site-header-mobile
    .site-header-search-link
    .fa-magnifying-glass {
    color: #000 !important;
}

@media (max-width: 767.98px) {
    .home-story-section__brand-mark {
        max-width: 320px;
        width: min(320px, calc(100vw - 40px));
        height: auto;
    }

    .home-story-section__actions .home-story-section__button {
        width: min(320px, calc(100vw - 40px));
    }

    .site-header-search-panel {
        padding: 0;
    }

    .site-header-search-shell {
        min-height: 100vh;
        padding: 0;
    }

    .site-header-search-toolbar {
        margin: 10px 10px 0;
    }

    .site-header-search-nav--prev {
        left: 4px;
    }

    .site-header-search-nav--next {
        right: 4px;
    }

    .site-header-search-arrow {
        width: 34px;
        height: 34px;
    }

    .site-header-search-product-item {
        flex-basis: calc((100% - 0.8rem) / 2);
        min-width: calc((100% - 0.8rem) / 2);
    }
}

@media (max-width: 575.98px) {
    .site-header-search-product-item {
        flex-basis: calc((100% - 0.8rem) / 2);
        min-width: calc((100% - 0.8rem) / 2);
    }

    .site-header-search-shell {
        min-height: 100vh;
    }
}

body.home-page .site-header-brand-logo {
    filter: brightness(0) invert(1);
}

body.home-page .site-header-badge {
    background: rgba(255, 255, 255, 0.14);
    color: #fff;
    border-color: rgba(255, 255, 255, 0.28) !important;
}

body.home-page.is-scrolled .site-header-link,
body.home-page.is-scrolled .site-header-brand,
body.home-page.is-scrolled .site-header .dropdown-toggle,
body.home-page.is-scrolled .site-header .fa-magnifying-glass,
body.home-page.is-scrolled .site-header .site-header-cart-toggle {
    color: #1e1e1e;
}

body.home-page.is-scrolled
    .site-header
    .site-header-mobile
    .site-header-mobile__cart
    .site-header-cart-toggle {
    color: #000 !important;
}

body.home-page.is-scrolled .site-header-brand-logo {
    filter: brightness(0) saturate(100%);
}

body.home-page.is-scrolled .site-header-badge {
    background: rgba(0, 0, 0, 0.06);
    color: #1e1e1e;
    border-color: rgba(0, 0, 0, 0.08) !important;
}

/* The story page has a light background at the very top (no dark hero video
   like the homepage), so the header needs dark text from the start instead
   of only after .is-scrolled kicks in. */
body.story-page .site-header-link,
body.story-page .site-header-brand,
body.story-page .site-header .dropdown-toggle,
body.story-page .site-header .fa-magnifying-glass,
body.story-page .site-header .site-header-cart-toggle {
    color: #1e1e1e;
}

body.story-page
    .site-header
    .site-header-mobile
    .site-header-mobile__cart
    .site-header-cart-toggle {
    color: #000 !important;
}

body.story-page .site-header-brand-logo {
    filter: brightness(0) saturate(100%);
}

body.story-page .site-header-badge {
    background: rgba(0, 0, 0, 0.06);
    color: #1e1e1e;
    border-color: rgba(0, 0, 0, 0.08) !important;
}

.home-hero-video {
    position: relative;
    min-height: calc(100vh - 80px);
    overflow: hidden;
    background: #111;
}

.home-hero-video__media,
.home-hero-video__poster,
.home-hero-video__overlay,
.home-hero-video__player {
    position: absolute;
    inset: 0;
}

.home-hero-video__player,
.home-hero-video__poster,
.home-hero-video__noscript {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.home-hero-video__player {
    opacity: 1;
    object-position: center 40%;
}

.home-hero-video__poster {
    background-position: center 40%;
    background-repeat: no-repeat;
    background-size: cover;
    transform: scale(1.02);
}

.home-hero-video__media.is-video-ready .home-hero-video__player {
    opacity: 1;
}

.home-hero-video__media.is-video-ready .home-hero-video__poster {
    opacity: 0;
}

.home-hero-video__overlay {
    background:
        linear-gradient(
            180deg,
            rgba(5, 8, 10, 0.36) 0%,
            rgba(5, 8, 10, 0.18) 35%,
            rgba(5, 8, 10, 0.42) 100%
        ),
        radial-gradient(
            circle at center,
            rgba(255, 255, 255, 0.04) 0%,
            rgba(255, 255, 255, 0) 58%
        );
    pointer-events: none;
}

.home-hero-video__noscript {
    display: block;
}

.home-hero-video__content {
    position: absolute;
    z-index: 4;
    left: clamp(18px, 8vw, 116px);
    right: clamp(18px, 8vw, 116px);
    bottom: clamp(32px, 10vh, 112px);
    display: flex;
    justify-content: center;
    pointer-events: none;
}

.home-hero-video__actions {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: center;
    gap: 12px;
    pointer-events: auto;
}

.home-hero-video__btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 48px;
    padding: 0 24px;
    background: rgba(0, 0, 0, 0.82);
    color: #fff;
    border: 1px solid rgba(255, 255, 255, 0.2);
    border-radius: 0;
    font-size: 12px;
    font-weight: 600;
    letter-spacing: 0.08em;
    line-height: 1.2;
    text-align: center;
    text-transform: uppercase;
    transition:
        background 0.2s ease,
        color 0.2s ease,
        border-color 0.2s ease;
}

.home-hero-video__btn:hover,
.home-hero-video__btn:focus {
    background: #fff;
    color: #000;
    border-color: #fff;
}

.home-hero-video__btn--light {
    background: #fff;
    color: #000;
    border-color: #fff;
}

.home-hero-video__btn--light:hover,
.home-hero-video__btn--light:focus {
    background: rgba(0, 0, 0, 0.82);
    color: #fff;
    border-color: rgba(255, 255, 255, 0.28);
}

body.wine-quiz-is-open {
    overflow: hidden;
}

.wine-quiz-modal {
    position: fixed;
    inset: 0;
    z-index: 1080;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 18px;
    opacity: 0;
    visibility: hidden;
    transition:
        opacity 0.2s ease,
        visibility 0.2s ease;
}

.wine-quiz-modal.is-open {
    opacity: 1;
    visibility: visible;
}

.wine-quiz-modal__backdrop {
    position: absolute;
    inset: 0;
    background: rgba(8, 8, 8, 0.72);
    backdrop-filter: blur(8px);
}

.wine-quiz-modal__dialog {
    position: relative;
    z-index: 1;
    width: min(100%, 980px);
    max-height: min(92vh, 820px);
    overflow: auto;
    background: #fff;
    color: #111;
    box-shadow: 0 24px 70px rgba(0, 0, 0, 0.32);
}

.wine-quiz-modal__content {
    padding: clamp(24px, 4vw, 52px);
}

.wine-quiz-modal__close {
    position: absolute;
    top: 14px;
    right: 16px;
    z-index: 2;
    width: 36px;
    height: 36px;
    border: 0;
    background: transparent;
    color: #111;
    font-size: 32px;
    line-height: 1;
}

.wine-quiz-modal__eyebrow {
    color: #6b6b6b;
    font-size: 12px;
    font-weight: 700;
    letter-spacing: 0.12em;
    text-transform: uppercase;
}

.wine-quiz-modal__title,
.wine-quiz-results__title {
    font-size: clamp(28px, 4vw, 48px);
    line-height: 1.05;
    text-transform: uppercase;
}

.wine-quiz__progress {
    margin: 28px 0 16px;
    color: #6b6b6b;
    font-size: 13px;
    font-weight: 700;
}

.wine-quiz__step {
    display: none;
}

.wine-quiz__step.is-active {
    display: block;
}

.wine-quiz__question {
    margin-bottom: 22px;
    font-size: clamp(22px, 3vw, 34px);
    line-height: 1.15;
}

.wine-quiz__options {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(170px, 1fr));
    gap: 12px;
}

.wine-quiz__option {
    min-height: 58px;
    padding: 12px 18px;
    background: #f5f5f5;
    color: #111;
    border: 1px solid rgba(0, 0, 0, 0.08);
    font-size: 14px;
    font-weight: 700;
    text-transform: uppercase;
    transition:
        background 0.2s ease,
        color 0.2s ease,
        border-color 0.2s ease;
}

.wine-quiz__option:hover,
.wine-quiz__option:focus,
.wine-quiz__option.is-selected {
    background: #111;
    color: #fff;
    border-color: #111;
}

.wine-quiz__footer {
    display: flex;
    justify-content: space-between;
    gap: 12px;
    margin-top: 30px;
}

.wine-quiz__nav,
.wine-quiz-results__restart,
.wine-quiz-result-card__button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 46px;
    padding: 0 20px;
    background: transparent;
    color: #111;
    border: 1px solid #111;
    font-size: 12px;
    font-weight: 700;
    letter-spacing: 0.08em;
    text-decoration: none;
    text-transform: uppercase;
    transition:
        background 0.2s ease,
        color 0.2s ease,
        opacity 0.2s ease;
}

.wine-quiz__nav--primary,
.wine-quiz-result-card__button {
    background: #111;
    color: #fff;
}

.wine-quiz__nav:disabled {
    opacity: 0.45;
    cursor: not-allowed;
}

.wine-quiz-results__grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(170px, 1fr));
    gap: 18px;
    margin: 28px 0;
}

.wine-quiz-result-card {
    display: flex;
    flex-direction: column;
    background: #f5f5f5;
}

.wine-quiz-result-card__image-link {
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 220px;
    padding: 24px;
}

.wine-quiz-result-card__image {
    max-width: 100%;
    max-height: 190px;
    object-fit: contain;
}

.wine-quiz-result-card__body {
    display: flex;
    flex: 1;
    flex-direction: column;
    gap: 12px;
    padding: 0 18px 18px;
}

.wine-quiz-result-card__range {
    font-size: 10px;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: #9a8f7e;
    margin-bottom: 2px;
}
.wine-quiz-result-card__name {
    margin: 0;
    font-size: 16px;
    line-height: 1.25;
}

.wine-quiz-result-card__price {
    margin-top: auto;
    font-size: 14px;
}

body.home-page .home-hero-video {
    min-height: 100vh;
}

body.home-page:has(.auth-login-form) .home-hero-video {
    min-height: 100vh;
}

@media (max-width: 575.98px) {
    body.home-page .home-hero-video {
        min-height: 100vh;
    }

    body.home-page:has(.auth-login-form) .home-hero-video {
        min-height: 100vh;
    }

    .home-hero-video__content {
        bottom: 24px;
    }

    .home-hero-video__actions,
    .home-hero-video__btn {
        width: 100%;
    }

    .wine-quiz__footer {
        flex-direction: column-reverse;
    }

    .wine-quiz__nav,
    .wine-quiz-results__restart {
        width: 100%;
    }
}

.home-hero-video--users {
    min-height: 170px;
}

body.home-page .home-hero-video.home-hero-video--users {
    min-height: 250px;
}

.home-hero-video__users-content {
    position: absolute;
    z-index: 4;
    left: clamp(16px, 8vw, 116px);
    right: clamp(16px, 3vw, 32px);
    bottom: 18px;
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 12px;
    pointer-events: none;
}

.home-hero-video__users-welcome {
    color: #fff;
    font-size: 17px;
    line-height: 1.05;
    letter-spacing: 0;
    font-weight: 400;
}

.home-hero-video__users-btn {
    pointer-events: auto;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 44px;
    padding: 0 18px;
    background: rgba(0, 0, 0, 0.82);
    color: #fff;
    border: 1px solid rgba(255, 255, 255, 0.12);
    font-size: 11px;
    font-weight: 500;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    white-space: nowrap;
    transition:
        background 0.2s ease,
        color 0.2s ease,
        border-color 0.2s ease;
}

.home-hero-video__users-btn:hover,
.home-hero-video__users-btn:focus {
    background: #fff;
    color: #000;
    border-color: #fff;
}

.auth-login-breadcrumb {
    position: absolute;
    top: 150px;
    left: 180px;
    z-index: 4;
    display: inline-flex;
    align-items: center;
    gap: 6px;
    font-size: 9px;
    font-weight: 500;
    color: #fff;
    line-height: 1;
}

.auth-login-breadcrumb a,
.auth-login-breadcrumb span {
    color: #fff;
    text-decoration: none;
}

.home-login-overlay {
    position: absolute;
    inset: 0;
    z-index: 3;
    display: flex;
    align-items: flex-start;
    justify-content: center;
    /* Top padding clears the absolute header/logo AND the breadcrumb (taller on
       tablet) so the (tall B2B) form never overlaps them; the card scrolls
       internally via its own max-height. */
    padding: clamp(165px, 15vh, 210px) 16px 40px;
    overflow-y: auto;
}

.home-login-card {
    width: min(100%, 640px);
}

.home-login-card {
    max-width: 620px;
}

.home-login-card .auth-login-panel {
    border-radius: 0;
    background: #f7f7f7;
    max-height: 75vh;
    overflow-y: auto;
}

.home-login-card .auth-login-body {
    padding: 28px;
}

.home-login-card .auth-login-title {
    margin: 0 0 14px;
    font-size: 14px;
    font-weight: 600;
    color: #111;
}

.home-login-card .auth-login-label {
    font-size: 10px;
    line-height: 1.2;
    font-weight: 600;
    color: #222;
    margin-bottom: 6px;
}

.home-login-card .auth-login-input {
    height: 40px;
    border: 1px solid #d8d8d8;
    border-radius: 0;
    background: #f7f7f7;
    box-shadow: none;
    font-size: 13px;
}

.home-login-card .auth-login-input:focus {
    border-color: #bdbdbd;
    box-shadow: none;
}

.home-login-card .auth-login-btn {
    height: 40px;
    border: 0;
    border-radius: 0;
    background: #0b0b0f;
    color: #fff;
    font-size: 9px;
    line-height: 1;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    font-weight: 600;
}

.home-login-card .auth-login-btn:hover,
.home-login-card .auth-login-btn:focus {
    background: #000;
    color: #fff;
}

.home-login-card .auth-login-help-link {
    font-size: 10px;
    color: #1e1e1e;
    text-decoration: underline;
}

.home-login-card .auth-login-help-link:hover,
.home-login-card .auth-login-help-link:focus {
    color: #000;
}

.home-login-card .auth-register-note {
    font-size: 8px;
    line-height: 1.45;
    color: #6b6b6b;
}

.about-family-section .row {
    min-height: 100vh;
}

.about-family-section__media,
.about-family-section__image {
    width: 100%;
    height: 100%;
}

.about-family-section__image {
    display: block;
    object-fit: cover;
}

.about-family-section__content-wrap {
    height: 100%;
    display: flex;
    align-items: flex-start;
    justify-content: flex-start;
    padding: 56px 58px 52px 32px;
}

.about-family-section__content {
    max-width: 650px;
}

.about-family-section__eyebrow {
    display: inline-block;
    margin-bottom: 8px;
    font-size: 9px;
    color: #6f6f6f;
}

.about-family-section__title {
    margin: 0 0 52px;
    font-size: 40px;
    font-weight: 500;
    color: #111;
}

.about-family-section__content p {
    margin: 0 0 22px;
    font-size: 13px;
    line-height: 1.9;
    font-style: italic;
    color: #171717;
}

.about-family-section__content p:last-child {
    margin-bottom: 0;
}

.about-family-section--reverse .about-family-section__content-wrap {
    padding: 42px 48px 46px 28px;
}

.about-family-section--reverse .about-family-section__title {
    margin-bottom: 58px;
    font-size: 36px;
}

@media (max-width: 767.98px) {
    .about-family-section--reverse .about-family-section__content-wrap {
        padding: 34px 18px 38px;
    }

    .about-family-section--reverse .about-family-section__title {
        margin-bottom: 26px;
        font-size: 32px;
    }

    .about-family-section .row {
        min-height: 0;
    }

    .about-family-section__media {
        min-height: 260px;
        max-height: 260px;
    }

    .about-family-section__content-wrap {
        padding: 36px 18px 40px;
    }

    .about-family-section__title {
        margin-bottom: 28px;
        font-size: 32px;
    }

    .about-family-section__content p {
        font-size: 12px;
        line-height: 1.8;
    }

    .auth-login-breadcrumb {
        top: 86px;
        left: 16px;
    }

    .home-login-card .auth-login-body {
        padding: 24px 20px;
    }
}

/* Hero video plays for all users (including reduce-motion). The poster still
   shows as a fallback only until the video is ready / if autoplay is blocked. */

@media (max-width: 767.98px) {
    body {
        /* fixed header (72px) + the announcement bar above it */
        padding-top: calc(72px + var(--announce-height));
    }

    body.home-page {
        /* header is absolute over the hero here, so only the bar takes space */
        padding-top: var(--announce-height);
    }

    .site-header {
        position: fixed;
        /* Start below the fixed announcement bar instead of over it. */
        top: var(--announce-height);
        left: 0;
        right: 0;
        z-index: 1100;
        min-height: 72px;
    }

    .site-header {
        border-bottom: 1px solid rgba(16, 24, 40, 0.06);
        backdrop-filter: blur(14px);
        background: rgba(255, 252, 246, 0.92);
    }

    .site-header .cart-counter {
        top: -4px;
        right: -4px;
    }

    .site-header-mobile {
        position: relative;
        z-index: 2;
    }

    .site-header-offcanvas {
        position: fixed;
        top: 0;
        left: 0;
        height: 100dvh;
        z-index: 1110 !important;
    }

    .offcanvas-backdrop,
    .offcanvas-backdrop.show {
        z-index: 1105 !important;
    }

    .home-hero-video {
        min-height: calc(100vh - 72px);
    }

    .home-hero-video--users {
        min-height: 150px;
    }

    body.home-page .home-hero-video.home-hero-video--users {
        min-height: 150px;
    }

    .home-hero-video__users-content {
        left: 14px;
        right: 14px;
        bottom: 12px;
    }

    .home-hero-video__users-welcome {
        font-size: 14px;
    }

    .home-hero-video__users-btn {
        min-height: 38px;
        padding: 0 12px;
        font-size: 9.5px;
    }
}

@media (min-width: 1199px) and (max-width: 1399.98px) {
    .d-none-1399 {
        display: none !important;
    }
}

.checkout-sidebar {
    position: sticky;
    top: 100px;
}

.grecaptcha-badge {
    z-index: 99999;
    bottom: 140px !important;
}
.scroll-top-btn.active {
    bottom: 80px;
}
.object-fit-cover {
    object-fit: cover;
}

[data-bs-theme="light"]
    .clr-scheme
    .topbar-info-right
    li
    a:not(.dropdown-menu a) {
    color: #fff !important;
}
.topbar-info-right {
    gap: 30px;
}
.topbar-info-right li::before {
    left: -16px !important;
}

.pagination li .page-link {
    min-width: auto;
    height: auto;
    padding: 4px 12px !important;
}

/* "Toate produsele" catalog pagination — match the platform's black/white,
   square, Inter look instead of the default Bootstrap green/blue. */
.all-products-pagination .pagination {
    gap: 8px;
    margin-bottom: 0;
}

.all-products-pagination .page-item {
    margin: 0;
}

/* Every cell is the exact same fixed square, with glyphs/digits optically centered. */
.all-products-pagination .page-item .page-link {
    width: 44px;
    height: 44px;
    min-width: 44px;
    margin: 0;
    padding: 0 !important;
    display: flex;
    align-items: center;
    justify-content: center;
    border: 1px solid #111;
    border-radius: 0;
    color: #111;
    background-color: #fff;
    font-family: 'Inter', 'Segoe UI', sans-serif;
    font-size: 1rem;
    font-weight: 500;
    line-height: 1;
    box-shadow: none;
    transition: all 0.25s ease;
}

/* Chevron glyphs (‹ ›) render small/high — enlarge and nudge so they sit centered. */
.all-products-pagination .page-item:first-child .page-link,
.all-products-pagination .page-item:last-child .page-link {
    font-size: 1.4rem;
    line-height: 0;
}

/* The theme sets a green .page-link:hover with !important, so these must use
   !important too to override it with the platform's black. */
.all-products-pagination .page-item .page-link:hover {
    background-color: #111 !important;
    border-color: #111 !important;
    color: #fff !important;
}

.all-products-pagination .page-item .page-link:focus {
    box-shadow: none !important;
    background-color: #111 !important;
    border-color: #111 !important;
    color: #fff !important;
}

.all-products-pagination .page-item.active .page-link {
    background-color: #111 !important;
    border-color: #111 !important;
    color: #fff !important;
}

.all-products-pagination .page-item.disabled .page-link {
    color: #cfcfcf;
    border-color: #e3e3e3;
    background-color: #fff;
}
.tt-custom-pagination {
    flex-wrap: nowrap;
    overflow-x: auto;
}

.related-product-slider .rl-slider-btn {
    width: 40px;
    height: 40px;
    padding: 0;
    background-color: #000;
    color: #fff;
    border: 1px solid #000;
    border-radius: 0px !important;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    font-size: 16px;
    transition: all 0.3s ease;
}

.related-product-slider .rl-slider-btn:hover {
    background-color: #333;
    border-color: #333;
}

/* Swiper adds this when the slider can't move further in that direction. */
.related-product-slider .rl-slider-btn.rl-slider-btn--disabled {
    opacity: 0.35;
    pointer-events: none;
    cursor: default;
}

.best-seller-section .bs-slider-btn {
    position: absolute;
    top: 40%;
    transform: translateY(-50%);
    width: 40px;
    height: 40px;
    padding: 0;
    border: 1px solid #111;
    border-radius: 50%;
    background-color: #111;
    color: #fff;
    font-size: 14px;
    line-height: 1;
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    transition: all 0.3s ease;
    z-index: 10;
}

.best-seller-section .bs-slider-btn-prev {
    left: 2px;
}

.best-seller-section .bs-slider-btn-next {
    right: 2px;
}

.best-seller-section .bs-slider-btn:hover {
    background-color: #333;
    border-color: #333;
}

.best-seller-section .bs-slider-btn.swiper-button-disabled {
    opacity: 0.3;
    cursor: not-allowed;
}

.best-seller-slider-wrapper {
    overflow: hidden;
    position: relative;
    padding-left: 80px;
    padding-right: 80px;
}

.best-seller-products-slider.swiper {
    overflow: hidden;
    position: relative;
}

.best-seller-products-slider .swiper-slide {
    overflow: hidden;
    box-sizing: border-box;
}

@media (max-width: 991.98px) {
    /* Keep the swipe arrows visible on mobile so users know they can move to the
       next product. They overlay the card edges (semi-transparent). */
    .best-seller-section .bs-slider-btn {
        display: inline-flex;
        width: 38px;
        height: 38px;
        background-color: rgba(17, 17, 17, 0.72);
        border-color: rgba(17, 17, 17, 0.72);
        top: 45%;
    }

    .best-seller-section .bs-slider-btn-prev {
        left: 8px;
    }

    .best-seller-section .bs-slider-btn-next {
        right: 8px;
    }

    .best-seller-slider-wrapper {
        padding-left: 0;
        padding-right: 0;
    }
}

.vinaria-product-showcase {
    border: 0;
    border-radius: 0;
    padding: 0;
}

.vinaria-gallery-column {
    position: relative;
}

.vinaria-product-breadcrumb-wrap {
    position: absolute;
    top: 100px;
    left: 16px;
    z-index: 2;
    display: inline-flex;
    align-items: center;
    padding: 8px 10px;
}

.vinaria-product-breadcrumb {
    margin: 0;
}

.vinaria-product-breadcrumb .wine-breadcrumb__item {
    font-size: 10px;
    line-height: 1.2;
    font-weight: 500;
    color: #8a8a8a;
    white-space: nowrap;
}

.vinaria-product-breadcrumb .wine-breadcrumb__item a {
    color: inherit;
}

.vinaria-product-breadcrumb .wine-breadcrumb__item[aria-current="page"] {
    color: #6f6f6f;
}

/* ============================================================
   PINNED HERO SECTION
   .vinaria-hero-pin is made (count × 100vh) tall by JS to create scroll
   runway; its .__sticky child pins BOTH columns for that whole distance.
   Native document scroll drives which gallery slide is active — no wheel
   hijacking, no inner scroller. Past the runway the sticky un-sticks and the
   page continues normally. Only active ≥1200px; static in the quickview modal.
   ============================================================ */
.vinaria-hero-pin {
    position: relative;
}

/* The global .main-wrapper uses overflow-x:hidden, which computes to "hidden auto"
   — a scroll container that breaks position:sticky for the pin. On pages with a
   pinned hero, swap it to overflow:clip: clipping still prevents horizontal scroll
   but does NOT create a scroll container, so sticky pins against the viewport. */
.main-wrapper:has(.vinaria-hero-pin) {
    overflow-x: clip !important;
    overflow-y: visible !important;
}

/* Snap the DOCUMENT gently to each media band while inside the pinned hero.
   "proximity" only settles when near a snap point, so it never traps scroll
   through the rest of the page. Markers are injected by JS, one per band. */
html:has(.vinaria-hero-pin) {
    scroll-snap-type: y proximity;
}

.vinaria-hero-pin__snap {
    position: absolute;
    left: 0;
    width: 1px;
    height: 100svh;
    scroll-snap-align: start;
    pointer-events: none;
}

/* --- Desktop: pin the WHOLE two-column hero (gallery + info side by side). --- */
@media (min-width: 1200px) {
    .vinaria-hero-pin__sticky {
        position: sticky;
        top: 0;
        height: 100svh;
        overflow: hidden;
    }

    .vinaria-hero-pin__sticky .vinaria-product-layout,
    .vinaria-hero-pin__sticky .vinaria-info-column,
    .vinaria-hero-pin__sticky .vinaria-gallery-stage {
        height: 100svh;
    }

    .vinaria-hero-pin__sticky .vinaria-info-column {
        display: flex;
        flex-direction: column;
        justify-content: center;
        overflow: hidden;
    }
}

/* --- Mobile/tablet: same pinned full-screen media scroll-snap, but pin only the
   GALLERY column (info panel flows below once the media runway is scrolled past).
   Columns already stack (col-xl-6), so the gallery is on top and info follows. --- */
/* --- Mobile/tablet: same pinned full-screen media scroll-snap as desktop, but
   pin only the GALLERY column (info flows below once the runway is scrolled past).
   The gallery is the ONLY sticky element; the wrapper + row become full-runway-tall
   passthroughs so the gallery pins across the entire runway and unsticks at its
   parent's (the row's) bottom — exactly where the info column begins. --- */
@media (max-width: 1199.98px) {
    .vinaria-hero-pin__sticky {
        position: static;
        top: auto;
        height: 100%;
        overflow: visible;
    }

    .vinaria-product-layout {
        display: block;
        height: 100%;
        min-height: 0;
    }

    /* The gallery column's FLOW slot spans the whole runway (height:100%), so the
       info column that follows lands below the full runway — not after one
       viewport. Its inner stage is what actually pins (sticky, 100svh). Every
       wrapper down to the stage must be full-runway-tall or the sticky unsticks
       early at that wrapper's bottom. */
    .vinaria-gallery-column,
    .vinaria-gallery-column .vinaria-product-gallery {
        height: 100%;
    }

    .vinaria-gallery-column .vinaria-gallery-stage {
        position: sticky;
        top: 0;
        height: 100svh;
        overflow: hidden;
    }

    .vinaria-info-column {
        position: relative;
        z-index: 1;
        height: auto;
        min-height: 0;
    }
}


.vinaria-gallery-stage {
    position: relative;
    height: 100vh;
    height: 100svh;
    background: #f8f8f7;
    overflow: hidden;
    box-sizing: border-box;
}

.vinaria-gallery-main {
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
}

.vinaria-gallery-main img {
    width: 100%;
    height: 100%;
    object-fit: contain;
}

.vinaria-gallery-image {
    width: 100%;
    height: 100%;
    object-fit: contain;
    cursor: zoom-in;
}

/* The site header is z-index 1100, above Bootstrap's default modal (1055), so the
   quickview opened *underneath* it and its close button was unreachable. Sit the
   modal and its backdrop above the header (the offcanvas menu is 1110). */
#quickview_modal {
    z-index: 1120;
}

.modal-backdrop {
    z-index: 1115;
}

/* Stays reachable while the body scrolls, instead of floating away with the content. */
#quickview_modal .quickview-close {
    position: sticky;
    top: 8px;
    float: right;
    z-index: 3;
    /* Negative margin so this sticky button doesn't reserve a 36px band above the
       image (which pushed the picture down from the modal's top edge). It stays
       pinned and clickable while the modal scrolls. */
    margin: 8px 8px -44px 0;
    background-color: #fff;
    border-radius: 50%;
    padding: 10px;
    opacity: 1;
    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.15);
}

#quickview_modal .vinaria-product-breadcrumb-wrap {
    display: none;
}

/* Full-bleed image: drop the modal body's 16px padding so the picture reaches all
   four edges (no white gutters on the sides or a gap at the top)... */
#quickview_modal .modal-body {
    padding: 0;
}

/* ...and give the padding back to just the text column, so the title/description
   don't run into the modal edges. */
#quickview_modal .vinaria-info-column {
    padding: 16px 20px 22px;
}

#quickview_modal .vinaria-product-info {
    padding: 0;
    margin-top: 0 !important;
}

/* The quickview modal is never pinned — the media render stacked in flow (like
   mobile) so all items are visible by scrolling the modal. */
#quickview_modal .vinaria-hero-pin__sticky {
    position: static;
    height: auto;
    overflow: visible;
}

#quickview_modal .vinaria-hero-pin__sticky .vinaria-info-column,
#quickview_modal .vinaria-hero-pin__sticky .vinaria-product-layout {
    height: auto;
}

#quickview_modal .vinaria-gallery-stage {
    padding-top: 0;
    height: auto;
    /* Without an explicit width the stage collapsed to the image's intrinsic width
       (~289px) and left white gutters; full width lets the image span the gallery. */
    width: 100%;
}

#quickview_modal .vinaria-gallery-content,
#quickview_modal .vinaria-gallery-slide,
#quickview_modal .vinaria-gallery-main {
    position: static;
    width: 100%;
}

#quickview_modal .vinaria-gallery-slide {
    position: relative;
    inset: auto;
    height: auto;
    opacity: 1;
    transform: none;
    pointer-events: auto;
    /* No side padding: the product image runs edge to edge, no white gutters. */
    padding: 0;
}

/* Full-bleed: the image spans the whole modal width instead of being letterboxed
   by object-fit: contain, which left white bands on the sides of a tall bottle. */
#quickview_modal .vinaria-gallery-main img,
#quickview_modal .vinaria-gallery-image {
    width: 100%;
    height: auto;
    max-height: none;
    object-fit: cover;
}

#quickview_modal .vinaria-gallery-video {
    max-height: 60vh;
}

.vinaria-gallery-video {
    width: 100%;
    height: 100%;
    object-fit: contain;
    border: none;
    border-radius: 0;
    outline: none;
    box-shadow: none;
    background: transparent;
    margin: 0;
}

/* ===== Single-image hero (added via JS as .is-static) =====
   When the product has only its main image, there is nothing to scroll through,
   so the pinned runway is disabled and the hero renders in normal flow — the
   info panel and the reviews sit right below it (fixes reviews being pushed off
   screen on mobile). Mirrors the quickview-modal's static treatment. */
.vinaria-hero-pin.is-static {
    height: auto !important;
}

.vinaria-hero-pin.is-static .vinaria-hero-pin__sticky {
    position: static;
    height: auto;
    overflow: visible;
}

.vinaria-hero-pin.is-static .vinaria-product-layout,
.vinaria-hero-pin.is-static .vinaria-info-column,
.vinaria-hero-pin.is-static .vinaria-gallery-column,
.vinaria-hero-pin.is-static .vinaria-gallery-column .vinaria-product-gallery {
    height: auto;
}

.vinaria-hero-pin.is-static .vinaria-info-column {
    display: block;
    justify-content: flex-start;
}

.vinaria-hero-pin.is-static .vinaria-gallery-stage {
    height: auto;
    padding-top: 0;
}

.vinaria-hero-pin.is-static .vinaria-gallery-content {
    position: static;
    height: auto;
}

.vinaria-hero-pin.is-static .vinaria-gallery-slide {
    position: relative;
    inset: auto;
    height: auto;
    opacity: 1;
    transform: none;
    pointer-events: auto;
    padding: 24px;
}

.vinaria-hero-pin.is-static .vinaria-gallery-main {
    height: auto;
}

.vinaria-hero-pin.is-static .vinaria-gallery-main img,
.vinaria-hero-pin.is-static .vinaria-gallery-image {
    height: auto;
    max-height: 72vh;
    width: 100%;
    object-fit: contain;
}

/* Desktop: the breadcrumb is absolutely positioned over the gallery. Push the
   gallery down so the whole product photo sits BELOW the breadcrumb instead of
   being covered by it. (Mobile keeps its own breadcrumb handling.) */
@media (min-width: 992px) {
    .vinaria-hero-pin.is-static .vinaria-gallery-stage {
        padding-top: 120px;
    }
}


/* ===== Instagram-style swipe carousel (added via JS as .is-carousel) ===== */
.vinaria-hero-pin.is-carousel .vinaria-gallery-stage {
    height: auto;
    overflow: visible;
    position: relative;
}
.vinaria-hero-pin.is-carousel .vinaria-gallery-content {
    position: static;
    display: flex;
    height: auto;
    overflow-x: auto;
    overflow-y: hidden;
    scroll-snap-type: x mandatory;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;
}
.vinaria-hero-pin.is-carousel .vinaria-gallery-content::-webkit-scrollbar {
    display: none;
}
.vinaria-hero-pin.is-carousel .vinaria-gallery-slide {
    position: relative;
    inset: auto;
    flex: 0 0 100%;
    width: 100%;
    height: auto;
    opacity: 1;
    transform: none;
    pointer-events: auto;
    scroll-snap-align: center;
    padding: 24px;
}
.vinaria-hero-pin.is-carousel .vinaria-gallery-main {
    height: auto;
}
.vinaria-hero-pin.is-carousel .vinaria-gallery-main img,
.vinaria-hero-pin.is-carousel .vinaria-gallery-image,
.vinaria-hero-pin.is-carousel .vinaria-gallery-video {
    height: auto;
    /* Taller stage so portrait bottle shots and the text-heavy distinction
       infographics are shown large enough to read comfortably. */
    max-height: 85vh;
    width: 100%;
    object-fit: contain;
}

/* The gallery video fills the full width of the gallery column (no letterbox
   bands): bottle images stay `contain` so the label is never cropped, but the
   atmospheric preview video is `cover` and full-bleed edge-to-edge. */
.vinaria-gallery-video {
    object-fit: cover;
}

.vinaria-gallery-slide--video {
    padding-left: 0;
    padding-right: 0;
}

/* Keep only a little top padding (breadcrumb clearance); no bottom padding so the
   video can reach the very bottom of the gallery column. */
.vinaria-hero-pin.is-carousel .vinaria-gallery-slide--video {
    padding: 24px 0 0 0;
    align-items: stretch;
}

/* Fill the slide top-to-bottom. The image slides size the column to 85vh + 48px
   (their 24px padding on each side); this video slide only has 24px on top, so its
   content box is (85vh + 48px) − 24px = 85vh + 24px. Capping max-height there lets
   flex-stretch fill the video to the bottom WITHOUT its portrait intrinsic height
   ballooning the column. object-fit: cover crops the excess. */
.vinaria-hero-pin.is-carousel .vinaria-gallery-slide--video .vinaria-gallery-video {
    height: auto;
    max-height: calc(85vh + 24px);
    object-fit: cover;
    /* Anchor to the top so the crop happens at the bottom — the top glass (where
       the pour lands) stays fully in frame. */
    object-position: center top;
}

/* Carousel controls — hidden unless the gallery is in carousel mode */
.vinaria-gallery-arrow,
.vinaria-gallery-dots {
    display: none;
}
.vinaria-hero-pin.is-carousel .vinaria-gallery-arrow {
    display: flex;
}
.vinaria-hero-pin.is-carousel .vinaria-gallery-dots {
    display: flex;
}
.vinaria-gallery-arrow {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    z-index: 4;
    width: 42px;
    height: 42px;
    border-radius: 50%;
    border: none;
    background: rgba(255, 255, 255, 0.85);
    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.12);
    font-size: 24px;
    line-height: 1;
    color: #1a1a1a;
    cursor: pointer;
    align-items: center;
    justify-content: center;
    transition: background 0.2s ease, opacity 0.2s ease;
}
.vinaria-gallery-arrow:hover {
    background: #fff;
}
.vinaria-gallery-arrow--prev {
    left: 16px;
}
.vinaria-gallery-arrow--next {
    right: 16px;
}
.vinaria-gallery-arrow.is-hidden {
    opacity: 0;
    pointer-events: none;
}
.vinaria-gallery-dots {
    position: absolute;
    bottom: 18px;
    left: 0;
    right: 0;
    z-index: 4;
    justify-content: center;
    gap: 8px;
}
.vinaria-gallery-dot {
    width: 8px;
    height: 8px;
    border-radius: 50%;
    border: none;
    background: rgba(26, 26, 26, 0.28);
    padding: 0;
    cursor: pointer;
    transition: background 0.2s ease, transform 0.2s ease;
}
.vinaria-gallery-dot.is-active {
    background: #1a1a1a;
    transform: scale(1.25);
}

/* Cross-fade layer stack: all media slides are stacked; the active one is shown.
   Scroll progress through the pinned hero (see .vinaria-hero-pin) chooses which
   slide is active — no inner scroller, no scroll-snap. */
.vinaria-gallery-content {
    position: relative;
    height: 100%;
}

.vinaria-gallery-slide {
    position: absolute;
    inset: 0;
    margin: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    /* Top padding clears the breadcrumb overlay (top:100px + ~28px tall) so
       media never renders behind/above it. */
    padding: 140px 60px 0;
    box-sizing: border-box;
    opacity: 0;
    transform: translateY(24px) scale(0.98);
    transition: opacity 0.45s ease, transform 0.45s ease;
    pointer-events: none;
}

.vinaria-gallery-slide.is-active {
    opacity: 1;
    transform: none;
    pointer-events: auto;
}


.vinaria-gallery-slide .vinaria-gallery-main {
    flex: 1 1 auto;
    min-width: 0;
    min-height: 0;
    width: 100%;
    height: 100%;
}

.vinaria-gallery-slide--video {
    padding: 140px 60px 0;
}

.vinaria-gallery-awards {
    position: absolute;
    top: 120px;
    right: 24px;
    z-index: 2;
    display: flex;
    flex-direction: column;
    gap: 12px;
}

#quickview_modal .vinaria-gallery-awards {
    top: 40px;
}

.vinaria-award-badge {
    display: block;
    width: 100px;
    height: 100px;
}

.vinaria-award-badge img {
    width: 100% !important;
    height: 100% !important;
    /* contain + transparent so the medal shows whole, not cropped into a white
       circle. */
    object-fit: contain !important;
    display: block;
    background: transparent;
    box-shadow: none;
    border-radius: 0 !important;
}

.vinaria-info-column {
    background: #fff;
}

.vinaria-product-info {
    max-width: 700px;
    margin: 0 auto;
    padding: 48px 12px 12px;
    color: #1f1f1d;
}

.vinaria-category-pill {
    font-size: 12px;
    letter-spacing: 0.24px;
    text-transform: uppercase;
    background: #f3efe9;
    padding: 8px 10px;
    display: inline-block;
    margin-bottom: 22px;
    font-weight: 500;
}

.vinaria-product-title {
    font-family: "Inter", "Segoe UI", sans-serif;
    font-size: 23px;
    letter-spacing: 0.48px;
    line-height: 1.15;
    margin: 0 0 16px;
    font-weight: 500;
    color: #000;
}

.vinaria-rating-row {
    display: flex;
    align-items: center;
    gap: 10px;
    margin-bottom: 20px;
    margin-top: 10px;
}

.vinaria-stars {
    display: inline-flex;
    gap: 2px;
    font-size: 11px;
    color: #20201e;
}

.vinaria-reviews-count {
    font-size: 10px;
    text-transform: uppercase;
    letter-spacing: 0.1em;
    color: #4f4f4f;
}

.vinaria-summary,
.vinaria-notes {
    font-size: 15px;
    line-height: 24px;
    font-weight: 400;
    color: #141414;
}

.vinaria-notes {
    margin: 0 0 26px;
}

/* Single-product price: new price black/bold, old price grey struck, % badge. */
.vinaria-product-price {
    display: flex;
    align-items: baseline;
    flex-wrap: wrap;
    gap: 10px 12px;
    margin: 0 0 20px;
}

.vinaria-price-current {
    font-size: 26px;
    font-weight: 700;
    line-height: 1;
    color: #141414;
}

.vinaria-price-old {
    font-size: 17px;
    font-weight: 500;
    color: #9a9a9a;
    text-decoration: line-through;
}

.vinaria-price-badge {
    align-self: center;
    font-size: 12px;
    font-weight: 700;
    line-height: 1;
    color: #fff;
    background: #1a1a1a;
    padding: 5px 8px;
    border-radius: 999px;
}

.vinaria-table {
    width: 100%;
    max-width: 600px;
    margin: 0 auto;
    border-collapse: collapse; /* Essential for clean thin lines */
    font-family: sans-serif;
    text-align: center;
}

/* Style the Header (First Row) */
.vinaria-table th {
    text-transform: uppercase;
    font-size: 12px;
    font-weight: 500;
    padding: 10px 5px;
    color: #000;
    border: none; /* Keep the very top borderless */
}

/* Style the Data (Second Row) */
.vinaria-table td {
    font-size: 16px;
    padding: 15px 10px;
    /* This creates the horizontal line between the two rows */
    border-top: 1px solid #e0e0e0;
}

/* Create the vertical divider between the columns */
/* This selects the second column header and data cell */

.vinaria-table td:last-child {
    border-left: 1px solid #e0e0e0;
}
.vinaria-temp-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0;
    margin: 0 0 20px;
    border: none;
}

.vinaria-temp-item {
    padding: 12px 16px;
    border-right: 1px solid #e0e0e0;
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
}

.vinaria-temp-item:last-child {
    border-right: 0;
}

.vinaria-temp-label {
    font-size: 10px;
    letter-spacing: 0.08em;
    font-weight: 600;
    line-height: 13px;
    text-transform: uppercase;
    color: #333333;
    margin-bottom: 8px;
}

.vinaria-temp-value {
    font-size: 14px;
    letter-spacing: 0.05em;
    text-transform: none;
    color: #000000;
    font-weight: 500;
}

.vinaria-cart-form .product-radio-btn {
    margin-top: 0.5rem;
    margin-bottom: 1.2rem;
}

.vinaria-pricing-row {
    margin-bottom: 14px;
}

.vinaria-pricing-row .product-pricing {
    font-size: 13px;
    text-transform: uppercase;
    letter-spacing: 0.08em;
}

.vinaria-pricing-row .text-danger1 {
    color: #181816 !important;
    font-weight: 600;
}
.promo-banner {
    max-width: 800px;
    margin: 50px auto;
    font-family: sans-serif;
    letter-spacing: 0.5px;
}
.promo-title {
    font-size: 0.75rem;
    font-weight: 600;
    color: #333;
    margin-bottom: 12px;
}
.promo-value {
    font-size: 0.85rem;
    font-weight: 700;
    color: #000;
    margin-top: 12px;
}
.vr-line {
    border-left: 1px solid #dee2e6;
    height: 40px;
    margin-top: 10px;
}
.vinaria-add-to-cart {
    width: 100%;
    background: #000000;
    color: #ffffff;
    border-radius: 0;
    font-size: 11px;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    border: 0;
    padding: 16px 20px;
    margin-top: 6px;
    font-weight: 600;
    line-height: 1.4;
}

.vinaria-add-to-cart:hover,
.vinaria-add-to-cart:focus {
    background: #1a1a1a;
    color: #ffffff;
}

.vinaria-award-row {
    margin-top: 5px;
    display: flex;
    align-items: center;
    gap: 12px;
}

.vinaria-award-icon {
    width: 70px;
    height: 60px;
    border-radius: 999px;
    border: 1px solid #cfd4d7;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: #2a5963;
    background: #f8fbfc;
}
.vinaria-award-row-left {
    padding: 10px 5px;
    background: #f4f4f2;
}
.vinaria-award-icon img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    border-radius: 999px;
}

.vinaria-award-row strong {
    display: block;
    font-size: 12px;
    letter-spacing: 0.05em;
    text-transform: uppercase;
    margin-bottom: 4px;
}

.vinaria-award-row p {
    margin: 0;
    font-size: 12px;
    color: #5f5f5b;
    line-height: 1.4;
}

.vinaria-support-row {
    margin-top: 16px;
    border-top: 1px solid #dfdfdb;
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

.vinaria-support-item {
    padding: 12px 10px;
}

.vinaria-support-item + .vinaria-support-item {
    border-left: 1px solid #dfdfdb;
}

.vinaria-support-title {
    display: block;
    font-size: 10px;
    letter-spacing: 0.14em;
    text-transform: uppercase;
    color: #1f1f1d;
    margin-bottom: 8px;
}

.vinaria-support-subtitle {
    display: block;
    font-size: 11px;
    text-transform: uppercase;
    color: #31312f;
    line-height: 1.35;
}

.vinaria-meta-links {
    margin-top: 18px;
    border-top: 1px solid #dfdfdb;
    padding-top: 14px;
    display: flex;
    gap: 20px;
    flex-wrap: wrap;
}

.vinaria-meta-links a {
    font-size: 10px;
    letter-spacing: 0.14em;
    color: #1f1f1d;
    text-transform: uppercase;
}

@media (max-width: 1199.98px) {
    .vinaria-gallery-column {
        border-right: 0;
        border-bottom: 1px solid #e3e3e1;
    }

    .vinaria-product-info {
        max-width: 100%;
        padding-top: 28px;
    }

    .vinaria-gallery-main img,
    .vinaria-gallery-image {
        width: 100%;
        height: 100%;
    }

    .vinaria-gallery-awards {
        gap: 8px;
        top: 32px;
    }

    .vinaria-award-badge {
        width: 64px;
        height: 64px;
    }
}

@media (max-width: 767.98px) {
    .vinaria-product-breadcrumb-wrap {
        top: 10px;
        left: 10px;
        padding: 7px 8px;
    }

    .vinaria-product-breadcrumb .wine-breadcrumb__item {
        font-size: 9px;
    }

    .vinaria-product-gallery {
        padding: 0;
    }

    .vinaria-product-title {
        font-size: 24px;
    }

    .vinaria-temp-grid {
        grid-template-columns: 1fr;
        gap: 12px;
    }

    .vinaria-meta-links {
        gap: 10px;
    }

    .vinaria-support-row {
        grid-template-columns: 1fr;
    }

    .vinaria-support-item + .vinaria-support-item {
        border-left: 0;
        border-top: 1px solid #dfdfdb;
    }

    .vinaria-gallery-slide {
        /* Top padding clears the mobile breadcrumb overlay (top:10px + ~25px tall). */
        padding: 45px 20px 0;
    }

    /* Media fills its box; object-fit preserves the aspect ratio within it. */
    .vinaria-gallery-main img,
    .vinaria-gallery-image,
    .vinaria-gallery-video {
        width: 100% !important;
        height: 100% !important;
        object-fit: contain !important;
    }

    /* Preview video is full-bleed on mobile (atmospheric footage may crop); only the
       bottle images keep `contain`. Flex-stretch with no side/bottom padding lets the
       clip reach the very bottom, so no grey band is left under it — but it keeps the
       same 45px top clearance as the image slides, otherwise it slides under the
       absolutely-positioned breadcrumb. */
    .vinaria-hero-pin.is-carousel .vinaria-gallery-slide--video,
    .vinaria-gallery-slide--video {
        padding: 45px 0 0;
        align-items: stretch;
    }

    .vinaria-hero-pin.is-carousel .vinaria-gallery-slide--video .vinaria-gallery-video,
    .vinaria-gallery-slide--video .vinaria-gallery-video {
        height: auto !important;
        max-height: none !important;
        object-fit: cover !important;
    }
}

@media (max-width: 575.98px) {
    .range-wine-slider__item {
        flex: 0 0 78vw;
        min-width: 78vw;
    }

    .range-wine-slider__nav {
        width: 40px;
        height: 40px;
        font-size: 18px;
    }
}

/* ============================================================
   VINARIA EDITORIAL SECTION
   ============================================================ */

.vinaria-editorial-section {
    margin-top: 0;
}

/* Top tag bar */
.vinaria-editorial-tagbar {
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 14px;
    gap: 14px;
    padding: 18px 26px;
    flex-wrap: wrap;
    margin-bottom: 20px;
}

.vinaria-editorial-tagbar-label {
    font-size: 11px;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    color: #8d8d89;
    margin-right: 6px;
    font-weight: 500;
}

.vinaria-editorial-tags {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex-wrap: wrap;
}

.vinaria-editorial-tag {
    position: relative;
    font-size: 11px;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    color: #222220;
    font-weight: 600;
    padding-right: 22px;
    margin-right: 14px;
    line-height: 1.2;
}

.vinaria-editorial-tag:not(:last-child)::after {
    content: ",";
    position: absolute;
    right: 7px;
    top: 0;
    color: #767673;
    font-weight: 500;
}

/* Layout */
.vinaria-editorial-layout {
    min-height: 600px;
}

/* Left column */
.vinaria-editorial-left {
    padding: 50px 60px 50px 0;
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
}

.vinaria-editorial-breadcrumb {
    font-size: 12px;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    color: #4f4f4f;
    margin-bottom: 28px;
    font-weight: 500;
}

.vinaria-editorial-intro {
    font-size: 22px;
    line-height: 1.55;
    color: #000;
    font-weight: 500;
    margin-bottom: 36px;
}

.vinaria-editorial-intro p {
    margin: 0;
}

.vinaria-editorial-accordion-item {
    border-bottom: 1px solid #e0e0dd;
}

.vinaria-editorial-accordion-btn {
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 100%;
    background: none;
    border: none;
    padding: 16px 0;
    font-size: 16px;
    letter-spacing: 0.06em;
    color: #000;
    font-weight: 500;
    text-align: left;
    cursor: pointer;
}

.vinaria-editorial-accordion-btn:focus {
    outline: none;
    box-shadow: none;
}

.vinaria-editorial-accordion-icon .icon-minus {
    display: none;
}

.vinaria-editorial-accordion-icon .icon-plus {
    display: inline;
}

.vinaria-editorial-accordion-btn[aria-expanded="true"] .icon-minus {
    display: inline;
}

.vinaria-editorial-accordion-btn[aria-expanded="true"] .icon-plus {
    display: none;
}

.vinaria-editorial-accordion-icon {
    font-size: 18px;
    font-weight: 300;
    color: #888884;
    flex-shrink: 0;
}

.vinaria-editorial-accordion-body {
    font-size: 13px;
    line-height: 1.7;
    color: #000;
    font-weight: 500;
    padding-bottom: 18px;
    padding-right: 20px;
}

/* Right column: full-height image or video */
.vinaria-editorial-right {
    position: relative;
    overflow: hidden;
    min-height: 800px;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
}

.vinaria-editorial-media-wrapper {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
}

.vinaria-editorial-image {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}

.vinaria-editorial-video {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}

/* Typology-style reviews: media sticks while the review list scrolls */
@media (min-width: 992px) {
    .vinaria-editorial-right--sticky {
        position: sticky;
        top: 0;
        align-self: flex-start;
        height: 100vh;
        min-height: 100vh;
    }
}

/* Responsive */
@media (max-width: 991.98px) {
    .vinaria-editorial-left {
        padding: 36px 20px;
    }

    .vinaria-editorial-intro {
        font-size: 17px;
        max-width: 100%;
    }

    .vinaria-editorial-right {
        /* +150px taller review video on mobile/tablet, per client request. */
        min-height: 530px;
    }
}

@media (max-width: 767.98px) {
    .vinaria-editorial-tagbar {
        justify-content: flex-start;
        padding: 14px 16px;
        gap: 8px;
    }

    .vinaria-editorial-tag {
        margin-right: 10px;
        padding-right: 16px;
        font-size: 10px;
    }

    .vinaria-editorial-tagbar-label {
        font-size: 10px;
    }

    .vinaria-editorial-intro {
        font-size: 16px;
    }
}

/* ============================================================
   VINARIA REVIEWS SECTION (Typology-style)
   ============================================================ */

/* ===== Reviews section (product page) ===== */
/* The reviews take the left half; the product media takes the right half.
   No max-width so the column fills its col-lg-6 (was full-width before). */
.vinaria-reviews-column {
    padding: 56px clamp(24px, 4vw, 60px) 72px;
}

/* Summary header */
.vinaria-reviews-summary {
    margin-bottom: 28px;
    padding-bottom: 24px;
    border-bottom: 1px solid #ececec;
}

.vinaria-reviews-score {
    display: flex;
    align-items: baseline;
    gap: 14px;
    margin-bottom: 8px;
}

.vinaria-reviews-score-number {
    font-size: 40px;
    font-weight: 600;
    line-height: 1;
    color: #14110d;
    letter-spacing: -0.02em;
}

.vinaria-stars--large {
    font-size: 16px;
    color: #c19a3e;
    letter-spacing: 2px;
}

.vinaria-reviews-count-text {
    font-size: 13px;
    line-height: 1.5;
    color: #7a746c;
    display: block;
}

/* Filter chips */
.vinaria-reviews-filters {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-bottom: 28px;
}

.vinaria-reviews-filter {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 9px 16px;
    border: 1px solid #e2ded7;
    border-radius: 0;
    background: #fff;
    color: #2b2620;
    font-size: 11px;
    font-weight: 600;
    letter-spacing: 0.05em;
    text-transform: uppercase;
    cursor: pointer;
    transition: background 0.2s ease, border-color 0.2s ease, color 0.2s ease;
}

.vinaria-reviews-filter i {
    font-size: 8px;
    color: #9a938a;
    transition: color 0.2s ease;
}

.vinaria-reviews-filter:hover {
    border-color: #c8c0b4;
    background: #faf8f4;
}

.vinaria-reviews-filter.active {
    background: #14110d;
    border-color: #14110d;
    color: #fff;
}

.vinaria-reviews-filter.active i {
    color: #fff;
}

/* Review cards */
.vinaria-reviews-list {
    display: flex;
    flex-direction: column;
    gap: 16px;
}

.vinaria-review-card {
    display: flex;
    gap: 24px;
    padding: 24px;
    border: 1px solid #e7e2da;
    border-radius: 0;
    background: #f7f5f1;
    transition: box-shadow 0.2s ease, border-color 0.2s ease;
}

.vinaria-review-card:hover {
    border-color: #d6cfc2;
    box-shadow: 0 8px 24px -18px rgba(20, 17, 13, 0.3);
}

.vinaria-review-left {
    width: 120px;
    flex-shrink: 0;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 4px;
}

.vinaria-review-avatar {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 44px;
    height: 44px;
    margin-bottom: 8px;
    border-radius: 0;
    background: linear-gradient(135deg, #7a8a36, #57632a);
    color: #fff;
    font-size: 18px;
    font-weight: 600;
    line-height: 1;
    letter-spacing: 0;
    text-transform: uppercase;
}

.vinaria-review-name {
    font-size: 13px;
    font-weight: 600;
    color: #14110d;
    line-height: 1.3;
}

.vinaria-review-verified {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    font-size: 11px;
    color: #7a8a36;
    font-weight: 500;
}

.vinaria-review-verified i {
    font-size: 11px;
}

.vinaria-review-date {
    font-size: 11px;
    color: #a29a8f;
    margin-top: 2px;
}

.vinaria-review-right {
    flex: 1;
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.vinaria-review-rating {
    font-size: 13px;
    color: #c19a3e;
    letter-spacing: 2px;
}

.vinaria-review-title {
    font-size: 13px;
    font-weight: 700;
    line-height: 1.45;
    color: #14110d;
    text-transform: uppercase;
    letter-spacing: 0.03em;
    margin: 0;
}

.vinaria-review-text {
    font-size: 14px;
    line-height: 1.65;
    color: #4a453e;
    margin: 0;
}

.vinaria-review-text.is-clamped {
    display: -webkit-box;
    -webkit-line-clamp: 3;
    line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.vinaria-review-show-more {
    align-self: flex-start;
    margin-top: 2px;
    padding: 0;
    border: none;
    background: none;
    color: #14110d;
    font-size: 12px;
    font-weight: 600;
    text-decoration: underline;
    text-underline-offset: 3px;
    cursor: pointer;
}

.vinaria-review-show-more:hover {
    color: #7a8a36;
}

.vinaria-reviews-empty {
    padding: 60px 0;
    text-align: center;
    color: #999;
    font-size: 14px;
}

/* Responsive */
@media (max-width: 991.98px) {
    .vinaria-reviews-column {
        padding: 40px 20px 56px;
    }

    .vinaria-reviews-score-number {
        font-size: 34px;
    }
}

@media (max-width: 767.98px) {
    .vinaria-reviews-column {
        padding: 32px 16px 48px;
    }

    .vinaria-reviews-score-number {
        font-size: 30px;
    }

    .vinaria-review-card {
        gap: 16px;
        padding: 18px;
    }

    /* Keep the author column beside the text, just narrower. */
    .vinaria-review-left {
        width: 92px;
    }

    .vinaria-review-avatar {
        width: 38px;
        height: 38px;
        font-size: 15px;
        margin-bottom: 6px;
    }

    .vinaria-review-name {
        font-size: 12px;
    }

    .vinaria-review-text {
        font-size: 13px;
    }
}

.vinaria-show-hero {
    position: relative;
    min-height: 750px;
    display: flex;
    align-items: center;
    justify-content: center;
    text-align: center;
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    overflow: hidden;
}

.vinaria-show-hero-overlay {
    position: absolute;
    inset: 0;
    background: linear-gradient(
        135deg,
        rgba(0, 0, 0, 0.5) 0%,
        rgba(0, 0, 0, 0.3) 100%
    );
}

.vinaria-show-hero-content {
    position: relative;
    z-index: 2;
    max-width: 800px;
    padding: 60px 24px;
}

.vinaria-show-hero-title {
    margin: 0 0 20px;
    font-size: clamp(28px, 5vw, 48px);
    line-height: 1.2;
    font-weight: 600;
    letter-spacing: 0.02em;
    color: #ffffff;
    text-shadow: 0 2px 8px rgba(0, 0, 0, 0.2);
}

.vinaria-show-hero-subtitle {
    max-width: 700px;
    margin: 0 auto 32px;
    font-size: clamp(14px, 1.8vw, 18px);
    line-height: 1.6;
    color: rgba(255, 255, 255, 0.95);
    font-weight: 400;
}

.vinaria-show-hero-form {
    position: relative;
    max-width: 500px;
    margin: 0 auto;
}

.vinaria-show-hero-search-icon {
    position: absolute;
    left: 18px;
    top: 50%;
    transform: translateY(-50%);
    color: #8a8a8a;
    font-size: 16px;
    line-height: 1;
    pointer-events: none;
}

.vinaria-show-hero-input {
    width: 100%;
    height: 52px;
    border: 2px solid rgba(255, 255, 255, 0.3);
    border-radius: 8px;
    background: rgba(255, 255, 255, 0.98);
    color: #222221;
    font-size: 15px;
    padding: 0 20px 0 48px;
    outline: none;
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.15);
    transition: all 0.3s ease;
}

.vinaria-show-hero-input:focus {
    border-color: rgba(255, 255, 255, 0.8);
    box-shadow: 0 4px 24px rgba(0, 0, 0, 0.2);
}

.vinaria-show-hero-input::placeholder {
    color: #9a9a9a;
}

@media (max-width: 991.98px) {
    .vinaria-show-hero {
        min-height: 580px;
    }

    .vinaria-show-hero-content {
        padding: 50px 20px;
    }

    .vinaria-show-hero-subtitle {
        margin-bottom: 28px;
    }

    .vinaria-show-hero-form {
        max-width: 450px;
    }
}

@media (max-width: 575.98px) {
    .vinaria-show-hero {
        min-height: 400px;
    }

    .vinaria-show-hero-content {
        padding: 40px 16px;
    }

    .vinaria-show-hero-title {
        font-size: clamp(30px, 8vw, 40px);
    }

    .vinaria-show-hero-subtitle {
        font-size: clamp(14px, 4.8vw, 20px);
    }
}

.gama-vintage-layout {
    background: #efefee;
}

.gama-vintage-panel {
    display: flex;
    flex-direction: column;
    min-height: 100%;
}

.gama-vintage-intro {
    padding: 30px 24px 32px;
}

.gama-vintage-breadcrumb {
    font-size: 11px;
    color: #7f7f7a;
    margin: 0;
}

.gama-vintage-tabs {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

.gama-vintage-tab {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border: 1px solid #d3d3d0;
    padding: 7px 12px;
    font-size: 10px;
    line-height: 1;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    text-decoration: none;
    color: #2a2a28;
    background: #f4f4f3;
}

.gama-vintage-tab.is-active {
    background: #181816;
    border-color: #181816;
    color: #fff;
}

.gama-vintage-tabs {
    display: flex;
    align-items: center;
    gap: 10px;
    flex-wrap: wrap;
}

.gama-vintage-tab {
    font-size: 11px;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    text-decoration: none;
    color: #2f2f2d;
    border: 1px solid #d4d4d2;
    padding: 7px 12px;
    transition: all 0.22s ease;
}

.gama-vintage-tab:hover,
.gama-vintage-tab:focus,
.gama-vintage-tab.is-active {
    border-color: #101010;
    color: #101010;
    background: #fff;
}

.gama-vintage-heading {
    font-family: "Inter", "Segoe UI", sans-serif;
    font-size: clamp(46px, 8vw, 78px);
    line-height: 0.94;
    letter-spacing: 0.01em;
    font-weight: 500;
    color: #0f0f0f;
    word-break: break-word;
}

.gama-vintage-description {
    max-width: 430px;
    font-size: 13px;
    line-height: 1.65;
    color: #151515;
}

.gama-vintage-products {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 1px;
    background: #dbdbd9;
}

.gama-vintage-card {
    background: #efefee;
}

.gama-vintage-card--empty {
    grid-column: span 2;
}

.gama-vintage-card__link {
    display: flex;
    flex-direction: column;
    min-height: 360px;
    padding: 10px 14px 12px;
    text-decoration: none;
    color: #121212;
}

.gama-vintage-card__badge {
    align-self: flex-end;
    font-size: 9px;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    margin-bottom: 6px;
    color: #343431;
}

.gama-vintage-card__media {
    flex: 1;
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
}

.gama-vintage-card__media img {
    width: 100%;
    max-width: 190px;
    height: auto;
    transition: transform 0.28s ease;
}

.gama-vintage-card__title {
    margin: 8px 0 0;
    font-size: 12px;
    font-weight: 500;
    line-height: 1.35;
    color: #131313;
}

.gama-vintage-card__link:hover .gama-vintage-card__media img,
.gama-vintage-card__link:focus .gama-vintage-card__media img {
    transform: scale(1.03);
}

.gama-vintage-banner {
    min-height: 100%;
}

.gama-vintage-banner img,
.gama-vintage-banner__video {
    display: block;
    width: 100%;
    height: 100%;
    min-height: 760px;
    object-fit: cover;
}

.gama-products-section {
    background: #fff;
}

@media (max-width: 1199.98px) {
    .gama-vintage-intro {
        padding: 24px 16px 24px;
    }

    .gama-vintage-banner img,
    .gama-vintage-banner__video {
        min-height: 520px;
    }
}

@media (max-width: 767.98px) {
    .gama-vintage-products {
        grid-template-columns: 1fr;
    }

    .gama-vintage-card__link {
        min-height: 300px;
    }

    .gama-vintage-card--empty {
        grid-column: span 1;
    }

    .gama-vintage-banner img,
    .gama-vintage-banner__video {
        min-height: 380px;
    }
}

.wine-banner-top {
    padding: 0px 25px 0;
}
.wine-breadcrumb-wrap {
    padding: 0 25px;
}

.wine-breadcrumb {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0;
    margin: 0;
    padding: 0;
    list-style: none;
}

.wine-breadcrumb__item {
    display: inline-flex;
    align-items: center;
    font-size: 12px;
    line-height: 1.2;
    font-weight: 400;
    letter-spacing: 0.02em;
    color: #9c9c9c;
}

.wine-breadcrumb__item a {
    color: inherit;
    text-decoration: none;
}

.wine-breadcrumb__item + .wine-breadcrumb__item::before {
    content: "/";
    margin: 0 6px;
    color: #b1b1b1;
}

.wine-breadcrumb__item[aria-current="page"] {
    color: #8f8f8f;
}

.wine-banner-top {
    padding: 0px 25px 0;
}

.wine-banner-title {
    font-family: "Inter", "Segoe UI", sans-serif;
    font-size: clamp(46px, 7vw, 78px);
    line-height: 0.92;
    letter-spacing: 0.01em;
    font-weight: 500;
    color: #000;
    text-transform: uppercase;
    /* Optional edge safeguard */
    margin-bottom: 0;
}

.wine-banner-description {
    max-width: 700px;
    font-size: 13px;
    line-height: 1.65;
    font-weight: 500;
    color: #000;
    /* Justified so both edges of the paragraph line up straight. */
    text-align: justify;
    text-justify: inter-word;

    /* FIX: This offset forces the text baseline of the paragraph to lock 
       perfectly onto the tight 0.92 line-height baseline of your large title text */
    margin-bottom: 6px;
}

/* On mobile views when stacked, remove the baseline shift and add normal spacing */
@media (max-width: 1199.98px) {
    .wine-banner-description {
        margin-bottom: 0;
        padding-top: 15px;
    }
}

.wine-category-hero__layout {
    min-height: 360px;
    background: #111;
}

.wine-category-hero__media,
.wine-category-hero__overlay {
    position: absolute;
    inset: 0;
}

.wine-category-hero__media {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.wine-category-hero__overlay {
    background: linear-gradient(
        180deg,
        rgba(6, 8, 10, 0.28) 0%,
        rgba(6, 8, 10, 0.34) 100%
    );
}

.wine-category-hero__content {
    position: absolute;
    inset: 0;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    text-align: center;
    padding: 32px 20px;
}

.wine-category-hero__eyebrow {
    font-size: 10px;
    letter-spacing: 0.16em;
    text-transform: uppercase;
    margin-bottom: 14px;
}

.wine-category-hero__title {
    font-family: "Inter", "Segoe UI", sans-serif;
    font-size: clamp(42px, 7vw, 78px);
    line-height: 0.95;
    letter-spacing: 0.02em;
    font-weight: 500;
    text-transform: uppercase;
}

.wine-category-hero__lead {
    max-width: 860px;
    margin: 14px auto 0;
    font-size: 12px;
    line-height: 1.7;
    letter-spacing: 0.02em;
    text-transform: uppercase;
    color: rgba(255, 255, 255, 0.94);
}

@media (min-width: 1200px) {
    .wine-banner-bottom {
        column-gap: 4px;
        flex-wrap: nowrap;
    }

    .wine-banner-bottom > [class*="col-"] {
        display: flex;
        flex-basis: calc(50% - 2px);
        max-width: calc(50% - 2px);
    }

    .wine-banner-products {
        width: 100%;
        flex: 1 1 auto;
        height: 100%;
        align-content: stretch;
    }

    .wine-banner-image-wrap {
        position: relative;
        flex: 1;
        min-height: 0;
        overflow: hidden;
    }

    .wine-banner-image {
        position: absolute;
        inset: 0;
        width: 100%;
        height: 100% !important;
        object-fit: cover;
    }
}

@media (max-width: 1199.98px) {
    .wine-category-hero__layout {
        min-height: 300px;
    }

    .wine-category-hero__lead {
        max-width: 680px;
        font-size: 11px;
    }

    .wine-banner-image {
        position: static;
        height: auto !important;
    }
}

.wine-category-hero + .wine-banner-section,
.wine-banner-section + .wine-banner-section {
    margin-top: 4px;
}

.wine-banner-products {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 4px;
}

/* A section with a single product (e.g. the Brut page) fills the whole products
   column with one cell, so the product frame extends all the way to the video
   instead of leaving half the column empty. */
.wine-banner-products--single {
    grid-template-columns: 1fr;
}

@media (min-width: 992px) {
    .wine-banner-products:not(.wine-banner-products--two) {
        grid-template-columns: repeat(4, 1fr);
    }
}

.wine-banner-product-cell {
    /* Overrides Bootstrap's leftover col-6/col-lg-3 percentage width so each
       cell fills its own CSS Grid track rather than a fraction of it. */
    width: 100%;
    max-width: none;
    flex: none;
    background: #f4f4f2;
}


/* No padding here — the card (and its full-bleed preview video) fill this
   wrapper edge-to-edge. The award/label corner and review-star overlays
   already position via their own top/left offsets against .media, an
   ancestor inside the card — they were never dependent on this padding. */
.wine-banner-card-wrap {
    /* CSS Grid stretches .wine-banner-product-cell to fill the row (default
       align-items:stretch), but that height doesn't cascade to a plain block
       child automatically — without this, this wrapper (and everything
       inside relying on h-100/percentage heights) stays only as tall as its
       own content, leaving the grid cell's extra height uncovered. */
    height: 100%;
    padding: 0;
}

.wine-banner-card-wrap .vertical-product-card__media {
    width: 100%;
    max-width: none;
    background: #f4f4f2 !important;
}

.wine-banner-card-wrap .vertical-product-card__image {
    width: 100%;
    max-width: 450px;
    height: 100%;
    max-height: 100%;
    object-fit: contain;
}

/* The video is a direct child of the outer .card (position:relative), which
   now fills .wine-banner-card-wrap edge-to-edge, so inset:0 spans the whole
   card — image area AND the name/price row below it. */
.wine-banner-card-wrap .vertical-product-card__video {
    object-fit: cover;
}

.wine-banner-section--secondary .wine-banner-products--two {
    border-left: 1px solid #dfdfdc;
}

.wine-banner-section--secondary
    .wine-banner-products--two
    .wine-banner-product-cell {
    min-height: 100%;
}

/* The cell can grow taller than its content (min-height:100% matches the
   hero image beside it) — stretch the card-wrap and card down to that same
   height so the full-bleed video covers the entire cell, not just its
   natural content height. */
.wine-banner-section--secondary
    .wine-banner-products--two
    .wine-banner-card-wrap {
    height: 100%;
}

.wine-banner-section--secondary
    .wine-banner-products--two
    .wine-banner-card-wrap
    .vertical-product-card,
.wine-banner-section--secondary
    .wine-banner-products--two
    .wine-banner-card-wrap
    .vertical-product-card
    > .card {
    height: 100%;
}

.wine-banner-section--secondary
    .wine-banner-products--two
    .wine-banner-card-wrap
    .vertical-product-card__media {
    height: 260px;
    min-height: 260px;
    max-height: 260px;
}

.best-seller-products-slider .vertical-product-card__media {
    height: 650px;
    min-height: 650px;
    max-height: 650px;
}

/* On mobile/tablet the fixed 650px height left a huge empty gap above the name
   in the best-seller slider. Match the responsive aspect-ratio used by the other
   product cards so the spacing is consistent everywhere. */
@media (max-width: 991.98px) {
    .best-seller-products-slider .vertical-product-card__media {
        height: auto;
        min-height: 0;
        max-height: none;
        aspect-ratio: 512 / 681;
    }
}

.wine-info-section__top {
    padding: 22px 16px;
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 12px;
}

.wine-info-section__eyebrow {
    font-size: 12px;
    font-weight: 500;
    letter-spacing: 0.08em;
    color: #909090;
    text-transform: uppercase;
}

.wine-info-section__category {
    font-size: 11px;
    letter-spacing: 0.04em;
    color: #20201e;
    text-transform: uppercase;
    font-weight: 600;
}

.wine-info-section__category-link {
    color: inherit;
    text-decoration: none;
}

.wine-info-section__category-link:hover .wine-info-section__category,
.wine-info-section__category-link:focus-visible .wine-info-section__category {
    text-decoration: underline;
}

.wine-info-section__divider {
    border-top: 1px solid #d8d8d5;
}

.wine-info-section__body {
    padding: 48px 24px 54px;
}

.wine-info-section__title {
    font-family: "Inter", "Segoe UI", sans-serif;
    font-size: clamp(54px, 6vw, 84px);
    line-height: 0.9;
    letter-spacing: 0.01em;
    color: #0f0f0f;
    font-weight: 500;
}

.wine-info-section__content {
    max-width: 860px;
}

.wine-info-section__block + .wine-info-section__block {
    margin-top: 26px;
}

.wine-info-section__heading {
    margin: 0 0 10px;
    font-size: 13px;
    line-height: 1.4;
    letter-spacing: 0.03em;
    text-transform: uppercase;
    color: #181816;
    font-weight: 600;
}

.wine-info-section__block p {
    margin: 0;
    max-width: 680px;
    font-size: 12px;
    line-height: 1.7;
    color: #2d2d2b;
}
.bg-primary {
    background: #000 !important;
    color: #fff !important;
}

@media (max-width: 1199.98px) {
    .wine-banner-top {
        padding: 20px 16px 0;
    }

    .wine-banner-section--secondary .wine-banner-products--two {
        border-left: 0;
    }

    .wine-info-section__body {
        padding: 34px 16px 40px;
    }
}

.privacy-policy-page {
    min-height: calc(100vh - 80px);
    padding: 28px 16px 48px;
}

.privacy-policy-layout {
    width: min(1120px, 100%);
    margin: 0 auto;
    display: grid;
    grid-template-columns: 220px minmax(0, 1fr);
    align-items: start;
    gap: 0;
}

.privacy-policy-nav,
.privacy-policy-panel {
    border: 1px solid #dddddd;
}

.privacy-policy-nav {
    padding: 20px 18px;
}

.privacy-policy-nav-list {
    margin: 0;
    padding: 0;
    list-style: none;
    display: grid;
    gap: 9px;
}

.privacy-policy-nav-link {
    text-decoration: none;
    color: #191919;
    font-size: 10px;
    letter-spacing: 0.03em;
    line-height: 1.25;
    text-transform: uppercase;
    display: inline-block;
}

.privacy-policy-panel {
    padding: 26px 38px 30px;
    min-height: 318px;
}

.privacy-policy-panel--terms {
    min-height: 690px;
}

.privacy-policy-title {
    margin: 0 0 24px;
    font-size: 41px;
    line-height: 1.05;
    font-weight: 500;
    color: #111;
}

.privacy-policy-items {
    margin: 0;
    padding: 0;
    list-style: none;
    display: grid;
    gap: 12px;
}

.privacy-policy-item {
    display: block;
    color: #1a1a1a;
    line-height: 1.25;
    font-weight: 500;
}

.privacy-policy-item-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
    width: 100%;
    background: none;
    border: none;
    padding: 0;
    margin: 0;
    text-align: left;
    color: inherit;
    font: inherit;
    cursor: pointer;
}

.privacy-policy-item-body {
    display: none;
    padding: 6px 40px 18px 0;
}

.privacy-policy-item.is-open .privacy-policy-item-body {
    display: block;
}

.privacy-policy-item-body p {
    font-size: 14px;
    line-height: 1.75;
    font-weight: 400;
    color: #444;
    margin: 0 0 10px;
}

.privacy-policy-item-text {
    display: block;
    font-size: 18px;
    font-weight: 500;
}

.privacy-policy-item-plus {
    font-size: 25px;
    line-height: 1;
    color: #3a3a3a;
    font-weight: 300;
    transform: translateY(-1px);
}

@media (max-width: 991.98px) {
    .privacy-policy-layout {
        grid-template-columns: 1fr;
    }

    .privacy-policy-nav {
        border-bottom: 0;
    }

    .privacy-policy-panel {
        padding: 18px 18px 22px;
    }

    .privacy-policy-title {
        font-size: 30px;
        margin-bottom: 16px;
    }

    .privacy-policy-item {
        font-size: 22px;
    }
}

@media (max-width: 767.98px) {
    .wine-breadcrumb-wrap {
        padding: 0 14px;
    }

    .wine-breadcrumb__item {
        font-size: 11px;
    }

    .wine-banner-top {
        padding: 12px 14px 0;
    }

    .wine-banner-title {
        font-size: clamp(34px, 12vw, 48px);
        line-height: 0.95;
    }

    .wine-banner-description {
        max-width: none;
        font-size: 12px;
        line-height: 1.55;
        padding-top: 0;
    }

    .wine-category-hero__layout {
        min-height: 260px;
    }

    .wine-category-hero__content {
        padding: 24px 16px;
    }

    .wine-category-hero__lead {
        font-size: 10px;
        line-height: 1.55;
    }

    .wine-banner-card-wrap .vertical-product-card__media {
        height: 220px;
        min-height: 220px;
        max-height: 220px;
    }

    .wine-banner-section--secondary
        .wine-banner-products--two
        .wine-banner-card-wrap
        .vertical-product-card__media {
        height: 160px;
        min-height: 160px;
        max-height: 160px;
    }

    .wine-banner-card-wrap .vertical-product-card__image {
        max-width: 500px;
    }

    .wine-banner-card-wrap .vertical-product-card .card-body {
        /* More room for the product title/price: breathing space on the left
           (away from the screen edge) and below it. */
        padding: 8px 12px 14px !important;
    }

    .wine-banner-card-wrap .vertical-product-card__meta-row {
        justify-content: center;
        align-items: center;
        text-align: center;
        flex-wrap: wrap;
        gap: 2px 6px;
    }

    .wine-banner-card-wrap .vertical-product-card__title,
    .wine-banner-card-wrap .vertical-product-card__price,
    .wine-banner-card-wrap .vertical-product-card__price .product-pricing,
    .wine-banner-card-wrap .vertical-product-card__price .fw-bold,
    .wine-banner-card-wrap .vertical-product-card__price small {
        font-size: 12px;
        line-height: 1.4;
    }

    .wine-info-section__top {
        flex-direction: column;
        gap: 6px;
    }

    .wine-info-section__title {
        font-size: clamp(40px, 15vw, 62px);
    }

    /* Drop the inter-section gap so all vertical spacing around a banner video
       comes from its own margin — giving it equal breathing room top and bottom. */
    .wine-category-hero + .wine-banner-section,
    .wine-banner-section + .wine-banner-section {
        margin-top: 0;
    }

    /* Taller panel on mobile: several clips are portrait (e.g. 540×720), and a short
       landscape box cropped them to a thin slice via object-fit: cover. */
    .wine-banner-image-wrap {
        height: 520px;
        min-height: 520px;
        margin: 8px 0;
    }

    .wine-banner-image {
        height: 520px !important;
    }
}

/* ============================================================
   CHECKOUT PAGE v2 — co-* classes
   ============================================================ */

.co-page {
    min-height: 100vh;
    padding: 48px 0 80px;
}

.co-container {
    margin: 0 auto;
    padding: 0 20px;
}

.co-layout {
    display: flex;
    align-items: flex-start;
    gap: 28px;
}

.co-left {
    flex: 0 0 58%;
    max-width: 58%;
}

.co-right {
    flex: 1;
    position: sticky;
    top: 100px;
    align-self: flex-start;
}

/* Quick Pay */
.co-quick-pay {
    background: #fff;
    padding: 18px 20px 22px;
    margin-bottom: 12px;
    border: 1px solid #e0e0e0;
    border-radius: 4px;
}

.co-quick-pay-label {
    text-align: center;
    font-size: 10px;
    letter-spacing: 0.14em;
    color: #777;
    margin: 0 0 14px;
    font-weight: 600;
    text-transform: uppercase;
}

.co-quick-pay-box {
    display: flex;
    gap: 10px;
}

.co-quick-btn {
    flex: 1;
    height: 46px;
    border: 1px solid #d0d0d0;
    background: #fff;
    border-radius: 4px;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    transition:
        border-color 0.15s,
        background 0.15s;
}

.co-quick-btn:hover {
    border-color: #999;
    background: #fafafa;
}

.co-divider {
    height: 1px;
    background: #e0e0e0;
    margin: 0 0 12px;
}

/* Block */
.co-block {
    background: #fff;
    margin-bottom: 12px;
    border: 1px solid #e0e0e0;
    border-radius: 4px;
    overflow: hidden;
}

.co-block-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 16px 20px;
    border-bottom: 1px solid #f0f0f0;
}

.co-block-title-bar {
    padding: 16px 20px;
    border-bottom: 1px solid #f0f0f0;
}

.co-block-title {
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    color: #1a1a1a;
}

.co-block-edit {
    font-size: 11px;
    font-weight: 600;
    letter-spacing: 0.06em;
    color: #1a1a1a;
    text-decoration: underline;
    text-underline-offset: 2px;
    text-transform: uppercase;
}

.co-block-edit:hover {
    color: #555;
}

.co-block-body {
    padding: 18px 20px;
}

.co-contact-email {
    color: #555;
    font-size: 14px;
    margin: 0;
}

.co-sub-label {
    font-size: 13px;
    font-weight: 500;
    color: #1a1a1a;
    margin: 0 0 14px;
}

/* Fields */
.co-field-wrap {
    margin-bottom: 10px;
}

.co-field-note {
    margin: 6px 2px 0;
    font-size: 12px;
    line-height: 1.4;
    color: #8a8a8a;
}

.co-field {
    display: block;
    width: 100%;
    height: 46px;
    padding: 0 14px;
    border: 1px solid #d0d0d0;
    border-radius: 4px;
    font-size: 14px;
    color: #1a1a1a;
    background: #fff;
    outline: none;
    transition: border-color 0.15s;
    box-sizing: border-box;
}

.co-field:focus {
    border-color: #1a1a1a;
}

.co-field::placeholder {
    color: #aaa;
}

.co-select {
    appearance: none;
    -webkit-appearance: none;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='11' height='7' viewBox='0 0 11 7'%3E%3Cpath d='M1 1l4.5 4.5L10 1' stroke='%23777' stroke-width='1.5' fill='none' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: right 14px center;
    padding-right: 36px;
    cursor: pointer;
}

/* Row layouts */
.co-row {
    display: flex;
    gap: 10px;
    margin-bottom: 0;
}

.co-row .co-col {
    flex: 1;
    min-width: 0;
}

.co-row--3 .co-col {
    flex: 1;
    min-width: 0;
}

/* Optional fields toggle */
.co-optional-toggle {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    font-size: 13px;
    color: #1a1a1a;
    text-decoration: underline;
    text-underline-offset: 2px;
    background: none;
    border: none;
    cursor: pointer;
    padding: 0;
    margin: 4px 0 14px;
    font-weight: 500;
}

.co-optional-toggle-icon {
    font-size: 15px;
    line-height: 1;
    font-weight: 400;
}

.co-optional-fields {
    display: none;
    margin-bottom: 10px;
}

.co-optional-fields.is-open {
    display: block;
}

/* Phone row */
.co-phone-row {
    display: flex;
    border: 1px solid #d0d0d0;
    border-radius: 4px;
    overflow: hidden;
    height: 46px;
    margin-bottom: 10px;
    background: #fff;
    transition: border-color 0.15s;
}

.co-phone-row:focus-within {
    border-color: #1a1a1a;
}

.co-phone-row .co-field {
    border: none;
    border-radius: 0;
    height: 44px;
    flex: 1;
}

.co-phone-row .co-field:focus {
    border: none;
    box-shadow: none;
}

.co-phone-prefix {
    display: flex;
    align-items: center;
    padding: 0 10px;
    border-right: 1px solid #d0d0d0;
    background: #f8f8f8;
    flex-shrink: 0;
    gap: 4px;
}

.co-phone-select {
    border: none;
    background: transparent;
    font-size: 13px;
    color: #1a1a1a;
    outline: none;
    cursor: pointer;
    -webkit-appearance: none;
    appearance: none;
    padding: 0;
    max-width: 80px;
}

.co-phone-input {
    min-width: 0;
}

/* Confirm button */
.co-confirm-btn {
    display: block;
    width: 100%;
    height: 50px;
    background: #1a1a1a;
    color: #fff;
    border: none;
    border-radius: 4px;
    font-size: 12px;
    font-weight: 700;
    letter-spacing: 0.14em;
    text-transform: uppercase;
    cursor: pointer;
    transition: background 0.15s;
    margin-top: 14px;
}

.co-confirm-btn:hover {
    background: #333;
}

/* Card logos */
/* Legal notice */
.co-legal {
    font-size: 11.5px;
    color: #888;
    line-height: 1.65;
    padding: 0 0 24px;
}

.co-legal a {
    color: #666;
    text-decoration: underline;
}

.co-legal .form-check {
    display: flex;
    align-items: flex-start;
    gap: 10px;
    padding: 0;
    margin: 0 0 12px;
}

.co-legal .form-check-input {
    width: 22px;
    height: 22px;
    margin: 0;
    flex-shrink: 0;
    border: 2px solid #000;
    border-radius: 4px;
    background-color: #fff;
}

.co-legal .form-check-input:checked {
    background-color: #000;
    border-color: #000;
}

.co-legal .form-check-input:focus {
    box-shadow: 0 0 0 3px rgba(0, 0, 0, 0.15);
    border-color: #000;
}

.co-legal .form-check-label {
    font-size: 14px;
    color: #000;
    line-height: 1.5;
}

.co-legal .form-check-label a {
    color: #000;
    font-weight: 600;
}

.auth-register-consent .form-check {
    display: flex;
    align-items: flex-start;
    gap: 10px;
    padding: 0;
    margin: 0 0 16px;
}

.auth-register-consent .form-check-input {
    width: 22px;
    height: 22px;
    margin: 0;
    flex-shrink: 0;
    border: 2px solid #000;
    border-radius: 4px;
    background-color: #fff;
}

.auth-register-consent .form-check-input:checked {
    background-color: #000;
    border-color: #000;
}

.auth-register-consent .form-check-input:focus {
    box-shadow: 0 0 0 3px rgba(0, 0, 0, 0.15);
    border-color: #000;
}

.auth-register-consent .form-check-label {
    font-size: 14px;
    color: #000;
    line-height: 1.5;
}

/* Payment methods in checkout v2 */
.co-block-body .checkout-radio {
    margin-top: 10px;
    border: 1px solid #e0e0e0;
    border-radius: 4px;
    padding: 12px 16px;
}

/* ============================================================
   SIDEBAR
   ============================================================ */

.co-sidebar {
    background: #fff;
    /* Full box border (all 4 sides). The stray line the client saw above
       "Livrare gratuită" was the first row's own border-top, removed separately. */
    border: 1px solid #e0e0e0;
    border-radius: 4px;
    padding: 12px 18px 4px;
}

.co-continue-btn {
    display: block;
    width: 100%;
    height: 50px;
    background: #1a1a1a;
    color: #fff;
    border: none;
    border-radius: 4px;
    font-size: 12px;
    font-weight: 700;
    letter-spacing: 0.14em;
    text-transform: uppercase;
    cursor: pointer;
    transition: background 0.15s;
    margin-bottom: 14px;
}

/* When it sits at the end of the summary, the spacing goes above it instead. */
.co-continue-btn--bottom {
    margin-top: 18px;
    margin-bottom: 0;
}

/* The mobile submit lives under the terms checkbox; hidden on desktop where the
   summary button is used instead. */
.co-continue-btn--mobile {
    display: none;
    margin-top: 16px;
}

@media (max-width: 991.98px) {
    .co-continue-btn--mobile {
        display: block;
        margin-top: 4px;
    }

    /* Tighten the gap between the legal text and the mobile submit button. */
    .co-legal {
        padding-bottom: 0;
    }

    .co-legal p {
        margin-bottom: 8px;
    }

    /* On mobile the summary sits at the top, so its own button would be far from
       the terms — hide it and rely on the one under the checkbox. */
    .co-sidebar .co-continue-btn--bottom {
        display: none;
    }
}

.co-continue-btn:hover {
    background: #333;
}

.co-sidebar-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 13px 0;
    border-top: 1px solid #f0f0f0;
    font-size: 13px;
    color: #1a1a1a;
    gap: 8px;
}

/* No line above the very first row ("Livrare gratuită") — it read as a stray
   border at the top of the summary. */
.co-sidebar-row:first-child {
    border-top: 0;
}

.co-sidebar-row--info .co-sidebar-row-title {
    font-size: 13px;
    font-weight: 500;
    color: #1a1a1a;
    line-height: 1.2;
}

.co-sidebar-row--info .co-sidebar-row-sub {
    font-size: 11px;
    color: #999;
    margin-top: 2px;
}

.co-sidebar-row-opts {
    background: none;
    border: none;
    cursor: pointer;
    font-size: 14px;
    color: #aaa;
    letter-spacing: 1px;
    padding: 2px 4px;
    flex-shrink: 0;
}

.co-expand-btn {
    width: 26px;
    height: 26px;
    border: 1px solid #d0d0d0;
    background: #fff;
    border-radius: 2px;
    cursor: pointer;
    font-size: 16px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    transition: background 0.1s;
    line-height: 1;
}

.co-expand-btn:hover {
    background: #f5f5f5;
}

.co-expand-body {
    display: none;
    padding: 10px 0 14px;
    border-top: 1px solid #f0f0f0;
}

.co-expand-body.is-open {
    display: block;
}

.co-coupon-form {
    display: flex;
    gap: 8px;
}

.co-coupon-form .co-field {
    height: 40px;
    font-size: 13px;
}

.co-coupon-apply {
    white-space: nowrap;
    padding: 0 14px;
    height: 40px;
    background: #1a1a1a;
    color: #fff;
    border: none;
    border-radius: 4px;
    font-size: 12px;
    font-weight: 600;
    cursor: pointer;
    flex-shrink: 0;
    transition: background 0.15s;
}

.co-coupon-apply:hover {
    background: #333;
}

.co-gift-label {
    font-size: 13px;
    display: flex;
    align-items: center;
    gap: 8px;
    cursor: pointer;
}

/* Price rows */
.co-price-rows {
    padding: 14px 0;
    border-top: 1px solid #f0f0f0;
}

.co-price-row {
    display: flex;
    justify-content: space-between;
    font-size: 13px;
    color: #1a1a1a;
    margin-bottom: 8px;
}

.co-price-row:last-child {
    margin-bottom: 0;
}

.co-price-row--total {
    font-weight: 700;
    font-size: 15px;
    margin-top: 10px;
    padding-top: 10px;
    border-top: 1px solid #f0f0f0;
}

/* ============================================================
   CART PAGE v2 — matches the checkout look (clean, thin borders)
   ============================================================ */
.cart-v2 {
    padding: 32px 0 72px;
}

.cart-v2__title {
    font-size: clamp(1.7rem, 1.2rem + 2vw, 2.4rem);
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.02em;
    color: #1a1a1a;
    margin: 0 0 20px;
}

.cart-v2__progress {
    max-width: 720px;
    margin-bottom: 32px;
}

.cart-v2__layout {
    display: flex;
    align-items: flex-start;
    gap: 28px;
}

.cart-v2__main {
    flex: 0 0 58%;
    max-width: 58%;
}

.cart-v2__aside {
    flex: 1;
    position: sticky;
    top: 100px;
    align-self: flex-start;
}

/* Items list */
.cart-v2__items {
    border: 1px solid #e0e0e0;
    border-radius: 4px;
    background: #fff;
    overflow: hidden;
}

.cart-v2-item {
    display: flex;
    align-items: center;
    gap: 16px;
    padding: 16px 18px;
    border-bottom: 1px solid #eee;
}

.cart-v2-item:last-child {
    border-bottom: 0;
}

.cart-v2-item__thumb {
    flex-shrink: 0;
    width: 60px;
    height: 76px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: #f7f7f5;
    border-radius: 3px;
    overflow: hidden;
}

.cart-v2-item__thumb img {
    max-width: 80%;
    max-height: 90%;
    object-fit: contain;
}

.cart-v2-item__info {
    flex: 1 1 auto;
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.cart-v2-item__name {
    font-size: 14px;
    font-weight: 600;
    color: #1a1a1a;
    text-decoration: none;
    line-height: 1.3;
    overflow-wrap: anywhere;
}

.cart-v2-item__name:hover {
    text-decoration: underline;
}

.cart-v2-item__variation {
    font-size: 12px;
    color: #8a8a8a;
}

/* Quantity stepper */
.cart-v2-item__qty {
    display: inline-flex;
    align-items: center;
    align-self: flex-start;
    margin-top: 6px;
    border: 1px solid #ddd;
    border-radius: 999px;
    overflow: hidden;
}

.cart-v2-qty-btn {
    width: 30px;
    height: 30px;
    border: 0;
    background: transparent;
    color: #1a1a1a;
    font-size: 15px;
    line-height: 1;
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

.cart-v2-qty-btn:hover {
    background: #f2f2f2;
}

.cart-v2-qty-value {
    min-width: 30px;
    text-align: center;
    font-size: 13px;
    font-weight: 600;
    color: #1a1a1a;
}

.cart-v2-item__right {
    flex-shrink: 0;
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    justify-content: space-between;
    gap: 18px;
    align-self: stretch;
}

.cart-v2-item__remove {
    border: 0;
    background: transparent;
    color: #b0b0b0;
    font-size: 15px;
    cursor: pointer;
    padding: 2px;
    line-height: 1;
}

.cart-v2-item__remove:hover {
    color: #1a1a1a;
}

.cart-v2-item__price {
    font-size: 14px;
    font-weight: 700;
    color: #1a1a1a;
    white-space: nowrap;
}

.cart-v2-item__price-old {
    display: inline-block;
    margin-left: 6px;
    font-size: 12px;
    font-weight: 500;
    color: #9a9a9a;
    text-decoration: line-through;
}

.cart-navbar-line-price .cart-navbar-price-old {
    display: block;
    font-size: 11px;
    font-weight: 500;
    color: #9a9a9a;
    text-decoration: line-through;
}

.cart-v2-empty {
    padding: 48px 18px;
    text-align: center;
    color: #8a8a8a;
    font-size: 14px;
}

/* Coupon */
.cart-v2__coupon {
    margin-top: 18px;
}

.cart-v2__coupon-label {
    display: block;
    font-size: 13px;
    font-weight: 600;
    color: #1a1a1a;
    margin-bottom: 8px;
}

.cart-v2__coupon-form {
    display: flex;
    gap: 8px;
}

.cart-v2__coupon-form .co-field {
    flex: 1 1 auto;
}

.cart-v2__coupon-apply {
    flex-shrink: 0;
    padding: 0 22px;
    height: 44px;
    border: 0;
    background: #1a1a1a;
    color: #fff;
    font-size: 12px;
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    border-radius: 4px;
    cursor: pointer;
}

.cart-v2__coupon-apply:hover {
    background: #000;
}

.cart-v2__coupon-clear {
    flex-shrink: 0;
    width: 44px;
    height: 44px;
    border: 1px solid #e0e0e0;
    background: #fff;
    color: #1a1a1a;
    border-radius: 4px;
    cursor: pointer;
}

/* Summary — reuses .co-sidebar / .co-price-row from checkout. Full box border. */
.cart-v2__summary {
    border-radius: 4px;
    padding: 20px 18px;
}

.cart-v2__shipping-note {
    font-size: 12px;
    color: #8a8a8a;
    margin: 14px 0 0;
}

.cart-v2__min-msg {
    font-size: 12px;
    color: #c0392b;
    margin: 10px 0 0;
}

.cart-v2__checkout {
    margin-top: 18px;
    text-decoration: none;
    display: flex;
    align-items: center;
    justify-content: center;
}

.cart-v2__continue-shop {
    display: block;
    text-align: center;
    margin-top: 12px;
    font-size: 12px;
    font-weight: 600;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    color: #1a1a1a;
    text-decoration: underline;
}

@media (max-width: 991.98px) {
    .cart-v2__layout {
        flex-direction: column;
    }

    .cart-v2__main,
    .cart-v2__aside {
        flex: 0 0 100%;
        max-width: 100%;
        width: 100%;
    }

    .cart-v2__aside {
        position: static;
    }
}

/* Cart items in sidebar */
.co-cart-items {
    padding-top: 14px;
    border-top: 1px solid #f0f0f0;
    margin-top: 0;
}

.co-cart-item {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 10px 0;
    border-bottom: 1px solid #f5f5f5;
}

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

.co-cart-item-img-wrap {
    position: relative;
    flex-shrink: 0;
    width: 54px;
    height: 68px;
    border: 1px solid #e4e4e4;
    border-radius: 3px;
    overflow: visible;
    background: #f9f9f9;
}

.co-cart-item-img {
    width: 100%;
    height: 100%;
    object-fit: contain;
    display: block;
    border-radius: 3px;
}

.co-cart-item-badge {
    position: absolute;
    top: -8px;
    right: -8px;
    width: 20px;
    height: 20px;
    background: #888;
    color: #fff;
    font-size: 11px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: 600;
    line-height: 1;
}

.co-cart-item-meta {
    flex: 1;
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 5px;
}

.co-cart-item-name {
    font-size: 13px;
    color: #1a1a1a;
    line-height: 1.4;
    display: block;
}

.co-cart-item-price {
    font-size: 13px;
    color: #1a1a1a;
    font-weight: 500;
    display: block;
}

.co-cart-item-price-old {
    margin-left: 6px;
    font-size: 12px;
    font-weight: 500;
    color: #9a9a9a;
    text-decoration: line-through;
}

/* Editable quantity + remove controls in the checkout order summary. */
.co-cart-item-controls {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin: 2px 0;
}

.co-cart-item-qty {
    display: inline-flex;
    align-items: center;
    border: 1px solid #d8d5d1;
    border-radius: 2px;
    overflow: hidden;
}

.co-cart-item-qty-btn {
    width: 28px;
    height: 28px;
    border: 0;
    background: #fff;
    color: #1a1a1a;
    font-size: 16px;
    line-height: 1;
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    transition: background 0.15s ease, color 0.15s ease;
}

.co-cart-item-qty-btn:hover {
    background: #111;
    color: #fff;
}

.co-cart-item-qty-value {
    min-width: 32px;
    text-align: center;
    font-size: 13px;
    font-weight: 500;
    color: #1a1a1a;
    border-left: 1px solid #d8d5d1;
    border-right: 1px solid #d8d5d1;
    padding: 0 4px;
    line-height: 28px;
}

.co-cart-item-remove {
    border: 0;
    background: transparent;
    color: #9a9a9a;
    width: 28px;
    height: 28px;
    cursor: pointer;
    font-size: 14px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    transition: color 0.15s ease;
}

.co-cart-item-remove:hover {
    color: #c0392b;
}

/* ============================================================
   CHECKOUT RESPONSIVE
   ============================================================ */

@media (max-width: 991.98px) {
    .co-layout {
        flex-direction: column-reverse;
    }

    .co-left,
    .co-right {
        flex: 0 0 100%;
        max-width: 100%;
        width: 100%;
    }

    .co-right {
        position: static;
    }
}

@media (max-width: 575.98px) {
    .co-page {
        padding: 24px 0 60px;
    }

    .co-container {
        padding: 0 12px;
    }

    .co-layout {
        gap: 16px;
    }

    .co-row {
        flex-direction: column;
        gap: 0;
    }

    .co-row--3 {
        flex-direction: column;
        gap: 0;
    }

    .co-block-body {
        padding: 14px 14px;
    }

    .co-block-header,
    .co-block-title-bar {
        padding: 14px;
    }
}

/* Users pages monochrome palette */

body.users-page a:hover,
body.users-page a:focus {
    color: #000 !important;
}

body.users-page .btn,
body.users-page .btn-primary,
body.users-page .btn-success,
body.users-page .btn-danger,
body.users-page .btn-warning,
body.users-page .btn-info,
body.users-page .btn-secondary {
    background: #000 !important;
    border-color: #000 !important;
    color: #fff !important;
}

body.users-page .btn:hover,
body.users-page .btn:focus,
body.users-page .btn-primary:hover,
body.users-page .btn-primary:focus,
body.users-page .btn-success:hover,
body.users-page .btn-success:focus,
body.users-page .btn-danger:hover,
body.users-page .btn-danger:focus,
body.users-page .btn-warning:hover,
body.users-page .btn-warning:focus,
body.users-page .btn-info:hover,
body.users-page .btn-info:focus,
body.users-page .btn-secondary:hover,
body.users-page .btn-secondary:focus {
    background: #fff !important;
    border-color: #000 !important;
    color: #000 !important;
}

body.users-page .badge,
body.users-page .bg-primary,
body.users-page .bg-success,
body.users-page .bg-danger,
body.users-page .bg-warning,
body.users-page .bg-info,
body.users-page .bg-secondary {
    background: #000 !important;
    color: #fff !important;
}

body.users-page .account-nav-menu a.active,
body.users-page .account-nav-menu a.active:hover,
body.users-page .account-nav-menu a.active:focus {
    background: #000 !important;
    color: #fff !important;
}

body.users-page .account-nav-menu a.active svg path {
    fill: #fff !important;
}

body.users-page .table,
body.users-page .table th,
body.users-page .table td,
body.users-page .wishlist-table th,
body.users-page .wishlist-table td {
    color: #000 !important;
}

/* Users account pages - Figma dashboard layout */
body.users-page .account-info {
    display: none !important;
}

body.users-page .figma-account-layout {
    --figma-sidebar-gap: 44px;
    margin-top: 10px;
}

body.users-page .figma-account-nav {
    height: 100%;
    padding: 8px 0;
}

body.users-page .figma-account-nav__list {
    list-style: none;
    margin: 0;
    padding: 0;
}

body.users-page .figma-account-nav__list li {
    margin-bottom: 16px;
}

body.users-page .figma-account-nav__list a,
body.users-page .figma-account-nav__logout button {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 0;
    border: 0;
    background: transparent;
    font-family: "Inter", sans-serif;
    font-style: normal;
    font-size: 11.62px;
    font-weight: 500;
    line-height: 14.39px;
    letter-spacing: 0.3px;
    vertical-align: middle;
    text-transform: uppercase;
    color: #0f1114 !important;
}

body.users-page .figma-account-nav__list a:hover,
body.users-page .figma-account-nav__logout button:hover {
    opacity: 0.7;
}

body.users-page .figma-account-nav__list a.is-disabled {
    opacity: 0.5;
    pointer-events: none;
}

body.users-page .figma-account-nav__list a.is-active::before {
    content: "\2192";
    font-size: 16px;
    line-height: 1;
}

body.users-page .figma-account-nav__logout {
    margin-top: 120px;
}

body.users-page .figma-account-main,
body.users-page .recent-orders.figma-account-main,
body.users-page .order-tracking-wrap.figma-account-main,
body.users-page .update-profile.figma-account-main,
body.users-page .address-book.figma-account-main {
    border: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
}

body.users-page .figma-account-main__header {
    border-bottom: 1px solid #d2d2d2;
    padding-bottom: 8px;
    margin-bottom: 36px !important;
}

body.users-page .figma-account-main__title {
    font-size: 46px;
    font-weight: 500;
    line-height: 1.06;
    letter-spacing: 0;
    text-transform: uppercase;
    color: #121316;
}

body.users-page .figma-account-main__more {
    font-size: 18px;
    font-weight: 600;
    text-decoration: underline;
    text-underline-offset: 4px;
    text-transform: uppercase;
}

body.users-page .figma-account-main__empty {
    font-size: 24px;
    font-weight: 400;
    line-height: 1.4;
    color: #1d1d1d;
}

body.users-page .order-history-table th {
    border-color: #e8e8e8;
    font-size: 13px;
    font-weight: 600;
    text-transform: uppercase;
}

body.users-page .order-history-table td {
    border-color: #efefef;
}

@media (max-width: 1199.98px) {
    body.users-page .figma-account-main__title {
        font-size: 40px;
    }
}

@media (max-width: 767.98px) {
    body.users-page .figma-account-layout {
        margin-top: 0;
    }

    body.users-page .figma-account-nav {
        padding: 2px 0 20px;
    }

    body.users-page .figma-account-nav__list li {
        margin-bottom: 10px;
    }

    body.users-page .figma-account-nav__logout {
        margin-top: 28px;
    }

    body.users-page .figma-account-main__header {
        margin-bottom: 18px !important;
    }

    body.users-page .figma-account-main__title {
        font-size: 28px;
    }

    body.users-page .figma-account-main__more {
        font-size: 12px;
    }

    body.users-page .figma-account-main__empty {
        font-size: 16px;
    }
}

/* Custom Best Seller Slider Styles */
.best-seller-slider-wrapper {
    position: relative;
    display: flex;
    align-items: center;
    gap: 16px;
}

.best-seller-products-slider {
    flex: 1;
    overflow: hidden;
    position: relative;
}

.best-seller-track {
    display: flex;
    will-change: transform;
}

.best-seller-slide {
    flex-shrink: 0;
    box-sizing: border-box;
}

.bs-slider-btn {
    width: 48px;
    height: 48px;
    border-radius: 50%;
    border: 1px solid #e4e4e4;
    background: #fff;
    color: #333;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: all 0.3s ease;
    flex-shrink: 0;
    z-index: 10;
}

.bs-slider-btn:hover:not(:disabled) {
    background: #f5f5f5;
    border-color: #ccc;
}

.bs-slider-btn:disabled {
    opacity: 0.5;
    cursor: not-allowed;
}

.bs-slider-btn i {
    font-size: 16px;
}

@media (max-width: 767px) {
    .best-seller-slider-wrapper {
        gap: 8px;
    }

    .bs-slider-btn {
        width: 40px;
        height: 40px;
    }

    .bs-slider-btn i {
        font-size: 14px;
    }
}


.story-mobile-bar {
    display: none;
}

.story-shell {
    display: flex;
    align-items: flex-start;
    max-width: 1400px;
    margin: 0 auto;
}

/* The global .main-wrapper uses overflow-x:hidden, which computes to "hidden
   auto" — a scroll container that breaks position:sticky for the rail below.
   overflow:clip still prevents horizontal scroll but does NOT create a scroll
   container, so sticky pins against the real viewport (see .vinaria-hero-pin
   above for the same fix applied to the product gallery). */
.main-wrapper:has(.story-rail) {
    overflow-x: clip !important;
    overflow-y: visible !important;
}

.story-rail {
    position: sticky;
    top: 0;
    height: 100vh;
    flex: 0 0 260px;
    border-right: 1px solid #dfdfdc;
    padding: 56px 32px 40px;
}

.story-rail__brand {
    display: block;
    font-size: 20px;
    letter-spacing: 0.01em;
    color: #111;
    margin-bottom: 72px;
}

.story-rail__toc-label {
    display: block;
    margin-bottom: 20px;
    font-size: 10px;
    letter-spacing: 0.16em;
    text-transform: uppercase;
    color: #8a8a8a;
}

.story-rail__toc ol {
    list-style: none;
    margin: 0;
    padding: 0;
    counter-reset: story-nav;
}

.story-rail__toc li {
    counter-increment: story-nav;
    position: relative;
    padding: 10px 0 10px 30px;
    border-left: 1px solid #ececea;
    margin-left: -1px;
}

.story-rail__toc li::before {
    content: counter(story-nav, decimal-leading-zero);
    position: absolute;
    left: -1px;
    top: 10px;
    width: 26px;
    padding-right: 10px;
    background: #fff;
    font-size: 10px;
    letter-spacing: 0.05em;
    color: #c7c7c2;
}

.story-rail__toc li a {
    font-size: 13px;
    letter-spacing: 0.02em;
    color: #6f6f6f;
    transition: color 0.2s ease;
}

.story-rail__toc li a:hover {
    color: #111;
}

.story-rail__toc li.is-active {
    border-left-color: #171717;
}

.story-rail__toc li.is-active::before,
.story-rail__toc li.is-active a {
    color: #111;
    font-weight: 600;
}

.story-main {
    flex: 1 1 auto;
    min-width: 0;
}

.story-block {
    padding: 100px 64px;
    border-bottom: 1px solid #dfdfdc;
    max-width: 900px;
}

.story-block:last-child {
    border-bottom: 0;
}

.story-eyebrow {
    display: block;
    margin-bottom: 20px;
    font-size: 11px;
    letter-spacing: 0.16em;
    text-transform: uppercase;
    color: #8a8a8a;
    font-weight: 600;
}

.story-hero-media {
    height: 52vh;
    min-height: 340px;
    width: 100%;
    margin-bottom: 48px;
    overflow: hidden;
    position: relative;
    display: flex;
    align-items: flex-end;
    background:
        linear-gradient(160deg, rgba(17, 17, 17, 0.08), rgba(17, 17, 17, 0.35)),
        repeating-linear-gradient(135deg, #3a2e2a 0 2px, #4a3a34 2px 4px),
        linear-gradient(180deg, #5b3a34 0%, #2e211d 100%);
}

.story-hero-media__glyph {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    font-size: 64px;
    opacity: 0.5;
    filter: grayscale(1) brightness(1.6);
}

.story-hero-media__cap {
    font-size: 10.5px;
    letter-spacing: 0.16em;
    text-transform: uppercase;
    color: rgba(255, 255, 255, 0.78);
    padding: 22px 26px;
}

.story-title {
    margin: 0 0 40px;
    font-size: 42px;
    font-weight: 500;
    line-height: 1.15;
    color: #111;
}

.story-lede-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 32px 48px;
}

.story-lede-grid p {
    margin: 0;
    font-size: 14px;
    font-style: italic;
    line-height: 1.85;
    color: #3a3a3a;
    text-align: justify;
    text-justify: inter-word;
}

/* --- Story page: full-width single-column layout (no left rail) --- */
.story-shell--full {
    display: block;
    max-width: none;
}

.story-shell--full .story-main {
    width: 100%;
}

.story-shell--full .story-block {
    max-width: 1080px;
    margin: 0 auto;
    padding: clamp(40px, 6vw, 96px) clamp(20px, 5vw, 64px);
    border-bottom: 0;
}

/* Hero video fills the media band; a soft gradient keeps the caption readable. */
.story-hero-media__video {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    z-index: 0;
}

.story-shell--full .story-hero-media::after {
    content: "";
    position: absolute;
    inset: 0;
    z-index: 1;
    background: linear-gradient(180deg, rgba(0, 0, 0, 0) 45%, rgba(0, 0, 0, 0.5) 100%);
    pointer-events: none;
}

.story-shell--full .story-hero-media__cap {
    position: relative;
    z-index: 2;
}

/* One flowing story text instead of a two-column grid — full width to the video edge. */
.story-lede-grid--single {
    grid-template-columns: 1fr;
    gap: 22px;
    max-width: none;
}

.story-lede-grid--single p {
    font-style: normal;
    font-size: 16px;
    line-height: 1.9;
}

.story-range-head {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 40px;
    align-items: end;
    margin-bottom: 56px;
}

.story-range-index {
    display: block;
    margin-bottom: 14px;
    font-size: 12px;
    letter-spacing: 0.1em;
    color: #a3a3a3;
}

.story-range-title {
    margin: 0;
    font-size: 34px;
    font-weight: 500;
    line-height: 1.1;
    color: #111;
}

.story-range-desc p {
    margin: 0;
    font-size: 14px;
    line-height: 1.8;
    color: #3a3a3a;
}

.story-range-swatch {
    height: 220px;
    width: 100%;
    margin-bottom: 56px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.story-range-swatch__glyph {
    font-size: 46px;
    opacity: 0.55;
    filter: grayscale(1) brightness(1.7);
}

.story-range-swatch--1 {
    background: linear-gradient(135deg, #efe9df, #ded3c0);
}

.story-range-swatch--2 {
    background: linear-gradient(135deg, #3d2a24, #6b463a);
}

.story-range-swatch--3 {
    background: linear-gradient(135deg, #5c1f24, #8a3232);
}

.story-range-swatch--4 {
    background: linear-gradient(135deg, #eef0ea, #cfd6c4);
}

.story-range-swatch--5 {
    background: linear-gradient(135deg, #241a17, #4a2f26);
}

@media (max-width: 767.98px) {
    .story-range-swatch {
        height: 150px;
        margin-bottom: 36px;
    }

    .story-range-swatch__glyph {
        font-size: 34px;
    }
}

.story-wine-list {
    list-style: none;
    margin: 0;
    padding: 0;
    counter-reset: story-wine;
    border-top: 1px solid #ececea;
}

.story-wine {
    counter-increment: story-wine;
    position: relative;
    padding: 30px 0 30px 56px;
    border-bottom: 1px solid #ececea;
}

.story-wine::before {
    content: counter(story-wine, decimal-leading-zero);
    position: absolute;
    left: 0;
    top: 31px;
    font-size: 12px;
    letter-spacing: 0.04em;
    color: #c7c7c2;
    font-weight: 600;
}

.story-wine__name-row {
    display: flex;
    align-items: baseline;
    flex-wrap: wrap;
    gap: 10px;
    margin-bottom: 10px;
}

.story-wine__name {
    font-size: 17px;
    font-weight: 600;
    color: #111;
}

.story-wine__tag {
    font-size: 10px;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: #8a8a8a;
    border: 1px solid #dfdfdc;
    padding: 3px 9px;
}

.story-wine__desc {
    margin: 0 0 14px;
    max-width: 620px;
    font-size: 13px;
    line-height: 1.75;
    color: #3a3a3a;
}

.story-wine__meta {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.story-meta-row {
    display: flex;
    gap: 10px;
    align-items: baseline;
    font-size: 12px;
}

.story-meta-label {
    flex: 0 0 auto;
    min-width: 56px;
    font-size: 10px;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    color: #b8b8b3;
}

.story-meta-value {
    color: #55534f;
    line-height: 1.6;
}

.story-wine__awards {
    display: flex;
    flex-direction: column;
    gap: 5px;
}

.story-award-line {
    display: flex;
    gap: 8px;
    align-items: flex-start;
    font-size: 11px;
    line-height: 1.6;
    letter-spacing: 0.01em;
    color: #8a6d3b;
}

.story-award-medal {
    flex: none;
    opacity: 0.85;
}

.story-temp-note {
    margin-top: 26px;
    padding-top: 18px;
    border-top: 1px solid #dfdfdc;
    display: flex;
    flex-direction: column;
    gap: 6px;
}

.story-temp-note .story-meta-value {
    color: #3a3a3a;
}

@media (max-width: 1199.98px) {
    .story-rail {
        flex: 0 0 220px;
        padding: 48px 24px 32px;
    }

    .story-block {
        padding: 80px 40px;
    }

    .story-title {
        font-size: 34px;
    }

    .story-range-title {
        font-size: 28px;
    }

    .story-range-head {
        gap: 28px;
    }

    .story-lede-grid {
        grid-template-columns: 1fr;
        max-width: 620px;
        gap: 24px;
    }
}

@media (max-width: 991.98px) {
    .story-mobile-bar {
        display: block;
        position: sticky;
        top: 0;
        z-index: 50;
        background: #fff;
        border-bottom: 1px solid #dfdfdc;
        padding: 18px 16px 0;
    }

    .story-mobile-bar__brand-row {
        margin-bottom: 12px;
    }

    .story-mobile-bar__brand {
        font-size: 17px;
        color: #111;
    }

    .story-mobile-bar__nav {
        display: flex;
        gap: 20px;
        overflow-x: auto;
        padding-bottom: 14px;
        scrollbar-width: none;
    }

    .story-mobile-bar__nav::-webkit-scrollbar {
        display: none;
    }

    .story-mobile-bar__nav a {
        flex: none;
        white-space: nowrap;
        padding-bottom: 12px;
        font-size: 11.5px;
        letter-spacing: 0.06em;
        text-transform: uppercase;
        color: #8a8a8a;
        border-bottom: 2px solid transparent;
    }

    .story-mobile-bar__nav a.is-active {
        color: #111;
        font-weight: 600;
        border-bottom-color: #111;
    }

    .story-shell {
        display: block;
    }

    .story-rail {
        display: none;
    }

    .story-block {
        max-width: none;
        padding: 64px 24px;
    }
}

@media (max-width: 767.98px) {
    .story-block {
        padding: 48px 16px;
    }

    .story-hero-media {
        height: 34vh;
        min-height: 220px;
        margin-bottom: 32px;
    }

    .story-title {
        font-size: 26px;
        margin-bottom: 28px;
    }

    .story-lede-grid {
        gap: 18px;
    }

    .story-lede-grid p {
        font-size: 13.5px;
    }

    .story-range-head {
        grid-template-columns: 1fr;
        gap: 18px;
        margin-bottom: 36px;
    }

    .story-range-title {
        font-size: 24px;
    }

    .story-wine {
        padding: 24px 0 24px 34px;
    }

    .story-wine::before {
        top: 25px;
        font-size: 11px;
    }

    .story-wine__name {
        font-size: 15px;
    }

    .story-wine__desc {
        font-size: 12.5px;
    }

    .story-meta-row {
        flex-direction: column;
        gap: 2px;
    }

    .story-meta-label {
        min-width: auto;
    }
}

/* ============================================================
   COOKIE CONSENT BANNER (Legea nr. 62/2024 RM)
   ============================================================ */
.cookie-consent {
    position: fixed;
    left: 16px;
    right: 16px;
    bottom: 16px;
    z-index: 1200;
    background: #fff;
    border: 1px solid #e0e0e0;
    border-radius: 8px;
    box-shadow: 0 8px 30px rgba(0, 0, 0, 0.12);
    padding: 18px 20px;
    opacity: 0;
    transform: translateY(16px);
    transition: opacity 0.25s ease, transform 0.25s ease;
    max-width: 720px;
    margin: 0 auto;
}

.cookie-consent.is-visible {
    opacity: 1;
    transform: translateY(0);
}

.cookie-consent__inner {
    display: flex;
    align-items: center;
    gap: 20px;
}

.cookie-consent__title {
    display: block;
    font-size: 14px;
    font-weight: 700;
    color: #1a1a1a;
    margin-bottom: 4px;
}

.cookie-consent__desc {
    margin: 0;
    font-size: 12.5px;
    line-height: 1.5;
    color: #555;
}

.cookie-consent__desc a {
    color: #1a1a1a;
    text-decoration: underline;
}

.cookie-consent__actions {
    display: flex;
    gap: 10px;
    flex-shrink: 0;
}

.cookie-consent__btn {
    border: 1px solid #1a1a1a;
    border-radius: 4px;
    padding: 10px 18px;
    font-size: 12px;
    font-weight: 700;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    cursor: pointer;
    white-space: nowrap;
    transition: background 0.15s, color 0.15s;
}

.cookie-consent__btn--dark {
    background: #1a1a1a;
    color: #fff;
}

.cookie-consent__btn--dark:hover {
    background: #000;
}

.cookie-consent__btn--ghost {
    background: #fff;
    color: #1a1a1a;
}

.cookie-consent__btn--ghost:hover {
    background: #f2f2f2;
}

@media (max-width: 767.98px) {
    .cookie-consent__inner {
        flex-direction: column;
        align-items: stretch;
        gap: 14px;
    }

    .cookie-consent__actions {
        flex-direction: column-reverse;
    }

    .cookie-consent__btn {
        width: 100%;
    }
}

/* ============================================================
   ANNOUNCEMENT BAR — top offers marquee
   ============================================================ */
:root {
    --announce-height: 40px;
}

.announce-bar {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    height: var(--announce-height);
    background: #1a1a1a;
    color: #fff;
    z-index: 1060;
    display: flex;
    align-items: center;
    overflow: hidden;
}

/* Push everything below the fixed bar. */
body {
    padding-top: var(--announce-height);
}

/* On mobile the header is ALSO fixed (72px) below the bar, so content must
   reserve both — otherwise the sticky logo/header overlaps page titles and
   images. This rule sits after the plain `body` bar-offset above so it wins by
   source order at mobile widths. Home keeps only the bar height because there
   the header is absolute over the hero. */
@media (max-width: 767.98px) {
    body {
        padding-top: calc(72px + var(--announce-height));
    }

    body.home-page {
        padding-top: var(--announce-height);
    }
}

.announce-bar__viewport {
    width: 100%;
    overflow: hidden;
}

.announce-bar__track {
    display: flex;
    align-items: center;
    white-space: nowrap;
    will-change: transform;
    animation: announce-scroll 40s linear infinite;
}

/* Each half is one full copy of the offer list; shifting the track by one half
   (-50%) loops with no visible seam. */
.announce-bar__half {
    display: flex;
    align-items: center;
    flex-shrink: 0;
}

.announce-bar__item {
    display: inline-flex;
    align-items: center;
    padding: 0 28px;
    font-size: 12px;
    font-weight: 600;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    color: #fff;
    line-height: 1;
}

a.announce-bar__item--link {
    text-decoration: none;
    color: #fff;
    pointer-events: auto;
}

a.announce-bar__item--link:hover {
    text-decoration: underline;
    color: #fff;
}

.announce-bar__dot {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    margin-right: 12px;
    font-size: 9px;
    line-height: 1;
    color: #c9a86a;
    opacity: 0.9;
}

/* The track holds two identical copies; scrolling exactly half loops seamlessly. */
@keyframes announce-scroll {
    from { transform: translateX(0); }
    to   { transform: translateX(-50%); }
}

/* Pause on hover so a reader can catch an offer. Scoped to devices that support
   real hover (mouse/trackpad) — on touchscreens `:hover` sticks after a tap
   (there is no pointer to move away), which froze the marquee permanently once
   someone tapped the bar. */
@media (hover: hover) and (pointer: fine) {
    .announce-bar:hover .announce-bar__track {
        animation-play-state: paused;
    }
}

@media (prefers-reduced-motion: reduce) {
    .announce-bar__track {
        animation: none;
        justify-content: center;
        width: 100%;
    }
}

@media (max-width: 767.98px) {
    :root {
        --announce-height: 34px;
    }

    .announce-bar__item {
        font-size: 11px;
        padding: 0 20px;
        letter-spacing: 0.06em;
    }

    .announce-bar__track {
        animation-duration: 24s;
    }
}

/* Language/currency switcher: the active region (e.g. "ROMÂNIA / RON") uses the
   platform's black, not the theme's default green .dropdown-item.active. */
.tt-curency-dropdown .dropdown-menu .dropdown-item.active,
.tt-curency-dropdown .dropdown-menu .dropdown-item:active {
    background-color: #111 !important;
    color: #fff !important;
}

/* Mobile off-canvas switcher: keep the active pill black to match. */
.site-header-offcanvas__currency.is-active {
    background-color: #111 !important;
    border-color: #111 !important;
    color: #fff !important;
}