/*
Theme Name: Kadence Child Génestine
Theme URI: https://TO_CONFIGURE
Description: Thème enfant Kadence pour Liqueurs Génestine — distillerie artisanale auvergnate
Author: TO_CONFIGURE
Template: kadence
Version: 1.2.0
Text Domain: kadence-child-genestine
*/

/* =============================================================================
   1. VARIABLES & DESIGN TOKENS
   ============================================================================= */
:root {
    /* Palette — alignée avec theme.json et les maquettes */
    --color-vert:        #2D5016;
    --color-vert-fonce:  #1C3A0F;
    --color-or:          #C9A84C;
    --color-or-fonce:    #9E7A28;
    --color-creme:       #F5F0E8;
    --color-creme-fonce: #EBE4D4;
    --color-sombre:      #1A1A1A;
    --color-gris:        #6B6B6B;
    --color-blanc:       #FFFFFF;

    /* Wallpaper — fond décoratif pour zones claires */
    --wallpaper: url('https://www.liqueurs-genestine.fr/img/FOND-WALLPAPAERhome.png');

    /* Typographie */
    --font-titre:   'OldAlfie',          'Georgia',      serif;
    --font-heading: 'Cormorant Garamond','Georgia',      serif;
    --font-ui:      'Concept',           'Arial Narrow', sans-serif;
    --font-corps:   'Cormorant Garamond','Georgia',      serif;
    --font-accent:  'MinionPro',         'Georgia',      serif;

    /* Misc */
    --transition: 0.22s ease;
    --shadow-sm:  0 2px 8px  rgba(0,0,0,0.07);
    --shadow-md:  0 4px 20px rgba(0,0,0,0.10);
    --shadow-lg:  0 8px 40px rgba(0,0,0,0.14);
}

/* =============================================================================
   2. BASE
   ============================================================================= */
*, *::before, *::after {
    box-sizing: border-box;
}

body {
    font-family: var(--font-corps);
    font-size: 1.0625rem;
    line-height: 1.75;
    color: var(--color-sombre);
    background-color: var(--color-creme);
    background-image: var(--wallpaper);
    background-repeat: repeat;
}

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

a {
    color: var(--color-vert);
    text-decoration: none;
    transition: color var(--transition);
}
a:hover { color: var(--color-or-fonce); }

/* Conteneur principal transparent pour laisser voir le wallpaper body */
.wp-site-blocks,
.is-root-container,
.entry-content,
.site-main,
#main {
    background: transparent;
}

/* =============================================================================
   3. TYPOGRAPHIE
   ============================================================================= */
h1,
.genestine-h1 {
    font-family: var(--font-titre);
    font-size: clamp(2.25rem, 4vw, 3.5rem);
    font-weight: 400;
    line-height: 1.1;
    letter-spacing: 0.02em;
    color: var(--color-sombre);
}

h2, h3, h4, h5, h6,
.wp-block-heading {
    font-family: var(--font-heading);
    font-weight: 400;
    line-height: 1.25;
    color: var(--color-sombre);
}

h2, .genestine-h2 { font-size: clamp(1.75rem, 2.5vw, 2.5rem); }
h3, .genestine-h3 { font-size: clamp(1.25rem, 1.75vw, 1.5rem); }
h4 { font-size: 1.125rem; }

/* Label surtitre — petites capitales dorées */
.genestine-label {
    display: block;
    font-family: var(--font-ui);
    font-size: 0.6875rem;
    font-weight: 500;
    letter-spacing: 0.25em;
    text-transform: uppercase;
    color: var(--color-or);
    margin-bottom: 0.75rem;
}

/* Séparateur doré */
.genestine-divider {
    width: 3rem;
    height: 2px;
    background: var(--color-or);
    margin: 1.25rem 0;
}
.genestine-divider--center {
    margin-left: auto;
    margin-right: auto;
}

/* Citation / accroche */
.genestine-accroche,
blockquote p {
    font-family: var(--font-accent);
    font-style: italic;
    font-size: 1.0625rem;
    line-height: 1.75;
    color: var(--color-sombre);
}

blockquote {
    border-left: 3px solid var(--color-or);
    padding-left: 1.5rem;
    margin: 1.5rem 0;
}

/* =============================================================================
   4. LAYOUT
   ============================================================================= */
.genestine-container {
    max-width: 1200px;
    margin: 0 auto;
    padding: 0 2rem;
}

.genestine-section {
    padding: 5rem 0;
}

/* Grilles utilitaires */
.genestine-grid-2 { display: grid; grid-template-columns: 1fr 1fr; gap: 3rem; }
.genestine-grid-3 { display: grid; grid-template-columns: repeat(3, 1fr); gap: 2rem; }
.genestine-grid-4 { display: grid; grid-template-columns: repeat(4, 1fr); gap: 1.5rem; }

@media (max-width: 1023px) {
    .genestine-grid-4 { grid-template-columns: repeat(2, 1fr); }
    .genestine-grid-3 { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 599px) {
    .genestine-grid-4,
    .genestine-grid-3,
    .genestine-grid-2 { grid-template-columns: 1fr; }
}

/* =============================================================================
   5. BACKGROUNDS / ZONES
   ============================================================================= */

/* Zone claire avec wallpaper */
.genestine-bg-light {
    background-color: var(--color-creme);
    background-image: var(--wallpaper);
    background-repeat: repeat;
}

/* Zone mi-claire (sans wallpaper) */
.genestine-bg-mid {
    background-color: var(--color-creme-fonce);
}

/* Zone sombre */
.genestine-bg-dark {
    background: var(--color-sombre);
    color: var(--color-blanc);
}
.genestine-bg-dark h1,
.genestine-bg-dark h2,
.genestine-bg-dark h3 { color: var(--color-blanc); }

/* Zone verte */
.genestine-bg-vert {
    background: var(--color-vert);
    color: var(--color-blanc);
}
.genestine-bg-vert h1,
.genestine-bg-vert h2,
.genestine-bg-vert h3 { color: var(--color-blanc); }

/* Hero bannière (pages intérieures — image en fond) */
.genestine-hero-banner {
    background-image: url('https://www.liqueurs-genestine.fr/img/FOND-WALLPAPAERhome.png'); /* sera remplacé page par page */
    background-size: cover;
    background-position: center;
    position: relative;
    overflow: hidden;
    text-align: center;
    padding: 5rem 0 4rem;
}

.genestine-hero-banner::before {
    content: '';
    position: absolute;
    inset: 0;
    background: rgba(26,26,26,0.18);
    pointer-events: none;
}

.genestine-hero-banner > .genestine-container,
.genestine-hero-banner > .genestine-hero-content {
    position: relative;
    z-index: 1;
}

.genestine-hero-banner h1 {
    color: var(--color-blanc);
    font-size: clamp(2rem, 4vw, 3.25rem);
    margin-bottom: 0.75rem;
}

.genestine-hero-banner p {
    color: rgba(255,255,255,0.75);
    max-width: 560px;
    margin: 0 auto;
    font-size: 1rem;
}

.genestine-hero-banner .genestine-divider {
    margin: 1.5rem auto;
}

/* =============================================================================
   6. BOUTONS
   ============================================================================= */
.genestine-btn,
.wp-block-button__link,
.woocommerce a.button,
.woocommerce button.button,
.woocommerce input[type="submit"] {
    display: inline-block;
    padding: 0.875rem 2rem;
    font-family: var(--font-ui);
    font-size: 0.8125rem;
    font-weight: 700;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    text-decoration: none;
    border: 2px solid transparent;
    border-radius: 0;
    cursor: pointer;
    transition: all var(--transition);
    line-height: 1;
}

/* Primaire vert */
.genestine-btn,
.genestine-btn--primary,
.wp-block-button:not(.is-style-outline) .wp-block-button__link,
.woocommerce a.button,
.woocommerce button.button.alt,
.woocommerce input[type="submit"] {
    background: var(--color-vert);
    color: var(--color-blanc);
    border-color: var(--color-vert);
}
.genestine-btn:hover,
.genestine-btn--primary:hover,
.wp-block-button:not(.is-style-outline) .wp-block-button__link:hover,
.woocommerce a.button:hover,
.woocommerce button.button.alt:hover {
    background: var(--color-vert-fonce);
    border-color: var(--color-vert-fonce);
    color: var(--color-blanc);
}

/* Or / outline doré */
.genestine-btn--gold {
    background: transparent;
    color: var(--color-or);
    border-color: var(--color-or);
}
.genestine-btn--gold:hover {
    background: var(--color-or);
    color: var(--color-sombre);
}

/* Outline sombre */
.genestine-btn--outline,
.wp-block-button.is-style-outline .wp-block-button__link {
    background: transparent;
    color: var(--color-vert);
    border-color: var(--color-vert);
}
.genestine-btn--outline:hover,
.wp-block-button.is-style-outline .wp-block-button__link:hover {
    background: var(--color-vert);
    color: var(--color-blanc);
}

/* Bouton blanc (sur fond sombre/vert) */
.genestine-btn--white {
    background: transparent;
    color: var(--color-blanc);
    border-color: var(--color-blanc);
}
.genestine-btn--white:hover {
    background: var(--color-blanc);
    color: var(--color-sombre);
}

/* =============================================================================
   7. HEADER — zone logo (wallpaper clair)
   ============================================================================= */
.site-header,
#masthead {
    background-color: var(--color-creme);
    background-image: var(--wallpaper);
    background-repeat: repeat;
    border-bottom: none;
    box-shadow: var(--shadow-md);
    position: sticky;
    top: 0;
    z-index: 1000;
}

.header-top-wrap,
.header-top,
.kadence-header-row-top,
.header-row-top {
    background-color: var(--color-creme);
    background-image: var(--wallpaper);
    background-repeat: repeat;
    padding: 14px 0 8px;
    display: flex;
    justify-content: center;
    align-items: center;
}

/* Logo */
.site-branding,
.header-branding,
.kadence-site-branding {
    display: flex;
    justify-content: center;
    align-items: center;
}

.site-branding img,
.custom-logo,
.header-branding img,
.kadence-site-logo img {
    max-height: 70px;
    width: auto;
    display: block;
    mix-blend-mode: multiply; /* supprime le fond blanc du PNG */
}

.site-title,
.site-description { display: none; }

/* =============================================================================
   8. HEADER — barre de navigation (fond vert)
   ============================================================================= */
.header-main-wrap,
.header-main,
.header-bottom-wrap,
.header-bottom,
.kadence-header-row-main,
.header-row-main {
    background: var(--color-vert);
    border-top: none;
}

#site-navigation,
.main-navigation,
.header-navigation,
.kadence-navigation {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 100%;
}

#site-navigation ul.menu,
.main-navigation ul.menu,
.header-navigation ul.menu,
.kadence-navigation ul.menu,
#site-navigation .nav--toggle-sub {
    display: flex;
    justify-content: center;
    align-items: center;
    list-style: none;
    margin: 0;
    padding: 0;
    gap: 0;
}

/* Liens */
#site-navigation ul.menu > li > a,
.main-navigation ul.menu > li > a,
.header-navigation ul.menu > li > a,
.kadence-navigation ul.menu > li > a {
    font-family: var(--font-ui);
    font-size: 0.75rem;
    font-weight: 500;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: rgba(255,255,255,0.85);
    padding: 0.875rem 1.0625rem;
    display: block;
    text-decoration: none;
    white-space: nowrap;
    transition: color var(--transition);
}

#site-navigation ul.menu > li > a:hover,
.main-navigation ul.menu > li > a:hover,
.header-navigation ul.menu > li > a:hover,
.kadence-navigation ul.menu > li > a:hover {
    color: var(--color-or);
}

#site-navigation ul.menu > li.current-menu-item > a,
#site-navigation ul.menu > li.current-menu-ancestor > a,
.main-navigation ul.menu > li.current-menu-item > a {
    color: var(--color-or);
}

/* Sous-menus */
#site-navigation ul.menu ul,
.main-navigation ul.menu ul,
.header-navigation ul.menu ul,
.kadence-navigation ul.menu ul {
    position: absolute;
    top: 100%;
    left: 0;
    background: var(--color-vert-fonce);
    border-top: 2px solid var(--color-or);
    border-bottom: none;
    box-shadow: var(--shadow-lg);
    min-width: 210px;
    z-index: 999;
    list-style: none;
    margin: 0;
    padding: 0.5rem 0;
    opacity: 0;
    visibility: hidden;
    transform: translateY(4px);
    transition: opacity var(--transition), transform var(--transition), visibility var(--transition);
}

#site-navigation ul.menu li:hover > ul,
.main-navigation ul.menu li:hover > ul,
.header-navigation ul.menu li:hover > ul {
    opacity: 1;
    visibility: visible;
    transform: translateY(0);
}

#site-navigation ul.menu ul li a,
.main-navigation ul.menu ul li a,
.header-navigation ul.menu ul li a {
    font-family: var(--font-ui);
    font-size: 0.8125rem;
    font-weight: 400;
    letter-spacing: 0.04em;
    text-transform: none;
    color: rgba(255,255,255,0.85);
    padding: 0.625rem 1.25rem;
    display: block;
    text-decoration: none;
    transition: color var(--transition), background var(--transition);
}

#site-navigation ul.menu ul li a:hover,
.main-navigation ul.menu ul li a:hover,
.header-navigation ul.menu ul li a:hover {
    color: var(--color-or);
    background: rgba(255,255,255,0.05);
}

#site-navigation ul.menu > li,
.main-navigation ul.menu > li { position: relative; }

/* CTA "Commander →" */
.genestine-cta-item { margin-left: 0.75rem; }

.genestine-header-cta {
    display: inline-block !important;
    background: transparent !important;
    color: var(--color-or) !important;
    font-family: var(--font-ui) !important;
    font-size: 0.6875rem !important;
    font-weight: 700 !important;
    letter-spacing: 0.12em !important;
    text-transform: uppercase !important;
    padding: 0.375rem 1rem !important;
    text-decoration: none !important;
    border: 1px solid var(--color-or) !important;
    transition: all var(--transition) !important;
    white-space: nowrap;
}

.genestine-header-cta:hover {
    background: var(--color-or) !important;
    color: var(--color-vert) !important;
}

/* =============================================================================
   9. HEADER MOBILE
   ============================================================================= */
@media (max-width: 1023px) {

    #site-navigation ul.menu,
    .main-navigation ul.menu,
    .header-navigation,
    .kadence-navigation {
        display: none;
    }

    .header-main-wrap,
    .header-main,
    .header-bottom-wrap {
        background: var(--color-vert);
        border-top: none;
    }

    .menu-toggle,
    .kadence-menu-toggle-open,
    button.menu-toggle {
        display: flex !important;
        align-items: center;
        gap: 8px;
        background: transparent;
        border: 1px solid rgba(255,255,255,0.4);
        color: var(--color-blanc);
        font-family: var(--font-ui);
        font-size: 0.65rem;
        letter-spacing: 0.12em;
        text-transform: uppercase;
        padding: 8px 14px;
        cursor: pointer;
        position: absolute;
        right: 1rem;
        top: 50%;
        transform: translateY(-50%);
        transition: all var(--transition);
    }

    .menu-toggle:hover,
    .kadence-menu-toggle-open:hover {
        border-color: var(--color-or);
        color: var(--color-or);
    }

    #site-navigation.toggled ul.menu,
    .main-navigation.toggled ul.menu,
    .mobile-navigation {
        display: flex !important;
        flex-direction: column;
        width: 100%;
        background: var(--color-vert);
        padding: 0;
    }

    #site-navigation.toggled ul.menu > li > a,
    .main-navigation.toggled ul.menu > li > a {
        padding: 0.875rem 1.5rem;
        font-size: 0.8125rem;
        border-bottom: 1px solid rgba(255,255,255,0.08);
        color: rgba(255,255,255,0.85);
    }

    .genestine-cta-item {
        margin: 0.75rem 1.5rem;
    }

    .genestine-header-cta {
        display: block !important;
        text-align: center !important;
        padding: 0.75rem 1.5rem !important;
    }
}

@media (max-width: 479px) {
    .site-branding img,
    .custom-logo { max-height: 54px; }
}

/* =============================================================================
   10. FOOTER
   ============================================================================= */
.site-footer,
#colophon {
    background: #111111;
    color: rgba(255,255,255,0.55);
    font-family: var(--font-corps);
    font-size: 0.8125rem;
    line-height: 1.6;
}

.site-footer a {
    color: rgba(255,255,255,0.5);
    text-decoration: none;
    transition: color var(--transition);
}
.site-footer a:hover { color: var(--color-or); }

.genestine-footer-grid {
    display: grid;
    grid-template-columns: 2fr 1fr 1fr 1fr;
    gap: 3rem;
    padding: 4rem 0 2rem;
}

.genestine-footer-bottom {
    padding: 2rem 0;
    border-top: 1px solid rgba(255,255,255,0.07);
    display: flex;
    justify-content: space-between;
    align-items: center;
    font-size: 0.75rem;
    flex-wrap: wrap;
    gap: 0.5rem;
}

.genestine-footer-logo {
    max-height: 44px;
    filter: brightness(0) invert(1) opacity(0.85);
    margin-bottom: 1.25rem;
}

@media (max-width: 1023px) {
    .genestine-footer-grid { grid-template-columns: 1fr 1fr; gap: 2rem; }
}
@media (max-width: 599px) {
    .genestine-footer-grid { grid-template-columns: 1fr; }
    .genestine-footer-bottom { flex-direction: column; text-align: center; }
}

/* =============================================================================
   11. CARTES PRODUIT (CPT produit)
   ============================================================================= */
.genestine-produit-card {
    background: var(--color-blanc);
    overflow: hidden;
    transition: transform 0.3s ease, box-shadow 0.3s ease;
}

.genestine-produit-card:hover {
    transform: translateY(-4px);
    box-shadow: var(--shadow-lg);
}

.genestine-produit-card__image {
    aspect-ratio: 3 / 4;
    overflow: hidden;
    position: relative;
}

.genestine-produit-card__image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 0.4s ease;
}

.genestine-produit-card:hover .genestine-produit-card__image img {
    transform: scale(1.03);
}

.genestine-produit-card__badge {
    position: absolute;
    top: 0.875rem;
    right: 0.875rem;
    font-family: var(--font-ui);
    font-size: 0.625rem;
    font-weight: 700;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    padding: 0.25rem 0.625rem;
    background: var(--color-or);
    color: var(--color-sombre);
}

.genestine-produit-card__body {
    padding: 1.25rem 1.25rem 1.5rem;
}

.genestine-produit-card__cat {
    font-family: var(--font-ui);
    font-size: 0.625rem;
    font-weight: 600;
    letter-spacing: 0.15em;
    text-transform: uppercase;
    color: var(--color-or-fonce);
    margin-bottom: 0.375rem;
    display: block;
}

.genestine-produit-card__title {
    font-family: var(--font-heading);
    font-size: 1.125rem;
    font-weight: 400;
    margin-bottom: 0.5rem;
    color: var(--color-sombre);
}

.genestine-produit-card__desc {
    font-size: 0.875rem;
    color: var(--color-gris);
    line-height: 1.6;
    margin-bottom: 1rem;
}

.genestine-produit-card__footer {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding-top: 0.875rem;
    border-top: 1px solid var(--color-creme-fonce);
}

.genestine-produit-card__meta {
    font-family: var(--font-ui);
    font-size: 0.75rem;
    color: var(--color-gris);
}
.genestine-produit-card__meta strong { color: var(--color-sombre); }

.genestine-produit-card__price {
    font-family: var(--font-heading);
    font-size: 1.125rem;
    font-weight: 600;
    color: var(--color-vert);
}

.genestine-produit-card__link {
    display: block;
    margin-top: 0.875rem;
    text-align: center;
    font-family: var(--font-ui);
    font-size: 0.75rem;
    font-weight: 600;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    color: var(--color-vert);
    padding: 0.5rem;
    border: 1px solid var(--color-creme-fonce);
    transition: all var(--transition);
}
.genestine-produit-card__link:hover {
    background: var(--color-vert);
    color: var(--color-blanc);
    border-color: var(--color-vert);
}

/* =============================================================================
   12. WOOCOMMERCE — overrides de base
   ============================================================================= */
.woocommerce-page .woocommerce {
    background: transparent;
}

.woocommerce ul.products li.product {
    background: var(--color-blanc);
}

.woocommerce ul.products li.product .woocommerce-loop-product__title {
    font-family: var(--font-heading);
    font-size: 1rem;
    color: var(--color-sombre);
}

.woocommerce .price {
    font-family: var(--font-heading);
    color: var(--color-vert);
}

.woocommerce .woocommerce-breadcrumb {
    font-family: var(--font-ui);
    font-size: 0.8125rem;
    color: var(--color-gris);
}

/* =============================================================================
   13. OVERRIDES KADENCE — haute spécificité
   ============================================================================= */

/* Header wallpaper */
.site-header,
#masthead {
    background-color: var(--color-creme) !important;
    background-image: var(--wallpaper) !important;
    background-repeat: repeat !important;
    border-bottom: none !important;
}

/* Ligne logo */
.site-header .header-top-wrap,
.site-header .kadence-header-row-top,
#masthead .header-top-wrap {
    background-color: var(--color-creme) !important;
    background-image: var(--wallpaper) !important;
    background-repeat: repeat !important;
}

/* Barre nav verte */
.site-header .header-main-wrap,
.site-header .header-bottom-wrap,
.site-header .kadence-header-row-main,
#masthead .header-main-wrap,
#masthead .header-bottom-wrap {
    background: var(--color-vert) !important;
    border-top: none !important;
}

/* Liens nav blancs sur vert */
.site-header .kadence-navigation-inner > ul > li > a,
.site-header .primary-menu > li > a,
.site-header nav > ul > li > a,
.site-header .menu > li > a {
    color: rgba(255,255,255,0.85) !important;
    font-family: var(--font-ui) !important;
    font-size: 0.75rem !important;
    letter-spacing: 0.08em !important;
    text-transform: uppercase !important;
    text-decoration: none !important;
}

.site-header .kadence-navigation-inner > ul > li > a:hover,
.site-header .primary-menu > li > a:hover,
.site-header nav > ul > li > a:hover,
.site-header .menu > li > a:hover,
.site-header .menu > li.current-menu-item > a,
.site-header .menu > li.current-menu-ancestor > a {
    color: var(--color-or) !important;
}

/* Sous-menus vert foncé */
.site-header .sub-menu,
.site-header ul.menu ul,
.site-header .kadence-navigation ul ul,
.site-header nav ul ul {
    background: var(--color-vert-fonce) !important;
    border-top: 2px solid var(--color-or) !important;
    border-left: none !important;
    border-right: none !important;
    border-bottom: none !important;
    box-shadow: var(--shadow-lg) !important;
}

.site-header .sub-menu li a,
.site-header ul.menu ul li a,
.site-header .kadence-navigation ul ul li a,
.site-header nav ul ul li a {
    color: rgba(255,255,255,0.85) !important;
    background: transparent !important;
    font-family: var(--font-ui) !important;
    font-size: 0.8125rem !important;
    text-transform: none !important;
    letter-spacing: 0.04em !important;
    padding: 0.625rem 1.25rem !important;
}

.site-header .sub-menu li a:hover,
.site-header ul.menu ul li a:hover,
.site-header nav ul ul li a:hover {
    color: var(--color-or) !important;
    background: rgba(255,255,255,0.05) !important;
}

/* =============================================================================
   14. MAIN WRAPPER — neutralise les contraintes Kadence sur le contenu
   ============================================================================= */
.genestine-main {
    width: 100% !important;
    max-width: none !important;
    padding: 0 !important;
    margin: 0 !important;
    overflow-x: hidden !important;
}

/* Conteneur Kadence — retire max-width et padding quand genestine est actif */
#primary:has(.genestine-main),
#content:has(.genestine-main),
.content-area:has(.genestine-main),
.site-main:has(.genestine-main) {
    padding: 0 !important;
    max-width: none !important;
    margin: 0 !important;
}

/* Fallback sans :has() — pages qui utilisent nos templates */
body.home #primary,
body.home #content,
body.home .content-area,
body.page-template-archive-produit #primary,
body.single-produit #primary,
body.page-template-page-visiter #primary {
    padding: 0 !important;
    max-width: none !important;
    margin: 0 !important;
}

/* Kadence "boxed" layout — retire la contrainte de largeur sur ces pages */
body.home .site,
body.home #page {
    max-width: none !important;
}

/* =============================================================================
   15. HERO — page d'accueil (plein écran)
   !important sur les propriétés critiques pour passer au-dessus de Kadence
   ============================================================================= */

/* Conteneur principal — doit occuper 100vh quelle que soit la section Kadence */
.genestine-hero {
    position: relative !important;
    min-height: 100vh !important;
    height: auto !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    text-align: center !important;
    overflow: hidden !important;
    /* Neutralise padding/margin Kadence sur section */
    padding: 0 !important;
    margin: 0 !important;
    max-width: none !important;
    width: 100% !important;
    box-sizing: border-box !important;
    /* Fond sombre de secours si l'image ne charge pas */
    background-color: var(--color-sombre) !important;
}

/* Image de fond — couvre tout le hero */
.genestine-hero__bg {
    position: absolute !important;
    top: 0 !important;
    left: 0 !important;
    right: 0 !important;
    bottom: 0 !important;
    width: 100% !important;
    height: 100% !important;
    background-size: cover !important;
    background-position: center 45% !important;
    background-repeat: no-repeat !important;
    filter: brightness(0.42) saturate(0.8) !important;
    z-index: 0 !important;
}

/* Dégradé sombre par-dessus l'image */
.genestine-hero__overlay {
    position: absolute !important;
    top: 0 !important;
    left: 0 !important;
    right: 0 !important;
    bottom: 0 !important;
    z-index: 1 !important;
    background: linear-gradient(
        to bottom,
        rgba(26,26,26,0.22) 0%,
        rgba(26,26,26,0.08) 50%,
        rgba(26,26,26,0.65) 100%
    ) !important;
}

/* Texte — au-dessus du fond et du dégradé */
.genestine-hero__content {
    position: relative !important;
    z-index: 2 !important;
    color: #ffffff !important;
    max-width: 820px !important;
    width: 100% !important;
    padding: 0 2rem !important;
    /* Neutralise le padding bloc WordPress/Kadence */
    margin-top: 0 !important;
    margin-bottom: 0 !important;
}

.genestine-hero__eyebrow {
    display: block !important;
    font-family: var(--font-ui) !important;
    font-size: 0.6875rem !important;
    font-weight: 500 !important;
    letter-spacing: 0.3em !important;
    text-transform: uppercase !important;
    color: var(--color-or) !important;
    margin-bottom: 1.5rem !important;
}

.genestine-hero__title {
    font-family: var(--font-titre) !important;
    font-size: clamp(2.5rem, 5vw, 4.25rem) !important;
    font-weight: 400 !important;
    line-height: 1.1 !important;
    color: #ffffff !important;
    margin-bottom: 1.5rem !important;
}

.genestine-hero__title em {
    font-style: italic !important;
    color: var(--color-or) !important;
}

.genestine-hero__subtitle {
    font-size: 1.0625rem !important;
    font-weight: 300 !important;
    color: rgba(255,255,255,0.78) !important;
    max-width: 520px !important;
    margin: 0 auto 2.5rem !important;
    line-height: 1.75 !important;
}

.genestine-hero__actions {
    display: flex !important;
    gap: 1rem !important;
    justify-content: center !important;
    flex-wrap: wrap !important;
}

.genestine-hero__scroll {
    position: absolute !important;
    bottom: 2.5rem !important;
    left: 50% !important;
    transform: translateX(-50%) !important;
    color: rgba(255,255,255,0.35) !important;
    font-family: var(--font-ui) !important;
    font-size: 0.65rem !important;
    letter-spacing: 0.25em !important;
    text-transform: uppercase !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    gap: 0.5rem !important;
    z-index: 2 !important;
}

.genestine-hero__scroll::after {
    content: '';
    display: block;
    width: 1px;
    height: 42px;
    background: linear-gradient(to bottom, rgba(201,168,76,0.5), transparent);
}

/* =============================================================================
   16. HISTOIRE — section 2 colonnes (accueil)
   ============================================================================= */
.genestine-histoire {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 5rem;
    align-items: center;
}

.genestine-histoire__image {
    position: relative;
}

.genestine-histoire__deco {
    position: absolute;
    top: -1.5rem; left: -1.5rem;
    right: 1.5rem; bottom: 1.5rem;
    border: 2px solid var(--color-or);
    opacity: 0.25;
    pointer-events: none;
}

.genestine-histoire__frame {
    aspect-ratio: 4 / 5;
    background-size: cover;
    background-position: center;
}

.genestine-histoire__content h2 {
    font-size: clamp(1.75rem, 2.5vw, 2.5rem);
    margin-bottom: 1rem;
}

.genestine-histoire__content p {
    margin-bottom: 1rem;
}

.genestine-histoire__content .genestine-btn {
    margin-top: 1rem;
}

@media (max-width: 1023px) {
    .genestine-histoire {
        grid-template-columns: 1fr;
        gap: 2.5rem;
    }
    .genestine-histoire__image { order: -1; max-width: 440px; margin: 0 auto; width: 100%; }
}

/* =============================================================================
   17. SECTION HEADER — centré
   ============================================================================= */
.genestine-section-header {
    text-align: center;
    max-width: 680px;
    margin: 0 auto 3.5rem;
}

.genestine-section-header h2 {
    margin-bottom: 0.5rem;
}

.genestine-section-header p {
    color: var(--color-gris);
    font-size: 1rem;
    line-height: 1.7;
}

.genestine-bg-dark .genestine-section-header p {
    color: rgba(255,255,255,0.55);
}

.genestine-bg-vert .genestine-section-header p {
    color: rgba(255,255,255,0.78);
}

.genestine-section-cta {
    text-align: center;
    margin-top: 3rem;
}

/* =============================================================================
   18. PILIERS — section distillerie (accueil)
   ============================================================================= */
.genestine-pilier {
    text-align: center;
    padding: 2rem 1.5rem;
}

.genestine-pilier__icon {
    font-size: 2.25rem;
    margin-bottom: 1.25rem;
}

.genestine-pilier__title {
    font-family: var(--font-heading);
    font-size: 1.25rem;
    font-weight: 400;
    color: var(--color-or);
    margin-bottom: 0.75rem;
}

.genestine-pilier p {
    font-size: 0.9375rem;
    color: rgba(255,255,255,0.65);
    line-height: 1.7;
}

/* =============================================================================
   19. VISITES — grille 3 cartes (accueil + page visiter)
   ============================================================================= */
.genestine-visites-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 2rem;
    align-items: start;
}

.genestine-visite-card {
    background: var(--color-blanc);
    padding: 2rem;
    position: relative;
    border: 1px solid var(--color-creme-fonce);
    display: flex;
    flex-direction: column;
    gap: 1rem;
}

.genestine-visite-card--featured {
    border-color: var(--color-or);
    box-shadow: var(--shadow-md);
}

.genestine-visite-card__tag {
    position: absolute;
    top: -1px; right: 1.5rem;
    background: var(--color-or);
    color: var(--color-sombre);
    font-family: var(--font-ui);
    font-size: 0.625rem;
    font-weight: 700;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    padding: 0.25rem 0.75rem;
}

.genestine-visite-card__title {
    font-family: var(--font-heading);
    font-size: 1.25rem;
    font-weight: 400;
    color: var(--color-sombre);
}

.genestine-visite-card__duration {
    font-family: var(--font-ui);
    font-size: 0.8125rem;
    color: var(--color-gris);
}

.genestine-visite-card__features {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}

.genestine-visite-card__features li {
    font-size: 0.9375rem;
    padding-left: 1.25rem;
    position: relative;
    color: var(--color-sombre);
}

.genestine-visite-card__features li::before {
    content: '✓';
    position: absolute;
    left: 0;
    color: var(--color-vert);
    font-size: 0.75rem;
    top: 0.1em;
}

.genestine-visite-card__price {
    font-family: var(--font-heading);
    font-size: 1.75rem;
    font-weight: 600;
    color: var(--color-vert);
    margin-top: auto;
}

.genestine-visite-card__price span {
    font-size: 0.875rem;
    font-weight: 400;
    color: var(--color-gris);
}

@media (max-width: 1023px) {
    .genestine-visites-grid { grid-template-columns: 1fr; max-width: 520px; margin: 0 auto; }
}

/* =============================================================================
   20. GAMME — filtre & grille archive
   ============================================================================= */
.genestine-gamme-filtres {
    background: var(--color-creme-fonce);
    padding: 1.25rem 0;
    position: sticky;
    top: 0;
    z-index: 50;
}

.genestine-filtres-tabs {
    display: flex;
    gap: 0.25rem;
    flex-wrap: wrap;
    align-items: center;
}

.genestine-filtre-tab {
    font-family: var(--font-ui);
    font-size: 0.75rem;
    font-weight: 500;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    text-decoration: none;
    color: var(--color-gris);
    padding: 0.5rem 1.125rem;
    border: 1px solid transparent;
    transition: all var(--transition);
    display: inline-block;
}

.genestine-filtre-tab:hover,
.genestine-filtre-tab.is-active {
    color: var(--color-sombre);
    border-color: var(--color-sombre);
    background: transparent;
}

.genestine-filtre-tab.is-active {
    background: var(--color-sombre);
    color: var(--color-blanc);
}

.genestine-gamme-cat-title {
    font-family: var(--font-titre);
    font-size: clamp(1.5rem, 2vw, 2rem);
    font-weight: 400;
    color: var(--color-sombre);
    margin-bottom: 0.75rem;
    padding-bottom: 0.75rem;
    border-bottom: 1px solid var(--color-creme-fonce);
}

.genestine-gamme-cat-desc {
    color: var(--color-gris);
    font-size: 0.9375rem;
    margin-bottom: 2.5rem;
    max-width: 620px;
}

.genestine-gamme-section {
    padding-top: 3.5rem;
    padding-bottom: 3.5rem;
}

.genestine-no-result {
    text-align: center;
    color: var(--color-gris);
    font-size: 1rem;
    padding: 2rem 0;
}

/* Bannière verte (archive gamme) */
.genestine-banner-visite {
    text-align: center;
    padding: 4rem 0;
}

.genestine-banner-visite h2 {
    color: var(--color-blanc);
    margin-bottom: 0.75rem;
}

.genestine-banner-visite p {
    color: rgba(255,255,255,0.78);
    margin-bottom: 2rem;
    max-width: 560px;
    margin-left: auto;
    margin-right: auto;
}

/* =============================================================================
   21. HERO BANNER — pages intérieures (override section 5)
   ============================================================================= */
.genestine-hero-banner {
    background-size: cover;
    background-position: center 55%;
    position: relative;
    overflow: hidden;
    text-align: center;
    padding: 5rem 0 4rem;
}

.genestine-hero-banner::before {
    content: '';
    position: absolute;
    inset: 0;
    background: rgba(26,26,26,0.18);
    pointer-events: none;
}

.genestine-hero-banner__inner {
    position: relative;
    z-index: 1;
}

.genestine-hero-banner h1 {
    color: var(--color-blanc);
    font-size: clamp(2rem, 4vw, 3.25rem);
    margin-bottom: 0.75rem;
}

.genestine-hero-banner p {
    color: rgba(255,255,255,0.75);
    max-width: 560px;
    margin: 0 auto;
    font-size: 1rem;
}

/* =============================================================================
   22. BREADCRUMB
   ============================================================================= */
.genestine-breadcrumb {
    padding: 1.125rem 0;
}

.genestine-breadcrumb nav {
    font-family: var(--font-ui);
    font-size: 0.8125rem;
    color: var(--color-gris);
}

.genestine-breadcrumb a {
    color: var(--color-gris);
    text-decoration: none;
    transition: color var(--transition);
}

.genestine-breadcrumb a:hover {
    color: var(--color-vert);
}

.genestine-breadcrumb__current {
    color: var(--color-sombre);
}

/* =============================================================================
   23. FICHE PRODUIT — hero
   ============================================================================= */
.genestine-produit-hero__grid {
    display: grid;
    grid-template-columns: 1fr 1.25fr;
    gap: 4rem;
    align-items: start;
}

.genestine-produit-hero__img-frame {
    position: relative;
    border: 1px solid var(--color-creme-fonce);
    overflow: hidden;
}

.genestine-produit-hero__img-frame img {
    width: 100%;
    height: auto;
    display: block;
}

.genestine-produit-hero__img-placeholder {
    aspect-ratio: 3 / 4;
    background: var(--color-creme-fonce);
}

.genestine-produit-hero__cat {
    font-family: var(--font-ui);
    font-size: 0.75rem;
    font-weight: 600;
    letter-spacing: 0.15em;
    text-transform: uppercase;
    color: var(--color-or-fonce);
    margin-bottom: 0.5rem;
}

.genestine-produit-hero__title {
    font-size: clamp(2rem, 3vw, 3rem);
    margin-bottom: 0.5rem;
}

.genestine-produit-hero__subtitle {
    color: var(--color-gris);
    font-size: 1rem;
    margin-bottom: 1.5rem;
    font-style: italic;
}

/* Specs */
.genestine-produit-specs {
    display: flex;
    gap: 1.5rem;
    padding: 1.25rem 0;
    border-top: 1px solid var(--color-creme-fonce);
    border-bottom: 1px solid var(--color-creme-fonce);
    margin: 1.25rem 0;
}

.genestine-produit-spec__label {
    display: block;
    font-family: var(--font-ui);
    font-size: 0.625rem;
    font-weight: 600;
    letter-spacing: 0.15em;
    text-transform: uppercase;
    color: var(--color-gris);
    margin-bottom: 0.25rem;
}

.genestine-produit-spec__value {
    font-family: var(--font-heading);
    font-size: 1.25rem;
    font-weight: 600;
    color: var(--color-sombre);
}

/* Arômes */
.genestine-produit-aromes {
    margin-bottom: 1.5rem;
}

.genestine-produit-aromes__label {
    font-family: var(--font-ui);
    font-size: 0.6875rem;
    font-weight: 600;
    letter-spacing: 0.15em;
    text-transform: uppercase;
    color: var(--color-or-fonce);
    margin-bottom: 0.5rem;
}

.genestine-produit-aromes p {
    font-style: italic;
    color: var(--color-sombre);
    font-size: 0.9375rem;
    line-height: 1.75;
}

/* Achat */
.genestine-produit-achat {
    padding: 1.5rem;
    background: var(--color-creme-fonce);
    margin-top: 1.5rem;
}

.genestine-produit-achat__label {
    display: block;
    font-family: var(--font-ui);
    font-size: 0.625rem;
    font-weight: 600;
    letter-spacing: 0.15em;
    text-transform: uppercase;
    color: var(--color-gris);
    margin-bottom: 0.25rem;
}

.genestine-produit-achat__prix {
    font-family: var(--font-heading);
    font-size: 2.25rem;
    font-weight: 600;
    color: var(--color-vert);
    margin-bottom: 0.25rem;
}

.genestine-produit-achat__note {
    font-size: 0.8125rem;
    color: var(--color-gris);
    margin-bottom: 1.25rem;
}

.genestine-produit-achat__actions {
    display: flex;
    gap: 0.75rem;
    flex-wrap: wrap;
    margin-bottom: 1rem;
}

.genestine-produit-achat__dispo {
    font-family: var(--font-ui);
    font-size: 0.8125rem;
    color: var(--color-vert);
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.genestine-produit-achat__dispo-dot {
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: var(--color-vert);
    display: inline-block;
}

@media (max-width: 1023px) {
    .genestine-produit-hero__grid {
        grid-template-columns: 1fr;
        gap: 2.5rem;
    }
    .genestine-produit-hero__visuel { max-width: 440px; margin: 0 auto; width: 100%; }
}

/* =============================================================================
   24. DÉGUSTATION — fiche produit
   ============================================================================= */
.genestine-produit-degustation__grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 4rem;
    align-items: start;
}

.genestine-produit-degustation__text {
    margin-top: 1.5rem;
    font-size: 0.9375rem;
    line-height: 1.85;
    color: var(--color-sombre);
    white-space: pre-line;
}

.genestine-produit-degustation__profil-box {
    margin-top: 1.5rem;
    padding: 1.5rem;
    background: var(--color-creme-fonce);
    border-left: 3px solid var(--color-or);
    font-style: italic;
    font-size: 0.9375rem;
    line-height: 1.75;
}

@media (max-width: 1023px) {
    .genestine-produit-degustation__grid { grid-template-columns: 1fr; gap: 2rem; }
}

/* =============================================================================
   25. COCKTAILS — fiche produit
   ============================================================================= */
.genestine-cocktail-card {
    padding: 1.75rem;
    background: var(--color-blanc);
    border: 1px solid var(--color-creme-fonce);
}

.genestine-cocktail-card h3 {
    font-size: 1.125rem;
    margin-bottom: 0.75rem;
}

.genestine-cocktail-card__content {
    font-size: 0.9rem;
    color: var(--color-gris);
}

/* =============================================================================
   26. OÙ ACHETER — fiche produit
   ============================================================================= */
.genestine-acheter-card {
    padding: 1.75rem;
    background: var(--color-blanc);
    border: 1px solid var(--color-creme-fonce);
    display: flex;
    flex-direction: column;
    gap: 1rem;
}

.genestine-acheter-card h3 {
    font-size: 1rem;
    font-weight: 400;
    color: var(--color-sombre);
}

.genestine-acheter-card p {
    font-size: 0.875rem;
    color: var(--color-gris);
    line-height: 1.6;
    flex: 1;
}

.genestine-acheter-card .genestine-btn {
    font-size: 0.75rem;
    padding: 0.625rem 1.25rem;
    align-self: flex-start;
}

/* =============================================================================
   27. PAGE VISITER — offres
   ============================================================================= */
.genestine-offres-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 2rem;
    align-items: start;
}

.genestine-offre-card {
    background: var(--color-blanc);
    border: 1px solid var(--color-creme-fonce);
    display: flex;
    flex-direction: column;
    position: relative;
}

.genestine-offre-card--featured {
    border-color: var(--color-or);
    box-shadow: var(--shadow-md);
}

.genestine-offre-card__header {
    padding: 2rem 1.75rem 1.5rem;
    border-bottom: 1px solid var(--color-creme-fonce);
    text-align: center;
}

.genestine-offre-card--featured .genestine-offre-card__header {
    background: var(--color-vert);
    border-color: transparent;
}

.genestine-offre-card__icon {
    font-size: 2rem;
    margin-bottom: 0.875rem;
}

.genestine-offre-card__name {
    font-family: var(--font-heading);
    font-size: 1.375rem;
    font-weight: 400;
    color: var(--color-sombre);
    margin-bottom: 0.375rem;
}

.genestine-offre-card--featured .genestine-offre-card__name {
    color: var(--color-blanc);
}

.genestine-offre-card__duration {
    font-family: var(--font-ui);
    font-size: 0.75rem;
    color: var(--color-gris);
    letter-spacing: 0.04em;
}

.genestine-offre-card--featured .genestine-offre-card__duration {
    color: rgba(255,255,255,0.7);
}

.genestine-offre-card__body {
    padding: 1.5rem 1.75rem;
    flex: 1;
}

.genestine-offre-card__features {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}

.genestine-offre-card__features li {
    font-size: 0.9rem;
    padding-left: 1.375rem;
    position: relative;
    color: var(--color-sombre);
    line-height: 1.5;
}

.genestine-offre-card__features li::before {
    content: '✓';
    position: absolute;
    left: 0;
    color: var(--color-vert);
    font-size: 0.75rem;
    top: 0.125em;
}

.genestine-offre-card__footer {
    padding: 1.5rem 1.75rem 2rem;
    border-top: 1px solid var(--color-creme-fonce);
    text-align: center;
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
    align-items: center;
}

.genestine-offre-card__prix-label {
    font-family: var(--font-ui);
    font-size: 0.625rem;
    font-weight: 600;
    letter-spacing: 0.15em;
    text-transform: uppercase;
    color: var(--color-gris);
}

.genestine-offre-card__prix {
    font-family: var(--font-heading);
    font-size: 2rem;
    font-weight: 600;
    color: var(--color-vert);
}

.genestine-offre-card__prix span {
    font-size: 0.875rem;
    font-weight: 400;
    color: var(--color-gris);
}

.genestine-offre-card__prix-note {
    font-size: 0.75rem;
    color: var(--color-gris);
}

.genestine-offre-card__footer .genestine-btn {
    margin-top: 0.75rem;
    font-size: 0.75rem;
    padding: 0.625rem 1.5rem;
}

@media (max-width: 1023px) {
    .genestine-offres-grid { grid-template-columns: 1fr; max-width: 520px; margin: 0 auto; }
}

/* =============================================================================
   28. PAGE VISITER — infos pratiques
   ============================================================================= */
.genestine-infos-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 4rem;
    align-items: start;
}

.genestine-infos-block h2 {
    margin-bottom: 2rem;
}

.genestine-infos-list {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-direction: column;
    gap: 1.25rem;
}

.genestine-infos-list li {
    display: grid;
    grid-template-columns: 120px 1fr;
    gap: 1rem;
    align-items: start;
    padding-bottom: 1.25rem;
    border-bottom: 1px solid var(--color-creme-fonce);
}

.genestine-infos-list__label {
    font-family: var(--font-ui);
    font-size: 0.6875rem;
    font-weight: 600;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    color: var(--color-gris);
    padding-top: 0.125rem;
}

.genestine-infos-list__value {
    font-size: 0.9375rem;
    color: var(--color-sombre);
    line-height: 1.65;
}

.genestine-carte-placeholder {
    background: var(--color-creme-fonce);
    aspect-ratio: 16 / 10;
    display: flex;
    align-items: center;
    justify-content: center;
    border: 1px solid var(--color-creme-fonce);
    position: relative;
    overflow: hidden;
}

.genestine-carte-pin {
    text-align: center;
}

.genestine-carte-pin__label {
    font-family: var(--font-ui);
    font-size: 0.75rem;
    color: var(--color-gris);
    display: block;
    margin-top: 0.5rem;
}

.genestine-carte-actions {
    display: flex;
    gap: 0.75rem;
    margin-top: 1rem;
}

.genestine-carte-actions .genestine-btn {
    flex: 1;
    text-align: center;
    font-size: 0.75rem;
    padding: 0.625rem 1rem;
}

@media (max-width: 1023px) {
    .genestine-infos-grid { grid-template-columns: 1fr; gap: 2.5rem; }
    .genestine-infos-list li { grid-template-columns: 100px 1fr; }
}

/* =============================================================================
   29. PAGE VISITER — réservation
   ============================================================================= */
.genestine-reservation-layout {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 4rem;
    align-items: start;
}

.genestine-reservation-intro h2 {
    margin-bottom: 1.25rem;
}

.genestine-reservation-intro p {
    margin-bottom: 1rem;
    font-size: 0.9375rem;
    line-height: 1.75;
}

.genestine-reservation-intro__note {
    color: var(--color-gris);
    font-size: 0.875rem !important;
}

.genestine-reservation-steps {
    margin-top: 2rem;
    padding-top: 1.5rem;
    border-top: 1px solid var(--color-creme-fonce);
}

.genestine-reservation-steps h3 {
    font-size: 1rem;
    margin-bottom: 1.25rem;
}

.genestine-reservation-step {
    display: flex;
    gap: 1rem;
    align-items: flex-start;
    margin-bottom: 1rem;
    font-size: 0.9375rem;
    line-height: 1.6;
}

.genestine-reservation-step__num {
    width: 28px;
    height: 28px;
    border-radius: 50%;
    background: var(--color-vert);
    color: var(--color-blanc);
    font-family: var(--font-ui);
    font-size: 0.75rem;
    font-weight: 700;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    margin-top: 0.125rem;
}

.genestine-reservation-form-block {
    background: var(--color-blanc);
    padding: 2.5rem;
    border: 1px solid var(--color-creme-fonce);
}

.genestine-reservation-placeholder {
    display: flex;
    flex-direction: column;
    gap: 0.875rem;
}

.genestine-reservation-placeholder h3 {
    font-size: 1.25rem;
    margin-bottom: 0.5rem;
}

.genestine-reservation-placeholder p {
    font-size: 0.9375rem;
    color: var(--color-gris);
}

.genestine-reservation-placeholder a {
    color: var(--color-vert);
}

@media (max-width: 1023px) {
    .genestine-reservation-layout { grid-template-columns: 1fr; gap: 2.5rem; }
}

/* =============================================================================
   30. PAGE VISITER — FAQ
   ============================================================================= */
.genestine-faq-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 2rem;
}

.genestine-faq-item {
    padding: 1.5rem;
    background: var(--color-blanc);
    border-left: 3px solid var(--color-or);
}

.genestine-faq-item__q {
    font-family: var(--font-heading);
    font-size: 1rem;
    font-weight: 600;
    color: var(--color-sombre);
    margin-bottom: 0.75rem;
}

.genestine-faq-item__a {
    font-size: 0.875rem;
    color: var(--color-gris);
    line-height: 1.7;
}

@media (max-width: 767px) {
    .genestine-faq-grid { grid-template-columns: 1fr; }
}

/* =============================================================================
   31. PRODUIT CARD — placeholder (sans image)
   ============================================================================= */
.genestine-produit-card__placeholder {
    aspect-ratio: 3 / 4;
    background: var(--color-creme-fonce);
    width: 100%;
}