:root {
    --ana-renk: #B51827; 
    --siyah-renk:#231F20;
    --gri-renk:#var(--gri-renk);
  }

.socials-v3 {
    position: relative;
    z-index: 1
}

.socials-v3__btns {
    display: flex
}

.socials-v3__btns>* {
    flex-grow: 1
}

.socials-v3__btns:hover .socials-v3__btn {
    opacity: .5
}

.socials-v3__btns:hover .socials-v3__btn::after {
    opacity: 0
}

.socials-v3__btns li:last-child .socials-v3__btn::after {
    display: none
}

.socials-v3__btn {
    position: relative;
    display: block;
    text-align: center;
    padding-top: var(--space-xl);
    padding-bottom: var(--space-xl);
    border-radius: var(--radius-md);
    transition: .3s
}

.socials-v3__btn .icon {
    font-size: 1.6em;
    color: var(--color-contrast-high);
    transition: color .2s, transform .2s
}

.socials-v3__btn::after {
    content: "";
    position: absolute;
    right: 0;
    top: 0;
    width: 1px;
    height: 100%;
    background-color: var(--color-contrast-lower);
    transition: opacity .2s
}

.socials-v3__btn:hover {
    background-color: var(--color-bg);
    box-shadow: var(--shadow-md);
    opacity: 1 !important;




    

    
}

.socials-v3__btn:hover .icon {
    color: var(--ana-renk) !important;
    transform: scale(1.2)
}

@media(min-width:48rem) {
    .socials-v3__btn .icon {
        font-size: 2em
    }
}