/* ================================================================
   VARIABLES — modifiez ici pour changer les couleurs globalement
   ================================================================ */
:root {
  --noir:   #0a0a0a;
  --or:     #c9a84c;
  --blanc:  #ffffff;
  --filet:  rgba(201,168,76,0.4);
  --font:   "Poiret One", cursive;
}

/* ================================================================
   BASE
   ================================================================ */
* { margin:0; padding:0; box-sizing:border-box; }
html, body { height:100%; }
body {
  background: var(--noir);
  color: var(--blanc);
  font-family: var(--font);
  overflow: hidden;         /* pas de scroll body, scroll dans les pages */
}

/* ================================================================
   NAVIGATION FIXE — toujours visible
   ================================================================ */
nav {
  position: fixed;
  top: 0; left: 0; right: 0;
  z-index: 1000;
  background: rgba(10,10,10,0.97);
  border-bottom: 1px solid var(--filet);
  display: flex;
  justify-content: safe center;
  align-items: center;
  gap: 0;
  padding: 0 1rem;
  height: 56px;
  overflow-x: auto;
  overflow-y: hidden;
  -webkit-overflow-scrolling: touch;
  scrollbar-width: thin;
  scrollbar-color: #c9a84c rgba(255,255,255,0.08);
}
nav::-webkit-scrollbar { height: 5px; }
nav::-webkit-scrollbar-track { background: rgba(255,255,255,0.06); }
nav::-webkit-scrollbar-thumb { background: #c9a84c; border-radius: 3px; }
nav::-webkit-scrollbar-thumb:hover { background: #e0bc5f; }

/* Hamburger - caché par défaut sur desktop */

@media (max-width: 768px) {
  .accueil-h1 { white-space: normal; font-size: 1.15rem; }
  nav { justify-content: flex-start; padding-left: 1.2rem; }
  .pages { top: 56px !important; }
}

.nav-btn {
  font-family: var(--font);
  font-size: 1.062rem;
  letter-spacing: 0.2em;
  color: var(--blanc);
  background: none;
  border: none;
  cursor: pointer;
  padding: 0 1.2rem;
  height: 56px;
  display: flex;
  align-items: center;
  transition: color 0.25s;
  white-space: nowrap;
  position: relative;
  flex-shrink: 0;
}
.nav-btn::after {
  content: "";
  position: absolute;
  bottom: 0; left: 1.2rem; right: 1.2rem;
  height: 2px;
  background: var(--or);
  transform: scaleX(0);
  transition: transform 0.25s;
}
.nav-btn:hover { color: var(--or); }
.nav-btn:hover::after { transform: scaleX(1); }
.nav-btn.actif { color: var(--or); }
.nav-btn.actif::after { transform: scaleX(1); }

.nav-sep {
  color: var(--filet);
  font-size: 0.875rem;
  pointer-events: none;
  padding: 0 0.1rem;
  flex-shrink: 0;
}

/* Bouton Réserver — mis en valeur */
.nav-btn.resa {
  color: var(--noir);
  background: var(--or);
  margin-left: 1rem;
  padding: 0 1.4rem;
  height: 34px;
  font-weight: 700;
  font-size: 0.975rem;
  outline: 1px solid rgba(201,168,76,0.3);
  outline-offset: 3px;
  transition: background 0.25s;
}
.nav-btn.resa::after { display: none; }
.nav-btn.resa:hover { background: var(--or); color: var(--noir); }
.nav-btn.resa.actif { background: var(--or); color: var(--noir); }

/* ================================================================
   PAGES — conteneur
   ================================================================ */
.pages { position: fixed; top: 56px; left:0; right:0; bottom:0; }

.page {
  position: absolute;
  inset: 0;
  overflow-y: auto;
  overflow-x: hidden;
  display: none;
  opacity: 0;
  transition: opacity 0.35s ease;
}
.page.active {
  display: block;
  opacity: 1;
}

/* ================================================================
   PAGE 1 — ACCUEIL
   ================================================================ */
.p-accueil {
  display: none;
  flex-direction: column;
  justify-content: flex-start;
  align-items: center;
  text-align: center;
  width: 100%;
  min-height: auto;
  padding: 0.5rem 2rem 4rem;
  background:
    repeating-linear-gradient(45deg,transparent,transparent 60px,rgba(201,168,76,0.012) 60px,rgba(201,168,76,0.012) 61px);
}
.p-accueil.active { display: flex; }

.accueil-logo {
    width: min(380px, 65vw);
    height: auto;
    margin-top: 0;
    margin-bottom: 1.5rem;
    flex-shrink: 0;
}
.virgule {
  font-size: 1.7em;
  font-weight: 700;
  line-height: 0;
  vertical-align: -0.08em;
  display: inline-block;
}
.accueil-h1 {
  font-family: var(--font);
  font-weight: 400;
  font-size: 1.5rem;
  letter-spacing: 0.08em;
  color: var(--or);
  text-align: center;
  white-space: nowrap;
  margin: 0 auto 1.2rem;
  line-height: 1.4;
}
.accueil-sub {
  margin-bottom: 3rem;
  font-size: 1.0rem;
  letter-spacing: 0.4em;
  color: var(--blanc);
  margin-bottom: 1rem;
}
.accueil-desc {
  text-align: center;
  margin-bottom: 3rem;
  font-size: 1.0625rem;
  letter-spacing: 0.08em;
  color: var(--blanc);
  max-width: 900px;
  line-height: 1.7;
  margin-bottom: 2.5rem;
}
.accueil-btns { display: flex; gap: 1.2rem; flex-wrap: wrap; justify-content: flex-start; }

/* Illustration ligne dorée animée, en tête de page */
.accueil-illu { display: flex; justify-content: center; margin-bottom: 1.5rem; width: 100%; }
.accueil-illu-mask { overflow: hidden; width: 0; }
.accueil-illu-mask svg { width: min(420px, 80vw); display: block; }

/* Encart Semainier "ce soir", aspect dynamique */
.semainier-box {
  border: 2px solid var(--or);
  padding: 1.6rem 2rem;
  margin: 1.5rem auto;
  max-width: 420px;
  text-align: center;
  position: relative;
}
.semainier-label {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  font-size: 0.9375rem;
  letter-spacing: 0.2em;
  color: var(--or);
  text-transform: uppercase;
  margin-bottom: 1rem;
}
.semainier-pastille {
  width: 8px; height: 8px; border-radius: 50%;
  background: var(--or);
  animation: semainier-pulse 1.8s ease-in-out infinite;
}
@keyframes semainier-pulse {
  0%, 100% { opacity: 1; transform: scale(1); }
  50% { opacity: 0.4; transform: scale(0.8); }
}
.semainier-jour {
  font-size: 1.75rem;
  letter-spacing: 0.1em;
  color: var(--blanc);
  margin-bottom: 0.3rem;
}
.semainier-plat {
  font-size: 2.25rem;
  letter-spacing: 0.06em;
  color: var(--or);
  margin-bottom: 1rem;
  line-height: 1.2;
}
.semainier-adresse {
  font-size: 1.0625rem;
  color: var(--blanc);
  letter-spacing: 0.05em;
  margin-bottom: 1.3rem;
}
.semainier-box .btn-or { font-size: 0.9375rem; padding: 0.75rem 1.5rem; text-decoration: none; display: inline-block; }

/* Carrousel actualités, sur l'accueil */
.accueil-actu-entete { text-align: center; margin: 4rem auto 1.2rem; }
.accueil-actu-entete-titre {
  font-size: 1.375rem; font-weight: 400; letter-spacing: 0.15em;
  color: var(--or); margin-bottom: 0.3rem;
}
.accueil-actu-entete-sous {
  font-size: 0.9375rem; letter-spacing: 0.2em; text-transform: uppercase;
  color: var(--blanc); opacity: 0.85;
}
.accueil-actu-carousel { position: relative; max-width: 560px; margin: 0 auto; }

.accueil-actu-dots { display: flex; justify-content: center; gap: 0.7rem; margin-top: 1.1rem; }
.accueil-actu-dot {
  width: 9px; height: 9px; border-radius: 50%; padding: 0;
  background: transparent; border: 1px solid var(--or);
  cursor: pointer; transition: background 0.25s, transform 0.25s;
}
.accueil-actu-dot:hover { background: rgba(201,168,76,0.35); }
.accueil-actu-dot.active { background: var(--or); transform: scale(1.15); }

.accueil-actu-suite { text-align: center; margin-top: 1.8rem; }
.accueil-actu-slide { border: 1px solid var(--filet); padding: 1.4rem 1.4rem 1.8rem; text-align: center; min-height: 140px; display: flex; flex-direction: column; align-items: center; gap: 0.6rem; }
.accueil-actu-media {
  position: relative; width: 100%; aspect-ratio: 16/9; background: #0a0a0a;
  background-size: cover; background-position: center;
  overflow: hidden; cursor: pointer; display: flex; align-items: center; justify-content: center;
  border: 1px solid rgba(201,168,76,0.2); margin-bottom: 0.4rem;
}
.accueil-actu-media img { width: 100%; height: 100%; object-fit: cover; }
.accueil-actu-media .accueil-play {
  width: 46px; height: 46px; border-radius: 50%; background: rgba(201,168,76,0.12);
  border: 1px solid rgba(201,168,76,0.5); display: flex; align-items: center; justify-content: center;
}
.accueil-actu-media .accueil-play::after {
  content: ""; border-top: 9px solid transparent; border-bottom: 9px solid transparent;
  border-left: 15px solid var(--or); margin-left: 3px;
}
.accueil-actu-media .accueil-multi-badge {
  position: absolute; bottom: 6px; right: 6px; background: rgba(10,10,10,0.75); color: var(--or);
  font-size: 0.75rem; letter-spacing: 0.05em; padding: 2px 8px; border: 1px solid rgba(201,168,76,0.3);
}
.accueil-actu-date { font-size: 0.875rem; letter-spacing: 0.2em; color: var(--or); }
.accueil-actu-titre { font-size: 1.25rem; letter-spacing: 0.06em; color: var(--blanc); }
.accueil-actu-texte { font-size: 1rem; color: var(--blanc); opacity: 0.85; line-height: 1.6; }
.accueil-actu-nav {
  position: absolute; top: 50%; transform: translateY(-50%);
  background: rgba(10,10,10,0.85); border: 1px solid rgba(201,168,76,0.4); color: var(--or);
  width: 36px; height: 36px; cursor: pointer; font-size: 1.1rem;
  display: flex; align-items: center; justify-content: center;
}
.accueil-actu-nav.prev { left: -18px; }
.accueil-actu-nav.next { right: -18px; }
@media (max-width: 640px) {
  .accueil-actu-nav.prev { left: -8px; }
  .accueil-actu-nav.next { right: -8px; }
}

/* Lightbox — ouverture en grand des vidéos et carrousels photo depuis l'Accueil */
#actu-lightbox {
  display: none; position: fixed; inset: 0; background: rgba(10,10,10,0.96); z-index: 2000;
  align-items: center; justify-content: center; padding: 2rem 1rem;
}
#actu-lightbox.ouvert { display: flex; }
#actu-lightbox-fermer {
  position: absolute; top: 1.2rem; right: 1.5rem; background: none; border: 1px solid rgba(201,168,76,0.4);
  color: var(--or); width: 40px; height: 40px; font-size: 1.3rem; cursor: pointer;
}
#actu-lightbox-contenu { max-width: min(90vw, 820px); width: 100%; }
#actu-lightbox-contenu iframe { width: 100%; aspect-ratio: 16/9; border: none; display: block; }
.lightbox-carousel-wrap { position: relative; overflow: hidden; }
.lightbox-carousel-track { display: flex; transition: transform 0.4s ease; }
.lightbox-carousel-track img { width: 100%; flex-shrink: 0; object-fit: contain; max-height: 75vh; }



.btn-or {
  background: var(--or);
  color: var(--noir);
  font-family: var(--font);
  font-weight: 700;
  font-size: 1.025rem;
  letter-spacing: 0.2em;
  padding: 0.8rem 2rem;
  border: none;
  cursor: pointer;
  outline: 1px solid rgba(201,168,76,0.25);
  outline-offset: 3px;
  transition: background 0.25s;
}
.btn-or:hover { background: var(--or); }

.btn-contour {
  background: transparent;
  color: var(--or);
  font-family: var(--font);
  font-weight: 700;
  font-size: 1.025rem;
  letter-spacing: 0.2em;
  padding: 0.8rem 2rem;
  border: 1px solid rgba(201,168,76,0.4);
  cursor: pointer;
  outline: 1px solid rgba(201,168,76,0.1);
  outline-offset: 3px;
  transition: border-color 0.25s, color 0.25s;
}
.btn-contour:hover { border-color: var(--or); color: var(--or); }

/* ================================================================
   PAGE 2 — CARTE
   ================================================================ */
.p-carte { padding: 3rem 4rem 4rem; max-width: 900px; margin: 0 auto; }
.p-carte.active { display: block; }

.page-titre {
  font-size: 3.125rem;
  letter-spacing: 0.2em;
  color: var(--or);
  margin-bottom: 0.4rem;
}
.page-sous-titre {
  font-size: 0.9375rem;
  letter-spacing: 0.25em;
  color: var(--blanc);
  margin-bottom: 2rem;
}

/* Onglets carte */
.onglets {
  display: flex;
  gap: 0;
  border-bottom: 1px solid var(--filet);
  margin-bottom: 2.5rem;
}
.onglet {
  font-family: var(--font);
  font-size: 1.025rem;
  letter-spacing: 0.2em;
  color: var(--blanc);
  background: none;
  border: none;
  border-bottom: 2px solid transparent;
  margin-bottom: -1px;
  padding: 0.7rem 1.5rem;
  cursor: pointer;
  transition: color 0.25s, border-color 0.25s;
}
.onglet:hover { color: var(--or); }
.onglet.actif { color: var(--or); border-bottom-color: var(--or); }

.panneau { display: none; }
.panneau.actif { display: block; }

/* Semainier */
.jour-bloc { margin-bottom: 2.8rem; }
.jour-nom {
  font-size: 1.8rem;
  letter-spacing: 0.15em;
  color: var(--or);
  line-height: 1;
  margin-bottom: 1rem;
}
.plats {
  padding-left: 1.8rem;
  border-left: 1px solid rgba(201,168,76,0.3);
}
.plat-ligne {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  padding: 0.65rem 0;
  border-bottom: 1px solid rgba(255,255,255,0.06);
}
.plat-ligne:last-child { border-bottom: none; }
.plat-gauche { display: flex; flex-direction: column; gap: 0.15rem; }
.plat-cat {
  font-size: 0.875rem;
  letter-spacing: 0.28em;
  color: var(--or);
}
.plat-nom {
  font-size: 1.0625rem;
  letter-spacing: 0.06em;
  color: var(--blanc);
}
.plat-prix {
  font-size: 1.0625rem;
  color: var(--or);
  white-space: nowrap;
  margin-left: 2rem;
  letter-spacing: 0.05em;
}
.jour-sep {
  width: 32px; height: 1px;
  background: rgba(201,168,76,0.3);
  margin: 0 0 2.5rem 1.8rem;
}
.ferme-tag {
  font-size: 0.9375rem;
  letter-spacing: 0.25em;
  color: rgba(212,201,168,0.3);
  padding: 0.5rem 0 0.5rem 1.8rem;
}

/* Boissons */
.boissons-grille {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 3rem;
}
.bois-groupe { margin-bottom: 2rem; }
.bois-titre {
  font-size: 1.625rem;
  letter-spacing: 0.15em;
  color: var(--or);
  margin-bottom: 1rem;
  padding-bottom: 0.5rem;
  border-bottom: 1px solid var(--filet);
}
.bois-item {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  padding: 0.6rem 0;
  border-bottom: 1px solid rgba(255,255,255,0.05);
}
.bois-item:last-child { border-bottom: none; }
.bois-gauche {}
.bois-nom { font-size: 1.0625rem; letter-spacing: 0.06em; color: var(--blanc); }
.bois-desc { font-size: 0.875rem; letter-spacing: 0.1em; color: var(--blanc); margin-top: 0.1rem; }
.bois-millesime { font-size: 0.875rem; color: rgba(201,168,76,0.65); }
.bois-millesime:not(:empty)::before { content: " · "; color: rgba(201,168,76,0.4); }
.wine-millesime { font-size: 0.8125rem; color: rgba(201,168,76,0.6); display: block; }
.bois-prix { font-size: 1.0625rem; color: var(--or); white-space: nowrap; margin-left: 1.5rem; }

/* ================================================================
   PAGE 4 — HISTOIRE
   ================================================================ */
.p-histoire { padding: 3rem 4rem 4rem; max-width: 960px; margin: 0 auto; }
.p-histoire.active { display: block; }

.histoire-grille {
  display: grid;
  grid-template-columns: 1fr 1.3fr;
  gap: 4rem;
  align-items: start;
  margin-top: 2rem;
}
.histoire-photo {
  aspect-ratio: 3/4;
  background: #181818;
  border: 1px dashed rgba(201,168,76,0.25);
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
  gap: 0.8rem;
  color: rgba(201,168,76,0.35);
}
.histoire-photo span { font-size: 0.875rem; letter-spacing: 0.2em; }
.histoire-texte { display: flex; flex-direction: column; gap: 1.2rem; }
.histoire-citation {
  font-size: 1.875rem;
  letter-spacing: 0.06em;
  color: var(--or);
  line-height: 1.5;
  border-left: 2px solid var(--or);
  padding-left: 1.2rem;
  margin: 0.5rem 0;
}
.histoire-texte p {
  font-size: 1.062rem;
  letter-spacing: 0.06em;
  color: var(--blanc);
  line-height: 2;
}

/* ================================================================
   PAGE 5 — ACTUALITES
   ================================================================ */
.p-journal { padding: 3rem 4rem 4rem; }
.p-journal.active { display: block; }

.actu-grille {
  display: grid;
  grid-template-columns: repeat(3,1fr);
  gap: 1.5rem;
  margin-top: 2rem;
}
.actu-card {
  border: 1px solid var(--filet);
  padding: 1.8rem;
  display: flex;
  flex-direction: column;
  gap: 0.8rem;
  transition: border-color 0.25s;
  cursor: default;
}
.actu-card:hover { border-color: rgba(201,168,76,0.6); }
.actu-visuel {
  aspect-ratio: 16/9;
  background: #181818;
  border: 1px dashed rgba(201,168,76,0.2);
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 0.875rem;
  letter-spacing: 0.18em;
  color: rgba(201,168,76,0.3);
  margin-bottom: 0.3rem;
}
.actu-date { font-size: 0.875rem; letter-spacing: 0.2em; color: var(--or); }
.actu-titre { font-size: 1.5rem; letter-spacing: 0.08em; color: var(--blanc); line-height: 1.3; }
.actu-texte { font-size: 1.0625rem; letter-spacing: 0.06em; color: var(--blanc); line-height: 1.9; }

/* ================================================================
   PAGE 6 — CONTACT & HORAIRES
   ================================================================ */
.p-contact { padding: 3rem 4rem 4rem; max-width: 860px; margin: 0 auto; }
.p-contact.active { display: block; }

.contact-grille {
  display: grid;
  grid-template-columns: 1fr 1fr 1fr;
  gap: 0;
  margin-top: 2rem;
  border: 1px solid var(--filet);
}
.contact-bloc {
  padding: 2.5rem 2rem;
  border-right: 1px solid var(--filet);
  display: flex;
  flex-direction: column;
  gap: 0.8rem;
}
.contact-bloc:last-child { border-right: none; }
.contact-icone { font-size: 1.5rem; color: var(--or);  }
.contact-bloc h3 { font-size: 1.625rem; letter-spacing: 0.15em; color: var(--or); }
.contact-bloc p { font-size: 0.975rem; letter-spacing: 0.08em; color: var(--blanc); line-height: 2.1; }
.contact-bloc a { color: var(--or); text-decoration: none; }
.contact-bloc a:hover { color: var(--or); }
.social-liens { display: flex; flex-direction: column; gap: 0.6rem; margin-top: 0.4rem; }
.social-btn {
  font-family: var(--font);
  font-size: 0.9rem;
  letter-spacing: 0.15em;
  color: var(--or);
  border: 1px solid rgba(201,168,76,0.3);
  padding: 0.5rem 0.9rem;
  text-decoration: none;
  display: inline-flex;
  align-items: center;
  gap: 0.4rem;
  outline: 1px solid rgba(201,168,76,0.08);
  outline-offset: 2px;
  transition: border-color 0.25s, background 0.25s;
  width: fit-content;
}
.social-btn:hover { border-color: var(--or); background: rgba(201,168,76,0.06); }

/* ================================================================
   PIED DE PAGE
   ================================================================ */
.footer-bar {
  position: fixed;
  bottom: 0; left: 0; right: 0;
  height: 36px;
  background: rgba(10,10,10,0.97);
  border-top: 1px solid var(--filet);
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 0 2rem;
  z-index: 999;
}
.footer-nom { font-size: 1.062rem; letter-spacing: 0.15em; color: var(--or);  }
.footer-copy { font-size: 0.875rem; letter-spacing: 0.1em; color: var(--blanc); text-transform: uppercase; }

/* Ajustement espace footer */
.page { bottom: 36px !important; }

/* Animations */
@keyframes fadeUp { from{opacity:0;transform:translateY(18px)} to{opacity:1;transform:translateY(0)} }
.anim { animation: fadeUp 0.5s ease both; }
.anim-2 { animation: fadeUp 0.5s ease 0.1s both; }
.anim-3 { animation: fadeUp 0.5s ease 0.2s both; }


/* MOBILE */
#mob-btn { display:none; flex-direction:column; gap:5px; background:none; border:none; cursor:pointer; padding:8px; position:absolute; right:1rem; top:50%; transform:translateY(-50%); z-index:1002; }
#mob-btn span { display:block; width:24px; height:2px; background:#c9a84c; }
#mob-menu { display:none; position:fixed; top:56px; left:0; right:0; background:rgba(10,10,10,0.99); border-bottom:1px solid rgba(201,168,76,0.4); flex-direction:column; z-index:1001; padding:0.5rem 0 1rem; }
#mob-menu a { font-family:"Poiret One",cursive; font-size:1rem; letter-spacing:0.15em; color:#fff; background:none; border:none; border-top:1px solid rgba(201,168,76,0.08); padding:1rem 2rem; text-align:center; cursor:pointer; width:100%; display:block; text-decoration:none; box-sizing:border-box; }
#mob-menu .mob-r { background:#c9a84c; color:#0a0a0a; font-weight:700; margin:0.8rem 1.5rem 0; width:calc(100% - 3rem); border-top:none; }
#mob-logo { display:none; font-family:"Poiret One",cursive; font-size:1.2rem; letter-spacing:0.15em; color:#c9a84c; }

@media(max-width:768px){
  #mob-btn { display:flex; }
  #mob-logo { display:block; }
  nav .nav-btn, nav .nav-sep { display:none; }
  nav { justify-content:center; position:relative; }

  /* Pages - padding pour éviter coupures */
  .p-carte,.p-contact,.p-journal { padding:3.5rem 1rem 5rem !important; }
  .p-histoire { padding:3.5rem 1rem 5rem !important; }

  /* Accueil */
  .accueil-btns { flex-direction:column; align-items:center; margin-bottom:2rem; }

  /* Notre Histoire - photo puis texte pleine largeur */
  .histoire-grille { grid-template-columns:1fr !important; gap:1.5rem !important; }
  .histoire-texte { width:100% !important; max-width:100% !important; }

  /* Carte */
  .actu-grille { grid-template-columns:1fr !important; }
  .onglets { overflow-x:auto; -webkit-overflow-scrolling:touch; }
  .onglet { min-width:auto; padding:0.7rem 1rem; font-size: 0.875rem; }
  /* Contact */
  .contact-grille { grid-template-columns:1fr !important; }
  .contact-sep { display:none !important; }
  .contact-bloc { border-right:none !important; border-bottom:1px solid rgba(201,168,76,0.12); }

  /* Footer */
  .footer-bar { flex-direction:column; height:auto; padding:0.8rem; gap:0.3rem; }
  .pages { bottom:0 !important; }
}

#t-vins .bois-nom { font-size: 1.0625rem; }
#t-vins .bois-prix { font-size: 1.0625rem; }

.wine-table { width:100%; border-collapse:collapse; margin-top:0.5rem; }
.wine-table th { font-size: 0.9375rem; letter-spacing:0.15em; color:#c9a84c; text-align:center; padding:0.6rem 0.5rem; border-bottom:1px solid rgba(201,168,76,0.3); white-space:nowrap; }
.wine-table th:first-child { text-align:left; }
.wine-table td { font-size: 1.0625rem; color:#ffffff; padding:0.5rem 0.5rem; border-bottom:1px solid rgba(255,255,255,0.05); vertical-align:middle; }
.wine-table td:not(:first-child) { color:#c9a84c; text-align:center; white-space:nowrap; }
.wine-table .wine-cat { font-size: 0.9375rem; letter-spacing:0.2em; color:#c9a84c; text-transform:uppercase; padding:0.8rem 0.5rem 0.3rem; font-family:"Poiret One",cursive; text-align:left; }
.wine-table tr:last-child td { border-bottom:none; }
.vbt { width:100%; border-collapse:collapse; margin-top:0.5rem; }
.vbt td { font-size: 0.875rem; padding:0.45rem 0.5rem; border-bottom:1px solid rgba(255,255,255,0.05); vertical-align:middle; }
.vbt td:last-child { color:#e8c97a; text-align:right; white-space:nowrap; padding-left:1rem; }
.vbt td:first-child { color:#ffffff; }
.vbt .vbt-cat { font-size: 0.875rem; letter-spacing:0.2em; color:#c9a84c; text-transform:uppercase; padding:0.8rem 0.5rem 0.3rem; font-family:"Poiret One",cursive; text-align:left; }

.wine-scroll-wrap { position:relative; }
.wine-scroll-track {
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
  scrollbar-width: auto;
  scrollbar-color: #c9a84c rgba(201,168,76,0.12);
  padding-bottom: 0.5rem;
}
.wine-scroll-track::-webkit-scrollbar { height: 10px; }
.wine-scroll-track::-webkit-scrollbar-track { background: rgba(201,168,76,0.12); border-radius: 5px; }
.wine-scroll-track::-webkit-scrollbar-thumb { background: #c9a84c; border-radius: 5px; }
.wine-scroll-hint {
  display: none;
  text-align: center;
  font-family: "Poiret One", cursive;
  font-size: 0.875rem;
  letter-spacing: 0.08em;
  color: #c9a84c;
  margin-top: 0.5rem;
}
@media (max-width: 768px) {
  .wine-scroll-hint { display: block; }
}
@media(max-width:768px){
    .wine-table { min-width:560px !important; }
}

@media (max-width: 768px) {
  .p-accueil {
    padding: 1rem 1rem 6rem;
  }

  .accueil-logo {
    display: block;
    width: 82vw;
    max-width: 360px;
    margin: 0 auto 1.5rem;
  }
  
 .accueil-h1 {
    white-space: normal !important;
    height: auto !important;
    max-height: none !important;
    overflow: visible !important;
    line-height: 1.45 !important;
    padding-bottom: 0.2rem;
  }
  .accueil-btns {
    margin-bottom: 5rem !important;
  }

  .page {
    bottom: 70px !important;
  }
}
/* PAGE L'AMBIANCE */

.ambiance-page {
  max-width: 900px;
}

.ambiance-intro {
  font-size: 1.05rem;
  letter-spacing: 0.1em;
  line-height: 1.7;
  margin: 0.8rem 0 3rem;
}

.ambiance-questions {
  display: flex;
  flex-direction: column;
}

.ambiance-bloc {
  padding: 2.4rem 0;
  border-top: 1px solid var(--filet);
}

.ambiance-bloc:last-child {
  border-bottom: 1px solid var(--filet);
}

.ambiance-bloc h3 {
  color: var(--or);
  font-size: 1.75rem;
  font-weight: 400;
  letter-spacing: 0.1em;
  line-height: 1.4;
  margin-bottom: 1.4rem;
}

.ambiance-bloc p {
  color: var(--blanc);
  font-size: 1.08rem;
  letter-spacing: 0.05em;
  line-height: 1.9;
  margin-bottom: 1rem;
}

.ambiance-bloc p:last-child {
  margin-bottom: 0;
}

.ambiance-citation {
  color: var(--or) !important;
  font-size: 1.35rem !important;
  padding-left: 1.2rem;
  border-left: 2px solid var(--or);
}

@media (max-width: 768px) {
  .ambiance-page {
    padding: 3rem 1.2rem 5rem !important;
  }

  .ambiance-intro {
    margin-bottom: 2rem;
  }

  .ambiance-bloc {
    padding: 2rem 0;
  }

  .ambiance-bloc h3 {
    font-size: 1.4rem;
  }

  .ambiance-bloc p {
    font-size: 1rem;
    line-height: 1.8;
  }
}
/* ================================================================
   PAGE MENU DU JOUR
   ================================================================ */

.p-menu {
  padding: 5.5rem 4rem 9rem;
}

.menu-du-jour {
  width: 100%;
  max-width: 900px;
  margin: 0 auto;
}

.menu-header {
  margin-bottom: 3.6rem;
}

.p-menu .page-titre {
  margin-bottom: 0.45rem;
}

.menu-date {
  display: block;
  color: var(--blanc);
  font-size: 1rem;
  letter-spacing: 0.18em;
  line-height: 1.5;
}

.menu-intro {
  max-width: 760px;
  margin: 2.5rem 0 0;
  color: var(--blanc);
  font-size: 1.08rem;
  letter-spacing: 0.045em;
  line-height: 1.9;
}

.menu-contenu {
  border-top: 1px solid var(--filet);
}

.menu-service {
  padding: 2.1rem 0 2.25rem;
  border-bottom: 1px solid var(--filet);
}

.menu-categorie {
  margin: 0 0 0.85rem;
  color: var(--or);
  font-size: 0.88rem;
  font-weight: normal;
  letter-spacing: 0.28em;
  text-transform: uppercase;
}

.menu-plat {
  margin: 0;
  color: var(--blanc);
  font-size: 1.0625rem;
  letter-spacing: 0.045em;
  line-height: 1.55;
}

.menu-reservation {
  margin-top: 3.5rem;
  text-align: center;
}

.p-menu .btn-or {
  display: inline-block;
  text-decoration: none;
}


/* ================================================================
   MENU DU JOUR — MOBILE
   ================================================================ */

@media (max-width: 768px) {

  .p-menu {
    padding: 4rem 1.3rem 7rem;
  }

  .menu-header {
    margin-bottom: 2.6rem;
  }

  .menu-date {
    font-size: 0.9375rem;
    letter-spacing: 0.14em;
  }

  .menu-intro {
    margin-top: 2rem;
    font-size: 1rem;
    letter-spacing: 0.025em;
    line-height: 1.8;
  }

  .menu-service {
    padding: 1.7rem 0 1.8rem;
  }

  .menu-categorie {
    font-size: 0.8rem;
    letter-spacing: 0.24em;
  }

  .menu-plat {
    font-size: 1.0625rem;
    line-height: 1.5;
  }

  .menu-reservation {
    margin-top: 3rem;
  }
}

/* ================================================================
   BANDEAU ANNONCE — filet simple, cohérent avec nav / onglets / footer
   Affiché uniquement si une annonce est active (voir includes/header.php)
   ================================================================ */
.annonce-bandeau {
  border-top: 1px solid var(--filet);
  border-bottom: 1px solid var(--filet);
  padding: 1rem 1.5rem;
  margin: 0 auto 2rem;
  text-align: center;
  font-size: 1.0625rem;
  letter-spacing: 0.05em;
  color: var(--blanc);
  max-width: 700px;
  line-height: 1.6;
}

/* ================================================================
   ILS PARLENT DE NOUS — avis clients, cadre fermé (même famille que
   .actu-card / .contact-bloc, éléments répétés côte à côte)
   ================================================================ */
.avis-section { margin-top: 3.5rem; }
.avis-titre {
  font-size: 1.3rem;
  letter-spacing: 0.15em;
  color: var(--or);
  text-align: center;
  margin-bottom: 2rem;
}
.avis-grille {
  display: grid;
  grid-template-columns: repeat(3,1fr);
  gap: 1.5rem;
}
.avis-carte {
  border: 1px solid var(--filet);
  padding: 1.8rem;
  display: flex;
  flex-direction: column;
  gap: 0.8rem;
  transition: border-color 0.25s;
}
.avis-carte:hover { border-color: rgba(201,168,76,0.6); }
.avis-etoiles { color: var(--or); font-size: 1rem; letter-spacing: 0.15em; }
.avis-texte { font-size: 1.0625rem; color: var(--blanc); line-height: 1.7; flex-grow: 1; }
.avis-nom { font-size: 0.9rem; letter-spacing: 0.1em; color: var(--or); }
.avis-google {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  margin-top: 0.4rem;
  padding-top: 0.8rem;
  border-top: 1px solid rgba(201,168,76,0.15);
  font-size: 0.8rem;
}
.avis-google img { width: 16px; height: 16px; }
.avis-google a { color: var(--or); text-decoration: none; opacity: 0.8; letter-spacing: 0.05em; }
.avis-google a:hover { opacity: 1; }

@media (max-width: 768px) {
  .avis-grille { grid-template-columns: 1fr; }
}