.menu-wrapper .main-menu div.menu-owner:hover, .menu-wrapper .main-menu div.menu-family:hover,.menu-wrapper .main-menu div.menu-winery:hover,.menu-wrapper .main-menu div.menu-range:hover {
    opacity:1;
    font-size:100%;
    }
.menu-wrapper .main-menu div.menu-owner .menu-running, .menu-wrapper .main-menu div.menu-family .menu-running, .menu-wrapper .main-menu div.menu-winery .menu-running, .menu-wrapper .main-menu div.menu-range .menu-running {
    text-decoration: underline!important;
    }
    .menu-search-wrapper {
        margin-bottom:20px;
    }
    
    .menu-search-form {
        display: inline-flex;
        border: 1px solid #383838;
        border-radius: 0;
        overflow: hidden;
    }
    
    .menu-search-input {
        padding: 6px 10px;
        border: none;
        width: auto;
        font-size: 14px;
        color: #383838;
    }
    
    .menu-search-button {
        background-color: #FFF;
        border: none;
        padding: 6px 10px;
        cursor: pointer;
        font-size: 16px;
    }
    .menu-search-button i{
        color:#383838;
    }
.footer-wrapper {
    margin-top: 5rem;
}

/* Bande sombre footer (contact, réseaux, crédits) */
.footer-band {
    background-color: var(--reverse-bg-color);
    color: var(--reverse-text-color);
    padding: 3rem 0 1rem;
}

.footer-band a,
.footer-band button.btn-link,
.footer-band .footer-contact p,
.footer-band .footer-credits span,
.footer-band .footer-credits a,
.footer-band .footer-link {
    color: var(--reverse-text-color) !important;
    opacity: 0.85;
}

.footer-band a:hover,
.footer-band button.btn-link:hover,
.footer-band .footer-link:hover {
    opacity: 1;
}

.footer-band .btn-outline-primary {
    background-color: transparent !important;
    border-color: var(--reverse-text-color) !important;
    color: var(--reverse-text-color) !important;
    opacity: 0.85;
}

.footer-band .btn-outline-primary:hover {
    background-color: var(--reverse-text-color) !important;
    color: var(--reverse-bg-color) !important;
    opacity: 1;
}

.footer-wrapper .footer-menu a,
.footer-wrapper .footer-menu button {
    margin: 5px;
}

/* ============================================================
   FOOTER SERVICES : liste icône + texte
   ============================================================ */

.footer-services {
    margin: 2.5rem auto;
    max-width: 420px;
}

.footer-services-title {
    font-size: 1rem;
    letter-spacing: 0.2em;
    text-transform: uppercase;
    color: #1a1a1a;
    font-weight: 500;
    margin-bottom: 0;
    padding-bottom: 0.8rem;
    border-bottom: 1px solid var(--body-text-color);
}

.footer-services-list {
    list-style: none;
    padding: 0;
    margin: 0;
}

.footer-services-list li {
    border-bottom: 1px solid var(--border-color);
}

.footer-service-item {
    display: flex;
    align-items: center;
    gap: 1.2rem;
    padding: 0.9rem 0;
    width: 100%;
    text-align: left;
    color: #1a1a1a !important;
    font-size: 1.1rem;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    text-decoration: none !important;
    background: none !important;
    border: none !important;
    border-bottom: none !important;
    border-radius: 0 !important;
    cursor: pointer;
    transition: opacity 0.2s ease !important;
}

.footer-service-item:hover {
    opacity: 0.45 !important;
}

.footer-service-item i {
    font-size: 2rem;
    width: 2.4rem;
    text-align: center;
    flex-shrink: 0;
    color: #1a1a1a;
}

.footer-service-item span {
    flex: 1;
}
.recyclage-content {
    background:#F9F9F9;
}
.recyclage-content .nutrition {
    max-width:600px;
}
.recyclage-consignes img {
    max-width:80px;
    background:#F9F9F9;
}


.parallax-section.hero-parallax-section .parallax-wrapper {
    /*height: calc(100vh - 170px);*/
    max-width: 1720px;
    max-height: 860px;
}

@media (min-width:1024px){


    .brands-section .container-fluid .brand-panel {
    
        min-height:640px;
        max-width: 1720px;
        max-height: 860px;
       
        margin-right:auto;
        margin-left:auto;
    }
    

        .product-panel .product-description {
        padding-left:40px;
                padding-right:40px;
    }
        .product-hero-section .product-panel .product-description {
        padding-left:40px;
        padding-right:0;
    }
    
}

@media (min-width:1440px){


    .brands-section .container-fluid .brand-panel {
    
        min-height:780px;
        max-width: 1720px;
        max-height: 860px;
       

    }
    
    .header-wrapper .header-menu-wrapper {
                max-width: 1720px;
        margin-right:auto;
        margin-left:auto;
        }
    
}

@media (min-width:768px){
    /* modifié direct dans style.css */
    .header-wrapper .header-languagues .dropdown .dropdown-toggle{/*display:none*/}
    .header-wrapper .header-languagues .dropdown .dropdown-menu{/*position:relative!important;display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-flex-wrap:wrap;-ms-flex-wrap:wrap;flex-wrap:wrap;-webkit-box-align:center;-webkit-align-items:center;-ms-flex-align:center;align-items:center;margin:0;padding:0;border:none;-webkit-transform:translateZ(0)!important;transform:translateZ(0)!important*/}

    .header-wrapper .header-languagues .dropdown a, .header-wrapper .header-languagues .dropdown button {
        padding: 0.5rem 1rem;
    }
    .review-panel figure{
        -webkit-box-flex:0;-webkit-flex:0 0 20%;-ms-flex:0 0 20%;flex:0 0 20%;
        max-width:20%;
        padding:5px 0;}
}

.reviews-section{
    padding-bottom:40px;
}

.ico-tourism{
    width:48px;
    background:white;
    border-radius:10px;
    border:1px solid white;
    margin-bottom:10px;
}

.iframe-piwik{
    border: 0; 
    height: auto; 
    width: 100%;
}
/*
.brand-panel {
    width: 100%;
    margin-bottom: 20px;
}


@media (min-width: 768px) {
    .brand-panel {
        width: 48%;
        display: inline-block;
        vertical-align: top;
        margin-right: 2%;
    }
    .brand-panel:nth-child(2n) {
        margin-right: 0;
    }
}


@media (min-width: 992px) {
    .brand-panel {
        width: 30%;
        margin-right: 3.333%;
    }
    .brand-panel:nth-child(3n) {
        margin-right: 0;
    }
}
.brand-panel {
    padding: 20px;
    text-align: center;
}


.brand-content {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    height: 100%; 
}

.brand-panel h3,
.brand-panel .btn {
    margin: 10px 0;
}
*/

/* ============================================================
   DESIGN ÉPURÉ — Style minimaliste luxe v8
   Couleur texte principale : #1a1a1a
   ============================================================ */

/* --- Navigation : masquer les liens ancres à gauche --- */
#header-menu {
    visibility: hidden;
    pointer-events: none;
}

/* --- Burger dédié ---
   Taille des barres : modifier width/height ci-dessous */
.burger-toggle {
    position: absolute !important;
    left: 2rem;
    top: 50%;
    transform: translateY(-50%) !important;
    display: flex !important;
    flex-direction: column;
    justify-content: center;
    gap: 6px;
    width: 32px;
    padding: 0 !important;
    background: none !important;
    border: none !important;
    cursor: pointer;
    z-index: 10;
    text-decoration: none !important;
}

.burger-bar {
    display: block;
    width: 28px;
    height: 1.5px;
    background: #1a1a1a;
    transition: transform 0.35s ease, opacity 0.35s ease;
    transform-origin: center;
}

/* Animation ouverture en croix */
body.menu-open .burger-toggle .burger-bar:nth-child(1) {
    transform: translateY(7.5px) rotate(45deg);
}
body.menu-open .burger-toggle .burger-bar:nth-child(2) {
    opacity: 0;
}
body.menu-open .burger-toggle .burger-bar:nth-child(3) {
    transform: translateY(-7.5px) rotate(-45deg);
}

/* Logo centré */
.header-menu-wrapper {
    position: relative;
}

.header-logo {
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
    display: flex;
    align-items: center;
}

.header-logo .logo img {
    max-height: 60px;
    width: auto;
}

.header-logo-text {
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
    font-size: 1.4rem;
    letter-spacing: 0.2em;
    text-transform: uppercase;
    color: #1a1a1a;
    white-space: nowrap;
}

/* --- Menu drawer : slide depuis la gauche ---
   Largeur : modifier width et left ci-dessous */
.menu-wrapper {
    width: 380px !important;
    left: 0 !important;
    right: auto !important;
    transform: translateX(-100%) !important;
    transition: transform 0.4s cubic-bezier(0.4, 0, 0.2, 1) !important;
    justify-content: flex-start !important;
    align-items: flex-start !important;
    text-align: left !important;
    box-shadow: 4px 0 24px rgba(0,0,0,0.08);
}

/* Overlay sombre derrière le drawer */
.menu-wrapper::after {
    content: '';
    position: fixed;
    top: 0;
    left: 380px;
    right: 0;
    bottom: 0;
    background: rgba(0, 0, 0, 0.25);
    opacity: 0;
    transition: opacity 0.4s ease;
    pointer-events: none;
}

/* État ouvert */
body.menu-open .menu-wrapper {
    transform: translateX(0) !important;
}

body.menu-open .menu-wrapper::after {
    opacity: 1;
    pointer-events: all;
}

/* Contenu du menu aligné à gauche */
.menu-wrapper .menu-content {
    padding: 2rem 2.5rem;
    text-align: left;
    width: 100%;
}

.menu-wrapper .main-menu {
    text-align: left;
    padding: 1rem 0;
    font-size: 1.8rem;
}

.menu-wrapper .main-menu li {
    text-align: left;
    margin-bottom: 0.5rem;
}

.menu-wrapper .main-menu a {
    letter-spacing: 0.12em;
    font-weight: 300;
    text-transform: uppercase;
    color: #1a1a1a;
}

.menu-search-form {
    margin-bottom: 2.5rem;
    width: 100%;
}

.menu-search-input {
    width: 100%;
}

/* Mobile : drawer pleine largeur */
@media (max-width: 767px) {
    .menu-wrapper {
        width: 100% !important;
    }
    .menu-wrapper::after {
        display: none;
    }
}

/* --- Typographie globale --- */
body {
    color: #1a1a1a;
}

h1, h2, h3, h4, h5, h6 {
    font-weight: 300;
    letter-spacing: 0.08em;
    color: #1a1a1a;
}

/* --- Navigation : fine bordure basse, letter-spacing aéré --- */
.header-wrapper {
    border-bottom: 1px solid var(--border-color);
    box-shadow: none !important;
}

.header-wrapper .header-menu-wrapper {
    letter-spacing: 0.12em;
    font-size: 1.2rem;
}

/* --- Boutons : remplacés par liens texte uppercase soulignés --- */
.btn {
    background: transparent !important;
    border: none !important;
    border-bottom: 1px solid var(--body-text-color) !important;
    border-radius: 0 !important;
    padding: 0 0 2px 0 !important;
    font-size: 1.1rem !important;
    letter-spacing: 0.15em !important;
    color: #1a1a1a !important;
    text-transform: uppercase;
    transition: opacity 0.2s ease !important;
}

.btn:hover {
    opacity: 0.5 !important;
    background: transparent !important;
    color: #1a1a1a !important;
}

/* Bouton langue : sans encadré */
.header-languagues .btn.dropdown-toggle {
    border: none !important;
    padding: 0 !important;
    letter-spacing: 0.12em;
}

/* Boutons dropdown achat (hors nav) : garder un style distinct */
.btn.dropdown-toggle:not(.header-languagues .btn) {
    border: 1px solid var(--body-text-color) !important;
    padding: 0.6rem 1.5rem !important;
}

/* Espacement entre les items de la nav droite */
.header-languagues {
    gap: 1.6rem;
}

/* Icône contact : alignement vertical */
.nav-contact-btn {
    display: flex !important;
    align-items: center;
    padding: 0 !important;
    border: none !important;
}

.nav-contact-btn svg {
    display: block;
}

/* --- Hero : pleine largeur, hauteur généreuse --- */
.hero-parallax-section .parallax-wrapper,
.parallax-section.hero-parallax-section .parallax-wrapper {
    width: 100% !important;
    max-width: 100% !important;
    border-radius: 0 !important;
    overflow: hidden;
    height: calc(100vh - 100px) !important;
    max-height: none !important;
    margin: 0 !important;
}

/* --- Gammes (brands-section) : grille CSS, largeur contrainte
   max-width : modifier ci-dessous pour changer la largeur globale de la grille */
.brands-section .container-fluid {
    display: grid;
    grid-template-columns: 1fr;
    gap: 2rem;
    padding: 2rem;
    max-width: 1400px;
    margin-left: auto;
    margin-right: auto;
}

/* 2 colonnes — tablette */
@media (min-width: 768px) {
    .brands-section .container-fluid {
        grid-template-columns: repeat(2, 1fr);
    }
}

/* 3 colonnes — desktop */
@media (min-width: 1024px) {
    .brands-section .container-fluid {
        grid-template-columns: repeat(3, 1fr);
    }
}

/* Carte gamme : léger encadré */
.brands-section .brand-panel {
    display: flex;
    flex-direction: column;
    min-height: 0 !important;
    max-height: none !important;
    max-width: 100% !important;
    margin: 0 !important;
    padding: 0;
    border: 1px solid var(--border-color);
    border-radius: 0;
    box-shadow: none;
    overflow: hidden;
}

/* Image photo : hauteur fixe 2/3 de 540px
   Hauteur : modifier ci-dessous */
.brands-section .brand-image.cover {
    position: relative;
    width: 100%;
    height: 360px;
    flex-shrink: 0;
}

/* Image logo : contain, centré, même hauteur que cover */
.brands-section .brand-image.contain {
    height: 360px;
    flex-shrink: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 2rem;
    background: #fff;
}
.brands-section .brand-image.contain .image {
    width: 100%;
    height: 100%;
    object-fit: contain !important;
}

/* Description : typographie épurée, hauteur au contenu uniquement */
.brands-section .brand-description {
    flex: 0 0 auto;
    width: 100%;
    max-width: 100%;
    padding: 1.2rem 1.4rem;
    background: #fff;
    border-radius: 0;
    margin-top: 0;
    position: relative;
    z-index: 1;
    text-align: left;
}

.brands-section .brand-description h3 {
    font-size: 1.3rem;
    letter-spacing: 0.1em;
    font-weight: 400;
    margin-bottom: 0.4rem;
    text-transform: uppercase;
    display: block !important;
    visibility: visible !important;
    color: #1a1a1a;
}

.brands-section .brand-description .description {
    font-size: 1.2rem;
    color: #666;
    margin-bottom: 1rem;
}

/* Pas d'image ni logo : description seule, centrée, hauteur forcée
   Hauteur : modifier min-height ci-dessous */
.brands-section .brand-panel > .brand-description:first-child {
    min-height: 360px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    margin-top: 0;
    border-radius: 0;
}

/* Texte sombre (description sous l'image, plus sur fond image) */
.brands-section .brand-image.cover + .brand-description,
.brands-section .brand-panel .brand-image.cover + .brand-description h1,
.brands-section .brand-panel .brand-image.cover + .brand-description h2,
.brands-section .brand-panel .brand-image.cover + .brand-description h3 {
    color: #333;
}
.brands-section .brand-image.cover + .brand-description{
    padding:60px 20px;
}
/* Survol cards gamme : image assombrie, lien s'estompe */
@media (hover: hover) {
    .brands-section .brand-panel {
        transition: opacity 0.3s ease;
    }
    .brands-section .brand-panel:hover .brand-image.cover .image {
        filter: brightness(0.88);
        transition: filter 0.4s ease;
    }
    .brands-section .brand-panel:hover .btn {
        opacity: 0.5;
    }
}

/* ============================================================
   VINS (products-section) : grille de cartes portrait
   ============================================================ */

/* Grille — même logique que brands-section
   max-width : modifier ci-dessous */
.products-section .container-fluid,
.products-section .container-lg {
    display: grid;
    grid-template-columns: 1fr;
    gap: 2rem;
    padding: 2rem;
    max-width: 1400px;
    margin-left: auto;
    margin-right: auto;
}

/* 2 colonnes — tablette */
@media (min-width: 768px) {
    .products-section .container-fluid,
    .products-section .container-lg {
        grid-template-columns: repeat(2, 1fr);
    }
}

/* 3 colonnes max — desktop */
@media (min-width: 1024px) {
    .products-section .container-fluid,
    .products-section .container-lg {
        grid-template-columns: repeat(3, 1fr);
    }
}

/* Carte vin : léger encadré
   Hauteur : modifier ci-dessous */
.products-section .product-panel {
    position: relative;
    display: flex !important;
    flex-direction: column !important;
    flex-wrap: nowrap !important;
    align-items: stretch !important;
    justify-content: flex-start !important;
    height: 560px;
    margin-bottom: 0 !important;
    border-radius: 0;
    border: 1px solid var(--border-color);
    box-shadow: none;
    overflow: hidden;
    background: #fff;
    transition: opacity 0.3s ease;
}

/* Image bouteille : 2/3 de la carte
   Hauteur : modifier ci-dessous */
.products-section .product-panel .product-image {
    flex: 0 0 390px !important;
    max-width: 100% !important;
    width: 100% !important;
    height: 390px;
    order: 1 !important;
    padding: 1.5rem;
    display: flex;
    align-items: center;
    justify-content: center;
    background: #fff;
    margin-bottom: 0 !important;
}

.products-section .product-panel .product-image img {
    max-height: 100%;
    width: auto;
    object-fit: contain;
}

/* Description vin : épurée, pas d'effet tab */
.products-section .product-panel .product-description {
    flex: 1 !important;
    order: 2 !important;
    width: 100% !important;
    max-width: 100% !important;
    padding: 1.2rem 1rem !important;
    background: #fff;
    border-radius: 0;
    margin-top: 0;
    position: relative;
    z-index: 1;
    display: flex;
    flex-direction: column;
    justify-content: center;
    gap: 0.8rem;
}

/* Nom du vin — toujours centré, margin reset */
.products-section .product-panel .product-description h3,
.products-section .product-panel .product-description .description {
    margin-bottom: 0;
    font-size: 1.4rem;
    text-align: center;
}

/* Description clampée à 2 lignes pour garder le bouton visible */
.products-section .product-panel .product-description .description p {
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    font-size: 1.3rem;
    margin-bottom: 0.5rem;
}

/* Survol vins : image légèrement assombrie + description remonte depuis le bas */
@media (hover: hover) {
    .products-section .product-panel:hover .product-image img {
        filter: brightness(0.88);
        transition: filter 0.4s ease;
    }

    /* Description : ancrage bas, remonte selon le volume de texte
       min-height = hauteur normale (560 - 390 = 170px) → pas de rétrécissement sans description
       Si texte long → bloc plus haut, remonte sur l'image. */
    .products-section .product-panel:hover .product-description {
        position: absolute !important;
        top: auto !important;
        bottom: 0 !important;
        left: 0 !important;
        right: 0 !important;
        min-height: 170px !important;
        max-height: 70% !important;
        overflow: hidden !important;
        background: rgba(255, 255, 255, 0.97) !important;
        border-top: 1px solid var(--border-color) !important;
        justify-content: flex-start !important;
        align-items: flex-start !important;
        text-align: left !important;
        padding: 1.2rem 1.2rem !important;
        gap: 0.5rem !important;
        transition: background 0.3s ease !important;
    }

    /* Texte complet au survol (retire le clamp) */
    .products-section .product-panel:hover .product-description .description p {
        -webkit-line-clamp: unset !important;
        overflow: visible !important;
        margin-bottom: 0.4rem;
    }

    .products-section .product-panel:hover .product-description h3 {
        margin-bottom: 0.3rem;
        
    }
}

/* ============================================================
   PAGES PRÉSENTATION & TOURISME WINERY
   ============================================================ */

/* Image de présentation : encadré arrondi, hauteur fixe
   Rayon : modifier border-radius ci-dessous
   Hauteur : modifier height ci-dessous */
.presentation-photo-panel {
    border-radius: 0 !important;
    overflow: hidden !important;
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.08);
    max-width: 1400px;
    margin-left: auto !important;
    margin-right: auto !important;
    min-height: 0 !important;
    height: 720px !important;
    padding: 0 !important;
}

/* L'image cover est absolute et remplit le panel — le panel fixe la hauteur */
.presentation-photo-panel .brand-image.cover {
    position: absolute !important;
    top: 0 !important;
    left: 0 !important;
    width: 100% !important;
    height: 100% !important;
}

/* Texte long (> 400 car.) sur 2 colonnes
   Seuil : modifier dans winery_presentation.php / winery_tourism.php */
@media (min-width: 768px) {
    .presentation-section .presentation.text-long {
        columns: 2 280px;
        column-gap: 3rem;
        text-align: left;
    }
}

/* ============================================================
   NAVIGATION TRANSPARENTE SUR HERO
   Le header est déjà position:fixed. On retire le fond blanc
   et on supprime le padding-top du content-wrapper pour que
   le hero remonte sous la nav.
   ============================================================ */

/* Header transparent */
body.hero-has-image .header-wrapper {
    background: transparent !important;
    border-bottom: none !important;
    box-shadow: none !important;
}

/* Supprimer le padding-top de compensation (la nav est overlay, pas dans le flux) */
body.hero-has-image #content-wrapper {
    padding-top: 0 !important;
}

/* Hero pleine hauteur viewport */
body.hero-has-image .hero-parallax-section .parallax-wrapper,
body.hero-has-image .parallax-section.hero-parallax-section .parallax-wrapper {
    height: 100vh !important;
    max-height: none !important;
    margin-top: 0 !important;
}

/* Transition de hauteur/fond pour le header */
.header-wrapper {
    transition: background 0.3s ease, height 0.3s ease, border-color 0.3s ease !important;
}

/* Burger bars → blanc sur hero */
body.hero-has-image .burger-bar {
    background: #fff;
    transition: background 0.3s ease, transform 0.35s ease, opacity 0.35s ease;
}

/* Logo texte → blanc sur hero */
body.hero-has-image .header-logo-text {
    color: #fff;
    transition: color 0.3s ease;
}

/* Par défaut : logo normal visible, logo invert caché */
.header-logo .logo .logo-invert { display: none; }
.header-logo .logo .logo-normal { display: block; }

/* Sur hero transparent : logo invert visible (si dispo), sinon filtre CSS */
body.hero-has-image .header-logo .logo .logo-invert[src] { display: block; }
body.hero-has-image .header-logo .logo .logo-normal { display: none; }

/* Si pas de logo invert (src vide) : filtre CSS sur logo normal en fallback */
body.hero-has-image .header-logo .logo .logo-invert:not([src]),
body.hero-has-image .header-logo .logo .logo-invert[src=""] {
    display: none;
}
body.hero-has-image .header-logo .logo:has(.logo-invert[src=""]) .logo-normal,
body.hero-has-image .header-logo .logo:has(.logo-invert:not([src])) .logo-normal {
    display: block;
    filter: brightness(0) invert(1);
}

/* Liens langue → blanc sur hero */
body.hero-has-image .header-languagues .btn {
    color: #fff !important;
    border-bottom-color: #fff !important;
}

/* --- État scrollé : retour au fond blanc, hauteur réduite --- */
body.header-scrolled .header-wrapper {
    background: #fff !important;
    border-bottom: 1px solid var(--border-color) !important;
    height: 68px !important;
}

body.header-scrolled .burger-bar {
    background: #1a1a1a !important;
}

body.header-scrolled .header-logo .logo .logo-invert { display: none !important; }
body.header-scrolled .header-logo .logo .logo-normal { display: block !important; filter: none !important; }

body.header-scrolled .header-logo-text {
    color: #1a1a1a !important;
}

body.header-scrolled .header-languagues .btn {
    color: #1a1a1a !important;
    border-bottom-color: #1a1a1a !important;
}

/* --- Menu ouvert : toujours en couleur normale --- */
body.hero-has-image.menu-open .burger-bar {
    background: #1a1a1a !important;
}

body.hero-has-image.menu-open .header-logo .logo .logo-invert { display: none !important; }
body.hero-has-image.menu-open .header-logo .logo .logo-normal { display: block !important; filter: none !important; }

body.hero-has-image.menu-open .header-languagues .btn {
    color: #1a1a1a !important;
    border-bottom-color: #1a1a1a !important;
}

/* ============================================================
   PAGE VIN (wine.tpl)
   ============================================================ */

/* --- 1. Séparation des sections : trait fin + respiration verticale --- */
.product-hero-section ~ .content-section {
    border-top: 1px solid var(--border-color);
    padding-top: 4rem;
    padding-bottom: 1rem;
    margin-bottom: 0;
}

/* --- 2. Rythme des titres h2 : accent court sous chaque titre --- */
.presentation-section h2,
.reviews-section h2 {
    font-size: 1rem;
    letter-spacing: 0.18em;
    text-transform: uppercase;
    font-weight: 500;
    color: #1a1a1a;
    margin-bottom: 1.2rem;
}

.presentation-section h2::after,
.reviews-section h2::after {
    content: '';
    display: block;
    width: 32px;
    height: 1px;
    background: #1a1a1a;
    margin-top: 0.5rem;
}

/* --- 3. Fiche technique : cépages + specs — typographie seule, sans fond ni cadre ---
   Séparation par filet haut et espacement vertical */
#infos .row {
    margin-left: 0;
    margin-right: 0;
    margin-top: 3rem;
    background: none;
    border: none;
    padding: 0;
    gap: 0;
}

#infos .row .col-sm {
    padding: 1.5rem 3rem 1.5rem 0;
    border-top: 1.5px solid var(--border-color);
}

#infos .row .col-sm + .col-sm {
    border-left: none;
    padding-left: 3rem;
}

@media (max-width: 767px) {
    #infos .row .col-sm + .col-sm {
        padding-left: 0;
        margin-top: 1.5rem;
    }
}

#infos .row h2 {
    font-size: 0.72rem;
    letter-spacing: 0.28em;
    text-transform: uppercase;
    color: #999;
    font-weight: 400;
    margin-bottom: 1rem;
}

/* Pas d'accent sous les h2 de la fiche technique */
#infos .row h2::after {
    display: none;
}

#infos .row p {
    font-size: 1.4rem;
    line-height: 2;
    color: #1a1a1a;
    margin-bottom: 0;
}

/* Texte long sur 2 colonnes, les courts restent pleine largeur */
/* 2. Infos vin : texte long (> 400 car.) sur 2 colonnes, les courts restent pleine largeur
   Seuil : modifier dans wine.php (strlen > 400)
   Espacement : modifier column-gap ci-dessous */
@media (min-width: 768px) {
    #infos .presentation p.text-long,
    #advice p.text-long {
        columns: 2;
        column-gap: 3rem;
    }
}

/* 1. Hero : bords arrondis sur la zone image uniquement */
.product-hero-section .product-panel .product-image {
    border-radius: 0;
    overflow: hidden;
    /*box-shadow: 0 4px 20px rgba(0, 0, 0, 0.08);*/
}

/* 3. Médias : la vraie carte est le <a> dans .media-panel */
.medias-section .media-panel a {
    border-radius: 0 !important;
    overflow: hidden;
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.08);
}

@media (hover: hover) {
    .medias-section .media-panel a {
        transition: transform 0.3s ease, box-shadow 0.3s ease;
    }
    .medias-section .media-panel a:hover {
        transform: translateY(-6px);
        box-shadow: 0 12px 36px rgba(0, 0, 0, 0.15);
    }
}

/* 4. Reviews : arrondis + ombre (retire le style inline) */
.reviews-section .review-panel {
    border-radius: 0 !important;
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.08);
    overflow: hidden;
}

/* 5. Recettes : cards arrondis + ombre + survol */
.recipe-panel {
    border-radius: 1.5rem;
    overflow: hidden;
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.08);
}

@media (hover: hover) {
    .recipe-panel {
        transition: transform 0.3s ease, box-shadow 0.3s ease;
    }
    .recipe-panel:hover {
        transform: translateY(-6px);
        box-shadow: 0 12px 36px rgba(0, 0, 0, 0.15);
    }
}

/* ============================================================
   DARK MODE OVERRIDES — style-more.css
   ============================================================ */

/* Menu search */
[data-theme='dark'] .menu-search-form {
    border-color: var(--border-color);
    background-color: var(--body-bg-color);
}
[data-theme='dark'] .menu-search-input {
    color: var(--body-text-color);
    background-color: var(--body-bg-color);
}
[data-theme='dark'] .menu-search-button {
    background-color: var(--body-bg-color);
}
[data-theme='dark'] .menu-search-button i {
    color: var(--body-text-color);
}

/* Footer services */
[data-theme='dark'] .footer-services-title {
    color: var(--body-text-color);
    border-bottom-color: var(--border-color);
}
[data-theme='dark'] .footer-services-list li {
    border-bottom-color: var(--border-color);
}
[data-theme='dark'] .footer-service-item {
    color: var(--body-text-color) !important;
}
[data-theme='dark'] .footer-service-item i {
    color: var(--body-text-color);
}

/* Burger + header texte */
[data-theme='dark'] .burger-bar {
    background: var(--body-text-color);
}
[data-theme='dark'] .header-logo-text {
    color: var(--body-text-color);
}

/* Header scrollé en dark mode */
[data-theme='dark'] body.header-scrolled .header-wrapper {
    background: var(--nav-bg-color) !important;
    border-bottom-color: var(--border-color) !important;
}
[data-theme='dark'] body.header-scrolled .burger-bar {
    background: var(--nav-text-color) !important;
}
[data-theme='dark'] body.header-scrolled .header-logo-text {
    color: var(--nav-text-color) !important;
}
[data-theme='dark'] body.header-scrolled .header-languagues .btn {
    color: var(--nav-text-color) !important;
    border-bottom-color: var(--nav-text-color) !important;
}

/* Menu drawer liens */
[data-theme='dark'] .menu-wrapper .main-menu a {
    color: var(--body-text-color);
}

/* Typographie globale (body + headings sont surchargés ici avec du hardcodé) */
[data-theme='dark'] body {
    color: var(--body-text-color);
}
[data-theme='dark'] h1,
[data-theme='dark'] h2,
[data-theme='dark'] h3,
[data-theme='dark'] h4,
[data-theme='dark'] h5,
[data-theme='dark'] h6 {
    color: var(--body-title-color);
}

/* Boutons texte */
[data-theme='dark'] .btn {
    border-bottom-color: var(--body-text-color) !important;
    color: var(--body-text-color) !important;
}
[data-theme='dark'] .btn:hover {
    color: var(--body-text-color) !important;
}
[data-theme='dark'] .btn.dropdown-toggle:not(.header-languagues .btn) {
    border-color: var(--body-text-color) !important;
}

/* Cards gammes (brands-section) */
[data-theme='dark'] .brands-section .brand-panel {
    border-color: var(--border-color);
        background: var(--body-bg-color);
}
[data-theme='dark'] .brands-section .brand-image.contain {
    /*background: var(--body-bg-color);*/
    background:white;
}
[data-theme='dark'] .brands-section .brand-description {
    background: var(--body-bg-color);
}
[data-theme='dark'] .brands-section .brand-description h3 {
    color: var(--body-text-color);
}
[data-theme='dark'] .brands-section .brand-description .description {
    color: var(--body-text-color);
}
[data-theme='dark'] .brands-section .brand-image.cover + .brand-description,
[data-theme='dark'] .brands-section .brand-panel .brand-image.cover + .brand-description h1,
[data-theme='dark'] .brands-section .brand-panel .brand-image.cover + .brand-description h2,
[data-theme='dark'] .brands-section .brand-panel .brand-image.cover + .brand-description h3 {
    color: var(--body-text-color);
}

/* Cards vins (products-section) */
[data-theme='dark'] .products-section .product-panel {
    background: var(--body-bg-color);
    border-color: var(--border-color);
}
[data-theme='dark'] .products-section .product-panel .product-image {
    background: var(--body-bg-color);
}
[data-theme='dark'] .products-section .product-panel .product-description {
    background: var(--body-bg-color);
}
[data-theme='dark'] .products-section .product-panel:hover .product-description {
    background: rgba(29, 30, 32, 0.97) !important;
    border-top-color: var(--border-color) !important;
}

/* Page vin — titres de section + accent */
[data-theme='dark'] .presentation-section h2,
[data-theme='dark'] .reviews-section h2 {
    color: var(--body-text-color);
}
[data-theme='dark'] .presentation-section h2::after,
[data-theme='dark'] .reviews-section h2::after {
    background: var(--border-color);
}

/* Page vin — fiche technique */
[data-theme='dark'] #infos .row .col-sm {
    border-top-color: var(--border-color);
}
[data-theme='dark'] #infos .row p {
    color: var(--body-text-color);
}
