@keyframes navEntrada{
  from{opacity:0;transform:translateY(-35px)}
  to{opacity:1;transform:translateY(0)}
}

@keyframes aparecerSuave{
  from{opacity:0;transform:translateY(45px)}
  to{opacity:1;transform:translateY(0)}
}

@keyframes brilloTitulo{
  from{text-shadow:0 0 0 rgba(255,196,0,0)}
  to{text-shadow:0 0 32px rgba(255,196,0,.75)}
}

@keyframes pulsoBoton{
  0%,100%{box-shadow:0 0 0 rgba(255,196,0,0)}
  50%{box-shadow:0 0 30px rgba(255,196,0,.42)}
}

@keyframes flotarIcono{
  0%,100%{transform:translateY(0)}
  50%{transform:translateY(-7px)}
}

@keyframes barraTitulo{
  from{width:35%}
  to{width:100%}
}

@keyframes barridoHero{
  0%,45%{transform:translateX(-120%)}
  70%,100%{transform:translateX(120%)}
}

nav{
  animation:navEntrada .8s ease both;
}

header::after{
  content:"";
  position:absolute;
  inset:0;
  background:linear-gradient(120deg,transparent,rgba(255,196,0,.10),transparent);
  animation:barridoHero 6s ease-in-out infinite;
  pointer-events:none;
}

.hero h1{
  animation:aparecerSuave .9s ease both, brilloTitulo 2.8s infinite alternate ease-in-out;
}

.hero p{
  animation:aparecerSuave 1.1s ease both;
}

.hero .buttons{
  animation:aparecerSuave 1.25s ease both;
}

.badge{
  animation:aparecerSuave .75s ease both, pulsoBoton 2.7s infinite ease-in-out;
}

.btn-primary{
  animation:pulsoBoton 2.6s infinite ease-in-out;
}

.btn:hover{
  letter-spacing:.4px;
}

section{
  animation:aparecerSuave .9s ease both;
}

.section-title h2{
  position:relative;
  display:inline-block;
}

.section-title h2::after{
  content:"";
  position:absolute;
  left:0;
  bottom:-10px;
  height:3px;
  width:45%;
  background:var(--yellow);
  border-radius:999px;
  animation:barraTitulo 2.4s ease-in-out infinite alternate;
}

.card{
  animation:aparecerSuave .9s ease both;
}

.card:nth-child(1){animation-delay:.05s}
.card:nth-child(2){animation-delay:.12s}
.card:nth-child(3){animation-delay:.19s}
.card:nth-child(4){animation-delay:.26s}
.card:nth-child(5){animation-delay:.33s}
.card:nth-child(6){animation-delay:.40s}

.info-line i{
  animation:flotarIcono 2.5s ease-in-out infinite;
}

/* Sin rebote automático en iconos de ventajas y contacto */
#ventajas .card i,
#contacto .contact-card i,
#contacto .social a,
#contacto .social a i{
  animation:none;
}

.rating-big .num{
  animation:brilloTitulo 2.6s infinite alternate ease-in-out;
}

.reviews-carousel{
  overflow:hidden;
  mask-image:linear-gradient(to right, transparent, black 8%, black 92%, transparent);
  -webkit-mask-image:linear-gradient(to right, transparent, black 8%, black 92%, transparent);
}

.reviews-scroll .card:hover{
  transform:translateY(-14px) scale(1.04);
}

.hour-row{
  transition:.35s ease;
}

.hour-row:hover{
  background:rgba(255,196,0,.08);
  padding-left:34px;
}

.info-box,
iframe{
  transition:.35s ease;
}

.info-box:hover,
iframe:hover{
  transform:translateY(-6px);
  border-color:var(--yellow);
  box-shadow:0 15px 35px rgba(255,196,0,.14);
}

iframe:hover{
  filter:grayscale(0%) contrast(1.1);
}

/* Sin giro/rebote en iconos de contacto al pasar el mouse */
.contact-card:hover i{
  transform:none;
}

/* Redes sociales sin animación de rebote */
.social a:nth-child(1),
.social a:nth-child(2),
.social a:nth-child(3){
  animation:none;
}

footer{
  animation:aparecerSuave .9s ease both;
}

@media(max-width:780px){
  .reviews-scroll{animation-duration:120s}
  .section-title h2::after{width:70%}
}
.section-title h2::after,h2::after{  display: none !important;}
/* Quitar animación de los iconos de ubicación */
#ubicacion .info-line i{
  animation: none !important;
  transform: none !important;
}

/* Mantener los iconos quietos incluso al pasar el mouse */
#ubicacion .info-line:hover i{
  animation: none !important;
  transform: none !important;
}
/* Acercamiento al pasar el mouse en ventajas y contacto */

#ventajas .card,
#contacto .contact-card{
  transition: transform .35s ease, box-shadow .35s ease, border-color .35s ease;
}

#ventajas .card:hover,
#contacto .contact-card:hover{
  transform: scale(1.06);
  border-color: var(--yellow);
  box-shadow: 0 18px 40px rgba(255,196,0,.18);
}
/* Acercamiento en todas las tarjetas de ventajas */
#ventajas .cards .card{
  transition: transform .35s ease, box-shadow .35s ease, border-color .35s ease;
}

#ventajas .cards .card:hover{
  transform: scale(1.06) !important;
  border-color: var(--yellow);
  box-shadow: 0 18px 40px rgba(255,196,0,.18);
}
/* Hover moderno y más suave en tarjetas */
#ventajas .card,
#contacto .contact-card{
  transition: transform .35s ease, box-shadow .35s ease, border-color .35s ease, background .35s ease;
}

#ventajas .card:hover,
#contacto .contact-card:hover{
  transform: scale(1.035);
  border-color: rgba(255,196,0,.45);
  background: #141414;
  box-shadow: 0 14px 30px rgba(0,0,0,.45);
}

/* Quitar luz amarilla fuerte del barrido */
#ventajas .card::before,
#contacto .contact-card::before{
  display: none !important;
}
/* Ajustar reseñas largas */
.reviews-scroll .card{
  width: 320px !important;
  min-width: 320px !important;
  height: auto;
  white-space: normal;
}

.reviews-scroll .card p{
  white-space: normal;
  word-wrap: break-word;
  overflow-wrap: break-word;
  line-height: 1.5;
  max-width: 100%;
}
.reviews-scroll .card{
  min-height: 260px;
}
/* Reseñas más compactas y modernas */
.reviews-scroll .card{
  width: 300px !important;
  min-width: 300px !important;
  min-height: 250px;
  padding: 28px 30px;
  white-space: normal;
}

.reviews-scroll .card p{
  font-size: 1rem;
  line-height: 1.45;
  max-width: 100%;
  display: -webkit-box;
  -webkit-line-clamp: 4;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

.reviews-scroll .review-name{
  margin-top: 18px;
}
/* Quitar brillo fuerte del título principal */
.hero h1,
.hero h1 .yellow{
  text-shadow: none !important;
  animation: aparecerSuave .9s ease both !important;
}

/* Dejar el amarillo más limpio y moderno */
.hero h1 .yellow{
  color: var(--yellow);
}
/* Quitar brillo del badge superior */
.badge{
  box-shadow: none !important;
  filter: none !important;
}

/* Quitar brillo del botón */
.btn-primary{
  box-shadow: none !important;
}

/* Hover más limpio y moderno */
.btn-primary:hover{
  box-shadow: 0 8px 20px rgba(0,0,0,.4);
  transform: translateY(-2px);
}

/* Opcional: bajar intensidad del color amarillo */
.badge{
  background: #e6b800; /* amarillo menos saturado */
}
/*letras 
/* Letras más elegantes y modernas */
.hero h1{
  font-family: "Montserrat", "Poppins", Arial, sans-serif;
  font-weight: 800;
  letter-spacing: -3px;
  line-height: 1.02;
}

.hero h1 .yellow{
  color: var(--yellow);
}

.hero p{
  font-family: "Inter", Arial, sans-serif;
  font-weight: 400;
  letter-spacing: -0.3px;
  line-height: 1.7;
}

.badge{
  font-family: "Inter", Arial, sans-serif;
  font-weight: 800;
  letter-spacing: -0.2px;
}
/* Arreglar iconos y textos de contacto */
.contact-card a{
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 10px;
  text-align: center;
}

.contact-card a i,
.contact-card > i{
  display: block;
  font-size: 2.4rem;
  color: var(--yellow);
  margin: 0 0 10px 0;
}

.contact-card h3{
  margin-bottom: 8px;
  text-align: center;
}

.contact-card span,
.contact-card a{
  font-size: 1rem;
  line-height: 1.3;
}

/* Ajuste específico para que no queden al lado del texto */
.contact-card i{
  position: static !important;
  transform: none !important;
}