/* Police Raleway */
@import url('https://fonts.googleapis.com/css2?family=Raleway:wght@400;500;700&display=swap');

/* Anti-flicker */
.page-accueil {
  opacity: 0;
  transition: opacity 0.3s ease-in;
}
.page-accueil.loaded {
  opacity: 1;
}

/* Base */
html, body {
  margin: 0;
  padding: 0;
  overflow-x: hidden;
  background: white;
  font-family: 'Raleway', sans-serif;
}

h1.entry-title {
  display: none;
}

/* === PRELOADER === */
#preloader {
  position: fixed;
  z-index: 9999;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: black;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: opacity 0.2s ease;
}

#preloader img {
  width: 200px;
  animation: zoomIn 0.4s ease forwards;
}

@keyframes zoomIn {
  0% {
    transform: scale(1);
    opacity: 0.8;
  }
  100% {
    transform: scale(3);
    opacity: 1;
  }
}

body.loaded #preloader {
  opacity: 0;
  pointer-events: none;
}

@media (max-width: 768px) {
  #preloader {
    display: none !important;
  }
}

/* === HEADER ACCUEIL === */
.hero-accueil {
  position: relative;
  height: 100vh;
  width: 100%;
  overflow: hidden;
  font-family: 'Raleway', sans-serif;
  color: white;
  text-align: center;
}

/* Vidéo fond */
.hero-accueil .hero-bg-video {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  z-index: 1;
}

/* Logo */
.hero-accueil .hero-logo-img {
  width: 100vw;
  height: auto;
  display: block;
  margin: 10px auto 20px auto;
  z-index: 2;
  position: relative;
}

/* Menu desktop */
.hero-accueil .hero-menu {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 20px;
  z-index: 2;
  position: relative;
  margin-bottom: 30px;
}
.hero-accueil .hero-menu a {
  color: white;
  text-decoration: none;
  font-weight: 700;
  font-size: 16px;
  text-transform: uppercase;
}
.hero-accueil .hero-menu a:hover {
  text-decoration: underline;
}

/* Bouton centré */
.hero-accueil .hero-center {
  position: absolute;
  top: 60%;
  left: 50%;
  transform: translate(-50%, -50%);
  font-size: 40px;
  font-weight: 800;
  z-index: 2;
  text-transform: uppercase;
}
.hero-accueil .btn-reserver {
  background-color: transparent;
  color: white;
  padding: 15px 30px;
  border: 2px solid white;
  font-size: 20px;
  font-weight: 700;
  text-transform: uppercase;
  cursor: pointer;
  text-decoration: none;
  border-radius: 8px;
  transition: all 0.3s ease;
}
.hero-accueil .btn-reserver:hover {
  background-color: white;
  color: #111;
}

/* Mentions bas */
.hero-accueil .hero-bottom-left,
.hero-accueil .hero-bottom-right {
  position: absolute;
  bottom: 30px;
  font-size: 16px;
  font-weight: 700;
  z-index: 3;
  color: white;
}
.hero-accueil .hero-bottom-left {
  left: 30px;
}
.hero-accueil .hero-bottom-right {
  right: 30px;
}

/* Burger menu icon */
#burgerIconAccueil {
  display: none;
}

/* === Responsive / Menu mobile === */
@media (max-width: 768px) {
  .hero-accueil .hero-menu {
    display: none;
  }

  #burgerIconAccueil {
    display: block;
    font-size: 32px;
    color: white;
    position: fixed;
    top: 110px;
    right: 25px;
    z-index: 100;
    cursor: pointer;
  }

  #mobileMenuAccueil {
    display: none;
    flex-direction: column;
    position: fixed;
    top: 0;
    right: 0;
    width: 80%;
    height: 100%;
    background: rgba(0, 0, 0, 0.95);
    padding: 80px 30px;
    z-index: 99;
  }

  #mobileMenuAccueil.open {
    display: flex;
  }

  #mobileMenuAccueil a {
    color: white;
    text-decoration: none;
    font-size: 20px;
    padding: 15px 0;
    text-transform: uppercase;
    font-weight: 700;
  }

  /* Supprimer bouton play sur mobile */
  .hero-bg-video {
    pointer-events: none;
  }

  .hero-bg-video::-webkit-media-controls {
    display: none !important;
  }

  .hero-bg-video::-webkit-media-controls-start-playback-button {
    display: none !important;
    -webkit-appearance: none;
  }
}

/* === SECTION 3 === */
.section-3 {
  background: white;
  width: 100%;
  max-width: 1200px;
  margin: 0 auto;
  padding: 80px 20px;
  color: black;
  position: relative;
}

.contenu-qui {
  display: flex;
  gap: 60px;
  align-items: flex-start;
  position: relative;
}

.col-gauche {
  flex: 1;
  position: relative;
  height: 500px;
}

.col-gauche img {
  position: absolute;
  left: 0;
  top: 0;
  width: 100vw;
  height: 100%;
  object-fit: cover;
  border-radius: 0;
  z-index: 1;
}

.titre-superpose {
  position: absolute;
  top: 5px;
  left: 55%;
  transform: translateX(-57%);
  font-size: 80px;
  font-weight: 800;
  color: black;
  line-height: 1.1;
  z-index: 3;
  text-align: right;
  width: 100%;
}

.col-droite {
  flex: 2;
  padding-top: 100px;
  z-index: 2;
  position: relative;
	top:100px; 
}

.col-droite p {
  font-size: 18px;
  line-height: 1.8;
  margin-bottom: 1px;
}

.apropos-label {
  font-size: 10px;
  font-weight: 600;
  letter-spacing: 1.5px;
  text-transform: uppercase;
  margin: 30px 0 6px 0;
  display: inline-block;
  color: black;
}
@media (max-width: 768px) {
  .section-3 .contenu-qui {
    flex-direction: column;
    align-items: flex-start;
    gap: 20px;
    padding: 0 20px;
    position: relative;
  }

  .section-3 .col-gauche {
    width: 100%;
    height: auto;
    margin: 0;
    position: relative;
  }

  .section-3 .col-gauche img {
    display: block;
    position: relative;
    width: 50%; /* ou 70% si tu veux un peu plus grand */
    height: auto;
    object-fit: cover;
    margin-left: -40px; /* ✅ collé à gauche */
    margin-top: -30px; /* ✅ remonte si nécessaire */
    z-index: 1;
  }

  .section-3 .titre-superpose {
    display: block;
    position: absolute;
    top: 70px;
    left: 35px;
    transform: none;
    font-size: 40px;
    font-weight: 800;
    line-height: 1.2;
    text-align: right;
    z-index: 3;
    max-width: 90%;
    white-space: normal;
  }

  .section-3 .col-droite {
    padding: 5px;
    text-align: left;
    width: 100%;
		top:1px;
  }

  .section-3 .col-droite p {
    font-size: 15px;
    line-height: 1.6;
    margin-bottom: 1px;
		
  }
}
/* === SECTION 4 === */
.section-4 {
  background: white;
  padding: 4px 10px;
  text-align: center;
  margin-top: -30px;
  overflow: hidden; /* on masque ce qui dépasse */
}

.galerie {
  display: flex;
  gap: 5px;
  animation: scrollGallery 10s linear infinite; /* vitesse ajustable */
}

.galerie img {
  width: 250px;
  height: 180px;
  object-fit: cover;
  flex-shrink: 0;
  border-radius: 0px;
  margin-right: 5px;
  transition: transform 0.3s ease;
}

.galerie img:hover {
  transform: scale(1.05);
}

@keyframes scrollGallery {
  0% {
    transform: translateX(0);
  }
  100% {
    transform: translateX(-50%);
  }
}
/* === RESPONSIVE MOBILE === */
@media (max-width: 768px) {
	.section-4 {
    margin-top: 40px; /
  }
  .galerie {
    animation: scrollGalleryMobile 15s linear infinite; /* + rapide en mobile */
  }

  .galerie img {
    width: 140px; /* images plus petites en mobile */
    height: 130px;
  }

  @keyframes scrollGalleryMobile {
    0% {
      transform: translateX(0);
    }
    100% {
      transform: translateX(-50%);
    }
  }
}

/* === SECTION 5 : Adresses en colonnes === */
.section-5 {
  display: flex;
  flex-wrap: wrap;
  font-family: 'Raleway', sans-serif;
  text-align: center;
  color: white;
}

.adresse {
  flex: 1;
  padding: 60px 30px;
}

.adresse.gauche,
.adresse.droite {
  background-color: white;
}

.accent-bordeaux {
  color: #6D1A36;
  font-weight: bold;
}

.accent-vert {
  color: #009E60;
  font-weight: bold;
}

.sr-only {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}
@media (max-width: 768px) {
  .section-5 {
    flex-direction: column;
    padding: 0;
  }

  .adresse {
    padding: 30px 20px; /* un padding plus petit */
    text-align: center;
  }

  .adresse p {
    font-size: 10px; /* texte plus petit */
    font-weight: 700; /* on garde le gras (bold), pas regular ! */
    line-height: 1.6;
    margin-bottom: 8px;
  }

  .accent-bordeaux,
  .accent-vert {
    font-size: 12px; /* si tu veux que l’accent soit un peu plus gros que le texte normal */
    font-weight: 700;
  }
}
.btn-reserver-container {
  margin-top: 20px;
  text-align: center;
}

.btn-reserver-secondaire {
  background-color: transparent;
  color: black;
  padding: 12px 26px;
  border: 2px solid black;
  font-size: 16px;
  font-weight: 700;
  text-transform: uppercase;
  text-decoration: none;
  border-radius: 6px;
  transition: all 0.3s ease;
  display: inline-block;
}

.btn-reserver-secondaire:hover {
  background-color: black;
  color: white;
}

@media (max-width: 768px) {
  .btn-reserver-secondaire {
    font-size: 14px;
    padding: 10px 20px;
  }
}
@media (min-width: 769px) {
  .section-5 {
    align-items: flex-end;
  }

  .adresse {
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    min-height: 480px; /* adapte si besoin */
  }

  .btn-reserver-container {
    margin-top: auto;
    padding-top: 20px;
  }
}

/* === PÉPÉ RONCHON PIZZA HEADER — CSS === */
@import url('https://fonts.googleapis.com/css2?family=Raleway:wght@400;500;700&display=swap');

.hero-pizza {
  position: relative;
  height: 100vh;
  width: 100%;
  overflow: hidden;
  font-family: 'Raleway', sans-serif;
  color: white;
  text-align: center;
}

.hero-bg-img {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  z-index: 1;
}

.hero-logo-img {
  width: 100vw;
  height: auto;
  display: block;
  margin: 10px auto 20px auto;
  z-index: 2;
  position: relative;
}

.hero-menu {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 20px;
  z-index: 2;
  position: relative;
  margin-bottom: 30px;
  font-family: 'Raleway', sans-serif;
}

.hero-menu a {
  color: white;
  text-decoration: none;
  font-weight: 700;
  font-size: 16px;
  text-transform: uppercase;
}

.hero-menu a:hover {
  text-decoration: underline;
}

.hero-title {
  position: absolute;
  top: -9999px;
  left: -9999px;
}

.hero-center {
  position: absolute;
  top: 60%;
  left: 50%;
  transform: translate(-50%, -50%);
  font-size: 40px;
  font-weight: 800;
  z-index: 2;
  font-family: 'Raleway', sans-serif;
  color: white;
  text-transform: uppercase;
	text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.3); 
}

.hero-bottom-left,
.hero-bottom-right {
  position: absolute;
  bottom: 30px;
  font-size: 16px;
  font-weight: 700;
  z-index: 2;
  font-family: 'Raleway', sans-serif;
}

.hero-bottom-left {
  left: 30px;
}

.hero-bottom-right {
  right: 30px;
}

/* === BURGER ICON  === */
.burger-icon {
  display: none;
}

/* === RESPONSIVE — max 768px === */
@media (max-width: 768px) {
  .hero-logo-img {
    width: 100%;
    height: auto;
  }

  .hero-menu {
    display: none;
  }

  .hero-center {
    font-size: 20px;
  }

  .hero-bottom-left,
  .hero-bottom-right {
    font-size: 14px;
    bottom: 15px;
  }

  .burger-icon {
    display: block;
    font-size: 32px;
    color: white;
    position: fixed;
    top: 110px;
    right: 25px;
    z-index: 100;
    cursor: pointer;
  }

  .mobile-menu {
    display: none;
    flex-direction: column;
    position: fixed;
    top: 0;
    right: 0;
    width: 80%;
    height: 100%;
    background: rgba(0, 0, 0, 0.95);
    padding: 80px 30px;
    z-index: 99;
  }

  .mobile-menu.open {
    display: flex;
  }

  .mobile-menu a {
    color: white;
    text-decoration: none;
    font-size: 20px;
    padding: 15px 0;
    text-transform: uppercase;
    font-weight: 700;
  }
}
/* PRESENTATION PIZZA */
/* ========================= */
.section-pizza-layout {
  background: white;
  width: 100%;
  max-width: 1200px;
  margin: 0 auto;
  padding: 80px 20px;
  color: #007a47;
  position: relative;
  font-family: 'Raleway', sans-serif;
}

.pizza-col-gauche {
  flex: 1;
  position: relative;
  height: 500px;
}

.pizza-col-gauche img {
  position: absolute;
  top: 0;
  left: 0;
  width: 100vw;
  height: 100%;
  object-fit: cover;
  border-radius: 0;
  z-index: 1;
}

.citation-intro {
  position: absolute;
  top: -70px;
  left: 20px;
  font-size: 10px;
  font-style: italic;
  color:   color: #007a47;
  z-index: 9;
}

.titre-superpose-pizza {
  position: absolute;
  top: -70px;
  left: 130%;
  transform: translateX(-40%);
  font-size: 70px;
  font-weight: 800;
  color: #007a47;
  color: ;
  line-height: 1.1;
  z-index: 3;
  text-align: left;
  width: 150%;
}

.pizza-col-droite {
  flex: 2;
  padding-top: 180px;
  z-index: 2;
  position: relative;
}

.pizza-col-droite p {
  font-size: 18px;
  line-height: 1.6;
  margin-bottom: 16px;
}

.pizza-col-droite a {
  display: inline-block;
  font-weight: 700;
  color: #007a47;
  text-decoration: underline;
  margin-top: 20px;
}
/* ========================= */
/* 📱 CSS RESPONSIVE MOBILE  */
/* ========================= */
@media (max-width: 768px) {
  .pizza-col-gauche {
    height: auto;
    position: relative;
  }

  .pizza-col-gauche img {
    display: block;
    position: left;
    width: 60%;
    height: auto;
    object-fit: cover;
    border-radius: 0;
    margin-left:-40px;
    z-index: 1;
  }

.citation-intro {
  display: block;
	font-size: 10px;
  font-style: italic;
  color: #007a47;
  margin: 0 20px 5px 20px; /* plus serré avec image du haut */
  padding: 0;
  text-align: left;
  z-index: 3;
}

  .titre-superpose-pizza {
    display: block;
    position: relative;
    top: -50px; 
    left: 18%;
    transform: none;
    font-size: 40px;
    font-weight: 800;
    color: #007a47;
    line-height: 1.1;
    text-align: left;
    margin: 10px 20px 0 20px;
    padding: 0;
    z-index: 3;
  }

  .pizza-col-droite {
    padding: 0 0px;
    text-align: left;
    margin-top: 30px;
  }

  .pizza-col-droite p {
    font-size: 14px;
    line-height: 1.6;
    margin-bottom: 8px;
  }

  .pizza-col-droite a {
    font-size: 16px;
    font-weight: 700;
    color: #007a47;
    text-decoration: underline;
    margin-top: 10px;
    display: inline-block;
  }
}
/* === BOUTON MENU PIZZA === */
.pizza-bouton-align {
  text-align: right;
  margin-top: 20px;
  padding-right: 20px;
}

.btn-pizza-solid {
  display: inline-block;
  background-color: transparent;
  border: 2px solid #007a47;
  color: #007a47;
  font-weight: 700;
  padding: 12px 26px;
  font-size: 16px;
  border-radius: 6px;
  transition: all 0.3s ease;
  font-family: 'Raleway', sans-serif;
}

.btn-pizza-solid:hover {
  background-color: #007a47;
  color: white;
}

.zc-widget-button {
  background-color: #007a47 !important;
  border-color: #007a47 !important;
  color: white !important;
  font-family: 'Raleway', sans-serif !important;
  text-decoration: none !important;
  font-weight: 600 !important;
  border-radius: 30px !important;
  transition: all 0.3s ease !important;
}


@media (max-width: 768px) {
  .pizza-bouton-align {
    text-align: left;
    padding-right: 0;
  }

  .btn-pizza-solid {
    font-size: 16px;
    font-weight: 700;
    text-decoration: none;
  }

  .zc-widget-button {
    transform: scale(0.85);
    bottom: 20px !important;
    right: 20px !important;
    background-color: #007a47 !important;
    border-color: #007a47 !important;
    color: white !important;
  }
}

/* === SECTION BESTSELLERS PIZZA === */
.menu-section-pizza {
  position: relative;
  max-width: 1200px;
  margin: 0 auto;
  padding: 0 20px;
  display: flex;
  flex-direction: column;
  font-family: 'Raleway', sans-serif;
}

/* === TITRE === */
.menu-header-pizza h2 {
  font-size: 70px;
  font-weight: 800;
  line-height: 1.1;
  color: #007a47;
  margin: 0;
  z-index: 2;
  position: relative;
}

.menu-header-pizza .part1 {
  display: inline-block;
  transform: translate(270px, -120px);
  position: relative;
}

.menu-header-pizza .part2 {
  display: inline-block;
  transform: translate(550px, -130px);
  position: relative;
}

/* TABLETTE */
@media (min-width: 768px) and (max-width: 1024px) {
  .menu-header-pizza .part1 {
    transform: translate(120px, -90px);
  }

  .menu-header-pizza .part2 {
    transform: translate(390px, -110px);
  }
} 
/* MOBILE */
@media (max-width: 768px) {
  .menu-header-pizza {
    margin-top: 100px;
    padding-left: 0;
  }

  .menu-header-pizza h2 {
    margin: 0;
    padding: 0;
    display: block;
  }

  .menu-header-pizza .part1,
  .menu-header-pizza .part2 {
    display: block;
    font-size: 48px;
    font-weight: 800;
    color: #007a47;
    line-height: 1.1;
    position: relative;
    margin: 0;
    padding: 0;
  }

  .menu-header-pizza .part1 {
    transform: translateX(20px);
    margin-bottom: 5px;
  }

  .menu-header-pizza .part2 {
    transform: translateX(40px);
    margin-bottom: 30px;
  }
}
/* === DESCRIPTION === */
.menu-description-pizza {
  max-width: 900px;
  transform: translate(0, -100px);
  text-align: left;
  color: #007a47;
  font-size: 14px;
  font-weight: 600;
  line-height: 1.6;
}
/* === GRILLE DES PIZZAS === */
.menu-grid-pizza {
  display: flex;
  justify-content: space-between;
  gap: 40px;
  max-width: 1200px;
  margin: -112px auto 0 auto;
  padding: 0 20px;
}

.menu-left-column,
.menu-right-column-pizza {
  display: flex;
  flex-direction: column;
  gap: 40px;
  flex: 1;
}

.menu-block {
  display: flex;
  flex-direction: column;
  text-align: left;
  min-height: 400px;
}

.menu-block img {
  width: 100%;
  height: auto;
  display: block;
  border-radius: 0;
}

.menu-text {
  margin-top: 15px;
}

.menu-title-pizza {
  font-weight: 800;
  font-size: 16px;
  color: #007a47;
  margin: 0 0 6px;
  text-transform: uppercase;
}

.menu-recipe-pizza {
  font-size: 12px;
  color: #007a47;
  line-height: 1.6;
  margin: 0;
  max-width: 100%;
}

/* === EL PÉPÉ alignée à droite === */
.menu-block.elpepe {
  align-items: flex-end;
  gap: 10px;
}

.menu-block.elpepe .menu-text {
  text-align: right;
  width: 100%;
  margin-bottom: 10px;
}

/* === RESPONSIVE === */
@media (max-width: 768px) {
  .menu-header-pizza{
    margin-top: 120px;
    padding-left: 0;
  }

  .menu-header-pizza h2 {
    margin: 0;
    padding: 0;
    display: block;
  }

  .menu-header-pizza .part1,
  .menu-header-pizza .part2 {
    display: block;
    font-size: 48px !important;
    font-weight: 800 !important;
    color: #007a47;
    line-height: 1 !important;
    margin: 0;
    padding: 0;
    position: relative;
  }

  .menu-header-pizza .part1 {
    transform: translateX(20px);
    top: -90px;
  }

  .menu-header-pizza .part2 {
    transform: translateX(160px);
    top: -165px; 
  }
.menu-description-pizza {
    transform: none;
    margin-top: -140px;
    padding: 0 10px;
    text-align: left;
  }
  .menu-grid-pizza {
    flex-direction: row;
    flex-wrap: wrap;
    gap: 20px;
    margin-top: -10px;
    padding: 0 10px;
  }

  .menu-left-column,
  .menu-right-column-pizza {
    flex: 1 1 100%;
    flex-direction: row;
    flex-wrap: wrap;
    gap: 20px;
  }

  .menu-block {
    display: flex;
    flex-direction: column;
    width: calc(50% - 10px);
    min-height: auto;
  }

  .menu-block img {
    width: 100%;
    height: auto;
  }

  .menu-text {
    margin-top: 10px;
    text-align: left;
  }

  .menu-block.elpepe {
    align-items: flex-end;
    margin-top: 0;
  }

  .menu-block.elpepe .menu-text {
    text-align: right;
    margin-top: 10px;
  }

  .menu-block.ronchon {
    display: flex;
    flex-direction: row;
    align-items: flex-start;
    width: 100%;
    gap: 10px;
  }

  .menu-block.ronchon img {
    width: 45%;
    height: auto;
    object-fit: cover;
  }

  .menu-block.ronchon .menu-text {
    width: 55%;
    text-align: left;
    margin-top: 900;
  }
}
/* === PIZZA DU MOMENT === */
.pizza-moment-section {
  position: relative;
  margin-top: -40px;
  width: 100%;
  background: white;
  font-family: 'Raleway', sans-serif;
  padding-top: 60px;
}

.pizza-moment-content {
  max-width: 1200px;
  margin: 0 auto;
  padding: 0 20px;
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  position: relative;
  z-index: 2;
}

.pizza-moment-title {
  display: flex;
  flex-direction: column;
  gap: 5px;
  margin-left: 260px;
}

.pizza-moment-title .pizza,
.pizza-moment-title .moment {
  font-size: 70px;
  font-weight: 800;
  color: #007a47; 
  line-height: 1;
}

.pizza-moment-title .pizza {
  transform: translateX(-40px);
}

.pizza-moment-title .moment {
  transform: translateX(50px);
}

.pizza-moment-description {
  position: absolute;
  right: 20px;
  top: -10px;
  font-size: 14px;
  color: #007a47;
  text-align: right;
  line-height: 1.6;
  max-width: 260px;
}

.pizza-moment-image {
  width: 100%;
  max-height: 420px;
  object-fit: cover;
  display: block;
  margin-top: -50px;
  z-index: 1;
}

/* === RESPONSIVE === */
@media (max-width: 768px) {
  .pizza-moment-section {
    padding-top: 20px;
    margin-top: 0;
    background: white;
  }

  .pizza-moment-content {
    flex-direction: column;
    align-items: center;
    padding: 0 15px;
  }

  .pizza-moment-title {
    margin-left: 0;
    text-align: left;
    margin-bottom: 10px;
  }

  .pizza-moment-title .pizza,
  .pizza-moment-title .moment {
    font-size: 48px;
    line-height: 1.1;
    transform: none;
  }

  .pizza-moment-description {
    position: static;
    margin-top: 18px;
    font-size: 14px;
    text-align: center;
    max-width: 100%;
		top: 20px;
  }

  .pizza-moment-image {
    width: 100%;
    max-height: 70px;
    object-fit: cover;
  display: block;
  margin-top: -200px; /* ⬅️ tu ajustes ici pour remonter l’image */
  z-index: 1;
  position: relative;
}
}
/* PRESENTATION BRUNCH */
/* ========================= */
.section-brunch-layout {
  background: white;
  width: 100%;
  max-width: 1200px;
  margin: 0 auto;
  padding: 130px 20px;
  color: #007a47; /* ✅ même vert que Pizza */
  position: relative;
  font-family: 'Raleway', sans-serif;
}

.brunch-col-gauche {
  flex: 1;
  position: relative;
  height: 500px;
}

.brunch-col-gauche img {
  position: absolute;
  top: 0;
  left: 0;
  width: 100vw;
  height: 100%;
  object-fit: cover;
  border-radius: 0;
  z-index: 1;
}

.titre-superpose-brunch {
  position: absolute;
  top: -70px;
  left: 130%;
  transform: translateX(-40%);
  font-size: 70px;
  font-weight: 800;
  color: #007a47; /* ✅ même vert que Pizza */
  line-height: 1.1;
  z-index: 3;
  text-align: left;
  width: 150%;
}

.brunch-col-droite {
  flex: 2;
  padding-top: 180px;
  z-index: 2;
  position: relative;
}

.brunch-col-droite p {
  font-size: 18px;
  line-height: 1.6;
  margin-bottom: 16px;
}

/* === BOUTON MENU BRUNCH === */
.brunch-bouton-align {
  text-align: right;
  margin-top: 20px;
  padding-right: 20px;
}

.btn-brunch-solid {
  display: inline-block;
  background-color: transparent;
  border: 2px solid #007a47;
  color: #007a47;
  font-weight: 700;
  padding: 12px 26px;
  font-size: 16px;
  border-radius: 6px;
  transition: all 0.3s ease;
  font-family: 'Raleway', sans-serif;
}

.btn-brunch-solid:hover {
  background-color: #007a47;
  color: white;
}

/* ========================= */
/* 📱 CSS RESPONSIVE MOBILE  */
/* ========================= */
@media (max-width: 768px) {
  .brunch-col-gauche {
    height: auto;
    position: relative;
  }

  .brunch-col-gauche img {
    display: block;
    width: 60%;
    height: auto;
    object-fit: cover;
    margin-left: -40px;
    z-index: 1;
  }

  .titre-superpose-brunch {
    display: block;
    position: relative;
    top: 10px; 
    left: 18%;
    transform: none;
    font-size: 40px;
    font-weight: 800;
    color: #007a47; /* ✅ vert inchangé */
    line-height: 1.1;
    text-align: left;
    margin: 10px 20px 0 20px;
    padding: 0;
    z-index: 3;
  }

  .brunch-col-droite {
    padding: 0;
    text-align: left;
    margin-top: 90px;
  }

  .brunch-col-droite p {
    font-size: 14px;
    line-height: 1.6;
    margin-bottom: 8px;
  }

  .brunch-col-droite a {
    font-size: 16px;
    font-weight: 700;
    color: #007a47;
    text-decoration: underline;
    margin-top: 10px;
    display: inline-block;
  }
}


/* === FOOTER PIZZA === */
footer.footer-pizza {
  background-color: white;
  color: #007a47;
  font-family: 'Raleway', sans-serif;
  padding: 90px 20px 0;
  width: 100%;
  margin: 0 auto;
}

.footer-pizza .footer-columns {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  flex-wrap: wrap;
  max-width: 1000px;
  margin: 0 auto 20px auto;
  gap: 30px;
}

.footer-pizza .footer-column {
  flex: 1;
  min-width: 200px;
  font-size: 14px;
  line-height: 1.4;
}

/* COLONNE MENU */
.footer-pizza .footer-column.menu-col {
  margin-left: 50px;
  max-width: 210px;
  padding-top: 12px;
}

/* COLONNE PIZZA */
.footer-pizza .footer-column.pizza-col {
  max-width: 240px;
}

/* COLONNE VINO */
.footer-pizza .footer-column.vino-col {
  max-width: 260px;
}

/* COLONNE 4 = RÉSEAUX SOCIAUX */
.footer-pizza .footer-columns .footer-column:nth-child(4) {
  min-width: 200px;
  font-size: 14px;
  line-height: 1.4;
  color: #007a47;
}

.footer-pizza .footer-columns .footer-column:nth-child(4) strong,
.footer-pizza .footer-columns .footer-column:nth-child(4) p {
  color: #007a47;
}

.footer-pizza .footer-columns .footer-column ul {
  list-style: none;
  padding: 0;
  margin: 0;
}

.footer-pizza .footer-column li {
  margin-bottom: 6px;
}

.footer-pizza .footer-column a {
  color: #007a47;
  text-decoration: none;
  font-weight: 600;
}

.footer-pizza .footer-column a:hover {
  text-decoration: underline;
  color: #007a47;
}

.footer-pizza .footer-column strong {
  display: block;
  margin: 12px 0 6px;
  font-weight: 700;
  color: #007a47;
}

.footer-pizza .footer-column p {
  margin: -4px 0;
  font-size: 13px;
  line-height: 1.4;
  font-weight: 400;
  color: #007a47;
}

.footer-pizza .footer-column .hours-title {
  font-weight: 700;
  margin: 14px 0 4px;
}

/* LISTE HORAIRES */
.footer-opening-list {
  list-style: none;
  padding: 0;
  margin: 0;
  font-size: 10px;
  line-height: 1.5;
}

.footer-opening-list li {
  white-space: nowrap;
  margin-bottom: 0;
}

/* ICONES SOCIAUX */
.footer-pizza .footer-social-icons {
  display: flex;
  gap: 12px;
  margin-top: 12px;
}

.footer-pizza .footer-social-icons img {
  width: 24px;
  height: 24px;
  object-fit: contain;
  filter: none;
  transition: opacity 0.3s ease;
}

.footer-pizza .footer-social-icons img:hover {
  opacity: 0.6;
}

/* LOGO BAS DE PAGE */
.footer-logo-fullwidth {
  width: 100vw;
  margin: 50px 0 0 0;
  padding: 0;
  position: relative;
  left: 50%;
  transform: translateX(-50%);
  overflow: hidden;
}

.footer-logo-fullwidth img {
  display: block;
  width: 100%;
  height: auto;
}

/* === RESPONSIVE === */
@media (max-width: 768px) {
  .site-content {
    padding-bottom: 250px;
    position: relative;
    z-index: 1;
  }

  footer.footer-pizza {
    position: relative;
    padding-top: 10px;
    z-index: 0;
  }

  .footer-pizza .footer-columns {
    flex-direction: column;
    gap: 0px;
    margin-bottom: 20px;
  }

  .footer-pizza .footer-column {
    width: 100%;
    margin-bottom: 25px;
  }

  .footer-pizza .footer-column.menu-col {
    display: none;
  }

  .footer-pizza .footer-social-icons {
    justify-content: flex-start;
    flex-wrap: nowrap;
  }

  .footer-opening-list li {
    white-space: normal;
  }

  .footer-logo-fullwidth {
    margin-top: 30px;
  }
}

/* === PÉPÉ RONCHON VINO HEADER === */

.hero-vino {
  position: relative;
  height: 100vh;
  width: 100%;
  overflow: hidden;
  font-family: 'Raleway', sans-serif;
  color: white;
  text-align: center;
}

.hero-vino .hero-bg-img {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  z-index: 1;
}

.hero-vino .hero-logo-img {
  width: 100vw;
  height: auto;
  display: block;
  margin: 10px auto 20px auto;
  z-index: 2;
  position: relative;
}

.hero-vino .hero-menu {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 20px;
  z-index: 2;
  position: relative;
  margin-bottom: 30px;
  font-family: 'Raleway', sans-serif;
}

.hero-vino .hero-menu a {
  color: white;
  text-decoration: none;
  font-weight: 700;
  font-size: 16px;
  text-transform: uppercase;
}

.hero-vino .hero-menu a:hover {
  text-decoration: underline;
}

.hero-vino .hero-title {
  position: absolute;
  top: -9999px;
  left: -9999px;
}

.hero-vino .hero-center {
  position: absolute;
  top: 60%;
  left: 50%;
  transform: translate(-50%, -50%);
  font-size: 40px;
  font-weight: 800;
  z-index: 2;
  font-family: 'Raleway', sans-serif;
  color: white;
  text-transform: uppercase;
		text-shadow: 2px 2px 8px rgba(0, 0, 0, 0.8);
}

.hero-vino .hero-bottom-left,
.hero-vino .hero-bottom-right {
  position: absolute;
  bottom: 30px;
  font-size: 16px;
  font-weight: 700;
  z-index: 2;
  font-family: 'Raleway', sans-serif;
}

.hero-vino .hero-bottom-left {
  left: 30px;
}

.hero-vino .hero-bottom-right {
  right: 30px;
}

/* === BURGER ICON === */
#burgerIconVino {
  display: none;
}

/* === RESPONSIVE — max 768px === */
@media (max-width: 768px) {
  .hero-vino .hero-logo-img {
    width: 100%;
    height: auto;
  }

  .hero-vino .hero-menu {
    display: none;
  }

  .hero-vino .hero-center {
    font-size: 20px;
  }

  .hero-vino .hero-bottom-left,
  .hero-vino .hero-bottom-right {
    font-size: 14px;
    bottom: 15px;
  }

  #burgerIconVino {
    display: block;
    font-size: 32px;
    color: white;
    position: fixed;
    top: 110px;
    right: 25px;
    z-index: 100;
    cursor: pointer;
  }

  #mobileMenuVino {
    display: none;
    flex-direction: column;
    position: fixed;
    top: 0;
    right: 0;
    width: 80%;
    height: 100%;
    background: rgba(0, 0, 0, 0.95);
    padding: 80px 30px;
    z-index: 99;
  }

  #mobileMenuVino.open {
    display: flex;
  }

  #mobileMenuVino a {
    color: white;
    text-decoration: none;
    font-size: 20px;
    padding: 15px 0;
    text-transform: uppercase;
    font-weight: 700;
  }
}
/* === SECTION PRÉSENTATION VINO === */
.section-vino-layout {
  background: white;
  width: 100%;
  max-width: 1200px;
  margin: 0 auto;
  padding: 80px 20px;
  color: #6D1A36; /* Bordeaux */
  position: relative;
  font-family: 'Raleway', sans-serif;
  display: flex;
  flex-direction: column;
}

.contenu-qui {
  display: flex;
  flex-direction: row;
}

.vino-col-gauche {
  flex: 1;
  position: relative;
  height: 500px;
}

.vino-col-gauche img {
  position: absolute;
  top: 0;
  left: 0;
  width: 100vw;
  height: 100%;
  object-fit: cover;
  border-radius: 0;
  z-index: 1;
}

.citation-intro-vino {
  position: absolute;
  top: -70px;
  left: 20px;
  font-size: 10px;
  font-style: italic;
  color: #6D1A36;
  z-index: 9;
}

.titre-superpose-vino {
  position: absolute;
  top: -70px;
  left: 130%;
  transform: translateX(-40%);
  font-size: 70px;
  font-weight: 800;
  color: #6D1A36;
  line-height: 1.1;
  z-index: 3;
  text-align: left;
  width: 150%;
}

.vino-col-droite {
  flex: 2;
  padding-top: 180px;
  z-index: 2;
  position: relative;
}

.vino-col-droite p {
  font-size: 18px;
  line-height: 1.6;
  margin-bottom: 16px;
}

/* === ALIGNEMENT DU BOUTON À DROITE === */
.vino-bouton-align {
  text-align: right;
  margin-top: 20px;
  padding-right: 20px;
}

/* === BOUTON BORDEAUX SOLIDE (identique à Réserver) === */
.btn-vino-solid {
  display: inline-block;
  background-color: transparent;
  border: 2px solid #6D1A36;
  color: #6D1A36;
  font-weight: 700;
  padding: 12px 24px;
  font-size: 16px;
  border-radius: 6px;
  text-decoration: none;
  transition: all 0.3s ease;
}

.btn-vino-solid:hover {
  background-color: #6D1A36;
  color: white;
}

/* === RESPONSIVE === */
@media (max-width: 768px) {
  .contenu-qui {
    display: flex;
    flex-direction: column;
    align-items: center;
    position: relative;
  }

  .citation-intro-vino {
    display: block;
    font-size: 10px;
    font-style: italic;
    color: #6D1A36;
    margin: 0px 20px 0 20px;
    text-align: left;
    z-index: 2;
  }

  .vino-col-gauche {
    width: 100%;
    height: auto;
    margin-top: 10px;
    position: relative;
  }

  .vino-col-gauche img {
    display: block;
    width: 60%;
    height: auto;
    object-fit: cover;
    margin-left: -40px;
    z-index: 1;
  }

  .titre-superpose-vino {
    display: block;
    position: relative;
    top: -50px;
    left: 33%;
    transform: none;
    font-size: 40px;
    font-weight: 800;
    color: #6D1A36;
    line-height: 1.1;
    text-align: left;
    margin: 10px 20px 0 20px;
    padding: 0;
    z-index: 3;
  }

  .vino-col-droite {
    padding: 0 0px;
    text-align: left;
    margin-top: 120px;
  }

  .vino-col-droite p {
    font-size: 14px;
    line-height: 1.6;
    margin-bottom: 8px;
  }

  .vino-bouton-align {
    text-align: left;
    margin-top: 10px;
  }

  .btn-vino-solid {
    font-size: 16px;
    font-weight: 700;
  }
	
@media (max-width: 768px) {
  .zc-widget-button {
    transform: scale(0.85);
    bottom: 20px !important;
    right: 20px !important;
  }
}
}/* === BOUTON FLOTTANT RÉSERVATION === */
.zenchef-floating-button {
  position: fixed;
  bottom: 20px;
  right: 20px;
  z-index: 9999;
}

.zenchef-floating-button button {
  background-color: transparent;
  color: #6D1A36;
  font-weight: 700;
  border: 2px solid #6D1A36;
  padding: 12px 24px;
  font-size: 16px;
  cursor: pointer;
  transition: all 0.3s ease;
  border-radius: 6px;
  font-family: 'Raleway', sans-serif;
}

.zenchef-floating-button button:hover {
  background-color: #6D1A36;
  color: white;
}


/* === SECTION MENU À LA CARTE — DESKTOP & MOBILE === */
.menu-section {
  position: relative;
  max-width: 1200px;
  margin: 0 auto;
  padding: 0 20px;
  display: flex;
  flex-direction: column;
  font-family: 'Raleway', sans-serif;
}

/* === TITRE === */
.menu-header h2 {
  font-size: 70px;
  font-weight: 800;
  line-height: 1.1;
  color: #6D1A36;
  margin: 0;
  z-index: 2;
  position: relative;
}

.menu-header .part1 {
  display: inline-block;
  transform: translate(150px, -120px);
  position: relative;
}
.menu-header .part2 {
  display: inline-block;
  transform: translate(300px, -130px);
  position: relative;
}

/* === DESCRIPTION === */
.menu-description {
  max-width: 900px;
  transform: translate(0, -100px);
  text-align: left;
  color: #6D1A36;
  font-size: 14px;
  font-weight: 600;
  line-height: 1.6;
}

/* === LIEN "MENU COMPLET" === */
.menu-lien {
  position: absolute;
  right: 20px;
  top: -100px;
  font-weight: 700;
  text-decoration: underline;
  color: #6D1A36;
  font-size: 14px;
}

/* === GRILLE DES PLATS === */
.menu-grid {
  display: flex;
  justify-content: space-between;
  gap: 40px;
  max-width: 1200px;
  margin: -112px auto 0 auto;
  padding: 0 20px;
}

.menu-left-column,
.menu-right-column {
  display: flex;
  flex-direction: column;
  gap: 40px;
  flex: 1;
}

.menu-block {
  display: flex;
  flex-direction: column;
  text-align: left;
  min-height: 400px;
}

.menu-block img {
  width: 100%;
  height: auto;
  display: block;
  border-radius: 0;
}

.menu-text {
  margin-top: 15px;
}

.menu-title {
  font-weight: 800;
  font-size: 16px;
  color: #6D1A36;
  margin: 0 0 6px;
  text-transform: uppercase;
}

.menu-recipe {
  font-size: 12px;
  color: #6D1A36;
  line-height: 1.6;
  margin: 0;
  max-width: 100%;
}

/* === BURATTA aligné à droite === */
.menu-block.buratta {
  align-items: flex-end;
  gap: 10px;
}
.menu-block.buratta .menu-text {
  text-align: right;
  width: 100%;
  margin-bottom: 10px;
}

/* === RESPONSIVE MOBILE === */
 @media (max-width: 768px) {
  .menu-header {
    margin-top: 110px;
    padding-left: 0;
  }

  .menu-header h2 {
    margin: 0;
    padding: 0;
    display: block;
  }

  .menu-header .part1,
  .menu-header .part2 {
    display: block;
    font-size: 48px !important;
    font-weight: 800 !important;
    color: #6D1A36;
    line-height: 1 !important;
    margin: 0;
    padding: 0;
    position: relative;
  }

  .menu-header .part1 {
    transform: translateX(20px);
    top: -90px;
  }

  .menu-header .part2 {
    transform: translateX(60px);
    top: -165px; /* ⬅️ C'est ici qu'on DÉCALE verticalement */
  }
  .menu-description {
    transform: none;
    margin-top: -150px;
    padding: 0 10px;
    text-align: left;
  }

  .menu-lien {
    position: relative;
    top: auto;
    right: auto;
    text-align: right;
    display: block;
    margin: 20px 10px 0 auto;
  }

  .menu-grid {
    flex-direction: row;
    flex-wrap: wrap;
    gap: 20px;
    margin-top: 20px;
    padding: 0 10px;
  }

  .menu-left-column,
  .menu-right-column {
    flex: 1 1 100%;
    flex-direction: row;
    flex-wrap: wrap;
    gap: 20px;
  }

  .menu-block {
    display: flex;
    flex-direction: column;
    width: calc(50% - 10px);
    min-height: auto;
  }

  .menu-block img {
    width: 100%;
    height: auto;
  }

  .menu-text {
    margin-top: 10px;
    text-align: left;
  }

  .menu-block.buratta {
    align-items: flex-end;
    margin-top: 0;
  }

  .menu-block.buratta .menu-text {
    text-align: right;
    margin-top: 10px;
  }

  /* === SPRITZ : image à gauche, texte à droite === */
  .menu-block.aperol {
    display: flex;
    flex-direction: row;
    align-items: flex-start;
    width: 100%;
    gap: 10px;
  }

  .menu-block.aperol img {
    width: 45%;
    height: auto;
    object-fit: cover;
  }

  .menu-block.aperol .menu-text {
    width: 55%;
    text-align: left;
    margin-top: 900;
  }
}
 /* === MENU DEJEUNER === */
.menu-dejeuner {
  position: relative;
  margin-top: -40px; /* ⬆️ on remonte l’ensemble */
  width: 100%;
  background: white;
  font-family: 'Raleway', sans-serif;
  padding-top: 60px; /* un peu d’espace au cas où */
}

.menu-dejeuner-content {
  max-width: 1200px;
  margin: 0 auto;
  padding: 0 20px;
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  position: relative;
  z-index: 2;
}

.menu-dejeuner-title {
  display: flex;
  flex-direction: column;
  gap: 5px;
  margin-left: 260px; 
}
.menu-dejeuner-title span {
  font-size: 70px;
  font-weight: 800;
  color: #6D1A36;
  line-height: 1;
}

.menu-dejeuner-title .menu {
  transform: translateX(-40px);
}

.menu-dejeuner-title .dejeuner {
  transform: translateX(50px);
}

.menu-dejeuner-prices {
  position: absolute;
  right: 20px;
  top: -20px; /* ⬆️ on remonte le bloc prix */
  font-size: 14px;
  color: #6D1A36;
  text-align: right;
  line-height: 1.4;
  max-width: 220px;
}

.menu-dejeuner-prices p {
  margin: 3px 0;
}

.menu-dejeuner-prices .menu-note {
  font-size: 12px;
  font-style: italic;
  margin-top: 6px;
  line-height: 1.2;
}

/* Image ajustée */
.menu-dejeuner-image {
  width: 100%;
  max-height: 420px;
  object-fit: cover;
  display: block;
  margin-top: -50px; /* ⬆️ remonte l’image mais laisse apparaître le titre */
  z-index: 1;
}
@media (max-width: 768px) {
  .menu-dejeuner {
    padding-top: 20px;
    margin-top: 0;
    background: white;
  }

  .menu-dejeuner-content {
    flex-direction: column;
    align-items: center;
    padding: 0 15px;
  }

  .menu-dejeuner-title {
    margin-left: 0;
    text-align: center;
    margin-bottom: 10px;
  }

  .menu-dejeuner-title span {
    font-size: 48px;
    line-height: 1.1;
  }

  .menu-dejeuner-title .menu {
    transform: none;
  }

  .menu-dejeuner-title .dejeuner {
    transform: none;
  }

 .menu-dejeuner-image {
  width: 100%;
  max-height: 70px;
  object-fit: cover;
  display: block;
  margin-top: -185px; /* ⬅️ tu ajustes ici pour remonter l’image */
  z-index: 1;
  position: relative;
}

  .menu-dejeuner-prices {
    position: static;
    margin-top: 1px;
    font-size: 13px;
    text-align: center;
  }

  .menu-dejeuner-prices p {
    margin: 3px 0;
  }

  .menu-dejeuner-prices .menu-note {
    font-size: 11px;
    font-style: italic;
    margin-top: 6px;
    line-height: 1.2;
  }
}
 /* === FOOTER VINO === */
footer.footer-vino {
  background-color: white;
  color: #6D1A36;
  font-family: 'Raleway', sans-serif;
  padding: 90px 20px 0;
  width: 100%;
  margin: 0 auto;
}

.footer-vino .footer-columns {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  flex-wrap: wrap;
  max-width: 1000px;
  margin: 0 auto 20px auto;
  gap: 30px;
}

.footer-vino .footer-column {
  flex: 1;
  min-width: 200px;
  font-size: 14px;
  line-height: 1.4;
}

/* COLONNE MENU */
.footer-vino .footer-column.menu-col {
  margin-left: 50px;
  max-width: 210px;
  padding-top: 12px; /* aligne avec les autres en desktop */
}

/* COLONNE PIZZA */
.footer-vino .footer-column.pizza-col {
  max-width: 240px;
}

/* COLONNE VINO */
.footer-vino .footer-column.vino-col {
  max-width: 260px;
}

/* COLONNE 4 = RÉSEAUX SOCIAUX */
.footer-vino .footer-columns .footer-column:nth-child(4) {
  min-width: 200px;
  font-size: 14px;
  line-height: 1.4;
  color: #7b002c;
}

.footer-vino .footer-columns .footer-column:nth-child(4) strong,
.footer-vino .footer-columns .footer-column:nth-child(4) p {
  color: #7b002c;
}

.footer-vino .footer-columns .footer-column ul {
  list-style: none;
  padding: 0;
  margin: 0;
}

.footer-vino .footer-column li {
  margin-bottom: 6px;
}

.footer-vino .footer-column a {
  color: #6D1A36;
  text-decoration: none;
  font-weight: 600;
}

.footer-vino .footer-column a:hover {
  text-decoration: underline;
  color: #6D1A36;
}

.footer-vino .footer-column strong {
  display: block;
  margin: 12px 0 6px;
  font-weight: 700;
  color: #6D1A36;
}

.footer-vino .footer-column p {
  margin: -4px 0;
  font-size: 13px;
  line-height: 1.4;
  font-weight: 400;
  color: #6D1A36;
}

.footer-vino .footer-column .hours-title {
  font-weight: 700;
  margin: 14px 0 4px;
}

/* LISTE HORAIRES */
.footer-opening-list {
  list-style: none;
  padding: 0;
  margin: 0;
  font-size: 10px;
  line-height: 1.5;
}

.footer-opening-list li {
  white-space: nowrap;
  margin-bottom: 0;
}

/* ICONES SOCIAUX */
.footer-vino .footer-social-icons {
  display: flex;
  gap: 12px;
  margin-top: 12px;
}

.footer-vino .footer-social-icons img {
  width: 24px;
  height: 24px;
  object-fit: contain;
  filter: none;
  transition: opacity 0.3s ease;
}

.footer-vino .footer-social-icons img:hover {
  opacity: 0.6;
}

/* LOGO BAS DE PAGE */
.footer-logo-fullwidth {
  width: 100vw;
  margin: 50px 0 0 0;
  padding: 0;
  position: relative;
  left: 50%;
  transform: translateX(-50%);
  overflow: hidden;
}

.footer-logo-fullwidth img {
  display: block;
  width: 100%;
  height: auto;
}

/* === RESPONSIVE === */
@media (max-width: 768px) {
  /* Le footer reste en bas */
  .site-content {
    padding-bottom: 250px; /* espace pour que le footer ne remonte pas */
    position: relative;
    z-index: 1;
  }

  footer.footer-vino {
    position: relative;
    padding-top: 170px; /* comme ancienne version */
    z-index: 0;
  }

  .footer-vino .footer-columns {
    flex-direction: column;
    gap: 20px;
    margin-bottom: 20px;
  }

  .footer-vino .footer-column {
    width: 100%;
    margin-bottom: 25px;
  }

  .footer-vino .footer-column.menu-col {
    display: none; /* cachée sur mobile */
  }

  .footer-vino .footer-social-icons {
    justify-content: flex-start;
    flex-wrap: nowrap;
  }

  .footer-opening-list li {
    white-space: normal;
  }

  .footer-logo-fullwidth {
    margin-top: 30px;
  }
}

/*=== PÉPÉ RONCHON RESEVRATION HEADER === */
.hero-reservation {
  position: relative;
  height: 100vh;
  width: 100%;
  overflow: hidden;
  font-family: 'Raleway', sans-serif;
  color: white;
  text-align: center;
}

.hero-reservation .hero-bg-img {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  z-index: 1;
}

.hero-reservation .hero-logo-img {
  width: 100vw;
  height: auto;
  display: block;
  margin: 10px auto 20px auto;
  z-index: 2;
  position: relative;
}

.hero-reservation .hero-menu {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 20px;
  z-index: 2;
  position: relative;
  margin-bottom: 30px;
}

.hero-reservation .hero-menu a {
  color: white;
  text-decoration: none;
  font-weight: 700;
  font-size: 16px;
  text-transform: uppercase;
}

.hero-reservation .hero-menu a:hover {
  text-decoration: underline;
}

.hero-reservation .hero-center {
  position: absolute;
  top: 60%;
  left: 50%;
  transform: translate(-50%, -50%);
  font-size: 40px;
  font-weight: 800;
  z-index: 2;
  font-family: 'Raleway', sans-serif;
  color: white;
  text-transform: uppercase;
	text-shadow: 2px 2px 8px rgba(0, 0, 0, 0.8);

}

.hero-reservation .hero-bottom-left,
.hero-reservation .hero-bottom-right {
  position: absolute;
  bottom: 30px;
  font-size: 16px;
  font-weight: 700;
  z-index: 2;
}

.hero-reservation .hero-bottom-left {
  left: 30px;
}

.hero-reservation .hero-bottom-right {
  right: 30px;
}

/* === BURGER ICON === */
#burgerIconReservation {
  display: none;
}

/* === Responsive === */
@media (max-width: 768px) {
  .hero-reservation .hero-logo-img {
    width: 100%;
    height: auto;
  }

  .hero-reservation .hero-menu {
    display: none;
  }

  .hero-reservation .hero-center {
    font-size: 24px;
  }

  .hero-reservation .hero-bottom-left,
  .hero-reservation .hero-bottom-right {
    font-size: 13px;
    bottom: 15px;
  }

  #burgerIconReservation {
    display: block;
    font-size: 32px;
    color: white;
    position: fixed;
    top: 110px;
    right: 25px;
    z-index: 100;
    cursor: pointer;
  }

  #mobileMenuReservation {
    display: none;
    flex-direction: column;
    position: fixed;
    top: 0;
    right: 0;
    width: 80%;
    height: 100%;
    background: rgba(0, 0, 0, 0.95);
    padding: 80px 30px;
    z-index: 99;
  }

  #mobileMenuReservation.open {
    display: flex;
  }

  #mobileMenuReservation a {
    color: white;
    text-decoration: none;
    font-size: 20px;
    padding: 15px 0;
    text-transform: uppercase;
    font-weight: 700;
  }
}

/* === SECTION RÉSERVATION IMAGE === */
.reservation-info {
  padding: 60px 20px;
  max-width: 1000px;
  margin: 0 auto;
  font-family: 'Raleway', sans-serif;
  color: black;
}

.reservation-container {
  display: flex;
  justify-content: space-between;
  gap: 40px;
  margin-bottom: 40px;
}

.reservation-quote {
  flex: 1;
  font-style: italic;
  font-size: 10px;
  line-height: 1.6;
  margin-top: 0;
}

.reservation-description {
  flex: 2;
  font-size: 16px;
  line-height: 1.6;
  max-width: 1000px;
}

/* === LOCALISATIONS === */
.reservation-locations {
  display: flex;
  justify-content: center;
  gap: 40px;
  flex-wrap: wrap;
}

.location-card {
  flex: 1 1 400px;
  text-align: center;
}

.location-card img {
  width: 70%;
  height: auto;
  border-radius: 4px;
  transition: transform 0.3s ease;
}

.location-card img:hover {
  transform: scale(1.02);
  cursor: pointer;
}


/* === SECTION BOUTONS RÉSERVATION === */
.reservation {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  background-color: white;
  font-family: 'Raleway', sans-serif;
  gap: 30px;
  padding: 0 20px 60px;
  margin-bottom: 0;
}

.reservation-bloc {
  flex: 1 1 300px;
  max-width: 450px;
  text-align: center;
  padding: 20px 10px;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  min-height: 280px;
  margin-bottom: 0;
}

.reservation-image {
  max-width: 100%;
  height: auto;
  margin-bottom: 20px;
}

/* === BOUTONS === */
/* === SECTION BOUTONS RÉSERVATION === */
.reservation {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  background-color: white;
  font-family: 'Raleway', sans-serif;
  gap: 30px;
  padding: 0 20px 60px;
  margin-bottom: 0;
}

.reservation-bloc {
  flex: 1 1 300px;
  max-width: 450px;
  text-align: center;
  padding: 20px 10px;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  min-height: 280px;
  margin-bottom: 0;
}

.reservation-image {
  max-width: 100%;
  height: auto;
  margin-bottom: 20px;
}

/* === BOUTONS === */
.btn-reserver-container {
  text-align: center;
  margin-bottom: 0;
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: center;
  gap: 15px;
  flex-wrap: wrap;
}

.btn-reserver-secondaire,
.btn-reserver-menu {
  background-color: white;
  color: black;
  padding: 12px 26px;
  border: 2px solid black;
  font-size: 16px;
  font-weight: 700;
  text-transform: uppercase;
  text-decoration: none;
  border-radius: 6px;
  transition: all 0.3s ease;
  display: inline-block;
}

.btn-reserver-secondaire:hover,
.btn-reserver-menu:hover {
  background-color: black;
  color: white;
}

/* === RESPONSIVE === */
@media (max-width: 768px) {
  .reservation {
    flex-direction: column;
    padding: 0 10px 60px;
  }

  .reservation-bloc {
    padding: 10px 0;
  }

  .btn-reserver-secondaire,
  .btn-reserver-menu {
    font-size: 14px;
    padding: 10px 20px;
  }
}

/* === HEADER PRIVATISATION === */
.hero-privatisation {
  position: relative;
  height: 100vh;
  width: 100%;
  overflow: hidden;
  font-family: 'Raleway', sans-serif;
  color: white;
  text-align: center;
}

.hero-privatisation .hero-bg-img {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  z-index: 1;
}

.hero-privatisation .hero-logo-img {
  width: 100vw;
  height: auto;
  display: block;
  margin: 10px auto 20px auto;
  z-index: 2;
  position: relative;
}

.hero-privatisation .hero-menu {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 20px;
  z-index: 2;
  position: relative;
  margin-bottom: 30px;
}

.hero-privatisation .hero-menu a {
  color: white;
  text-decoration: none;
  font-weight: 700;
  font-size: 16px;
  text-transform: uppercase;
}

.hero-privatisation .hero-menu a:hover {
  text-decoration: underline;
}

.hero-privatisation .hero-title {
  position: absolute;
  top: -9999px;
  left: -9999px;
}

.hero-privatisation .hero-center {
  position: absolute;
  top: 60%;
  left: 50%;
  transform: translate(-50%, -50%);
  font-size: 40px;
  font-weight: 800;
  z-index: 2;
  text-transform: uppercase;
  color: white;
	text-shadow: 2px 2px 8px rgba(0, 0, 0, 0.8);

}

.hero-privatisation .hero-bottom-left,
.hero-privatisation .hero-bottom-right {
  position: absolute;
  bottom: 30px;
  font-size: 16px;
  font-weight: 700;
  z-index: 3;
  color: white;
}

.hero-privatisation .hero-bottom-left {
  left: 30px;
}

.hero-privatisation .hero-bottom-right {
  right: 30px;
}

/* === BURGER MOBILE === */
#burgerIconPrivatisation {
  display: none;
}

/* === MENU MOBILE === */
@media (max-width: 768px) {
  .hero-privatisation .hero-menu {
    display: none;
  }

  #burgerIconPrivatisation {
    display: block;
    font-size: 32px;
    color: white;
    position: fixed;
    top: 110px;
    right: 25px;
    z-index: 100;
    cursor: pointer;
  }

  #mobileMenuPrivatisation {
    display: none;
    flex-direction: column;
    position: fixed;
    top: 0;
    right: 0;
    width: 80%;
    height: 100%;
    background: rgba(0, 0, 0, 0.95);
    padding: 80px 30px;
    z-index: 99;
  }

  #mobileMenuPrivatisation.open {
    display: flex;
  }

  #mobileMenuPrivatisation a {
    color: white;
    text-decoration: none;
    font-size: 20px;
    padding: 15px 0;
    text-transform: uppercase;
    font-weight: 700;
  }
}
/* === SECTION PRIVATISATION  === */
.section-privatisation-layout {
  background: white;
  width: 100%;
  max-width: 1200px;
  margin: 0 auto;
  padding: 80px 20px;
  color: #111;
  font-family: 'Raleway', sans-serif;
  position: relative;
  display: flex;
  flex-direction: column;
}

.section-privatisation-layout .contenu-qui {
  display: flex;
  flex-direction: row;
}

/* COLONNE GAUCHE (Texte + citation) */
.privatisation-col-gauche {
  flex: 2;
  position: relative;
  padding-right: 40px;
  text-align: right;
}

.citation-intro-privatisation {
  position: absolute;
  top: -70px;
  left: 20px;
  font-size: 10px;
  font-style: italic;
  color: #111;
  z-index: 3;
}

.titre-superpose-privatisation {
  font-size: 70px;
  font-weight: 800;
  color: #111;
  line-height: 1;
  z-index: 2;
  text-align: right;
  margin-bottom: 40px;
  right: -180px;
  position: relative;
  top: -30px;
}

/* COLONNE DROITE (Texte + bouton) */
.privatisation-col-droite {
  width: 100%;
  padding: 0 2px;
  text-align: right;
}

.privatisation-col-droite p {
  font-size: 16px;
  line-height: 1.6;
  margin-bottom: 18px;
}

.presentation-bouton-align {
  text-align: left;
  margin-top: 30px;
}

.presentation-bouton-align a {
  display: inline-block;
  padding: 12px 30px;
  font-size: 14px;
  font-weight: 700;
  color: black;
  background-color: #fff;
  border: 2px solid #111;
  border-radius: 6px;
  text-decoration: none;
  text-transform: uppercase;
  transition: all 0.3s ease;
}

.presentation-bouton-align a:hover {
  background-color: #000;
  color: #fff;
}

/* COLONNE DROITE = IMAGE */
.privatisation-col-droite-img {
  flex: 1;
  position: relative;
  height: 500px;
}

.privatisation-col-droite-img img {
  position: absolute;
  top: 0;
  right: 0;
  width: 100vw;
  height: 100%;
  object-fit: cover;
  z-index: 1;
  border-radius: 0;
}

/* === RESPONSIVE === */
@media (max-width: 768px) {
  .section-privatisation-layout .contenu-qui {
    flex-direction: column;
    align-items: flex-start;
  }

  .privatisation-col-droite-img {
    order: -3;
    width: 100%;
    height: auto;
    margin: 0 auto;
    text-align: center;
  }

  .privatisation-col-droite-img img {
    width: 50%;
    height: auto;
    margin-top: -40px;
    margin-right: -40px;
    object-fit: cover;
    z-index: 1;
  }

  .citation-intro-privatisation {
    order: -2;
    font-size: 10px;
    font-style: italic;
    color: #111;
    margin: -60px 20px 5px 20px;
    text-align: left;
    z-index: 3;
  }

 .titre-superpose-privatisation {
  position: absolute;
  top: -70px;           /* ✅ ajuste la hauteur */
  left: -50px;          /* ✅ colle à gauche */
  font-size: 32px;
  font-weight: 800;
  color: #111;
  line-height: 1.2;
  z-index: 4;
  text-align: right;
  max-width: 90%;
}

  .privatisation-col-gauche {
    width: 100%;
    padding: 0;
  }

  .privatisation-col-droite {
    width: 100%;
    padding: 0 10px;
    text-align: left;
    margin-top: 180px; /* ✅ espace ajouté pour descendre le texte */
  }

  .privatisation-col-droite p {
    font-size: 14px;
    line-height: 1.6;
    margin-bottom: 16px;
  }

  .presentation-bouton-align {
    text-align: center;
    margin-top: 20px;
    margin-bottom: 30px;
  }

  .presentation-bouton-align a {
    font-size: 13px;
    padding: 10px 25px;
    width: auto;
  }
}

/* === HEADER LIVRAISON === */
.hero-livraison {
  position: relative;
  height: 100vh;
  width: 100%;
  overflow: hidden;
  font-family: 'Raleway', sans-serif;
  color: white;
  text-align: center;
}

.hero-livraison .hero-bg-img {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  z-index: 1;
}

.hero-livraison .hero-logo-img {
  width: 100vw;
  height: auto;
  display: block;
  margin: 10px auto 20px auto;
  z-index: 2;
  position: relative;
}

.hero-livraison .hero-menu {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 20px;
  z-index: 2;
  position: relative;
  margin-bottom: 30px;
}

.hero-livraison .hero-menu a {
  color: white;
  text-decoration: none;
  font-weight: 700;
  font-size: 16px;
  text-transform: uppercase;
}

.hero-livraison .hero-menu a:hover {
  text-decoration: underline;
}

.hero-livraison .hero-title {
  position: absolute;
  top: -9999px;
  left: -9999px;
}

.hero-livraison .hero-center {
  position: absolute;
  top: 60%;
  left: 50%;
  transform: translate(-50%, -50%);
  font-size: 40px;
  font-weight: 800;
  z-index: 2;
  text-transform: uppercase;
  color: white;
		text-shadow: 2px 2px 8px rgba(0, 0, 0, 0.8);
}

.hero-livraison .hero-bottom-left,
.hero-livraison .hero-bottom-right {
  position: absolute;
  bottom: 30px;
  font-size: 16px;
  font-weight: 700;
  z-index: 3;
  color: white;
}

.hero-livraison .hero-bottom-left {
  left: 30px;
}

.hero-livraison .hero-bottom-right {
  right: 30px;
}

/* === BURGER MOBILE === */
#burgerIconLivraison {
  display: none;
}

/* === MENU MOBILE === */
@media (max-width: 768px) {
  .hero-livraison .hero-menu {
    display: none;
  }

  #burgerIconLivraison {
    display: block;
    font-size: 32px;
    color: white;
    position: fixed;
    top: 110px;
    right: 25px;
    z-index: 100;
    cursor: pointer;
  }

  #mobileMenuLivraison {
    display: none;
    flex-direction: column;
    position: fixed;
    top: 0;
    right: 0;
    width: 80%;
    height: 100%;
    background: rgba(0, 0, 0, 0.95);
    padding: 80px 30px;
    z-index: 99;
  }

  #mobileMenuLivraison.open {
    display: flex;
  }

  #mobileMenuLivraison a {
    color: white;
    text-decoration: none;
    font-size: 20px;
    padding: 15px 0;
    text-transform: uppercase;
    font-weight: 700;
  }
}
/* === SECTION LIVRAISON === */
.section-livraison-layout {
  background: white;
  width: 100%;
  max-width: 1200px;
  margin: 0 auto;
  padding: 80px 20px;
  color: #111;
  font-family: 'Raleway', sans-serif;
  position: relative;
  display: flex;
  flex-direction: column;
}

.contenu-qui {
  display: flex;
  flex-direction: row;
}

/* COLONNE GAUCHE (Texte + citation) */
.livraison-col-gauche {
  flex: 2;
  position: relative;
  padding-right: 40px;
	text-align:right;
}

.citation-intro-livraison.droite {
  position: absolute;
  top: -70px;
  left: 20px;
  font-size: 10px;
  font-style: italic;
  color: #111;
  z-index: 3;
}

.titre-superpose-livraison {
  font-size: 70px;
  font-weight: 800;
  color: #111;
  line-height: 1;
  z-index: 2;
  text-align: right;
  margin-bottom: 30px;
	right:-150px;
  position: relative;
	top:-65px
}

/* === BOUTON DANS LA COLONNE LIVRAISON === */
.livraison-bouton-align {
  margin-top: 30px;
}

.livraison-bouton-align a {
  display: inline-block;
  padding: 12px 30px;
  font-size: 14px;
  font-weight: 700;
  color: black;
  background-color: #fff; /* bordeaux */
  border: 2px solid #111;
  border-radius: 6px;
  text-decoration: none;
  text-transform: uppercase;
  transition: all 0.3s ease;
}

.livraison-bouton-align a:hover {
  background-color: #fff;
  color: #111;
}

/* COLONNE DROITE (Image) */
.livraison-col-droite-img {
  flex: 1;
  position: relative;
  height: 500px;
}

.livraison-col-droite-img img {
  position: absolute;
  top: 0;
  right: 0;
  width: 100vw;
  height: 100%;
  object-fit: cover;
  z-index: 1;
  border-radius: 0;
}
.livraison-note {
  font-family: 'Raleway', sans-serif;
  font-style: italic;
  font-size: 10px;
  color: #111;
  margin-top: 10px;
  line-height: 1;
  text-align: right;
}

/* === RESPONSIVE === */
@media (max-width: 768px) {
  .contenu-qui {
    flex-direction: column;
    align-items: flex-start;
  }

  .livraison-col-droite-img {
    order: -3;
    width: 100%;
    height: auto;
    margin: 0 auto;
    text-align: center;
  }

  .livraison-col-droite-img img {
    width: 50%;
    height: auto;
    margin-top: -40px;
		margin-right:-40px;
    object-fit: cover;
    z-index: 1;
  }

  .citation-intro-livraison.droite {
    order: -2;
    font-size: 10px;
    font-style: italic;
    color: #111;
    margin: -60px 20px 5px 20px;
    text-align: left;
    z-index: 3;
  }

 .titre-superpose-livraison{
    position: absolute;
    top: -70px;        
    left: -47px;
    font-size: 32px;
    font-weight: 800;
    color: #111;
    line-height: 1.2;
    z-index: 4;
    text-align: right;
    max-width: 90%;
  }

  .livraison-col-gauche {
    width: 100%;
    padding: 0;
  }

.livraison-col-droite {
    width: 100%;
    padding: 0 20px;
    text-align: left;
    margin-top: 180px; /* ✅ descend le texte sous l'image et le titre */
  }

  .livraison-col-droite p {
    font-size: 12px;
    line-height: 1.5;
		  margin-top: 50px;   /
    margin-bottom: 17px;
  }

  .livraison-bouton-align {
    text-align: center;
    margin-top: 20px;
    margin-bottom: 30px;
  }

  .livraison-bouton-align a {
    font-size: 13px;
    padding: 10px 25px;
    width: auto;
  }

  section .livraison-note {
    font-size: 8px !important;
    line-height: 1.4 !important;
    font-style: italic !important;
    text-align: center;
    padding: 0 30px;
	 margin-top: -20px !important; /* ✅ remonte le texte */
    margin-bottom: -40px; !important; /* ✅ pas d’espace en dessous */
  }
}
	

/* === HEADER CONTACT === */
.hero-contact {
  position: relative;
  height: 100vh;
  width: 100%;
  overflow: hidden;
  font-family: 'Raleway', sans-serif;
  color: white;
  text-align: center;
  background-color: black;
}

.hero-contact .hero-bg-img {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  z-index: 1;
}

.hero-contact .hero-logo-img {
  width: 100vw;
  height: auto;
  display: block;
  margin: 10px auto 20px auto;
  z-index: 2;
  position: relative;
}

.hero-contact .hero-menu {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 20px;
  z-index: 2;
  position: relative;
  margin-bottom: 30px;
  font-family: 'Raleway', sans-serif;
}

.hero-contact .hero-menu a {
  color: white;
  text-decoration: none;
  font-weight: 700;
  font-size: 16px;
  text-transform: uppercase;
}

.hero-contact .hero-menu a:hover {
  text-decoration: underline;
}

.hero-contact .hero-title {
  position: absolute;
  top: -9999px;
  left: -9999px;
}

.hero-contact .hero-center {
  position: absolute;
  top: 60%;
  left: 50%;
  transform: translate(-50%, -50%);
  font-size: 40px;
  font-weight: 800;
  z-index: 2;
  font-family: 'Raleway', sans-serif;
  color: white;
  text-transform: uppercase;
		text-shadow: 2px 2px 8px rgba(0, 0, 0, 0.8);
}

.hero-contact .hero-bottom-left,
.hero-contact .hero-bottom-right {
  position: absolute;
  bottom: 30px;
  font-size: 16px;
  font-weight: 700;
  z-index: 2;
  font-family: 'Raleway', sans-serif;
}

.hero-contact .hero-bottom-left {
  left: 30px;
}

.hero-contact .hero-bottom-right {
  right: 30px;
}

/* === BURGER ICON === */
#burgerIconContact {
  display: none;
}

/* === Responsive === */
@media (max-width: 768px) {
  .hero-contact .hero-logo-img {
    width: 100%;
    height: auto;
  }

  .hero-contact .hero-menu {
    display: none;
  }

  .hero-contact .hero-center {
    font-size: 20px;
  }

  .hero-contact .hero-bottom-left,
  .hero-contact .hero-bottom-right {
    font-size: 14px;
    bottom: 15px;
  }

  #burgerIconContact {
    display: block;
    font-size: 32px;
    color: white;
    position: fixed;
    top: 110px;
    right: 25px;
    z-index: 100;
    cursor: pointer;
  }

  #mobileMenuContact {
    display: none;
    flex-direction: column;
    position: fixed;
    top: 0;
    right: 0;
    width: 80%;
    height: 100%;
    background: rgba(0, 0, 0, 0.95);
    padding: 80px 30px;
    z-index: 99;
  }

  #mobileMenuContact.open {
    display: flex;
  }

  #mobileMenuContact a {
    color: white;
    text-decoration: none;
    font-size: 20px;
    padding: 15px 0;
    text-transform: uppercase;
    font-weight: 700;
  }
}
/* === SECTION CONTACT === */
.section-contact-layout {
  background: white;
  width: 100%;
  max-width: 1200px;
  margin: 0 auto;
  padding: 80px 20px;
  color: #111;
  font-family: 'Raleway', sans-serif;
  position: relative;
  display: flex;
  flex-direction: column;
}

.contenu-qui {
  display: flex;
  flex-direction: row;
  align-items: flex-start;
}

/* COLONNE GAUCHE = Citation + Titre */
.contact-col-gauche {
  flex: 2;
  position: relative;
  padding-right: 40px;
  text-align: right;
}

.citation-intro-contact {
  position: absolute;
  top: -70px;
  left: 20px;
  font-size: 10px;
  font-style: italic;
  color: #111;
  z-index: 3;
}

.titre-superpose-contact {
  font-size: 60px;
  font-weight: 800;
  color: #111;
  line-height: 1;
  text-align: right;
  margin-bottom: 30px;
  right: -150px;
  position: relative;
  top: -50px;
  z-index: 2;
}

/* COLONNE DROITE = Texte */
.contact-col-droite {
  flex: 1;
  z-index: 2;
  position: relative;
	top:150px;
	right:450px;
}

.contact-col-droite p {
  font-size: 18px;
  line-height: 1.6;
  margin-bottom: 0px;
	padding-right:70;
}
@media (max-width: 768px) {
  .section-contact-layout {
    padding: 40px 20px;
  }

  .contenu-qui {
    flex-direction: column;
    align-items: flex-start;
  }

  .contact-col-gauche {
    width: 100%;
    padding-right: 0;
    text-align: left;
  }

  .citation-intro-contact {
    position: relative;
    top: 0;
    left: 0;
    margin-bottom: 10px;
    text-align: left;
    font-size: 10px;
    font-style: italic;
    color: #111;
  }

  .titre-superpose-contact {
    position: relative;
    right: 0;
    top: 0;
    font-size: 28px;
    text-align: left;
    margin-bottom: 20px;
    font-weight: 800;
    line-height: 1.2;
  }

  .contact-col-droite {
    width: 100%;
    padding: 0;
    margin-top: 0;
    text-align: right;
  }

  .contact-col-droite p {
    font-size: 15px;
    line-height: 1.6;
    margin-bottom: 12px;
    color: #111;
  }
}
/* === SECTION MAP CONTACT === */
.section-map-contact {
  background-color: white;
  padding: 60px 20px;
  font-family: 'Raleway', sans-serif;
  color: #111;
  text-align: center;
}

.sous-titre-map {
  font-size: 24px;
  font-weight: 600;
  margin-bottom: 40px;
}

.contact-map-content {
  display: flex;
  justify-content: center;
  gap: 40px;
  flex-wrap: wrap;
  align-items: flex-start;
}

.contact-map-wrapper iframe {
  width: 700px;
  height: 400px;
  border: none;
  border-radius: 8px;
}

/* Infos métro */
.contact-metro-info {
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  gap: 20px;
  max-width: 300px;
  text-align: left;
}
.contact-metro-box p {
  margin: 4px 0; /* espace vertical réduit entre lignes */
  font-size: 14px;
  line-height: 1.5;
}

.contact-metro-box {
  padding: 20px;
  border-radius: 8px;
  font-size: 14px;
  line-height: 1.5;
  background-color: #eee;
}

.contact-metro-box h4 {
  font-size: 18px;
  margin-bottom: 8px;
  font-weight: 700;
}

.contact-metro-box.vert {
  background-color: #e6f3ed;
  border-left: 6px solid #007a47;
}

.contact-metro-box.bordeaux {
  background-color: #fceef1;
  border-left: 6px solid #6D1A36;
}

.ligne-metro {
  font-weight: 600;
  font-style: italic;
  font-size: 13px;
}

/* === Responsive === */
@media (max-width: 768px) {
  .contact-map-content {
    flex-direction: column;
    align-items: center;
  }

  .contact-map-wrapper iframe {
    width: 100%;
    max-width: 100%;
    height: 280px;
  }

  .contact-metro-info {
    width: 100%;
    max-width: 100%;
  }

  .contact-metro-box p {
    line-height: 1.8;
    word-break: break-word;
  }
}
/* === FORMULAIRE DE CONTACT === */
.contact-form-section {
  max-width: 600px;
  margin: 80px auto;
  padding: 0 20px;
  font-family: 'Raleway', sans-serif;
  color: #111;
}

.contact-form-section h2 {
  font-size: 32px;
  font-weight: 800;
  text-align: center;
  margin-bottom: 30px;
}

.contact-form {
  display: flex;
  flex-direction: column;
  gap: 20px;
}

.contact-form label {
  font-weight: 600;
  font-size: 14px;
}

.contact-form input,
.contact-form textarea {
  padding: 12px;
  border: 1px solid #ccc;
  border-radius: 6px;
  font-size: 14px;
  font-family: 'Raleway', sans-serif;
  resize: vertical;
}

.contact-form button {
  padding: 12px 20px;
  font-size: 14px;
  font-weight: 700;
  color: white;
  background-color: black;
  border: 2px solid black;
  border-radius: 6px;
  text-transform: uppercase;
  cursor: pointer;
  transition: all 0.3s ease;
}

.contact-form button:hover {
  background-color: white;
  color: black;
}

/* === HEADER TRAITEUR === */
.hero-traiteur {
  position: relative;
  height: 100vh;
  width: 100%;
  overflow: hidden;
  font-family: 'Raleway', sans-serif;
  color: white;
  text-align: center;
}

/* Image de fond */
.hero-traiteur .hero-bg-img {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  z-index: 1;
}

/* Logo cliquable */
.hero-traiteur .hero-logo-img {
  width: 100vw;
  height: auto;
  display: block;
  margin: 10px auto 20px auto;
  z-index: 2;
  position: relative;
}

/* Menu horizontal desktop */
.hero-traiteur .hero-menu {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 20px;
  z-index: 2;
  position: relative;
  margin-bottom: 30px;
}

.hero-traiteur .hero-menu a {
  color: white;
  text-decoration: none;
  font-weight: 700;
  font-size: 16px;
  text-transform: uppercase;
}

.hero-traiteur .hero-menu a:hover {
  text-decoration: underline;
}

/* Titre centré */
.hero-traiteur .hero-center {
  position: absolute;
  top: 60%;
  left: 50%;
  transform: translate(-50%, -50%);
  font-size: 40px;
  font-weight: 800;
  z-index: 2;
  text-transform: uppercase;
}

/* Mentions bas de page */
.hero-traiteur .hero-bottom-left,
.hero-traiteur .hero-bottom-right {
  position: absolute;
  bottom: 30px;
  font-size: 16px;
  font-weight: 700;
  z-index: 2;
  color: white;
}

.hero-traiteur .hero-bottom-left {
  left: 30px;
}

.hero-traiteur .hero-bottom-right {
  right: 30px;
}

/* Icône burger */
#burgerIconReservation {
  display: none;
  font-size: 32px;
  color: white;
  position: fixed;
  top: 110px;
  right: 25px;
  z-index: 100;
  cursor: pointer;
}

/* Menu mobile */
#mobileMenuReservation {
  display: none;
  flex-direction: column;
  position: fixed;
  top: 0;
  right: 0;
  width: 80%;
  height: 100%;
  background: rgba(0, 0, 0, 0.95);
  padding: 80px 30px;
  z-index: 99;
}

#mobileMenuReservation.open {
  display: flex;
}

#mobileMenuReservation a {
  color: white;
  text-decoration: none;
  font-size: 20px;
  padding: 15px 0;
  text-transform: uppercase;
  font-weight: 700;
}

/* Responsive < 768px */
@media (max-width: 768px) {
  .hero-traiteur .hero-menu {
    display: none;
  }

  #burgerIconReservation {
    display: block;
  }
}
/* === SECTION PRESENTATION TRAITEUR === *//* === SECTION PRESENTATION TRAITEUR === */
.section-traiteur-layout {
  background: white;
  width: 100%;
  max-width: 1200px;
  margin: 0 auto;
  padding: 80px 20px;
  color: #111;
  position: relative;
  font-family: 'Raleway', sans-serif;
  display: flex;
  flex-direction: column;
}

.contenu-qui {
  display: flex;
  flex-direction: row;
}

/* COLONNE IMAGE GAUCHE */
.traiteur-col-gauche {
  flex: 1;
  position: relative;
  height: 500px;
}

.traiteur-col-gauche img {
  position: absolute;
  top: 0;
  left: 0;
  width: 100vw;
  height: 100%;
  object-fit: cover;
  border-radius: 0;
  z-index: 1;
}

/* CITATION */
.citation-intro-traiteur {
  position: absolute;
  top: -70px;
  left: 20px;
  font-size: 10px;
  font-style: italic;
  color: black;
  z-index: 3;
}

/* TITRE SUPERPOSÉ */
.titre-superpose-traiteur {
  position: absolute;
  top: -70px;
  left: 79%; /* décale à droite de l’image */
  font-size: 70px;
  font-weight: 800;
  color: #111;
  line-height: 1.1;
  z-index: 3;
  text-align: left;
  white-space: normal;
  max-width: 800px;
}

/* COLONNE TEXTE DROITE */
.traiteur-col-droite {
  flex: 2;
  padding-top: 180px;
  z-index: 2;
  position: relative;
}

.traiteur-col-droite p {
  font-size: 18px;
  line-height: 1.8;
  margin-bottom: 16px;
}

/* BOUTON TRAITEUR */
.traiteur-bouton-align {
  text-align: left;
  margin-top: 30px;
}

.traiteur-bouton-align a {
  display: inline-block;
  padding: 12px 30px;
  font-size: 14px;
  font-weight: 700;
  color: black;
  background-color: white;
  border: 2px solid #111;
  border-radius: 6px;
  text-decoration: none;
  text-transform: uppercase;
  transition: all 0.3s ease;
}

.traiteur-bouton-align a:hover {
  background-color: #000;
  color: #fff;
}

/* ===== RESPONSIVE (BASE TRAITEUR) ===== */
@media (max-width: 768px) {
  .contenu-qui {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    position: relative;
    padding: 0 20px;
  }

  .traiteur-col-gauche {
    display: none; /* ✅ On masque complètement l’image sur mobile */
  }

  .citation-intro-traiteur {
    display: block;
    font-size: 10px;
    font-style: italic;
    color: #111;
    margin: 0 0 10px 0;
    text-align: left;
    z-index: 2;
  }

  .titre-superpose-traiteur {
    display: block;
    position: relative;
    top: 30px; /* ✅ correction (était top:30;) */
    left: 0;
    transform: none;
    font-size: 36px;
    font-weight: 800;
    color: #111;
    line-height: 1.2;
    text-align: left;
    margin: 10px 0 20px 0;
    padding: 0;
    z-index: 3;
    max-width: 100%;
  }

  .traiteur-col-droite {
    padding: 0;
    text-align: left;
    margin-top: 0;
    width: 100%;
  }

  .traiteur-col-droite p {
    font-size: 16px;
    line-height: 1.6;
    margin-bottom: 12px;
    color: #111;
  }

  .traiteur-bouton-align {
    text-align: left;
    margin-top: 10px;
    padding: 0;
  }

  .traiteur-bouton-align a {
    font-size: 16px;
    font-weight: 700;
    color: #111;
    text-decoration: underline;
    display: inline-block;
  }
}

/* OFFRE MIDI SEULEMENT*/

/* COLONNE IMAGE (droite) */
.section-traiteur-layout.offre-midi .traiteur-col-droite {
  position: relative;
  height: 500px; /* hauteur de la colonne image */
  flex: 1;
}

/* Image en fond de la colonne */
.section-traiteur-layout.offre-midi .traiteur-col-droite img {
  position: absolute;
  inset: 0; /* top:0, right:0, bottom:0, left:0 */
  width: 100%;
  height: 100%;
  object-fit: cover; /* remplissage de la colonne */
  z-index: 1;
  border-radius: 0;
}

/* TITRE SUPERPOSÉ SUR L’IMAGE */
.section-traiteur-layout.offre-midi .titre-superpose-traiteur {
  position: absolute;
  top: -60px; /* distance du haut */
  right: 250px; /* distance du bord droit */
  left: auto;
  z-index: 2; /* au-dessus de l’image */
  font-size: 70px;
  font-weight: 800;
  line-height: 1.1;
  text-align: right;
  color: #111; /* mettre #fff si fond sombre */
}

/* COLONNE TEXTE (gauche) */
.section-traiteur-layout.offre-midi .traiteur-col-gauche {
  flex: 2;
  padding: 200px 10px;
  z-index: 2;
  position: relative;
  text-align: right;
}

/* BOUTON OFFRE MIDI */
.section-traiteur-layout.offre-midi .traiteur-bouton-align {
  text-align: right;
  margin-top: 30px;
  position: relative;
  z-index: 3;
}

.section-traiteur-layout.offre-midi .traiteur-bouton-align a {
  display: inline-block;
  padding: 12px 30px;
  font-size: 14px;
  font-weight: 700;
  color: black;
  background-color: white;
  border: 2px solid #111;
  border-radius: 8px;
  text-decoration: none;
  text-transform: uppercase;
  transition: all 0.3s ease;
  position: relative;
  z-index: 3;
}

.section-traiteur-layout.offre-midi .traiteur-bouton-align a:hover {
  background-color: #000;
  color: #fff;
}
@media (max-width: 768px) {

  /* Empilement : image/titre puis texte */
  .section-traiteur-layout.offre-midi .contenu-qui,
  .section-traiteur-layout.offre-midi .contenu-qui.inverse {
    display: flex;
    flex-direction: column;
    gap: 16px;
  }

  /* Colonne image : hauteur auto */
  .section-traiteur-layout.offre-midi .traiteur-col-droite {
    height: auto !important;
    width: 100% !important;
    flex: none !important;
    order: 1;
  }

  /* Image : plus en "fond absolute", devient une image normale */
  .section-traiteur-layout.offre-midi .traiteur-col-droite img {
    position: static !important;
    width: 100% !important;
    height: auto !important;
    display: block !important;
    object-fit: cover !important;
  }

  /* Titre : plus de position absolute / top négatif / right */
  .section-traiteur-layout.offre-midi .traiteur-col-droite .titre-superpose-traiteur {
    position: static !important;
    top: auto !important;
    right: auto !important;
    left: auto !important;
    bottom: auto !important;
    transform: none !important;

    font-size: 34px !important;
    line-height: 1.05 !important;
    text-align: left !important;

    margin: -40px 1px 0 13px !important;
    max-width: 100% !important;
  }

  /* Colonne texte : visible + spacing clean */
  .section-traiteur-layout.offre-midi .traiteur-col-gauche {
    height: auto !important;
    padding: 0 16px 24px !important;
    margin: 0; !important;
    text-align: left !important;
    flex: none !important;
    order: 2;
    display: block !important;
  }

  .section-traiteur-layout.offre-midi .traiteur-col-gauche p {
    font-size: 16px !important;
    line-height: 1.6 !important;
    margin: 0 0 12px 0 !important;
  }

  /* Bouton : aligné gauche en mobile */
  .section-traiteur-layout.offre-midi .traiteur-bouton-align {
    text-align: left !important;
    margin-top: 12px !important;
  }

  .section-traiteur-layout.offre-midi .traiteur-bouton-align a {
    font-size: 15px !important;
    padding: 12px 22px !important;
  }
}

/* === SECTION TRAITEUR – GALERIE DÉFILANTE === */
.section-4-traiteur {
  background: white;
  padding: 4px 10px;
  text-align: center;
  margin-top: -30px;
  overflow: hidden;
}

.section-4-traiteur .galerie-traiteur {
  display: flex;
  gap: 5px;
  animation: scrollGalleryTraiteur 18s linear infinite;
  will-change: transform;
}

.section-4-traiteur .galerie-traiteur img {
  width: 260px;
  height: 180px;
  object-fit: cover;
  flex-shrink: 0;
  border-radius: 0;
  margin-right: 5px;
  transition: transform 0.3s ease;
}

.section-4-traiteur .galerie-traiteur img:hover {
  transform: scale(1.05);
}

/* Animation desktop */
@keyframes scrollGalleryTraiteur {
  0% { transform: translateX(0); }
  100% { transform: translateX(-50%); }
}

/* === RESPONSIVE MOBILE GALERIE === */
@media (max-width: 768px) {
  .section-4-traiteur {
    margin-top: 40px;
  }

  .section-4-traiteur .galerie-traiteur {
    animation: scrollGalleryTraiteurMobile 15s linear infinite;
  }

  .section-4-traiteur .galerie-traiteur img {
    width: 140px;
    height: 130px;
  }

  @keyframes scrollGalleryTraiteurMobile {
    0% { transform: translateX(0); }
    100% { transform: translateX(-50%); }
  }
}

/* OFFRE MIDI — MOBILE (≤768px) */
@media (max-width: 768px) {
  .section-traiteur-layout.offre-midi .contenu-qui,
  .section-traiteur-layout.offre-midi .contenu-qui.inverse {
    display: flex;
    flex-direction: column;
    gap: 16px;
  }

  .section-traiteur-layout.offre-midi .traiteur-col-droite {
    order: 1;
  }

  .section-traiteur-layout.offre-midi .traiteur-col-droite img {
    display: none !important;
  }

  /* titre plus petit, en flux normal */
  .section-traiteur-layout.offre-midi .traiteur-col-droite > .titre-superpose-traiteur {
    position: static !important;
    top: auto !important;
    right: auto !important;
    left: auto !important;
    transform: none !important;
    display: block !important;
    font-size: 28px !important;
    line-height: 1.2 !important;
    text-align: left !important;
    margin: 0 16px 12px 16px !important;
    color: #111 !important;
  }

  /* TEXTE */
  .section-traiteur-layout.offre-midi .traiteur-col-gauche {
    order: 2 !important;
    display: block !important;
    width: 100% !important;
    padding: 0 15px 20px !important;
    margin: 0 !important;
    text-align: left !important;
    position: relative !important;
    z-index: 2 !important;
    opacity: 1 !important;
    visibility: visible !important;
    height: auto !important;
  }

  .section-traiteur-layout.offre-midi .traiteur-col-gauche p {
    display: flex !important;
    font-size: 16px !important;
    line-height: 1.6 !important;
    margin: 0 0 14px 0 !important;
    color: #111 !important;
  }

  /* BOUTON */
  .section-traiteur-layout.offre-midi .traiteur-bouton-align {
    display: block !important;
    text-align: left !important;
    margin: 10px 0 0 0 !important;
  }

  .section-traiteur-layout.offre-midi .traiteur-bouton-align a {
    display: inline-block !important;
    font-size: 16px !important;
    font-weight: 700 !important;
  }
}
/* ===============================
   ILS NOUS ONT FAIT CONFIANCE — MARQUEE
   =============================== */

.section-confiance {
  background: white;
  padding: 80px 20px;
  text-align: center;
}

.confiance-title {
  font-family: 'Raleway', sans-serif;
  font-size: 32px;
  font-weight: 900;
  color: #111;
  margin-bottom: 35px;
  text-transform: uppercase;
}

/* Fenêtre */
.confiance-marquee {
  width: 100%;
  overflow: hidden;
  position: relative;
}

/* Bande défilante */
.confiance-track {
  display: flex;
  align-items: center;
  gap: 60px;
  width: max-content;
  animation: confianceScroll 22s linear infinite;
  will-change: transform;
}

/* Logos */
.confiance-track img {
  height: 52px;
  max-height: 52px;
  width: auto;
  flex-shrink: 0;
  opacity: 0.8;
  filter: grayscale(100%);
  transition: all 0.25s ease;
}

.confiance-track img:hover {
  opacity: 1;
  filter: grayscale(0%);
}

/* Pause au hover */
.confiance-marquee:hover .confiance-track {
  animation-play-state: paused;
}

/* Animation */
@keyframes confianceScroll {
  0%   { transform: translateX(0); }
  100% { transform: translateX(-50%); }
}

/* MOBILE */
@media (max-width: 768px) {
  .section-confiance {
    padding: 55px 16px;
  }

  .confiance-title {
    font-size: 22px;
    margin-bottom: 25px;
  }

  .confiance-track {
    gap: 35px;
    animation-duration: 18s;
  }

  .confiance-track img {
    height: 38px;
    max-height: 38px;
  }
}

/* === FOOTER GLOBAL === */
footer.footer-global {
  background-color: white;
  color: #111;
  font-family: 'Raleway', sans-serif;
  padding: 60px 20px 0;
  width: 100%;
  margin: 0 auto;
}

.footer-global .footer-columns {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  flex-wrap: wrap;
  max-width: 1000px;
  margin: 0 auto 20px auto;
  gap: 30px;
}

.footer-global .footer-column {
  flex: 1;
  min-width: 200px;
  font-size: 14px;
  line-height: 1.4;
}

/* COLONNE 1 = MENU */
.footer-global .footer-column.menu-col {
  margin-left: 50px;
  max-width: 210px;
}

/* COLONNE 2 = PIZZA */
.footer-global .footer-column.pizza-col {
  max-width: 240px;
}

/* COLONNE 3 = VINO */
.footer-global .footer-column.vino-col {
  max-width: 260px;
}

/* COLONNE 4 = RÉSEAUX SOCIAUX */
.footer-global .footer-columns .footer-column:nth-child(4) {
  min-width: 200px;
  font-size: 14px;
  line-height: 1.4;
  color: #111;
}

.footer-global .footer-columns .footer-column ul {
  list-style: none;
  padding: 0;
  margin: 0;
}

.footer-global .footer-column li {
  margin-bottom: 6px;
}

.footer-global .footer-column a {
  color: #111;
  text-decoration: none;
  font-weight: 600;
}

.footer-global .footer-column a:hover {
  text-decoration: underline;
}

/* Titres */
.footer-global .footer-column strong {
  display: block;
  margin: 12px 0 6px;
  font-weight: 700;
  color: #111;
}

/* Paragraphes standards */
.footer-global .footer-column p {
  margin: -4px 0;
  font-size: 13px;
  line-height: 1.4;
  color: #111;
  font-weight: 400;
}

/* Horaires */
.footer-global .footer-column .hours-title {
  font-weight: 700;
  margin: 14px 0 4px;
}

.footer-opening-list {
  list-style: none;
  padding: 0;
  margin: 0;
  font-size: 10px;
  line-height: 1.5;
}

.footer-opening-list li {
  white-space: nowrap;
  margin-bottom: 0;
}

/* Icônes sociaux */
.footer-global .footer-social-icons {
  display: flex;
  gap: 12px;
  margin-top: 12px;
}

.footer-global .footer-social-icons img {
  width: 24px;
  height: 24px;
  object-fit: contain;
  filter: brightness(0);
  transition: opacity 0.3s ease;
}

.footer-global .footer-social-icons img:hover {
  opacity: 0.6;
}

/* Logo bord à bord */
.footer-logo-fullwidth {
  width: 100vw;
  margin: 50px 0 0 0;
  padding: 0;
  position: relative;
  left: 50%;
  transform: translateX(-50%);
  overflow: hidden;
}

.footer-logo-fullwidth img {
  display: block;
  width: 100%;
  height: auto;
}

/* Responsive footer */
@media (max-width: 768px) {
  footer.footer-global {
    padding-top: 40px;
    margin-top: 0;
  }

  .footer-global .footer-columns {
    flex-direction: column;
    gap: 20px;
  }

  .footer-global .footer-column {
    width: 100%;
    margin-bottom: 25px;
  }

  .footer-global .footer-social-icons {
    justify-content: flex-start;
  }

  .footer-opening-list li {
    white-space: normal;
  }

  .footer-logo-fullwidth {
    margin-top: 30px;
  }
}

@media (min-width: 769px) {
  .footer-global .footer-column.menu-col {
    padding-top: 12px;
  }
}

@media (max-width: 768px) {
  .footer-global .footer-column.menu-col {
    display: none;
  }

  .footer-global .footer-columns {
    align-items: stretch;
  }

  html, body {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
    background: white;
    overflow-x: hidden;
  }

  section,
  footer,
  .reservation,
  .reservation-info {
    margin-bottom: 0 !important;
    padding-bottom: 0 !important;
  }

  .footer-logo-fullwidth {
    margin: 0;
    padding: 0;
  }
}