html, body{
    height: 100%;
    padding: 0;
    margin: 0;
    overflow-x: hidden;
    /* background-color:rgb(15 99 148); */
  }

  .titulo-principal{
    color: #000000;
    display: flex;
  }
  
  header{
    font-family: "Montserrat", sans-serif;
  }
/*Videoo----------------BACKGROUND--------------------------------*/  
 .video-background {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  overflow: hidden;
  z-index: -1; /* detrás de todo */
}

.video-background video {
  width: 100%;
  height: 100%;
  object-fit: cover; /* llena la pantalla como background-size: cover */
}

.contenido {
  position: relative;
  z-index: 1; /* se muestra encima del video */
  color: #c0fa14; /* texto legible sobre el video */
   display: flex;
  flex-direction: column;
  min-height: 100vh;
}
/*Videoo-----------------BACKGROUND-------------------------------*/

  nav {
  display: flex;
  align-items: center;    
  position: relative; 
         
}

  nav img {
  margin-top: 7%;
  margin-left: 20%;
  width: 170px;
  height: auto;
  
}

nav ul {
  display: flex;
  gap: 130px;                 /* espacio entre items */
  list-style: none;          /* quita puntos */
  margin: 0;
  padding: 0;
  
  font-size: 120%;
  position: absolute;   /* saca el ul del flujo */
  left: 50%;            /* lo lleva al centro */
  transform: translateX(-50%);
}



nav ul li a {
  text-decoration: none;     
  color: #ffffff;              
  font-weight: 100;    
  align-items: center;  
  transition: color 0.7s ease, background-color 0.7s ease; 
}
/* cambia el color del menu y hace sombra */
nav ul li a:hover {
  position: relative;  
  color: #c0fa14;
  border-radius: 5px;         /* opcional: esquinas redondeadas */
  overflow: hidden;             /* oculta lo que sobresalga */
  transition: color 0.7s ease; 
}

  main {
      flex: 1; /* ocupa todo el espacio disponible */
    }

.titulo-principal{
  font-weight: 100;
  font-size: 700%;
  display: flex;
  justify-content: center;
  margin-top: 3%;
  font-family: "Montserrat", sans-serif;
  color: #c0fa14;
  /* font-family: 'Ysabeau',sans-serif; */
}


.contenedor-boton-index a{
  text-decoration: none;
  color: black;  
  font-size: 120%;
}


.contenedor-boton-index{
  text-decoration: none;
  font-family: "Montserrat", sans-serif;
  display: flex;
  justify-content: center; /* centra horizontal */
  align-items: center;     /* centra vertical si el contenedor tiene altura */
  margin-top: 9%;
}






.titulo-principal-segundaParte{
    font-weight: 300;
    font-size: 500%;
    display: flex;
    justify-content: center;
    align-items: center;
    text-align: center;
    font-family: "Montserrat", sans-serif;
    color: #ffffff;
}


p{
  display: flex;
  justify-content: center;
  align-items: center;
  text-align: center;
  font-size: 180%;
  font-weight: 200;
  /* font-family: 'Inter',sans-serif; */
  font-family: "Montserrat", sans-serif;
}
  
  footer {
    text-align: center;
    padding: 1px;
    background: transparent;
    color: #c0fa14;

    font-family: "Montserrat", sans-serif;
    font-weight: 100;
  }

/* .contenedor-boton a{
  text-decoration: none;
  color: black;
  transition: color 0.7s ease;
} */


.contenedor-boton{
  text-decoration: none;
  font-family: "Montserrat", sans-serif;
  display: flex;
  justify-content: center; /* centra horizontal */
  align-items: center;     /* centra vertical si el contenedor tiene altura */
}

/* button {
  font-family: "Montserrat", sans-serif;
  margin-top: 2%;
  font-size: 120%;
  font-weight: 200;
  padding: 10px 20px;
  background-color: #c0fa14;
  transition: color 0.7s ease, background-color 0.7s ease;
  border-radius: none; 
  border-bottom: 0%;
  box-shadow: none;
  border-style: none;
  border-radius: 4%;
  color: black;
}

button:hover {
  
  border-color: #c0fa14;
  font-family: "Montserrat", sans-serif;
  position: relative;  
  background-color: #c0fa143f;
  color: #c0fa14;
  overflow: hidden;             /* oculta lo que sobresalga */
  /* transition: color 0.7s ease;  */
 
/* } */ 

.cuadro-video {
  width: 60%; /* ajusta a gusto */
  margin: 40px auto;
  border: 2px solid #c0fa14;
  border-radius: 15px;
  overflow: hidden;
  margin-top: 9%;
  /* box-shadow: 0 0 20px rgba(192, 250, 20, 0.3); */
}

.cuadro-video video {
  width: 100%;
  height: auto;
  display: block;
}

/* RESPONSIVE RESPONSIVE RESPONSIVE RESPONSIVE RESPONSIVE RESPONSIVE  */
/* ======================= */
/* DESKTOP (default)       */
/* ======================= */

@media (max-width: 1024px) {
  .titulo-principal{
    font-size: large;
  }
  .contenedor-boton-index a {
    text-decoration: none;
    color: black;
    font-size: 120%;
}
}
@media (max-width: 480px) {
    .titulo-principal {
        font-size: 40%;
    }
}