/*
 * recommendations.css — component family "ad/recommendations" v1.0.0 (Discovery pass, 2026-08-22).
 *
 * The article-footer CONTINUE/DEEPEN cards (inc/content-index.php's
 * alexdesigns_render_recommendations()). Built on the Wave 0 foundation primitives
 * (.ad-fnd-shell / .ad-fnd-grid, already handling container-query recomposition) — this file
 * adds only the card visual treatment, no layout logic duplicated from foundation-layout.css.
 *
 * Namespacing rule: every selector starts with `.ad-reco`. Zero bare element selectors.
 */

.ad-reco {
	margin-block-start: 3rem;
	padding-block-start: 2rem;
	border-top: var(--ad-line, 1px solid #d7dce3);
}

.ad-reco-card {
	border: var(--ad-line, 1px solid #d7dce3);
	border-radius: 10px;
	padding: 1rem 1.25rem;
	background: var(--wp--preset--color--surface, #fff);
	transition: border-color 180ms ease;
}

.ad-reco-card:hover {
	border-color: var(--wp--preset--color--accent, #2563eb);
}

.ad-reco-card__label {
	display: block;
	font-size: 0.75rem;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: 0.04em;
	color: var(--wp--preset--color--accent, #2563eb);
	margin-bottom: 0.4rem;
}

.ad-reco-card a {
	font-weight: 600;
	text-decoration: none;
	color: inherit;
}

.ad-reco-card a:hover,
.ad-reco-card a:focus-visible {
	text-decoration: underline;
}

/* --- L4-2: homepage Featured Optimization Intelligence module --- */

.ad-home-featured-oi {
	margin-block: 2rem;
}

.ad-home-featured-oi__eyebrow {
	font-size: 0.8rem;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: 0.04em;
	color: var(--wp--preset--color--accent, #2563eb);
	margin-bottom: 0.75rem;
}

.ad-home-featured-oi__placeholder {
	display: block;
	width: 100%;
	height: 100%;
	background: linear-gradient(135deg, var(--wp--preset--color--surface-subtle, #f5f7fa), var(--wp--preset--color--line, #e2e6ea));
}

.ad-home-featured-oi__lead-body h3 {
	margin: 0;
	font-size: 1.5rem;
}

.ad-home-featured-oi__lead-body a {
	color: inherit;
	text-decoration: none;
}

.ad-home-featured-oi__lead-body a:hover,
.ad-home-featured-oi__lead-body a:focus-visible {
	text-decoration: underline;
}