/* Define la fuente Inter */
        @import url('https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700&display=swap');
        body {
            font-family: 'Inter', sans-serif;
        }
        /* Estilos personalizados para el fondo del hero section */
        .hero-background {
            /* Usando un degradado de los azules del logo */
            background: #2663AE;
            background: linear-gradient(90deg, rgba(38, 99, 174, 1) 0%, rgba(45, 54, 136, 1) 50%, rgba(29, 78, 206, 1) 100%);
            background-size: cover;
            background-position: center;
            background-repeat: no-repeat;
        }
        /* Estilo para los iconos de Lucide */
        .lucide {
            width: 24px;
            height: 24px;
            stroke-width: 2;
            stroke: currentColor;
            fill: none;
            stroke-linecap: round;
            stroke-linejoin: round;
        }
        span{
            position:relative;
        }
        span::before{
            position:absolute;
            bottom: 0;
            content: '';
            height:0.8rem;
            width:100%;
            background-color:yellow;
            z-index:-1;
        }

        #soluciones {
           display: inline-flex;  
           flex-direction: row;
           width: 100%; 
           padding: 12rem;
        }

            /* Corrige padding excesivo en #soluciones */
    #soluciones {
        padding: 4rem 1rem;
    }
    .button-demo {
        font-size: 1.25rem; /* Tamaño de fuente más grande */
         padding: 0.75rem 1.5rem; 
    }

/* Custom */

.type {
  color: #dbd56e;
  background: -webkit-linear-gradient(25deg, #1d4ed8, #333);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  font-size: 3rem;
  font-weight: 500;
  overflow: hidden;
  /* white-space: nowrap; */
  position: relative;
}


    @media (min-width: 768px) {
        #soluciones {
            padding: 6rem 3rem;
        }
    }

    /* Ajusta tamaños de texto para títulos grandes en móvil */
    h1, h2, h3 {
        word-break: break-word;
    }

    @media (max-width: 640px) {
        h1 {
            font-size: 2rem;
        }
        h2 {
            font-size: 1.75rem;
        }
        h3 {
            font-size: 1.25rem;
        }
        #soluciones {
            display: inline-flex;
            flex-direction: column;
            padding: 1rem;
        }

        .button-demo {
            font-size: 1rem; /* Tamaño de fuente más grande */
            padding: 0.75rem 1.5rem; /* Ajusta el padding para móviles */
        }   

         #mobile-logo {
            display: block; /* Asegura que el logo móvil se muestre */width: 100%;
            background: white;
            display: flex;
            justify-content: center;
         }

}