/* ─── Collection (intent) pages ─────────────────────────────────────────────
 * Programmatic SEO landing pages (/bunkhouse-travel-trailers/, etc.). The grid
 * reuses .liv-rig-grid + .liv-card and the headers reuse .liv-archive__header /
 * .liv-section__*, so only the prose, FAQ accordion, link cluster, and closing
 * CTA need rules here. Colors map onto the theme palette presets. */

.liv-collection__intro .liv-archive__header {
	margin-bottom: clamp(1.5rem, 4vw, 2.5rem);
}
.liv-collection__empty {
	color: var(--wp--preset--color--ink-200, #cccccc);
}

/* Why-LiV prose */
.liv-collection__prose {
	max-width: 64ch;
	margin-inline: auto;
	display: grid;
	gap: 1.25rem;
}
.liv-collection__prose p {
	margin: 0;
	font-size: 1.125rem;
	line-height: 1.7;
	color: var(--wp--preset--color--ink-200, #cccccc);
}

/* FAQ accordion (native <details>; mirrors the FAQPage schema) */
.liv-collection__faq-list {
	max-width: 60rem;
	margin-inline: auto;
	display: grid;
	gap: 0.75rem;
}
.liv-collection__faq-item {
	overflow: hidden;
	border: 1px solid var(--wp--preset--color--ink-700, #1a1a1a);
	border-radius: 0.5rem;
	background: var(--wp--preset--color--ink-800, #141414);
}
.liv-collection__faq-q {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 1rem;
	padding: 1.1rem 1.4rem;
	cursor: pointer;
	list-style: none;
	font-weight: 600;
	font-size: 1.05rem;
	color: var(--wp--preset--color--paper, #ffffff);
}
.liv-collection__faq-q::-webkit-details-marker { display: none; }
.liv-collection__faq-q::after {
	content: "+";
	flex: none;
	font-size: 1.5rem;
	line-height: 1;
	color: var(--wp--preset--color--leaf-500, #5BA02E);
}
.liv-collection__faq-item[open] .liv-collection__faq-q::after { content: "\2013"; }
.liv-collection__faq-a { padding: 0 1.4rem 1.2rem; }
.liv-collection__faq-a p {
	margin: 0;
	line-height: 1.65;
	color: var(--wp--preset--color--ink-200, #cccccc);
}

/* Internal-link cluster (also reused by the /lineup/ "Shop by" section) */
.liv-collection__link-grid {
	list-style: none;
	margin: 0;
	padding: 0;
	display: grid;
	gap: 0.75rem;
	grid-template-columns: repeat(auto-fill, minmax(min(100%, 18rem), 1fr));
}
.liv-collection__link-grid a {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 1rem;
	padding: 1rem 1.25rem;
	border: 1px solid var(--wp--preset--color--ink-700, #1a1a1a);
	border-radius: 0.5rem;
	background: var(--wp--preset--color--ink-900, #0a0a0a);
	color: var(--wp--preset--color--paper, #ffffff);
	font-weight: 600;
	text-decoration: none;
	transition: border-color var(--liv-transition, 0.2s ease), transform var(--liv-transition, 0.2s ease);
}
.liv-collection__link-grid a:hover,
.liv-collection__link-grid a:focus-visible {
	border-color: var(--wp--preset--color--leaf-500, #5BA02E);
	transform: translateY(-2px);
}
.liv-collection__link-arrow {
	flex: none;
	width: 1.25rem;
	color: var(--wp--preset--color--leaf-500, #5BA02E);
}
.liv-collection__link-arrow svg { display: block; width: 100%; height: auto; }

/* Closing CTA */
.liv-collection__cta-inner {
	max-width: 40rem;
	margin-inline: auto;
	text-align: center;
	display: grid;
	gap: 1rem;
}
.liv-collection__cta-actions {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	gap: 1rem;
	margin-top: 0.5rem;
}