.empresa{
    position: relative;
    padding: 210px 8%;

        background:linear-gradient(
    180deg,
    #0E1116,
    #131A22,
    #0E1116);

    overflow: hidden;
}

.empresa::before{
    content: "01";
    position: absolute;
    right: 5%;
    top: 20px;
    font-size: 250px;
    font-weight: 900;
    color:rgba(255,255,255,.03);
    user-select: none;
}

.empresa .container{
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 80px;
    align-items: center;
}

.empresa-imagen{

    flex:0 0 40%;

    display:flex;

    justify-content:center;

    align-items:center;

}

.empresa-imagen img{

     width:100%;
    max-width:520px;
    display:block;
    margin:auto;

    max-width:420px;

    height:auto;

    object-fit:contain;

    border-radius:20px;

    box-shadow:0 20px 40px rgba(0,0,0,.15);

    transition:.4s;

}

.empresa-imagen img:hover{

    transform:scale(1.03);

}

.empresa-info span{
    color:var(--amarillo);
    letter-spacing: 5px;
    font-size: .9rem;
}

.empresa-info h2{
    font-size: 3rem;
    margin-top: 15px;
    margin-bottom: 30px;
    line-height: 1.2;
    text-align: justify;
}


.empresa-info p{
    color:var(--texto);
    line-height: 2;
    margin-bottom: 20px;
}

.empresa-cajas{
    display: grid;
    grid-template-columns: repeat(2,1fr);
    gap: 25px;
    margin-top: 50px;
}

.caja{
    background:rgba(255,255,255,.05);

    backdrop-filter:blur(20px);

    border:1px solid rgba(255,255,255,.08);

    border-radius:20px;

    padding:30px;

    transition:.45s;
}

.caja:hover{
    transform: translateY(-10px);
    background: rgba(23,62,131,.25);
}

.caja i{
    font-size: 40px;
    color:var(--amarillo);
    margin-bottom: 20px;
    transition: .4s;
}

.caja:hover i{

    transform:rotate(360deg);

}


.caja h3{

    font-size:1.1rem;

}


/*===============================
      CELULARES
===============================*/

@media (max-width:576px){


.empresa{

    padding:80px 0;

}

.empresa .container{

    display:flex;
    flex-direction:column;
    gap:40px;

}

.empresa-info{

    order:1;
    text-align:center;

}

.empresa-info h2{

    font-size:2rem;
    line-height:1.2;

}

.empresa-info p{

    font-size:16px;
    line-height:1.8;

}

.empresa-image{

    order:2;
    display:flex;
    justify-content:center;

}

.empresa-image img{

    width:90%;
    max-width:320px;

}
}