/*
 * 404 / Not Found Page — Editorial centered layout.
 *
 * No cartoon illustration. Botanical glyph (✦) in terracotta → error code
 * → Cormorant heading → body → WP Search block (underline style) →
 * 3 recovery links (horizontal row desktop/tablet, stacked mobile).
 *
 * Tokens read:
 *   color.terracotta.500           — botanical icon glyph
 *   semantic.color.text.primary    — heading, body, links
 *   semantic.color.text.muted      — error code, body, link separators
 *   semantic.color.border.base     — search input underline
 *   semantic.typography.display    — heading (Cormorant)
 *   semantic.typography.body       — error code, body, links (Jost)
 *   space.3 – 11
 *   duration.base / easing.default
 */

/* ── Page wrapper ─────────────────────────────────────────────────────── */

.wpdl-not-found.wp-block-group {
	padding-block: var(--wp--custom--space--11);
	margin-block: 0;
	text-align: center;
}

/* ── Botanical icon ───────────────────────────────────────────────────── */

.wpdl-not-found__icon {
	font-size: 2rem;
	line-height: 1;
	color: var(--wp--custom--semantic--color--accent--primary);
	margin-block: 0 var(--wp--custom--space--5);
}

/* ── Error code ───────────────────────────────────────────────────────── */

.wpdl-not-found__code {
	font-family: var(--wp--custom--semantic--typography--display--font-family);
	font-size: clamp(0.9375rem, 0.75rem + 0.89vw, 1.375rem);
	font-weight: 400;
	letter-spacing: 0.06em;
	color: var(--wp--custom--semantic--color--text--muted);
	margin-block: 0 var(--wp--custom--space--5);
}

/* ── Heading ──────────────────────────────────────────────────────────── */

.wpdl-not-found__heading.wp-block-heading {
	font-family: var(--wp--custom--semantic--typography--display--font-family);
	font-size: clamp(1.25rem, 0.7rem + 2.68vw, 2.375rem);
	font-weight: 500;
	line-height: 1.25;
	color: var(--wp--custom--semantic--color--text--primary);
	max-inline-size: 35rem;
	margin-inline: auto;
	margin-block: 0 var(--wp--custom--space--6);
}

/* ── Body ─────────────────────────────────────────────────────────────── */

.wpdl-not-found__body {
	font-family: var(--wp--custom--semantic--typography--body--font-family);
	font-size: 0.8125rem;
	font-weight: 300;
	line-height: 1.7;
	color: var(--wp--custom--semantic--color--text--muted);
	max-inline-size: 27.5rem;
	margin-inline: auto;
	margin-block: 0 var(--wp--custom--space--7);
}

/* ── Search field ─────────────────────────────────────────────────────── */

.wpdl-not-found__search-wrap.wp-block-group {
	max-inline-size: 22.5rem;
	margin-inline: auto;
	margin-block: 0 var(--wp--custom--space--8);
}

.wpdl-not-found__search.wp-block-search {
	inline-size: 100%;
}

.wpdl-not-found__search .wp-block-search__inside-wrapper {
	border: none;
	border-block-end: 1px solid var(--wp--custom--semantic--color--border--base);
	border-radius: 0;
	padding-inline: 0;
}

.wpdl-not-found__search .wp-block-search__input {
	font-family: var(--wp--custom--semantic--typography--body--font-family);
	font-size: 0.8125rem;
	font-weight: 400;
	color: var(--wp--custom--semantic--color--text--primary);
	background: transparent;
	border: none;
	padding-inline: 0;
	padding-block: var(--wp--custom--space--3);
}

.wpdl-not-found__search .wp-block-search__input::placeholder {
	color: var(--wp--custom--semantic--color--text--muted);
}

.wpdl-not-found__search .wp-block-search__button {
	background: transparent;
	border: none;
	color: var(--wp--custom--semantic--color--text--muted);
	padding-inline: var(--wp--custom--space--3);
	cursor: pointer;
}

/* ── Recovery links ───────────────────────────────────────────────────── */

.wpdl-not-found__links.wp-block-group {
	gap: var(--wp--custom--space--5);
	margin-block: 0;
}

.wpdl-not-found__link-wrap {
	margin-block: 0;
}

.wpdl-not-found__link {
	font-family: var(--wp--custom--semantic--typography--body--font-family);
	font-size: 0.75rem;
	font-weight: 500;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	color: var(--wp--custom--semantic--color--text--primary);
	text-decoration: underline;
	text-underline-offset: var(--wp--custom--space--1);
	transition: color var(--wp--custom--duration--base) var(--wp--custom--easing--default);
}

.wpdl-not-found__link:hover {
	color: var(--wp--custom--semantic--color--accent--primary);
}

.wpdl-not-found__link-sep {
	font-size: 0.75rem;
	color: var(--wp--custom--semantic--color--text--muted);
	margin-block: 0;
}

/* ── Mobile (< 40em / 640px) ─────────────────────────────────────────── */

@media (width < 40em) {
	.wpdl-not-found.wp-block-group {
		padding-block: var(--wp--custom--space--9);
	}

	.wpdl-not-found__links.wp-block-group {
		flex-direction: column;
		align-items: center;
		gap: var(--wp--custom--space--4);
	}

	.wpdl-not-found__link-sep {
		display: none;
	}

	.wpdl-not-found__search-wrap.wp-block-group {
		max-inline-size: 100%;
	}
}

/* ── Reduced motion ───────────────────────────────────────────────────── */

@media (prefers-reduced-motion: reduce) {
	.wpdl-not-found__link {
		transition: none;
	}
}
