/*
 * Tomorrow Babies — modern sacred editorial layer.
 * Lightweight, responsive, and accessible.
 */

:root {
	--tb-ink: #14231f;
	--tb-ink-soft: #43524d;
	--tb-night: #102d27;
	--tb-night-deep: #09201b;
	--tb-paper: #f8f3e8;
	--tb-paper-bright: #fffdf8;
	--tb-sage: #dce6d7;
	--tb-gold: #c89a4b;
	--tb-gold-light: #ecd7aa;
	--tb-line: rgba(20, 35, 31, .15);
	--tb-shadow: 0 26px 70px rgba(17, 40, 34, .12);
	--tb-serif: "Iowan Old Style", "Palatino Linotype", "Book Antiqua", Palatino, Georgia, serif;
	--tb-sans: "Avenir Next", Avenir, "Segoe UI", Helvetica, Arial, sans-serif;
}

html { scroll-behavior: smooth; }

body.tb-editorial {
	background: var(--tb-paper-bright);
	color: var(--tb-ink);
	font-family: var(--tb-sans);
	-webkit-font-smoothing: antialiased;
}

.tb-editorial h1,
.tb-editorial h2,
.tb-editorial h3,
.tb-editorial .site-title {
	font-family: var(--tb-serif);
	letter-spacing: -.025em;
	color: var(--tb-ink);
}

.tb-editorial a { text-underline-offset: .18em; }

.tb-editorial a:focus-visible,
.tb-editorial button:focus-visible,
.tb-editorial input:focus-visible {
	outline: 3px solid var(--tb-gold);
	outline-offset: 3px;
}

.tb-editorial .site-header {
	background: rgba(255, 253, 248, .96);
	border-bottom: 1px solid var(--tb-line);
	box-shadow: none;
}

.tb-editorial .site-main-header-wrap { min-height: 82px; }

.tb-editorial .site-title {
	display: inline-flex;
	align-items: center;
	gap: .65rem;
	font-size: clamp(1.45rem, 2.2vw, 2rem);
	font-weight: 600;
	letter-spacing: -.035em;
}

.tb-editorial .site-title::before {
	content: "";
	width: .85em;
	height: .85em;
	display: inline-block;
	border: 1px solid var(--tb-gold);
	border-radius: 50% 50% 50% 12%;
	background: linear-gradient(145deg, var(--tb-night) 0 56%, var(--tb-gold) 57% 100%);
	transform: rotate(-10deg);
	box-shadow: 0 0 0 4px rgba(200, 154, 75, .12);
}

.tb-editorial .main-navigation .primary-menu-container > ul > li.menu-item > a {
	font-size: .77rem;
	font-weight: 700;
	letter-spacing: .055em;
	text-transform: uppercase;
	color: var(--tb-ink);
	padding-inline: .9rem;
}

.tb-editorial .main-navigation .primary-menu-container > ul > li.menu-item > a::after {
	content: "";
	position: absolute;
	left: .9rem;
	right: .9rem;
	bottom: 21px;
	height: 1px;
	background: var(--tb-gold);
	transform: scaleX(0);
	transform-origin: left;
	transition: transform .22s ease;
}

.tb-editorial .main-navigation .primary-menu-container > ul > li.menu-item > a:hover::after,
.tb-editorial .main-navigation .primary-menu-container > ul > li.current-menu-item > a::after {
	transform: scaleX(1);
}

.tb-editorial #primary-menu > li:last-child > a {
	margin-left: .35rem;
	padding: .68rem 1.05rem;
	border: 1px solid var(--tb-ink);
	border-radius: 999px;
}

.tb-editorial #primary-menu > li:last-child > a::after { display: none; }
.tb-editorial #primary-menu > li:last-child > a:hover { background: var(--tb-ink); color: #fff; }

.tb-topic-rail {
	position: relative;
	z-index: 5;
	background: var(--tb-night);
	color: #fff;
}

.tb-topic-rail__inner {
	min-height: 44px;
	display: flex;
	align-items: center;
	gap: 1.2rem;
}

.tb-topic-rail__label {
	color: var(--tb-gold-light);
	font-size: .66rem;
	font-weight: 800;
	letter-spacing: .18em;
	text-transform: uppercase;
}

.tb-topic-rail__nav {
	display: flex;
	align-items: center;
	gap: 1.4rem;
	flex: 1;
}

.tb-topic-rail a {
	color: rgba(255,255,255,.84);
	font-size: .77rem;
	text-decoration: none;
	white-space: nowrap;
	transition: color .2s ease;
}

.tb-topic-rail a:hover { color: #fff; }

.tb-topic-rail__search {
	display: inline-flex;
	align-items: center;
	gap: .42rem;
	padding-left: 1rem;
	border-left: 1px solid rgba(255,255,255,.2);
}

.tb-topic-rail__search svg {
	width: 15px;
	height: 15px;
	fill: none;
	stroke: currentColor;
	stroke-width: 1.8;
	stroke-linecap: round;
}

.tb-eyebrow,
.tb-kicker {
	margin: 0 0 .9rem;
	font-size: .68rem;
	font-weight: 800;
	letter-spacing: .2em;
	text-transform: uppercase;
	color: #7c5b25;
}

.tb-hero {
	position: relative;
	overflow: hidden;
	background:
		radial-gradient(circle at 10% 15%, rgba(200,154,75,.14), transparent 28rem),
		linear-gradient(115deg, var(--tb-paper) 0%, #fdfbf4 68%);
	border-bottom: 1px solid var(--tb-line);
}

.tb-hero::after {
	content: "";
	position: absolute;
	width: 26rem;
	height: 26rem;
	right: -13rem;
	top: -13rem;
	border: 1px solid rgba(200,154,75,.28);
	border-radius: 50%;
	box-shadow: 0 0 0 3rem rgba(200,154,75,.04), 0 0 0 7rem rgba(200,154,75,.035);
	pointer-events: none;
}

.tb-hero__grid {
	position: relative;
	z-index: 1;
	display: grid;
	grid-template-columns: minmax(0, .9fr) minmax(420px, 1.1fr);
	align-items: center;
	gap: clamp(3rem, 7vw, 7rem);
	padding-top: clamp(4.2rem, 8vw, 7.5rem);
	padding-bottom: clamp(4.2rem, 8vw, 7.5rem);
}

.tb-hero__copy h1 {
	max-width: 720px;
	margin: 0;
	font-size: clamp(3.2rem, 6.4vw, 6.8rem);
	line-height: .94;
	font-weight: 500;
}

.tb-hero__intro {
	max-width: 590px;
	margin: 1.6rem 0 0;
	color: var(--tb-ink-soft);
	font-size: clamp(1.05rem, 1.4vw, 1.25rem);
	line-height: 1.72;
}

.tb-hero__actions {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 1.3rem;
	margin-top: 2rem;
}

.tb-button {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: .65rem;
	min-height: 48px;
	padding: .82rem 1.25rem;
	border-radius: 2px;
	font-size: .78rem;
	font-weight: 800;
	letter-spacing: .08em;
	text-transform: uppercase;
	text-decoration: none;
	transition: transform .2s ease, background .2s ease, color .2s ease;
}

.tb-button:hover { transform: translateY(-2px); }

.tb-button--primary { background: var(--tb-night); color: #fff; }
.tb-button--primary:hover { background: var(--tb-gold); color: var(--tb-night-deep); }
.tb-button--text { color: var(--tb-ink); border-bottom: 1px solid var(--tb-ink); padding-inline: .2rem; }
.tb-button--light { color: var(--tb-night); background: var(--tb-paper-bright); }

.tb-lead-card {
	position: relative;
	margin: 0;
	background: var(--tb-paper-bright);
	box-shadow: var(--tb-shadow);
}

.tb-lead-card::before {
	content: "";
	position: absolute;
	inset: -12px 12px 12px -12px;
	border: 1px solid rgba(200,154,75,.52);
	z-index: -1;
}

.tb-lead-card__image {
	display: block;
	aspect-ratio: 16/10;
	overflow: hidden;
	background: var(--tb-sage);
}

.tb-lead-card__image img,
.tb-article-card__image img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	transition: transform .6s cubic-bezier(.2,.8,.2,1);
}

.tb-lead-card:hover img,
.tb-article-card:hover img { transform: scale(1.035); }

.tb-lead-card__body { padding: clamp(1.5rem, 3vw, 2.4rem); }
.tb-lead-card__body h2 { margin: 0; font-size: clamp(1.65rem, 2.5vw, 2.45rem); line-height: 1.12; }
.tb-lead-card__body h2 a,
.tb-article-card h2 a,
.tb-article-card h3 a { color: inherit; text-decoration: none; }
.tb-lead-card__body > p:not(.tb-kicker) { color: var(--tb-ink-soft); line-height: 1.65; }

.tb-read-link {
	display: inline-flex;
	min-height: 44px;
	align-items: center;
	gap: .55rem;
	color: var(--tb-ink);
	font-size: .76rem;
	font-weight: 800;
	letter-spacing: .07em;
	text-transform: uppercase;
	text-decoration: none;
	border-bottom: 1px solid var(--tb-gold);
}

.tb-read-link span { transition: transform .2s ease; }
.tb-read-link:hover span { transform: translateX(4px); }

.tb-topic-section,
.tb-latest,
.tb-archive-content {
	padding-block: clamp(4.5rem, 8vw, 8rem);
}

.tb-section-heading {
	display: grid;
	grid-template-columns: 1fr minmax(280px, .55fr);
	align-items: end;
	gap: 2rem;
	margin-bottom: 2.3rem;
}

.tb-section-heading--bordered {
	padding-bottom: 1.8rem;
	border-bottom: 1px solid var(--tb-line);
}

.tb-section-heading h2,
.tb-archive-hero h1 {
	margin: 0;
	font-size: clamp(2.5rem, 4.8vw, 4.8rem);
	line-height: 1;
	font-weight: 500;
}

.tb-section-heading > p {
	max-width: 520px;
	margin: 0 0 .25rem;
	color: var(--tb-ink-soft);
	line-height: 1.65;
}

.tb-topic-grid {
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	border-top: 1px solid var(--tb-line);
	border-left: 1px solid var(--tb-line);
}

.tb-topic-card {
	position: relative;
	min-height: 310px;
	display: flex;
	flex-direction: column;
	padding: 1.5rem;
	color: var(--tb-ink);
	text-decoration: none;
	border-right: 1px solid var(--tb-line);
	border-bottom: 1px solid var(--tb-line);
	background: var(--tb-paper-bright);
	transition: background .25s ease, color .25s ease, transform .25s ease;
}

.tb-topic-card:nth-child(even) { background: var(--tb-paper); }
.tb-topic-card:hover { z-index: 2; color: #fff; background: var(--tb-night); transform: translateY(-6px); box-shadow: var(--tb-shadow); }
.tb-topic-card__number { font-family: var(--tb-serif); font-size: .92rem; color: #8b6b36; }
.tb-topic-card h3 { max-width: 220px; margin: auto 0 1rem; font-size: 1.7rem; line-height: 1.04; transition: color .25s ease; }
.tb-topic-card:hover h3 { color: #fff; }
.tb-topic-card p { margin: 0; color: var(--tb-ink-soft); font-size: .9rem; line-height: 1.6; transition: color .25s ease; }
.tb-topic-card:hover p { color: rgba(255,255,255,.74); }
.tb-topic-card__meta { margin-top: 1.4rem; padding-top: 1rem; border-top: 1px solid currentColor; font-size: .7rem; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; }
.tb-topic-card__meta span { float: right; font-size: 1rem; }

.tb-latest { background: #eef0e8; }

.tb-article-grid {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 2rem;
}

.tb-article-card {
	display: flex;
	flex-direction: column;
	min-width: 0;
	background: var(--tb-paper-bright);
	border: 1px solid rgba(20,35,31,.1);
	transition: transform .25s ease, box-shadow .25s ease;
}

.tb-article-card:hover { transform: translateY(-5px); box-shadow: 0 18px 45px rgba(17,40,34,.1); }

.tb-article-card__image {
	display: block;
	aspect-ratio: 16/10;
	overflow: hidden;
	background: var(--tb-sage);
}

.tb-image-placeholder {
	display: block;
	width: 100%;
	height: 100%;
	background:
		linear-gradient(135deg, transparent 48%, rgba(200,154,75,.35) 49% 51%, transparent 52%),
		radial-gradient(circle at 30% 30%, rgba(255,255,255,.65), transparent 25%),
		var(--tb-sage);
}

.tb-article-card__body {
	display: flex;
	flex: 1;
	flex-direction: column;
	padding: 1.35rem 1.4rem 1.5rem;
}

.tb-article-card__meta {
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	gap: .6rem;
	margin-bottom: 1rem;
	color: #6b7772;
	font-size: .68rem;
	font-weight: 700;
	letter-spacing: .06em;
	text-transform: uppercase;
}

.tb-article-card__meta a { color: #7c5b25; text-decoration: none; }
.tb-article-card h2,
.tb-article-card h3 { margin: 0; font-size: clamp(1.45rem, 2vw, 1.85rem); line-height: 1.14; }
.tb-article-card__body > p { color: var(--tb-ink-soft); font-size: .92rem; line-height: 1.65; }
.tb-article-card .tb-read-link { margin-top: auto; align-self: flex-start; }

.tb-pagination {
	display: flex;
	justify-content: center;
	gap: .35rem;
	margin-top: 3.4rem;
}

.tb-pagination .page-numbers,
.tb-pagination .nav-links .page-numbers {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 42px;
	min-height: 42px;
	padding: .55rem .8rem;
	color: var(--tb-ink);
	background: var(--tb-paper-bright);
	border: 1px solid var(--tb-line);
	text-decoration: none;
}

.tb-pagination .current,
.tb-pagination a:hover { color: #fff; background: var(--tb-night); }

.tb-invitation {
	position: relative;
	overflow: hidden;
	padding-block: clamp(5rem, 9vw, 9rem);
	color: #fff;
	background: var(--tb-night);
}

.tb-invitation::before {
	content: "";
	position: absolute;
	inset: 0;
	opacity: .32;
	background: repeating-linear-gradient(115deg, transparent 0 42px, rgba(255,255,255,.035) 43px 44px);
}

.tb-invitation__inner { position: relative; }
.tb-invitation .tb-eyebrow { color: var(--tb-gold-light); }
.tb-invitation h2 { margin: 0; max-width: 920px; color: #fff; font-size: clamp(3rem, 7vw, 7rem); font-weight: 500; line-height: .96; }
.tb-invitation p:not(.tb-eyebrow) { max-width: 620px; margin: 1.7rem 0 2rem; color: rgba(255,255,255,.72); font-size: 1.05rem; line-height: 1.7; }

.tb-archive-hero {
	position: relative;
	overflow: hidden;
	padding-block: clamp(4.5rem, 8vw, 8rem);
	background: var(--tb-paper);
	border-bottom: 1px solid var(--tb-line);
}

.tb-archive-hero::after {
	content: "";
	position: absolute;
	right: -7rem;
	top: 50%;
	width: 22rem;
	height: 22rem;
	border: 1px solid rgba(200,154,75,.4);
	border-radius: 50%;
	transform: translateY(-50%);
	box-shadow: 0 0 0 3rem rgba(200,154,75,.06);
}

.tb-archive-hero__inner { position: relative; z-index: 1; }
.tb-archive-hero__description { max-width: 660px; margin: 1.4rem 0 0; color: var(--tb-ink-soft); font-size: 1.08rem; line-height: 1.7; }
.tb-archive-content { background: #eef0e8; }

.tb-search-form { max-width: 680px; margin-top: 2rem; }
.tb-search-form form { display: flex; }
.tb-search-form input[type="search"] { flex: 1; min-height: 54px; border: 1px solid var(--tb-line); background: #fff; }
.tb-search-form input[type="submit"],
.tb-search-form button { min-width: 120px; border: 0; background: var(--tb-night); color: #fff; }

.tb-empty-state {
	max-width: 760px;
	margin: 0 auto;
	padding: 4rem;
	text-align: center;
	background: var(--tb-paper-bright);
	border: 1px solid var(--tb-line);
}
.tb-empty-state h2 { margin-top: 0; font-size: 2.5rem; }

.tb-trust-strip { padding-block: 4rem; background: #dfe7da; border-top: 1px solid var(--tb-line); }
.tb-trust-strip__inner { display: grid; grid-template-columns: .5fr 1.4fr .7fr; align-items: center; gap: 2rem; }
.tb-trust-strip .tb-eyebrow { margin: 0; }
.tb-trust-strip__statement { margin: 0; font-family: var(--tb-serif); font-size: clamp(1.5rem, 2.5vw, 2.35rem); line-height: 1.15; }
.tb-trust-strip a { justify-self: end; color: var(--tb-ink); font-size: .78rem; font-weight: 800; letter-spacing: .06em; text-transform: uppercase; }

.tb-editorial .site-footer { background: var(--tb-night-deep); color: rgba(255,255,255,.75); }
.tb-editorial .site-footer a { color: rgba(255,255,255,.84); }
.tb-editorial .site-footer .site-middle-footer-wrap,
.tb-editorial .site-footer .site-bottom-footer-wrap { border-color: rgba(255,255,255,.12); }
.tb-editorial .footer-navigation .menu a { font-size: .72rem; letter-spacing: .04em; }

.tb-editorial.single-post .content-area,
.tb-editorial.page .content-area { margin-top: clamp(2rem, 5vw, 5rem); margin-bottom: clamp(3rem, 7vw, 7rem); }

.tb-editorial.single-post .entry-hero-container-inner {
	background: var(--tb-paper);
	border-bottom: 1px solid var(--tb-line);
}

.tb-editorial.single-post h1.entry-title { font-size: clamp(2.6rem, 5.5vw, 5.6rem); line-height: 1.02; font-weight: 500; }
.tb-editorial.single-post .entry-related h3.entry-title { font-size: clamp(1.35rem, 2vw, 1.75rem); line-height: 1.18; overflow-wrap: anywhere; }
.tb-editorial.single-post .entry-content { color: #263b34; font-size: 1.08rem; line-height: 1.86; }
.tb-editorial.single-post .entry-content > p:first-of-type { font-size: 1.2em; color: var(--tb-ink); }
.tb-editorial.single-post .entry-content h2 { margin-top: 2.3em; font-size: clamp(1.8rem, 3vw, 2.65rem); line-height: 1.12; }
.tb-editorial.single-post .entry-content h3 { margin-top: 1.8em; font-size: 1.55rem; }
.tb-editorial.single-post .entry-content blockquote {
	margin: 2.2rem 0;
	padding: 1.5rem 1.8rem;
	border-left: 3px solid var(--tb-gold);
	background: var(--tb-paper);
	font-family: var(--tb-serif);
	font-size: 1.25rem;
}
.tb-editorial.single-post .entry-content img { border-radius: 2px; box-shadow: 0 12px 35px rgba(17,40,34,.1); }

@media (prefers-reduced-motion: no-preference) {
	.tb-hero__copy > * { animation: tb-rise .6s both; }
	.tb-hero__copy > *:nth-child(2) { animation-delay: .08s; }
	.tb-hero__copy > *:nth-child(3) { animation-delay: .16s; }
	.tb-hero__copy > *:nth-child(4) { animation-delay: .24s; }
	.tb-lead-card { animation: tb-rise .7s .18s both; }
	@keyframes tb-rise {
		from { opacity: 0; transform: translateY(18px); }
		to { opacity: 1; transform: translateY(0); }
	}
}

@media (max-width: 1080px) {
	.tb-hero__grid { grid-template-columns: 1fr 1fr; gap: 3rem; }
	.tb-hero__copy h1 { font-size: clamp(3.1rem, 6vw, 5.2rem); }
	.tb-topic-grid { grid-template-columns: repeat(2, 1fr); }
	.tb-article-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
	.tb-editorial .main-navigation .primary-menu-container > ul > li.menu-item > a { padding-inline: .62rem; font-size: .69rem; }
}

@media (max-width: 767px) {
	.tb-editorial .site-main-header-wrap { min-height: 68px; }
	.tb-topic-rail__inner { overflow-x: auto; padding-block: .6rem; scrollbar-width: none; }
	.tb-topic-rail__inner::-webkit-scrollbar { display: none; }
	.tb-topic-rail__label, .tb-topic-rail__search span { display: none; }
	.tb-topic-rail__nav { gap: 1.1rem; }
	.tb-topic-rail__search { position: sticky; right: 0; padding: .4rem .65rem; background: var(--tb-night); border-left: 1px solid rgba(255,255,255,.2); }
	.tb-hero__grid { grid-template-columns: 1fr; gap: 3.2rem; }
	.tb-hero__copy h1 { font-size: clamp(3rem, 15vw, 5rem); }
	.tb-lead-card { margin-left: .75rem; }
	.tb-section-heading { grid-template-columns: 1fr; gap: 1rem; }
	.tb-topic-grid, .tb-article-grid { grid-template-columns: 1fr; }
	.tb-topic-card { min-height: 250px; }
	.tb-trust-strip__inner { grid-template-columns: 1fr; }
	.tb-trust-strip a { justify-self: start; }
	.tb-empty-state { padding: 2.2rem 1.4rem; }
}

/* Accessibility hardening */
.tb-editorial .skip-link:focus {
	clip: auto !important;
	clip-path: none !important;
	width: auto !important;
	height: auto !important;
	top: 8px !important;
	left: 8px !important;
	padding: .8rem 1rem !important;
	color: #fff !important;
	background: var(--tb-night-deep) !important;
	z-index: 100000 !important;
}

.tb-topic-rail a {
	min-height: 44px;
	display: inline-flex;
	align-items: center;
	padding-block: .7rem;
	color: #f4f6f3;
}

.tb-topic-rail__label { color: #f2d89e; }
.tb-eyebrow, .tb-kicker { color: #694711; }
.tb-topic-card__number { color: #684817; }
.tb-article-card__meta { color: #4e5d58; }
.tb-article-card__meta a {
	min-height: 28px;
	display: inline-flex;
	align-items: center;
	padding-inline: .25rem;
	margin-inline: -.25rem;
	color: #684711;
}
.tb-invitation p:not(.tb-eyebrow) { color: #e0e8e4; }
.tb-editorial .site-footer { color: #d8e0dc; }
.tb-editorial .site-footer a { color: #f0f3f1; }

@media (max-width: 420px) {
	.tb-hero__actions { align-items: stretch; flex-direction: column; }
	.tb-button { width: 100%; }
	.tb-button--text { width: auto; align-self: center; }
}
