
.socials__list {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    -webkit-column-gap: 6px;
    -moz-column-gap: 6px;
    gap: 6px;
}

.socials__list-item {
    position: relative;
    display: block;
    width: 30px;
    height: 30px;
    border-radius: 8px;
    overflow: hidden;
    -webkit-transition: box-shadow .3s ease-in-out;
    -o-transition: box-shadow .3s ease-in-out;
    -webkit-transition: -webkit-box-shadow .3s ease-in-out;
    transition: -webkit-box-shadow .3s ease-in-out;
    transition: box-shadow .3s ease-in-out;
    transition: box-shadow .3s ease-in-out, -webkit-box-shadow .3s ease-in-out;
}

.socials__subscribe {
    display: inline-block;
    position: relative;
    text-decoration: none;
}

.socials__subscribe--content {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    padding: 20px;
    border: 1px dashed rgba(232, 59, 59, 0.35);
    border-radius: 120px;
    background-color: transparent;
    -webkit-transition: background-color .3s ease-in-out, color .3s ease-in-out;
    -o-transition: background-color .3s ease-in-out, color .3s ease-in-out;
    transition: background-color .3s ease-in-out, color .3s ease-in-out;
}

.socials__subscribe--content p {
    font-weight: 550;
    font-size: 20px;
    line-height: 1.1;
    letter-spacing: 0.02em;
    text-align: center;
    margin: 0 20px;
}

.socials__subscribe--content span {
    position: relative;
    display: block;
    width: 60px;
    height: 60px;
    padding-right: 60px;
    background-color: var(--color-red);
    border-radius: 50%;
    overflow: hidden;
    -webkit-transition: background-color .3s ease-in-out;
    -o-transition: background-color .3s ease-in-out;
    transition: background-color .3s ease-in-out;
}

.socials__subscribe--content span::before {
    content: '';
    position: absolute;
    left: 50%;
    top: 50%;
    -webkit-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    background-color: #FFF;
    -webkit-transition: background-color .3s ease-in-out;
    -o-transition: background-color .3s ease-in-out;
    transition: background-color .3s ease-in-out;
}

.socials__list-item::before {
    content: '';
    position: absolute;
    left: 50%;
    top: 50%;
    -webkit-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    background-color: #FFF;
}

.socials__list-item:active,
.socials__list-item._active {
    -webkit-box-shadow: 0px 4px 12px 0px rgb(200 179 179 / 96%);
    box-shadow: 0px 4px 12px 0px rgb(200 179 179 / 96%);
}

.socials__list-item:disabled,
.socials__list-item._disabled {
    background-color: var(--color-black);
    opacity: 15%;
}

.pzpo-contact {
    font-size: 20px;
    font-weight: bold;
    line-height: 1.3;
    white-space: nowrap;
}

.socials__list-item[href^='https://vk.com']::before {
    -webkit-mask-image: url("data:image/svg+xml;charset=UTF-8,%3csvg width='30' height='30' viewBox='0 0 30 30' fill='none' xmlns='http://www.w3.org/2000/svg'%3e%3cpath d='M19.6095 0H10.407C1.998 0 0 1.9995 0 10.3905V19.5945C0 28.0005 1.9845 30 10.3905 30H19.5945C28.0005 30 30 28.0155 30 19.6095V10.407C30 1.998 28.0155 0 19.6095 0ZM24.219 21.405H22.0305C21.2025 21.405 20.9535 20.7345 19.4685 19.2495C18.1725 18 17.625 17.844 17.2965 17.844C16.8435 17.844 16.719 17.9685 16.719 18.594V20.562C16.719 21.0945 16.5465 21.4065 15.156 21.4065C13.8068 21.3149 12.4985 20.9045 11.3387 20.209C10.1788 19.5136 9.20049 18.553 8.484 17.406C6.78353 15.2918 5.60104 12.8092 5.031 10.1565C5.031 9.828 5.1555 9.531 5.781 9.531H7.9695C8.532 9.531 8.7345 9.7815 8.9535 10.359C10.0155 13.485 11.8275 16.203 12.5625 16.203C12.8445 16.203 12.9675 16.0785 12.9675 15.375V12.156C12.8745 10.6875 12.0945 10.563 12.0945 10.032C12.1045 9.89194 12.1687 9.7613 12.2734 9.66777C12.3782 9.57424 12.5152 9.52518 12.6555 9.531H16.0935C16.563 9.531 16.719 9.765 16.719 10.3275V14.6715C16.719 15.141 16.9215 15.297 17.0625 15.297C17.3445 15.297 17.562 15.141 18.078 14.625C19.1863 13.2734 20.0918 11.7676 20.766 10.155C20.8353 9.96158 20.9658 9.79603 21.1377 9.68343C21.3096 9.57083 21.5135 9.51732 21.7185 9.531H23.907C24.5625 9.531 24.702 9.8595 24.5625 10.3275C23.7668 12.1102 22.7822 13.8024 21.6255 15.375C21.39 15.735 21.2955 15.9225 21.6255 16.344C21.843 16.6725 22.6095 17.313 23.1255 17.922C23.8751 18.6702 24.4977 19.5355 24.969 20.484C25.1565 21.093 24.843 21.405 24.219 21.405Z' fill='white'/%3e%3c/svg%3e ");
    mask-image: url("data:image/svg+xml;charset=UTF-8,%3csvg width='30' height='30' viewBox='0 0 30 30' fill='none' xmlns='http://www.w3.org/2000/svg'%3e%3cpath d='M19.6095 0H10.407C1.998 0 0 1.9995 0 10.3905V19.5945C0 28.0005 1.9845 30 10.3905 30H19.5945C28.0005 30 30 28.0155 30 19.6095V10.407C30 1.998 28.0155 0 19.6095 0ZM24.219 21.405H22.0305C21.2025 21.405 20.9535 20.7345 19.4685 19.2495C18.1725 18 17.625 17.844 17.2965 17.844C16.8435 17.844 16.719 17.9685 16.719 18.594V20.562C16.719 21.0945 16.5465 21.4065 15.156 21.4065C13.8068 21.3149 12.4985 20.9045 11.3387 20.209C10.1788 19.5136 9.20049 18.553 8.484 17.406C6.78353 15.2918 5.60104 12.8092 5.031 10.1565C5.031 9.828 5.1555 9.531 5.781 9.531H7.9695C8.532 9.531 8.7345 9.7815 8.9535 10.359C10.0155 13.485 11.8275 16.203 12.5625 16.203C12.8445 16.203 12.9675 16.0785 12.9675 15.375V12.156C12.8745 10.6875 12.0945 10.563 12.0945 10.032C12.1045 9.89194 12.1687 9.7613 12.2734 9.66777C12.3782 9.57424 12.5152 9.52518 12.6555 9.531H16.0935C16.563 9.531 16.719 9.765 16.719 10.3275V14.6715C16.719 15.141 16.9215 15.297 17.0625 15.297C17.3445 15.297 17.562 15.141 18.078 14.625C19.1863 13.2734 20.0918 11.7676 20.766 10.155C20.8353 9.96158 20.9658 9.79603 21.1377 9.68343C21.3096 9.57083 21.5135 9.51732 21.7185 9.531H23.907C24.5625 9.531 24.702 9.8595 24.5625 10.3275C23.7668 12.1102 22.7822 13.8024 21.6255 15.375C21.39 15.735 21.2955 15.9225 21.6255 16.344C21.843 16.6725 22.6095 17.313 23.1255 17.922C23.8751 18.6702 24.4977 19.5355 24.969 20.484C25.1565 21.093 24.843 21.405 24.219 21.405Z' fill='white'/%3e%3c/svg%3e ");
    width: 30px;
    height: 30px;
}

.socials__list-item[href^='https://rutube.ru']::before {
    -webkit-mask-image: url("data:image/svg+xml;charset=UTF-8,%3csvg width='30' height='30' viewBox='0 0 30 30' fill='none' xmlns='http://www.w3.org/2000/svg'%3e%3cpath d='M19.6094 0C28.0154 0 30 1.99823 30 10.4072V19.6094C30 28.0153 28.0005 30 19.5947 30H10.3906C1.9847 30 3.57233e-05 28.0005 0 19.5947V10.3906C0 1.99963 1.99823 0 10.4072 0H19.6094ZM7 10V21H10.3057V17.4082H16.4326L19.2539 21H23L19.915 17.4082C22.5591 17.3331 22.5596 14.9389 22.5596 13.4424C22.5596 10.225 20.532 10 19.2979 10H7ZM18.2842 12.4316C18.6369 12.4318 19.3416 12.5743 19.3418 13.1426V14.2275C19.3418 14.4894 19.1653 14.9383 18.2842 14.9385H10.3057V12.4316H18.2842ZM23 6C21.8954 6 21 6.89543 21 8C21 9.10457 21.8954 10 23 10C24.1046 10 25 9.10457 25 8C25 6.89543 24.1046 6 23 6Z' fill='white'/%3e%3c/svg%3e ");
    mask-image: url("data:image/svg+xml;charset=UTF-8,%3csvg width='30' height='30' viewBox='0 0 30 30' fill='none' xmlns='http://www.w3.org/2000/svg'%3e%3cpath d='M19.6094 0C28.0154 0 30 1.99823 30 10.4072V19.6094C30 28.0153 28.0005 30 19.5947 30H10.3906C1.9847 30 3.57233e-05 28.0005 0 19.5947V10.3906C0 1.99963 1.99823 0 10.4072 0H19.6094ZM7 10V21H10.3057V17.4082H16.4326L19.2539 21H23L19.915 17.4082C22.5591 17.3331 22.5596 14.9389 22.5596 13.4424C22.5596 10.225 20.532 10 19.2979 10H7ZM18.2842 12.4316C18.6369 12.4318 19.3416 12.5743 19.3418 13.1426V14.2275C19.3418 14.4894 19.1653 14.9383 18.2842 14.9385H10.3057V12.4316H18.2842ZM23 6C21.8954 6 21 6.89543 21 8C21 9.10457 21.8954 10 23 10C24.1046 10 25 9.10457 25 8C25 6.89543 24.1046 6 23 6Z' fill='white'/%3e%3c/svg%3e ");
    width: 30px;
    height: 30px;
}

@media all and (max-width: 959px) {
    .socials__subscribe--content p {
        font-size: 16px;
    }
}

@media all and (max-width: 574px) {
    .socials__subscribe--content p {
        font-size: 13px;
    }
}

@media all and (max-width: 374px) {
    .socials__subscribe--content p {
        font-size: 14px;
    }
}

@media (hover: hover) {
    .socials__list-item:hover {
        -webkit-box-shadow: 0px 10px 30px 0px rgb(200 179 179 / 96%);
        box-shadow: 0px 10px 30px 0px rgb(200 179 179 / 96%);
    }
}