/**
 * Page-scoped styles for /baby-and-toddler/ only (enqueued when rnf_baby_toddler).
 *
 * Adds the GROUP level to the standalone card page (GROUP -> SECTION -> CARD). This is
 * additive and page-scoped: it does not modify portal-category.css or any shared style,
 * and it loads only on /baby-and-toddler/. All rules are scoped under .rnf-guide and
 * only read tokens (--serif, --ink) already defined there by portal-category.css.
 */

.rnf-guide .rnf-group {
	margin: 0;
}

/* Group header sits above its sections and reads as the top level (larger serif than
   the 25px serif section titles in .swap__intro h2). */
.rnf-guide .rnf-group__title {
	font-family: var(--serif);
	font-weight: 600;
	font-size: 32px;
	line-height: 1.15;
	color: var(--ink);
	margin: 40px 0 20px;
}

/* First group hugs the page head instead of adding a large gap above it. */
.rnf-guide .rnf-group:first-of-type .rnf-group__title {
	margin-top: 8px;
}

/* Inline text link (added 2026-07-12). Applied ONLY to the single Feeding intro anchor on this page
   (a.rnf-inline-link). Scoped under .rnf-guide so it beats the shared .rnf-guide a base rule
   (color: inherit; text-decoration: none) on specificity (0,2,1 > 0,1,1), WITHOUT restyling the
   global anchor. Change the link color in ONE place via --rnf-inline-link-color below. */
.rnf-guide a.rnf-inline-link {
	--rnf-inline-link-color: #1D6FB8; /* clearly-clickable link blue, distinct from the dark body text; change here */
	color: var(--rnf-inline-link-color);
	text-decoration: underline;
}
.rnf-guide a.rnf-inline-link:hover,
.rnf-guide a.rnf-inline-link:focus-visible {
	filter: brightness(0.85); /* darken the same color on hover/focus; single color source stays the var above */
	text-decoration: underline;
}

/* Section-level safety callout (added 2026-07-12). Renders above the cards for any section that sets
   a 'note' (see the note block in template-baby-and-toddler.php). Page-scoped and additive: it does
   not touch portal-category.css or any shared style, and it reads only the --ink token already
   defined under .rnf-guide. Soft warning tint so life-safety copy reads distinctly above the cards;
   the copy itself is rendered verbatim, the weight below is presentation only. */
.rnf-guide .swap__note {
	border: 1px solid #E4B7B0; /* soft warning border */
	background: #FBF3F1; /* pale warning tint */
	border-radius: 8px;
	padding: 14px 16px;
	margin: 0 0 16px;
}
.rnf-guide .swap__note p {
	margin: 0 0 10px;
	color: var(--ink);
}
.rnf-guide .swap__note p:first-child {
	font-weight: 600; /* the opening line reads as the lead; no copy changed */
}
.rnf-guide .swap__note p:last-child {
	margin-bottom: 0;
}