/*
Theme Name: Vinera
Theme URI: https://vinera.ch
Author: NetriX GmbH
Author URI: https://www.netrix.ch
Description: Massgeschneidertes Theme für die Vinera AG – Hochwertiger Weinhandel in St. Moritz. Optimiert für WooCommerce und Gutenberg Editor. NetriX GmbH, Gutenbergstrasse 1, 8002 Zürich.
Version: 1.1.5
Requires at least: 5.8
Requires PHP: 7.4
License: Proprietary
License URI: https://www.netrix.ch
Text Domain: vinera
Tags: woocommerce, wine, custom-logo, custom-menu, gutenberg

© NetriX GmbH – www.netrix.ch
*/

/* ================================================================
   DESIGN TOKENS
   ================================================================ */

:root {
    /* Colors – Vinera Brand */
    --vinera-cream:       #F5F0E8;
    --vinera-cream-light: #FAF8F3;
    --vinera-cream-dark:  #E8E0D0;
    --vinera-olive:       #4A5338;
    --vinera-olive-light: #6B7A52;
    --vinera-olive-dark:  #3A4228;
    --vinera-gold:        #B8965A;
    --vinera-gold-light:  #D4B87A;
    --vinera-charcoal:    #2C2C2C;
    --vinera-text:        #333333;
    --vinera-text-light:  #666666;
    --vinera-border:      #D4C9B8;
    --vinera-white:       #FFFFFF;
    --vinera-black:       #1A1A1A;
    --vinera-red:         #8B2332;

    /* Typography */
    --font-display:  'Cinzel Decorative', 'Cinzel', 'Georgia', serif;
    --font-heading:  'Cinzel', 'Georgia', serif;
    --font-script:   'Pinyon Script', 'Georgia', cursive;
    --font-body:     'Cormorant Garamond', 'Georgia', serif;
    --font-sans:     'Lato', 'Helvetica Neue', sans-serif;

    /* Spacing */
    --space-xs:   0.25rem;
    --space-sm:   0.5rem;
    --space-md:   1rem;
    --space-lg:   2rem;
    --space-xl:   3rem;
    --space-2xl:  5rem;
    --space-3xl:  8rem;

    /* Layout */
    --content-width:    1200px;
    --sidebar-width:    300px;
    --header-height:    100px;

    /* Transitions */
    --transition-fast:  0.15s ease;
    --transition-base:  0.3s ease;
    --transition-slow:  0.5s ease;
}

/* ================================================================
   RESET & BASE
   ================================================================ */

*,
*::before,
*::after {
    box-sizing: border-box;
    margin: 0;
    padding: 0;
}

html {
    font-size: 17px;
    scroll-behavior: smooth;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

body {
    font-family: var(--font-body);
    font-size: 1rem;
    line-height: 1.7;
    color: var(--vinera-text);
    background-color: var(--vinera-cream-light);
}

img {
    max-width: 100%;
    height: auto;
    display: block;
}

a {
    color: var(--vinera-olive);
    text-decoration: none;
    transition: color var(--transition-fast);
}

a:hover {
    color: var(--vinera-gold);
}

h1, h2, h3, h4, h5, h6 {
    font-family: var(--font-heading);
    font-weight: 400;
    line-height: 1.3;
    color: var(--vinera-charcoal);
    letter-spacing: 0.05em;
}

h1 { font-size: 2.5rem; }
h2 { font-size: 2rem; text-transform: uppercase; letter-spacing: 0.12em; }
h3 { font-size: 1.5rem; }
h4 { font-size: 1.25rem; }

p {
    margin-bottom: 1rem;
}

/* ================================================================
   LAYOUT
   ================================================================ */

.site-container {
    min-height: 100vh;
    display: flex;
    flex-direction: column;
}

.site-content {
    flex: 1;
}

.container {
    max-width: var(--content-width);
    margin: 0 auto;
    padding: 0 var(--space-lg);
}

/* ================================================================
   HEADER
   ================================================================ */

.site-header {
    background-color: var(--vinera-cream-light);
    border-bottom: 1px solid var(--vinera-border);
    position: sticky;
    top: 0;
    z-index: 1000;
    transition: all var(--transition-base);
}

.header-top {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: var(--space-md) var(--space-lg);
    max-width: var(--content-width);
    margin: 0 auto;
    transition: padding var(--transition-base);
}

.header-icons {
    display: flex;
    align-items: center;
    gap: var(--space-md);
    min-width: 60px;
}

.header-icons--right {
    justify-content: flex-end;
}

.header-icons a,
.header-icons button {
    color: var(--vinera-charcoal);
    transition: color var(--transition-fast);
    display: flex;
    align-items: center;
}

.header-icons a:hover,
.header-icons button:hover {
    color: var(--vinera-gold);
}

.header-icons svg {
    display: block;
}

/* Menu toggle and Close button */
.menu-toggle,
.vinera-mobile-close-btn {
    display: none !important;
    background: none;
    border: none;
    cursor: pointer;
    padding: 4px;
    color: var(--vinera-charcoal);
    font-size: 0;
}

/* Site Logo */
.site-logo {
    text-align: center;
    position: relative;
    display: flex;
    justify-content: center;
    align-items: center;
    min-height: 80px;
    transition: min-height var(--transition-base);
}

.vinera-logo-svg {
    display: block;
    margin: 0 auto;
}

/* Main Logo (Quer) */
.vinera-logo-main {
    transition: opacity 0.4s ease, transform 0.4s ease;
    opacity: 1;
    transform: scale(1);
}

/* Short Logo */
.vinera-logo-short {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%) scale(0.8);
    opacity: 0;
    transition: opacity 0.4s ease, transform 0.4s ease;
    pointer-events: none;
}

/* Scrolled State on Header */
.site-header.is-scrolled .header-top {
    padding: var(--space-xs) var(--space-lg);
}

.site-header.is-scrolled .site-logo {
    min-height: 50px;
}

.site-header.is-scrolled .vinera-logo-main {
    opacity: 0;
    transform: scale(0.8);
    pointer-events: none;
}

.site-header.is-scrolled .vinera-logo-short {
    opacity: 1;
    transform: translate(-50%, -50%) scale(0.85);
    pointer-events: auto;
}

/* Cart icon with count */
.cart-link {
    position: relative;
    text-decoration: none;
}

.cart-count {
    position: absolute;
    top: -6px;
    right: -8px;
    background: var(--vinera-red);
    color: var(--vinera-white);
    font-size: 0.6rem;
    font-family: var(--font-sans);
    width: 16px;
    height: 16px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: 700;
}

/* Main Navigation */
.main-navigation {
    border-top: 1px solid var(--vinera-border);
    background: var(--vinera-cream-light);
}

.main-navigation ul {
    list-style: none;
    display: flex;
    justify-content: center;
    gap: var(--space-xl);
    padding: var(--space-md) 0;
    max-width: var(--content-width);
    margin: 0 auto;
}

.main-navigation a {
    font-family: var(--font-sans);
    font-size: 0.85rem;
    font-weight: 400;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    color: var(--vinera-charcoal);
    padding: var(--space-sm) 0;
    position: relative;
}

.main-navigation a::after {
    content: '';
    position: absolute;
    bottom: 0;
    left: 0;
    width: 0;
    height: 1px;
    background: var(--vinera-gold);
    transition: width var(--transition-base);
}

.main-navigation a:hover::after,
.main-navigation .current-menu-item a::after {
    width: 100%;
}

/* Mobile hamburger */
.menu-toggle {
    display: none;
    background: none;
    border: none;
    cursor: pointer;
    padding: var(--space-sm);
    color: var(--vinera-charcoal);
    font-size: 1.5rem;
}

/* ================================================================
   HOMEPAGE SECTIONS
   ================================================================ */

.hero-section {
    background-color: var(--vinera-cream);
    padding: var(--space-3xl) 0;
    text-align: center;
}

.hero-section h1 {
    font-family: var(--font-display);
    margin-bottom: var(--space-md);
}

.section-title {
    text-align: center;
    margin-bottom: var(--space-xl);
    font-family: var(--font-heading);
    font-size: 1.6rem;
    letter-spacing: 0.15em;
    text-transform: uppercase;
    color: var(--vinera-charcoal);
}

/* Featured Products / Empfehlungen */
.featured-products {
    padding: var(--space-2xl) 0;
    background: var(--vinera-cream);
}

.products-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: var(--space-xl);
    max-width: var(--content-width);
    margin: 0 auto;
    padding: 0 var(--space-lg);
}

.product-card {
    text-align: center;
    padding: var(--space-lg);
    transition: transform var(--transition-base);
}

.product-card:hover {
    transform: translateY(-4px);
}

.product-card .product-image {
    height: 300px;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-bottom: var(--space-lg);
}

.product-card .product-image img {
    max-height: 280px;
    width: auto;
    object-fit: contain;
}

.product-card .product-title {
    font-family: var(--font-body);
    font-size: 1.05rem;
    color: var(--vinera-charcoal);
    margin-bottom: var(--space-xs);
}

.product-card .product-meta {
    font-family: var(--font-sans);
    font-size: 0.8rem;
    color: var(--vinera-text-light);
    margin-bottom: var(--space-md);
}

.product-card .product-price {
    font-family: var(--font-sans);
    font-size: 1.1rem;
    font-weight: 700;
    color: var(--vinera-charcoal);
    margin-bottom: var(--space-md);
}

.btn-add-to-cart,
.button,
.woocommerce a.button,
.wc-block-components-button:not(.is-link),
.wc-block-components-checkout-place-order-button,
#place_order {
    display: inline-block;
    font-family: var(--font-heading) !important;
    font-size: 0.85rem !important;
    font-weight: 500 !important;
    letter-spacing: 0.1em !important;
    text-transform: uppercase !important;
    padding: 0.8rem 1.5rem !important;
    border: 1px solid var(--vinera-charcoal) !important;
    background: transparent !important;
    color: var(--vinera-charcoal) !important;
    cursor: pointer;
    transition: all var(--transition-fast);
}

.btn-add-to-cart:hover,
.button:hover,
.woocommerce a.button:hover,
.wc-block-components-button:not(.is-link):not(.wc-block-components-payment-method__button):hover,
.wc-block-components-checkout-place-order-button:hover,
#place_order:hover {
    background: var(--vinera-charcoal) !important;
    color: var(--vinera-white) !important;
}


/* Global Add to Cart Icon substitution (Loop Only) */
.btn-add-to-cart,
.woocommerce ul.products:not([class*="wc-block"]) li.product .button,
.woocommerce ul.products:not([class*="wc-block"]) li.product a.add_to_cart_button {
    font-size: 0 !important;
    padding: 0 !important;
    width: 44px !important;
    height: 44px !important;
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    border: none !important;
    background: transparent !important;
    color: var(--vinera-charcoal) !important;
}

.btn-add-to-cart:hover,
.woocommerce ul.products:not([class*="wc-block"]) li.product .button:hover,
.woocommerce ul.products:not([class*="wc-block"]) li.product a.add_to_cart_button:hover {
    background: transparent !important;
    color: var(--vinera-gold) !important;
}

.btn-add-to-cart::after,
.woocommerce ul.products:not([class*="wc-block"]) li.product .button::after,
.woocommerce ul.products:not([class*="wc-block"]) li.product a.add_to_cart_button::after {
    content: "";
    display: block;
    width: 18px;
    height: 20px;
    background-color: currentColor;
    -webkit-mask: url("data:image/svg+xml,%3Csvg viewBox='0 0 20 22' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M1 6H19L17.5 20H2.5L1 6Z' stroke='black' stroke-width='1.5' stroke-linejoin='round' fill='none'/%3E%3Cpath d='M6 6V4C6 2.34315 7.34315 1 9 1H11C12.6569 1 14 2.34315 14 4V6' stroke='black' stroke-width='1.5' stroke-linecap='round' fill='none'/%3E%3C/svg%3E") no-repeat center / contain;
    mask: url("data:image/svg+xml,%3Csvg viewBox='0 0 20 22' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M1 6H19L17.5 20H2.5L1 6Z' stroke='black' stroke-width='1.5' stroke-linejoin='round' fill='none'/%3E%3Cpath d='M6 6V4C6 2.34315 7.34315 1 9 1H11C12.6569 1 14 2.34315 14 4V6' stroke='black' stroke-width='1.5' stroke-linecap='round' fill='none'/%3E%3C/svg%3E") no-repeat center / contain;
}

/* Prevent WooCommerce from overwriting the SVG mask with its default text spinner */
.btn-add-to-cart.loading::after,
.woocommerce ul.products:not([class*="wc-block"]) li.product .button.loading::after,
.woocommerce ul.products:not([class*="wc-block"]) li.product a.add_to_cart_button.loading::after {
    content: "" !important;
    font-family: inherit !important;
    margin: 0 !important;
    top: auto !important;
    position: static !important;
    animation: vinera-spin 1s infinite linear !important;
}

@keyframes vinera-spin {
    from { transform: rotate(0deg); }
    to { transform: rotate(360deg); }
}


/* Winzer Section */
.winzer-section {
    padding: var(--space-2xl) 0;
    background: var(--vinera-cream-light);
}

.winzer-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: var(--space-xl);
    max-width: var(--content-width);
    margin: 0 auto;
    padding: 0 var(--space-lg);
}

.winzer-card {
    text-align: center;
}

.winzer-card .winzer-image {
    aspect-ratio: 4/3;
    overflow: hidden;
    border: 1px solid var(--vinera-border);
    margin-bottom: var(--space-md);
}

.winzer-card .winzer-image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    filter: grayscale(100%);
    transition: filter var(--transition-slow);
}

.winzer-card:hover .winzer-image img {
    filter: grayscale(0%);
}

.winzer-card .winzer-name {
    font-family: var(--font-body);
    font-size: 1.05rem;
    color: var(--vinera-charcoal);
    margin-bottom: var(--space-xs);
}

.winzer-card .winzer-location {
    font-family: var(--font-sans);
    font-size: 0.8rem;
    color: var(--vinera-text-light);
}

/* ================================================================
   FOOTER
   ================================================================ */

.site-footer {
    background: var(--vinera-cream);
    border-top: 1px solid var(--vinera-border);
    padding: var(--space-2xl) 0 var(--space-xl);
}

.footer-content {
    display: grid;
    grid-template-columns: 1fr 1.2fr 1fr;
    gap: var(--space-2xl);
    max-width: var(--content-width);
    margin: 0 auto;
    padding: 0 var(--space-lg);
}

.footer-col-logo {
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
}

.footer-col-logo--centered {
    align-items: center;
    text-align: center;
}

.footer-col-logo--centered .footer-mission-statement {
    text-align: center;
    max-width: 100%;
}

.footer-mission-statement {
    margin-top: var(--space-md);
    font-size: 0.85rem;
    font-family: var(--font-sans);
    line-height: 1.6;
    color: var(--vinera-text-light);
    max-width: 90%;
}

.footer-col-logo svg,
.vinera-footer-logo-hoch {
    width: 90px !important;
    max-width: 90px !important;
    height: auto !important;
    display: block;
    transition: opacity 0.35s ease, transform 0.35s ease;
    color: var(--vinera-charcoal);
    filter: none;
}

.footer-col-logo a {
    display: inline-flex;
    flex-direction: column;
    align-items: center;
    text-decoration: none;
    transition: opacity 0.35s ease;
}

.footer-col-logo a:hover .vinera-footer-logo-hoch,
.footer-col-logo a:hover svg {
    opacity: 0.7;
    transform: scale(1.04);
}

.footer-col-title {
    font-family: var(--font-heading);
    font-size: 1.1rem;
    font-weight: 400;
    margin-bottom: var(--space-md);
    color: var(--vinera-charcoal);
    letter-spacing: 0.05em;
    text-transform: uppercase;
}

.footer-address {
    font-family: var(--font-sans);
    font-size: 0.85rem;
    color: var(--vinera-text-light);
    line-height: 1.8;
    font-style: normal;
}

.footer-address strong {
    color: var(--vinera-charcoal);
    font-family: var(--font-body);
    font-size: 0.95rem;
}

.footer-address a {
    color: inherit;
    text-decoration: none;
    transition: color 0.3s ease;
}

.footer-address a:hover {
    color: var(--vinera-gold);
}

.footer-nav ul {
    list-style: none;
    padding: 0;
    margin: 0;
    display: flex;
    flex-direction: column;
    gap: var(--space-sm);
}

.footer-nav a {
    font-family: var(--font-sans);
    font-size: 0.85rem;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: var(--vinera-text-light);
    transition: color 0.3s ease;
}

.footer-nav a:hover {
    color: var(--vinera-gold);
}

.footer-bottom {
    margin-top: var(--space-2xl);
    padding-top: var(--space-lg);
    border-top: 1px solid var(--vinera-border);
}

.footer-bottom-inner {
    max-width: var(--content-width);
    margin: 0 auto;
    padding: 0 var(--space-lg);
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.footer-copyright,
.footer-credits {
    font-family: var(--font-sans);
    font-size: 0.75rem;
    color: var(--vinera-text-light);
    line-height: 1.6;
}

.footer-credits {
    text-align: right;
}

.footer-credits a {
    color: var(--vinera-charcoal);
    transition: color 0.3s ease;
}

.footer-credits a:hover {
    color: var(--vinera-gold);
}

/* ================================================================
   AGE GATE
   ================================================================ */

.vinera-age-gate {
    position: fixed;
    top: 0;
    left: 0;
    width: 100vw;
    height: 100vh;
    background: rgba(26, 26, 26, 0.85);
    backdrop-filter: blur(8px);
    -webkit-backdrop-filter: blur(8px);
    z-index: 99999;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: var(--space-md);
    transition: opacity 0.4s ease;
}

.vinera-age-gate-inner {
    background: var(--vinera-cream-light);
    border: 1px solid var(--vinera-gold-light);
    padding: var(--space-2xl) var(--space-xl);
    max-width: 500px;
    width: 100%;
    text-align: center;
    box-shadow: 0 20px 50px rgba(0,0,0,0.3);
}

.vinera-age-gate-title {
    font-size: 2rem;
    color: var(--vinera-charcoal);
    margin-bottom: var(--space-md);
    letter-spacing: 0.1em;
}

.vinera-age-gate-text {
    font-family: var(--font-sans);
    color: var(--vinera-text);
    margin-bottom: var(--space-xl);
    line-height: 1.6;
}

.vinera-age-gate-checkbox {
    display: block;
    position: relative;
    padding-left: 35px;
    margin-bottom: var(--space-xl);
    cursor: pointer;
    font-family: var(--font-sans);
    font-size: 0.95rem;
    color: var(--vinera-charcoal);
    text-align: left;
    user-select: none;
}

.vinera-age-gate-checkbox input {
    position: absolute;
    opacity: 0;
    cursor: pointer;
    height: 0;
    width: 0;
}

.vinera-age-gate-checkmark {
    position: absolute;
    top: 2px;
    left: 0;
    height: 22px;
    width: 22px;
    background-color: transparent;
    border: 1px solid var(--vinera-border);
    transition: all var(--transition-fast);
}

.vinera-age-gate-checkbox:hover input ~ .vinera-age-gate-checkmark {
    border-color: var(--vinera-gold);
}

.vinera-age-gate-checkbox input:checked ~ .vinera-age-gate-checkmark {
    background-color: var(--vinera-olive);
    border-color: var(--vinera-olive);
}

.vinera-age-gate-checkmark:after {
    content: "";
    position: absolute;
    display: none;
    left: 7px;
    top: 3px;
    width: 6px;
    height: 12px;
    border: solid var(--vinera-white);
    border-width: 0 2px 2px 0;
    transform: rotate(45deg);
}

.vinera-age-gate-checkbox input:checked ~ .vinera-age-gate-checkmark:after {
    display: block;
}

.btn-age-gate {
    width: 100%;
    padding: 1rem;
    font-size: 0.9rem;
    background: var(--vinera-charcoal) !important;
    color: var(--vinera-white) !important;
    border-color: var(--vinera-charcoal) !important;
}

.btn-age-gate:hover:not(:disabled) {
    background: var(--vinera-black) !important;
    border-color: var(--vinera-black) !important;
}

.btn-age-gate:disabled {
    opacity: 0.5;
    cursor: not-allowed;
}

/* ================================================================
   CATEGORY CTAS (Startseite)
   ================================================================ */

.category-cta-wrapper {
    margin-top: var(--space-3xl);
    display: flex;
    justify-content: center;
    gap: var(--space-lg);
    flex-wrap: wrap;
    align-items: center;
}

.category-cta {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 12px;
    min-width: 200px;
    padding: var(--space-md) var(--space-xl);
    transition: all 0.4s cubic-bezier(0.25, 0.8, 0.25, 1);
    font-family: var(--font-heading);
    font-size: 0.95rem;
    font-weight: 500;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    color: var(--vinera-charcoal);
    text-decoration: none;
}

.category-cta:hover {
    transform: translateY(-4px);
    box-shadow: 0 10px 25px rgba(0,0,0,0.1);
}

.category-cta span.arrow {
    display: inline-block;
    transition: transform 0.4s ease;
}

.category-cta:hover span.arrow {
    transform: translateX(6px);
}

.category-cta--all {
    min-width: 240px;
}

/* ================================================================
   WOOCOMMERCE OVERRIDES
   (Main product/shop styles are in assets/css/woocommerce.css)
   ================================================================ */

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

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

    .category-cta-wrapper {
        gap: var(--space-md);
    }
    .category-cta {
        min-width: 160px;
        padding: var(--space-sm) var(--space-lg);
    }
}

@media (max-width: 768px) {
    :root {
        --header-height: 70px;
    }

    .container {
        padding: 0 var(--space-md);
    }

    h1 { font-size: 1.8rem; }
    h2 { font-size: 1.5rem; }

    .header-top {
        padding: var(--space-sm) var(--space-md);
    }

    .site-logo img {
        max-height: 55px;
    }

    .menu-toggle {
        display: block !important;
    }

    /* Mobile Drawer Overlay */
    .vinera-mobile-overlay {
        position: fixed;
        top: 0;
        left: 0;
        width: 100vw;
        height: 100vh;
        background: rgba(0,0,0,0.5);
        z-index: 1000;
        opacity: 0;
        pointer-events: none;
        transition: opacity 0.4s ease;
    }
    
    .vinera-mobile-overlay.active {
        opacity: 1;
        pointer-events: auto;
    }

    /* Slide-in Navigation */
    .vinera-mobile-close-btn {
        display: block !important;
        position: absolute;
        top: 20px;
        left: 12px;
        background: none;
        border: none;
        font-size: 1.8rem;
        cursor: pointer;
        color: var(--vinera-charcoal);
        padding: 4px 10px;
        line-height: 1;
        z-index: 1002;
    }

    .main-navigation ul {
        position: fixed;
        top: 0;
        left: -100%;
        width: 80%;
        max-width: 320px;
        height: 100vh;
        background: var(--vinera-cream-light);
        display: flex;
        flex-direction: column;
        align-items: flex-start;
        justify-content: center;
        gap: var(--space-lg);
        padding: var(--space-2xl) var(--space-xl);
        z-index: 1001;
        box-shadow: 5px 0 20px rgba(0,0,0,0.15);
        transition: left 0.4s cubic-bezier(0.77, 0, 0.175, 1);
        margin: 0;
    }

    .main-navigation ul.toggled {
        left: 0;
    }

    .main-navigation li {
        width: 100%;
        text-align: left;
        border-bottom: 1px solid var(--vinera-border);
    }

    .main-navigation a {
        display: block;
        padding: var(--space-md) 0;
        font-size: 1.2rem;
    }

    .products-grid,
    .winzer-grid {
        grid-template-columns: 1fr;
        gap: var(--space-lg);
    }



    .footer-content {
        grid-template-columns: 1fr;
        text-align: center;
        gap: var(--space-xl);
    }

    .footer-col-logo {
        align-items: center;
    }

    .footer-col-title {
        margin-top: var(--space-lg);
    }

    .footer-nav ul {
        align-items: center;
    }

    .footer-bottom-inner {
        flex-direction: column;
        text-align: center;
        gap: var(--space-md);
    }

    .footer-credits {
        text-align: center;
    }
}

/* ================================================================
   UTILITY
   ================================================================ */

.text-center { text-align: center; }
.mt-1 { margin-top: var(--space-md); }
.mt-2 { margin-top: var(--space-lg); }
.mt-3 { margin-top: var(--space-xl); }
.mb-1 { margin-bottom: var(--space-md); }
.mb-2 { margin-bottom: var(--space-lg); }
.mb-3 { margin-bottom: var(--space-xl); }

/* Screen reader text */
.screen-reader-text {
    border: 0;
    clip: rect(1px, 1px, 1px, 1px);
    clip-path: inset(50%);
    height: 1px;
    margin: -1px;
    overflow: hidden;
    padding: 0;
    position: absolute;
    width: 1px;
    word-wrap: normal !important;
}

/* ================================================================
   ÜBER UNS PAGE
   ================================================================ */

.vinera-about-page {
    padding: 0;
}

/* Hide redundant page title – nav already shows location */
.page-id-341 .page-content > article > h1 {
    display: none;
}

/* Remove container margin/padding for full-bleed about page */
.page-id-341 .page-content {
    margin: 0;
    padding: 0;
    max-width: 100%;
}

/* Hero image – full-bleed with overlay */
.vinera-about-hero {
    margin: 0 !important;
    max-width: 100% !important;
    position: relative;
    overflow: hidden;
}

.vinera-about-hero img {
    width: 100%;
    height: 60vh;
    min-height: 350px;
    max-height: 550px;
    object-fit: cover;
    filter: brightness(0.85);
}

.vinera-about-hero::after {
    content: '';
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    height: 40%;
    background: linear-gradient(to top, var(--vinera-cream-light), transparent);
    pointer-events: none;
}

/* Content blocks */
.vinera-about-content {
    padding: var(--space-2xl) var(--space-lg);
    max-width: 750px !important;
    margin: 0 auto;
}

/* Tagline */
.vinera-about-tagline {
    font-family: var(--font-heading);
    font-size: clamp(1.8rem, 4vw, 2.6rem);
    font-weight: 400;
    color: var(--vinera-charcoal);
    letter-spacing: 0.04em;
    line-height: 1.3;
    margin-bottom: var(--space-lg) !important;
    text-align: center;
}

/* Gold separator */
.vinera-about-divider {
    border: none !important;
    border-top: 1.5px solid var(--vinera-gold) !important;
    width: 60px;
    margin: var(--space-lg) auto !important;
    opacity: 0.7;
}

/* Intro paragraph – slightly larger */
.vinera-about-intro {
    font-size: 1.15rem;
    line-height: 1.9;
    color: var(--vinera-text);
}

/* Regular paragraphs */
.vinera-about-content p {
    font-family: var(--font-body);
    font-size: 1.05rem;
    line-height: 1.85;
    color: var(--vinera-text);
    margin-bottom: var(--space-lg) !important;
}

/* Closing quote with accent */
.vinera-about-closing {
    font-style: italic;
    border-left: 3px solid var(--vinera-gold);
    padding-left: var(--space-lg);
    color: var(--vinera-text);
}

/* Cellar image – full width, moody */
.vinera-about-cellar {
    margin: var(--space-xl) 0 !important;
    max-width: 100% !important;
    position: relative;
}

.vinera-about-cellar img {
    width: 100%;
    height: 45vh;
    min-height: 280px;
    max-height: 450px;
    object-fit: cover;
    filter: brightness(0.9);
}

/* Signature */
.vinera-about-signature {
    font-family: var(--font-heading) !important;
    font-size: 1.1rem !important;
    color: var(--vinera-text) !important;
    margin-top: var(--space-md) !important;
    letter-spacing: 0.06em;
}

.vinera-about-signature em {
    font-family: var(--font-script);
    font-size: 1.6rem;
    font-style: normal;
    display: block;
    margin-bottom: var(--space-xs);
    color: var(--vinera-charcoal);
}

.vinera-about-signature small {
    font-family: var(--font-sans);
    font-size: 0.75rem;
    letter-spacing: 0.15em;
    text-transform: uppercase;
    color: var(--vinera-text-light);
}

/* Responsive */
@media (max-width: 768px) {
    .vinera-about-hero img {
        height: 40vh;
        min-height: 250px;
    }

    .vinera-about-content {
        padding: var(--space-xl) var(--space-md);
    }

    .vinera-about-tagline {
        font-size: 1.6rem;
    }

    .vinera-about-cellar img {
        height: 35vh;
        min-height: 200px;
    }
}

/* ================================================================
   LEGAL PAGES (Impressum, Datenschutz, AGB)
   ================================================================ */

.vinera-legal-page {
    max-width: 800px;
    margin: 0 auto;
    padding: var(--space-2xl) var(--space-lg) var(--space-xl);
}

/* High-specificity fallback to beat Gutenberg inline styles */
body.page-id-95 .entry-content > .vinera-legal-page,
body.page-id-96 .entry-content > .vinera-legal-page,
body.page-id-97 .entry-content > .vinera-legal-page,
body.page-id-98 .entry-content > .vinera-legal-page {
    max-width: 800px !important;
    margin-left: auto !important;
    margin-right: auto !important;
    width: 100%;
}

/* Hide redundant page title on legal & contact pages */
.page-id-95 .page-content > article > h1,
.page-id-96 .page-content > article > h1,
.page-id-97 .page-content > article > h1,
.page-id-98 .page-content > article > h1 {
    display: none;
}

.page-id-95 .page-content,
.page-id-96 .page-content,
.page-id-97 .page-content,
.page-id-98 .page-content {
    /* Let .container handle centering (max-width: 1200px; margin: auto) */
    padding-top: 0;
    padding-bottom: 0;
}

.vinera-legal-title {
    font-family: var(--font-heading);
    font-size: clamp(1.6rem, 3.5vw, 2.2rem);
    font-weight: 400;
    color: var(--vinera-charcoal);
    letter-spacing: 0.04em;
    text-align: center;
    margin-bottom: var(--space-sm) !important;
}

.vinera-legal-page h3 {
    font-family: var(--font-heading);
    font-size: 1.15rem;
    font-weight: 400;
    color: var(--vinera-charcoal);
    letter-spacing: 0.03em;
    margin-top: var(--space-xl) !important;
    margin-bottom: var(--space-sm) !important;
}

.vinera-legal-page h4 {
    font-family: var(--font-sans);
    font-size: 0.85rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.12em;
    color: var(--vinera-text-light);
    margin-top: var(--space-lg) !important;
    margin-bottom: var(--space-xs) !important;
}

.vinera-legal-page p {
    font-family: var(--font-body);
    font-size: 1rem;
    line-height: 1.8;
    color: var(--vinera-text);
    margin-bottom: var(--space-md) !important;
}

.vinera-legal-page ul {
    padding-left: var(--space-lg);
    margin-bottom: var(--space-md) !important;
}

.vinera-legal-page li {
    font-family: var(--font-body);
    font-size: 1rem;
    line-height: 1.8;
    color: var(--vinera-text);
    margin-bottom: var(--space-xs);
}

.vinera-legal-footer {
    margin-top: var(--space-xl) !important;
    text-align: center;
    font-family: var(--font-sans);
    font-size: 0.8rem;
    color: var(--vinera-text-light);
    letter-spacing: 0.08em;
}

/* ================================================================
   CONTACT PAGE
   ================================================================ */

.vinera-contact-page {
    padding: var(--space-xl) var(--space-lg) var(--space-xl);
}

.vinera-contact-columns {
    gap: var(--space-2xl) !important;
    margin-top: var(--space-lg) !important;
}

.vinera-contact-heading {
    font-family: var(--font-heading) !important;
    font-size: 1.15rem !important;
    font-weight: 400 !important;
    color: var(--vinera-charcoal) !important;
    letter-spacing: 0.03em;
    margin-bottom: var(--space-md) !important;
}

.vinera-contact-page p {
    font-family: var(--font-body);
    font-size: 1rem;
    line-height: 1.8;
    color: var(--vinera-text);
}

.vinera-map-container {
    margin: var(--space-lg) 0;
    border-radius: 8px;
    overflow: hidden;
    box-shadow: 0 2px 12px rgba(0,0,0,0.08);
}

.vinera-map-container iframe {
    display: block;
}

@media (max-width: 768px) {
    .vinera-contact-columns {
        gap: var(--space-lg) !important;
    }

    .vinera-legal-page,
    .vinera-contact-page {
        padding: var(--space-xl) var(--space-md);
    }
}

/* =====================================================================
   Preis anfragen – Button & Modal
   ===================================================================== */

/* Button: Standard Vinera-Style (Charcoal Border, Transparent) */
.vinera-preis-anfragen-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    padding: 14px 32px !important;
    background: transparent !important;
    color: var(--vinera-charcoal, #1a1a1a) !important;
    border: 1px solid var(--vinera-charcoal, #1a1a1a) !important;
    border-radius: 0 !important;
    font-family: var(--font-heading, 'Cinzel', serif) !important;
    font-size: 0.85rem !important;
    letter-spacing: 0.12em !important;
    text-transform: uppercase !important;
    text-decoration: none !important;
    cursor: pointer;
    transition: background 0.25s, color 0.25s;
    white-space: nowrap;
}
.vinera-preis-anfragen-btn:hover,
.vinera-preis-anfragen-btn:focus {
    background: var(--vinera-charcoal, #1a1a1a) !important;
    color: #fff !important;
    outline: none;
}
.vinera-preis-anfragen-single {
    margin: 24px 0 0;
}

/* Modal Overlay */
.vinera-modal-overlay {
    position: fixed;
    inset: 0;
    z-index: 99999;
    background: rgba(26, 26, 26, 0.55);
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 20px;
    opacity: 0;
    transition: opacity 0.3s ease;
    backdrop-filter: blur(3px);
}
.vinera-modal-overlay.is-visible {
    opacity: 1;
}

/* Modal Box – Vinera Cream */
.vinera-modal-box {
    background: var(--vinera-cream-light, #f5f2ec);
    border: 1px solid var(--vinera-border, #d4c9b0);
    border-radius: 0;
    max-width: 520px;
    width: 100%;
    padding: 44px 48px 48px;
    position: relative;
    max-height: 90vh;
    overflow-y: auto;
    transform: translateY(16px);
    transition: transform 0.3s ease;
}
.vinera-modal-overlay.is-visible .vinera-modal-box {
    transform: translateY(0);
}

/* Close Button */
.vinera-modal-close {
    position: absolute;
    top: 16px;
    right: 20px;
    background: none;
    border: none;
    color: var(--vinera-text-light, #888);
    font-size: 1.6rem;
    line-height: 1;
    cursor: pointer;
    padding: 4px 8px;
    transition: color 0.2s;
}
.vinera-modal-close:hover { color: var(--vinera-charcoal, #1a1a1a); }

/* Modal Title */
.vinera-modal-title {
    font-family: var(--font-heading, 'Cinzel', serif) !important;
    font-size: 1.1rem !important;
    color: var(--vinera-charcoal, #1a1a1a) !important;
    letter-spacing: 0.15em;
    margin: 0 0 32px !important;
    text-transform: uppercase;
    border-bottom: 1px solid var(--vinera-border, #d4c9b0);
    padding-bottom: 20px;
}

/* WPForms inside modal – Vinera style */
.vinera-modal-box .wpforms-container {
    margin: 0 !important;
}
.vinera-modal-box .wpforms-field-container .wpforms-field {
    margin-bottom: 20px !important;
}
.vinera-modal-box .wpforms-field label {
    color: var(--vinera-charcoal, #1a1a1a) !important;
    font-size: 0.72rem !important;
    letter-spacing: 0.1em !important;
    text-transform: uppercase !important;
    font-family: var(--font-sans, sans-serif) !important;
    margin-bottom: 8px !important;
    display: block;
}
.vinera-modal-box .wpforms-field input,
.vinera-modal-box .wpforms-field select {
    background: transparent !important;
    border: none !important;
    border-bottom: 1px solid var(--vinera-border, #d4c9b0) !important;
    border-radius: 0 !important;
    color: var(--vinera-charcoal, #1a1a1a) !important;
    padding: 10px 4px !important;
    width: 100% !important;
    font-family: var(--font-body, serif) !important;
    font-size: 0.95rem !important;
    transition: border-color 0.2s;
    box-shadow: none !important;
    outline: none !important;
}
.vinera-modal-box .wpforms-field input:focus {
    border-bottom-color: var(--vinera-charcoal, #1a1a1a) !important;
    outline: none !important;
    box-shadow: none !important;
}
.vinera-modal-box .wpforms-field input[readonly] {
    opacity: 0.6;
    cursor: default;
    color: var(--vinera-text-light, #888) !important;
}
/* Submit button – Vinera standard (charcoal border, transparent → solid on hover) */
.vinera-modal-box .wpforms-submit-container {
    margin-top: 28px !important;
    text-align: left;
}
.vinera-modal-box .wpforms-submit {
    background: transparent !important;
    color: var(--vinera-charcoal, #1a1a1a) !important;
    border: 1px solid var(--vinera-charcoal, #1a1a1a) !important;
    border-radius: 0 !important;
    padding: 14px 40px !important;
    font-family: var(--font-heading, 'Cinzel', serif) !important;
    font-size: 0.82rem !important;
    letter-spacing: 0.12em !important;
    text-transform: uppercase !important;
    cursor: pointer;
    transition: background 0.25s, color 0.25s;
}
.vinera-modal-box .wpforms-submit:hover {
    background: var(--vinera-charcoal, #1a1a1a) !important;
    color: #fff !important;
}

/* Success state */
.vinera-modal-form-wrap {
    transition: opacity 0.3s ease;
}
.vinera-modal-success {
    text-align: center;
    padding: 32px 0 16px;
    animation: fadeIn 0.4s ease;
}
.vinera-modal-success svg {
    display: block;
    margin: 0 auto 20px;
    stroke: var(--vinera-charcoal, #1a1a1a);
}
.vinera-modal-success p {
    color: var(--vinera-charcoal, #1a1a1a) !important;
    font-size: 1rem !important;
    line-height: 1.7;
}

@keyframes fadeIn {
    from { opacity: 0; transform: translateY(10px); }
    to   { opacity: 1; transform: translateY(0); }
}

@media (max-width: 600px) {
    .vinera-modal-box {
        padding: 28px 24px 32px;
    }
}

/* Preis anfragen – Loop-Variante (Galerie/Listen/Grid) */
.vinera-priceless-wrapper {
    display: flex;
    align-items: center;
    justify-content: center;
}
.vinera-preis-anfragen-loop {
    padding: 10px 20px !important;
    font-size: 0.75rem !important;
    letter-spacing: 0.12em !important;
}

/* =========================================================================
 * WPForms Bestätigungs-Box: grünen Hintergrund entfernen (transparent)
 * ========================================================================= */
.wpforms-confirmation-container,
.wpforms-confirmation-container-full,
.wpforms-confirmation-scroll {
    background: transparent !important;
    border: none !important;
    padding: 0 !important;
}

/* =========================================================================
 * WPForms Preisanfrage-Modal: Artikel-Feld lesbarer machen
 * ========================================================================= */
.vinera-artikel-readonly input[readonly],
.vinera-artikel-readonly input {
    color: var(--vinera-text, #2c2c2c) !important;
    font-weight: 600 !important;
    opacity: 1 !important;
    -webkit-text-fill-color: var(--vinera-text, #2c2c2c) !important;
}