.archive-header {
	margin-bottom: clamp(2rem, 4vw, 3rem);
}

.archive-header__title {
	margin: 0;
}

.archive-empty {
	margin: 0;
	color: var(--sk-gray-copy);
}

.pagination {
	margin-top: clamp(2.5rem, 5vw, 4rem);

	.nav-links {
		display: flex;
		flex-wrap: wrap;
		gap: 0.5rem;
		align-items: center;
	}

	.page-numbers {
		display: inline-flex;
		align-items: center;
		justify-content: center;
		min-width: 2.75rem;
		min-height: 2.75rem;
		padding: 0.5rem 0.85rem;
		border: 2px solid color-mix(in srgb, var(--sk-gray) 28%, transparent);
		color: var(--sk-black);
		font-family: var(--sk-font-display);
		font-size: 0.8125rem;
		font-weight: 700;
		letter-spacing: 0.08em;
		line-height: 1;
		text-decoration: none;
		text-transform: uppercase;
		transition:
			background var(--sk-transition),
			color var(--sk-transition),
			border-color var(--sk-transition);

		&:hover,
		&:focus-visible {
			border-color: var(--sk-accent);
			color: var(--sk-accent);
			text-decoration: none;
		}

		&.current {
			border-color: var(--sk-accent);
			background: var(--sk-accent);
			color: var(--sk-white);
		}

		&.dots {
			min-width: 0;
			border: 0;
			padding-inline: 0.25rem;
		}
	}
}