@import url('https://fonts.googleapis.com/css2?family=Montserrat:ital,wght@0,100..900;1,100..900&display=swap');

/* General */
body {
  margin: 0;
  font-family: "Montserrat", sans-serif;
  background: #111;
  color: #fff;
  line-height: 1.6;
}

/* Contenedor general para centrar todo */
.container {
  max-width: 1100px; /* ajusta según te guste: 900px más compacto, 1200px más ancho */
  margin: 0 auto;
  padding: 0 20px;
}

/* Idiomas */
.lang-selector {
  text-align: right;
  padding: 10px 20px;
  background: #222;
}
.lang-selector a {
  color: #fff;
  text-decoration: none;
  margin-left: 8px;
}
.lang-selector a:hover {
  color: #aaa;
}

/* Hero */
.hero {
  position: relative;
  background: url("hero.jpg") center/cover no-repeat;
  height: 70vh;
  display: flex;
  align-items: center;
  justify-content: center;
  text-align: center;
}
.hero .overlay {
  position: absolute;
  inset: 0;
  background: rgba(0,0,0,0.6);
}
.hero-content {
  position: relative;
  max-width: 700px;
  padding: 20px;
  background: rgba(20,20,20,0.7);
  border-radius: 10px;
}
.hero h1 {
  margin-bottom: 10px;
  font-size: 2.5rem;
}

/* Menú */
.menu-section {
  display: flex;
  justify-content: center;
  gap: 20px;
  padding: 50px 20px;
  flex-wrap: wrap;
}
.card {
  background: #222;
  padding: 20px;
  border-radius: 10px;
  width: 300px;
  text-align: center;
}
.card h2 {
  margin-bottom: 10px;
}
.price {
  display: block;
  margin-top: 10px;
  font-weight: bold;
  font-size: 1.2rem;
}

/* Sección con imagen intermedia */
.image-break {
  position: relative;
  background: url("food.jpg") center/cover no-repeat;
  height: 50vh;
  display: flex;
  align-items: center;
  justify-content: center;
  text-align: center;
}
.image-break .overlay {
  position: absolute;
  inset: 0;
  background: rgba(0,0,0,0.6);
}
.image-break .image-text {
  position: relative;
  max-width: 600px;
  padding: 20px;
  background: rgba(20,20,20,0.6);
  border-radius: 10px;
}

/* Reseñas */
.reviews {
  padding: 50px 20px;
  text-align: center;
}
.review-slider {
  max-width: 800px;
  margin: 20px auto;
  min-height: 150px;
}
.review {
  display: none;
  background: #222;
  padding: 20px;
  border-radius: 10px;
  font-style: italic;
}

/* Footer */
footer {
  background: #222;
  padding: 30px 20px;
  text-align: center;
}
footer h3 {
  margin-bottom: 10px;
}
footer a img {
  width: 30px;
  margin-top: 10px;
}
.map-container {
  margin-top: 20px;
  border-radius: 10px;
  overflow: hidden;
}