/* News feature (node 2646:5027) — patterns/news-feature.php, #915.
 * Idioms: cyan-phrase-rule, pill-cta, stretched-link-card.
 * Scoped under the pattern's own section class; a page hook
 * (.infinitus-section--about-news) is for a page that needs to differ, and
 * About does not.
 *
 * The cards, the 3/2/1 grid and its 30px gutter are infinitus/resource-grid
 * and the shared .resource-card (assets/scss/blocks/_resource-card.scss).
 * This file owns the header and two card overrides: the logo, no eyebrow. */

.infinitus-section--news-feature {
	/* Header column, node 2646:5028: 711 wide. A measure, so no token. */
	--news-feature-header-measure: 711px;
	/* Heading → CTA: 30 on the node. No 30 rung; sp-8 (32) is the hair rule. */
	--news-feature-header-gap: var(--wp--preset--spacing--sp-8);
	/* Header → cards: 50 on the node. Intra-section, not subject to the
	   rhythm cut; the rung is sp-12 (48). */
	--news-feature-cards-gap: var(--wp--preset--spacing--sp-12);
	/* Outlet logo box, nodes 2646:5038 / 5051 / 5060: 40 tall, width free. */
	--news-feature-logo-height: 40px;
}

/* The header is a flow group with no `layout` attribute (so blockGap is
   inert, docs/agents/section-patterns.md) — rhythm is the owl below. */
.infinitus-section--news-feature .news-feature__header {
	max-width: var(--news-feature-header-measure);
	margin-block-end: var(--news-feature-cards-gap);
}

.infinitus-section--news-feature .news-feature__header > * {
	margin-block-end: 0;
}

.infinitus-section--news-feature .news-feature__header > * + * {
	margin-block-start: var(--news-feature-header-gap);
}

/* Node 2646:5032: DS Desktop/H2, Inter Light 56/1.1, no tracking. The
   --fs-h2 / --lh-h2 ladder lands there at desktop and steps down. Colour is
   the gray-900 preset on the block. The <mark> is painted by
   assets/css/underline-grow.css. */
.infinitus-section--news-feature .news-feature__heading {
	font-size: var(--fs-h2);
	line-height: var(--lh-h2);
	font-weight: 300;
	letter-spacing: 0;
}

/* Node 2646:5033: DS Button Dark/Primary/LG — 18/1.5, 16×28 padding, 1.5px
   stroke, pill. Geometry is the shared --btn-* tokens so this CTA cannot
   drift from .btn.btn-lg; !important beats the block's own inline
   border-width/padding, the same call built-for-healthcare.css makes. */
.infinitus-section--news-feature .news-feature__actions .wp-block-button__link {
	font-size: var(--fs-body-lg);
	line-height: var(--lh-body-lg);
	border-width: var(--btn-border-width) !important;
	padding: var(--btn-padding-block-lg) var(--btn-padding-inline-lg) !important;
	transition:
		background-color var(--wp--custom--duration--base) var(--wp--custom--easing--out),
		color var(--wp--custom--duration--base) var(--wp--custom--easing--out),
		border-color var(--wp--custom--duration--base) var(--wp--custom--easing--out);
}

/* Hover inverts, active restores with the pressed shadow — .btn-primary's
   states. !important because WP's palette classes carry it. */
.infinitus-section--news-feature .news-feature__actions .wp-block-button__link:hover {
	background-color: var(--wp--preset--color--white) !important;
	color: var(--wp--preset--color--gray-900) !important;
}

.infinitus-section--news-feature .news-feature__actions .wp-block-button__link:active {
	background-color: var(--wp--preset--color--gray-900) !important;
	color: var(--wp--preset--color--white) !important;
	box-shadow: var(--btn-shadow-active);
}

/* THE ONE CARD OVERRIDE. The shared card frames its image as a 16:9
   chamfered, cover-cropped tile, and the Newsroom keeps that tile white
   with the logo contained inside it. This node draws no tile: the outlet's
   wordmark sits straight on the card's N50, 40px tall, left-aligned, its
   width its own (Newsweek 253, Bloomberg 199, Forbes 159 on the node). The
   thumbnails are the CPT's trimmed transparent PNGs, so `contain` at a
   fixed height reproduces that. (0,3,0) beats the component's (0,2,0). */
.infinitus-section--news-feature .resource-card .resource-card__image {
	aspect-ratio: auto;
	height: var(--news-feature-logo-height);
	width: auto;
}

.infinitus-section--news-feature .resource-card .resource-card__image img {
	aspect-ratio: auto;
	border-radius: 0;
	clip-path: none;
	height: 100%;
	width: auto;
	max-width: 100%;
	object-fit: contain;
	object-position: left center;
}

/* NO EYEBROW. The shared card prints its stream label ("PRESS" for this
   post type, patterns/newsroom-grid.php shows it); the node's cards
   (2646:5037 / 5050 / 5059) go logo → headline → excerpt with nothing
   between. Hidden rather than removed from render.php, so the Newsroom
   keeps its label. The title then loses the meta owl gap the label owned. */
.infinitus-section--news-feature .resource-card .resource-card__label {
	display: none;
}

.infinitus-section--news-feature .resource-card .resource-card__meta > .resource-card__title {
	margin-block-start: 0;
}

@media (prefers-reduced-motion: reduce) {
	.infinitus-section--news-feature .news-feature__actions .wp-block-button__link {
		transition: none;
	}
}