/* ==================== POLICES LOCALES ==================== */
@font-face {
  font-family: 'Patua One';
  font-style: normal;
  font-weight: 400;
  src: url('../fonts/patua-one-v22-latin-regular.woff2') format('woff2');
  font-display: swap;
}

@font-face {
  font-family: 'Caveat';
  font-style: normal;
  font-weight: 400;
  src: url('../fonts/caveat-v23-latin-regular.woff2') format('woff2');
  font-display: swap;
}

/* ==================== VARIABLES & TYPOGRAPHIE ==================== */
:root {
    --color-marron: #7b6853;
    --color-or: #e5ccb1;
    --color-blanc: #ffffff;
    --color-marron-clair: #b6997b;
}

/* Patua One */
.patua-h1 { font-family: "Patua One", serif; font-size: clamp(2.5rem, 7vw, 4.2rem); letter-spacing: -0.02em; line-height: 1.05; }
.patua-h2 { font-family: "Patua One", serif; font-size: clamp(2.2rem, 5.8vw, 2.7rem); letter-spacing: -0.02em; line-height: 1.02; }
.patua-h3 { font-family: "Patua One", serif; font-size: clamp(1.3rem, 1.3vw, 1.5rem); letter-spacing: -0.01em; line-height: 1.8; }

/* Caveat */
.caveat-h1 { font-family: "Caveat", cursive; font-size: clamp(3rem, 5.8vw, 4.5rem); line-height: 1.05; }
.caveat-h2 { font-family: "Caveat", cursive; font-size: clamp(2.4rem, 4.4vw, 2.9rem); line-height: 1.1; }
.caveat-h3 { font-family: "Caveat", cursive; font-size: clamp(1.6rem, 3.2vw, 2.1rem); line-height: 1.15; }
.caveat-h4 { font-family: "Caveat", cursive; font-size: clamp(1.2rem, 2.4vw, 1.45rem); line-height: 1.3; }

/* Roboto */
.roboto-normal  { font-family: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif; font-size: 1.08rem; line-height: 1.68; }
.roboto-legende { font-family: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif; font-size: 0.875rem; line-height: 1.5; }
.roboto-nav     { font-family: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif; font-size: 15px; letter-spacing: 0.145em; font-weight: 500; }

/* ==================== COULEURS ==================== */
.texte-blanc        { color: var(--color-blanc); }
.texte-marron       { color: var(--color-marron); }
.texte-or           { color: var(--color-or); }
.texte-marron-clair { color: var(--color-marron-clair); }

.bg-contenu { background-color: #f8f3ea; }

/* ==================== BASE & ACCESSIBILITÉ ==================== */
body {
    font-family: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
    color: #585858;
    background-image: url('/images/fond.webp');
    background-repeat: repeat;
    background-color: #f8f3ea;
    background-position: top left;
}

:focus-visible {
    outline: 3px solid #e5ccb1;
    outline-offset: 4px;
    border-radius: 4px;
}

/* ==================== NAVIGATION ==================== */
#main-nav {
    height: 90px;
    transition: all 0.5s cubic-bezier(0.4, 0, 0.2, 1);
}
#main-nav.scrolled { height: 60px; }
#main-nav.nav-hidden {
    transform: translateY(-100%);
    opacity: 0;
    pointer-events: none;
}

.logo-wrapper {
    position: absolute;
    left: 50%;
    top: 75px;
    transform: translate(-50%, -50%);
    z-index: 20;
    transition: all 0.4s cubic-bezier(0.4, 0, 0.2, 1);
}

#main-nav.scrolled .logo-wrapper { top: 55px; }

.logo-wrapper img { 
    width: 150px;
    height: auto;
    max-width: 100%;
    image-rendering: crisp-edges;
    transition: width 0.4s cubic-bezier(0.4, 0, 0.2, 1);
}

#main-nav.scrolled .logo-wrapper img { width: 110px; }

.nav-link,
.dropdown-item,
.submenu-header,
#mobile-menu .nav-link,
.mobile-submenu .nav-link {
    color: var(--color-marron-clair);
}

.nav-link:hover,
.dropdown-item:hover,
.submenu-header:hover,
#mobile-menu .nav-link:hover {
    color: var(--color-or);
}

.nav-link.active,
#mobile-menu .nav-link.active,
.mobile-submenu .nav-link.active,
.submenu-header .nav-link.active,
.dropdown-item.active {
    color: var(--color-or);
}

.nav-link {
    position: relative;
}

.nav-link.active::after {
    content: '';
    position: absolute;
    bottom: -6px;
    left: 0;
    width: 100%;
    height: 2.5px;
    background: var(--color-or);
}

#mobile-menu .nav-link.active::after {
    display: none;
}

/* Menu mobile */
#mobile-menu { transition: transform 0.5s cubic-bezier(0.32, 0.72, 0, 1); }
#mobile-menu.open { transform: translateX(0); }

#mobile-overlay { transition: all 0.4s cubic-bezier(0.32, 0.72, 0, 1); }
#mobile-overlay.open { opacity: 1; visibility: visible; }

.hamburger {
    width: 28px; height: 20px; position: relative; cursor: pointer;
}
.hamburger span {
    display: block; position: absolute; height: 2px; width: 100%;
    background: var(--color-or); border-radius: 3px; transition: all 0.3s ease;
}
.hamburger span:nth-child(1) { top: 0; }
.hamburger span:nth-child(2) { top: 9px; }
.hamburger span:nth-child(3) { bottom: 0; }
.hamburger.open span:nth-child(1) { transform: rotate(45deg); top: 9px; }
.hamburger.open span:nth-child(2) { opacity: 0; }
.hamburger.open span:nth-child(3) { transform: rotate(-45deg); top: 9px; }

/* Dropdowns */
.nav-dropdown {
    position: absolute; top: 100%; opacity: 0; visibility: hidden;
    transform: translateY(15px); transition: all 0.4s cubic-bezier(0.4, 0, 0.2, 1);
    z-index: 40; background: #1e2937; border: 1px solid var(--color-marron);
    border-radius: 12px; padding: 16px 0;
    box-shadow: 0 25px 50px -12px rgb(0 0 0 / 0.4);
}
.group:hover .nav-dropdown,
.group:focus-within .nav-dropdown {
    opacity: 1; visibility: visible; transform: translateY(0);
}

.dropdown-item {
    display: flex; align-items: center; gap: 16px;
    padding: 14px 28px; transition: all 0.3s ease;
}

.mobile-submenu {
    max-height: 0; overflow: hidden;
    transition: max-height 0.5s cubic-bezier(0.4, 0, 0.2, 1);
    background: #1e2937;
}

/* ==================== RESTAURANT & SWIPER ==================== */
.restaurant-section {
    background-color: #16192a;
    background-image: url('/images/fond-bleu.webp');
    background-repeat: no-repeat;
    background-position: center top;
}

.restaurant-card {
    transition: all .4s cubic-bezier(0.34,1.56,0.64,1);
}
.restaurant-card:hover,
.restaurant-card:focus-visible {
    transform: scale(1.04) translateY(-8px);
    box-shadow: 0 30px 60px -15px rgb(0 0 0 / .4);
}

.restaurant-card .hover-overlay {
    padding: 22px 16px;
    display: flex;
    align-items: center;
    justify-content: center;
    text-align: center;
}

.restaurant-card .hover-icon {
    font-size: 2.35rem;
    color: var(--color-or);
    margin-bottom: 10px;
    transition: all 0.45s ease;
}
.restaurant-card:hover .hover-icon {
    transform: scale(1.12);
}

/* ==================== FLÈCHES SWIPER ==================== */
.restaurant-swiper .swiper-button-prev,
.restaurant-swiper .swiper-button-next,
.hero-swiper .swiper-button-prev,
.hero-swiper .swiper-button-next {
    background: rgba(0, 0, 0, 0.72);
    color: #ffffff;
    width: 40px;
    height: 40px;
    border-radius: 9999px;
    box-shadow: 0 6px 20px rgba(0,0,0,0.35);
    transition: all 0.35s ease;
    z-index: 20;
}
.restaurant-swiper .swiper-button-prev:hover,
.restaurant-swiper .swiper-button-next:hover,
.hero-swiper .swiper-button-prev:hover,
.hero-swiper .swiper-button-next:hover {
    background: rgba(0, 0, 0, 0.9);
    transform: scale(1.1);
    box-shadow: 0 12px 30px rgba(0,0,0,0.5);
}
.restaurant-swiper .swiper-button-prev::after,
.restaurant-swiper .swiper-button-next::after,
.hero-swiper .swiper-button-prev::after,
.hero-swiper .swiper-button-next::after {
    font-size: 20px;
    font-weight: 900;
}

/* Contrôles au survol */
.hero-swiper .swiper-button-prev,
.hero-swiper .swiper-button-next,
.restaurant-swiper .swiper-button-prev,
.restaurant-swiper .swiper-button-next,
#custom-thumbs {
    opacity: 0;
    visibility: hidden;
    transition: all 0.4s cubic-bezier(0.4, 0, 0.2, 1);
}
.hero-swiper:hover .swiper-button-prev,
.hero-swiper:hover .swiper-button-next,
.restaurant-swiper:hover .swiper-button-prev,
.restaurant-swiper:hover .swiper-button-next,
.hero-swiper:hover #custom-thumbs {
    opacity: 1;
    visibility: visible;
}

/* Thumbs hero */
#custom-thumbs .thumb {
    border: 2px solid transparent;
    transition: all 0.35s ease;
}
#custom-thumbs .thumb:hover,
#custom-thumbs .thumb.active {
    border-color: #ffffff;
    transform: scale(1.12);
}

@media (max-width: 1023px) {
    .restaurant-swiper .swiper-button-prev,
    .restaurant-swiper .swiper-button-next {
        opacity: 1 !important;
        visibility: visible !important;
    }
}

/* ==================== FOOTER ==================== */
.footer-haut {
    background-image: url('/images/bas-de-page-superieur.webp');
    background-repeat: repeat-x;
    background-position: center top;
    background-size: auto 180px;
    height: 180px;
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative;
}

.footer-bas {
    background-image: url('/images/bas-de-page-inferieur.webp');
    background-repeat: repeat;
    background-position: center;
    background-size: auto;
    min-height: 380px;
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative;
    border-top: 1px solid var(--color-marron);
    padding-top: 60px;
}

.feuille-overlay {
    position: absolute;
    top: -130px;
    left: 50%;
    transform: translateX(-50%);
    z-index: 10;
    width: 258px;
    height: auto;
    pointer-events: none;
}

/* ==================== TABLEAU ACCOMPAGNEMENTS ==================== */
.accomp-row {
    display: flex;
    align-items: center;
    padding: 18px 20px;
    transition: all 0.35s cubic-bezier(0.4, 0, 0.2, 1);
    border-bottom: 1px solid #e4d5b8;
    gap: 20px;
}

.accomp-row:last-child { border-bottom: 0; }
.accomp-row:nth-child(even) { background-color: #f4f0e4; }

@media (min-width: 768px) {
    .accomp-row {
        padding: 15px 24px;
        gap: 24px;
    }
}

.accomp-row:hover {
    background-color: rgba(229, 204, 177, 0.25);
}

/* ==================== TÉMOIGNAGES & SWIPER ==================== */
.testimonials-swiper .swiper-slide { height: auto !important; width: 100% !important; }

#testimonial-dots,
.testimonials-swiper .swiper-pagination {
    opacity: 1 !important;
    visibility: visible !important;
    margin-top: 32px;
    margin-bottom: 24px;
}

#testimonial-dots .swiper-pagination-bullet,
.testimonials-swiper .swiper-pagination-bullet {
    background: var(--color-marron) !important;
    opacity: 0.45;
    width: 9px;
    height: 9px;
}

#testimonial-dots .swiper-pagination-bullet-active,
.testimonials-swiper .swiper-pagination-bullet-active {
    background: var(--color-marron) !important;
    opacity: 1;
    transform: scale(1.4);
}

/* ==================== BOUTONS STICKY ==================== */
.btn-sticky {
    background-color: var(--color-marron);
    color: #ffffff;
    box-shadow: 0 8px 20px -4px rgba(123,104,82,0.55);
    transition: all 0.35s cubic-bezier(0.4, 0, 0.2, 1);
}
.btn-sticky:hover {
    background-color: var(--color-marron-clair);
    transform: scale(1.15) translateY(-3px);
}

/* ==================== NAV SPACER & GLOBAL ==================== */
#nav-spacer {
    background-color: #1e2937;
    transition: height 0.5s cubic-bezier(0.4, 0, 0.2, 1);
}

html, body {
    max-width: 100%;
    overflow-x: hidden;
}

.text-justified-center {
    text-align: justify;
    text-align-last: center;
}

/* ====================== BOUTONS FILTRES GALERIE ====================== */
.filter-btn {
    font-family: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
    letter-spacing: 0.5px;
    font-weight: 500;
    background-color: rgba(248, 243, 234, 0.5);
    border: 1px solid rgba(172, 162, 151, 0.7);
    padding: 10px 24px;
    border-radius: 9999px;
    transition: all 0.35s cubic-bezier(0.4, 0, 0.2, 1);
    box-shadow: 0 2px 6px rgba(123, 104, 82, 0.12);
}

.filter-btn:hover {
    background-color: rgba(248, 243, 234, 0.7);
    border-color: rgba(172, 162, 151, 0.85);
    transform: translateY(-2px);
    box-shadow: 0 5px 12px rgba(123, 104, 82, 0.18);
}

.filter-btn.active {
    background-color: var(--color-marron) !important;
    color: white !important;
    box-shadow: 0 4px 12px rgba(123, 104, 82, 0.3);
}

/* ====================== ALTERNANCE LIGNES MENU ====================== */
.menu-row {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 14px 24px;
    border-bottom: 1px solid #d8c9b8;
    transition: background-color 0.2s ease;
}

@media (max-width: 767px) {
    .menu-row:nth-child(odd) {
        background-color: rgba(0, 0, 0, 0.025);
    }
}

@media (min-width: 768px) {
    .menu-row:nth-child(4n+1),
    .menu-row:nth-child(4n+2) {
        background-color: rgba(0, 0, 0, 0.025);
    }
}

.menu-row:last-child {
    border-bottom: none;
}

.menu-row:hover {
    background-color: rgba(229, 204, 177, 0.25) !important;
}

/* ====================== MENU-LIST ====================== */
.menu-list .menu-row {
    background-color: transparent !important;
}
.menu-list .menu-row:nth-child(odd) {
    background-color: rgba(0, 0, 0, 0.025) !important;
}
.menu-list .menu-row:last-child {
    border-bottom: none;
}
.menu-list .menu-row:hover {
    background-color: rgba(229, 204, 177, 0.25) !important;
}

/* ==================== BOUTONS STICKY MOBILE ==================== */
#sticky-phone,
#back-to-top {
    background-color: rgba(123, 104, 82, 0.09);
    color: #ffffff;
    box-shadow: 0 6px 16px -3px rgba(0, 0, 0, 0.2);
    backdrop-filter: blur(10px);
    border: 1px solid rgba(255,255,255,0.15);
}

#sticky-phone:hover,
#back-to-top:hover {
    background-color: rgba(123, 104, 82, 0.18);
    transform: scale(1.1) translateY(-3px);
}

/* ==================== FIX HERO & NAV ==================== */
.hero-overlap {
    margin-top: -90px;
    transition: margin-top 0.5s cubic-bezier(0.4, 0, 0.2, 1);
}

#main-nav.scrolled ~ #main-content .hero-overlap {
    margin-top: -60px;
}

#main-content {
    padding-top: 60px;
}

/* ====================== CALENDRIER ====================== */
.fc-button {
    color: #7b6852 !important;
    background-color: #f8f3ea !important;
    border-color: #aca297 !important;
}
.fc-button:hover {
    background-color: #ece6dd !important;
    color: #5f523f !important;
}

.fc-col-header-cell {
    background-color: #ece6dd !important;
    color: #5f523f !important;
    font-weight: 600;
    padding: 12px 0 !important;
}

.fc-toolbar-title {
    text-transform: capitalize !important;
    font-weight: 600;
}

.fc-day-today {
    background-color: transparent !important;
}

.fc-daygrid-day-frame,
.fc-daygrid-day {
    height: 60px;
}

/* === Largeur dropdowns === */
#menu-dropdown { width: 239px; }
#locations-dropdown { width: 297px; }

/* ==================== MEDIA QUERIES ==================== */
@media (max-width: 420px) {
    .logo-wrapper img { width: 118px; }
    #main-nav.scrolled .logo-wrapper img { width: 98px; }
}

@media (prefers-reduced-motion: reduce) {
    * { transition-duration: 0.01ms; animation-duration: 0.01ms; }
}

@media (max-width: 768px) {
    #testimonial-dots { margin-top: 50px; }
}