.social-links {
	display: flex;
	align-items: center;
	gap: 20px;
	list-style: none;
	margin-left: auto;
	margin-right: auto;
	margin-bottom: 0;
	padding: 0;
}

.sl {
	display: flex;
	align-items: center;
	position: relative;
	color: var(--gray-70);
	font-size: var(--body-text-xs);
}

.social-icon {
	filter: brightness(0%) grayscale(100%);
	opacity: .7;
	transition: all .25s ease;
}

.sl:hover .social-icon {
	filter: brightness(100%) grayscale(0%);
	opacity: 1;
}

.sl-svg path {
	transition: all .4s;
}

.sl--pt:hover path {
	fill: #e40623;
}

.sl--fb:hover path {
	fill: #1877f2;
}

.sl--x:hover path {
	fill: #1da1f2;
}

.sl--yt:hover path {
	fill: red;
}

.sl-svg--ig {
	position: absolute;
	transition: opacity .5s;
}

.sl-svg--ig-color {
	opacity: 0;
	transition: opacity 1s;
}

.sl--ig:hover .sl-svg--ig {
	opacity: 0;
	transition: opacity .5s;
}

.sl--ig:hover .sl-svg--ig-color {
	opacity: 1;
	transition: opacity .3s;
}