/**
 * Taxonomy archive pages (volume / issue).
 * Reuses the shared card styles (global/home); only the hero masthead and a
 * couple of archive-specific tweaks live here.
 */

.wulr-archive-hero {
	text-align: center;
	position: relative;
	overflow: hidden;
}

/* Shield watermark in the green hero (Print / Online edition archives only) —
   a slightly lighter green shield bleeding off the right edge, behind the text.
   Mirrors the homepage Explore watermark. */
.wulr-archive-watermark {
	position: absolute;
	/* Sit below vertical centre so the crest's top clears the header edge that
	   caps the hero (was cut off at the top on the Print/Online heroes). */
	top: 58%;
	right: clamp(-90px, -4vw, -24px);
	transform: translateY(-50%);
	width: clamp(200px, 24vw, 340px);
	height: auto;
	color: var(--wp--preset--color--primary-2);
	opacity: 0.85;
	z-index: 0;
	pointer-events: none;
}

.wulr-archive-eyebrow {
	color: var(--wp--preset--color--white);
	opacity: 0.85;
	margin: 0;
}
/* Issue archives link this eyebrow back to the parent volume. The global accent
   link colour is illegible on the green hero (~2:1), so keep the link white
   (underlined to signal it's a link) — well above WCAG AA. */
.wulr-archive-eyebrow a {
	color: var(--wp--preset--color--white);
	text-decoration: underline;
	text-underline-offset: 3px;
	text-decoration-thickness: 1px;
	transition: text-decoration-thickness 0.12s;
}
.wulr-archive-eyebrow a:hover,
.wulr-archive-eyebrow a:focus-visible,
.wulr-az-nav a:hover,
.wulr-az-nav a:focus-visible {
	color: var(--wp--preset--color--white);
	text-decoration-thickness: 2px;
}

.wulr-archive-title,
.wulr-mh-title {
	font-family: var(--wp--preset--font-family--display);
	font-size: var(--wp--preset--font-size--xxxl);
	line-height: 1.05;
	/* Reset only the UA bottom/inline margins — leave margin-block-start free so
	   WP's block-gap rule (the group's "Block spacing" control) drives the
	   eyebrow → title gap on every archive hero. A bare `margin: 0` used to zero
	   it and, at equal specificity, beat the gap rule on load order. */
	margin-block-end: 0;
	margin-inline: 0;
	color: var(--wp--preset--color--white);
}

.wulr-archive-desc {
	max-width: 46rem;
	margin-inline: auto;
	font-size: var(--wp--preset--font-size--md);
	opacity: 0.9;
}

/* Edition archives (Print / Online): left-aligned hero — no eyebrow, title flush
   left, and a short intro blurb pulled from the term description. Scoped by the
   category body classes so other archives keep their centered hero. */
.category-print .wulr-archive-hero,
.category-online .wulr-archive-hero,
.page-print .wulr-archive-hero {
	text-align: left;
}
.category-print .wulr-archive-desc,
.category-online .wulr-archive-desc,
.page-print .wulr-archive-desc {
	/* Align the blurb's left edge with the title + card grid (the constrained
	   content column, which is inset from the padded hero by half the leftover
	   width) while keeping a readable measure. The left margin reproduces that
	   column inset; margin-right:auto absorbs the rest. max(0px, …) collapses the
	   inset on narrow viewports where the column already fills the content box.
	   !important beats WP's constrained-layout auto margins (also !important). */
	margin-left: max(0px, calc((100% - var(--wp--style--global--content-size)) / 2)) !important;
	margin-right: auto !important;
	max-width: 800px;
	font-size: var(--wp--preset--font-size--lg);
	line-height: 1.6;
}

/* Green hero flows straight into the list — no blank gap (the sections are
   nested in <main>, so the root section-flush reset doesn't reach them). */
.wulr-archive-hero + .wulr-archive-list { margin-top: 0; }

/* Brand double-rule under the hero: the same thick + thin green rules as the
   header mark, mirrored here at the top of the list section. Green rules sit on
   the bone background, offset below the green hero above by the shared rule
   token (see global.css → brand double-rule mark). */
.wulr-archive-list { position: relative; }
.wulr-archive-list::before,
.wulr-archive-list::after,
.page-by-topic .wulr-page-body::before,
.page-by-author .wulr-page-body::before,
.page-by-topic .wulr-page-body::after,
.page-by-author .wulr-page-body::after {
	content: "";
	position: absolute;
	/* Full-bleed edge-to-edge (matches the header mark). The list section is an
	   .alignfull block that already spans the full viewport — its padding-box
	   edges ARE the viewport edges — so the rules span 0 → 0. (Pulling out by the
	   root padding here overshot the viewport by that amount and caused a
	   horizontal scrollbar.) */
	left: 0;
	right: 0;
	background: var(--wp--preset--color--primary);
}
.wulr-archive-list::before,
.wulr-page-image-hero::before,
.page-by-topic .wulr-page-body::before,
.page-by-author .wulr-page-body::before { top: var(--wulr-rule-offset); height: var(--wulr-rule-thick); }  /* thick */
.wulr-archive-list::after,
.wulr-page-image-hero::after,
.page-by-topic .wulr-page-body::after,
.page-by-author .wulr-page-body::after { top: var(--wulr-rule-thin-offset); height: var(--wulr-rule-thin); }  /* thin */

/* Archive cards mirror the homepage carousel cards, styled by edition. The meta
   row (edition label + date/volume) is rendered by ad_archive_card_meta(); the
   excerpt/dek shows only on Online-edition cards — post_class() adds
   `category-online` to the <li> — matching the Online carousel, while Print
   cards omit it (matching the Print carousel). */
.wulr-card-grid .wulr-card-meta {
	display: flex;
	flex-wrap: wrap;
	align-items: baseline;
	gap: 10px;
}
.wulr-card-grid .wulr-card-dek { display: none; }
.wulr-card-grid li.category-online .wulr-card-dek { display: block; }
/* Left-align card content (defeat the constrained layout's auto-centering of the
   short meta/byline rows — same fix as the homepage Online/Print cards). */
.wulr-card-grid .wulr-card { text-align: left; }
.wulr-card-grid .wulr-card > * { margin-inline: 0 !important; }

/* Archives show 3 cards per row (the shared .wulr-card-grid base is 4-up, which
   the article "related" grid keeps). Scoped to the archive list; responsive
   rules re-declared here so they beat the base media queries at this
   specificity. 12 posts/page fills 3 columns (4 rows) evenly. */
.wulr-archive-list .wulr-card-grid { grid-template-columns: repeat(3, 1fr); }
@media (max-width: 980px) {
	.wulr-archive-list .wulr-card-grid { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 560px) {
	.wulr-archive-list .wulr-card-grid { grid-template-columns: 1fr; }
}

/* Mobile: compact cards — drop the min-height and the excerpt, keeping the meta
   row (type + date/volume), title, and author. */
@media (max-width: 560px) {
	.wulr-card-grid .wulr-card { min-height: 0; }
	.wulr-card-grid .wulr-card-dek,
	.wulr-card-grid li.category-online .wulr-card-dek { display: none; }
}

/* Pagination — numbered squares with an accent-underlined current page, and
   uppercase Prev / Next links on the ends. Sans, in the site's key. */
.wulr-pagination {
	margin-top: var(--wp--preset--spacing--60, 40px);
	gap: 0.35rem;
	align-items: center;
	font-family: var(--wp--preset--font-family--sans);
}
.wulr-pagination .page-numbers {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 2.5rem;
	height: 2.5rem;
	padding: 0 0.4rem;
	color: var(--wp--preset--color--ink-2);
	font-size: var(--wp--preset--font-size--sm);
	text-decoration: none;
	border-bottom: 2px solid transparent;
	transition: color 0.15s, border-color 0.15s;
}
.wulr-pagination a.page-numbers:hover,
.wulr-pagination a.page-numbers:focus-visible {
	color: var(--wp--preset--color--accent);
}
.wulr-pagination .page-numbers.current {
	font-weight: 700;
	color: var(--wp--preset--color--accent);
	border-bottom-color: var(--wp--preset--color--accent);
}
.wulr-pagination .page-numbers.dots {
	min-width: 0;
	color: var(--wp--preset--color--stone);
}
/* Prev / Next as uppercase brand links on the ends of the row. */
.wulr-pagination .wp-block-query-pagination-previous,
.wulr-pagination .wp-block-query-pagination-next {
	font-size: var(--wp--preset--font-size--xs);
	font-weight: 700;
	letter-spacing: 0.1em;
	text-transform: uppercase;
	color: var(--wp--preset--color--primary);
	text-decoration: none;
	transition: color 0.15s;
}
.wulr-pagination .wp-block-query-pagination-previous:hover,
.wulr-pagination .wp-block-query-pagination-next:hover,
.wulr-pagination .wp-block-query-pagination-previous:focus-visible,
.wulr-pagination .wp-block-query-pagination-next:focus-visible {
	color: var(--wp--preset--color--accent);
}
.wulr-pagination .wp-block-query-pagination-previous { margin-right: 0.5rem; }
.wulr-pagination .wp-block-query-pagination-next { margin-left: 0.5rem; }