.redes{
    width: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    background: #020617;
    background: radial-gradient(circle, rgba(3, 33, 54, 1) 0%, #020617 100%);
}

.viewport-redes{
    width: 100%;
    max-width: 1440px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 20px;
    text-align: center;
    padding: 80px 20px;
}

.viewport-redes h2{
    font-size: 2.7rem;
    font-weight: 800;
}

.viewport-redes h2 span{
    color: var(--color-activo);
}

.viewport-redes p{
    max-width: 75ch;
    font-weight: 500;
    font-size: 1.2rem;
    color: #999;
}

.redes-social{
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 25px;
    margin-top: 20px;
    width: 100%;
}

.redes-social a{
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 14px;
    text-decoration: none;
    color: var(--color-texto);
    background-color: #0F172A;
    border: 1px solid #1e293b;
    border-radius: 20px;
    padding: 35px 45px;
    font-weight: 700;
    font-size: 1rem;
    transition-duration: 0.3s;
    min-width: 150px;
}

.redes-social a i{
    font-size: 2.6rem;
    transition-duration: 0.3s;
}

.redes-social a:hover{
    transform: translateY(-8px);
}

.redes-social .youtube:hover{
    border-color: #c4302b;
    box-shadow: 0px 0px 25px rgba(196, 48, 43, 0.5);
    color: #c4302b;
}

.redes-social .discord:hover{
    border-color: #5865F2;
    box-shadow: 0px 0px 25px rgba(88, 101, 242, 0.5);
    color: #5865F2;
}

.redes-social .twitter:hover{
    border-color: #FFFFFF;
    box-shadow: 0px 0px 25px rgba(255, 255, 255, 0.3);
}

.redes-social .instagram:hover{
    border-color: #C13584;
    box-shadow: 0px 0px 25px rgba(193, 53, 132, 0.5);
    color: #C13584;
}