@charset "UTF-8";
/*VARIABLES*/
/*MIXINS*/
/*EXTEND PLACEHOLDER*/
form button, .btn-warning {
  border-radius: 12px;
  font-weight: 700;
  letter-spacing: 0.5px;
  transition: background 0.2s, box-shadow 0.2s;
}

/*BASE*/
body {
  font-family: "Roboto", sans-serif;
  background: #f5eee6;
  color: #6e4b1b;
  line-height: 1.6;
  overflow-x: hidden;
}

h1, .brand-name, .section-title {
  font-family: "Playfair Display", serif;
}

/*NAVBAR*/
.navbar {
  background: rgba(166, 124, 82, 0.7);
  -webkit-backdrop-filter: blur(8px);
          backdrop-filter: blur(8px);
  box-shadow: 0 2px 16px rgba(0, 0, 0, 0.1);
  border-bottom: 1.5px solid rgba(110, 75, 27, 0.08);
  transition: background 0.4s, box-shadow 0.4s;
}
.navbar.navbar-solid {
  background: rgba(110, 75, 27, 0.92);
  box-shadow: 0 4px 18px rgba(0, 0, 0, 0.18);
}
.navbar .navbar-brand {
  font-size: 1.7rem;
  letter-spacing: 1px;
}

/*HERO SECTION*/
.hero-section {
  position: relative;
  min-height: 80vh;
  display: flex;
  align-items: center;
  justify-content: center;
  text-align: center;
  color: #fff;
  background: linear-gradient(rgba(0, 0, 0, 0.35), rgba(0, 0, 0, 0.35)), url("../Pictures/fondo.png") center/cover no-repeat;
}
.hero-section .hero-overlay {
  position: absolute;
  inset: 0;
  background: rgba(0, 0, 0, 0.35);
}
.hero-section .hero-content {
  position: relative;
  z-index: 2;
  max-width: 700px;
  animation: fade-in 1.2s ease-out forwards;
  text-shadow: 0 4px 24px rgba(0, 0, 0, 0.25);
}
.hero-section .hero-content h1 {
  animation: hero-pop 1.2s cubic-bezier(0.68, -0.55, 0.27, 1.55) both;
}
.hero-section .hero-content p {
  font-size: 1.3rem;
  margin-bottom: 1.5rem;
  opacity: 0.93;
}
.hero-section .hero-btn {
  transition: transform 0.3s ease;
}
.hero-section .hero-btn:hover {
  transform: scale(1.05);
}

@keyframes hero-pop {
  0% {
    opacity: 0;
    transform: scale(0.85) translateY(40px);
  }
  100% {
    opacity: 1;
    transform: scale(1) translateY(0);
  }
}
/*BACKGROUND WATERMARK*/
.background-watermark {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: url("../Pictures/fondo.png") center/cover no-repeat;
  opacity: 0.08;
  filter: blur(5px);
  z-index: -1;
  pointer-events: none;
}

/*SECCIONES*/
section {
  background: #d6bfa7;
  border-radius: 15px;
  padding: 4rem 2rem;
  margin-bottom: 2rem;
  box-shadow: 0 12px 30px rgba(0, 0, 0, 0.1);
  transition: transform 0.4s ease, box-shadow 0.4s ease;
}
section.fade-in {
  opacity: 0;
  transform: translateY(40px);
}
section.appear {
  opacity: 1;
  transform: translateY(0);
}

/*MENU CARDS*/
.menu-card {
  position: relative;
  overflow: hidden;
  border-radius: 15px;
  background: rgba(255, 255, 255, 0.55);
  box-shadow: 0 8px 32px rgba(110, 75, 27, 0.1);
  border: 1.5px solid rgba(166, 124, 82, 0.13);
  -webkit-backdrop-filter: blur(2px);
          backdrop-filter: blur(2px);
  cursor: pointer;
  transition: transform 0.3s, box-shadow 0.3s;
}
.menu-card:hover {
  transform: translateY(-8px) scale(1.04);
  box-shadow: 0 16px 40px rgba(110, 75, 27, 0.18);
}
.menu-card .card-img-container {
  position: relative;
}
.menu-card .overlay {
  position: absolute;
  bottom: 0;
  width: 100%;
  padding: 1rem;
  background: rgba(110, 75, 27, 0.85);
  transform: translateY(100%);
  transition: transform 0.3s ease;
}
.menu-card:hover .overlay {
  transform: translateY(0);
}
.menu-card .overlay-text {
  color: #fff;
  font-weight: bold;
  text-align: center;
}

.menu-card.bg-1 {
  background-color: #fffbe6;
}

.menu-card.bg-2 {
  background-color: #f5eee6;
}

.menu-card.bg-3 {
  background-color: #f9e7d6;
}

.menu-card.bg-4 {
  background-color: #f7f3ee;
}

/*GALERÍA POLAROID*/
#gallery img {
  border: 6px solid #fff;
  box-shadow: 0 8px 24px rgba(110, 75, 27, 0.13);
  transition: transform 0.3s, box-shadow 0.3s;
}
#gallery img:hover {
  transform: rotate(-2deg) scale(1.04);
  box-shadow: 0 16px 40px rgba(110, 75, 27, 0.18);
}

/*HOVER ZOOM*/
.hover-zoom {
  transition: transform 0.3s ease;
}
.hover-zoom:hover {
  transform: scale(1.07);
}

/*BOTONES*/
.btn-warning {
  background-color: #c9a27b;
  border: none;
  font-weight: 600;
}
.btn-warning:hover {
  background-color: rgb(186.1935483871, 136.5, 86.8064516129);
  transform: translateY(-2px) scale(1.05);
}

/*SPLASH SCREEN*/
#splash {
  position: fixed;
  inset: 0;
  background: #fff;
  display: flex;
  justify-content: center;
  align-items: center;
  z-index: 9999;
  animation: splash-fade 3s forwards;
}
#splash img {
  width: 200px;
  animation: splash-zoom 1s ease-in-out infinite alternate;
}

@keyframes splash-zoom {
  0% {
    transform: scale(1);
  }
  100% {
    transform: scale(1.1);
  }
}
@keyframes splash-fade {
  0%, 80% {
    opacity: 1;
  }
  100% {
    opacity: 0;
    display: none;
  }
}
/*FADE-IN ANIMACIONES*/
@keyframes fade-in {
  from {
    opacity: 0;
    transform: translateY(40px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}
/*FORMULARIO DE CONTACTO*/
form input, form textarea {
  border-radius: 12px;
  border: 1.5px solid #d6bfa7;
  box-shadow: 0 2px 8px rgba(166, 124, 82, 0.13);
  transition: border 0.2s, box-shadow 0.2s;
}
form input:focus, form textarea:focus {
  border-color: #a67c52;
  box-shadow: 0 4px 16px rgba(166, 124, 82, 0.12);
}
form button {
  box-shadow: 0 2px 8px rgba(201, 162, 123, 0.1);
}
form button:hover {
  background: rgb(189.1548387097, 141.6, 94.0451612903);
  box-shadow: 0 4px 16px rgba(201, 162, 123, 0.18);
}

/*FOOTER SOCIAL ICONS*/
footer .social-links a {
  display: inline-block;
  margin: 0 0.5rem;
  font-size: 1.3rem;
  color: #fff;
  opacity: 0.85;
  transition: color 0.2s, transform 0.2s;
}
footer .social-links a:hover {
  color: #c9a27b;
  transform: scale(1.2) translateY(-2px);
  text-decoration: none;
}

/*CONTACTO: ENLACES EN NEGRO*/
#contact a[href^=mailto],
#contact a[href^=tel] {
  color: #222 !important;
  text-decoration: underline;
  font-weight: 500;
  transition: color 0.2s;
}
#contact a[href^=mailto]:hover,
#contact a[href^=tel]:hover {
  color: #c9a27b !important;
}

/*RESPONSIVE MEJORAS*/
@media (max-width: 768px) {
  section {
    padding: 2rem 1rem;
  }
  .menu-card {
    min-width: 90%;
  }
  #gallery img {
    margin-bottom: 1rem;
  }
  .hero-section {
    min-height: 60vh;
  }
}/*# sourceMappingURL=estilos.css.map */