div.brands {
	margin-top: var(--s4);
	margin-bottom: var(--s4);
}

div.brands>div>section {
	background-color: var(--color-95);
	padding: var(--s2) var(--s4);
	height: 100%;
	border-radius: var(--s2);
}

div.brands>div>section a {
	text-decoration: none;
}

div.brands>div>section:hover {
	background: var(--color-98);
	box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
	transition: box-shadow 0.3s ease-in-out;
}

div.brands-letter {
	font-size: var(--font-large);
	font-weight: 600;
	border-bottom: 2px solid var(--color-100);

}

div.brands-items {
	margin-top: var(--s2);
}

div.brands-items>div {
	margin: var(--s) 0;
}