div.social-icons {
	--si-size: 44px;
	--si-gap: 18px;

	width: 100%;
	max-width: 100%;
	box-sizing: border-box;
}

div.social-icons *,
div.social-icons *::before,
div.social-icons *::after {
	box-sizing: border-box;
}

div.social-icons .social-icons__list {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: flex-end;
	gap: var(--si-gap);
	width: 100%;
	margin: 0;
	padding: 0;
}

div.social-icons .social-icons__item {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	flex: 0 0 auto;
	width: var(--si-size);
	height: var(--si-size);
	margin: 0;
	padding: 0;
	border: 0;
	background: transparent;
	text-decoration: none;
	line-height: 0;
	transition: opacity 0.2s ease, transform 0.2s ease;
}

div.social-icons a.social-icons__item:hover,
div.social-icons a.social-icons__item:focus-visible {
	opacity: 0.75;
	outline: none;
	transform: translateY(-1px);
}

div.social-icons .social-icons__icon {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: contain;
	object-position: center;
}

@media (max-width: 767px) {
	div.social-icons {
		--si-size: 47px;
		--si-gap: 10px;
	}

	div.social-icons .social-icons__list {
		justify-content: center;
	}
}