/*
Theme Name: Au Pub du Coche
Theme URI: https://aucochedebriare.com/le-pub/
Author: Studio web
Author URI: https://aucochedebriare.com
Description: Thème sur-mesure pour Au Pub du Coche, le pub de la maison Au Coche de Briare à Montargis : un comptoir, deux niveaux jusqu'au canal et une terrasse au bord de l'eau. Accueil éditorial avec mention d'ouverture, le lieu et l'histoire de la maison, carte en onglets (bières, whiskies, cocktails, sans-alcool, cuisine de pub) gérée dans l'administration, agenda des soirées, privatisation avec formulaire de demande, la maison (hôtel et brasserie Abstract), galerie, contact. SEO local (BarOrPub, Menu, Event, FAQ). Design crème et or, Cormorant Garamond et EB Garamond, dans la continuité des sites de la maison.
Version: 1.2.0
Requires at least: 6.0
Tested up to: 6.5
Requires PHP: 7.4
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: au-pub-du-coche
Tags: custom-colors, custom-menu, custom-logo, featured-images, full-width-template, translation-ready
*/

/* ============================================
   AU PUB DU COCHE — DESIGN SYSTEM
   Palette crème / or / encre, grain photographique,
   cadres dorés, Cormorant Garamond en display.
   (Système repris du thème Au Coche de Briare.)
   ============================================ */

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

:root {
    /* Fond & encres */
    --paper: #F6F0E2;
    --ink: #2B2620;
    --ink-soft: #55493A;
    --ink-muted: #6B5D4B;
    --ink-gold: #8A7350;

    /* Ors */
    --gold-soft: #A9814A;          /* accent sur fond clair */
    --gold-deep: #7C5C31;          /* survol sur fond clair */
    --gold: #C7A566;               /* accent sur fond sombre */
    --gold-line: rgba(169, 129, 74, 0.45);
    --gold-line-soft: rgba(169, 129, 74, 0.25);
    --frame: rgba(214, 183, 128, 0.28);
    --frame-corner: #D6B780;

    /* Sombres */
    --dark: #16110C;
    --dark-2: #1C1610;
    --dark-3: #100C08;

    /* Crèmes (textes sur fond sombre) */
    --cream: #F3EAD6;
    --cream-soft: #E9DFC9;
    --cream-warm: #EDE4CF;

    /* Badge prix */
    --badge-bg: rgba(22, 17, 12, 0.72);
    --badge-txt: #E8D9B8;

    /* Typographies */
    --display: 'Cormorant Garamond', 'EB Garamond', Georgia, serif;
    --body: 'EB Garamond', Georgia, 'Times New Roman', serif;
}

html, body {
    width: 100%;
    overflow-x: hidden;
}

html { scroll-behavior: smooth; }

body {
    font-family: var(--body);
    font-size: 17px;
    background: var(--paper);
    color: var(--ink);
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    line-height: 1.75;
}

/* Grain photographique sur tout le site */
body::after {
    content: "";
    position: fixed;
    inset: 0;
    z-index: 90;
    pointer-events: none;
    opacity: 0.05;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='240' height='240'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='2'/%3E%3C/filter%3E%3Crect width='240' height='240' filter='url(%23n)'/%3E%3C/svg%3E");
}

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

/* Accessibilité : lien d'évitement */
.skip-link {
    position: absolute;
    left: -9999px;
    top: 0;
    z-index: 999;
    background: var(--dark);
    color: var(--cream);
    padding: 12px 20px;
    font-size: 12px;
    letter-spacing: 0.16em;
    text-transform: uppercase;
}
.skip-link:focus { left: 12px; top: 12px; }

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

/* Décalage quand la barre d'admin WP est visible */
.admin-bar nav.site-nav { top: 32px; }
@media (max-width: 782px) { .admin-bar nav.site-nav { top: 46px; } }

/* ============== ANIMATIONS ============== */
@keyframes kenburns {
    from { transform: scale(1.03); }
    to { transform: scale(1.1); }
}
@keyframes scrollline {
    0% { transform: scaleY(0); transform-origin: top; }
    45% { transform: scaleY(1); transform-origin: top; }
    55% { transform: scaleY(1); transform-origin: bottom; }
    100% { transform: scaleY(0); transform-origin: bottom; }
}
@keyframes fadeUp {
    from { opacity: 0; transform: translateY(30px); }
    to { opacity: 1; transform: translateY(0); }
}

/* ============== NAVIGATION ============== */
nav.site-nav {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    z-index: 100;
    padding: 26px 56px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 30px;
    color: var(--cream);
    background: linear-gradient(to bottom, rgba(12, 9, 6, 0.45), transparent);
    transition: background 0.4s ease, padding 0.4s ease;
}

nav.site-nav.scrolled {
    background: rgba(22, 17, 12, 0.96);
    backdrop-filter: blur(12px);
    -webkit-backdrop-filter: blur(12px);
    padding: 14px 56px;
}

nav.site-nav .brand {
    display: flex;
    align-items: center;
    gap: 14px;
    font-family: var(--display);
    font-size: 15px;
    font-weight: 500;
    letter-spacing: 0.32em;
    text-transform: uppercase;
    color: var(--cream);
    text-decoration: none;
    flex: none;
}
nav.site-nav .brand img { display: block; max-height: 52px; width: auto; transition: max-height 0.4s ease; }
nav.site-nav.scrolled .brand img { max-height: 40px; }

nav.site-nav .nav-right { display: flex; align-items: center; gap: 34px; }

nav.site-nav .menu {
    display: flex;
    gap: 34px;
    list-style: none;
    align-items: center;
}

nav.site-nav .menu a {
    font-size: 11px;
    letter-spacing: 0.22em;
    text-transform: uppercase;
    color: rgba(243, 234, 214, 0.75);
    text-decoration: none;
    transition: color 0.3s ease, border-color 0.3s ease;
    display: inline-block;
    padding-bottom: 4px;
    border-bottom: 1px solid transparent;
}

nav.site-nav .menu a:hover,
nav.site-nav .menu .current-menu-item > a,
nav.site-nav .menu .current_page_item > a,
nav.site-nav .menu a.active {
    color: var(--cream);
}

/* Trait doré au survol uniquement (pas sur la page active). */
nav.site-nav .menu a:hover { border-bottom-color: rgba(214, 183, 128, 0.7); }

/* Bouton « Réserver » dans la barre */
.nav-book {
    flex: none;
    padding: 11px 26px;
    border: 1px solid rgba(214, 183, 128, 0.65);
    color: var(--badge-txt);
    font-size: 10px;
    letter-spacing: 0.26em;
    text-transform: uppercase;
    text-decoration: none;
    white-space: nowrap;
    transition: background 0.35s ease, color 0.35s ease, border-color 0.35s ease;
}
.nav-book:hover { background: var(--gold); color: var(--dark); border-color: var(--gold); }

/* Bouton burger mobile */
.nav-toggle {
    display: none;
    background: none;
    border: 0;
    cursor: pointer;
    padding: 8px;
    position: relative;
    z-index: 130;
}
.nav-toggle span {
    display: block;
    width: 26px;
    height: 2px;
    background: var(--cream);
    margin: 5px 0;
    transition: transform 0.3s ease, opacity 0.3s ease;
}
.nav-open .nav-toggle span:nth-child(1) { transform: translateY(7px) rotate(45deg); }
.nav-open .nav-toggle span:nth-child(2) { opacity: 0; }
.nav-open .nav-toggle span:nth-child(3) { transform: translateY(-7px) rotate(-45deg); }

@media (max-width: 1360px) {
    nav.site-nav, nav.site-nav.scrolled { padding-left: 30px; padding-right: 30px; }
    nav.site-nav .menu { gap: 24px; }
    nav.site-nav .nav-right { gap: 22px; }
}

@media (max-width: 1180px) {
    nav.site-nav { padding: 16px 22px; }
    nav.site-nav.scrolled { padding: 12px 22px; }
    nav.site-nav .brand { font-size: 12px; letter-spacing: 0.24em; }
    nav.site-nav .brand img { max-height: 40px; }
    .nav-toggle { display: block; }
    .nav-book { display: none; }

    /* Pas de backdrop-filter sur la nav en mobile : elle deviendrait le bloc
       conteneur du menu « position: fixed » (menu collé en haut). */
    nav.site-nav,
    nav.site-nav.scrolled {
        backdrop-filter: none;
        -webkit-backdrop-filter: none;
    }
    nav.site-nav.scrolled { border-bottom: 1px solid var(--frame); }

    nav.site-nav .nav-right {
        position: fixed;
        inset: 0;
        flex-direction: column;
        justify-content: center;
        gap: 34px;
        background: var(--dark);
        opacity: 0;
        pointer-events: none;
        transition: opacity 0.4s ease;
        z-index: 120;
    }
    nav.site-nav .menu { flex-direction: column; gap: 30px; }
    nav.site-nav .menu a { font-size: 15px; letter-spacing: 0.22em; }
    .nav-open nav.site-nav .nav-right { opacity: 1; pointer-events: auto; }
    .nav-open .nav-book { display: inline-block; }

    /* Héros plafonnés à 80% de l'écran en mobile. */
    section.hero,
    section.hero.hero-home { height: 80vh; min-height: 0; }
    section.hero.hero-short { height: 62vh; min-height: 0; }
}

/* ============== CADRE DORÉ (héros, CTA) ============== */
.gold-frame {
    position: absolute;
    inset: 22px;
    border: 1px solid var(--frame);
    pointer-events: none;
    z-index: 3;
}
.gold-frame .c { position: absolute; width: 14px; height: 14px; }
.gold-frame .c-tl { top: -1px; left: -1px; border-top: 1px solid var(--frame-corner); border-left: 1px solid var(--frame-corner); }
.gold-frame .c-tr { top: -1px; right: -1px; border-top: 1px solid var(--frame-corner); border-right: 1px solid var(--frame-corner); }
.gold-frame .c-bl { bottom: -1px; left: -1px; border-bottom: 1px solid var(--frame-corner); border-left: 1px solid var(--frame-corner); }
.gold-frame .c-br { bottom: -1px; right: -1px; border-bottom: 1px solid var(--frame-corner); border-right: 1px solid var(--frame-corner); }

/* ============== HÉROS ============== */
.hero {
    position: relative;
    height: 84vh;
    min-height: 560px;
    width: 100%;
    overflow: hidden;
    background: var(--dark);
}

.hero-home { height: 96vh; min-height: 640px; }
.hero-short { height: 62vh; min-height: 460px; }

.hero-bg {
    position: absolute;
    top: -25%;
    left: 0;
    right: 0;
    height: 150%;
    background-size: cover;
    background-position: center;
    background-color: var(--dark);
    transform: scale(1.08);
    will-change: transform;
    animation: kenburns 26s ease-out both alternate infinite;
}
/* Quand le parallax JS est actif, c'est lui qui pilote la transform. */
body.has-parallax .hero-bg { animation: none; }

.hero-overlay {
    position: absolute;
    inset: 0;
    background:
        radial-gradient(ellipse 90% 72% at 50% 45%, rgba(12, 9, 6, 0.52) 0%, rgba(12, 9, 6, 0.22) 45%, rgba(12, 9, 6, 0) 76%),
        linear-gradient(180deg, rgba(12, 9, 6, 0.6) 0%, rgba(12, 9, 6, 0.14) 38%, rgba(12, 9, 6, 0.2) 60%, rgba(22, 17, 12, 0.74) 100%);
}

.hero-content {
    position: relative;
    z-index: 4;
    height: 100%;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    text-align: center;
    padding: 0 32px;
    color: var(--cream);
    text-shadow: 0 2px 30px rgba(12, 9, 6, 0.55);
}

.hero-eyebrow {
    font-size: 11px;
    letter-spacing: 0.34em;
    text-transform: uppercase;
    color: var(--gold);
    margin-bottom: 22px;
    animation: fadeUp 1.2s cubic-bezier(0.16, 1, 0.3, 1) 0.3s backwards;
}

.hero-logo {
    max-width: 420px;
    width: 78%;
    margin: 0 auto 30px;
    animation: fadeUp 1.4s cubic-bezier(0.16, 1, 0.3, 1) 0.45s backwards;
}
.hero-logo img { width: 100%; height: auto; display: block; }

.hero-title {
    font-family: var(--display);
    font-weight: 400;
    font-size: clamp(38px, 6vw, 62px);
    line-height: 1.08;
    margin: 0 auto 24px;
    color: var(--cream);
    text-wrap: balance;
    animation: fadeUp 1.4s cubic-bezier(0.16, 1, 0.3, 1) 0.5s backwards;
}
.hero-title em { font-style: italic; color: var(--gold); }

.hero-tagline {
    font-style: italic;
    font-size: 19px;
    line-height: 1.5;
    max-width: 580px;
    color: rgba(243, 234, 214, 0.85);
    animation: fadeUp 1.4s cubic-bezier(0.16, 1, 0.3, 1) 0.7s backwards;
}

/* Sous-titre SEO discret sous le titre du héros. */
.hero-title-sub {
    display: block;
    font-family: var(--body);
    font-size: 12px;
    font-style: normal;
    letter-spacing: 0.24em;
    text-transform: uppercase;
    color: var(--gold);
    margin-top: 16px;
}

/* Boutons du héros */
.hero-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 16px;
    justify-content: center;
    margin-top: 40px;
    animation: fadeUp 1.4s cubic-bezier(0.16, 1, 0.3, 1) 0.9s backwards;
}

/* Ligne animée « défiler » (le texte est masqué) */
.hero-scroll {
    position: absolute;
    bottom: 46px;
    left: 50%;
    transform: translateX(-50%);
    z-index: 4;
    font-size: 0;
    color: transparent;
}
.hero-scroll::after {
    content: '';
    display: block;
    width: 1px;
    height: 56px;
    background: rgba(214, 183, 128, 0.9);
    animation: scrollline 2.6s ease-in-out infinite;
}

/* Bandeau d'horaires posé sous le héros */
.hero-strip {
    background: var(--dark-2);
    color: rgba(233, 223, 201, 0.82);
    border-bottom: 1px solid rgba(214, 183, 128, 0.16);
}
.hero-strip-inner {
    max-width: 1160px;
    margin: 0 auto;
    padding: 18px 48px;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-wrap: wrap;
    gap: 14px 34px;
    font-size: 12px;
    letter-spacing: 0.2em;
    text-transform: uppercase;
    text-align: center;
}
.hero-strip-inner span { display: inline-flex; align-items: center; gap: 12px; }
.hero-strip-inner span::before {
    content: '';
    width: 6px;
    height: 6px;
    border: 1px solid var(--gold);
    transform: rotate(45deg);
    flex: none;
}
.hero-strip-inner a { color: var(--gold); text-decoration: none; }
.hero-strip-inner a:hover { color: var(--cream); }
@media (max-width: 768px) { .hero-strip-inner { padding: 16px 22px; font-size: 10px; letter-spacing: 0.16em; gap: 10px 20px; } }

/* ============== SECTIONS GÉNÉRIQUES ============== */
.section {
    position: relative;
    padding: 110px 48px;
    max-width: 1260px;
    margin: 0 auto;
}
.section-narrow { max-width: 840px; }
.section-tight { padding-top: 0; }

.section-eyebrow {
    font-size: 11px;
    letter-spacing: 0.34em;
    text-transform: uppercase;
    color: var(--gold-soft);
    margin-bottom: 24px;
    text-align: center;
}

.section-title {
    font-family: var(--display);
    font-size: clamp(34px, 4.4vw, 50px);
    font-weight: 400;
    line-height: 1.15;
    text-align: center;
    margin-bottom: 28px;
    text-wrap: balance;
}
.section-title em { font-style: italic; color: var(--gold-soft); }

/* Filet : ligne — losange — ligne */
.section-divider {
    position: relative;
    width: 160px;
    height: 9px;
    margin: 0 auto 38px;
    background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 10 10'%3E%3Crect x='2.2' y='2.2' width='5.6' height='5.6' fill='none' stroke='%23A9814A' transform='rotate(45 5 5)'/%3E%3C/svg%3E") center / 9px 9px no-repeat;
}
.section-divider::before,
.section-divider::after {
    content: '';
    position: absolute;
    top: 4px;
    width: 64px;
    height: 1px;
    background: rgba(169, 129, 74, 0.5);
}
.section-divider::before { left: 0; }
.section-divider::after { right: 0; }

.section-text {
    font-size: 17px;
    line-height: 1.75;
    color: var(--ink-soft);
    max-width: 660px;
    margin: 0 auto 24px;
    text-align: center;
    text-wrap: pretty;
}
.section-text:last-child { margin-bottom: 0; }

.section-text.lead {
    font-family: var(--display);
    font-size: 22px;
    line-height: 1.6;
    font-style: italic;
    color: #4A4238;
}

/* Grand mot filigrane derrière une introduction */
.watermark {
    position: absolute;
    top: 40px;
    left: 50%;
    transform: translateX(-50%);
    font-family: var(--display);
    font-style: italic;
    font-weight: 300;
    font-size: clamp(110px, 15vw, 220px);
    color: rgba(169, 129, 74, 0.07);
    white-space: nowrap;
    pointer-events: none;
    line-height: 1;
    z-index: 0;
}
.watermark ~ * { position: relative; z-index: 1; }

.section-sep { border-top: 1px solid var(--gold-line-soft); }

@media (max-width: 768px) {
    .section { padding: 72px 24px; }
    .section-title { font-size: 32px; }
}

/* ============== PAGES SANS HÉROS (404, recherche, archives) ============== */
body.error404 nav.site-nav,
body.search nav.site-nav,
body.archive nav.site-nav,
body.single-post nav.site-nav,
body.blog:not(.home) nav.site-nav {
    background: rgba(22, 17, 12, 0.96);
    backdrop-filter: blur(12px);
    -webkit-backdrop-filter: blur(12px);
}
body.error404 .site-main > .section:first-child,
body.search .site-main > .section:first-child,
body.archive .site-main > .section:first-child,
body.single-post .site-main > .section:first-child,
body.blog:not(.home) .site-main > .section:first-child { padding-top: 190px; }

/* ============== PAGE INTROUVABLE (404) ============== */
.error-404 { min-height: 68vh; }

.error-404-search {
    display: flex;
    gap: 12px;
    max-width: 520px;
    margin: 44px auto 0;
}
.error-404-search input[type="search"] {
    flex: 1;
    min-width: 0;
    padding: 14px 18px;
    background: rgba(255, 255, 255, 0.7);
    border: 1px solid rgba(43, 38, 32, 0.18);
    font-family: var(--body);
    font-size: 16px;
    color: var(--ink);
    transition: border-color 0.3s ease;
}
.error-404-search input[type="search"]:focus { outline: none; border-color: var(--gold-soft); }
.error-404-search .form-submit { margin-top: 0; white-space: nowrap; }

.error-404-links {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 20px 36px;
    margin: 64px auto 44px;
    max-width: 640px;
}

@media (max-width: 768px) {
    body.error404 .site-main > .section:first-child,
    body.search .site-main > .section:first-child,
    body.archive .site-main > .section:first-child,
    body.single-post .site-main > .section:first-child,
    body.blog:not(.home) .site-main > .section:first-child { padding-top: 148px; }
    .error-404-search { flex-direction: column; }
    .error-404-search .form-submit { width: 100%; }
    .error-404-links { margin: 48px auto 34px; gap: 16px 26px; }
}

/* ============== FEATURE (image + texte, cadre décalé) ============== */
.features { display: flex; flex-direction: column; gap: 130px; }

.feature {
    display: grid;
    grid-template-columns: 1.05fr 0.95fr;
    gap: clamp(40px, 6vw, 100px);
    align-items: center;
}

.feature.reverse { direction: rtl; }
.feature.reverse > * { direction: ltr; }

.feature-image { position: relative; }

.feature-frame {
    position: absolute;
    inset: 0;
    border: 1px solid var(--gold-line);
    transform: translate(-16px, 16px);
    pointer-events: none;
}
.feature.reverse .feature-frame { transform: translate(16px, 16px); }

.feature-media {
    position: relative;
    overflow: hidden;
    aspect-ratio: 4 / 3.4;
    background: var(--cream-warm);
    box-shadow: 0 34px 70px rgba(22, 17, 12, 0.22);
}
.feature-media img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
    transition: transform 1.4s cubic-bezier(0.22, 0.61, 0.36, 1);
}
.feature-image:hover .feature-media img { transform: scale(1.045); }

/* Variante portrait : photo verticale (le portrait du chef) dans une
   colonne plus étroite, le texte reprend la place gagnée. */
.feature.portrait { grid-template-columns: 0.78fr 1.22fr; }
.feature.portrait .feature-image { max-width: 460px; margin-inline: auto; }
.feature.portrait .feature-media { aspect-ratio: 3 / 4; }

.feature-content { position: relative; }

.feature-num {
    position: absolute;
    top: -70px;
    right: -10px;
    font-family: var(--display);
    font-weight: 300;
    font-size: 150px;
    color: rgba(169, 129, 74, 0.1);
    line-height: 1;
    pointer-events: none;
}
.feature.reverse .feature-num { right: auto; left: -10px; }

.feature-eyebrow {
    font-size: 11px;
    letter-spacing: 0.34em;
    text-transform: uppercase;
    color: var(--gold-soft);
    margin-bottom: 20px;
}

.feature-content h3 {
    font-family: var(--display);
    font-style: italic;
    font-weight: 400;
    font-size: 36px;
    line-height: 1.2;
    margin-bottom: 22px;
    color: var(--ink);
}
.feature-content h3 em { color: var(--gold-soft); }

.feature-content p {
    font-size: 17px;
    line-height: 1.75;
    color: var(--ink-soft);
    margin-bottom: 16px;
    text-wrap: pretty;
}
.feature-content p:last-child { margin-bottom: 0; }

.feature-link { margin-top: 28px; }

@media (max-width: 820px) {
    .features { gap: 80px; }
    .feature, .feature.reverse { grid-template-columns: 1fr; gap: 40px; direction: ltr; }
    .feature.portrait .feature-image { max-width: 360px; }
    .feature-num { display: none; }
    .feature-content h3 { font-size: 28px; }
    .feature-frame { transform: translate(-10px, 10px); }
    .feature.reverse .feature-frame { transform: translate(10px, 10px); }
}

/* Lien texte doré en capitales */
.text-link {
    display: inline-block;
    font-size: 11px;
    letter-spacing: 0.26em;
    text-transform: uppercase;
    color: var(--gold-soft);
    text-decoration: none;
    border-bottom: 1px solid rgba(169, 129, 74, 0.5);
    padding-bottom: 5px;
    transition: color 0.3s ease, border-color 0.3s ease;
}
.text-link:hover { color: var(--gold-deep); border-color: var(--gold-deep); }

/* ============== INFOS PRATIQUES (colonnes à filets) ============== */
.info-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    max-width: 1000px;
    margin: 0 auto;
}

.info-block {
    text-align: center;
    padding: 10px 40px;
    border-left: 1px solid rgba(169, 129, 74, 0.3);
}
.info-block:last-child { border-right: 1px solid rgba(169, 129, 74, 0.3); }

.info-block h4 {
    font-size: 10px;
    letter-spacing: 0.3em;
    text-transform: uppercase;
    color: var(--gold-soft);
    margin-bottom: 24px;
    font-weight: 400;
}

.info-block p {
    font-size: 15px;
    line-height: 2.05;
    color: var(--ink-soft);
}
.info-block p strong { display: block; font-weight: 400; }
.info-block p em {
    font-family: var(--display);
    font-style: italic;
    font-size: 19px;
    color: var(--ink);
}

@media (max-width: 820px) {
    .info-grid { grid-template-columns: 1fr; gap: 44px; }
    .info-block, .info-block:last-child { border: 0; padding: 0 20px; }
}

/* ============== BANDEAU PARALLAXE (photo pleine largeur) ============== */
.band {
    position: relative;
    height: 64vh;
    min-height: 480px;
    display: grid;
    place-items: center;
    overflow: hidden;
    background: var(--dark);
    text-align: center;
}

/* Fond volontairement plus haut que le bandeau : le débord absorbe le
   déplacement appliqué au défilement, sans jamais laisser de bande vide. */
.band-bg {
    position: absolute;
    top: -25%;
    left: 0;
    right: 0;
    height: 150%;
    background-size: cover;
    background-position: center;
    background-color: var(--dark);
    transform: scale(1.06);
    will-change: transform;
}

.band-overlay {
    position: absolute;
    inset: 0;
    background:
        radial-gradient(ellipse 80% 66% at 50% 50%, rgba(12, 9, 6, 0.46) 0%, rgba(12, 9, 6, 0.16) 52%, rgba(12, 9, 6, 0) 80%),
        linear-gradient(180deg, rgba(12, 9, 6, 0.6) 0%, rgba(12, 9, 6, 0.26) 40%, rgba(22, 17, 12, 0.66) 100%);
}

.band-frame {
    position: absolute;
    inset: 22px;
    border: 1px solid rgba(214, 183, 128, 0.2);
    pointer-events: none;
}

.band-inner {
    position: relative;
    max-width: 680px;
    padding: 40px 32px;
}

.band .section-eyebrow { color: var(--gold); }
.band .section-title { color: var(--cream); text-shadow: 0 2px 30px rgba(12, 9, 6, 0.5); }
.band .section-title em { color: var(--gold); }
.band .section-text {
    color: rgba(233, 223, 201, 0.82);
    max-width: 560px;
    text-shadow: 0 1px 20px rgba(12, 9, 6, 0.55);
}

/* Le bandeau sombre fait déjà séparation : pas de filet en plus sous lui. */
.band + .section-sep { border-top: 0; }

@media (max-width: 768px) {
    .band { height: auto; min-height: 0; padding: 96px 0; }
    .band-frame { inset: 14px; }
    .band-inner { padding: 0 26px; }
}

/* ============== CTA (fond sombre encadré) ============== */
.cta-section {
    position: relative;
    text-align: center;
    padding: 120px 32px;
    background: var(--dark);
    color: var(--cream-soft);
    overflow: hidden;
}

.cta-frame {
    position: absolute;
    inset: 20px;
    border: 1px solid rgba(214, 183, 128, 0.16);
    pointer-events: none;
}

.cta-section > *:not(.cta-frame) { position: relative; }

.cta-section .section-eyebrow { color: var(--gold); }
.cta-section .section-title { color: var(--cream); }
.cta-section .section-title em { color: var(--gold); }
.cta-section .section-text {
    color: rgba(233, 223, 201, 0.7);
    font-style: italic;
    max-width: 460px;
}
.cta-actions { display: flex; flex-wrap: wrap; gap: 16px; justify-content: center; }
.cta-actions .cta-button { margin-top: 40px; }

.cta-button {
    display: inline-block;
    margin-top: 40px;
    padding: 18px 48px;
    border: 1px solid rgba(214, 183, 128, 0.6);
    color: var(--badge-txt);
    font-size: 11px;
    letter-spacing: 0.28em;
    text-transform: uppercase;
    text-decoration: none;
    transition: background 0.4s ease, color 0.4s ease, border-color 0.4s ease, transform 0.3s ease, box-shadow 0.3s ease;
}
.cta-button:hover { background: var(--gold); color: var(--dark); border-color: var(--gold); transform: translateY(-2px); box-shadow: 0 14px 32px rgba(12, 9, 6, 0.4); }

/* Reflet « shine » qui balaie les boutons au survol. */
.cta-button, .nav-book, .book-fab {
    position: relative;
    overflow: hidden;
}
.cta-button::after, .nav-book::after {
    content: "";
    position: absolute;
    top: 0;
    left: -130%;
    width: 55%;
    height: 100%;
    background: linear-gradient(100deg, transparent, rgba(255, 255, 255, 0.35), transparent);
    transform: skewX(-18deg);
    transition: left 0.7s cubic-bezier(0.22, 0.61, 0.36, 1);
    pointer-events: none;
}
.cta-button:hover::after, .nav-book:hover::after { left: 150%; }

.cta-button.gold { border-color: rgba(214, 183, 128, 0.6); color: var(--badge-txt); }
.cta-button.gold:hover { background: var(--gold); color: var(--dark); border-color: var(--gold); }

/* Variante pleine (or) sur fond sombre */
.cta-button.solid { background: var(--gold); color: var(--dark); border-color: var(--gold); }
.cta-button.solid:hover { background: var(--badge-txt); border-color: var(--badge-txt); color: var(--dark); }

/* Variante sur fond clair */
.cta-button.on-light { color: var(--ink); border-color: rgba(43, 38, 32, 0.4); margin-top: 0; }
.cta-button.on-light:hover { background: var(--dark); color: var(--badge-txt); border-color: var(--dark); }

/* Bouton flottant « Réserver » (mobile) */
.book-fab {
    position: fixed;
    left: 18px;
    right: 18px;
    bottom: 16px;
    z-index: 95;
    display: none;
    padding: 15px 20px;
    text-align: center;
    background: var(--gold);
    color: var(--dark);
    font-size: 11px;
    letter-spacing: 0.26em;
    text-transform: uppercase;
    text-decoration: none;
    box-shadow: 0 10px 30px rgba(12, 9, 6, 0.35);
}
@media (max-width: 900px) {
    .book-fab { display: block; }
    body { padding-bottom: 70px; }
    .nav-open .book-fab { display: none; }
}

/* ============== FOOTER ============== */
footer.site-footer {
    background: var(--dark-3);
    color: rgba(233, 223, 201, 0.65);
    padding: 90px 56px 40px;
}

.footer-top {
    display: grid;
    grid-template-columns: 1.4fr 1fr 1fr 1fr;
    gap: 40px;
    max-width: 1160px;
    margin: 0 auto;
    padding-bottom: 70px;
}

.footer-block h5 {
    font-size: 10px;
    letter-spacing: 0.3em;
    text-transform: uppercase;
    color: var(--gold);
    margin-bottom: 20px;
    font-weight: 400;
}

.footer-brand {
    font-family: var(--display);
    font-size: 15px;
    letter-spacing: 0.3em;
    text-transform: uppercase;
    color: var(--cream);
    margin-bottom: 20px;
    font-weight: 500;
}
.footer-logo { margin-bottom: 20px; max-width: 190px; }
.footer-logo img { display: block; width: 100%; height: auto; }

.footer-tagline {
    font-style: italic;
    font-size: 14px;
    line-height: 1.9;
    max-width: 280px;
}

.footer-block ul { list-style: none; }
.footer-block ul li { margin-bottom: 12px; font-size: 14px; }
.footer-block ul li a {
    color: rgba(233, 223, 201, 0.65);
    text-decoration: none;
    transition: color 0.3s ease;
}
.footer-block ul li a:hover { color: var(--cream); }

.footer-hours { font-size: 14px; line-height: 1.9; }
.footer-hours strong { display: block; font-weight: 400; color: var(--cream); }
.footer-hours em { font-style: italic; color: rgba(233, 223, 201, 0.5); }

/* Icônes réseaux sociaux */
.footer-social { display: inline-flex; align-items: center; gap: 9px; }
.footer-ico { display: inline-flex; color: var(--gold); transition: color 0.3s ease; }
.footer-ico svg { display: block; }
.footer-block ul li a.footer-social:hover .footer-ico { color: var(--cream); }

.footer-bottom {
    max-width: 1160px;
    margin: 0 auto;
    padding-top: 28px;
    border-top: 1px solid rgba(214, 183, 128, 0.14);
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 20px;
    font-size: 12px;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    color: rgba(233, 223, 201, 0.4);
}
.footer-bottom .legals { display: flex; gap: 28px; flex-wrap: wrap; }
.footer-bottom a { color: rgba(233, 223, 201, 0.4); text-decoration: none; transition: color 0.3s ease; }
.footer-bottom a:hover { color: var(--cream); }

@media (max-width: 968px) { .footer-top { grid-template-columns: 1fr 1fr; } }
@media (max-width: 600px) {
    footer.site-footer { padding: 60px 24px 30px; }
    .footer-top { grid-template-columns: 1fr; gap: 30px; }
    .footer-bottom { flex-direction: column; text-align: center; }
}

/* ============== ANIMATIONS AU SCROLL ============== */
.reveal {
    opacity: 0;
    transform: translateY(32px) scale(0.985);
    transition: opacity 1.1s ease, transform 1.1s cubic-bezier(0.22, 0.61, 0.36, 1);
}
.reveal.visible { opacity: 1; transform: translateY(0) scale(1); }
.reveal-delay-1 { transition-delay: 0.1s; }
.reveal-delay-2 { transition-delay: 0.2s; }
.reveal-delay-3 { transition-delay: 0.3s; }

@media (prefers-reduced-motion: reduce) {
    html { scroll-behavior: auto; }
    *, *::before, *::after { animation-duration: 0.001ms !important; animation-iteration-count: 1 !important; transition-duration: 0.001ms !important; }
    .reveal { opacity: 1; transform: none; }
    .hero-bg { animation: none; }
}

/* ============== FORMULAIRES ============== */
.contact-form {
    background: rgba(255, 255, 255, 0.35);
    padding: 48px 40px;
    border: 1px solid var(--gold-line-soft);
}
.contact-form h3 {
    font-family: var(--display);
    font-size: 28px;
    font-weight: 400;
    font-style: italic;
    margin-bottom: 8px;
}
.contact-form .form-note { font-size: 14px; color: var(--ink-muted); margin-bottom: 32px; }

.form-group { margin-bottom: 24px; }
.form-group label {
    display: block;
    font-size: 10px;
    letter-spacing: 0.26em;
    text-transform: uppercase;
    color: var(--ink-soft);
    margin-bottom: 10px;
}
.form-group input,
.form-group select,
.form-group textarea {
    width: 100%;
    padding: 14px 18px;
    background: rgba(255, 255, 255, 0.7);
    border: 1px solid rgba(43, 38, 32, 0.18);
    font-family: var(--body);
    font-size: 16px;
    color: var(--ink);
    transition: border-color 0.3s ease;
}
.form-group input:focus,
.form-group select:focus,
.form-group textarea:focus { outline: none; border-color: var(--gold-soft); }
.form-group textarea { min-height: 140px; resize: vertical; }

.form-row { display: grid; grid-template-columns: 1fr 1fr; gap: 20px; }
.form-row-3 { display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px; }

/* Pot de miel anti-spam */
.form-hp { position: absolute; left: -9999px; top: -9999px; }

.form-submit {
    display: inline-block;
    margin-top: 20px;
    padding: 16px 44px;
    background: var(--dark);
    border: 1px solid var(--dark);
    color: var(--badge-txt);
    font-family: var(--body);
    font-size: 11px;
    letter-spacing: 0.28em;
    text-transform: uppercase;
    cursor: pointer;
    transition: background 0.3s ease, color 0.3s ease;
}
.form-submit:hover { background: var(--gold); border-color: var(--gold); color: var(--dark); }

.form-notice { padding: 16px 18px; margin-bottom: 24px; font-size: 15px; border: 1px solid; }
.form-notice.success { border-color: var(--gold-soft); color: var(--ink); background: rgba(169, 129, 74, 0.1); }
.form-notice.error { border-color: #A3402F; color: #A3402F; background: rgba(163, 64, 47, 0.08); }

.form-legal { font-size: 13px; line-height: 1.6; color: var(--ink-muted); margin-top: 18px; text-wrap: pretty; }

@media (max-width: 600px) {
    .form-row, .form-row-3 { grid-template-columns: 1fr; }
    .contact-form { padding: 32px 24px; }
}

/* ============== CONTENU ÉDITORIAL & DIVERS ============== */
.entry-content h2, .entry-content h3 { font-family: var(--display); font-weight: 400; margin: 32px 0 16px; }
.entry-content p { margin-bottom: 16px; color: var(--ink-soft); }
.entry-content a { color: var(--gold-deep); }
.entry-content ul, .entry-content ol { margin: 0 0 16px 22px; color: var(--ink-soft); }
.entry-content blockquote {
    border-left: 1px solid var(--gold-line);
    padding-left: 24px;
    margin: 28px 0;
    font-family: var(--display);
    font-style: italic;
    font-size: 21px;
    color: #4A4238;
}

.alignwide { max-width: 1260px; margin-left: auto; margin-right: auto; }
.alignfull { max-width: 100%; }
.aligncenter { display: block; margin-left: auto; margin-right: auto; }

/* Placeholder image (aucune image définie) */
.img-placeholder {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    height: 100%;
    min-height: 200px;
    background:
        repeating-linear-gradient(45deg, rgba(169, 129, 74, 0.07) 0px, rgba(169, 129, 74, 0.07) 1px, transparent 1px, transparent 9px),
        var(--cream-warm);
    color: var(--ink-gold);
    font-size: 11px;
    letter-spacing: 0.26em;
    text-transform: uppercase;
    text-align: center;
    padding: 12px;
}

/* Pagination */
.pagination, .nav-links {
    display: flex;
    gap: 14px;
    justify-content: center;
    flex-wrap: wrap;
    font-size: 13px;
    letter-spacing: 0.16em;
    text-transform: uppercase;
}
.pagination a, .nav-links a { text-decoration: none; color: var(--gold-soft); }
.pagination .current, .nav-links .current { color: var(--ink); }