/* HK Icon List */
.hk-icon-list {
	--hk-il-icon: 16px;
	--hk-il-gap: 17px;

	color: var(--hk-brown);
}

.hk-icon-list__title {
	margin: 0 0 20px;
	padding-bottom: 0;
	color: var(--hk-brown);
	font-family: var(--hk-font);
	font-size: 20px;
	font-weight: 600;
	line-height: 27px;
}

.hk-icon-list__items {
	display: flex;
	flex-direction: column;
	gap: 20px;
	margin: 0;
	padding: 0;
	list-style: none;
}

.hk-icon-list--horizontal .hk-icon-list__items {
	flex-flow: row wrap;
	gap: 16px 28px;
}

.hk-icon-list__item {
	margin: 0;
}

.hk-icon-list__link {
	display: flex;
	align-items: flex-start;
	gap: var(--hk-il-gap);
	color: inherit;
	text-decoration: none;
}

.hk-icon-list__icon {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	flex: none;
	width: var(--hk-il-icon);
	height: 1.375em;
	font-size: 16px;
}

.hk-icon-list__icon img {
	width: 100%;
	max-height: var(--hk-il-icon);
	object-fit: contain;
}

.hk-icon-list__text {
	color: var(--hk-brown);
	font-family: var(--hk-font);
	font-size: 16px;
	font-weight: 400;
	line-height: 22px;
	transition: color .2s var(--hk-ease);
}

a.hk-icon-list__link:hover .hk-icon-list__text,
a.hk-icon-list__link:focus-visible .hk-icon-list__text {
	color: var(--hk-orange);
}

a.hk-icon-list__link:focus-visible {
	outline: 2px solid var(--hk-orange);
	outline-offset: 2px;
	border-radius: 4px;
}

@media (max-width: 767px) {
	.hk-icon-list__title {
		margin-bottom: 14px;
	}

	.hk-icon-list__items {
		gap: 14px;
	}
}