/*
Theme Name: The Issue Child (AvianVets)
Theme URI: https://avianvets.org
Description: Child theme for the "theissue" parent, scoped to AvianVets.org recovery work. Hosts all custom CSS, trust components (byline, medically-reviewed badge, disclaimer, references, author card), fix-list overrides, and shortcodes. No parent files are modified — every change lives here so a fuelthemes update cannot overwrite our work.
Author: AvianVets.org
Author URI: https://avianvets.org
Template: theissue
Version: 1.9.2
Text Domain: theissue-child
*/

/* ==========================================================================
   Design tokens — mirrors BRAND-GUIDE §4. theissue does not use CSS
   variables; we introduce them ONLY inside :root here so child-theme
   components can reference them. Parent-theme selectors continue to work
   from their hard-coded hex values.
   ========================================================================== */
:root {
	--text-primary: #0a0a0a;
	--text-muted: #8a8a8a;
	--text-light: #c1c1c1;
	--surface: #fefefe;
	--surface-alt: #f8f8f8;
	--surface-dark: #1f2a33;   /* dark section-band fallback + hero background */
	--surface-tint: #eef1f4;   /* mid-tone in the img-slot gradient */
	--border: #cacaca;
	--border-soft: #e6e6e6;
	--link: #1779ba;
	--link-hover: #1468a0;
	--accent: #f75454;
	--overlay-dark: rgba(0,0,0,0.35);
	--overlay-light: rgba(255,255,255,0.35);
}

/* ==========================================================================
   FIX-1 static hero (replaces the Revolution Slider dummy.png carousel).
   Rendered inline in the homepage post as .av-hero markup.

   Contrast strategy (2026-08-12 render-QA follow-up 2):
   - Mobile (<768px): STACKED BLOCK — real <img> photo above, solid dark
	 text panel below. No background-image on the section, no gradient
	 scrim. The image is the LCP; text sits on flat --overlay-dark with
	 full contrast for H1/subtitle/CTA. Previous overlay-tuning approach
	 buried the chick behind a gradient; restructuring per DESIGN-SYSTEM
	 §FIX-1 mobile-stack intent.
   - Tablet (768-1023px): centered text stack over the background image
	 with a flat --overlay-dark scrim. Same treatment as before this fix.
   - Desktop (≥1024px): text block is left-aligned inside the dark left
	 third of the image, per DESIGN-SYSTEM §FIX-1. Left-to-right
	 gradient scrim (0.65 -> 0.15). Unchanged.
   ========================================================================== */
.av-hero {
	position: relative;
	width: 100%;
	min-height: 380px;
	max-height: 520px;
	background-color: var(--surface-dark);
	background-size: cover;
	/* On mobile the natural image center leaves the chick as a sliver at
	   the bottom edge; pull position slightly right + down so the subject
	   sits alongside the text stack instead of behind it. Desktop rule
	   below resets to center-center for the wider crop. */
	background-position: 60% 65%;
	background-repeat: no-repeat;
	overflow: hidden;
}
.av-hero__overlay {
	position: absolute; inset: 0;
	background: var(--overlay-dark);
	display: flex;
	align-items: center;
	justify-content: center;
}
.av-hero__inner {
	max-width: 900px;
	padding: 48px 24px;
	text-align: center;
	color: #fff;
}
.av-hero__title {
	font-size: 40px;
	line-height: 1.15;
	font-weight: 700;
	color: #fff;
	margin: 0 0 16px;
	letter-spacing: -0.01em;
	/* Small text-shadow keeps the H1 legible if the overlay ever fails
	   to load and the image lands unexpectedly bright. Kept subtle so
	   it's invisible on the intended dark scrim. */
	text-shadow: 0 1px 2px rgba(0,0,0,0.35);
}
.av-hero__subtitle {
	font-size: 18px;
	line-height: 1.5;
	color: #fff;
	margin: 0 0 24px;
	opacity: 0.95;
	text-shadow: 0 1px 2px rgba(0,0,0,0.35);
}
.av-hero__cta {
	display: inline-block;
	background: var(--link);
	color: #fff !important;
	padding: 14px 28px;
	font-size: 16px;
	font-weight: 600;
	border-radius: 3px;
	text-decoration: none;
	transition: background-color 0.2s ease;
}
.av-hero__cta:hover,
.av-hero__cta:focus { background: var(--link-hover); color: #fff !important; text-decoration: none; }
.av-hero__cta:focus { outline: 2px solid #fff; outline-offset: 2px; }
.av-hero__secondary {
	display: block;
	margin-top: 16px;
	color: #fff !important;
	font-size: 15px;
	text-decoration: underline;
}
.av-hero__secondary:hover,
.av-hero__secondary:focus { color: #fff !important; opacity: 0.85; }

/* Default: mobile <img> hidden. The 768-and-up viewports use the CSS
   background-image on .av-hero. The mobile-only media block below
   flips this back to display: block. */
.av-hero__mobile-img { display: none; }

/* Desktop / large-tablet: text sits in the dark left third with a
   left-to-right gradient scrim guaranteeing contrast even over a
   bright subject on the right side of the photo. */
@media (min-width: 1024px) {
	.av-hero { background-position: center center; }
	.av-hero__overlay {
		background: linear-gradient(
			to right,
			rgba(0,0,0,0.70) 0%,
			rgba(0,0,0,0.55) 35%,
			rgba(0,0,0,0.30) 65%,
			rgba(0,0,0,0.15) 100%
		);
		justify-content: flex-start;
	}
	.av-hero__inner {
		text-align: left;
		padding: 56px 48px 56px 8%;
		max-width: 640px;
	}
	.av-hero__cta { margin-right: 0; }
}

/* Mobile (<768px): STACKED BLOCK per DESIGN-SYSTEM §FIX-1 mobile intent.
   Real <img> photo above, solid dark text panel below. The background-
   image on .av-hero is neutralized (still declared inline on the section
   by the shortcode for tablet+, but suppressed here). The overlay is
   detached from absolute-positioning and becomes a normal-flow solid
   dark panel with full text contrast — no gradient. */
@media (max-width: 767px) {
	.av-hero {
		display: flex;
		flex-direction: column;
		min-height: 0;
		max-height: none;
		background-image: none !important;
		background-color: var(--surface-dark);
		overflow: visible;
	}
	.av-hero__mobile-img {
		display: block;
		width: 100%;
		height: auto;
		aspect-ratio: 16 / 9;
		object-fit: cover;
		object-position: center 60%;
		margin: 0;
	}
	.av-hero__overlay {
		position: static;
		inset: auto;
		background: var(--surface-dark);
		display: block;
	}
	.av-hero__inner {
		max-width: none;
		padding: 32px 20px;
		text-align: center;
	}
	.av-hero__title {
		font-size: 28px;
		text-shadow: none;
	}
	.av-hero__subtitle {
		font-size: 16px;
		text-shadow: none;
		opacity: 1;
	}
	.av-hero__cta { display: inline-block; }
	.av-hero__secondary { display: inline-block; }
}

/* Temporary marker for designer — makes the placeholder hero image
   obviously provisional in the admin bar and in rendered HTML comments. */
.av-hero[data-image="placeholder"]::after {
	content: "TEMPORARY HERO IMAGE — designer to replace";
	position: absolute;
	bottom: 8px; right: 8px;
	background: var(--accent);
	color: #fff;
	font-size: 11px;
	font-weight: 600;
	padding: 3px 8px;
	border-radius: 2px;
	letter-spacing: 0.02em;
	text-transform: uppercase;
	z-index: 3;
}

/* ==========================================================================
   Recent-posts card grid (UX P0-05 interim below-fold).
   Simple 3-column grid on desktop, 2-col on tablet, 1-col on mobile.
   Purpose: fill the homepage between the hero and the footer so the
   page doesn't read as "under construction" while the strategist
   picks curated pillars.
   ========================================================================== */
.av-recent {
	width: 100%;
	padding: 48px 24px;
	background: var(--surface);
}
.av-recent__inner {
	max-width: 1200px;
	margin: 0 auto;
}
.av-recent__title {
	font-size: 26px;
	font-weight: 700;
	color: var(--text-primary);
	margin: 0 0 24px;
	text-align: center;
	letter-spacing: -0.01em;
}
.av-recent__grid {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 24px;
}
.av-recent__card {
	background: var(--surface);
	border: 1px solid var(--border-soft);
	border-radius: 4px;
	overflow: hidden;
	transition: box-shadow 0.2s ease, transform 0.2s ease;
	display: flex;
	flex-direction: column;
}
.av-recent__card:hover { box-shadow: 0 6px 20px rgba(0,0,0,0.07); transform: translateY(-2px); }
.av-recent__thumb {
	display: block;
	aspect-ratio: 16 / 10;
	overflow: hidden;
	background: var(--surface-alt);
}
.av-recent__thumb img {
	width: 100%; height: 100%;
	object-fit: cover;
	display: block;
}
.av-recent__body { padding: 16px 18px 20px; }
.av-recent__cat {
	display: inline-block;
	font-size: 12px;
	font-weight: 600;
	text-transform: uppercase;
	letter-spacing: 0.04em;
	color: var(--accent);
	text-decoration: none;
	margin-bottom: 8px;
}
.av-recent__cat:hover { color: var(--link); text-decoration: underline; }
.av-recent__heading {
	margin: 0;
	font-size: 18px;
	line-height: 1.35;
	font-weight: 600;
	color: var(--text-primary);
}
.av-recent__heading a {
	color: var(--text-primary);
	text-decoration: none;
}
.av-recent__heading a:hover,
.av-recent__heading a:focus { color: var(--link); text-decoration: underline; }
.av-recent__more {
	text-align: center;
	margin: 32px 0 0;
}
@media (max-width: 900px) {
	.av-recent__grid { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 560px) {
	.av-recent { padding: 32px 16px; }
	.av-recent__grid { grid-template-columns: 1fr; gap: 16px; }
	.av-recent__title { font-size: 22px; margin-bottom: 20px; }
}

/* ==========================================================================
   Trust components — DESIGN-SYSTEM §3
   ========================================================================== */

/* 3.1 Author byline (compact, top of article) */
.av-byline {
	display: flex;
	align-items: center;
	gap: 12px;
	margin: 0 0 20px;
	padding: 0;
}
.av-byline__photo {
	width: 40px; height: 40px;
	border-radius: 50%;
	border: 1px solid var(--border-soft);
	flex-shrink: 0;
	object-fit: cover;
	background: var(--surface-alt);
}
.av-byline__text { line-height: 1.4; }
.av-byline__name {
	font-size: 15px;
	font-weight: 600;
	color: var(--text-primary);
	text-decoration: none;
}
.av-byline__name:hover,
.av-byline__name:focus { color: var(--link); text-decoration: underline; }
.av-byline__cred {
	font-size: 15px;
	font-weight: 400;
	color: var(--text-primary);
}
.av-byline__meta {
	display: block;
	font-size: 13px;
	color: var(--text-muted);
	line-height: 1.4;
	margin-top: 2px;
}

/* 3.2 Medically-reviewed badge (compact inline) */
.av-reviewed {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	background: var(--surface-alt);
	border: 1px solid var(--border-soft);
	border-radius: 999px;
	padding: 4px 12px;
	min-height: 32px;
	font-size: 13px;
	line-height: 1.3;
	margin: 0 0 20px;
}
.av-reviewed__icon {
	color: var(--accent);
	font-size: 16px;
	line-height: 1;
	display: inline-block;
}
.av-reviewed__label { color: var(--text-muted); }
.av-reviewed__name {
	color: var(--text-primary);
	font-weight: 600;
	text-decoration: none;
}
.av-reviewed__name:hover,
.av-reviewed__name:focus { color: var(--link); text-decoration: underline; }
.av-reviewed__date { color: var(--text-muted); }

/* 3.3 Medical disclaimer (inline article variant) */
.av-disclaimer {
	background: var(--surface-alt);
	border-left: 4px solid var(--accent);
	padding: 16px;
	margin: 0 0 24px;
	font-size: 14px;
	line-height: 1.55;
	color: var(--text-primary);
}
.av-disclaimer strong { color: var(--text-primary); }
.av-disclaimer a { color: var(--link); }
.av-disclaimer a:hover,
.av-disclaimer a:focus { color: var(--link-hover); }
.av-disclaimer p { margin: 0 0 8px; }
.av-disclaimer p:last-child { margin-bottom: 0; }

/* Same visual, but generic callout used elsewhere (talk-to-an-avian-vet
   emergency-triage box uses this pattern per DESIGN-SYSTEM). */
.av-callout {
	background: var(--surface-alt);
	border-left: 4px solid var(--accent);
	padding: 16px;
	margin: 0 0 24px;
	font-size: 15px;
	line-height: 1.55;
}
.av-callout--info {
	border-left-color: var(--link);
}
.av-callout p:first-child { margin-top: 0; }
.av-callout p:last-child { margin-bottom: 0; }

/* Affiliate disclosure block (used above each affiliate CTA cluster) */
.av-disclosure {
	background: var(--surface-alt);
	border: 1px solid var(--border-soft);
	padding: 16px;
	margin: 0 0 24px;
	font-size: 14px;
	line-height: 1.55;
	color: var(--text-primary);
	font-style: italic;
}
.av-disclosure a { color: var(--link); font-style: normal; }

/* 3.4 References section */
.av-references {
	background: var(--surface-alt);
	padding: 24px;
	margin: 32px 0;
	border: 1px solid var(--border-soft);
	border-radius: 4px;
}
.av-references h2 {
	font-size: 22px;
	margin: 0 0 16px;
	color: var(--text-primary);
}
.av-references ol {
	padding-left: 24px;
	margin: 0;
	font-size: 15px;
	line-height: 1.6;
}
.av-references li {
	margin-bottom: 10px;
	color: var(--text-primary);
}
.av-references li a { color: var(--link); word-break: break-word; }
.av-references li em { font-style: italic; color: var(--text-primary); }

/* 3.1 About-the-author card (bottom of article) */
.av-author-card {
	background: var(--surface-alt);
	border: 1px solid var(--border);
	border-radius: 4px;
	padding: 24px;
	margin: 32px 0;
	display: flex;
	gap: 20px;
	align-items: flex-start;
}
.av-author-card__photo {
	width: 80px; height: 80px;
	border-radius: 50%;
	border: 1px solid var(--border-soft);
	object-fit: cover;
	background: var(--surface);
	flex-shrink: 0;
}
.av-author-card__body { flex: 1; }
.av-author-card__name {
	margin: 0 0 4px;
	font-size: 18px;
	font-weight: 700;
	color: var(--text-primary);
}
.av-author-card__role {
	font-size: 14px;
	color: var(--text-muted);
	margin: 0 0 12px;
}
.av-author-card__bio {
	font-size: 15px;
	line-height: 1.55;
	color: var(--text-primary);
	margin: 0 0 12px;
}
.av-author-card__link { color: var(--link); }
@media (max-width: 640px) {
	.av-author-card { flex-direction: column; text-align: left; }
	.av-author-card__photo { margin-bottom: 4px; }
}

/* ==========================================================================
   About-page founder portrait (DESIGN-SYSTEM §3.5).
   Illustrated portrait per AUTHOR-IDENTITY.md §Avatar — RESOLVED
   (2026-08-12). Rendered at 240px on desktop, scales down on mobile.
   Rounded 4px matches the About page card treatment.
   ========================================================================== */
.av-founder-portrait {
	margin: 0 0 24px;
	padding: 0;
	max-width: 240px;
}
.av-founder-portrait img {
	display: block;
	width: 100%;
	height: auto;
	border-radius: 4px;
}

/* ==========================================================================
   Legacy-post byline avatar (FIX-5 avatar wiring pass, 2026-08-12).
   The parent theme's thb_post_author() renders text-only; we prepend a
   small circular avatar via the thb_post_author action at priority 5.
   Kept intentionally small (32px) so it reads as a byline detail, not
   as a competing element next to the post's h1.
   ========================================================================== */
.av-legacy-byline-avatar {
	display: inline-block;
	width: 32px;
	height: 32px;
	border-radius: 50%;
	vertical-align: middle;
	margin: 0 8px 2px 0;
}

/* Parent theme's article-author card — style overrides so the portrait
   circles cleanly and the bio text sits on the token type scale. Parent
   already handles layout; we only shape the avatar and tighten the
   spacing. */
.thb-article-author img {
	border-radius: 50%;
}
.thb-article-author.style1 {
	margin-top: 32px;
}

/* ==========================================================================
   FIX-9 (P2 polish) — footer scroll-to-top focus state.
   Selector is inherited from the parent theme's #back-to-top control.
   ========================================================================== */
#back-to-top:focus,
#back-to-top a:focus {
	outline: 2px solid var(--link);
	outline-offset: 2px;
}

/* Affiliate CTA button used by the draft-conversion pipeline. */
.av-affiliate-cta {
	margin: 20px 0 24px;
	text-align: left;
}
.av-cta-btn {
	display: inline-block;
	background: var(--link);
	color: #fff !important;
	padding: 12px 22px;
	font-size: 15px;
	font-weight: 600;
	border-radius: 3px;
	text-decoration: none;
	transition: background-color 0.2s ease;
}
.av-cta-btn:hover,
.av-cta-btn:focus { background: var(--link-hover); color: #fff !important; text-decoration: none; }
.av-cta-btn:focus { outline: 2px solid var(--link); outline-offset: 2px; }

/* Visible placeholder marker — anything that must be filled in
   before publish gets loud red text so it can't be missed in preview. */
.av-placeholder {
	color: var(--accent);
	font-weight: 600;
	background: #fff4f4;
	padding: 1px 4px;
	border-radius: 2px;
	font-style: normal;
}

/* Provider comparison table — turns into stacked cards under 640px,
   because the parent theme's table styling assumes a page-width table. */
.av-content table,
.entry-content table {
	width: 100%;
	border-collapse: collapse;
	margin: 16px 0 24px;
	font-size: 15px;
}
.av-content th,
.av-content td,
.entry-content th,
.entry-content td {
	border: 1px solid var(--border-soft);
	padding: 10px 12px;
	vertical-align: top;
	text-align: left;
}
.av-content thead th,
.entry-content thead th {
	background: var(--surface-alt);
	font-weight: 700;
}

/* Horizontal-scroll wrapper for wide comparison / jump-list tables.
   md2wp.py auto-wraps every emitted <table> in this container so
   narrow viewports scroll the TABLE inside the container instead of
   the page body overflowing. Sprint 5 UX-review gate W3 — required
   for the conure-vs-cockatiel comparison table and the conure-biting-
   and-screaming jump-list table at 375px.
   -webkit-overflow-scrolling: touch enables momentum scroll on iOS. */
.av-table-scroll {
	overflow-x: auto;
	-webkit-overflow-scrolling: touch;
	max-width: 100%;
	margin: 16px 0 24px;
	border: 1px solid var(--border-soft);
	border-radius: 2px;
	/* Right-edge scroll affordance (Final sweep 2026-08-21, UX W2):
	   the multi-layer gradient shows a soft LEFT/RIGHT overlay that
	   is `background-attachment: local` on the outer edges (retreats
	   as the reader scrolls into it) and `scroll` on the inner
	   shadows. This tells the reader "more content off-screen" on
	   both edges of the scrollable region. Strengthened from the
	   pre-sweep 8% shadow to a warm-white gradient so the affordance
	   reads on the money page tables and the conures-live species
	   quickref on 375px. */
	background:
		linear-gradient(to right, var(--surface) 30%, rgba(255,255,255,0)),
		linear-gradient(to right, rgba(255,255,255,0), var(--surface) 70%) 100% 0,
		radial-gradient(farthest-side at 0 50%, rgba(0,0,0,0.14), rgba(0,0,0,0)),
		radial-gradient(farthest-side at 100% 50%, rgba(0,0,0,0.14), rgba(0,0,0,0)) 100% 0;
	background-repeat: no-repeat;
	background-size: 44px 100%, 44px 100%, 16px 100%, 16px 100%;
	background-attachment: local, local, scroll, scroll;
	position: relative;
}
/* Final sweep 2026-08-21 (UX W2): stronger right-edge "swipe →" fade
   on narrow viewports where the tables actually overflow. Pointer-events
   none so the affordance never intercepts touches meant for the table.
   Sits above the base gradient shadow. */
@media (max-width: 900px) {
	.av-table-scroll::after {
		content: "";
		position: absolute;
		top: 0; right: 0; bottom: 0;
		width: 32px;
		pointer-events: none;
		background: linear-gradient(to right,
			rgba(255, 255, 255, 0) 0%,
			rgba(255, 253, 246, 0.55) 45%,
			rgba(255, 253, 246, 0.92) 100%);
		border-radius: 0 2px 2px 0;
	}
}
.av-table-scroll > table {
	/* prevent the table's own outer margin from double-spacing inside
	   the wrapper — the wrapper already carries the spacing */
	margin: 0;
	min-width: 100%;
}
@media (max-width: 640px) {
	.av-table-scroll > table {
		/* let content decide width so the horizontal scroll is meaningful */
		min-width: 480px;
	}
}

/* ==========================================================================
   CONTENT-LAYOUT-SYSTEM.md Phase 1 — components §3.1-§3.10 + image slot
   plumbing. All tokens from the :root palette. Mobile-first stack; the
   parent theme's Foundation grid handles the outer container. Every
   component is a plain BEM-ish class that a shortcode or a hand-written
   HTML block in post_content can use with no template changes.
   ========================================================================== */

/* html-level: smooth scroll for in-page ToCs (§3.5).
   Respects users who ask for reduced motion. */
@media (prefers-reduced-motion: no-preference) {
	html { scroll-behavior: smooth; }
}

/* -----------------------------------------------------------------------
   §3.1 / §3.2 — Section header BANDS
   Two variants: photo (audience-split, hero-band feel) + icon (utility
   sections). Both wrap in .av-section-band as the shared base so future
   variants (video, gradient) can drop in cleanly.
   ---------------------------------------------------------------------- */
.av-section-band {
	margin: 48px -24px 32px;       /* pull to viewport edge inside the
	                                  content column; the parent theme's
	                                  article column is 720-800px, so the
	                                  negative margin gives the band a
	                                  visual "wide" feel without breaking
	                                  the reading measure of the copy. */
	position: relative;
	overflow: hidden;
}
@media (max-width: 640px) {
	.av-section-band { margin-left: -20px; margin-right: -20px; }
}

/* Photo variant — bg image + dark scrim + white H2.
   Supports two authoring patterns:
   A. CSS background-image via inline style="background-image:url(...)"
      on the band element (simple, but no auto-slot resolution).
   B. Nested <div class="av-section-band__bg">[av_img slot="..."]</div>
      as the backdrop, which lets the [av_img] resolver swap a real
      image in when the owner drops the file into the media library
      (Batch 1 workflow). While the file is missing, the slot's
      placeholder tile shows behind the scrim with the slot name
      readable through the darkened overlay. */
.av-section-band--photo {
	min-height: 200px;
	background-color: var(--surface-dark);   /* dark fallback if image missing */
	background-size: cover;
	background-position: center center;
	background-repeat: no-repeat;
	display: flex;
	align-items: center;
	padding: 40px 32px;
}
.av-section-band__bg {
	position: absolute; inset: 0;
	z-index: 0;
	overflow: hidden;
}
.av-section-band__bg img,
.av-section-band__bg .av-img-slot-img {
	width: 100%; height: 100%;
	object-fit: cover;
	display: block;
}
.av-section-band__bg .av-img-slot {
	width: 100%; height: 100%;
	aspect-ratio: auto;             /* fill the band, don't constrain */
	border: 0;
	border-radius: 0;
	background:
		linear-gradient(135deg, #2a3944 0%, var(--surface-dark) 100%);
	color: rgba(255,255,255,0.6);
}
.av-section-band__bg .av-img-slot::before {
	filter: none;
	opacity: 0.35;
	color: rgba(255,255,255,0.55);
}
/* Slot-name badge is DEV-ONLY when inside a user-visible section-band bg.
   The band already carries a bird glyph and the "Image coming soon"
   caption via .av-img-slot's own ::before + __caption elements — the
   monospace slug text would compete with the H2 for reader attention.
   W1/W2 fix (2026-08-12): hide the slot-name span; the slot slug is
   still emitted as an HTML comment by the shortcode so developers can
   inspect DOM to see which asset is missing. */
.av-section-band__bg .av-img-slot__name {
	display: none;
}
.av-section-band__bg .av-img-slot__caption {
	color: rgba(255,255,255,0.75);
}
/* FIX-C (2026-08-12 designer/UX ruling): scrim is bottom-loaded so the
   subtitle text in the lower band region gets ≥0.60 opacity and clears
   WCAG AA 4.5:1 on any real photo we drop in later — poultry straw,
   sun conure plumage, morning coop light. Applied here BEFORE real
   photos land so we don't re-QA every band per hub after each drop. */
.av-section-band--photo::before {
	content: "";
	position: absolute; inset: 0;
	background: linear-gradient(90deg, rgba(10,14,18,0.72) 0%, rgba(10,14,18,0.45) 45%, rgba(10,14,18,0.12) 100%);
	z-index: 1;
}
.av-section-band--photo > *:not(.av-section-band__bg) {
	position: relative;
	z-index: 2;
	color: #fff;
	max-width: 720px;
	text-shadow: 0 1px 2px rgba(0,0,0,0.35);
}
.av-section-band--photo h2 {
	color: #fff;
	margin: 0 0 8px;
	font-size: 32px;
	line-height: 1.15;
}
.av-section-band--photo p {
	color: rgba(255,255,255,0.90);
	margin: 0;
	font-size: 17px;
	line-height: 1.45;
}
@media (max-width: 640px) {
	.av-section-band--photo { min-height: 140px; padding: 28px 20px; }
	.av-section-band--photo h2 { font-size: 24px; }
	.av-section-band--photo p  { font-size: 15px; }
}

/* Icon variant — utility band */
.av-section-band--icon {
	background: var(--surface-alt);
	border-top: 1px solid var(--border-soft);
	border-bottom: 1px solid var(--border-soft);
	padding: 24px 24px;
	display: flex;
	align-items: center;
	gap: 20px;
}
.av-section-band--icon .av-section-band__icon,
.av-section-band--icon [class^="icon-"],
.av-section-band--icon [class*=" icon-"] {
	font-size: 56px;   /* per §3.2 — was 48; bumped for stronger visual weight */
	line-height: 1;
	color: var(--link);
	flex: 0 0 auto;
}
.av-section-band--icon h2 {
	margin: 0 0 4px;
	font-size: 26px;
	line-height: 1.2;
}
.av-section-band--icon p {
	margin: 0;
	color: var(--text-muted);
	font-size: 15px;
	line-height: 1.45;
}
@media (max-width: 640px) {
	.av-section-band--icon { padding: 20px; gap: 14px; }
	.av-section-band--icon .av-section-band__icon,
	.av-section-band--icon [class^="icon-"],
	.av-section-band--icon [class*=" icon-"] { font-size: 40px; }
	.av-section-band--icon h2 { font-size: 22px; }
}

/* -----------------------------------------------------------------------
   §3.3 — Link cards (replacement for long bulleted runs).
   Grid: 3-col desktop, 2-col tablet, 1-col mobile.
   Two states: real (linked, thumbnail) and pending (quiet "coming soon"
   tile — replaces the loud red [LINK PENDING] treatment IN LINK-CARD
   CONTEXTS only; the red loud style stays for byline/reviewer text
   placeholders per the sprint 5 rule).
   ---------------------------------------------------------------------- */
.av-link-card__grid {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 24px;
	margin: 24px 0 32px;
	list-style: none;
	padding: 0;
}
/* wpautop defense (FIX-A/C 2026-08-12): WordPress' `wpautop` converts
   line-breaks between grid children (`<a>`/`<li>`) into `<br />` nodes
   that become extra grid items and blow the column count. Nuking any
   `<br />` that lands as a direct child of a grid container keeps the
   layout resilient to editor mishaps (someone hitting enter between
   cards in Gutenberg). One-line defense; costs nothing when the source
   is clean. */
.av-link-card__grid > br { display: none; }
@media (max-width: 900px) {
	.av-link-card__grid { grid-template-columns: repeat(2, 1fr); gap: 20px; }
}
@media (max-width: 560px) {
	.av-link-card__grid { grid-template-columns: 1fr; gap: 16px; }
}
.av-link-card {
	background: var(--surface);
	border: 1px solid var(--border-soft);
	border-radius: 4px;
	overflow: hidden;
	display: flex;
	flex-direction: column;
	transition: border-color 0.15s ease, transform 0.15s ease;
}
.av-link-card:hover,
.av-link-card:focus-within {
	border-color: var(--link);
	transform: translateY(-2px);
}
.av-link-card__thumb {
	aspect-ratio: 16 / 9;
	background: var(--surface-alt);
	background-size: cover;
	background-position: center center;
	background-repeat: no-repeat;
	display: block;
}
.av-link-card__body {
	padding: 16px 20px 20px;
	flex: 1;
	display: flex;
	flex-direction: column;
}
.av-link-card__title {
	font-size: 18px;
	font-weight: 600;
	color: var(--text-primary);
	margin: 0 0 8px;
	line-height: 1.35;
}
.av-link-card__title a {
	color: inherit;
	text-decoration: none;
}
.av-link-card__title a:hover,
.av-link-card__title a:focus { color: var(--link); }
.av-link-card__desc {
	font-size: 14px;
	color: var(--text-muted);
	margin: 0;
	line-height: 1.5;
}

/* "Coming soon" quiet tile — the pending variant. QUIET, not loud red.
   Neutral surface-alt thumbnail + subdued pill + muted body. Contrasts
   with the byline/reviewer red placeholders which stay loud on purpose. */
.av-link-card--pending {
	border-style: dashed;
	background: var(--surface);
}
.av-link-card--pending:hover,
.av-link-card--pending:focus-within {
	border-color: var(--border);
	transform: none;
	cursor: default;
}
.av-link-card--pending .av-link-card__thumb {
	background: var(--surface-alt);
	display: flex;
	align-items: center;
	justify-content: center;
	color: var(--text-light);
	font-size: 40px;
	line-height: 1;
}
.av-link-card--pending .av-link-card__pill {
	display: inline-block;
	font-size: 11px;
	font-weight: 600;
	letter-spacing: 0.06em;
	text-transform: uppercase;
	color: var(--text-muted);
	background: transparent;
	border: 1px solid var(--border-soft);
	border-radius: 999px;
	padding: 2px 10px;
	margin: 0 0 8px;
}
.av-link-card--pending .av-link-card__title {
	color: var(--text-primary);
	font-weight: 600;
}
.av-link-card--pending .av-link-card__desc {
	color: var(--text-muted);
}

/* -----------------------------------------------------------------------
   §3.4 — Visual TOC (hub "pick your entry point" grid).
   3 or 4 cards. Grid reflows 4→2→1.
   ---------------------------------------------------------------------- */
.av-hub-toc {
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: 16px;
	margin: 32px 0;
	list-style: none;
	padding: 0;
}
.av-hub-toc--3 { grid-template-columns: repeat(3, 1fr); }
/* wpautop defense (FIX-A 2026-08-12): same `<br />`-as-grid-item bug
   that hit the pilot's TOC at 1440. wpautop injects `<br />` between
   sibling `<a>` children of the `<nav>` container, each of which
   counts as a grid item and orphans the last card. Hide any `<br />`
   that lands as a direct child of the TOC container — belt-and-
   suspenders. Compact-line markup (no newlines between `</a>` and `<a`)
   is the primary fix; this rule stops the bug reappearing when a
   copywriter opens the page in Gutenberg. */
.av-hub-toc > br,
.av-hub-toc--3 > br { display: none; }
/* UX ruling 2026-08-12 (C2): 3-card TOCs stay 3-across at tablet
   (640–1023). Text is short enough to fit. Falls to single-column
   only below 640. 4-card TOCs still fall to 2×2 at ≤900 per §3.4.
   Two rules per breakpoint so `.av-hub-toc--3` wins the cascade
   against the base `.av-hub-toc` selector at equal specificity. */
@media (max-width: 900px) {
	.av-hub-toc { grid-template-columns: repeat(2, 1fr); }
	.av-hub-toc--3 { grid-template-columns: repeat(3, 1fr); }
}
@media (max-width: 640px) {
	.av-hub-toc { grid-template-columns: 1fr 1fr; }
	.av-hub-toc--3 { grid-template-columns: 1fr; }
}
@media (max-width: 480px) {
	.av-hub-toc { grid-template-columns: 1fr; }
}
.av-hub-toc__card {
	border: 1px solid var(--border-soft);
	border-radius: 4px;
	padding: 20px;
	text-align: center;
	background: var(--surface);
	color: inherit;
	text-decoration: none;
	transition: border-color 0.15s ease, transform 0.15s ease;
	display: block;
}
.av-hub-toc__card:hover,
.av-hub-toc__card:focus {
	border-color: var(--link);
	transform: translateY(-2px);
	text-decoration: none;
}
.av-hub-toc__icon {
	font-size: 40px;
	line-height: 1;
	color: var(--link);
	display: block;
	margin-bottom: 8px;
}
.av-hub-toc__label {
	font-weight: 600;
	font-size: 15px;
	color: var(--text-primary);
	display: block;
	line-height: 1.3;
}
.av-hub-toc__desc {
	font-size: 13px;
	color: var(--text-muted);
	margin-top: 4px;
	line-height: 1.4;
}

/* -----------------------------------------------------------------------
   §3.5 — In-page jump list (article ToC).
   Two-column at desktop, single-column mobile.
   Global smooth-scroll declared at top of file.
   ---------------------------------------------------------------------- */
.av-jumplist {
	background: var(--surface-alt);
	border-radius: 4px;
	padding: 20px 24px;
	margin: 24px 0;
}
.av-jumplist__title {
	font-size: 13px;
	font-weight: 600;
	color: var(--text-muted);
	text-transform: uppercase;
	letter-spacing: 0.08em;
	margin: 0 0 12px;
}
.av-jumplist__list {
	columns: 2;
	column-gap: 32px;
	list-style: none;
	padding: 0;
	margin: 0;
}
.av-jumplist__list li {
	break-inside: avoid;
	margin: 0 0 8px;
	padding: 0;
}
.av-jumplist__list a {
	color: var(--link);
	font-size: 15px;
	text-decoration: none;
	line-height: 1.5;
}
.av-jumplist__list a:hover,
.av-jumplist__list a:focus { color: var(--link-hover); text-decoration: underline; }
@media (max-width: 640px) {
	.av-jumplist__list { columns: 1; }
}

/* -----------------------------------------------------------------------
   §3.6 — Figure block (in-body image + caption).
   ---------------------------------------------------------------------- */
.av-figure {
	margin: 32px 0;
}
.av-figure img {
	width: 100%;
	height: auto;
	display: block;
	border-radius: 4px;
}
.av-figure figcaption {
	font-size: 13px;
	color: var(--text-muted);
	font-style: italic;
	padding-top: 8px;
	line-height: 1.45;
}

/* -----------------------------------------------------------------------
   §3.7 — "At a glance" box (hub-promise / TL;DR / bottom-line summary).
   ---------------------------------------------------------------------- */
.av-glance {
	background: var(--surface-alt);
	border-left: 4px solid var(--accent);
	border-radius: 0 4px 4px 0;
	padding: 20px 24px;
	margin: 24px 0 32px;
}
.av-glance__label,
.av-glance strong:first-child {
	display: block;
	font-size: 12px;
	color: var(--accent);
	text-transform: uppercase;
	letter-spacing: 0.08em;
	margin-bottom: 6px;
	font-weight: 700;
}
.av-glance p {
	margin: 0;
	font-size: 15px;
	line-height: 1.55;
	color: var(--text-primary);
}
.av-glance p + p { margin-top: 8px; }

/* -----------------------------------------------------------------------
   §3.8 — Pull-quote (article emphasis).
   ---------------------------------------------------------------------- */
.av-pullquote {
	border-left: 4px solid var(--accent);
	padding-left: 24px;
	margin: 32px 0;
	font-style: italic;
	font-size: 20px;
	line-height: 1.5;
	color: var(--text-primary);
	background: transparent;
}
.av-pullquote cite {
	display: block;
	margin-top: 12px;
	font-size: 13px;
	color: var(--text-muted);
	font-style: normal;
}

/* -----------------------------------------------------------------------
   §3.9 — Verdict card (comparison pages).
   Two-column 50/50 desktop, stacked mobile. Reuses card visual language.
   ---------------------------------------------------------------------- */
.av-verdict {
	background: var(--surface-alt);
	border-radius: 4px;
	padding: 32px;
	margin: 32px 0;
}
.av-verdict__label {
	display: block;
	font-size: 12px;
	color: var(--accent);
	text-transform: uppercase;
	letter-spacing: 0.08em;
	font-weight: 700;
	margin: 0 0 16px;
}
.av-verdict__cols {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 32px;
}
@media (max-width: 640px) {
	.av-verdict { padding: 24px 20px; }
	.av-verdict__cols { grid-template-columns: 1fr; gap: 24px; }
}
.av-verdict__col > .av-figure,
.av-verdict__col > img,
.av-verdict__col > .av-img-slot {
	aspect-ratio: 4 / 3;
	margin: 0 0 16px;
	max-height: 200px;
	overflow: hidden;
	border-radius: 4px;
}
.av-verdict__col > img { object-fit: cover; width: 100%; }
.av-verdict__col h3 {
	font-size: 18px;
	font-weight: 700;
	margin: 0 0 8px;
	color: var(--text-primary);
}
.av-verdict__col ul {
	margin: 0;
	padding-left: 20px;
	font-size: 15px;
	line-height: 1.6;
	color: var(--text-primary);
}

/* -----------------------------------------------------------------------
   §2.1 — Hub hero band + audience pills.
   Two-column desktop (text / image), stacked mobile.
   NOTE: this is a SECOND hero style dedicated to hub-page opening,
   distinct from the homepage .av-hero (which is the FIX-1 static hero).
   ---------------------------------------------------------------------- */
.av-hub-hero {
	background: var(--surface);
	padding: 32px 0 24px;
	margin: 0 0 8px;
}
.av-hub-hero__inner {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 40px;
	align-items: center;
}
@media (max-width: 900px) {
	.av-hub-hero__inner { grid-template-columns: 1fr; gap: 24px; }
}
.av-hub-hero__eyebrow {
	display: block;
	font-size: 12px;
	color: var(--accent);
	text-transform: uppercase;
	letter-spacing: 0.10em;
	font-weight: 700;
	margin: 0 0 12px;
}
.av-hub-hero__title {
	font-size: 44px;
	line-height: 1.1;
	margin: 0 0 16px;
	color: var(--text-primary);
}
@media (max-width: 640px) {
	.av-hub-hero__title { font-size: 30px; }
}
.av-hub-hero__promise {
	font-size: 19px;
	line-height: 1.5;
	color: var(--text-muted);
	margin: 0 0 24px;
}
.av-hub-hero__image {
	aspect-ratio: 16 / 9;
	border-radius: 4px;
	overflow: hidden;
	background: var(--surface-alt);
}
.av-hub-hero__image img,
.av-hub-hero__image .av-img-slot {
	width: 100%;
	height: 100%;
	object-fit: cover;
	display: block;
}

/* F1 (hub-rollout ux review 2026-08-13): on Bird Health specifically,
   hide the hero image slot at <640px so the YMYL disclaimer clears
   the iPhone-SE fold (~667px). J3 requires the disclaimer above the
   fold on the highest-risk hub; the reviewer allowed either reorder
   or hide, and hide is cleaner here because the disclaimer sits
   OUTSIDE .av-hub-hero__inner (siblings of .av-hub-hero, not children
   of the same flex/grid container) — reordering would require HTML
   restructure. When a real Bird Health hero image lands in the media
   library, review this rule: once the slot is a real photograph
   rather than a placeholder, the argument for hiding weakens and
   the fold budget may be re-won by tighter hero text instead.
   Scoped via aria-labelledby="bh-hero-title" so other hubs are
   unaffected. */
@media (max-width: 640px) {
	.av-hub-hero[aria-labelledby="bh-hero-title"] .av-hub-hero__image {
		display: none;
	}
}
/* Canonical-top-anatomy 2026-08-13: at 768 the hub-hero stacks (image
   below text per the base @media (max-width:900px) rule), which on Bird
   Health specifically pushes the YMYL disclaimer past the fold on a
   ~900px tablet viewport. J3 requires the disclaimer above the fold at
   ≥768. Simplest fix that keeps the desktop hero intact: extend the
   image-hide to the stacked-tablet range too. Bird Health-only, scoped
   by aria-labelledby. Trade-off noted — Bird Health has no hero image
   at 640-899; the other three hubs keep theirs. Revisit when a
   dedicated Bird Health tablet hero crop lands. */
@media (min-width: 641px) and (max-width: 899px) {
	.av-hub-hero[aria-labelledby="bh-hero-title"] .av-hub-hero__image {
		display: none;
	}
	.av-hub-hero[aria-labelledby="bh-hero-title"] .av-hub-hero__inner {
		grid-template-columns: 1fr;
	}
}

/* Audience pills — jump-to-section anchor buttons under the hero H1. */
.av-audience-pills {
	list-style: none;
	padding: 0;
	margin: 0;
	display: flex;
	flex-wrap: wrap;
	gap: 10px;
}
.av-audience-pills a {
	display: inline-block;
	font-size: 14px;
	font-weight: 600;
	color: var(--link);
	background: var(--surface);
	border: 1px solid var(--link);
	border-radius: 999px;
	padding: 6px 16px;
	text-decoration: none;
	line-height: 1.3;
	transition: background 0.15s ease, color 0.15s ease;
}
.av-audience-pills a:hover,
.av-audience-pills a:focus {
	background: var(--link);
	color: #fff;
	text-decoration: none;
}

/* -----------------------------------------------------------------------
   §3.10 — (already implemented above as .av-table-scroll)
   ---------------------------------------------------------------------- */

/* -----------------------------------------------------------------------
   Image slot placeholder — subtle branded gradient + camera glyph.
   Used by [av_img slot="..."] when the resolver can't find a matching
   media-library file. Should read as "image coming" not "broken image"
   — quiet, on-brand, not loud red. Swaps to real <img> automatically
   when a file with the specced filename lands in the media library.
   ---------------------------------------------------------------------- */
.av-img-slot {
	position: relative;
	width: 100%;
	aspect-ratio: 16 / 9;
	background:
		linear-gradient(135deg, var(--surface-alt) 0%, var(--surface-tint) 50%, var(--surface-alt) 100%);
	border: 1px dashed var(--border-soft);
	border-radius: 4px;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	gap: 10px;
	color: var(--text-muted);
	overflow: hidden;
	min-height: 120px;
}
/* Brand-default fallback per §4.5 (W1/W2 fix 2026-08-12): bird glyph
   sourced from our own icon system (no color emoji cross-browser risk).
   64px in a --text-muted context — reads as a designer's placeholder,
   not a broken page. The camera+slug debug affordance moved to an HTML
   comment inside the shortcode output for developer inspection. */
.av-img-slot::before {
	content: "";
	display: inline-block;
	width: 64px;
	height: 64px;
	background-color: currentColor;
	opacity: 0.5;
	-webkit-mask: no-repeat center / contain;
	mask: no-repeat center / contain;
	/* bird glyph — same source as .icon-bird for consistency (updated
	   2026-08-17 hold-fix C1: both point at the new hand-authored
	   perched-songbird silhouette). */
	-webkit-mask-image: url("data:image/svg+xml;utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='black'%3E%3Cpath d='M 4 15 A 7 5 0 0 1 18 15 A 7 5 0 0 1 4 15 Z M 14 9 A 3 3 0 0 1 20 9 A 3 3 0 0 1 14 9 Z M 20 7 L 24 9 L 20 11 Z M 5 11 L 0 14 L 5 17 Z'/%3E%3C/svg%3E");
	mask-image: url("data:image/svg+xml;utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='black'%3E%3Cpath d='M 4 15 A 7 5 0 0 1 18 15 A 7 5 0 0 1 4 15 Z M 14 9 A 3 3 0 0 1 20 9 A 3 3 0 0 1 14 9 Z M 20 7 L 24 9 L 20 11 Z M 5 11 L 0 14 L 5 17 Z'/%3E%3C/svg%3E");
}
/* Slot slug lives in an HTML comment inside the shortcode output.
   Kept in the CSS in case a legacy shortcode caller still emits the
   __name span — it renders 0-height / no visual weight. */
.av-img-slot__name {
	display: none;
}
.av-img-slot__caption {
	font-size: 14px;
	font-style: italic;
	color: var(--text-muted);
	line-height: 1.3;
	text-align: center;
	max-width: 90%;
}
/* Aspect-ratio variants applied by the shortcode. */
.av-img-slot--21x9 { aspect-ratio: 21 / 9; min-height: 140px; }
.av-img-slot--4x3  { aspect-ratio: 4 / 3; }
.av-img-slot--1x1  { aspect-ratio: 1 / 1; }
.av-img-slot--20x13 { aspect-ratio: 20 / 13; }

/* -----------------------------------------------------------------------
   Retrofitted-section housekeeping: the hub outro gets a top rule per
   §2.1 exit-paragraph rule.
   ---------------------------------------------------------------------- */
.av-hub-outro {
	border-top: 2px solid var(--border-soft);
	padding-top: 32px;
	margin-top: 48px;
}

/* ==========================================================================
   Utility: hide theme demo copy that still leaks through when the
   footer_top_content option is empty. Belt-and-suspenders for FIX-4.
   ========================================================================== */
.thb_widget_subscribe { display: none !important; }

/* ==========================================================================
   Icon system — inline SVG masks, no external font (2026-08-13).
   Rationale: the parent theme's fontello set only carries share glyphs
   (facebook, twitter, etc). CONTENT-LAYOUT-SYSTEM §3.4/§5.3 asks for
   editorial icons (leaf, heart, users, medkit, home, phone, search…)
   that the parent set does not include. Rather than pull a second
   webfont onto every hub page, we mask a tiny inline SVG per glyph
   with `background-color: currentColor` so each icon takes the
   ambient color of its container — coral --accent on .av-glance,
   --link blue on .av-hub-toc__icon, white on .av-section-band--photo.
   `1em` sizing means the container's font-size decides pixel size:
   40px on TOC cards (§3.4), 56px on icon-band (§3.2), 40px on the
   pending-link-card thumb, and inline size wherever else.

   Belt-and-suspenders: the parent theme's `[class*="icon-"]::before`
   rule fires for our custom class names too (setting font-family:
   fontello with no matching glyph). We nuke the ::before below so
   the empty pseudo-element doesn't affect layout.
   ========================================================================== */
.icon-alert, .icon-basket, .icon-bird, .icon-chick, .icon-clock, .icon-compass, .icon-eye, .icon-feather, .icon-flag, .icon-heart, .icon-home, .icon-leaf, .icon-location, .icon-medkit, .icon-phone, .icon-search, .icon-stethoscope, .icon-users {
    display: inline-block;
    width: 1em; height: 1em;
    line-height: 1;
    vertical-align: middle;
    background-color: currentColor;
    -webkit-mask: no-repeat center / contain;
    mask: no-repeat center / contain;
}
.icon-alert::before, .icon-basket::before, .icon-bird::before, .icon-chick::before, .icon-clock::before, .icon-compass::before, .icon-eye::before, .icon-feather::before, .icon-flag::before, .icon-heart::before, .icon-home::before, .icon-leaf::before, .icon-location::before, .icon-medkit::before, .icon-phone::before, .icon-search::before, .icon-stethoscope::before, .icon-users::before { content: none !important; }

.icon-alert  { -webkit-mask-image: url("data:image/svg+xml;utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='black'%3E%3Cpath d='M12 2L1 21h22L12 2zm1 15h-2v-2h2v2zm0-4h-2V9h2v4z'/%3E%3C/svg%3E"); mask-image: url("data:image/svg+xml;utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='black'%3E%3Cpath d='M12 2L1 21h22L12 2zm1 15h-2v-2h2v2zm0-4h-2V9h2v4z'/%3E%3C/svg%3E"); }
.icon-basket  { -webkit-mask-image: url("data:image/svg+xml;utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='black'%3E%3Cpath d='M17.21 9l-4.38-6.56c-.19-.28-.51-.42-.83-.42s-.64.14-.83.43L6.79 9H2c-.55 0-1 .45-1 1 0 .09.01.18.04.27l2.54 9.27c.23.84 1 1.46 1.92 1.46h13c.92 0 1.69-.62 1.93-1.46l2.54-9.27L23 10c0-.55-.45-1-1-1h-4.79zM9 9l3-4.4L15 9H9zm3 8c-1.1 0-2-.9-2-2s.9-2 2-2 2 .9 2 2-.9 2-2 2z'/%3E%3C/svg%3E"); mask-image: url("data:image/svg+xml;utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='black'%3E%3Cpath d='M17.21 9l-4.38-6.56c-.19-.28-.51-.42-.83-.42s-.64.14-.83.43L6.79 9H2c-.55 0-1 .45-1 1 0 .09.01.18.04.27l2.54 9.27c.23.84 1 1.46 1.92 1.46h13c.92 0 1.69-.62 1.93-1.46l2.54-9.27L23 10c0-.55-.45-1-1-1h-4.79zM9 9l3-4.4L15 9H9zm3 8c-1.1 0-2-.9-2-2s.9-2 2-2 2 .9 2 2-.9 2-2 2z'/%3E%3C/svg%3E"); }
/* .icon-bird — hand-authored perched-songbird silhouette (2026-08-17 hold-fix
   C1: previous shipped path was the Twitter 2012-2023 logo, trademark risk).
   Composition: body ellipse cx=11 cy=15 rx=7 ry=5, head circle cx=17 cy=9 r=3,
   beak triangle (20,7)→(24,9)→(20,11), tail wedge (5,11)→(0,14)→(5,17). Four
   subpaths merged by default nonzero fill-rule into one silhouette. Reads as
   a chubby perched bird facing right; distinct from ANY known brand mark. */
.icon-bird  { -webkit-mask-image: url("data:image/svg+xml;utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='black'%3E%3Cpath d='M 4 15 A 7 5 0 0 1 18 15 A 7 5 0 0 1 4 15 Z M 14 9 A 3 3 0 0 1 20 9 A 3 3 0 0 1 14 9 Z M 20 7 L 24 9 L 20 11 Z M 5 11 L 0 14 L 5 17 Z'/%3E%3C/svg%3E"); mask-image: url("data:image/svg+xml;utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='black'%3E%3Cpath d='M 4 15 A 7 5 0 0 1 18 15 A 7 5 0 0 1 4 15 Z M 14 9 A 3 3 0 0 1 20 9 A 3 3 0 0 1 14 9 Z M 20 7 L 24 9 L 20 11 Z M 5 11 L 0 14 L 5 17 Z'/%3E%3C/svg%3E"); }
.icon-chick  { -webkit-mask-image: url("data:image/svg+xml;utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='black'%3E%3Cpath d='M13 3c-3.87 0-7 3.13-7 7v1H5c-1.66 0-3 1.34-3 3s1.34 3 3 3h1c0 1.66 1.34 3 3 3s3-1.34 3-3v-2h2v2c0 1.66 1.34 3 3 3s3-1.34 3-3v-5c0-4.42-3.58-8-8-8zm3 7c-.55 0-1-.45-1-1s.45-1 1-1 1 .45 1 1-.45 1-1 1z'/%3E%3C/svg%3E"); mask-image: url("data:image/svg+xml;utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='black'%3E%3Cpath d='M13 3c-3.87 0-7 3.13-7 7v1H5c-1.66 0-3 1.34-3 3s1.34 3 3 3h1c0 1.66 1.34 3 3 3s3-1.34 3-3v-2h2v2c0 1.66 1.34 3 3 3s3-1.34 3-3v-5c0-4.42-3.58-8-8-8zm3 7c-.55 0-1-.45-1-1s.45-1 1-1 1 .45 1 1-.45 1-1 1z'/%3E%3C/svg%3E"); }
.icon-clock  { -webkit-mask-image: url("data:image/svg+xml;utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='black'%3E%3Cpath d='M12 2C6.48 2 2 6.48 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2zm4.24 14.24L11 13V7h1.5v5.25l4.5 2.67-.76 1.32z'/%3E%3C/svg%3E"); mask-image: url("data:image/svg+xml;utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='black'%3E%3Cpath d='M12 2C6.48 2 2 6.48 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2zm4.24 14.24L11 13V7h1.5v5.25l4.5 2.67-.76 1.32z'/%3E%3C/svg%3E"); }
.icon-compass  { -webkit-mask-image: url("data:image/svg+xml;utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='black'%3E%3Cpath d='M12 2C6.48 2 2 6.48 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2zm2.5 12.5L6 18l3.5-8.5L18 6l-3.5 8.5z'/%3E%3C/svg%3E"); mask-image: url("data:image/svg+xml;utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='black'%3E%3Cpath d='M12 2C6.48 2 2 6.48 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2zm2.5 12.5L6 18l3.5-8.5L18 6l-3.5 8.5z'/%3E%3C/svg%3E"); }
.icon-eye  { -webkit-mask-image: url("data:image/svg+xml;utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='black'%3E%3Cpath d='M12 4.5C7 4.5 2.73 7.61 1 12c1.73 4.39 6 7.5 11 7.5s9.27-3.11 11-7.5c-1.73-4.39-6-7.5-11-7.5zM12 17c-2.76 0-5-2.24-5-5s2.24-5 5-5 5 2.24 5 5-2.24 5-5 5zm0-8c-1.66 0-3 1.34-3 3s1.34 3 3 3 3-1.34 3-3-1.34-3-3-3z'/%3E%3C/svg%3E"); mask-image: url("data:image/svg+xml;utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='black'%3E%3Cpath d='M12 4.5C7 4.5 2.73 7.61 1 12c1.73 4.39 6 7.5 11 7.5s9.27-3.11 11-7.5c-1.73-4.39-6-7.5-11-7.5zM12 17c-2.76 0-5-2.24-5-5s2.24-5 5-5 5 2.24 5 5-2.24 5-5 5zm0-8c-1.66 0-3 1.34-3 3s1.34 3 3 3 3-1.34 3-3-1.34-3-3-3z'/%3E%3C/svg%3E"); }
.icon-feather  { -webkit-mask-image: url("data:image/svg+xml;utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='black'%3E%3Cpath d='M20.24 12.24a6 6 0 00-8.49-8.49L5 10.5V19h8.5l8.24-8.24a5.99 5.99 0 00-1.5-1.5zM6.99 17l-1.99-2 6.85-6.85 1.99 1.99L6.99 17z'/%3E%3C/svg%3E"); mask-image: url("data:image/svg+xml;utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='black'%3E%3Cpath d='M20.24 12.24a6 6 0 00-8.49-8.49L5 10.5V19h8.5l8.24-8.24a5.99 5.99 0 00-1.5-1.5zM6.99 17l-1.99-2 6.85-6.85 1.99 1.99L6.99 17z'/%3E%3C/svg%3E"); }
.icon-flag  { -webkit-mask-image: url("data:image/svg+xml;utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='black'%3E%3Cpath d='M14.4 6L14 4H5v17h2v-7h5.6l.4 2h7V6z'/%3E%3C/svg%3E"); mask-image: url("data:image/svg+xml;utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='black'%3E%3Cpath d='M14.4 6L14 4H5v17h2v-7h5.6l.4 2h7V6z'/%3E%3C/svg%3E"); }
.icon-heart  { -webkit-mask-image: url("data:image/svg+xml;utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='black'%3E%3Cpath d='M12 21.35l-1.45-1.32C5.4 15.36 2 12.28 2 8.5 2 5.42 4.42 3 7.5 3c1.74 0 3.41.81 4.5 2.09C13.09 3.81 14.76 3 16.5 3 19.58 3 22 5.42 22 8.5c0 3.78-3.4 6.86-8.55 11.54L12 21.35z'/%3E%3C/svg%3E"); mask-image: url("data:image/svg+xml;utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='black'%3E%3Cpath d='M12 21.35l-1.45-1.32C5.4 15.36 2 12.28 2 8.5 2 5.42 4.42 3 7.5 3c1.74 0 3.41.81 4.5 2.09C13.09 3.81 14.76 3 16.5 3 19.58 3 22 5.42 22 8.5c0 3.78-3.4 6.86-8.55 11.54L12 21.35z'/%3E%3C/svg%3E"); }
.icon-home  { -webkit-mask-image: url("data:image/svg+xml;utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='black'%3E%3Cpath d='M12 3L2 12h3v8h6v-6h2v6h6v-8h3L12 3z'/%3E%3C/svg%3E"); mask-image: url("data:image/svg+xml;utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='black'%3E%3Cpath d='M12 3L2 12h3v8h6v-6h2v6h6v-8h3L12 3z'/%3E%3C/svg%3E"); }
.icon-leaf  { -webkit-mask-image: url("data:image/svg+xml;utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='black'%3E%3Cpath d='M17 8C8 10 5.9 16.17 3.82 21.34l1.89.66.95-2.3c.48.17.98.3 1.5.3 4.42 0 8.83-3.53 10.83-7.71C15 12.85 13 13 12 13c-2.5 0-4.5-1.5-6-4 3-1 6-1 8-1 3 0 5 1 5 1s-.13-1.03-2-4z'/%3E%3C/svg%3E"); mask-image: url("data:image/svg+xml;utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='black'%3E%3Cpath d='M17 8C8 10 5.9 16.17 3.82 21.34l1.89.66.95-2.3c.48.17.98.3 1.5.3 4.42 0 8.83-3.53 10.83-7.71C15 12.85 13 13 12 13c-2.5 0-4.5-1.5-6-4 3-1 6-1 8-1 3 0 5 1 5 1s-.13-1.03-2-4z'/%3E%3C/svg%3E"); }
.icon-location  { -webkit-mask-image: url("data:image/svg+xml;utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='black'%3E%3Cpath d='M12 2C8.13 2 5 5.13 5 9c0 5.25 7 13 7 13s7-7.75 7-13c0-3.87-3.13-7-7-7zm0 9.5a2.5 2.5 0 010-5 2.5 2.5 0 010 5z'/%3E%3C/svg%3E"); mask-image: url("data:image/svg+xml;utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='black'%3E%3Cpath d='M12 2C8.13 2 5 5.13 5 9c0 5.25 7 13 7 13s7-7.75 7-13c0-3.87-3.13-7-7-7zm0 9.5a2.5 2.5 0 010-5 2.5 2.5 0 010 5z'/%3E%3C/svg%3E"); }
.icon-medkit  { -webkit-mask-image: url("data:image/svg+xml;utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='black'%3E%3Cpath d='M19 8h-4V4c0-.55-.45-1-1-1h-4c-.55 0-1 .45-1 1v4H5c-.55 0-1 .45-1 1v10c0 .55.45 1 1 1h14c.55 0 1-.45 1-1V9c0-.55-.45-1-1-1zm-4 8h-2v2h-2v-2H9v-2h2v-2h2v2h2v2zM11 8V5h2v3h-2z'/%3E%3C/svg%3E"); mask-image: url("data:image/svg+xml;utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='black'%3E%3Cpath d='M19 8h-4V4c0-.55-.45-1-1-1h-4c-.55 0-1 .45-1 1v4H5c-.55 0-1 .45-1 1v10c0 .55.45 1 1 1h14c.55 0 1-.45 1-1V9c0-.55-.45-1-1-1zm-4 8h-2v2h-2v-2H9v-2h2v-2h2v2h2v2zM11 8V5h2v3h-2z'/%3E%3C/svg%3E"); }
.icon-phone  { -webkit-mask-image: url("data:image/svg+xml;utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='black'%3E%3Cpath d='M6.62 10.79c1.44 2.83 3.76 5.14 6.59 6.59l2.2-2.2c.27-.27.67-.36 1.02-.24 1.12.37 2.33.57 3.57.57.55 0 1 .45 1 1V20c0 .55-.45 1-1 1-9.39 0-17-7.61-17-17 0-.55.45-1 1-1h3.5c.55 0 1 .45 1 1 0 1.25.2 2.45.57 3.57.11.35.03.74-.25 1.02l-2.2 2.2z'/%3E%3C/svg%3E"); mask-image: url("data:image/svg+xml;utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='black'%3E%3Cpath d='M6.62 10.79c1.44 2.83 3.76 5.14 6.59 6.59l2.2-2.2c.27-.27.67-.36 1.02-.24 1.12.37 2.33.57 3.57.57.55 0 1 .45 1 1V20c0 .55-.45 1-1 1-9.39 0-17-7.61-17-17 0-.55.45-1 1-1h3.5c.55 0 1 .45 1 1 0 1.25.2 2.45.57 3.57.11.35.03.74-.25 1.02l-2.2 2.2z'/%3E%3C/svg%3E"); }
.icon-search  { -webkit-mask-image: url("data:image/svg+xml;utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='black'%3E%3Cpath d='M15.5 14h-.79l-.28-.27C15.41 12.59 16 11.11 16 9.5 16 5.91 13.09 3 9.5 3S3 5.91 3 9.5 5.91 16 9.5 16c1.61 0 3.09-.59 4.23-1.57l.27.28v.79l5 4.99L20.49 19l-4.99-5zm-6 0C7.01 14 5 11.99 5 9.5S7.01 5 9.5 5 14 7.01 14 9.5 11.99 14 9.5 14z'/%3E%3C/svg%3E"); mask-image: url("data:image/svg+xml;utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='black'%3E%3Cpath d='M15.5 14h-.79l-.28-.27C15.41 12.59 16 11.11 16 9.5 16 5.91 13.09 3 9.5 3S3 5.91 3 9.5 5.91 16 9.5 16c1.61 0 3.09-.59 4.23-1.57l.27.28v.79l5 4.99L20.49 19l-4.99-5zm-6 0C7.01 14 5 11.99 5 9.5S7.01 5 9.5 5 14 7.01 14 9.5 11.99 14 9.5 14z'/%3E%3C/svg%3E"); }
.icon-stethoscope  { -webkit-mask-image: url("data:image/svg+xml;utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='black'%3E%3Cpath d='M19 8c-1.65 0-3 1.35-3 3 0 1.31.86 2.42 2.04 2.83-.09 1.61-1 3.68-3.54 3.68-2.28 0-3.51-1.55-3.99-3.02C13.85 13.85 15 12.06 15 10V4h-1V2h-3v2h1v6c0 1.66-1.34 3-3 3s-3-1.34-3-3V4h1V2H4v2h1v6c0 3 2.24 4.94 4.99 5 .45 3.72 3.16 6 6.51 6C20.36 21 22 17.83 22 14.75v-.92c1.16-.41 2-1.5 2-2.83 0-1.65-1.35-3-3-3zm0 4c-.55 0-1-.45-1-1s.45-1 1-1 1 .45 1 1-.45 1-1 1z'/%3E%3C/svg%3E"); mask-image: url("data:image/svg+xml;utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='black'%3E%3Cpath d='M19 8c-1.65 0-3 1.35-3 3 0 1.31.86 2.42 2.04 2.83-.09 1.61-1 3.68-3.54 3.68-2.28 0-3.51-1.55-3.99-3.02C13.85 13.85 15 12.06 15 10V4h-1V2h-3v2h1v6c0 1.66-1.34 3-3 3s-3-1.34-3-3V4h1V2H4v2h1v6c0 3 2.24 4.94 4.99 5 .45 3.72 3.16 6 6.51 6C20.36 21 22 17.83 22 14.75v-.92c1.16-.41 2-1.5 2-2.83 0-1.65-1.35-3-3-3zm0 4c-.55 0-1-.45-1-1s.45-1 1-1 1 .45 1 1-.45 1-1 1z'/%3E%3C/svg%3E"); }
.icon-users  { -webkit-mask-image: url("data:image/svg+xml;utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='black'%3E%3Cpath d='M16 11c1.66 0 2.99-1.34 2.99-3S17.66 5 16 5c-1.66 0-3 1.34-3 3s1.34 3 3 3zm-8 0c1.66 0 2.99-1.34 2.99-3S9.66 5 8 5C6.34 5 5 6.34 5 8s1.34 3 3 3zm0 2c-2.33 0-7 1.17-7 3.5V19h14v-2.5c0-2.33-4.67-3.5-7-3.5zm8 0c-.29 0-.62.02-.97.05 1.16.84 1.97 1.97 1.97 3.45V19h6v-2.5c0-2.33-4.67-3.5-7-3.5z'/%3E%3C/svg%3E"); mask-image: url("data:image/svg+xml;utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='black'%3E%3Cpath d='M16 11c1.66 0 2.99-1.34 2.99-3S17.66 5 16 5c-1.66 0-3 1.34-3 3s1.34 3 3 3zm-8 0c1.66 0 2.99-1.34 2.99-3S9.66 5 8 5C6.34 5 5 6.34 5 8s1.34 3 3 3zm0 2c-2.33 0-7 1.17-7 3.5V19h14v-2.5c0-2.33-4.67-3.5-7-3.5zm8 0c-.29 0-.62.02-.97.05 1.16.84 1.97 1.97 1.97 3.45V19h6v-2.5c0-2.33-4.67-3.5-7-3.5z'/%3E%3C/svg%3E"); }

/* ==========================================================================
   Content Layout System — Phase 2 additions (article + comparison patterns)
   Ships with layout-phase-2 retrofit of 997, 998, 999, 800, 207, 617, 709,
   704. Extends the Phase-1 components; no new tokens.
   ========================================================================== */

/* Category eyebrow above dimension H2s on the comparison pattern
   (CONTENT-LAYOUT-SYSTEM.md §2.3). Also usable above any article H2 where
   an editorial "kicker" earns its place. Small caps, accent color, sits
   above a heavy top rule that visually chunks the following section. */
.av-eyebrow {
	font-size: 12px;
	font-weight: 700;
	line-height: 1.2;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	color: var(--accent);
	margin: 48px 0 4px;
	padding-top: 24px;
	border-top: 2px solid var(--border-soft);
}
.av-eyebrow + h2 {
	margin-top: 4px;
}

/* Article featured-image figure variant — a slightly wider crop hint for
   hero images that ride the article top slot. Base `.av-figure` styles
   handle everything else. */
.av-figure--hero {
	margin: 24px 0 32px;
}
.av-figure--hero .av-img-slot {
	border-radius: 4px;
}

/* Square-aspect figure variant used inside `.av-process-grid` (About page,
   3-step review process). Base `.av-figure` handles the shell; the aspect
   is enforced by the img-slot fallback tile via `.av-img-slot--1x1`. */
.av-figure--square {
	margin: 0;
}
.av-figure--square figcaption {
	text-align: center;
	font-style: normal;
	font-size: 14px;
	color: var(--text-primary);
}

/* 3-column illustration grid — About page process illustrations, and any
   other "three-step" content that ships an illustrated grid. Stacks 1
   column on ≤640px per the mobile discipline. */
.av-process-grid {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 24px;
	margin: 24px 0 32px;
}
@media (max-width: 640px) {
	.av-process-grid { grid-template-columns: 1fr; }
}

/* ==========================================================================
   Canonical page-top anatomy (owner ruling 2026-08-13 + designer memo
   Option C — reviews/page-top-anatomy-options.md).

   Two components ship here:
     1. `.av-byline--hero` — compact single-line byline strip. Rendered by
        the [av_byline variant="hero"] shortcode branch, injected by the
        `avianvets_canonical_top_anatomy` the_content filter on articles
        997, 999, 800 (top of content, attached under theme <h1>) and 998
        (after the .av-verdict card, before the .av-jumplist).
     2. `.av-hub__attrib` — small institutional attribution line rendered
        inside the .av-glance block on hubs 959-962. Replaces the personal
        byline that used to float above the hero.

   Plus two spacing tighteners:
     3. `.av-hub-hero` gets margin-top:0 to sit close to the site header
        (previously separated by ~250px of empty non-VC-page padding).
     4. `.page-title` on the four retrofitted article pages gets a tighter
        bottom margin so the hero-byline strip reads as attached to the
        H1, not floating below it.
   ========================================================================== */

/* 1. Compact single-line hero-byline strip. */
.av-byline--hero {
	display: flex;
	align-items: center;
	gap: 12px;
	margin: 0 0 24px;
	padding: 10px 0 12px;
	border-top: 1px solid var(--border-soft);
	border-bottom: 1px solid var(--border-soft);
	color: var(--text-muted);
	font-size: 14px;
	line-height: 1.4;
}
.av-byline--hero .av-byline__photo {
	width: 32px;
	height: 32px;
	border-radius: 50%;
	flex: 0 0 32px;
	margin: 0;
	object-fit: cover;
	background: var(--page);
	/* Kill the parent theme's the_content <img> transform (drop-shadow /
	   border-radius overrides). */
	box-shadow: none !important;
	border: 0 !important;
	display: inline-block !important;
}
.av-byline--hero .av-byline__strip {
	display: inline-flex;
	flex-wrap: wrap;
	align-items: baseline;
	gap: 0;
	color: inherit;
	line-height: 1.5;
}
.av-byline--hero .av-byline__name {
	color: var(--text-primary);
	font-weight: 600;
	text-decoration: none;
	border-bottom: 0;
}
.av-byline--hero .av-byline__name:hover,
.av-byline--hero .av-byline__name:focus {
	color: var(--link);
	text-decoration: underline;
}
.av-byline--hero .av-byline__sep {
	color: var(--text-muted);
	opacity: 0.55;
	padding: 0 4px;
	user-select: none;
}
.av-byline--hero .av-byline__meta {
	color: var(--text-muted);
	font-weight: 400;
}
/* Mobile: keep single-line where it fits, wrap gracefully when it doesn't. */
@media (max-width: 480px) {
	.av-byline--hero { font-size: 13px; padding: 8px 0 10px; margin-bottom: 16px; }
	.av-byline--hero .av-byline__photo { width: 28px; height: 28px; flex-basis: 28px; }
}

/* 2. Institutional attribution line for hubs (inside .av-glance). */
.av-hub__attrib {
	margin: 16px 0 0;
	padding-top: 12px;
	border-top: 1px solid var(--border-soft);
	font-size: 13px;
	line-height: 1.4;
	color: var(--text-muted);
	text-align: right;
}
.av-hub__attrib-label {
	font-weight: 600;
	color: var(--text-primary);
}
@media (max-width: 640px) {
	.av-hub__attrib { text-align: left; font-size: 12px; }
}

/* 3. Hub-hero top-gap tightener. Parent theme's page.php wraps content in
   .non-VC-page > .row > .small-12 columns, which inherits ~24-40px of
   Foundation column padding. Combined with .av-hub-hero's own 32px top
   padding this stacked to ~250px of dead zone at the top on 1440. Zero
   the section margin and let .av-hub-hero's internal padding carry all
   the breathing room, then tighten the parent shell's top padding on
   pages where display_title is off. */
.non-VC-page > .row > .small-12.columns > .no-vc > .av-hub-hero:first-child,
.non-VC-page > .row > .small-12.columns > .no-vc > .av-policy-hero:first-child,
.no-vc > .av-hub-hero:first-child,
.no-vc > .av-policy-hero:first-child {
	margin-top: 0;
}
.av-hub-hero:first-child,
.av-policy-hero:first-child {
	margin-top: 0;
	padding-top: 24px;
}
/* Kill the theme's default page-title chrome vertical padding when the
   H1 is suppressed (hubs + policy templates). page.php still emits the
   wrapping columns. Target only pages where we know display_title=off
   (hubs 959-962, policy pages 801/802/208, About 207). Post-wave fix
   D4 (2026-08-17) extended this from hubs-only to include policy pages,
   which shared the ~200px top-vacuum before the fix. */
body.page-id-959 .non-VC-page,
body.page-id-960 .non-VC-page,
body.page-id-961 .non-VC-page,
body.page-id-962 .non-VC-page,
body.page-id-801 .non-VC-page,
body.page-id-802 .non-VC-page,
body.page-id-208 .non-VC-page,
body.page-id-207 .non-VC-page,
body.page-id-800 .non-VC-page {
	padding-top: 8px;
}
body.page-id-959 .non-VC-page > .row,
body.page-id-960 .non-VC-page > .row,
body.page-id-961 .non-VC-page > .row,
body.page-id-962 .non-VC-page > .row,
body.page-id-801 .non-VC-page > .row,
body.page-id-802 .non-VC-page > .row,
body.page-id-208 .non-VC-page > .row,
body.page-id-207 .non-VC-page > .row,
body.page-id-800 .non-VC-page > .row {
	padding-top: 0;
	margin-top: 0;
}
/* Page 800's hero band uses the .av-service-hero class family (not
   .av-policy-hero / .av-hub-hero). Zero its first-child top margin
   too so it doesn't inherit the parent theme's Foundation column
   padding. */
.non-VC-page > .row > .small-12.columns > .no-vc > .av-service-hero:first-child,
.no-vc > .av-service-hero:first-child,
.av-service-hero:first-child {
	margin-top: 0;
	padding-top: 24px;
}

/* 4. Article page-title bottom-tightener. On 997/998/999/800 the theme
   emits <div class="page-title"><h1>...</h1></div> then the_content
   directly. The hero-byline strip is the first element of the_content
   post-filter; the page-title's default bottom margin created a gap
   between the H1 and the strip. Pull them together so the strip reads
   as the H1's own dressing. */
body.page-id-997 .page-title,
body.page-id-998 .page-title,
body.page-id-999 .page-title,
body.page-id-800 .page-title,
body.page-id-207 .page-title {
	margin-bottom: 12px;
	padding-bottom: 0;
}
body.page-id-997 .page-title h1,
body.page-id-998 .page-title h1,
body.page-id-999 .page-title h1,
body.page-id-800 .page-title h1,
body.page-id-207 .page-title h1 {
	margin-bottom: 0;
}
/* Byline hero-strip: when it's the FIRST child of .no-vc / .entry-content,
   remove its top margin so it butts cleanly against the H1 chrome. */
.no-vc > .av-byline--hero:first-child,
.entry-content > .av-byline--hero:first-child {
	margin-top: 0;
}
/* ==========================================================================
   POLISH WAVE — CONTENT-LAYOUT-SYSTEM.md §§2.4–2.8 (2026-08-13)
   Appended to child theme via style.css to keep single-file enqueue simple.
   New token: --footer-muted (WCAG AA rescue on --surface-dark)
   Existing tokens: --surface-dark (already in :root), --accent, --link,
   --border-soft, --surface-alt, --surface, --text-primary, --text-muted.
   ========================================================================== */
:root {
	--footer-muted: #8a9199;   /* AA-compliant muted body text on --surface-dark */
}

/* ==========================================================================
   §2.4 SERVICE PAGE TEMPLATE
   ========================================================================== */

/* Service hero band (§2.4) — replaces .av-byline on service pages */
.av-service-hero,
.av-policy-hero,
.av-contact-hero {
	background: var(--surface-alt);
	padding: 32px;
	margin: 0 0 48px;
	border-radius: 4px;
	display: grid;
	grid-template-columns: 2fr 1fr;
	gap: 40px;
	align-items: start;
}
.av-service-hero__eyebrow,
.av-policy-hero__eyebrow,
.av-contact-hero__eyebrow {
	font-size: 12px;
	font-weight: 700;
	color: var(--accent);
	text-transform: uppercase;
	letter-spacing: 0.08em;
	margin: 0 0 12px;
}
.av-service-hero__title,
.av-policy-hero__title,
.av-contact-hero__title {
	margin: 0 0 16px;
	font-size: 40px;
	line-height: 1.1;
	font-weight: 700;
}
.av-service-hero__promise,
.av-policy-hero__promise,
.av-contact-hero__promise {
	font-size: 18px;
	line-height: 1.5;
	color: var(--text-muted);
	margin: 0 0 20px;
}
.av-service-hero__attrib,
.av-policy-hero__attrib {
	font-size: 13px;
	color: var(--text-muted);
	margin: 16px 0 0;
	font-style: italic;
}
.av-service-hero__trust {
	display: flex;
	flex-wrap: wrap;
	gap: 8px 12px;
	margin: 20px 0 0;
	padding: 0;
	list-style: none;
}
.av-service-hero__trust li {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	font-size: 12px;
	color: var(--text-muted);
	border: 1px solid var(--border-soft);
	border-radius: 999px;
	padding: 4px 12px;
	background: var(--surface);
}
.av-service-hero__trust .icon-check {
	color: var(--accent);
	font-size: 14px;
}
.av-service-hero__right,
.av-contact-hero__right {
	align-self: stretch;
}
.av-policy-hero__meta {
	display: flex;
	justify-content: flex-end;
	align-items: flex-start;
	padding-top: 12px;
}
.av-policy-hero__updated {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	font-size: 12px;
	color: var(--text-muted);
	border: 1px solid var(--border-soft);
	border-radius: 999px;
	padding: 4px 12px;
	background: var(--surface);
}
.av-policy-hero__updated .icon-clock { font-size: 14px; }

/* Mobile stack (§2.4 / §2.5 / §2.6 all follow same rule) */
@media (max-width: 767px) {
	.av-service-hero,
	.av-policy-hero,
	.av-contact-hero {
		grid-template-columns: 1fr;
		padding: 24px;
		gap: 24px;
	}
	.av-service-hero__title,
	.av-policy-hero__title,
	.av-contact-hero__title {
		font-size: 30px;
	}
	.av-policy-hero__meta { justify-content: flex-start; }
}

/* Provider card (§2.4) */
.av-provider-card {
	border: 1px solid var(--border-soft);
	border-top: 4px solid var(--text-muted);
	border-radius: 4px;
	padding: 32px;
	margin: 0 0 32px;
	background: var(--surface);
	position: relative;
}
.av-provider-card--primary { border-top-color: var(--accent); }
.av-provider-card__tier {
	display: inline-block;
	font-size: 11px;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: 0.08em;
	padding: 4px 10px;
	border-radius: 999px;
	margin: 0 0 12px;
	background: var(--surface-alt);
	color: var(--text-muted);
}
.av-provider-card--primary .av-provider-card__tier {
	background: var(--accent);
	color: #ffffff;
}
.av-provider-card__name {
	margin: 0 0 4px;
	font-size: 24px;
	font-weight: 700;
	color: var(--text-primary);
	line-height: 1.2;
}
.av-provider-card__tag {
	font-size: 16px;
	color: var(--text-muted);
	margin: 0 0 20px;
	line-height: 1.4;
}
.av-provider-card__facts {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	background: var(--surface-alt);
	border-radius: 4px;
	overflow: hidden;
	margin: 0 0 20px;
}
.av-provider-card__fact {
	padding: 12px 16px;
	border-right: 1px solid var(--border-soft);
}
.av-provider-card__fact:last-child { border-right: 0; }
.av-provider-card__fact-label {
	display: block;
	font-size: 11px;
	font-weight: 600;
	text-transform: uppercase;
	letter-spacing: 0.06em;
	color: var(--text-muted);
	margin-bottom: 4px;
}
.av-provider-card__fact-value {
	display: block;
	font-size: 15px;
	font-weight: 600;
	color: var(--text-primary);
	line-height: 1.35;
}
.av-provider-card__what {
	font-size: 15px;
	font-weight: 600;
	margin: 0 0 8px;
}
.av-provider-card__bullets {
	margin: 0 0 16px;
	padding-left: 20px;
}
.av-provider-card__bullets li {
	margin-bottom: 6px;
	font-size: 15px;
	line-height: 1.5;
}
.av-provider-card__caveat {
	font-size: 14px;
	color: var(--text-muted);
	font-style: italic;
	line-height: 1.5;
	margin: 0 0 20px;
	border-left: 3px solid var(--border-soft);
	padding-left: 16px;
}
.av-provider-card__actions {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 24px;
	margin: 24px 0 0;
}
.av-provider-card__cta {
	display: inline-block;
	background: var(--accent);
	color: #ffffff;
	padding: 12px 24px;
	border-radius: 4px;
	text-decoration: none;
	font-weight: 600;
	font-size: 15px;
	min-height: 44px;
	line-height: 20px;
	transition: background 0.15s;
}
.av-provider-card__cta:hover,
.av-provider-card__cta:focus-visible {
	background: #d94040;
	color: #ffffff;
	outline: none;
}
.av-provider-card--comparison .av-provider-card__cta {
	background: var(--link);
}
.av-provider-card--comparison .av-provider-card__cta:hover {
	background: var(--link-hover);
}
.av-provider-card__more {
	color: var(--link);
	font-size: 14px;
	text-decoration: none;
}
.av-provider-card__more:hover { text-decoration: underline; }

@media (max-width: 559px) {
	.av-provider-card { padding: 20px; }
	.av-provider-card__facts { grid-template-columns: 1fr; }
	.av-provider-card__fact { border-right: 0; border-bottom: 1px solid var(--border-soft); }
	.av-provider-card__fact:last-child { border-bottom: 0; }
}

/* Emergency-triage callout (§2.4) — the ONE accent-fill on the site */
.av-emergency {
	background: var(--accent);
	color: #ffffff;
	border-left: 4px solid var(--surface-dark);
	padding: 24px;
	margin: 48px 0;
	border-radius: 0 4px 4px 0;
	display: flex;
	gap: 20px;
	align-items: flex-start;
}
.av-emergency__icon {
	font-size: 32px;
	color: #ffffff;
	flex: 0 0 auto;
}
.av-emergency__body { flex: 1; }
.av-emergency__heading {
	margin: 0 0 8px;
	font-size: 18px;
	font-weight: 700;
	color: #ffffff;
	line-height: 1.3;
}
.av-emergency ul {
	margin: 0 0 12px;
	padding-left: 20px;
}
.av-emergency li {
	font-size: 15px;
	color: rgba(255,255,255,0.95);
	line-height: 1.5;
	margin-bottom: 4px;
}
.av-emergency__outbound {
	font-size: 14px;
	color: rgba(255,255,255,0.9);
	font-style: italic;
	margin: 0;
}

@media (max-width: 559px) {
	.av-emergency { padding: 20px; flex-direction: column; gap: 12px; }
	.av-emergency__icon { font-size: 28px; }
}

/* Checklist (§2.4 "When to skip a televet") */
.av-checklist {
	background: var(--surface-alt);
	border-radius: 4px;
	padding: 32px;
	margin: 32px 0;
}
.av-checklist__eyebrow {
	font-size: 14px;
	font-weight: 700;
	color: var(--text-primary);
	margin: 0 0 20px;
	text-transform: none;
}
.av-checklist__list {
	list-style: none;
	padding: 0;
	margin: 0;
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 12px 24px;
}
.av-checklist__list li {
	display: flex;
	gap: 12px;
	align-items: flex-start;
	font-size: 15px;
	line-height: 1.4;
}
.av-checklist__list .icon-alert {
	color: var(--accent);
	font-size: 20px;
	flex: 0 0 auto;
	margin-top: 2px;
}
@media (max-width: 767px) {
	.av-checklist { padding: 24px; }
	.av-checklist__list { grid-template-columns: 1fr; }
}

/* FAQ accordion (§2.4) — native <details>/<summary> */
.av-faq { margin: 48px 0; }
.av-faq details {
	border-top: 1px solid var(--border-soft);
	padding: 20px 0;
}
.av-faq details:last-of-type {
	border-bottom: 1px solid var(--border-soft);
}
.av-faq summary {
	cursor: pointer;
	font-size: 17px;
	font-weight: 600;
	color: var(--text-primary);
	list-style: none;
	padding-right: 40px;
	position: relative;
	line-height: 1.4;
}
.av-faq summary::-webkit-details-marker { display: none; }
.av-faq summary::after {
	content: "+";
	position: absolute;
	right: 0;
	top: 0;
	font-size: 24px;
	font-weight: 400;
	color: var(--link);
	line-height: 1;
	transition: transform 0.15s ease;
}
.av-faq details[open] summary::after { content: "\2212"; /* minus */ }
.av-faq details[open] summary { color: var(--link); }
.av-faq details > *:not(summary) {
	margin-top: 12px;
	font-size: 15px;
	line-height: 1.6;
}
.av-faq details p { margin: 0 0 10px; }
.av-faq details p:last-child { margin-bottom: 0; }

/* Service page: bump theme H1 chrome to match the hero band */
body.page-id-800 .page-title { padding: 24px 0 8px; }
body.page-id-800 .page-title h1 { display: none; } /* H1 lives in the service hero */

/* ==========================================================================
   §2.5 POLICY PAGE TEMPLATE
   ========================================================================== */

/* Designed TOC (numbered document contents) */
.av-policy-toc {
	background: transparent;
	border-top: 1px solid var(--border-soft);
	border-bottom: 1px solid var(--border-soft);
	padding: 24px 0;
	margin: 32px 0 48px;
}
.av-policy-toc__title {
	font-size: 12px;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: 0.08em;
	color: var(--text-muted);
	margin: 0 0 16px;
}
.av-policy-toc__list {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 8px 32px;
	list-style: none;
	padding: 0;
	margin: 0;
	counter-reset: policy-item;
}
.av-policy-toc__list li {
	counter-increment: policy-item;
	display: flex;
	gap: 12px;
	padding: 6px 0;
}
.av-policy-toc__list li::before {
	content: counter(policy-item, decimal-leading-zero);
	font-variant-numeric: tabular-nums;
	color: var(--text-muted);
	font-size: 13px;
	font-weight: 600;
	flex: 0 0 auto;
	padding-top: 2px;
}
.av-policy-toc__list a {
	color: var(--link);
	font-size: 15px;
	line-height: 1.5;
	text-decoration: none;
}
.av-policy-toc__list a:hover { text-decoration: underline; }
@media (max-width: 767px) {
	.av-policy-toc__list { grid-template-columns: 1fr; }
}

/* Commitment callout (§2.5) — the load-bearing E-E-A-T promises */
.av-commitment {
	background: var(--surface-alt);
	border-left: 6px solid var(--accent);
	padding: 24px;
	border-radius: 0 4px 4px 0;
	margin: 32px 0;
	position: relative;
}
.av-commitment__label {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	font-size: 12px;
	font-weight: 700;
	color: var(--accent);
	text-transform: uppercase;
	letter-spacing: 0.08em;
	margin: 0 0 8px;
}
.av-commitment__label .icon-check { font-size: 16px; }
.av-commitment__body {
	font-size: 17px;
	font-weight: 600;
	color: var(--text-primary);
	line-height: 1.45;
	margin: 0 0 6px;
}
.av-commitment__why {
	font-size: 14px;
	color: var(--text-muted);
	line-height: 1.5;
	margin: 0;
}

/* Reviewer pending tile (§2.5) — calm labeled placeholder */
.av-reviewer-pending {
	border: 1px solid var(--border-soft);
	border-radius: 4px;
	padding: 20px;
	margin: 24px 0;
	background: var(--surface-alt);
	display: flex;
	align-items: center;
	gap: 16px;
}
.av-reviewer-pending .icon-medkit {
	font-size: 40px;
	color: var(--text-muted);
	flex: 0 0 auto;
}
.av-reviewer-pending__body { flex: 1; }
.av-reviewer-pending__pill {
	display: inline-block;
	font-size: 11px;
	font-weight: 600;
	text-transform: uppercase;
	letter-spacing: 0.06em;
	padding: 2px 8px;
	border: 1px solid var(--border-soft);
	border-radius: 999px;
	color: var(--text-muted);
	background: var(--surface);
	margin-bottom: 6px;
}
.av-reviewer-pending__title {
	font-size: 16px;
	font-weight: 600;
	color: var(--text-primary);
	margin: 0 0 4px;
}
.av-reviewer-pending__desc {
	font-size: 14px;
	color: var(--text-muted);
	margin: 0;
	line-height: 1.5;
}

/* 3-step process (§2.5 — reuses on About) */
.av-process-steps {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 32px;
	margin: 48px 0;
}
.av-process-step {
	text-align: center;
	padding: 0 8px;
}
.av-process-step__img {
	width: 120px;
	height: 120px;
	margin: 0 auto 16px;
	display: block;
}
.av-process-step__num {
	font-size: 12px;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: 0.08em;
	color: var(--accent);
	margin-bottom: 4px;
}
.av-process-step__title {
	font-size: 17px;
	font-weight: 600;
	margin: 0 0 8px;
}
.av-process-step__desc {
	font-size: 14px;
	color: var(--text-muted);
	line-height: 1.5;
}
@media (max-width: 767px) {
	.av-process-steps { grid-template-columns: 1fr; gap: 24px; }
}

/* Source-badges grid (§2.5) */
.av-source-grid {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 16px;
	margin: 24px 0 32px;
}
.av-source-tile {
	border: 1px solid var(--border-soft);
	border-radius: 4px;
	padding: 20px;
	background: var(--surface);
	position: relative;
	transition: border-color 0.15s;
}
.av-source-tile:hover { border-color: var(--link); }
.av-source-tile__name {
	font-size: 16px;
	font-weight: 600;
	color: var(--text-primary);
	margin: 0 0 4px;
	display: block;
	line-height: 1.35;
}
.av-source-tile__cat {
	font-size: 12px;
	color: var(--text-muted);
	text-transform: uppercase;
	letter-spacing: 0.06em;
	font-weight: 600;
}
a.av-source-tile { text-decoration: none; color: inherit; display: block; }
@media (max-width: 1023px) { .av-source-grid { grid-template-columns: 1fr 1fr; } }
@media (max-width: 559px)  { .av-source-grid { grid-template-columns: 1fr; } }

/* Policy H1 suppression — hero band carries it */
body.page-id-801 .page-title h1,
body.page-id-802 .page-title h1 { display: none; }
body.page-id-801 .page-title,
body.page-id-802 .page-title { padding: 24px 0 8px; }

/* ==========================================================================
   §2.6 CONTACT PAGE TEMPLATE
   ========================================================================== */

.av-contact-hero__founder {
	display: flex;
	align-items: center;
	gap: 16px;
	padding: 12px;
	background: var(--surface);
	border-radius: 4px;
	border: 1px solid var(--border-soft);
}
.av-contact-hero__founder-photo {
	width: 64px;
	height: 64px;
	border-radius: 50%;
	object-fit: cover;
	flex: 0 0 auto;
}
.av-contact-hero__founder-caption {
	font-size: 14px;
	color: var(--text-muted);
	line-height: 1.4;
	margin: 0;
}

.av-contact-grid {
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: 20px;
	margin: 32px 0 48px;
}
.av-contact-card {
	border: 1px solid var(--border-soft);
	border-radius: 4px;
	padding: 24px;
	background: var(--surface);
	transition: border-color 0.15s, transform 0.15s;
	display: flex;
	flex-direction: column;
	gap: 8px;
}
.av-contact-card:hover,
.av-contact-card:focus-within {
	border-color: var(--link);
	transform: translateY(-2px);
}
.av-contact-card__icon {
	font-size: 40px;
	color: var(--link);
	flex: 0 0 auto;
	margin-bottom: 4px;
}
.av-contact-card__title {
	font-size: 17px;
	font-weight: 600;
	color: var(--text-primary);
	margin: 0;
	line-height: 1.3;
	display: block;
}
.av-contact-card__desc {
	font-size: 14px;
	color: var(--text-muted);
	line-height: 1.45;
	margin: 0 0 8px;
	flex: 1;
	display: block;
}
.av-contact-card__email {
	color: var(--link);
	font-size: 15px;
	font-weight: 500;
	text-decoration: none;
	word-break: break-word;
}
.av-contact-card__email:hover { text-decoration: underline; }

@media (max-width: 1023px) { .av-contact-grid { grid-template-columns: 1fr 1fr; } }
@media (max-width: 559px)  { .av-contact-grid { grid-template-columns: 1fr; } }

body.page-id-208 .page-title h1 { display: none; }
body.page-id-208 .page-title { padding: 24px 0 8px; }

/* Suppress theme's default author avatar block on trust/hub/service pages — Robin card renders via endplate on articles only */
body.page-id-208 .thb-article-author,
body.page-id-800 .thb-article-author,
body.page-id-801 .thb-article-author,
body.page-id-802 .thb-article-author,
body.page-id-959 .thb-article-author,
body.page-id-960 .thb-article-author,
body.page-id-961 .thb-article-author,
body.page-id-962 .thb-article-author { display: none; }

/* ==========================================================================
   §2.7 END-OF-PAGE FINALE — ENDPLATE
   ========================================================================== */

.av-endplate {
	background: var(--surface-alt);
	border-top: 4px solid var(--border-soft);
	padding: 48px 24px 56px;
	margin: 64px 0 0 0;   /* NO bottom margin — sits flush against footer */
	width: 100vw;
	position: relative;
	left: 50%;
	right: 50%;
	margin-left: -50vw;
	margin-right: -50vw;
}
.av-endplate__section {
	max-width: 960px;
	margin-left: auto;
	margin-right: auto;
	padding: 0 24px;
}
.av-endplate__eyebrow {
	font-size: 12px;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: 0.08em;
	color: var(--text-muted);
	margin: 0 0 8px;
}
.av-endplate__lead {
	font-size: 18px;
	color: var(--text-primary);
	margin: 0 0 24px;
	line-height: 1.5;
}
.av-endplate__divider {
	border: 0;
	border-top: 1px solid var(--border-soft);
	max-width: 960px;
	margin: 32px auto;
}
.av-endplate__trust {
	font-size: 14px;
	color: var(--text-muted);
	font-style: italic;
	text-align: center;
	margin: 0;
}
.av-endplate__trust a {
	color: var(--link);
	text-decoration: none;
	font-style: normal;
	font-weight: 500;
}
.av-endplate__trust a:hover { text-decoration: underline; }

.av-eop-cards {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 16px;
}
.av-eop-card {
	display: flex;
	align-items: center;
	gap: 16px;
	padding: 20px;
	background: var(--surface);
	border: 1px solid var(--border-soft);
	border-left-width: 4px;
	border-radius: 4px;
	text-decoration: none;
	color: inherit;
	transition: border-color 0.15s, transform 0.15s;
}
.av-eop-card:hover,
.av-eop-card:focus-visible {
	border-color: var(--link);
	transform: translateY(-2px);
	outline: none;
}
.av-eop-card__icon {
	font-size: 40px;
	color: var(--link);
	flex: 0 0 auto;
}
.av-eop-card__body {
	display: flex;
	flex-direction: column;
	gap: 4px;
	flex: 1;
	min-width: 0;
}
.av-eop-card__title {
	font-size: 16px;
	font-weight: 600;
	color: var(--text-primary);
}
.av-eop-card__desc {
	font-size: 13px;
	color: var(--text-muted);
	line-height: 1.4;
}

/* Tier variants */
.av-eop-card--health { border-left-color: var(--accent); }
.av-eop-card--health .av-eop-card__icon { color: var(--accent); }
.av-eop-card--care { border-left-color: var(--link); }
.av-eop-card--care .av-eop-card__icon { color: var(--link); }
.av-eop-card--vet { border-left-color: var(--surface-dark); }
.av-eop-card--vet .av-eop-card__icon { color: var(--surface-dark); }
.av-eop-card--basics { border-left-color: #6a8f6a; }
.av-eop-card--basics .av-eop-card__icon { color: #6a8f6a; }
.av-eop-card--policy { border-left-color: var(--text-muted); }
.av-eop-card--policy .av-eop-card__icon { color: var(--text-muted); }
.av-eop-card--about { border-left-color: var(--link); }
.av-eop-card--about .av-eop-card__icon { color: var(--link); }
.av-eop-card--service { border-left-color: var(--accent); }
.av-eop-card--service .av-eop-card__icon { color: var(--accent); }

/* Author card sits on the tint — soften its container */
.av-endplate .av-author-card {
	background: transparent;
	border: 1px solid var(--border-soft);
	box-shadow: none;
}

@media (max-width: 1023px) {
	.av-eop-cards { grid-template-columns: 1fr 1fr; }
}
@media (max-width: 559px) {
	.av-eop-cards { grid-template-columns: 1fr; }
	.av-endplate { padding: 32px 16px 40px; }
	.av-endplate__lead { font-size: 16px; }
}

/* Zero any inline "About the author" H2/P residue the render filter did not strip
   (defensive; the filter is authoritative) */
.av-endplate + .av-author-card { display: none; }

/* ==========================================================================
   §2.8 FOOTER — 4-section link architecture, dark band, mobile accordion
   ========================================================================== */

/* Neutralize theme's default footer + subfooter chrome so our footer stands alone */
body #footer { display: none; }
body .subfooter { display: none; }

/* Our custom footer sits inside #Wrapper via thb_after_main hook */
.av-footer {
	background: var(--surface-dark);
	color: #e6e6e6;
	padding: 48px 24px 32px;
	width: 100vw;
	position: relative;
	left: 50%;
	right: 50%;
	margin-left: -50vw;
	margin-right: -50vw;
	margin-top: 0;    /* sits flush against endplate above */
}
.av-footer__inner {
	max-width: 1200px;
	margin: 0 auto;
}
.av-footer__logo {
	display: block;
	margin: 0 0 32px;
}
.av-footer__logo img {
	width: 200px;
	max-width: 100%;
	height: auto;
	display: block;
}
.av-footer__columns {
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: 32px;
	margin: 0 0 40px;
}
.av-footer__section-heading {
	font-size: 12px;
	font-weight: 700;
	color: #ffffff;
	text-transform: uppercase;
	letter-spacing: 0.1em;
	margin: 0 0 16px;
	list-style: none;
}
.av-footer__section-heading::-webkit-details-marker { display: none; }
.av-footer__list {
	list-style: none;
	padding: 0;
	margin: 0;
}
.av-footer__list li { margin: 0 0 4px; line-height: 1.7; }
.av-footer__list a {
	color: #e6e6e6;
	font-size: 14px;
	font-weight: 400;
	text-decoration: none;
	line-height: 1.7;
	transition: color 0.15s;
}
.av-footer__list a:hover,
.av-footer__list a:focus-visible {
	color: var(--accent);
	outline: none;
}
.av-footer__list a:focus-visible {
	outline: 2px solid var(--accent);
	outline-offset: 2px;
}

.av-footer__utility-wrap {
	border-top: 1px solid rgba(255,255,255,0.15);
	padding-top: 24px;
	text-align: center;
}
.av-footer__utility {
	font-size: 12px;
	color: var(--footer-muted);
	line-height: 1.5;
	margin: 0;
}

/* Tablet: 2×2 — footer padding aligns to Foundation body-content gutter (~48px) */
@media (max-width: 1023px) {
	.av-footer__columns { grid-template-columns: 1fr 1fr; gap: 32px 32px; }
	.av-footer__logo img { width: 170px; }
	.av-footer { padding: 40px 48px 28px; }
}

/* Mobile: 1-column + native <details> accordion — 20px padding for breathing room over Foundation's 15px content gutter */
@media (max-width: 767px) {
	.av-footer__columns { grid-template-columns: 1fr; gap: 8px; margin-bottom: 32px; }
	.av-footer__logo img { width: 150px; }
	.av-footer { padding: 32px 20px 24px; }

	.av-footer__section {
		border-top: 1px solid rgba(255,255,255,0.15);
		padding: 0;
	}
	.av-footer__section:last-child {
		border-bottom: 1px solid rgba(255,255,255,0.15);
	}
	.av-footer__section-heading {
		cursor: pointer;
		padding: 16px 32px 16px 0;
		margin: 0;
		font-size: 15px;
		position: relative;
	}
	.av-footer__section-heading::after {
		content: "+";
		position: absolute;
		right: 8px;
		top: 50%;
		transform: translateY(-50%);
		font-size: 24px;
		color: var(--footer-muted);
		font-weight: 400;
		line-height: 1;
	}
	.av-footer__section[open] .av-footer__section-heading::after { content: "\2212"; }
	.av-footer__list { padding: 0 0 16px; }
	.av-footer__utility { text-align: left; font-size: 12px; }
}

/* Desktop / tablet: force <details> always open, kill the summary toggle affordance */
@media (min-width: 768px) {
	.av-footer__section .av-footer__list { display: block !important; }
	.av-footer__section-heading { pointer-events: none; }
	.av-footer__section-heading::after { display: none; }
	.av-footer__section[open] > .av-footer__list,
	.av-footer__section .av-footer__list { display: block; }
}

/* Additional icon glyphs added for §2.5 policy pages: check, book, coin, link, users (users already exists) */
.icon-check, .icon-book, .icon-coin, .icon-link {
	display: inline-block;
	width: 1em; height: 1em;
	line-height: 1;
	vertical-align: middle;
	background-color: currentColor;
	-webkit-mask: no-repeat center / contain;
	mask: no-repeat center / contain;
}
.icon-check::before, .icon-book::before, .icon-coin::before, .icon-link::before { content: none !important; }
.icon-check { -webkit-mask-image: url("data:image/svg+xml;utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='black'%3E%3Cpath d='M9 16.17L4.83 12l-1.42 1.41L9 19 21 7l-1.41-1.41z'/%3E%3C/svg%3E"); mask-image: url("data:image/svg+xml;utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='black'%3E%3Cpath d='M9 16.17L4.83 12l-1.42 1.41L9 19 21 7l-1.41-1.41z'/%3E%3C/svg%3E"); }
.icon-book { -webkit-mask-image: url("data:image/svg+xml;utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='black'%3E%3Cpath d='M18 2H6c-1.1 0-2 .9-2 2v16c0 1.1.9 2 2 2h12c1.1 0 2-.9 2-2V4c0-1.1-.9-2-2-2zm0 18H6V4h12v16zM8 6h8v2H8zm0 4h8v2H8zm0 4h5v2H8z'/%3E%3C/svg%3E"); mask-image: url("data:image/svg+xml;utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='black'%3E%3Cpath d='M18 2H6c-1.1 0-2 .9-2 2v16c0 1.1.9 2 2 2h12c1.1 0 2-.9 2-2V4c0-1.1-.9-2-2-2zm0 18H6V4h12v16zM8 6h8v2H8zm0 4h8v2H8zm0 4h5v2H8z'/%3E%3C/svg%3E"); }
.icon-coin { -webkit-mask-image: url("data:image/svg+xml;utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='black'%3E%3Cpath d='M12 1C5.9 1 1 5.9 1 12s4.9 11 11 11 11-4.9 11-11S18.1 1 12 1zm1.5 15.5V18h-3v-1.5c-1.6-.3-3-1.4-3-3H9c0 .8.9 1.5 2 1.5s2-.6 2-1.4c0-.8-.7-1.2-2.3-1.6-1.6-.4-3.7-1-3.7-3.3 0-1.3 1.1-2.4 2.5-2.8V6h3v1.5c1.6.3 2.5 1.3 2.5 2.5h-1.5c0-.7-.6-1.3-1.5-1.3s-1.5.5-1.5 1.3c0 .7.6 1 2.2 1.4 1.7.4 3.8 1.1 3.8 3.5 0 1.4-1 2.4-2.5 2.7z'/%3E%3C/svg%3E"); mask-image: url("data:image/svg+xml;utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='black'%3E%3Cpath d='M12 1C5.9 1 1 5.9 1 12s4.9 11 11 11 11-4.9 11-11S18.1 1 12 1zm1.5 15.5V18h-3v-1.5c-1.6-.3-3-1.4-3-3H9c0 .8.9 1.5 2 1.5s2-.6 2-1.4c0-.8-.7-1.2-2.3-1.6-1.6-.4-3.7-1-3.7-3.3 0-1.3 1.1-2.4 2.5-2.8V6h3v1.5c1.6.3 2.5 1.3 2.5 2.5h-1.5c0-.7-.6-1.3-1.5-1.3s-1.5.5-1.5 1.3c0 .7.6 1 2.2 1.4 1.7.4 3.8 1.1 3.8 3.5 0 1.4-1 2.4-2.5 2.7z'/%3E%3C/svg%3E"); }
.icon-link { -webkit-mask-image: url("data:image/svg+xml;utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='black'%3E%3Cpath d='M3.9 12c0-1.71 1.39-3.1 3.1-3.1h4V7H7a5 5 0 000 10h4v-1.9H7c-1.71 0-3.1-1.39-3.1-3.1zM8 13h8v-2H8v2zm9-6h-4v1.9h4c1.71 0 3.1 1.39 3.1 3.1s-1.39 3.1-3.1 3.1h-4V17h4a5 5 0 000-10z'/%3E%3C/svg%3E"); mask-image: url("data:image/svg+xml;utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='black'%3E%3Cpath d='M3.9 12c0-1.71 1.39-3.1 3.1-3.1h4V7H7a5 5 0 000 10h4v-1.9H7c-1.71 0-3.1-1.39-3.1-3.1zM8 13h8v-2H8v2zm9-6h-4v1.9h4c1.71 0 3.1 1.39 3.1 3.1s-1.39 3.1-3.1 3.1h-4V17h4a5 5 0 000-10z'/%3E%3C/svg%3E"); }

/* End POLISH WAVE */

/* ==========================================================================
   §2.9 CATEGORY ARCHIVE TEMPLATE — CONTENT-LAYOUT-SYSTEM.md — 2026-08-14
   ~200 lines. Zero new fonts, zero new colors, zero new icons — everything
   maps to existing tokens + the tier accent set defined for the §2.7
   endplate destination cards.

   Sibling components: .av-hub-hero (band), .av-link-card (card family).
   The archive template lives in child-theme category.php + archive.php.
   ========================================================================== */

/* Tier accent tokens — same tokens as §2.7 endplate --tier resolution.
   Consumed via [data-tier="…"] on .av-category-row + descendants.
   `basics` = #6a8f6a sage (existing §2.7 hardcode; token candidate
   --basics, not blocking). */
.av-category-row[data-tier="health"] { --tier-accent: var(--accent); }
.av-category-row[data-tier="care"]   { --tier-accent: var(--link); }
.av-category-row[data-tier="basics"] { --tier-accent: #6a8f6a; }
.av-category-row[data-tier="vet"]    { --tier-accent: var(--surface-dark); }

/* Neutralize parent theme's .archive-title styling (belt-and-suspenders
   per §2.9.9). Our child category.php doesn't emit .archive-title, but
   if any surface reintroduces it — future archive type, plugin — force
   inherit so it never lands as 16px Helvetica on a rendered page. */
body.archive .archive-title,
body.archive .archive-title h1 {
	font-size: inherit;
	font-family: inherit;
	font-weight: inherit;
	color: inherit;
	margin: 0;
	padding: 0;
}

/* Kill parent theme's default archive header spacing so the compact band
   attaches to the site header (kills CS1 vertical vacuum). */
body.category .row.av-category-row {
	margin-top: 0;
	padding-top: 0;
}
body.category .non-VC-page > .row:first-of-type { padding-top: 0; }

/* -------- 1. Compact category band (.av-category-band) ------------------ */
.av-category-band {
	background: var(--surface-alt);
	padding: 32px 20px;
	margin: 0 0 24px;
}
.av-category-band__inner {
	max-width: 1200px;
	margin: 0 auto;
	display: flex;
	flex-direction: column;
	gap: 20px;
}
.av-category-band__text { display: flex; flex-direction: column; gap: 6px; }
.av-category-band__breadcrumb ol {
	list-style: none;
	display: flex;
	flex-wrap: wrap;
	gap: 6px;
	padding: 0;
	margin: 0 0 4px;
	font-size: 12px;
	color: var(--text-muted);
}
.av-category-band__breadcrumb a {
	color: var(--text-muted);
	text-decoration: none;
}
.av-category-band__breadcrumb a:hover,
.av-category-band__breadcrumb a:focus { color: var(--link); text-decoration: underline; }
.av-category-band__breadcrumb .av-crumb-sep { color: var(--border-soft); }
.av-category-band__breadcrumb [aria-current="page"] { color: var(--text-primary); font-weight: 500; }

.av-category-band__eyebrow {
	margin: 0;
	font-size: 12px;
	font-weight: 700;
	letter-spacing: 0.10em;
	text-transform: uppercase;
	color: var(--tier-accent);
}
.av-category-band__title {
	margin: 4px 0 8px;
	font-size: 26px;
	font-weight: 700;
	line-height: 1.15;
	color: var(--text-primary);
	/* Site display face — inherits from the .av-hub-hero__title stack, which
	   picks up the parent theme's H1 font-family. This is the "kill the jarring
	   font" fix (§2.9.9): the term title now matches every other retrofit hero. */
	font-family: inherit;
}
.av-category-band__count {
	margin: 0;
	font-size: 14px;
	color: var(--text-muted);
}
.av-category-band__thumb {
	display: none;
	aspect-ratio: 16 / 9;
	background-color: var(--surface-alt);
	background-size: cover;
	background-position: center;
	border-radius: 4px;
	border: 1px solid var(--border-soft);
}
.av-category-band__icon-wrap {
	display: none;
	align-items: center;
	justify-content: center;
	width: 64px;
	height: 64px;
	flex: 0 0 auto;
}
.av-category-band__icon {
	width: 56px;
	height: 56px;
	font-size: 56px;
	line-height: 1;
	color: var(--tier-accent);
}
.av-category-band__icon-wrap { width: 88px; height: 88px; }

/* Standfirst — one-sentence lede pulled from term description (2026-08-17
   category-band upgrade per fullsite-sweep-design.md named issue B). */
.av-category-band__standfirst {
	margin: 12px 0 0;
	font-size: 17px;
	line-height: 1.45;
	font-weight: 400;
	color: var(--text-primary);
	max-width: 640px;
}
/* Meta line — "Curated by AvianVets · Updated {date}" */
.av-category-band__meta {
	margin: 14px 0 0;
	font-size: 13px;
	color: var(--text-muted);
	letter-spacing: 0.01em;
}
.av-category-band__meta-curated { font-weight: 500; color: var(--text-primary); }

@media (min-width: 768px) {
	.av-category-band { padding: 36px 24px; }
	.av-category-band__title { font-size: 32px; }
	.av-category-band__standfirst { font-size: 18px; }
	.av-category-band__icon { width: 72px; height: 72px; font-size: 72px; }
	.av-category-band__icon-wrap { width: 110px; height: 110px; }
	.av-category-band--icon .av-category-band__inner { flex-direction: row; align-items: center; gap: 24px; }
	.av-category-band--icon .av-category-band__text { flex: 1 1 auto; }
	.av-category-band--icon .av-category-band__icon-wrap { display: inline-flex; order: -1; }
}
@media (min-width: 1024px) {
	.av-category-band__title { font-size: 36px; }
	.av-category-band--photo .av-category-band__inner {
		flex-direction: row;
		align-items: center;
		gap: 40px;
	}
	.av-category-band--photo .av-category-band__text { flex: 1 1 auto; }
	.av-category-band--photo .av-category-band__thumb {
		display: block;
		flex: 0 0 320px;
		width: 320px;
	}
}

/* -------- 2. Intro block (.av-category-intro) --------------------------- */
.av-category-intro {
	background: var(--surface);
	margin: 0 0 32px;
}
.av-category-intro__inner {
	max-width: 1200px;
	margin: 0 auto;
	padding: 8px 20px 0;
	display: flex;
	flex-direction: column;
	gap: 24px;
}
.av-category-intro__prose { min-width: 0; }
.av-category-intro__prose p {
	font-size: 15px;
	line-height: 1.65;
	color: var(--text-primary);
	margin: 0 0 12px;
}
.av-category-intro__prose p:last-child { margin-bottom: 0; }
.av-category-intro__prose p em {
	color: var(--text-muted);
}
.av-category-intro__prose a { color: var(--link); }
.av-category-intro__prose a:hover { color: var(--link-hover); }

.av-category-intro__start {
	background: var(--surface-alt);
	border-left: 4px solid var(--tier-accent);
	border-radius: 4px;
	padding: 20px;
	display: flex;
	flex-direction: column;
	gap: 6px;
	align-self: start;
}
.av-category-intro__start-eyebrow {
	margin: 0;
	font-size: 11px;
	font-weight: 700;
	letter-spacing: 0.10em;
	text-transform: uppercase;
	color: var(--tier-accent);
}
.av-category-intro__start-title {
	margin: 0;
	font-size: 17px;
	font-weight: 600;
	color: var(--text-primary);
	line-height: 1.35;
}
.av-category-intro__start-copy {
	margin: 0;
	font-size: 14px;
	color: var(--text-muted);
	line-height: 1.5;
}
.av-category-intro__start-link {
	margin-top: 4px;
	font-size: 14px;
	font-weight: 600;
	color: var(--link);
	text-decoration: none;
}
.av-category-intro__start-link:hover { text-decoration: underline; }

@media (min-width: 1024px) {
	.av-category-intro__inner {
		display: grid;
		grid-template-columns: 2fr 1fr;
		gap: 40px;
	}
}

/* Empty variant — promote start-here to full-width tier-accent block. */
.av-category-intro--empty .av-category-intro__inner { grid-template-columns: 1fr; }
.av-category-intro--empty .av-category-intro__start {
	padding: 28px;
	border-left-width: 6px;
	font-size: 16px;
}

/* -------- Sub-term chips (.av-category-subterms) ------------------------ */
.av-category-subterms {
	margin-top: 20px;
	padding-top: 16px;
	border-top: 1px solid var(--border-soft);
}
.av-category-subterms__label {
	margin: 0 0 10px;
	font-size: 11px;
	font-weight: 700;
	letter-spacing: 0.10em;
	text-transform: uppercase;
	color: var(--text-muted);
}
.av-category-subterms__chips {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
}
.av-category-subterms__chip {
	display: inline-flex;
	align-items: center;
	min-height: 40px;
	padding: 6px 14px;
	background: var(--surface);
	border: 1px solid var(--tier-accent);
	border-radius: 4px;
	font-size: 13px;
	font-weight: 600;
	color: var(--tier-accent);
	text-decoration: none;
	line-height: 1.3;
}
.av-category-subterms__chip:hover,
.av-category-subterms__chip:focus {
	background: var(--tier-accent);
	color: #fff;
	text-decoration: none;
}

/* -------- 3. Grid + card (.av-category-grid / .av-category-card) -------- */
.av-category-grid-wrap { max-width: 1200px; margin: 0 auto; padding: 0 20px; }
.av-category-grid-wrap--compact { max-width: 760px; }

.av-category-grid {
	display: grid;
	grid-template-columns: 1fr;
	gap: 20px;
	margin: 24px 0 32px;
}
@media (min-width: 640px) {
	.av-category-grid { grid-template-columns: repeat(2, 1fr); gap: 24px; }
}
@media (min-width: 1024px) {
	.av-category-grid { grid-template-columns: repeat(3, 1fr); gap: 32px; }
}
.av-category-grid-wrap--compact .av-category-grid {
	grid-template-columns: 1fr;
	max-width: 720px;
	margin: 24px auto 32px;
}

.av-category-card {
	background: var(--surface);
	border: 1px solid var(--border-soft);
	border-radius: 4px;
	overflow: hidden;
	display: flex;
	flex-direction: column;
	transition: border-color 0.15s ease;
}
.av-category-card:hover,
.av-category-card:focus-within { border-color: var(--link); }
.av-category-card__thumb-link { display: block; }
.av-category-card__thumb {
	display: block;
	width: 100%;
	aspect-ratio: 16 / 9;
	object-fit: cover;
	background: var(--surface-alt);
}
.av-category-card__thumb--fallback {
	position: relative;
	background: linear-gradient(135deg, var(--surface-alt) 0%, var(--surface-tint) 100%);
}
.av-category-card__thumb-icon {
	position: absolute;
	inset: 0;
	margin: auto;
	width: 40%;
	max-width: 96px;
	aspect-ratio: 1 / 1;
	color: var(--tier-accent);
	opacity: 0.35;
}
.av-category-card__body {
	padding: 16px 20px 20px;
	display: flex;
	flex-direction: column;
	gap: 8px;
}
.av-category-card__badge {
	display: inline-block;
	align-self: flex-start;
	padding: 2px 10px;
	font-size: 11px;
	font-weight: 700;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	color: var(--tier-accent);
	border: 1px solid var(--tier-accent);
	border-radius: 999px;
	line-height: 1.4;
	text-decoration: none;
}
.av-category-card__badge[data-tier="health"] { color: var(--accent);        border-color: var(--accent); }
.av-category-card__badge[data-tier="care"]   { color: var(--link);          border-color: var(--link); }
.av-category-card__badge[data-tier="basics"] { color: #6a8f6a;              border-color: #6a8f6a; }
.av-category-card__badge[data-tier="vet"]    { color: var(--surface-dark);  border-color: var(--surface-dark); }
.av-category-card__badge:hover,
.av-category-card__badge:focus { text-decoration: underline; }
.av-category-card__title {
	margin: 0;
	font-size: 18px;
	font-weight: 600;
	line-height: 1.35;
	color: var(--text-primary);
}
.av-category-card__title a { color: inherit; text-decoration: none; }
.av-category-card__title a:hover,
.av-category-card__title a:focus { color: var(--link); }
.av-category-card__excerpt {
	margin: 0;
	font-size: 14px;
	line-height: 1.5;
	color: var(--text-muted);
	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
	overflow: hidden;
}

/* Compact 1-2-post variant: cards render at reduced density with a
   larger thumb-title relationship since there's no grid-side neighbor. */
.av-category-grid-wrap--compact .av-category-card__title { font-size: 20px; }

/* -------- 4. Pagination (.av-pagination) -------------------------------- */
.av-pagination {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
	justify-content: center;
	margin: 24px 0 40px;
}
.av-pagination a,
.av-pagination span {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 40px;
	height: 40px;
	padding: 0 12px;
	border: 1px solid var(--border-soft);
	border-radius: 4px;
	background: var(--surface);
	font-size: 15px;
	font-weight: 500;
	color: var(--text-primary);
	text-decoration: none;
	line-height: 1;
}
.av-pagination a:hover,
.av-pagination a:focus { border-color: var(--link); color: var(--link); }
.av-pagination .current {
	background: var(--tier-accent);
	border-color: var(--tier-accent);
	color: #fff;
	font-weight: 600;
}
.av-pagination .prev,
.av-pagination .next { min-width: 56px; }

/* -------- Sitewide: parent theme sidebar-off on category URLs ---------- */
/* The retrofitted template uses a small-12 single-column layout at every
   breakpoint. The parent's small-12 medium-8 columns wrapper isn't in play
   for us (we don't invoke inc/templates/archive/style1.php on category
   URLs), but this rule protects against any plugin re-injecting the theme
   archive sidebar into our layout. */
body.category .sidebar { display: none; }

/* End §2.9 CATEGORY ARCHIVE TEMPLATE */

/* ---- Header/hero seam (owner ruling 2026-08-14; reviews/header-hero-boundary-options.md Option B) ---- */
.thb-main-header,
.header.fixed.thb-main-header,
header.header.style6.thb-main-header {
	border-bottom: 1px solid var(--border-soft, #e6e6e6);
}
.header.header-mobile,
.header.header-mobile-style1 {
	border-bottom: 1px solid var(--border-soft, #e6e6e6);
}
.header.fixed.is-scrolled,
.header.thb-fixed-shadow-style1.is-scrolled {
	border-bottom-color: transparent;
}