.links-container {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    align-items: center;
    justify-content: center;
    gap: 10px 15px;
    margin: 0 0 1rem 0;
}

.links-container a {
    text-decoration: none;
    color: var(--white-color);
    border-radius: 6px;
    text-align: center;
    background: var(--primary);
    padding: 0.6rem 1.2rem;
    font-size: 1rem;
    white-space: nowrap;
    display: inline-block;
    transition: 0.3s ease all;
    box-shadow: 0 2px 6px rgba(0,0,0,0.1);
}

.links-container a:hover {
    background: var(--dark-color);
    color: var(--white-color);
    transform: translateY(-2px);
}


@media (max-width: 920px){
    .links-container{ 
        display: grid;
        grid-template-columns: repeat(2, 1fr);
        margin: 0 2% 1rem 2%;
    }
}
@media (max-width: 460px){
    .links-container{ grid-template-columns: repeat(1, 1fr);}
}