/*
Theme Name: SleepBaby Featherlight
Theme URI: https://sleepbaby.org/
Author: SleepBaby.org
Description: A quiet-night editorial theme for SleepBaby.org with a calm reading system, responsive media, and a seamless handoff to the shared sales presentation.
Version: 1.9.0
Requires at least: 6.2
Tested up to: 7.0
Requires PHP: 7.4
License: GNU General Public License v2 or later
License URI: https://www.gnu.org/licenses/gpl-2.0.html
Text Domain: sleepbaby-featherlight
Tags: one-column, accessibility-ready, blog
*/

/* One self-hosted editorial face keeps articles, pages, the workshop, and
 * checkout typographically identical on iPhone, Android, Windows, and macOS.
 * Controls intentionally use the separate system UI stack below. */
@font-face {
	font-family: "SleepBaby Lora";
	font-style: normal;
	font-display: swap;
	font-weight: 400 700;
	src: url("fonts/sleepbaby-lora-latin-v180.woff2") format("woff2");
}

@font-face {
	font-family: "SleepBaby Lora";
	font-style: italic;
	font-display: swap;
	font-weight: 400 700;
	src: url("fonts/sleepbaby-lora-latin-italic-v180.woff2") format("woff2");
}

:root {
	--sb-ink: #303247;
	--sb-heading: #1b2148;
	--sb-muted: #68687b;
	--sb-line: #e5e0ea;
	--sb-line-strong: #d4cddd;
	--sb-link: #5d4f94;
	--sb-link-hover: #443878;
	--sb-paper: #fffdfb;
	--sb-canvas: #f8f5f8;
	--sb-soft: #f1f3fa;
	--sb-moonlight: #f0ecf8;
	--sb-night: #252c5a;
	--sb-night-deep: #151a40;
	--sb-violet: #7762aa;
	--sb-violet-deep: #594688;
	--sb-violet-soft: #f0ebf8;
	--sb-aqua: #657dab;
	--sb-aqua-soft: #eaf0fa;
	--sb-magenta: #9a486b;
	--sb-magenta-soft: #f8eaf0;
	--sb-rose: #974769;
	--sb-rose-deep: #7f3958;
	--sb-rose-soft: #f7e7ee;
	--sb-powder: #eaf0fa;
	--sb-blush: #f7e8ef;
	--sb-danger: #994354;
	/* Moon-gold belongs to the brand mark; violet remains a separate accent. */
	--sb-gold: #bd8d32;
	--sb-gold-soft: #fbf7ed;
	--sb-lavender: var(--sb-violet);
	--sb-warm: var(--sb-violet-soft);
	--sb-prose: 42.5rem;
	--sb-reading: 860px;
	--sb-shell: 1160px;
	--sb-radius-sm: 8px;
	--sb-radius: 14px;
	--sb-shadow: 0 20px 50px rgba(42, 34, 75, 0.11);
	--sb-shadow-soft: 0 10px 30px rgba(42, 34, 75, 0.07);
	--sb-editorial: "SleepBaby Lora", Georgia, Cambria, "Times New Roman", Times, serif;
	--sb-ui: -apple-system, BlinkMacSystemFont, "Segoe UI", Arial, Helvetica, sans-serif;
}

*,
*::before,
*::after {
	box-sizing: border-box;
}

html {
	-webkit-text-size-adjust: 100%;
	text-size-adjust: 100%;
}

body {
	display: flex;
	min-height: 100vh;
	margin: 0;
	flex-direction: column;
	background: var(--sb-canvas);
	color: var(--sb-ink);
	font-family: var(--sb-editorial);
	font-size: 18.25px;
	line-height: 1.76;
	text-rendering: optimizeLegibility;
}

a {
	color: var(--sb-link);
	text-decoration-line: underline;
	text-decoration-thickness: 0.075em;
	text-underline-offset: 0.16em;
}

a:hover {
	color: var(--sb-link-hover);
}

a:focus-visible,
button:focus-visible,
summary:focus-visible,
input:focus-visible,
textarea:focus-visible,
select:focus-visible {
	outline: 3px solid var(--sb-aqua);
	outline-offset: 3px;
}

img,
svg,
video,
iframe {
	max-width: 100%;
}

img,
svg,
video {
	height: auto;
}

.entry-content iframe {
	display: block;
	max-width: 100%;
	border: 0;
}

.entry-content .wp-block-embed.is-type-video iframe,
.entry-content iframe[src*="youtube.com"],
.entry-content iframe[src*="youtu.be"],
.entry-content iframe[src*="vimeo.com"] {
	width: 100%;
	height: auto;
	aspect-ratio: 16 / 9;
}

figure {
	max-width: 100%;
	margin: 0;
}

button,
input,
textarea,
select {
	max-width: 100%;
	font: inherit;
	font-family: var(--sb-ui);
}

label {
	font-family: var(--sb-ui);
}

input,
textarea,
select {
	border: 1px solid #747c92;
	border-radius: var(--sb-radius-sm);
	background: #ffffff;
	color: var(--sb-ink);
}

input:focus,
textarea:focus,
select:focus {
	border-color: var(--sb-aqua);
	box-shadow: 0 0 0 3px rgba(101, 125, 171, 0.15);
}

input,
select {
	min-height: 46px;
	padding: 8px 12px;
}

textarea {
	width: 100%;
	padding: 11px 12px;
}

button,
input[type="submit"] {
	min-height: 46px;
	padding: 10px 18px;
	border: 1px solid var(--sb-rose-deep);
	border-radius: 12px;
	background: linear-gradient(180deg, #a95879, var(--sb-rose));
	color: #ffffff;
	font-family: var(--sb-ui);
	font-weight: 700;
	cursor: pointer;
	box-shadow: 0 8px 19px rgba(127, 57, 88, 0.18), inset 0 1px rgba(255, 255, 255, 0.24);
}

button:hover,
input[type="submit"]:hover {
	border-color: var(--sb-rose-deep);
	background: var(--sb-rose-deep);
}

.screen-reader-text {
	position: absolute !important;
	width: 1px;
	height: 1px;
	margin: -1px;
	padding: 0;
	overflow: hidden;
	clip: rect(0, 0, 0, 0);
	clip-path: inset(50%);
	border: 0;
	white-space: nowrap;
}

.screen-reader-text:focus {
	z-index: 100000;
	top: 12px;
	left: 12px;
	width: auto;
	height: auto;
	margin: 0;
	padding: 10px 14px;
	overflow: visible;
	clip: auto;
	clip-path: none;
	border-radius: var(--sb-radius-sm);
	background: #ffffff;
	color: var(--sb-night-deep);
	font: 700 16px/1.2 var(--sb-ui);
	white-space: normal;
	box-shadow: var(--sb-shadow);
}

/* A compact, theme-owned masthead. The topic row never inherits an old menu. */
.site-header {
	position: relative;
	z-index: 20;
	border-bottom: 0;
	background: rgba(255, 253, 251, 0.98);
	box-shadow: 0 1px 0 rgba(52, 40, 72, 0.1);
}

.site-header::before {
	position: absolute;
	top: 0;
	right: 0;
	left: 0;
	height: 3px;
	content: "";
	background: linear-gradient(90deg, #c9bce8, #b9cceb 50%, #edbfd0);
}

.site-header__inner {
	width: min(calc(100% - 48px), var(--sb-shell));
	margin-inline: auto;
	padding-block: 13px 11px;
}

.site-header__bar {
	display: flex;
	min-height: 54px;
	align-items: center;
	justify-content: space-between;
	gap: 22px;
}

.site-brand {
	display: inline-flex;
	min-width: 0;
	align-items: center;
	text-decoration: none;
}

.site-logo {
	display: block;
	width: min(224px, 51vw);
	height: auto;
}

.site-title-text {
	color: var(--sb-heading);
	font-size: clamp(2rem, 5vw, 3rem);
	font-weight: 400;
	line-height: 1;
}

.site-header__actions {
	display: flex;
	align-items: center;
	justify-content: flex-end;
	gap: 8px;
	font-family: var(--sb-ui);
}

.site-library-link,
.site-offer-link {
	display: inline-flex;
	min-height: 42px;
	padding: 8px 13px;
	align-items: center;
	justify-content: center;
	border-radius: 13px;
	font-size: 12.5px;
	font-weight: 750;
	letter-spacing: 0.005em;
	line-height: 1.2;
	text-decoration: none;
	white-space: nowrap;
}

.site-library-link {
	border: 1px solid transparent;
	color: var(--sb-heading);
}

.site-library-link:hover,
.site-library-link:focus-visible,
.site-library-link[aria-current="page"] {
	border-color: #ddd4ed;
	background: var(--sb-violet-soft);
	color: var(--sb-violet-deep);
}

.site-offer-link {
	flex: none;
	gap: 0.28em;
	border: 1px solid var(--sb-rose-deep);
	background: var(--sb-rose-soft);
	color: var(--sb-rose-deep);
}

.site-offer-link:hover,
.site-offer-link:focus-visible {
	border-color: var(--sb-rose-deep);
	background: var(--sb-rose-deep);
	color: #ffffff;
}

.topic-navigation {
	border-top: 1px solid rgba(212, 205, 221, 0.58);
	background: #252b58;
	color: #ffffff;
	font-family: var(--sb-ui);
	font-size: 12.5px;
}

.topic-navigation__inner {
	display: flex;
	width: min(calc(100% - 48px), var(--sb-shell));
	min-height: 45px;
	margin-inline: auto;
	align-items: center;
	gap: 22px;
}

.topic-navigation__label {
	flex: none;
	color: #c5c9df;
	font-size: 12px;
	font-weight: 800;
	letter-spacing: 0.13em;
	text-transform: uppercase;
}

.topic-navigation ul {
	display: flex;
	min-width: 0;
	margin: 0;
	padding: 0;
	align-items: center;
	gap: 0 26px;
	list-style: none;
}

.topic-navigation li {
	margin: 0;
	flex: none;
}

.topic-navigation__library {
	display: none;
}

.topic-navigation a {
	position: relative;
	display: inline-flex;
	min-height: 45px;
	padding-block: 8px;
	align-items: center;
	color: #f4f6ff;
	font-weight: 700;
	text-decoration: none;
	white-space: nowrap;
}

.topic-navigation a::after {
	position: absolute;
	right: 0;
	bottom: 0;
	left: 0;
	height: 3px;
	content: "";
	transform: scaleX(0);
	transform-origin: left;
	background: linear-gradient(90deg, #cfbfe9, #efbfd1);
	transition: transform 150ms ease;
}

.topic-navigation a:hover,
.topic-navigation a:focus-visible {
	color: #ffffff;
}

.topic-navigation a:hover::after,
.topic-navigation a:focus-visible::after,
.topic-navigation a[aria-current="page"]::after {
	transform: scaleX(1);
}

/* Editorial shell. */
.site-main {
	width: min(calc(100% - 40px), var(--sb-reading));
	margin-inline: auto;
	padding-block: clamp(42px, 6vw, 68px) clamp(70px, 9vw, 104px);
}

body.single-post .site-main {
	width: min(calc(100% - 40px), 940px);
	padding-block: clamp(34px, 5vw, 58px) clamp(24px, 3vw, 36px);
}

.entry {
	padding-inline: 0;
}

body.single-post .entry {
	padding: clamp(36px, 6vw, 64px) clamp(32px, 6.5vw, 64px) clamp(54px, 7vw, 76px);
	border: 1px solid rgba(203, 210, 226, 0.86);
	border-radius: 18px;
	background: var(--sb-paper);
	box-shadow: var(--sb-shadow-soft);
}

.entry-header {
	position: relative;
	width: min(100%, var(--sb-prose));
	margin: 0 auto clamp(28px, 4vw, 38px);
	padding-top: 20px;
}

.entry-header::before {
	position: absolute;
	top: 0;
	left: 0;
	width: 58px;
	height: 4px;
	content: "";
	border-radius: 999px;
	background: linear-gradient(90deg, var(--sb-violet), var(--sb-aqua));
}

.entry-title,
.view-title {
	margin: 0;
	color: var(--sb-heading);
	font-family: var(--sb-editorial);
	font-size: clamp(2.45rem, 5.8vw, 3.55rem);
	font-weight: 700;
	letter-spacing: -0.032em;
	line-height: 1.04;
	overflow-wrap: break-word;
	text-wrap: balance;
}

.entry-meta {
	display: flex;
	margin: 18px 0 0;
	align-items: center;
	flex-wrap: wrap;
	gap: 4px 10px;
	color: var(--sb-muted);
	font-family: var(--sb-ui);
	font-size: 12.5px;
	font-weight: 650;
	line-height: 1.5;
}

.entry-meta time {
	color: inherit;
}

.entry-meta__separator {
	color: var(--sb-magenta);
}

.entry-media {
	margin-bottom: clamp(40px, 5vw, 56px);
	overflow: hidden;
	border-radius: var(--sb-radius);
	background: var(--sb-soft);
	box-shadow: 0 13px 34px rgba(15, 23, 58, 0.1);
}

.entry-image {
	display: block;
	width: 100%;
	max-height: min(66vh, 620px);
	object-fit: cover;
	object-position: center;
}

.entry-content {
	min-width: 0;
	font-family: var(--sb-editorial) !important;
	overflow-wrap: anywhere;
}

/* Older posts sometimes carry editor/plugin font declarations in their
 * saved HTML. Reading text remains part of the same publication; only true UI
 * controls and code samples are allowed to leave the editorial family. */
.entry-content :is(p, li, dt, dd, blockquote, figcaption, h1, h2, h3, h4, h5, h6, summary),
.entry-content [class*="font-family"] {
	font-family: var(--sb-editorial) !important;
}

.entry-content :is(button, input, textarea, select, label, .wp-element-button),
.entry-content [role="button"] {
	font-family: var(--sb-ui) !important;
}

.entry-content :is(code, pre, kbd, samp) {
	font-family: ui-monospace, SFMono-Regular, Consolas, "Liberation Mono", monospace !important;
}

/* Compatibility shield for page/CDN cache entries created before v1.8. The
 * retired sales promotion is suppressed even if stale markup survives until
 * the required deployment purge finishes. */
html body .sbh2020-ribbon,
html body [data-sbh2020-ribbon],
html body .sbcf-funnel-dock,
html body .sbcf-mobile-world-ribbon,
html body .sbcf-mobile-world-dock,
html body [data-sbcf-funnel-dock] {
	display: none !important;
}

/* Auto ads may choose a responsive width, but may not escape the publication
 * column or collide with surrounding controls. Placement remains Google's. */
ins.adsbygoogle,
.google-auto-placed {
	max-width: 100% !important;
	overflow: hidden;
}

.google-auto-placed {
	clear: both;
	margin-block: clamp(24px, 4vw, 42px);
}

.entry-content > p,
.entry-content > .sbds-article > p {
	font-size: 1.015em;
	line-height: 1.78;
}

.entry-content > :first-child {
	margin-top: 0;
}

.entry-content > :last-child {
	margin-bottom: 0;
}

/* Some long-form articles intentionally wrap the full editorial package in a
 * single container. Keep the same reading measure and rhythm in that shape;
 * otherwise the wrapper causes every paragraph and heading to jump to 820px. */
.entry-content > .sbds-article {
	width: 100%;
	min-width: 0;
}

.entry-content > .sbds-article > :is(
	p,
	ul,
	ol,
	blockquote,
	pre,
	details,
	hr,
	[data-sb-component]
) {
	width: min(100%, var(--sb-prose));
	margin: 0 auto 30px;
}

.entry-content > .sbds-article > :is(h2, h3, h4, h5, h6) {
	width: min(100%, var(--sb-prose));
	margin-right: auto;
	margin-left: auto;
	color: var(--sb-heading);
	text-wrap: balance;
}

.entry-content > .sbds-article > h2 {
	margin-top: clamp(48px, 7vw, 70px);
	margin-bottom: 20px;
	font-size: clamp(1.85rem, 4vw, 2.2rem);
	letter-spacing: -0.018em;
	line-height: 1.16;
}

.entry-content > .sbds-article > h3 {
	margin-top: 42px;
	margin-bottom: 18px;
	font-size: clamp(1.5rem, 3.2vw, 1.78rem);
	line-height: 1.2;
}

.entry-content > .sbds-article > h4 {
	margin-top: 34px;
	margin-bottom: 16px;
	font-size: 1.28rem;
	line-height: 1.28;
}

.entry-content > .sbds-article > :is(h5, h6) {
	margin-top: 30px;
	margin-bottom: 14px;
	font-size: 1.08rem;
	line-height: 1.35;
}

.entry-content > .sbds-article > :is(figure, .wp-block-image, .wp-block-gallery, .wp-block-embed) {
	margin: 0 0 38px;
}

.entry-content > p,
.entry-content > ul,
.entry-content > ol,
.entry-content > blockquote,
.entry-content > pre,
.entry-content > details,
.entry-content > hr,
.entry-content > [data-sb-component],
.entry-content > .sbds-answer,
.entry-content > .sbds-warning,
.entry-content > .sbds-steps,
.entry-content > .sbds-offer {
	width: min(100%, var(--sb-prose));
	margin: 0 auto 30px;
}

.entry-content > p {
	text-wrap: pretty;
}

.entry-content > figure,
.entry-content > .wp-block-image,
.entry-content > .wp-block-gallery,
.entry-content > .wp-block-embed {
	margin: 0 0 38px;
}

.entry-content figure img {
	border-radius: var(--sb-radius-sm);
}

.entry-content > h2,
.entry-content > h3,
.entry-content > h4,
.entry-content > h5,
.entry-content > h6 {
	width: min(100%, var(--sb-prose));
	margin-right: auto;
	margin-left: auto;
	color: var(--sb-heading);
	text-wrap: balance;
}

.entry-content > h2 {
	margin-top: clamp(48px, 7vw, 70px);
	margin-bottom: 20px;
	font-size: clamp(1.85rem, 4vw, 2.2rem);
	letter-spacing: -0.018em;
	line-height: 1.16;
}

.entry-content > h3 {
	margin-top: 42px;
	margin-bottom: 18px;
	font-size: clamp(1.5rem, 3.2vw, 1.78rem);
	line-height: 1.2;
}

.entry-content > h4 {
	margin-top: 34px;
	margin-bottom: 16px;
	font-size: 1.28rem;
	line-height: 1.28;
}

.entry-content > h5,
.entry-content > h6 {
	margin-top: 30px;
	margin-bottom: 14px;
	font-size: 1.08rem;
	line-height: 1.35;
}

.entry-content h2[id],
.entry-content h3[id] {
	scroll-margin-top: 24px;
}

.entry-content ul,
.entry-content ol {
	padding-left: 1.45em;
}

.entry-content li::marker {
	color: var(--sb-aqua);
	font-weight: 700;
}

.entry-content li + li {
	margin-top: 0.55em;
}

.entry-content blockquote {
	padding: 12px 0 12px 25px;
	border-left: 3px solid var(--sb-violet);
	color: #414860;
	font-size: 1.08em;
	font-style: italic;
}

.entry-content blockquote > :first-child {
	margin-top: 0;
}

.entry-content blockquote > :last-child {
	margin-bottom: 0;
}

.entry-content hr {
	height: 1px;
	border: 0;
	background: linear-gradient(90deg, transparent, var(--sb-line-strong), transparent);
}

.entry-content figcaption,
.wp-caption-text {
	margin-top: 9px;
	color: var(--sb-muted);
	font-family: var(--sb-ui);
	font-size: 12px;
	line-height: 1.5;
	text-align: center;
}

.entry-content pre,
.entry-content code,
.entry-content kbd,
.entry-content samp {
	font-family: ui-monospace, SFMono-Regular, Consolas, "Liberation Mono", monospace;
	font-size: 0.88em;
}

.entry-content pre {
	padding: 18px;
	overflow-x: auto;
	border: 1px solid var(--sb-line);
	border-radius: var(--sb-radius-sm);
	background: var(--sb-soft);
}

.entry-content > table,
.entry-content > .wp-block-table {
	width: min(100%, var(--sb-reading));
	margin: 0 auto 34px;
	overflow-x: auto;
}

.entry-content table {
	width: 100%;
	border-collapse: collapse;
	font-family: var(--sb-ui);
	font-size: 15px;
	line-height: 1.5;
}

.entry-content th,
.entry-content td {
	padding: 11px 13px;
	border: 1px solid var(--sb-line-strong);
	text-align: left;
	vertical-align: top;
}

.entry-content th {
	background: var(--sb-moonlight);
	color: var(--sb-heading);
	font-weight: 750;
}

/* A native, low-friction guide rather than a competing navigation card. */
.entry-guide {
	padding: 17px 19px;
	border: 1px solid #d7d3e8;
	border-radius: var(--sb-radius-sm);
	background: linear-gradient(135deg, var(--sb-violet-soft), #ffffff 76%);
}

.entry-guide summary {
	cursor: pointer;
	color: var(--sb-heading);
	font-family: var(--sb-ui);
	font-size: 14px;
	font-weight: 750;
	line-height: 1.4;
}

.entry-guide summary::marker {
	color: var(--sb-violet);
}

.entry-guide ol {
	margin: 14px 0 2px;
	padding-left: 24px;
}

.entry-guide li + li {
	margin-top: 7px;
}

.entry-guide a {
	font-size: 15px;
}

/* Article Design System components. Generic modules retain the reading rhythm;
 * only meaningfully different content receives a distinct visual treatment. */
.entry-content [data-sb-component] {
	--sb-module-accent: var(--sb-night);
	--sb-module-surface: var(--sb-soft);
	min-width: 0;
}

.entry-content :is(
	[data-sb-component*="answer" i],
	[data-sb-component*="takeaway" i],
	[data-sb-component*="key-point" i],
	.sbds-answer
) {
	padding: 20px 22px;
	border-left: 4px solid var(--sb-aqua);
	background: linear-gradient(90deg, var(--sb-aqua-soft), #f7fbfb);
}

.entry-content :is(
	[data-sb-component*="warning" i],
	[data-sb-component*="safety" i],
	[data-sb-component*="caution" i],
	.sbds-warning
) {
	padding: 20px 22px;
	border-left: 4px solid var(--sb-magenta);
	background: var(--sb-magenta-soft);
}

.entry-content :is(
	[data-sb-component*="offer" i],
	[data-sb-component*="next-step" i],
	.sbds-offer
) {
	padding: 20px 22px;
	border-left: 4px solid var(--sb-violet);
	background: var(--sb-violet-soft);
}

.entry-content :is(
	[data-sb-component*="steps" i],
	[data-sb-component*="checklist" i],
	[data-sb-component*="how-to" i],
	.sbds-steps
) {
	padding: 20px 0;
	border-top: 1px solid var(--sb-line-strong);
	border-bottom: 1px solid var(--sb-line-strong);
}

.entry-content :is(
	[data-sb-component*="quote" i],
	[data-sb-component*="testimonial" i]
) {
	padding: 8px 0 8px 24px;
	border-left: 3px solid var(--sb-violet);
	color: #3d4658;
	font-family: var(--sb-editorial);
	font-size: 1.08em;
	font-style: italic;
}

.entry-content :is(
	[data-sb-component*="answer" i],
	[data-sb-component*="takeaway" i],
	[data-sb-component*="key-point" i],
	[data-sb-component*="warning" i],
	[data-sb-component*="safety" i],
	[data-sb-component*="caution" i],
	[data-sb-component*="offer" i],
	[data-sb-component*="next-step" i],
	.sbds-answer,
	.sbds-warning,
	.sbds-offer
) {
	border-radius: 0 var(--sb-radius-sm) var(--sb-radius-sm) 0;
}

.entry-content :is([data-sb-component], .sbds-answer, .sbds-warning, .sbds-steps, .sbds-offer) > :first-child {
	margin-top: 0;
}

.entry-content :is([data-sb-component], .sbds-answer, .sbds-warning, .sbds-steps, .sbds-offer) > :last-child {
	margin-bottom: 0;
}

.entry-content [data-sb-component] > :is(h2, h3, h4) {
	margin: 0 0 15px;
	color: var(--sb-heading);
	letter-spacing: -0.012em;
	line-height: 1.2;
	text-wrap: balance;
}

.entry-content [data-sb-component] > h2 {
	font-size: clamp(1.58rem, 3.5vw, 1.88rem);
}

.entry-content [data-sb-component] > h3 {
	font-size: clamp(1.35rem, 3vw, 1.58rem);
}

/* Purpose-built patterns for the article packs already in production. These
 * vary the visual rhythm without turning every paragraph into a card. */
.entry-content [data-sb-component="curiosity-workshop"] {
	padding-block: 22px;
	border-top: 1px solid var(--sb-line-strong);
	border-bottom: 1px solid var(--sb-line-strong);
}

.entry-content [data-sb-component="curiosity-workshop"] > ol {
	display: grid;
	margin: 22px 0 18px;
	padding: 0;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 0 24px;
	list-style-position: inside;
}

.entry-content [data-sb-component="curiosity-workshop"] > ol > li {
	padding: 14px 0;
	border-top: 1px solid var(--sb-line);
}

.entry-content [data-sb-component="curiosity-workshop"] > ol > li::marker {
	font-family: var(--sb-ui);
	font-size: 0.82em;
}

.entry-content [data-sb-component="curiosity-workshop"] > ol :is(h3, p) {
	display: inline;
	margin: 0;
}

.entry-content [data-sb-component="curiosity-workshop"] > ol h3 {
	margin-right: 0.22em;
	color: var(--sb-heading);
	font-size: 1rem;
}

.entry-content [data-sb-component="whole-wheel-check"] {
	padding: 22px;
	border: 1px solid var(--sb-line);
	border-radius: var(--sb-radius);
	background: linear-gradient(145deg, var(--sb-soft), #ffffff 62%);
}

.entry-content [data-sb-component="whole-wheel-check"] > dl {
	display: grid;
	margin: 20px 0 18px;
	grid-template-columns: minmax(120px, 0.34fr) minmax(0, 1fr);
}

.entry-content [data-sb-component="whole-wheel-check"] :is(dt, dd) {
	margin: 0;
	padding: 13px 0;
	border-top: 1px solid var(--sb-line);
}

.entry-content [data-sb-component="whole-wheel-check"] dt {
	padding-right: 18px;
	color: var(--sb-heading);
	font-family: var(--sb-ui);
	font-size: 0.86em;
}

.entry-content [data-sb-component="field-notes"] {
	padding: 22px;
	border-radius: var(--sb-radius);
	background: var(--sb-violet-soft);
}

.entry-content [data-sb-component="field-notes"] > ol,
.entry-content [data-sb-component="join-broaden-park"] > ol,
.entry-content [data-sb-component="play-by-age"] > ul {
	display: grid;
	margin: 20px 0;
	padding: 0;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 18px;
	list-style: none;
}

.entry-content [data-sb-component="field-notes"] > ol > li,
.entry-content [data-sb-component="join-broaden-park"] > ol > li,
.entry-content [data-sb-component="play-by-age"] > ul > li {
	margin: 0;
	padding: 16px 0 0;
	border-top: 3px solid var(--sb-aqua);
}

.entry-content [data-sb-component="field-notes"] li :is(h3, p),
.entry-content [data-sb-component="join-broaden-park"] li :is(h3, p),
.entry-content [data-sb-component="play-by-age"] li :is(h4, p) {
	margin-top: 0;
}

.entry-content [data-sb-component="join-broaden-park"] {
	padding-block: 22px;
	border-top: 1px solid var(--sb-line-strong);
	border-bottom: 1px solid var(--sb-line-strong);
}

.entry-content [data-sb-component="join-broaden-park"] > ol > li {
	border-top-color: var(--sb-night);
}

.entry-content [data-sb-component="play-by-age"] {
	padding: 20px 22px;
	border: 1px solid var(--sb-line);
	border-radius: var(--sb-radius);
}

.entry-content [data-sb-component="safe-wheel-bay"] {
	padding: 22px;
	border-left: 4px solid var(--sb-magenta);
	border-radius: 0 var(--sb-radius) var(--sb-radius) 0;
	background: var(--sb-magenta-soft);
}

.entry-content [data-sb-component="wheel-safety-cards"] {
	display: grid;
	margin: 18px 0;
	padding: 0;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 12px;
	list-style: none;
}

.entry-content [data-sb-component="wheel-safety-cards"] > li {
	margin: 0;
	padding: 17px 18px;
	border: 1px solid #ead9d5;
	border-radius: var(--sb-radius-sm);
	background: #fffaf8;
}

.entry-content [data-sb-component="wheel-safety-cards"] > li :is(h3, p) {
	margin-top: 0;
}

.entry-content [data-sb-component="cta"] {
	padding: clamp(24px, 5vw, 36px);
	border: 1px solid #d5d0e7;
	border-radius: var(--sb-radius);
	background:
		radial-gradient(circle at 92% 10%, rgba(25, 125, 123, 0.13), transparent 30%),
		linear-gradient(145deg, var(--sb-violet-soft), #ffffff 72%);
	box-shadow: var(--sb-shadow-soft);
}

.entry-content [data-sb-component="cta"] a {
	display: inline-flex;
	min-height: 48px;
	padding: 11px 17px;
	align-items: center;
	border-radius: var(--sb-radius-sm);
	background: var(--sb-night);
	color: #ffffff;
	font-family: var(--sb-ui);
	font-weight: 750;
	text-decoration: none;
}

.entry-content [data-sb-component="cta"] a:hover,
.entry-content [data-sb-component="cta"] a:focus-visible {
	background: var(--sb-violet-deep);
	color: #ffffff;
}

.entry-content :is([data-sb-component*="faq" i], [data-sb-component*="questions" i]) details {
	padding-block: 13px;
	border-bottom: 1px solid var(--sb-line);
}

.entry-content :is([data-sb-component*="faq" i], [data-sb-component*="questions" i]) summary {
	color: var(--sb-heading);
	font-family: var(--sb-ui);
	font-weight: 750;
	cursor: pointer;
}

.entry-content > .sbds-offer a,
.entry-content [data-sb-component*="offer" i] a {
	display: inline-flex;
	min-height: 44px;
	align-items: center;
	font-weight: 700;
}

/* Sources are present for trust, but intentionally compact so they do not
 * become a visual dead end immediately before the article-to-offer handoff. */
.entry-content :is(
	[data-sb-component*="source" i],
	.sources,
	.article-sources,
	.sb-sources,
	section#sources,
	aside#sources,
	div#sources,
	details#sources,
	section[id$="-sources"]
) {
	width: min(100%, var(--sb-prose));
	margin: 42px auto 0;
	padding: 14px 16px;
	border: 1px solid var(--sb-line);
	border-radius: var(--sb-radius-sm);
	background: #f7f7fb;
	color: var(--sb-muted);
	font-family: var(--sb-ui);
	font-size: 12.5px;
	line-height: 1.52;
}

.entry-content :is(
	[data-sb-component*="source" i],
	.sources,
	.article-sources,
	.sb-sources,
	section#sources,
	aside#sources,
	div#sources,
	details#sources,
	section[id$="-sources"]
) :is(h2, h3, h4, summary) {
	margin: 0 0 8px;
	color: var(--sb-heading);
	font-family: var(--sb-ui);
	font-size: 12px;
	font-weight: 800;
	letter-spacing: 0.08em;
	line-height: 1.35;
	text-transform: uppercase;
}

.entry-content :is(
	[data-sb-component*="source" i],
	.sources,
	.article-sources,
	.sb-sources,
	section#sources,
	aside#sources,
	div#sources,
	details#sources,
	section[id$="-sources"]
) :is(ol, ul) {
	columns: 2;
	column-gap: 30px;
	margin: 0;
	padding-left: 20px;
}

.entry-content :is(
	[data-sb-component*="source" i],
	.sources,
	.article-sources,
	.sb-sources,
	section#sources,
	aside#sources,
	div#sources,
	details#sources,
	section[id$="-sources"]
) li + li {
	margin-top: 4px;
}

.entry-content section[id$="-sources"] li {
	break-inside: avoid;
}

.entry-content :is(
	[data-sb-component*="source" i],
	.sources,
	.article-sources,
	.sb-sources,
	section#sources,
	aside#sources,
	div#sources,
	details#sources,
	section[id$="-sources"]
) p {
	margin: 0 0 7px;
}

.entry-content > h2#sources {
	margin-top: 50px;
	margin-bottom: 0;
	padding: 13px 16px 7px;
	border: 1px solid var(--sb-line);
	border-bottom: 0;
	border-radius: var(--sb-radius-sm) var(--sb-radius-sm) 0 0;
	background: #f7f7fb;
	font-family: var(--sb-ui);
	font-size: 12px;
	font-weight: 800;
	letter-spacing: 0.08em;
	line-height: 1.35;
	text-transform: uppercase;
}

.entry-content > h2#sources + :is(ol, ul, p, div) {
	width: min(100%, var(--sb-prose));
	margin: 0 auto;
	padding: 4px 16px 14px 34px;
	border: 1px solid var(--sb-line);
	border-top: 0;
	border-radius: 0 0 var(--sb-radius-sm) var(--sb-radius-sm);
	background: #f7f7fb;
	color: var(--sb-muted);
	font-family: var(--sb-ui);
	font-size: 12.5px;
	line-height: 1.52;
}

.alignwide {
	width: min(calc(100vw - 40px), 980px);
	max-width: 980px;
	margin-left: 50%;
	transform: translateX(-50%);
}

.alignfull {
	width: 100vw;
	max-width: 100vw;
	margin-left: 50%;
	transform: translateX(-50%);
}

/* Archive, category, search, and posts-page views stay editorial rather than
 * becoming a field of detached cards. */
body:is(.archive, .search) {
	background: var(--sb-canvas);
}

body:is(.archive, .search) .site-main {
	width: min(calc(100% - 40px), 980px);
}

.view-header {
	position: relative;
	width: 100%;
	margin-inline: auto;
	padding: 22px 0 30px;
	border-bottom: 1px solid var(--sb-line-strong);
}

.view-header::before {
	position: absolute;
	top: 0;
	left: 0;
	width: 58px;
	height: 4px;
	content: "";
	border-radius: 999px;
	background: linear-gradient(90deg, var(--sb-violet), var(--sb-aqua));
}

.view-title {
	max-width: 18ch;
	font-size: clamp(2.45rem, 5vw, 3.55rem);
}

.archive-description {
	max-width: 42rem;
	margin-top: 14px;
	color: var(--sb-muted);
}

.archive-description > :last-child {
	margin-bottom: 0;
}

.post-list {
	display: grid;
	margin-top: 28px;
	border-top: 1px solid var(--sb-line-strong);
}

.post-card {
	display: grid;
	grid-template-columns: minmax(180px, 230px) minmax(0, 1fr);
	gap: 28px;
	margin: 0;
	padding: 24px 0;
	border-bottom: 1px solid var(--sb-line-strong);
}

.post-card:hover {
	border-bottom-color: var(--sb-violet);
}

.post-card--text-only {
	grid-template-columns: 1fr;
}

.post-card__media {
	display: block;
	align-self: start;
	overflow: hidden;
	border-radius: 8px;
	background: var(--sb-soft);
}

.post-card__image {
	display: block;
	width: 100%;
	aspect-ratio: 3 / 2;
	object-fit: cover;
}

.post-card__body {
	align-self: center;
}

.post-card__title {
	margin: 0;
	font-size: clamp(1.45rem, 3vw, 1.78rem);
	line-height: 1.18;
	text-wrap: balance;
}

.post-card__title a {
	color: var(--sb-heading);
	text-decoration: none;
}

.post-card__title a:hover,
.post-card__title a:focus-visible {
	color: var(--sb-link-hover);
	text-decoration: underline;
	text-decoration-color: var(--sb-aqua);
}

.post-card__summary {
	margin-top: 13px;
	color: #3f4654;
	font-size: 16px;
	line-height: 1.62;
}

.post-card__meta {
	margin: 9px 0 0;
	color: var(--sb-muted);
	font-family: var(--sb-ui);
	font-size: 12px;
	font-weight: 650;
	line-height: 1.45;
}

.post-card__summary > :last-child {
	margin-bottom: 0;
}

.navigation.pagination,
.comment-navigation {
	margin-top: 44px;
	font-family: var(--sb-ui);
	font-size: 14px;
}

.nav-links {
	display: flex;
	align-items: center;
	flex-wrap: wrap;
	gap: 8px;
}

.page-numbers {
	display: inline-flex;
	min-width: 44px;
	min-height: 44px;
	padding: 7px 11px;
	align-items: center;
	justify-content: center;
	border: 1px solid var(--sb-line-strong);
	border-radius: 8px;
	color: var(--sb-heading);
	text-decoration: none;
}

.page-numbers:hover,
.page-numbers:focus-visible {
	border-color: var(--sb-violet);
	background: var(--sb-violet-soft);
}

.page-numbers.current {
	border-color: var(--sb-night);
	background: var(--sb-night);
	color: #ffffff;
}

.no-results,
.not-found {
	width: min(100%, var(--sb-prose));
	margin-inline: auto;
	padding: clamp(28px, 5vw, 48px) 0;
	border-top: 2px solid var(--sb-heading);
	border-bottom: 1px solid var(--sb-line-strong);
	background: transparent;
}

.no-results h2 {
	margin: 0;
	color: var(--sb-heading);
}

.search-form {
	display: flex;
	max-width: 620px;
	margin-top: 28px;
	align-items: stretch;
	gap: 9px;
}

.search-form label {
	display: flex;
	flex: 1;
}

.search-field {
	width: 100%;
}

/* Every normal theme page uses one quiet-night editorial footer. Posts with
 * the complete workshop handoff intentionally let that presentation close. */
.site-footer {
	position: relative;
	margin-top: auto;
	border-top: 0;
	background: var(--sb-night-deep);
	color: #edf0fb;
	font-family: var(--sb-editorial);
}

.site-footer::before {
	position: absolute;
	top: 0;
	right: 0;
	left: 0;
	height: 4px;
	content: "";
	background: linear-gradient(90deg, #c9bce8, #b9cceb 50%, #edbfd0);
}

.site-footer__inner {
	width: min(calc(100% - 40px), 820px);
	margin-inline: auto;
	padding-block: 58px;
}

.site-footer img {
	display: block;
	margin: 0;
}

.site-footer :is(h1, h2, h3, h4, h5, h6),
.site-footer .footer-widget__title,
.site-footer .widget-title,
.site-footer .wp-block-heading {
	color: #ffffff !important;
	font-family: var(--sb-editorial) !important;
}

.site-footer p,
.site-footer li,
.site-footer small {
	color: #edf0fb;
}

.site-footer a {
	color: #ddd4f2;
}

.site-footer__inner--editorial {
	width: min(calc(100% - 40px), var(--sb-shell));
	display: grid;
	grid-template-columns: minmax(0, 1.05fr) minmax(390px, 0.95fr);
	gap: 42px clamp(44px, 8vw, 100px);
	padding-block: clamp(52px, 7vw, 78px) 30px;
}

.site-footer__about {
	max-width: 39rem;
}

.site-footer__brand {
	width: min(224px, 100%);
	min-height: 52px;
	display: inline-flex;
	align-items: center;
	padding: 9px 12px;
	border: 1px solid rgba(255, 255, 255, 0.24);
	border-radius: 15px;
	background: #fffdfb;
	box-shadow: 0 12px 30px rgba(0, 0, 0, 0.14);
}

.site-footer__logo {
	width: 100%;
	height: auto;
	display: block;
}

.site-footer__about h2,
.site-footer__nav h2 {
	margin: 24px 0 10px;
	max-width: 21ch;
	font-size: clamp(1.5rem, 3vw, 2.05rem);
	letter-spacing: -0.018em;
	line-height: 1.16;
}

.site-footer__nav h2 {
	margin-top: 0;
	font-size: 1.35rem;
}

.site-footer__about p {
	max-width: 35rem;
	margin: 0;
	color: #cdd3e8;
	font-size: 14.5px;
	line-height: 1.65;
}

.site-footer__links {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	align-items: start;
	gap: 26px;
}

.site-footer__nav ul {
	margin: 0;
	padding: 0;
	list-style: none;
}

.site-footer__nav li {
	padding-block: 7px;
	border-bottom: 1px solid rgba(255, 255, 255, 0.12);
}

.site-footer__nav a {
	display: inline-flex;
	min-height: 30px;
	align-items: center;
	font-family: var(--sb-ui);
	color: #e3dcf2;
	font-size: 13.5px;
	font-weight: 700;
	text-decoration-color: rgba(228, 180, 203, 0.62);
}

.site-footer__nav a:hover,
.site-footer__nav a:focus-visible {
	color: #ffffff;
	text-decoration-color: #efbfd1;
}

.site-footer__legal {
	grid-column: 1 / -1;
	margin: 0;
	padding-top: 24px;
	border-top: 1px solid rgba(255, 255, 255, 0.14);
	color: #aeb6d0 !important;
	font-family: var(--sb-ui);
	font-size: 12px;
	line-height: 1.6;
}

@media (max-width: 760px) {
	body {
		font-size: 17px;
		line-height: 1.72;
	}

	.site-header__inner,
	.site-main,
	.site-footer__inner {
		width: min(calc(100% - 30px), var(--sb-reading));
	}

	body.single-post .site-main {
		width: min(calc(100% - 24px), 940px);
	}

	.site-footer__inner--editorial {
		width: min(calc(100% - 30px), var(--sb-shell));
	}

	.site-header__inner {
		padding-block: 10px;
	}

	.site-header__bar {
		gap: 12px;
	}

	.site-header__actions {
		gap: 5px;
	}

	.site-library-link,
	.site-offer-link {
		min-height: 40px;
		padding-inline: 10px;
		font-size: 12px;
	}

	.topic-navigation__inner {
		width: 100%;
		min-height: 0;
	}

	.topic-navigation {
		border-top-color: #e7dfec;
		background: #f5f1f6;
		color: var(--sb-heading);
	}

	.topic-navigation__label {
		display: none;
	}

	.topic-navigation ul {
		display: grid;
		grid-template-columns: repeat(2, minmax(0, 1fr));
		width: 100%;
		padding: 4px 10px;
		gap: 0 8px;
	}

	.topic-navigation li {
		min-width: 0;
		flex: auto;
	}

	.topic-navigation__library {
		display: block;
		grid-column: 1 / -1;
	}

	.topic-navigation__library a {
		justify-content: flex-start;
		padding-inline: 8px;
		color: var(--sb-rose-deep);
	}

	.topic-navigation a {
		width: 100%;
		min-height: 40px;
		padding: 6px 4px;
		justify-content: center;
		border-bottom: 1px solid rgba(212, 205, 221, 0.68);
		color: var(--sb-heading);
		font-size: 12px;
		line-height: 1.18;
		text-align: center;
		white-space: normal;
	}

	.topic-navigation a:hover,
	.topic-navigation a:focus-visible {
		color: var(--sb-violet-deep);
	}

	body.home .topic-navigation {
		display: none;
	}

	.site-main {
		padding-block: 38px 64px;
	}

	body.single-post .site-main {
		padding-block: 24px 30px;
	}

	body.single-post .entry {
		padding: 34px 24px 50px;
		border-radius: 14px;
	}

	.entry-title,
	.view-title {
		font-size: clamp(2rem, 10vw, 2.55rem);
	}

	.entry-media {
		margin-bottom: 36px;
		border-radius: 9px;
	}

	.entry-image {
		max-height: 56vh;
	}

	.entry-content > h2 {
		margin-top: 48px;
		font-size: clamp(1.72rem, 7.6vw, 2rem);
	}

	.entry-content > .sbds-article > h2 {
		margin-top: 48px;
		font-size: clamp(1.72rem, 7.6vw, 2rem);
	}

	.entry-content > h3 {
		font-size: clamp(1.42rem, 6.4vw, 1.65rem);
	}

	.entry-content > .sbds-article > h3 {
		font-size: clamp(1.42rem, 6.4vw, 1.65rem);
	}

	.entry-content :is(
		[data-sb-component*="answer" i],
		[data-sb-component*="takeaway" i],
		[data-sb-component*="key-point" i],
		[data-sb-component*="warning" i],
		[data-sb-component*="safety" i],
		[data-sb-component*="caution" i],
		[data-sb-component*="offer" i],
		[data-sb-component*="next-step" i],
		.sbds-answer,
		.sbds-warning,
		.sbds-offer
	) {
		padding: 17px 18px;
	}

	.entry-content [data-sb-component="curiosity-workshop"] > ol,
	.entry-content [data-sb-component="field-notes"] > ol,
	.entry-content [data-sb-component="join-broaden-park"] > ol,
	.entry-content [data-sb-component="play-by-age"] > ul,
	.entry-content [data-sb-component="wheel-safety-cards"] {
		grid-template-columns: 1fr;
		gap: 10px;
	}

	.entry-content [data-sb-component="whole-wheel-check"] {
		padding: 18px;
	}

	.entry-content [data-sb-component="whole-wheel-check"] > dl {
		grid-template-columns: 1fr;
	}

	.entry-content [data-sb-component="whole-wheel-check"] dt {
		padding-bottom: 4px;
	}

	.entry-content [data-sb-component="whole-wheel-check"] dd {
		padding-top: 0;
		border-top: 0;
	}

	.entry-content [data-sb-component="cta"] {
		padding: 22px 18px;
	}

	.entry-content :is(
		[data-sb-component*="source" i],
		.sources,
		.article-sources,
		.sb-sources,
		section#sources,
		aside#sources,
		div#sources,
		details#sources,
		section[id$="-sources"]
	) :is(ol, ul) {
		columns: 1;
	}

	.alignwide {
		width: calc(100vw - 30px);
	}

	.post-card {
		grid-template-columns: 128px minmax(0, 1fr);
		gap: 16px;
		padding: 20px 0;
	}

	.post-card--text-only {
		grid-template-columns: 1fr;
	}

	.post-card__media {
		width: 128px;
	}

	.post-card__image {
		aspect-ratio: 1 / 1;
	}

	.post-card__title {
		font-size: 1.42rem;
	}

	.site-footer__inner--editorial {
		grid-template-columns: 1fr;
		gap: 34px;
	}

	.site-footer__links {
		gap: 20px;
	}

	.site-footer__legal {
		grid-column: 1;
	}

	.search-form {
		flex-direction: column;
	}

}

@media (max-width: 560px) {
	.site-logo {
		width: min(160px, 43vw);
	}

	.site-header__bar {
		gap: 8px;
	}

	.site-library-link {
		min-width: 56px;
		padding-inline: 8px;
		font-size: 0;
	}

	.site-library-link::after {
		content: "Library";
		font-size: 12px;
	}

	.site-offer-link {
		padding-inline: 9px;
	}

	.site-offer-link__qualifier {
		display: none;
	}
}

@media (max-width: 420px) {
	.site-logo {
		width: min(136px, 42vw);
	}

	.site-library-link {
		min-width: 0;
		padding-inline: 5px;
	}

	.site-library-link::after {
		font-size: 12px;
	}

	.site-offer-link {
		padding-inline: 7px;
		font-size: 12px;
	}

	body.single-post .site-main {
		width: 100%;
		padding-top: 0;
	}

	body.single-post .entry {
		padding: 34px 20px 48px;
		border-right: 0;
		border-left: 0;
		border-radius: 0;
		box-shadow: none;
	}

	.entry-content > p,
	.entry-content > ul,
	.entry-content > ol {
		margin-bottom: 27px;
	}

	.entry-content th,
	.entry-content td {
		padding: 9px 10px;
	}
}

/* Short phones held sideways have very little vertical reading space. Keep
 * the full topic directory available in portrait, while turning the landscape
 * masthead into one compact row so an article title is visible immediately. */
@media (max-width: 760px) and (max-height: 420px) and (orientation: landscape) {
	.site-header__inner {
		padding-block: 5px;
	}

	.site-logo {
		width: 132px;
	}

	.site-library-link,
	.site-offer-link {
		min-height: 36px;
		padding-inline: 8px;
	}

	.topic-navigation__library {
		display: none;
	}

	.topic-navigation ul {
		display: flex;
		padding: 0 8px;
		gap: 0;
	}

	.topic-navigation li {
		flex: 1 1 0;
	}

	.topic-navigation a {
		min-height: 34px;
		padding: 4px 6px;
		border-bottom: 0;
		font-size: 12px;
	}

	body.single-post .site-main {
		padding-top: 14px;
	}
}

@media (prefers-reduced-motion: reduce) {
	*,
	*::before,
	*::after {
		scroll-behavior: auto !important;
		transition-duration: 0.01ms !important;
		animation-duration: 0.01ms !important;
		animation-iteration-count: 1 !important;
	}
}

@media print {
	.site-header,
	.site-footer,
	.entry-offer-transition,
	.sbcf-post-funnel,
	.topic-navigation,
	.navigation {
		display: none !important;
	}

	body {
		display: block;
		background: #ffffff;
		color: #000000;
		font-size: 12pt;
	}

	.site-main {
		width: 100%;
		padding: 0;
	}

	.entry-content > *,
	.entry-header {
		max-width: 100% !important;
	}

	a {
		color: #000000;
	}
}
