/* ==========================================================================
   OBSAH STRÁNKY — odkazy na sekcie v dvoch–troch stĺpcoch
   ========================================================================== */

.enp-toc {
	padding-block: 24px;
}

.enp-toc__box {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 12px 20px;
	padding: 18px 22px;
	border-radius: var(--enp-radius-tile);
	background: var(--enp-tint);
}

.enp-toc__title {
	flex: none;
	font-size: 12px;
	font-weight: 700;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	color: var(--enp-steel);
}

.enp-toc__list {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
	list-style: none;
}

.enp-toc__list a {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	padding: 8px 14px;
	border-radius: 999px;
	background: var(--enp-white);
	font-size: 14px;
	font-weight: 600;
	color: var(--enp-navy);
	transition:
		background-color var(--enp-duration) var(--enp-ease),
		color var(--enp-duration) var(--enp-ease);
}

.enp-toc__list a:hover {
	background: var(--enp-navy);
	color: var(--enp-white);
}

.enp-toc__num {
	font-family: var(--enp-font-heading);
	font-size: 12px;
	font-weight: 700;
	color: var(--enp-yellow-text);
}

/* Skok na kotvu nech nezakryje lepivá hlavička. */
.enp-main--sections section[id] {
	scroll-margin-top: 110px;
}

@media (max-width: 640px) {
	.enp-toc__box {
		padding: 16px;
	}

	.enp-toc__list {
		flex-wrap: nowrap;
		margin-inline: -16px;
		padding-inline: 16px;
		overflow-x: auto;
		scrollbar-width: none;
	}

	.enp-toc__list a {
		white-space: nowrap;
	}
}