/* Estilos generales */
body {
    font-family: Arial, sans-serif;
    margin: 0;
    padding: 0;
    box-sizing: border-box;
    scroll-behavior: smooth; /* Desplazamiento suave al hacer scroll */
  }
  
  /* Estilo base para el botón */
  .cta-button {
    display: inline-block;
    background-color: #f39c12;
    color: #fff;
    text-decoration: none;
    padding: 15px 30px; /* Aumenta el padding para hacer el botón más grande */
    border-radius: 8px; /* Ajusta el radio del borde si es necesario */
    font-weight: bold;
    transition: background-color 0.3s, transform 0.3s;
    font-size: 20px; /* Ajusta el tamaño de la fuente para que sea más grande */
  }
  
  /* Estilo para el botón más grande */
  .cta-button-large {
    padding: 20px 40px; /* Aumenta el padding para un botón más grande */
    font-size: 24px; /* Tamaño de fuente más grande */
  }
  
  /* Efecto hover para el botón */
  .cta-button:hover {
    background-color: #f39d12be;
    transform: scale(1.1);
  }
  
  /* Animación de fade para las secciones */
.fade-in-section {
  opacity: 0;
  transform: translateY(20px); /* Comienza con un ligero desplazamiento hacia abajo */
  transition: opacity 0.6s ease-out, transform 0.6s ease-out;
}

.fade-in-section.is-visible {
  opacity: 1;
  transform: none; /* Regresa a su posición original */
}