.sgl-social {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 24px;
    background: var(--blue-violet-500);
    padding: 12px;
    border-radius: 12px;
    margin: 24px 0;
}

.sgl-social-title {
    color: var(--white);
    font-size: 18px;
    font-weight: 700;
    text-align: center;
    line-height: 24px;
}

.sgl-social__items {
    display: flex;
    align-items: center;
    gap: 12px;
}

.sgl-social__item {
    background-color: var(--mirage-50);
    min-width: 48px;
    max-width: 48px;
    height: 48px;
    background-repeat: no-repeat;
    background-size: 24px;
    background-position: center;
    border-radius: 16px;
    cursor: pointer;
    transition: background-color ease .1s;
}

.sgl-social__item:hover {
    background-color: var(--mirage-100);
}

.sgl-social__item.vk-share {
    background-image: url(../images/social/share/vk.svg);
}

.sgl-social__item.fb-share {
    background-image: url(../images/social/share/fb.svg);
}

.sgl-social__item.tw-share {
    background-image: url(../images/social/share/x.svg);
}

.sgl-social__item.wa-share {
    background-image: url(../images/social/share/wa.svg);
}

.sgl-social__item.tg-share {
    background-image: url(../images/social/share/tg.svg);
}

@media (max-width: 576px) {
    .sgl-social {
        flex-wrap: wrap;
    }
}