/* --- Generic page (page.php) ---
   The theme's true last-resort fallback, used for any Page not assigned one
   of the dedicated templates elsewhere (e.g. a Rank Math HTML sitemap page,
   or any future simple content page nobody's built a real template for
   yet). Kept deliberately plain — same container/prose treatment as the
   other simple content pages (Terms/Privacy/Cookies, legal.css), not a
   from-scratch design. */

.generic-page {
	padding-top: clamp(88px, 9vw, 145px);
	padding-bottom: clamp(64px, 8vw, 120px);
}

.generic-page__title {
	margin: 0 0 clamp(24px, 4vw, 40px);
	font-family: var(--font-display);
	font-weight: 800;
	font-size: 2.5rem;
	line-height: 1.25;
	color: var(--color-ink);
}

@media (max-width: 900px) {
	/* Global mobile h1 baseline (3.1rem) — see base.css. */
	.generic-page__title {
		font-size: 3.1rem;
	}
}

/* Plain rich-text/prose styling for whatever the page editor put in here —
   a lighter version of .blog-prose/.legal-prose's own rules (blog.css),
   not reused directly since those stylesheets are only enqueued on their
   own specific templates, not here. */
.generic-page-prose {
	max-width: 56.5rem;
	font-family: var(--font-body);
	font-weight: 300;
	font-size: 1.125rem;
	line-height: 1.6;
	color: var(--color-ink);
}

.generic-page-prose > * + * {
	margin-top: 1.25em;
}

.generic-page-prose h2 {
	font-family: var(--font-display);
	font-weight: 800;
	font-size: 1.75rem;
	line-height: 1.3;
}

.generic-page-prose h3 {
	font-family: var(--font-display);
	font-weight: 700;
	font-size: 1.375rem;
	line-height: 1.3;
}

.generic-page-prose a {
	color: #b89c02;
	text-decoration: none;
}

.generic-page-prose a:hover,
.generic-page-prose a:focus-visible {
	text-decoration: underline;
}

.generic-page-prose ul,
.generic-page-prose ol {
	padding-left: 1.5em;
}

.generic-page-prose ul {
	list-style: disc;
}

.generic-page-prose ol {
	list-style: decimal;
}

/* --- Rank Math HTML sitemap (rank_math_html_sitemap shortcode) ---
   Exact class names from the plugin's own output (includes/modules/sitemap/
   html-sitemap/class-{sitemap,posts,terms,authors}.php) — not guessed:
     .rank-math-html-sitemap
       .rank-math-html-sitemap__section(--post-type|--taxonomy|--authors)
         .rank-math-html-sitemap__title (h2, one per post type/taxonomy/authors)
         .rank-math-html-sitemap__list (ul; hierarchical post types nest a
           second .rank-math-html-sitemap__list inside a __item for children)
           .rank-math-html-sitemap__item (li)
             .rank-math-html-sitemap__link (a)
             .rank-math-html-sitemap__date (span, only if dates are enabled) */
.rank-math-html-sitemap__section {
	margin-bottom: clamp(32px, 5vw, 56px);
}

.rank-math-html-sitemap__section:last-child {
	margin-bottom: 0;
}

.rank-math-html-sitemap__title {
	margin: 0 0 20px;
	padding-bottom: 12px;
	border-bottom: 1px solid rgba(27, 27, 27, 0.15);
	font-family: var(--font-display);
	font-weight: 800;
	font-size: 1.5rem;
	color: var(--color-ink);
}

.rank-math-html-sitemap__list {
	margin: 0;
	padding: 0;
	list-style: none;
	/* A flat alphabetical/chronological list of every post of a type reads
	   better as a multi-column word list than one long single column once
	   there are more than a handful — same idea as a printed index. */
	columns: 2;
	column-gap: 40px;
}

.rank-math-html-sitemap__section--authors .rank-math-html-sitemap__list,
.rank-math-html-sitemap__list .rank-math-html-sitemap__list {
	/* Nested (child-page) lists and the (usually short) authors list read
	   worse split into columns — a plain indented list instead. */
	columns: 1;
	margin-top: 8px;
	padding-left: 1.25em;
}

.rank-math-html-sitemap__item {
	break-inside: avoid;
	padding: 6px 0;
	font-family: var(--font-body);
	font-size: 1rem;
}

/* Matches .generic-page-prose a above (same gold, same hover-underline) —
   declared explicitly here too rather than left to inherit, since
   .generic-page-prose a would otherwise win this specific fight by
   accident (one more element in its selector beats this class alone) yet
   still look like this class controls its own color at a glance. */
.rank-math-html-sitemap__link {
	color: #b89c02;
	text-decoration: none;
}

.rank-math-html-sitemap__link:hover,
.rank-math-html-sitemap__link:focus-visible {
	text-decoration: underline;
}

.rank-math-html-sitemap__date {
	margin-left: 6px;
	color: var(--color-ink);
	opacity: 0.55;
	font-size: 0.875rem;
}

@media (max-width: 700px) {
	.rank-math-html-sitemap__list {
		columns: 1;
	}
}
