.elementor-217 .elementor-element.elementor-element-afa69f9{--display:flex;--min-height:100vh;--flex-direction:column;--container-widget-width:calc( ( 1 - var( --container-widget-flex-grow ) ) * 100% );--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--align-items:flex-start;--gap:0px 0px;--row-gap:0px;--column-gap:0px;}.elementor-widget-image-box .elementor-image-box-title{font-family:var( --e-global-typography-primary-font-family ), Sans-serif;font-weight:var( --e-global-typography-primary-font-weight );color:var( --e-global-color-primary );}.elementor-widget-image-box:has(:hover) .elementor-image-box-title,
					 .elementor-widget-image-box:has(:focus) .elementor-image-box-title{color:var( --e-global-color-primary );}.elementor-widget-image-box .elementor-image-box-description{font-family:var( --e-global-typography-text-font-family ), Sans-serif;font-weight:var( --e-global-typography-text-font-weight );color:var( --e-global-color-text );}.elementor-217 .elementor-element.elementor-element-f430929{width:var( --container-widget-width, 100% );max-width:100%;--container-widget-width:100%;--container-widget-flex-grow:0;}.elementor-217 .elementor-element.elementor-element-f430929 > .elementor-widget-container{padding:0% 0% 0% 0%;}.elementor-217 .elementor-element.elementor-element-f430929.elementor-element{--order:99999 /* order end hack */;}.elementor-217 .elementor-element.elementor-element-f430929 .elementor-image-box-wrapper{text-align:start;}.elementor-217 .elementor-element.elementor-element-f430929 .elementor-image-box-title{margin-bottom:5px;color:#F5F5F5;}.elementor-217 .elementor-element.elementor-element-f430929 .elementor-image-box-description{color:#BDBDBD;}:root{--page-title-display:none;}@media(max-width:767px){.elementor-217 .elementor-element.elementor-element-f430929 .elementor-image-box-wrapper{text-align:center;}.elementor-217 .elementor-element.elementor-element-f430929 .elementor-image-box-title{margin-bottom:20px;}}/* Start custom CSS for image-box, class: .elementor-element-f430929 */.hero-gamer-pilositos {
        display: flex;
        height: 95vh;
        flex-wrap: wrap;
        align-items: center;
        justify-content: space-between;
        padding: 80px 50px !important;
        background: linear-gradient(13deg, #020617 0%, #1e1b4b 100%) !important;
        border-radius: 30px;
        font-family: 'Poppins', sans-serif !important;
        gap: 40px;
        overflow: hidden;
    }

    /* 2. Estilo del Título con resaltado azul */
    .hero-gamer-pilositos h1 {
        font-size: 52px !important;
        font-weight: 800 !important;
        color: #ffffff !important;
        line-height: 1.1 !important;
        margin-bottom: 25px !important;
        text-shadow: 0 0 15px rgba(92, 225, 230, 0.3);
    }

    .hero-gamer-pilositos h1 .azul-neon {
        color: #5ce1e6 !important; /* Azul brillante del ejemplo */
        text-shadow: 0 0 20px rgba(92, 225, 230, 0.6);
    }

    /* 3. Caja de descripción con borde neón */
    .caja-gamer-desc {
        background: rgba(15, 23, 42, 0.6) !important;
        border: 2px solid #5ce1e6;
        padding: 25px !important;
        border-radius: 18px !important;
        color: #e2e8f0 !important;
        font-size: 17px !important;
        line-height: 1.6 !important;
        box-shadow: 0 0 25px rgba(92, 225, 230, 0.2);
        margin-bottom: 35px !important;
    }

    /* 4. Botón verde neón con brillo */
    .boton-gamer {
        display: inline-block !important;
        background: #22c55e !important;
        color: white !important;
        padding: 16px 45px !important;
        border-radius: 50px !important;
        font-weight: 700 !important;
        font-size: 20px !important;
        text-decoration: none !important;
        box-shadow: 0 0 20px rgba(34, 197, 94, 0.5);
        transition: 0.3s;
    }

    .boton-gamer:hover {
        transform: scale(1.05);
        box-shadow: 0 0 35px rgba(34, 197, 94, 0.8);
    }

    /* 5. Imagen con animación de flotado */
    .img-pilositos-hero {
        max-width: 100%;
        box-shadow: 0 20px 50px rgba(0,0,0,0.5);
        animation: flotarImg 4s ease-in-out infinite;
    }

    @keyframes flotarImg {
        0%, 100% { transform: translateY(0); }
        50% { transform: translateY(-15px); }
    }

    /* Mobile */
    @media (max-width: 768px) {
        .hero-gamer-pilositos { flex-direction: column-reverse; text-align: center; padding: 40px 20px !important; }
        .hero-gamer-pilositos h1 { font-size: 36px !important; }
    }
    
    .img-pilositos-hero {
            width: 100%;
            max-width: 550px; /* Ajusta el tamaño máximo según tu layout */
            height: auto;
            /* Filtro de sombra para resaltar el neón */
            filter: drop-shadow(0 10px 20px rgba(0, 242, 255, 0.3));
            /* Animación de flotado */
        
        }

        /* Efecto de interacción al pasar el mouse */
        .img-pilositos-hero:hover {
            transform: scale(1.03) rotateZ(1deg);
            filter: drop-shadow(0 15px 30px rgba(0, 242, 255, 0.6));
        }

        @keyframes float-animation {
            0%, 100% { transform: translateY(0) rotate(0deg); }
            50% { transform: translateY(-15px) rotate(-0.5deg); }
        }/* End custom CSS */
/* Start custom CSS for container, class: .elementor-element-afa69f9 */.elementor-217 .elementor-element.elementor-element-afa69f9 {
    background: linear-gradient(-45deg, #020617, #1e1b4b, #2e1065, #111827);
    background-size: 400% 400%;
    animation: gradientAurora 15s ease infinite;
}

@keyframes gradientAurora {
    0% { background-position: 0% 50%; }
    50% { background-position: 100% 50%; }
    100% { background-position: 0% 50%; }
}

/* Estilos de los textos */
.titulo-hero-pilositos {
    font-family: 'Poppins', sans-serif !important;
    font-size: 52px !important;
    font-weight: 800 !important;
    color: #ffffff !important;
    line-height: 1.1 !important;
}

.azul-neon {
    color: #5ce1e6 !important;
    text-shadow: 0 0 20px rgba(92, 225, 230, 0.6);
}

.caja-mision-gamer {
    background: rgba(15, 23, 42, 0.7) !important;
    border: 2px solid #5ce1e6;
    padding: 25px !important;
    border-radius: 18px !important;
    color: #f1f5f9 !important;
    font-size: 17px !important;
    line-height: 1.6 !important;
    box-shadow: 0 0 20px rgba(92, 225, 230, 0.15);
    margin: 25px 0 35px 0;
}

/* Botón Gamer */
.btn-ingresar-gamer {
    display: inline-block !important;
    background: #22c55e !important;
    color: #ffffff !important;
    padding: 18px 45px !important;
    border-radius: 50px !important;
    font-weight: 700 !important;
    text-decoration: none !important;
    box-shadow: 0 0 20px rgba(34, 197, 94, 0.4);
    transition: 0.3s ease;
}

.btn-ingresar-gamer:hover {
    transform: scale(1.05) translateY(-3px);
    box-shadow: 0 0 35px rgba(34, 197, 94, 0.7);
}

/* Imagen y efectos 3D */
.img-pilositos-gamer {
    max-width: 100%;
    border-radius: 24px;
    box-shadow: 0 20px 50px rgba(0,0,0,0.6);
    border: 2px solid rgba(92, 225, 230, 0.3);
    transform: rotateY(-8deg) rotateX(5deg);
    animation: flotarGamer 4s ease-in-out infinite;
}

@keyframes flotarGamer {
    0%, 100% { transform: rotateY(-8deg) rotateX(5deg) translateY(0); }
    50% { transform: rotateY(-5deg) rotateX(2deg) translateY(-15px); }
}

/* Responsive */
@media (max-width: 768px) {
    .titulo-hero-pilositos { font-size: 36px !important; }
    .img-pilositos-gamer { transform: none !important; }
}/* End custom CSS */