/* ==========================================================================
   Articles, archives and search (single.php, archive.php, search.php). Classes are ca-*.
   ========================================================================== */

:root {
	--ca-green: #244C3B;
	--ca-green-2: #376B50;
	--ca-green-l: #E6EEE8;
	--ca-cream: #F8F5EC;
	--ca-sand: #E9E0D0;
	--ca-ink: #252B27;
	--ca-muted: #68716A;
	--ca-line: #E4E7E1;
	--ca-gold: #C69A48;
	--ca-gold-d: #8A6420;
	--ca-shadow: 0 1px 2px rgba(37,43,39,.05), 0 10px 30px rgba(37,43,39,.08);
}

.ca-eyebrow {
	margin: 0 0 10px; font: 600 .78rem/1.2 var(--cor-sans); letter-spacing: .14em; text-transform: uppercase; color: var(--ca-green-2);
}
.ca-btn {
	display: inline-flex; align-items: center; justify-content: center; gap: 8px; min-height: 46px; padding: 11px 22px;
	border-radius: 999px; background: var(--ca-green); color: #fff; font: 600 .98rem/1.2 var(--cor-sans); text-decoration: none;
	transition: background-color .15s ease, transform .15s ease;
}
.ca-btn:hover { background: #1B3A2D; color: #fff; transform: translateY(-1px); }
.ca-btn-block { width: 100%; }
.ca-single a:focus-visible, .ca-archive a:focus-visible, .ca-related a:focus-visible, .ca-archive-head a:focus-visible {
	outline: 3px solid var(--ca-gold); outline-offset: 3px; border-radius: 6px;
}

/* ---------- Article header ---------- */
.ca-single { padding: clamp(16px, 2.5vw, 28px) 0 clamp(40px, 6vw, 72px); background: #fff; }
.ca-head { max-width: 860px; margin: 18px 0 28px; }
.ca-kicker {
	display: inline-block; padding: 5px 12px; border-radius: 999px; background: var(--ca-green-l); color: var(--ca-green);
	font: 600 .74rem/1.2 var(--cor-sans); letter-spacing: .08em; text-transform: uppercase; text-decoration: none;
}
.ca-kicker:hover { background: var(--ca-green); color: #fff; }
.ca-title {
	margin: 14px 0 0; font-size: clamp(2rem, 2.4vw + 1rem, 3rem); font-weight: 600; line-height: 1.1; letter-spacing: -.02em;
	color: var(--ca-ink); text-wrap: balance;
}
.ca-dek { margin: 14px 0 0; max-width: 44em; font-size: clamp(1.05rem, .3vw + 1rem, 1.2rem); line-height: 1.6; color: var(--ca-muted); }
.ca-byline { display: flex; align-items: center; gap: 12px; margin-top: 22px; font-size: .92rem; color: var(--ca-muted); }
.ca-avatar {
	display: grid; place-items: center; flex: none; width: 42px; height: 42px; border-radius: 50%;
	background: var(--ca-green); color: #fff; font: 600 .78rem/1 var(--cor-sans); letter-spacing: .05em;
}
.ca-byline-text { display: grid; gap: 2px; }
.ca-byline strong { color: var(--ca-ink); font-weight: 600; }
.ca-hero { margin: 0 0 clamp(24px, 3vw, 40px); }
.ca-hero .cor-single-hero-img { display: block; width: 100%; aspect-ratio: 16 / 8; object-fit: cover; border-radius: 22px; margin: 0; }

/* ---------- Layout + sidebar ---------- */
.ca-layout { grid-template-columns: minmax(0, 1fr) 300px; gap: clamp(32px, 4vw, 64px); align-items: stretch; }
/* The sidebar column spans the full article height so its sticky contents can travel. */
.ca-sidebar { height: 100%; }
.ca-layout .cor-single-body { max-width: 760px; min-width: 0; }
.ca-sticky { position: sticky; top: 92px; display: flex; flex-direction: column; gap: 18px; }
.ca-sticky .cor-sidebar { display: contents; }
.ca-sticky .ca-pick { order: 1; }
.ca-sticky .cor-toc--desktop { order: 2; position: static; margin: 0; max-height: calc(100vh - 470px); min-height: 160px; background: #fff; border-color: var(--ca-line); }
.ca-sticky .ca-side-tools { order: 3; }
.cor-toc-list a.is-active { color: var(--ca-green); border-left-color: var(--ca-green); }

.ca-pick { padding: 20px; border-radius: 18px; background: var(--ca-cream); border: 1px solid var(--ca-sand); }
.ca-pick-label { margin: 0 0 8px; font: 700 .7rem/1.3 var(--cor-sans); letter-spacing: .1em; text-transform: uppercase; color: var(--ca-gold-d); }
.ca-pick-name { margin: 0; font: 600 1.1rem/1.3 var(--cor-serif); color: var(--ca-ink); }
.ca-pick-type { margin: 4px 0 0; font-size: .86rem; font-weight: 600; color: var(--ca-green-2); }
.ca-pick-why { margin: 10px 0 16px; font-size: .9rem; line-height: 1.55; color: var(--ca-muted); }
.ca-pick-note { margin: 8px 0 0; font-size: .74rem; color: var(--ca-muted); text-align: center; }
.ca-side-tools { padding: 18px 20px; border-radius: 18px; border: 1px solid var(--ca-line); background: #fff; }
.ca-side-title { margin: 0 0 8px; font: 700 .72rem/1.2 var(--cor-sans); letter-spacing: .12em; text-transform: uppercase; color: var(--ca-muted); }
.ca-side-tools ul { list-style: none; margin: 0; padding: 0; }
.ca-side-tools li + li { border-top: 1px solid var(--ca-line); }
.ca-side-tools a { display: block; padding: 9px 0; font-size: .94rem; font-weight: 500; color: var(--ca-ink); }
.ca-side-tools a:hover { color: var(--ca-green); }

/* Disclosure ribbon: the byline already carries date + reading time. */
.ca-single .cor-eeat-ribbon { margin: 0 0 24px; padding: 12px 16px; border-radius: 12px; background: var(--ca-cream); border: 1px solid var(--ca-sand); }
.ca-single .cor-eeat-pills { display: none; }
.ca-single .cor-eeat-note { font-size: .84rem; line-height: 1.5; color: var(--ca-muted); }
.ca-single .cor-eeat-note a { color: var(--ca-green); text-decoration: underline; text-underline-offset: 2px; }

/* ---------- Article body: bring the shared .corx / .coi content templates into the site palette ---------- */
.cor-single .entry-content .corx,
.cor-single .entry-content .coi {
	--x-ink: #252B27; --x-soft: #5C655E; --x-line: #E4E7E1; --x-paper: #FFFFFF; --x-warm: #F8F5EC;
	--x-sage: #376B50; --x-sage-d: #244C3B; --x-sage-l: #E6EEE8; --x-cream: #C69A48; --x-cream-d: #8A6420;
	--x-cta: #244C3B; --x-cta-d: #244C3B; --x-amber: #F7EFDF;
	--i-ink: #252B27; --i-soft: #5C655E; --i-line: #E4E7E1; --i-paper: #FFFFFF; --i-warm: #F8F5EC;
	--i-sage: #376B50; --i-sage-d: #244C3B; --i-sage-l: #E6EEE8; --i-cta: #244C3B; --i-cta-d: #244C3B;
	font-family: var(--cor-sans); font-size: 1.07rem; line-height: 1.78; color: #2B312D;
}
.cor-single .entry-content .corx h2, .cor-single .entry-content .coi h2 {
	font-family: var(--cor-serif); font-weight: 600; letter-spacing: -.01em; border-left-color: var(--ca-gold); color: var(--ca-ink);
}
.cor-single .entry-content .corx h3, .cor-single .entry-content .coi h3 { font-family: var(--cor-serif); font-weight: 600; color: var(--ca-green); }
.cor-single .entry-content .corx .x-box-top h3, .cor-single .entry-content .corx .x-box-top { color: #fff; }
.cor-single .entry-content .corx .x-badge { background: var(--ca-gold); color: #1F1A10; }
.cor-single .entry-content .corx .x-buy { box-shadow: 0 10px 22px rgba(36,76,59,.25); }
.cor-single .entry-content .corx .x-warn { border-left-color: var(--ca-gold); background: linear-gradient(135deg, #F7EFDF, #fff); }
.cor-single .entry-content .corx .x-box { box-shadow: var(--ca-shadow); }
.cor-single .entry-content .corx .x-toc a, .cor-single .entry-content .corx table a { color: var(--ca-green); }
/* "Related Reading" blocks and inline links were saved with inline orange styles. */
.cor-single .entry-content [style*="#c8400f"], .cor-single .entry-content [style*="#C8400F"],
.cor-single .entry-content [style*="#e8511c"], .cor-single .entry-content [style*="#E8511C"] {
	color: var(--ca-green) !important; border-color: var(--ca-gold) !important;
}
.cor-single .entry-content a { color: var(--ca-green); border-bottom-color: rgba(198,154,72,.6); }
.cor-single .entry-content a:hover { color: #1B3A2D; border-bottom-color: var(--ca-green); }

/* ---------- End-of-article CTA, about box ---------- */
.ca-next {
	display: flex; align-items: center; justify-content: space-between; gap: 18px; flex-wrap: wrap;
	margin: 40px 0 8px; padding: 22px 24px; border-radius: 18px; background: var(--ca-green); color: #fff;
}
.ca-next-eyebrow { margin: 0 0 4px; font: 600 .74rem/1.2 var(--cor-sans); letter-spacing: .12em; text-transform: uppercase; color: #E8CF9A; }
.ca-next-title { margin: 0; font: 600 1.2rem/1.3 var(--cor-serif); color: #fff; }
.ca-next .ca-btn { background: #fff; color: var(--ca-green); }
.ca-next .ca-btn:hover { background: var(--ca-cream); color: var(--ca-green); }
.ca-about { display: flex; gap: 16px; margin: 32px 0 0; padding: 22px 24px; border-radius: 18px; border: 1px solid var(--ca-line); background: #fff; }
.ca-about-mark {
	display: grid; place-items: center; flex: none; width: 52px; height: 52px; border-radius: 50%;
	background: var(--ca-green); color: #fff; font: 600 .9rem/1 var(--cor-sans); letter-spacing: .05em;
}
.ca-about-title { margin: 0 0 6px; font: 600 1.05rem/1.3 var(--cor-serif); color: var(--ca-ink); }
.ca-about p { margin: 0; font-size: .94rem; line-height: 1.6; color: var(--ca-muted); }
.ca-about-links { display: flex; flex-wrap: wrap; gap: 16px; margin-top: 10px !important; }
.ca-about-links a { font-weight: 600; color: var(--ca-green); }

/* ---------- Cards ---------- */
.ca-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 24px; }
.ca-card { display: flex; flex-direction: column; overflow: hidden; background: #fff; border: 1px solid var(--ca-line); border-radius: 18px; transition: box-shadow .2s ease, transform .2s ease; }
.ca-card:hover { box-shadow: var(--ca-shadow); transform: translateY(-2px); }
.ca-card-media { display: block; overflow: hidden; background: var(--ca-cream); }
.ca-card-img { display: block; width: 100%; aspect-ratio: 16 / 10; object-fit: cover; transition: transform .5s ease; }
.ca-card:hover .ca-card-img { transform: scale(1.04); }
.ca-card-body { display: flex; flex-direction: column; flex: 1; padding: 18px 20px 20px; }
.ca-card-kicker { margin: 0 0 6px; font: 600 .72rem/1.2 var(--cor-sans); letter-spacing: .1em; text-transform: uppercase; color: var(--ca-green-2); }
.ca-card-title { margin: 0; font-size: 1.12rem; line-height: 1.32; font-weight: 600; }
.ca-card-title a { color: var(--ca-ink); }
.ca-card-title a:hover { color: var(--ca-green); }
.ca-card-excerpt { margin: 10px 0 0; font-size: .93rem; line-height: 1.55; color: var(--ca-muted); display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; }
.ca-card-meta { margin: auto 0 0; padding-top: 12px; font-size: .82rem; color: var(--ca-muted); }
.ca-card.is-lead { grid-column: 1 / -1; display: grid; grid-template-columns: 1.15fr 1fr; }
.ca-card.is-lead .ca-card-img { height: 100%; aspect-ratio: 16 / 10; }
.ca-card.is-lead .ca-card-body { justify-content: center; padding: clamp(22px, 3vw, 40px); }
.ca-card.is-lead .ca-card-title { font-size: clamp(1.4rem, 1.2vw + 1rem, 2rem); line-height: 1.2; }
.ca-card.is-lead .ca-card-excerpt { font-size: 1.02rem; -webkit-line-clamp: 4; }

/* ---------- Continue exploring ---------- */
.ca-related { padding: clamp(48px, 6vw, 80px) 0; background: var(--ca-cream); }
.ca-related-head { margin-bottom: 28px; }
.ca-related-title { margin: 0; font-size: clamp(1.6rem, 1.6vw + 1rem, 2.2rem); font-weight: 600; }

/* ---------- Archive header + grid ---------- */
.ca-archive-head { padding: clamp(28px, 4vw, 52px) 0 clamp(28px, 4vw, 44px); background: linear-gradient(180deg, var(--ca-cream), #FBF9F3); border-bottom: 1px solid var(--ca-line); }
.ca-archive-head .cor-breadcrumbs { margin-bottom: 16px; }
.ca-archive-title { margin: 0; font-size: clamp(2.1rem, 2.6vw + 1rem, 3.2rem); font-weight: 600; letter-spacing: -.02em; line-height: 1.1; }
.ca-archive-intro { margin-top: 12px; max-width: 46em; font-size: 1.08rem; line-height: 1.65; color: var(--ca-muted); }
.ca-archive-intro p { margin: 0; }
.ca-chips { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 22px; }
.ca-chips a { padding: 7px 14px; border-radius: 999px; background: #fff; border: 1px solid var(--ca-line); font-size: .88rem; font-weight: 500; color: var(--ca-ink); }
.ca-chips a:hover { border-color: var(--ca-green); color: var(--ca-green); }
.ca-archive { padding: clamp(32px, 4vw, 56px) 0 clamp(48px, 6vw, 72px); background: #fff; }
.ca-archive .nav-links { display: flex; flex-wrap: wrap; justify-content: center; gap: 8px; margin-top: 36px; }
.ca-archive .page-numbers { display: inline-grid; place-items: center; min-width: 42px; height: 42px; padding: 0 14px; border-radius: 999px; border: 1px solid var(--ca-line); color: var(--ca-ink); font-weight: 600; }
.ca-archive .page-numbers.current, .ca-archive .page-numbers:hover { background: var(--ca-green); border-color: var(--ca-green); color: #fff; }

/* ---------- Responsive ---------- */
@media (max-width: 1100px) {
	.ca-layout { grid-template-columns: minmax(0, 1fr) 270px; }
}
@media (max-width: 980px) {
	.ca-layout { grid-template-columns: 1fr; }
	.ca-layout .cor-single-body { max-width: none; }
	.ca-sticky { position: static; }
	.ca-sticky .cor-toc--desktop { display: none; }
	.ca-grid { grid-template-columns: repeat(2, 1fr); }
	.ca-card.is-lead { grid-template-columns: 1fr; }
}
@media (max-width: 640px) {
	.ca-head { margin-top: 10px; }
	.ca-hero .cor-single-hero-img { aspect-ratio: 16 / 10; border-radius: 16px; }
	.ca-grid { grid-template-columns: 1fr; gap: 16px; }
	.ca-card:not(.is-lead) { display: grid; grid-template-columns: 112px 1fr; }
	.ca-card:not(.is-lead) .ca-card-img { aspect-ratio: auto; height: 100%; min-height: 112px; }
	.ca-card:not(.is-lead) .ca-card-body { padding: 12px 14px; }
	.ca-card:not(.is-lead) .ca-card-title { font-size: 1rem; }
	.ca-card:not(.is-lead) .ca-card-excerpt { display: none; }
	.ca-next { padding: 20px; }
	.ca-next .ca-btn { width: 100%; }
	.ca-about { flex-direction: column; }
}
@media (prefers-reduced-motion: reduce) {
	.ca-card, .ca-card-img, .ca-btn { transition: none; }
	.ca-card:hover, .ca-btn:hover { transform: none; }
	.ca-card:hover .ca-card-img { transform: none; }
}
