/**
 * Blog / post archive listing - aligns with A2Z Latest Posts block
 * (DM Sans, #2563eb accent, soft cards). Scoped to body.a2z-blog-archive.
 *
 * Targets: classic Loop (article.post), Blocksy (.entry-card, .entries),
 * and core Query Loop (.wp-block-post-template).
 */

body.a2z-blog-archive {
	--a2z-archive-ink: #0f172a;
	--a2z-archive-muted: #64748b;
	--a2z-archive-border: #e2e8f0;
	--a2z-archive-accent: #2563eb;
	--a2z-archive-surface: #fff;
	--a2z-archive-radius: clamp(1rem, 2vw, 1.35rem);
	--a2z-archive-shadow: 0 14px 36px rgba(15, 23, 42, 0.06);
	--a2z-archive-shadow-hover: 0 20px 44px rgba(15, 23, 42, 0.1);
}

body.a2z-blog-archive #main,
body.a2z-blog-archive .site-main,
body.a2z-blog-archive main {
	font-family: "DM Sans", system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
	color: var(--a2z-archive-ink);
}

/* Card shell: Blocksy + default Loop */
body.a2z-blog-archive .entries,
body.a2z-blog-archive .site-main .entries {
	gap: clamp(1rem, 2vw, 1.35rem);
}

body.a2z-blog-archive article.post,
body.a2z-blog-archive .entry-card,
body.a2z-blog-archive .hentry.post {
	background: var(--a2z-archive-surface);
	border: 1px solid var(--a2z-archive-border);
	border-radius: var(--a2z-archive-radius);
	box-shadow: var(--a2z-archive-shadow);
	overflow: hidden;
	transition: box-shadow 0.2s ease, transform 0.2s ease;
}

body.a2z-blog-archive article.post:hover,
body.a2z-blog-archive .entry-card:hover,
body.a2z-blog-archive .hentry.post:hover {
	box-shadow: var(--a2z-archive-shadow-hover);
	transform: translateY(-2px);
}

/* Featured image */
body.a2z-blog-archive article.post .post-thumbnail,
body.a2z-blog-archive .entry-card .post-thumbnail,
body.a2z-blog-archive .entry-card .ct-media-container {
	margin: 0;
	overflow: hidden;
	background: var(--a2z-archive-border);
}

body.a2z-blog-archive article.post .post-thumbnail img,
body.a2z-blog-archive .entry-card .post-thumbnail img,
body.a2z-blog-archive .entry-card .ct-media-container img {
	width: 100%;
	display: block;
	aspect-ratio: 16 / 10;
	object-fit: cover;
}

/* Inner padding for card bodies */
body.a2z-blog-archive article.post .entry-header,
body.a2z-blog-archive article.post .entry-content,
body.a2z-blog-archive article.post .entry-summary,
body.a2z-blog-archive .entry-card .entry-body,
body.a2z-blog-archive .entry-card .card-content {
	padding-inline: clamp(1rem, 2vw, 1.25rem);
}

body.a2z-blog-archive article.post .entry-header:first-child,
body.a2z-blog-archive .entry-card .entry-body:first-child {
	padding-top: clamp(1rem, 2vw, 1.25rem);
}

body.a2z-blog-archive article.post .entry-summary:last-child,
body.a2z-blog-archive article.post .entry-content:last-child,
body.a2z-blog-archive .entry-card .entry-body:last-child {
	padding-bottom: clamp(1rem, 2vw, 1.25rem);
}

/* Titles */
body.a2z-blog-archive .entry-title,
body.a2z-blog-archive .entry-title a,
body.a2z-blog-archive h2.entry-title a {
	font-weight: 800;
	letter-spacing: -0.02em;
	line-height: 1.25;
	color: var(--a2z-archive-ink);
	text-decoration: none;
	transition: color 0.15s ease;
}

body.a2z-blog-archive .entry-title a:hover,
body.a2z-blog-archive h2.entry-title a:hover {
	color: var(--a2z-archive-accent);
}

body.a2z-blog-archive .entry-title {
	font-size: clamp(1rem, 2.2vw, 1.15rem);
	margin-top: 0.35rem;
	margin-bottom: 0.5rem;
}

/* Meta line (date, author) */
body.a2z-blog-archive .entry-meta,
body.a2z-blog-archive .post-meta,
body.a2z-blog-archive .ct-meta-element {
	font-size: 0.75rem;
	font-weight: 600;
	text-transform: uppercase;
	letter-spacing: 0.04em;
	color: var(--a2z-archive-muted);
}

body.a2z-blog-archive .entry-meta a,
body.a2z-blog-archive .post-meta a {
	color: var(--a2z-archive-muted);
	text-decoration: none;
}

body.a2z-blog-archive .entry-meta a:hover {
	color: var(--a2z-archive-accent);
}

/* Excerpt */
body.a2z-blog-archive .entry-summary,
body.a2z-blog-archive .entry-summary p,
body.a2z-blog-archive .entry-excerpt,
body.a2z-blog-archive .entry-card .entry-excerpt {
	font-size: 0.88rem;
	line-height: 1.55;
	color: var(--a2z-archive-muted);
	margin: 0 0 0.75rem;
}

/* Category / tag chips */
body.a2z-blog-archive .cat-links a,
body.a2z-blog-archive .post-categories a,
body.a2z-blog-archive .ct-meta-badge a,
body.a2z-blog-archive .post-tags a,
body.a2z-blog-archive a[rel="category tag"],
body.a2z-blog-archive a[rel="tag"] {
	display: inline-block;
	margin: 0 0.35rem 0.35rem 0;
	padding: 0.35rem 0.75rem;
	border-radius: 999px;
	font-size: 0.72rem;
	font-weight: 700;
	letter-spacing: 0.05em;
	text-transform: uppercase;
	text-decoration: none;
	color: var(--a2z-archive-accent);
	background: color-mix(in srgb, var(--a2z-archive-accent) 12%, #fff);
}

@supports not (color: color-mix(in srgb, white 50%, black)) {
	body.a2z-blog-archive .cat-links a,
	body.a2z-blog-archive .post-categories a,
	body.a2z-blog-archive .ct-meta-badge a,
	body.a2z-blog-archive .post-tags a,
	body.a2z-blog-archive a[rel="category tag"],
	body.a2z-blog-archive a[rel="tag"] {
		background: #eff6ff;
	}
}

body.a2z-blog-archive .cat-links a:hover,
body.a2z-blog-archive .post-categories a:hover,
body.a2z-blog-archive .ct-meta-badge a:hover {
	opacity: 0.92;
}

/* Read more */
body.a2z-blog-archive .more-link,
body.a2z-blog-archive .read-more a,
body.a2z-blog-archive .entry-read-more a {
	font-size: 0.85rem;
	font-weight: 700;
	color: var(--a2z-archive-accent);
	text-decoration: none;
}

body.a2z-blog-archive .more-link:hover,
body.a2z-blog-archive .read-more a:hover {
	text-decoration: underline;
	text-underline-offset: 3px;
}

/* Pagination */
body.a2z-blog-archive .navigation.pagination,
body.a2z-blog-archive .nav-links {
	margin-top: clamp(2rem, 5vw, 3rem);
}

body.a2z-blog-archive .page-numbers,
body.a2z-blog-archive .nav-links a {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 2.5rem;
	height: 2.5rem;
	padding: 0 0.65rem;
	margin: 0 0.25rem 0.25rem 0;
	border-radius: 999px;
	font-size: 0.875rem;
	font-weight: 600;
	text-decoration: none;
	border: 1px solid var(--a2z-archive-border);
	background: var(--a2z-archive-surface);
	color: var(--a2z-archive-ink);
	transition: background 0.15s ease, color 0.15s ease, border-color 0.15s ease;
}

body.a2z-blog-archive .page-numbers.current,
body.a2z-blog-archive .page-numbers:hover,
body.a2z-blog-archive .nav-links a:hover {
	background: var(--a2z-archive-accent);
	border-color: var(--a2z-archive-accent);
	color: #fff;
}

body.a2z-blog-archive .page-numbers.dots {
	border: none;
	background: transparent;
	color: var(--a2z-archive-muted);
	min-width: auto;
}

/* Core Query Loop (block theme / hybrid) */
body.a2z-blog-archive .wp-block-post-template {
	gap: clamp(1rem, 2vw, 1.35rem);
}

body.a2z-blog-archive .wp-block-post-template > li,
body.a2z-blog-archive .wp-block-post {
	list-style: none;
	background: var(--a2z-archive-surface);
	border: 1px solid var(--a2z-archive-border);
	border-radius: var(--a2z-archive-radius);
	box-shadow: var(--a2z-archive-shadow);
	overflow: hidden;
	transition: box-shadow 0.2s ease, transform 0.2s ease;
}

body.a2z-blog-archive .wp-block-post-template > li:hover,
body.a2z-blog-archive .wp-block-post:hover {
	box-shadow: var(--a2z-archive-shadow-hover);
	transform: translateY(-2px);
}

body.a2z-blog-archive .wp-block-post-title a {
	font-weight: 800;
	color: var(--a2z-archive-ink);
	text-decoration: none;
}

body.a2z-blog-archive .wp-block-post-title a:hover {
	color: var(--a2z-archive-accent);
}

body.a2z-blog-archive .wp-block-post-excerpt,
body.a2z-blog-archive .wp-block-post-excerpt__excerpt {
	color: var(--a2z-archive-muted);
	font-size: 0.88rem;
	line-height: 1.55;
}

body.a2z-blog-archive .wp-block-post-date {
	font-size: 0.75rem;
	font-weight: 600;
	text-transform: uppercase;
	letter-spacing: 0.04em;
	color: var(--a2z-archive-muted);
}

body.a2z-blog-archive .wp-block-post-featured-image img {
	aspect-ratio: 16 / 10;
	object-fit: cover;
	width: 100%;
}

body.a2z-blog-archive .wp-block-query-pagination .wp-block-query-pagination-numbers a,
body.a2z-blog-archive .wp-block-query-pagination .wp-block-query-pagination-previous,
body.a2z-blog-archive .wp-block-query-pagination .wp-block-query-pagination-next {
	border-radius: 999px;
	font-weight: 600;
}