.c-browse-by-area {
	background: var(--bba-bg, var(--color-beige));
}

.c-browse-by-area__inner {
	display: flex;
	flex-direction: column;
	gap: 28px;
	padding-block: var(--block-spacing-top, 64px) var(--block-spacing-bottom, 64px);
}

.c-browse-by-area__list {
	display: flex;
	flex-wrap: wrap;
	gap: var(--spacing-col);
	margin: 0;
	padding: 0;
	list-style: none;
}

.c-browse-by-area__item {
	flex: 1 0 0;
	min-width: 260px;
}

.c-browse-by-area__link {
	display: flex;
	align-items: center;
	gap: var(--spacing-sm);
	color: var(--color-navy);
	text-decoration: none;
}

.c-browse-by-area__name {
	font-size: var(--text-h6);
	line-height: 21px;
	font-weight: var(--weight-demi);
}

.c-browse-by-area__count {
	display: flex;
	align-items: center;
	gap: 6px;
	padding-bottom: var(--spacing-xs);
	border-bottom: 1px solid currentcolor;
	font-size: var(--text-label);
	line-height: 16px;
	font-weight: var(--weight-medium);
}

.c-browse-by-area__icon {
	display: flex;
	width: 16px;
	height: 16px;
}

.c-browse-by-area__icon svg {
	width: 100%;
	height: 100%;
}

.c-browse-by-area__directory {
	margin-bottom: calc(var(--spacing-xl) * -1);
	columns: 4 260px;
	column-gap: var(--spacing-col);
}

.c-browse-by-area__region {
	display: flex;
	flex-direction: column;
	gap: var(--spacing-md);
	margin-bottom: var(--spacing-xl);
	break-inside: avoid;
}

.c-browse-by-area__region-head {
	display: flex;
	flex-direction: column;
	align-items: start;
	gap: var(--spacing-sm);
}

.c-browse-by-area__region-title {
	margin: 0;
	color: var(--color-navy);
}

.c-browse-by-area__nurseries {
	display: flex;
	flex-direction: column;
	align-items: start;
	gap: var(--spacing-sm);
	margin: 0;
	padding: 0;
	list-style: none;
}

.c-browse-by-area__nursery {
	display: flex;
	align-items: center;
	gap: 6px;
	color: var(--color-navy);
	font-size: var(--text-label);
	line-height: 16px;
	font-weight: var(--weight-medium);
	text-decoration: none;
}

.c-browse-by-area__link:hover .c-browse-by-area__name,
.c-browse-by-area__link:focus-visible .c-browse-by-area__name,
.c-browse-by-area__nursery:hover .c-browse-by-area__nursery-name,
.c-browse-by-area__nursery:focus-visible .c-browse-by-area__nursery-name {
	text-decoration: underline;
}

.c-browse-by-area__link:hover .c-browse-by-area__icon,
.c-browse-by-area__link:focus-visible .c-browse-by-area__icon,
.c-browse-by-area__nursery:hover .c-browse-by-area__icon,
.c-browse-by-area__nursery:focus-visible .c-browse-by-area__icon {
	translate: 4px 0;
}

@media (prefers-reduced-motion: no-preference) {
	.c-browse-by-area__icon {
		transition: translate 0.2s ease;
	}
}

.c-browse-by-area__toggle {
	display: none;
	align-self: start;
}

.c-browse-by-area__toggle[aria-expanded='true'] .c-btn__icon {
	rotate: 180deg;
}

@media (width < 768px) {
	.c-browse-by-area__inner {
		padding-block: var(--block-spacing-top, var(--spacing-page)) var(--block-spacing-bottom, var(--spacing-page));
	}

	.c-browse-by-area__toggle.is-ready {
		display: inline-flex;
	}

	.c-browse-by-area__list.is-collapsed > :nth-child(n + 7) {
		display: none;
	}
}