.elmas-brand-directory {
	--elmas-brand-directory-accent: var(--wd-primary-color, #7b45b5);
	--elmas-brand-directory-border: var(--brdcolor-gray-300, rgba(0, 0, 0, 0.1));
	--elmas-brand-directory-muted: var(--color-gray-500, #777777);
}

.elmas-brand-directory__jump {
	display: flex;
	align-items: center;
	flex-wrap: wrap;
	line-height: 1;
	gap: 10px 14px;
	width: fit-content;
	max-width: 100%;
	margin-bottom: 36px;
	padding: 13px 18px;
	border: 1px solid var(--elmas-brand-directory-border);
	border-radius: var(--wd-brd-radius, 12px);
	background-color: #ffffff;
}

.elmas-brand-directory__jump-label {
	color: var(--wd-title-color, #242424);
	font-weight: 600;
	line-height: 1;
}

.elmas-brand-directory__jump ul,
.elmas-brand-directory__group ul {
	margin: 0;
	padding: 0;
	list-style: none;
}

.elmas-brand-directory__jump ul {
	display: flex;
	align-items: center;
	flex-wrap: wrap;
	gap: 4px 8px;
}

.elmas-brand-directory__jump li {
	display: flex;
	align-items: center;
	margin: 0;
}

.elmas-brand-directory__jump a {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 1.45em;
	color: var(--elmas-brand-directory-accent);
	font-weight: 600;
	font-size: 15px;
	line-height: 1;
	text-decoration: none;
}

.elmas-brand-directory__jump a:hover,
.elmas-brand-directory__jump a:focus-visible {
	color: var(--wd-primary-color-hover, var(--elmas-brand-directory-accent));
	text-decoration: underline;
}

.elmas-brand-directory__presentation,
.elmas-brand-directory__jump:not(.elmas-brand-directory__jump--five) {
	display: none;
}

.elmas-brand-directory__presentation--five {
	display: block;
}

.elmas-brand-directory__columns {
	display: grid;
	grid-template-columns: repeat(5, minmax(0, 1fr));
	gap: 28px;
	align-items: start;
}

.elmas-brand-directory__column {
	display: flex;
	flex-direction: column;
	gap: 28px;
	min-width: 0;
}

.elmas-brand-directory__group h3 {
	display: flex;
	align-items: center;
	gap: 9px;
	margin: 0 0 11px;
	color: var(--wd-title-color, #242424);
	font-size: 1.15rem;
	line-height: 1;
}

.elmas-brand-directory__group h3::after {
	width: 42px;
	height: 2px;
	border-radius: 999px;
	background-color: var(--elmas-brand-directory-accent);
	content: '';
}

.elmas-brand-directory__group li + li {
	margin-top: 8px;
}

.elmas-brand-directory__group a {
	color: var(--color-gray-800, #4e4e4e);
	font-size: 15px;
	line-height: 1.35;
	text-decoration: none;
	transition: color 0.2s ease, padding-inline-start 0.2s ease;
}

.elmas-brand-directory__group a:hover,
.elmas-brand-directory__group a:focus-visible {
	padding-inline-start: 4px;
	color: var(--elmas-brand-directory-accent);
}

@media (max-width: 1366px) {
	.elmas-brand-directory__jump--five,
	.elmas-brand-directory__presentation--five {
		display: none;
	}

	.elmas-brand-directory__jump.elmas-brand-directory__jump--four,
	.elmas-brand-directory__presentation--four {
		display: flex;
	}

	.elmas-brand-directory__presentation--four {
		display: block;
	}

	.elmas-brand-directory__presentation--four .elmas-brand-directory__columns {
		grid-template-columns: repeat(4, minmax(0, 1fr));
	}
}

@media (max-width: 768px) {
	.elmas-brand-directory__jump.elmas-brand-directory__jump--four,
	.elmas-brand-directory__presentation--four {
		display: none;
	}

	.elmas-brand-directory__jump.elmas-brand-directory__jump--two,
	.elmas-brand-directory__presentation--two {
		display: flex;
	}

	.elmas-brand-directory__presentation--two {
		display: block;
	}

	.elmas-brand-directory__jump--two {
		align-items: flex-start;
		width: 100%;
		padding: 12px 14px;
	}

	.elmas-brand-directory__presentation--two .elmas-brand-directory__columns {
		grid-template-columns: repeat(2, minmax(0, 1fr));
		gap: 24px;
	}

	.elmas-brand-directory__column {
		gap: 24px;
	}
}

@media (max-width: 420px) {
	.elmas-brand-directory__jump.elmas-brand-directory__jump--two,
	.elmas-brand-directory__presentation--two {
		display: none;
	}

	.elmas-brand-directory__jump.elmas-brand-directory__jump--one,
	.elmas-brand-directory__presentation--one {
		display: flex;
	}

	.elmas-brand-directory__presentation--one {
		display: block;
	}

	.elmas-brand-directory__jump--one {
		align-items: flex-start;
		width: 100%;
		padding: 12px 14px;
	}

	.elmas-brand-directory__presentation--one .elmas-brand-directory__columns {
		grid-template-columns: 1fr;
	}
}
