header {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: space-between;
	padding-bottom: 2rem;
	gap: 1rem;

	a {
		display: flex;
		align-items: center;
		gap: 1rem;
		color: var(--text);
		text-decoration: none;

		.main-header-logo {
			width: 50px;
			height: 50px;
		}

		&:hover {
			color: var(--accent);
		}
	}

	.socials {
		display: flex;
		justify-content: center;
		align-items: center;
		gap: 1rem;
		width: fit-content;

		a,
		svg {
			width: fit-content;
		}
	}
}