.socials--main {margin-bottom:40px;display: flex;--gap: 8px;--columns: 4;gap: var(--gap);flex-wrap: wrap;margin-top:-20px;}
.socials--item {width: calc((100% / var(--columns)) - var(--gap) + (var(--gap) / var(--columns)));padding:15px;border:1px solid #eee;display:flex;gap:8px;border-radius:4px;overflow:hidden;}
.socials--item img{width:24px;height:24px;margin-top:4px;filter: grayscale(100%);transition:.4s}
.socials--item:hover img{filter: grayscale(0);}
.social--link {font-size:12px;color:#777;    word-break: break-all;overflow: hidden;display: -webkit-box;-webkit-line-clamp: 1;-webkit-box-orient: vertical;line-height: 1.3em;height: 1.3em;}
.social--title {color:#1f1f1f}

@media (max-width: 1280px) {
    .socials--main {--columns: 3;}
}

@media (max-width: 1024px) {
    .socials--main {--columns: 2;}
}

@media (max-width: 550px) {
    .socials--main {--columns: 1;}
}