/*
 * Landing Pad Asia: homepage.
 * Server-rendered homepage (blocks/home-content). Reuses the shared components:
 * .lpa-home-hero / .lpa-cta-row / .lpa-btn-secondary (system.css), the .lpa-verdict
 * callout and .lpa-btn / .lpa-section / .lpa-eyebrow / .lpa-lede (product.css),
 * .lpa-cards / .lpa-card / .lpa-trust (market.css), and the .lpa-cmp-* snapshot
 * cards (comparison.css) so the availability snapshot cannot look or read
 * differently from the comparison spine. Colours are theme.json tokens
 * (primary oklch(0.5 0.15 251.66), primary-dark #004A8B, ink oklch(0.25 0.04 245.54), muted oklch(0.52 0.03 245.11),
 * hairline oklch(0.94 0.01 248.12), surface-blue #f0f6fc); spacing uses the 4/8/12/16/24/32/48/64
 * scale and the 8/12 radius tokens.
 */

.lpa-home { padding-bottom: 64px; }

/* ---- Section 2: flagship prominence (the .lpa-verdict blue callout) ---- */

.lpa-home-flagship { margin-top: 24px; }
.lpa-home-flagship .lpa-eyebrow { margin-bottom: 4px; }
.lpa-home-flagship h2 { margin: 0 0 8px; color: #004A8B; }
.lpa-home-flagship h2 a { color: #004A8B; }
.lpa-home-flagship h2 a:hover { color: oklch(0.5 0.15 251.66); }

.lpa-home-flagship-sub {
	color: oklch(0.25 0.04 245.54);
	margin: 0 0 16px;
	max-width: 65ch;
}

.lpa-home-verdict-flag {
	font-size: 0.9rem;
	color: #004A8B;
	margin: 0 0 12px;
}

.lpa-home-verdict-list {
	list-style: none;
	margin: 0 0 16px;
	padding: 0;
	display: grid;
	gap: 8px;
}
.lpa-home-verdict-list li { color: oklch(0.25 0.04 245.54); }
.lpa-home-verdict-seg { color: oklch(0.52 0.03 245.11); font-weight: 600; }
.lpa-home-verdict-pick { color: oklch(0.25 0.04 245.54); font-weight: 700; }

.lpa-home-flagship-cta { margin: 8px 0 0; }

/* ---- Section 4: method link ---- */

.lpa-home-method-link { margin: 16px 0 0; }

/* ---- Section 6: recently updated ---- */

.lpa-home-recent-list {
	list-style: none;
	margin: 24px 0 0;
	padding: 0;
	border-top: 1px solid oklch(0.94 0.01 248.12);
}
.lpa-home-recent-list li {
	display: flex;
	flex-wrap: wrap;
	align-items: baseline;
	justify-content: space-between;
	gap: 8px 16px;
	padding: 12px 0;
	border-bottom: 1px solid oklch(0.94 0.01 248.12);
}
.lpa-home-recent-list li a { font-weight: 600; }
.lpa-home-recent-meta {
	color: oklch(0.52 0.03 245.11);
	font-size: 0.9rem;
}

/* ---- Section 7: not available yet ---- */

.lpa-home-watch-list {
	list-style: none;
	margin: 24px 0 0;
	padding: 0;
	display: grid;
	gap: 16px;
	grid-template-columns: 1fr;
}
.lpa-home-watch-list li {
	border: 1px solid oklch(0.94 0.01 248.12);
	border-radius: 8px;
	padding: 24px;
	background: #f7fafc;
}
.lpa-home-watch-name { display: block; font-weight: 700; color: oklch(0.25 0.04 245.54); margin-bottom: 4px; }
.lpa-home-watch-name a { color: oklch(0.25 0.04 245.54); }
.lpa-home-watch-name a:hover { color: oklch(0.5 0.15 251.66); }
.lpa-home-watch-note { color: oklch(0.52 0.03 245.11); font-size: 0.95rem; }

/* ---- Section 8: glossary ---- */

.lpa-home-glossary-list {
	list-style: none;
	margin: 24px 0 0;
	padding: 0;
	display: flex;
	flex-wrap: wrap;
	gap: 8px 12px;
}
.lpa-home-glossary-list li a {
	display: inline-flex;
	align-items: center;
	min-height: 36px;
	padding: 4px 14px;
	border: 1px solid oklch(0.94 0.01 248.12);
	border-radius: 999px;
	color: oklch(0.5 0.15 251.66);
	text-decoration: none;
	font-size: 0.95rem;
}
.lpa-home-glossary-list li a:hover {
	background: #f0f6fc;
	border-color: oklch(0.5 0.15 251.66);
}
.lpa-home-glossary-link { margin: 16px 0 0; }

/* ---- Responsive: two-up snapshot / watch cards on wider viewports ---- */
@media (min-width: 640px) {
	.lpa-home-watch-list { grid-template-columns: repeat(2, 1fr); }
}
