/* RESET */
*{
  margin:0;
  padding:0;
  box-sizing:border-box;
}

html{
  scroll-behavior:smooth;
}

body{
  font-family:Arial, Helvetica, sans-serif;
  color:#111;
  background:#fff;
}

/* CONTENIDO CENTRADO */
.content-wrapper{
  width:90%;
  max-width:1400px;
  margin:auto;
}

/* HEADER */
.header{
  width:100%;
  background-image:url('imgs/fondo-v.jpg');
  position:sticky;
  top:0;
  z-index:999;
}

.header-container{
  width:90%;
  max-width:1400px;
  margin:auto;
  display:flex;
  justify-content:space-between;
  align-items:center;
  padding:20px 0;
}

.logo{
  font-size:2rem;
  font-weight:bold;
}

/* MENU */
.menu{
  display:flex;
  gap:40px;
}

.menu a{
  text-decoration:none;
  color:#fff;
  font-weight:bold;
  transition:.3s;
}

.menu a:hover{
  opacity:.6;
}

/* HAMBURGUESA */
.menu-toggle{
  display:none;
  flex-direction:column;
  gap:6px;
  cursor:pointer;
}

.menu-toggle span{
  width:30px;
  height:3px;
  background:#fff; /* Cambiado a blanco para que se note sobre fondo-v */
  border-radius:10px;
}

/* HERO CON CARRUSEL */
.hero{
  position:relative;
  height:90vh;
  overflow:hidden;
}

.hero-swiper{
  width:100%;
  height:100%;
}

.swiper-slide{
  position:relative;
  display:flex;
  align-items:center;
  background-size:cover;
  background-position:center;
}

/* Asignación de imágenes a cada slide */
.slide-1 { background-image: url('imgs/fondo1.jpg'); }
.slide-2 { background-image: url('imgs/fondo2.jpg'); } 
.slide-3 { background-image: url('imgs/fondo3.jpg'); } 

.hero-overlay{
  position:absolute;
  inset:0;
  background:rgba(0,0,0,.35); /* Capa oscura uniforme para que lea bien el texto */
  z-index:1;
}

.hero .content-wrapper{
  position:relative;
  z-index:2;
  display:flex;
  justify-content:flex-start;
  color: #fff; /* Asegura texto blanco sobre el slider */
}

.hero-content{
  max-width:500px;
}

.small-title{
  font-size:.9rem;
  font-weight:bold;
}

.hero h1{
  font-size:4rem;
  line-height:1.1;
  margin:20px 0;
}

.hero-buttons{
  display:flex;
  gap:20px;
}

.hero-buttons button{
  background:#000;
  color:#fff;
  border:none;
  padding:15px 25px;
  border-radius:6px;
  cursor:pointer;
  font-weight:bold;
}

/* SECTION */
.section{
  padding:100px 0;
}

.section-mini-title{
  font-size:.9rem;
  font-weight:bold;
}

.section h2{
  font-size:4rem;
  line-height:1.1;
  margin:20px 0 60px;
  max-width:650px;
}

/* ICONS */
.icons-grid{
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:40px;
}

.icon-card{
  text-align:center;
}

.circle{
  width:120px;
  height:120px;
  border-radius:50%;
  background-image:url('imgs/fondo-v.jpg');
  display:flex;
  justify-content:center;
  align-items:center;
  margin:auto;
  margin-bottom:25px;
}

.circle i{
  color:#fff;
  font-size:3rem;
}

.icon-card h3{
  margin-bottom:15px;
}

.icon-card p{
  line-height:1.7;
  color:#555;
}

/* PARALLAX ADAPTADO PARA PERMITIR INTERACCIÓN */
.parallax{
  position:relative;
  height:500px;
  overflow:hidden;
  display:flex;
  justify-content:center;
  align-items:center;
  text-align:center;
  background:#000;
}

.parallax iframe {
  position:absolute;
  top:50%;
  left:50%;
  width:100%;
  height:100%;
  transform:translate(-50%, -50%);
  pointer-events: auto; /* CORRECCIÓN: Permite que el usuario haga clic para reproducir */
  z-index:1;
}

.parallax-content{
  position:relative;
  z-index:2;
  background:rgba(0, 0, 0, 0.5); /* Oscurecido un poco más para contraste */
  width:100%;
  padding:20px 0;
  pointer-events: none; /* Permite que los clics pasen a través del texto hacia el video */
}

.parallax-content h2{
  font-size:5rem;
  color:#FFF;
}

/* CONTENT GRID */
.content-grid{
  display:grid;
  grid-template-columns:1fr 400px;
  gap:80px;
  align-items:center;
}

.content-text p{
  line-height:1.8;
  margin-bottom:40px;
  color:#444;
}

.content-image{
  width:100%;
  height:600px;
  background:#CCC;
  background-image:url('imgs/fondo3.jpg');
  background-size:cover;
  background-position:center;
}

/* FOOTER */
.footer{
  background-image:url('imgs/fondo-v.jpg');
  padding:40px 0;
  color:#fff;
}

.footer-wrapper{
  display:flex;
  justify-content:space-between;
  align-items:center;
}

.footer-left h3{
  font-size:2rem;
  margin-bottom:10px;
}

.footer-left p{
  font-size:2rem;
}

.footer-social{
  display:flex;
  gap:20px;
}

.footer-social a{
  width:60px;
  height:60px;
  border-radius:50%;
  background:#000;
  color:#fff;
  display:flex;
  justify-content:center;
  align-items:center;
  text-decoration:none;
  font-size:1.4rem;
}

/* RESPONSIVE */
@media(max-width:992px){
  .hero h1{
    font-size:3rem;
  }
  .section h2{
    font-size:3rem;
  }
  .icons-grid{
    grid-template-columns:repeat(2,1fr);
  }
  .content-grid{
    grid-template-columns:1fr;
  }
  .content-image{
    height:400px;
  }
}

@media(max-width:768px){
  /* MENU MOBILE */
  .menu-toggle{
    display:flex;
  }
  .menu{
    position:absolute;
    top:100%;
    left:0;
    width:100%;
    background-image:url('imgs/fondo-v.jpg');
    flex-direction:column;
    align-items:center;
    padding:30px 0;
    gap:25px;
    display:none;
  }
  .menu.active{
    display:flex;
  }
  /* HERO */
  .hero{
    height:70vh; /* Ajuste cómodo para móviles */
  }
  .hero .content-wrapper{
    justify-content:center;
  }
  .hero-content{
    text-align:center;
  }
  .hero h1{
    font-size:2.5rem;
  }
  .hero-buttons{
    justify-content:center;
    flex-wrap:wrap;
  }
  /* SECTION */
  .section{
    padding:70px 0;
  }
  .section h2{
    font-size:2.2rem;
  }
  /* ICONS */
  .icons-grid{
    grid-template-columns:1fr;
    gap:60px;
  }
  /* PARALLAX */
  .parallax{
    height:350px;
  }
  .parallax-content h2{
    font-size:3rem;
  }
  /* FOOTER */
  .footer-wrapper{
    flex-direction:column;
    gap:30px;
    text-align:center;
  }
}