/* Piaffe — editorial & page-template layer (loaded globally). */

/* ---- Accessibility helper ---- */
.screen-reader-text {
	border: 0;
	clip: rect(1px, 1px, 1px, 1px);
	clip-path: inset(50%);
	height: 1px; width: 1px;
	margin: -1px; padding: 0;
	overflow: hidden;
	position: absolute !important;
	word-wrap: normal !important;
}
.screen-reader-text:focus {
	background: var(--color-paper);
	clip: auto; clip-path: none;
	color: var(--color-ink);
	display: block;
	height: auto; width: auto;
	padding: var(--space-3) var(--space-4);
	left: var(--space-4); top: var(--space-4);
	z-index: 100000;
	border-radius: var(--radius);
	box-shadow: var(--shadow-md);
}

/* ---- Page / archive headers ---- */
.page-head { margin-bottom: var(--space-8); }
.page-title { font-size: var(--text-3xl); line-height: var(--leading-tight); margin: 0; }
.page-head .eyebrow { margin-bottom: var(--space-2); }
.archive-desc { margin-top: var(--space-3); color: var(--color-muted); max-width: 60ch; }
.lead { font-size: var(--text-lg); color: var(--color-muted); line-height: var(--leading-relaxed); max-width: 60ch; }
.section--center { text-align: center; }
.section--center .lead,
.section--center .four04-search { margin-inline: auto; }

/* ---- Article grid (Journal / archives) ---- */
.article-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: var(--space-8); }
.article-card { display: flex; flex-direction: column; }
.article-card__media { aspect-ratio: 16 / 10; border-radius: var(--radius); overflow: hidden; background: var(--color-surface-2); border: 1px solid var(--color-line); margin-bottom: var(--space-4); display: block; }
.article-card__media img { width: 100%; height: 100%; object-fit: cover; transition: transform var(--transition-slow); }
.article-card:hover .article-card__media img { transform: scale(1.03); }
.article-card__meta { font-size: var(--text-xs); color: var(--color-faint); text-transform: uppercase; letter-spacing: var(--tracking-caps); margin-bottom: var(--space-2); }
.article-card__title { font-family: var(--font-ui); font-size: var(--text-lg); line-height: var(--leading-snug); margin: 0 0 var(--space-2); }
.article-card__title a { color: var(--color-ink); text-decoration: none; }
.article-card__title a:hover { color: var(--color-accent-strong); }
.article-card__excerpt { color: var(--color-muted); font-size: var(--text-sm); margin: 0 0 var(--space-3); }
.article-card__more { display: inline-flex; align-items: center; gap: var(--space-2); font-size: var(--text-sm); font-weight: 600; color: var(--color-accent-strong); text-decoration: none; margin-top: auto; }
.article-card__more:hover { gap: var(--space-3); }
@media (max-width: 980px) { .article-grid { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 620px) { .article-grid { grid-template-columns: 1fr; } }

/* ---- Single post / page body ---- */
.page-featured { margin: var(--space-6) 0; border-radius: var(--radius); overflow: hidden; }
.page-featured img { width: 100%; height: auto; display: block; }
.single-meta { margin-top: var(--space-3); font-size: var(--text-sm); color: var(--color-faint); text-transform: uppercase; letter-spacing: var(--tracking-caps); }
.single-tags { margin-top: var(--space-8); display: flex; flex-wrap: wrap; gap: var(--space-2); }
.single-tags a { font-size: var(--text-xs); padding: 4px 10px; border: 1px solid var(--color-line); border-radius: 999px; color: var(--color-muted); text-decoration: none; }
.single-tags a:hover { border-color: var(--color-accent); color: var(--color-accent-strong); }

/* ---- Pagination ---- */
.pagination { margin-top: var(--space-10); display: flex; justify-content: center; }
.pagination .nav-links { display: inline-flex; gap: var(--space-2); flex-wrap: wrap; }
.pagination .page-numbers { display: inline-flex; align-items: center; justify-content: center; min-width: 44px; min-height: 44px; padding: 0 var(--space-3); border: 1px solid var(--color-line); border-radius: var(--radius); color: var(--color-ink); text-decoration: none; font-size: var(--text-sm); }
.pagination .page-numbers.current { background: var(--color-ink); color: var(--color-paper); border-color: var(--color-ink); }
.pagination .page-numbers:not(.current):hover { border-color: var(--color-accent); color: var(--color-accent-strong); }

/* ---- Search form ---- */
.piaffe-search { display: flex; gap: var(--space-2); }
.piaffe-search__input { flex: 1; min-height: 48px; padding: 0 var(--space-4); border: 1px solid var(--color-line-strong); border-radius: var(--radius); background: var(--color-paper); color: var(--color-ink); font-family: var(--font-ui); font-size: var(--text-base); }
.piaffe-search__input:focus-visible { outline: 2px solid var(--color-accent); outline-offset: 2px; }
.piaffe-search__submit { min-width: 48px; min-height: 48px; display: inline-flex; align-items: center; justify-content: center; border: none; border-radius: var(--radius); background: var(--color-ink); color: var(--color-paper); cursor: pointer; }
.piaffe-search__submit:hover { background: var(--color-accent-strong); }

/* ---- 404 ---- */
.four04-search { max-width: 460px; margin: var(--space-8) auto; }
.four04-actions { display: flex; gap: var(--space-3); justify-content: center; flex-wrap: wrap; margin-top: var(--space-6); }

/* ---- Empty states ---- */
.no-results { color: var(--color-muted); font-size: var(--text-lg); padding: var(--space-10) 0; }

/* ---- Content CPT singles (breeds/disciplines/conditions/ingredients/compare/guides/collections) ---- */
.cpt-single .page-head .eyebrow a { color: var(--color-accent-strong); text-decoration: none; }
.cpt-single .page-head .eyebrow a:hover { text-decoration: underline; }

/* Callout box (rendered inside .prose) */
.prose .callout { background: var(--color-surface-alt); border-left: 3px solid var(--color-accent); border-radius: var(--radius); padding: var(--space-5) var(--space-6); }
.prose .callout__title { font-family: var(--font-ui); font-weight: 700; color: var(--color-ink); margin: 0 0 var(--space-2); max-width: none; }
.prose .callout > *:last-child { margin-bottom: 0; }
.prose .list-lead { margin-bottom: var(--space-2); }

/* Product feed (inline in prose + bottom "recommended" row) — neutralise .prose inheritance on cards */
.product-feed { margin-block: var(--space-8); }
.product-feed__title { font-family: var(--font-ui); font-size: var(--text-lg); margin: 0 0 var(--space-5); max-width: none; }
.product-feed ul.products { list-style: none; padding-left: 0; }
.product-feed li.product { margin-top: 0; max-width: none; }
.product-feed a { text-decoration: none; }
.product-feed .product-card__title { font-size: var(--text-base); margin-top: 0; max-width: none; }
.product-feed .product-card__title a { color: var(--color-ink); }
.product-feed .product-card__title a:hover { color: var(--color-accent-strong); }
@media (min-width: 781px) { .product-feed ul.products { grid-template-columns: repeat(2, 1fr); } }

/* Related reading */
.related-reading { margin-top: var(--space-12); padding-top: var(--space-8); border-top: 1px solid var(--color-line); }
.related-reading__title { font-family: var(--font-ui); font-size: var(--text-lg); margin-bottom: var(--space-4); }
.related-reading ul { list-style: none; display: grid; gap: var(--space-2); padding: 0; margin: 0; }
.related-reading a { color: var(--color-accent-strong); text-decoration: none; }
.related-reading a:hover { text-decoration: underline; }

/* FAQ section */
.faq-section { margin-top: var(--space-12); }
.faq-section__title { font-size: var(--text-2xl); margin-bottom: var(--space-6); }