/*
Theme Name: YogaForFitness Kadence
Theme URI: https://yogaforfitness.com/
Description: YogaForFitness child theme for Kadence. Kadence settings are set in code (inc/settings.php); this file holds the fonts, the header mark, the guide components (quick answer, pose badges, caution and research boxes, gear picks, sources, medical disclaimer), the home page sections and the footer.
Author: PPC Optimizer Pro LLC
Template: kadence
Version: 1.0.0
Requires at least: 6.5
Requires PHP: 8.0
License: GPL-2.0-or-later
Text Domain: yogaforfitness-kadence
*/

/* ---------- Fonts (SIL OFL, self-hosted variable fonts, latin subset: no outside requests) ---------- */
@font-face {
	font-family: "Lora";
	src: url("assets/fonts/lora-latin-wght-normal.woff2") format("woff2");
	font-weight: 400 700;
	font-style: normal;
	font-display: swap;
}

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

@font-face {
	font-family: "Source Sans 3";
	src: url("assets/fonts/source-sans-3-latin-wght-normal.woff2") format("woff2");
	font-weight: 200 900;
	font-style: normal;
	font-display: swap;
}

@font-face {
	font-family: "Source Sans 3";
	src: url("assets/fonts/source-sans-3-latin-wght-italic.woff2") format("woff2");
	font-weight: 200 900;
	font-style: italic;
	font-display: swap;
}

/* Fallback faces sized to match the web fonts, so text doesn't move when they swap in (S13: PSI mobile CLS was 0.19,
   all from the body font swap). Values from the font files: weighted average advance width and ascent/descent
   (fontTools), against Arial / Georgia; Liberation, Helvetica and Roboto stand in where Arial isn't installed. */
@font-face {
	font-family: "Source Sans 3 Fallback";
	src: local("Arial"), local("ArialMT"), local("Liberation Sans"), local("Helvetica"), local("Roboto");
	size-adjust: 94.25%;
	ascent-override: 108.64%;
	descent-override: 42.44%;
	line-gap-override: 0%;
}

@font-face {
	font-family: "Lora Fallback";
	src: local("Georgia Bold"), local("Georgia-Bold"), local("Liberation Serif Bold"), local("Times New Roman Bold");
	font-weight: 700;
	size-adjust: 93.78%;
	ascent-override: 107.28%;
	descent-override: 29.22%;
	line-gap-override: 0%;
}

@font-face {
	font-family: "Lora Fallback";
	src: local("Georgia"), local("Liberation Serif"), local("Times New Roman");
	font-weight: 400;
	size-adjust: 108.21%;
	ascent-override: 92.97%;
	descent-override: 25.32%;
	line-gap-override: 0%;
}

/* Design tokens (docs/05-site-architecture.md section 4). The colours themselves live in Kadence's palette
   (functions.php palette()), so Kadence's own parts and ours always match. */
:root {
	--yff-primary: var(--global-palette1);
	--yff-primary-dark: var(--global-palette2);
	--yff-ink: var(--global-palette3);
	--yff-text: var(--global-palette4);
	--yff-muted: var(--global-palette5);
	--yff-border: var(--global-palette7);
	--yff-sand: var(--global-palette8);
	--yff-surface: var(--global-palette9);
	--yff-accent: var(--global-palette10);
	--yff-sage-tint: var(--global-palette11);
	--yff-amber-tint: var(--global-palette12);
	--yff-amber-ink: var(--global-palette13);
	--yff-accent-ink: var(--global-palette14);
	--yff-accent-text: #A84B28; /* terracotta for small text: 5.1:1 on sand, 5.6:1 on white (#B5532E is 4.48:1 on sand) */
	--yff-night: var(--global-palette15);
	--yff-radius: 12px;
	--yff-serif: "Lora", "Lora Fallback", Georgia, "Times New Roman", serif;
}

/* ---------- Base ---------- */

/* In classic themes WordPress wraps every group's content in .wp-block-group__inner-container. Our own boxes (grids,
   cards, callouts) are laid out on their direct children, so that wrapper must not get in the way. */
.wp-block-group[class*="yff-"] > .wp-block-group__inner-container {
	display: contents;
}

.entry-content a,
.yff-meta a,
.entry-author-description a {
	text-decoration-thickness: 1px;
	text-underline-offset: 0.18em;
}

.entry-content h2 {
	margin-top: 2.4rem;
}

.entry-content h3 {
	margin-top: 1.8rem;
}

.entry-content ol:not([class*="yff-"]) > li,
.entry-content ul:not([class*="yff-"]) > li {
	margin-bottom: 0.45rem;
}

.screen-reader-text:focus {
	clip: auto !important;
}

/* Skip link: visible when focused */
.skip-link:focus {
	background: var(--yff-surface);
	color: var(--yff-primary-dark);
	outline: 2px solid var(--yff-primary);
	z-index: 100000;
}

/* ---------- Header ---------- */
#masthead .site-main-header-wrap {
	border-bottom: 1px solid var(--yff-border);
}

/* Logo: our line-art mark + "Yoga For Fitness" wordmark, "For" in terracotta (functions.php branding()) */
.yff-brand {
	display: flex;
	align-items: center;
	gap: 10px;
	text-decoration: none;
	white-space: nowrap;
}

.yff-brand .yff-mark {
	width: 34px;
	height: 34px;
	flex: none;
	fill: none;
	stroke: var(--yff-primary);
	stroke-width: 2.6;
	stroke-linecap: round;
	stroke-linejoin: round;
}

.yff-brand .site-title {
	margin: 0;
	color: var(--yff-primary-dark);
}

.yff-brand .site-title b {
	color: var(--yff-accent);
	font-weight: inherit;
}

.header-navigation .menu > .menu-item > a {
	text-decoration: none;
}

.header-navigation .menu > .current-menu-item > a,
.header-navigation .menu > .current-menu-ancestor > a {
	box-shadow: inset 0 -2px 0 var(--yff-primary);
}

/* Search and menu buttons: 44 px squares with a quiet border (preview .icon-btn) */
.search-toggle-open,
.menu-toggle-open {
	min-width: 44px;
	min-height: 44px;
	width: 44px;
	height: 44px;
	padding: 0 !important;
	justify-content: center;
	align-items: center;
	border: 1px solid var(--yff-border) !important;
	border-radius: 10px !important;
	background: var(--yff-surface) !important;
	color: var(--yff-ink) !important;
}

.search-toggle-open:hover,
.menu-toggle-open:hover {
	border-color: var(--yff-primary) !important;
	color: var(--yff-primary) !important;
}

.site-header-item .search-toggle-open-container {
	margin-left: 4px;
}

/* Mobile header: search and menu side by side */
.site-mobile-header-wrap .site-header-main-section-right {
	gap: 10px;
}

/* Mobile menu drawer in brand ink; every item at least 44 px tall */
#mobile-drawer .drawer-inner {
	background: var(--yff-ink);
}

#mobile-drawer .mobile-navigation ul li > a,
#mobile-drawer .mobile-navigation ul li .drawer-nav-drop-wrap {
	min-height: 48px;
	display: flex;
	align-items: center;
}

#mobile-drawer .drawer-header .drawer-toggle {
	min-width: 44px;
	min-height: 44px;
}

/* Search overlay */
#search-drawer .drawer-inner {
	background: rgba(24, 34, 30, 0.97);
}

/* ---------- Post header: breadcrumb, badges, title, quick answer, meta line ---------- */
.kadence-breadcrumbs {
	font-size: 0.9rem;
	color: var(--yff-muted);
	margin-bottom: 0.7rem;
}

.kadence-breadcrumbs a {
	color: var(--yff-primary);
	text-decoration: none;
}

.kadence-breadcrumbs a:hover {
	text-decoration: underline;
}

/* The current page's title is left out of the trail, so drop the separator that would point at it */
.kadence-breadcrumb-container .bc-delimiter:last-child {
	display: none;
}

.single-content-wrap .entry-header .entry-title,
.entry-header .entry-title,
.entry-hero .entry-title {
	letter-spacing: -0.01em;
}

.single-post .entry-header {
	margin-bottom: 1.4rem;
}

.single-post .entry-header .entry-title {
	margin-bottom: 0.35rem;
}

/* Pose details above the title: level, type, body area, props (text, never colour alone) */
ul.yff-badges {
	list-style: none;
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
	margin: 0 0 0.7rem;
	padding: 0;
}

ul.yff-badges li,
.yff-badge {
	display: inline-block;
	margin: 0;
	padding: 2px 10px;
	border-radius: 999px;
	background: var(--yff-sage-tint);
	color: var(--yff-primary-dark);
	font-size: 0.82rem;
	font-weight: 600;
	line-height: 1.6;
}

/* Sanskrit name and pronunciation under the title */
.yff-sanskrit {
	color: var(--yff-muted);
	font-size: 1rem;
	margin: 0 0 0.6rem;
}

.yff-sanskrit i,
.yff-pron {
	font-family: var(--yff-serif);
	font-style: italic;
	color: var(--yff-text);
}

/* Quick answer: the summary from the front matter */
.yff-quick {
	background: var(--yff-sage-tint);
	border-left: 4px solid var(--yff-primary);
	border-radius: 8px;
	padding: 16px 20px;
	margin: 0.9rem 0;
}

.yff-quick p {
	margin: 0;
}

.yff-quick p.yff-quick-title {
	font-family: var(--yff-serif);
	font-weight: 700;
	font-size: 1.05rem;
	color: var(--yff-ink);
	margin-bottom: 4px;
}

.yff-meta {
	color: var(--yff-muted);
	font-size: 0.95rem;
	line-height: 1.5;
	margin: 0.6rem 0 0;
}

.yff-meta a {
	color: var(--yff-muted);
}

.yff-meta a:hover {
	color: var(--yff-primary);
}

.yff-aff-note {
	color: var(--yff-muted);
	font-size: 0.85rem;
	line-height: 1.5;
	margin: 0.35rem 0 0;
}

/* Featured image under the header */
.single-post .post-thumbnail {
	margin-bottom: 1.6rem;
}

.single-post .post-thumbnail img,
.single-post .article-post-thumbnail img {
	border-radius: var(--yff-radius);
}

/* Less air between the header and the breadcrumb than Kadence's 5rem (preview: about 36 px) */
body.single-post .content-area {
	margin-top: 36px;
	margin-bottom: 3.5rem;
}

/* ---------- Guide layout: ~720 px text column + 300 px sidebar from 1025 px (preview .art-grid) ---------- */
@media (min-width: 1025px) {
	.single-post.has-sidebar .content-container {
		grid-template-columns: minmax(0, 720px) 300px;
		grid-gap: 48px;
		justify-content: center;
	}
}

/* ---------- Text helpers ---------- */
.yff-eyebrow {
	color: var(--yff-accent-text);
	font-size: 0.85rem;
	font-weight: 600;
	letter-spacing: 0.04em;
	text-transform: uppercase;
	margin: 0 0 10px;
}

.yff-lead {
	color: var(--yff-muted);
	font-size: 1.15rem;
	max-width: 36em;
}

/* "Watch out for" / "Best for" lines in gear guides */
p.yff-watch,
p.yff-best {
	padding-left: 0.9rem;
	border-left: 3px solid var(--yff-amber-ink);
}

p.yff-best {
	border-left-color: var(--yff-primary);
}

/* ---------- In this guide (collapsible table of contents) ---------- */
.entry-content .yff-toc {
	border: 1px solid var(--yff-border);
	border-radius: 10px;
	padding: 12px 16px;
	margin: 1.4rem 0 1.8rem;
}

.yff-toc summary {
	font-weight: 600;
	cursor: pointer;
	min-height: 28px;
}

.yff-toc ol {
	margin: 0.6rem 0 0.2rem;
	padding-left: 1.4rem;
	font-size: 1rem;
}

.yff-toc li {
	margin: 0.2rem 0 !important;
}

.yff-toc a {
	text-decoration: none;
}

.yff-toc a:hover {
	text-decoration: underline;
}

/* ---------- Tables ---------- */
.entry-content .wp-block-table {
	overflow-x: auto;
	margin-top: 1.5rem;
	margin-bottom: 1.5rem;
}

.entry-content .wp-block-table table {
	width: 100%;
	border-collapse: collapse;
	font-size: 0.95rem;
	line-height: 1.5;
}

.entry-content .wp-block-table thead {
	border-bottom: 0;
}

.entry-content .wp-block-table thead th {
	background: var(--yff-primary-dark);
	color: #fff;
	font-weight: 600;
	text-align: left;
	padding: 0.7rem 0.85rem;
	border: 0;
}

.entry-content .wp-block-table thead th:first-child {
	border-top-left-radius: 8px;
}

.entry-content .wp-block-table thead th:last-child {
	border-top-right-radius: 8px;
}

.entry-content .wp-block-table td {
	padding: 0.65rem 0.85rem;
	border: 0;
	border-bottom: 1px solid var(--yff-border);
	vertical-align: top;
}

.entry-content .wp-block-table tbody tr:nth-child(even) {
	background: var(--yff-sand);
}

.entry-content .wp-block-table td:first-child {
	font-weight: 600;
}

/* Phones: every column keeps room to read; a table of 4+ columns scrolls sideways inside its box */
@media (max-width: 767px) {
	.entry-content .wp-block-table th,
	.entry-content .wp-block-table td {
		min-width: 6rem;
		padding-left: 0.6rem;
		padding-right: 0.6rem;
	}
}

/* ---------- Boxes (group block styles registered in functions.php) ---------- */
.is-style-yff-callout,
.is-style-yff-note,
.is-style-yff-caution,
.is-style-yff-research {
	border-radius: 10px;
	padding: 16px 20px;
	margin-top: 1.6rem;
	margin-bottom: 1.6rem;
}

.is-style-yff-callout {
	background: var(--yff-surface);
	border: 1px solid var(--yff-border);
	border-left: 4px solid var(--yff-primary);
}

.is-style-yff-note {
	background: var(--yff-sand);
	border-left: 4px solid var(--yff-accent);
}

/* Who should skip it or ask a doctor first */
.is-style-yff-caution {
	background: var(--yff-amber-tint);
	color: #4A3500;
}

.is-style-yff-caution a {
	color: var(--yff-amber-ink);
}

/* What the research says */
.is-style-yff-research {
	background: var(--yff-sage-tint);
}

:is(.is-style-yff-callout, .is-style-yff-note, .is-style-yff-caution, .is-style-yff-research, .is-style-yff-picks) > :first-child,
:is(.is-style-yff-callout, .is-style-yff-note, .is-style-yff-caution, .is-style-yff-research, .is-style-yff-picks) > .wp-block-group__inner-container > :first-child {
	margin-top: 0;
}

:is(.is-style-yff-callout, .is-style-yff-note, .is-style-yff-caution, .is-style-yff-research, .is-style-yff-picks) > :last-child,
:is(.is-style-yff-callout, .is-style-yff-note, .is-style-yff-caution, .is-style-yff-research, .is-style-yff-picks) > .wp-block-group__inner-container > :last-child {
	margin-bottom: 0;
}

:is(.is-style-yff-callout, .is-style-yff-note, .is-style-yff-caution, .is-style-yff-research) :is(ul, ol) {
	margin-bottom: 0;
	padding-left: 1.2rem;
}

/* Box titles: a small label in callouts and notes; a real (H2) heading in the caution and research boxes */
.yff-box-title,
.entry-content p.yff-box-title {
	font-size: 0.85rem !important;
	font-weight: 700;
	letter-spacing: 0.06em;
	text-transform: uppercase;
	color: var(--yff-primary-dark);
	margin-bottom: 0.5rem;
}

.is-style-yff-note .yff-box-title {
	color: var(--yff-accent-ink);
}

.entry-content h2.yff-box-heading {
	font-size: 1.25rem;
	line-height: 1.3;
	margin: 0 0 0.5rem;
}

.is-style-yff-caution h2.yff-box-heading {
	color: var(--yff-amber-ink);
}

/* Evidence labels: always text ("Evidence: limited"), the colour only repeats it */
.yff-chip {
	display: inline-block;
	font-size: 0.8rem !important;
	font-weight: 600;
	line-height: 1.5;
	border-radius: 999px;
	padding: 3px 10px;
	margin: 0 0 10px !important;
}

.yff-chip-strong {
	background: var(--yff-surface);
	color: var(--yff-primary-dark);
	box-shadow: inset 0 0 0 1px var(--yff-primary);
}

.yff-chip-moderate {
	background: #FBEBE4;
	color: var(--yff-accent-ink);
}

.yff-chip-limited {
	background: #EEF0EE;
	color: #46524C;
}

.yff-chip-none {
	background: var(--yff-amber-tint);
	color: var(--yff-amber-ink);
	box-shadow: inset 0 0 0 1px #E8D3A8;
}

.is-style-yff-research .yff-chip-limited {
	background: var(--yff-surface);
}

/* ---------- Gear picks ---------- */

/* A :::picks box in the text */
.is-style-yff-picks {
	background: var(--yff-surface);
	border: 1px solid var(--yff-border);
	border-radius: var(--yff-radius);
	padding: 16px 20px;
	margin-top: 1.6rem;
	margin-bottom: 1.6rem;
}

.yff-pick {
	display: flex;
	gap: 14px;
	align-items: flex-start;
	padding: 12px 0;
	border-top: 1px solid var(--yff-border);
}

.entry-content .is-style-yff-picks .yff-picks {
	margin: 0;
}

.entry-content .is-style-yff-picks p.yff-box-title {
	margin-bottom: 0.3rem;
}

.yff-picks > .yff-pick:first-child {
	border-top: 0;
	padding-top: 4px;
}

.yff-pick-img {
	flex: 0 0 64px;
	width: 64px;
	height: 64px;
	border-radius: 8px;
	background: var(--yff-sand) center / cover no-repeat;
}

a.yff-pick-img:hover,
a.yff-pick-img:focus-visible {
	box-shadow: 0 0 0 2px var(--yff-primary);
}

/* Amazon's own product photo, when the photos are on (inc/amazon.php, AMAZON_PHOTOS) */
.yff-pick-img.has-photo {
	display: flex;
	align-items: center;
	justify-content: center;
	background: #fff;
	border: 1px solid var(--yff-border);
}

.yff-pick-img.has-photo img {
	max-width: 88%;
	max-height: 88%;
	width: auto;
	height: auto;
	object-fit: contain;
}

.yff-buy .yff-buy-img {
	flex: 0 0 88px;
	width: 88px;
	height: 88px;
}

/* Our own line drawings of each gear type (Amazon's images can't be stored, and loading them would be an outside request) */
.yff-icon-mat { background-image: url("assets/img/picks/mat.svg"); }
.yff-icon-block { background-image: url("assets/img/picks/block.svg"); }
.yff-icon-strap { background-image: url("assets/img/picks/strap.svg"); }
.yff-icon-bolster { background-image: url("assets/img/picks/bolster.svg"); }
.yff-icon-generic { background-image: url("assets/img/picks/generic.svg"); }

.yff-pick-body {
	flex: 1 1 auto;
	min-width: 0;
}

.entry-content .yff-pick-body p {
	margin: 0;
}

.entry-content .yff-pick-body .yff-pick-cta {
	margin-top: 0.55rem;
}

/* Lab placeholders: the drawing is dimmed, never the text (contrast) */
.yff-pick-demo .yff-pick-img {
	opacity: 0.7;
}

/* The button: the site's own green, never an imitation of Amazon's buttons */
.entry-content a.yff-btn,
.entry-content span.yff-btn {
	display: inline-block;
	padding: 0.5rem 1.1rem;
	border-radius: 10px;
	background: var(--yff-primary);
	color: #fff;
	font-weight: 600;
	font-size: 0.95rem;
	line-height: 1.35;
	text-decoration: none;
	min-height: 40px;
}

.entry-content a.yff-btn:hover,
.entry-content a.yff-btn:focus-visible {
	background: var(--yff-primary-dark);
	color: #fff;
}

.entry-content span.yff-btn {
	background: var(--yff-muted);
}

/* A gear guide's "See ... on Amazon" line: buttons, wrapping on phones */
.yff-buy {
	display: flex;
	flex-wrap: wrap;
	gap: 0.6rem;
	align-items: center;
	margin: 1rem 0 2rem;
}

.yff-buy a.yff-btn + a.yff-btn {
	background: transparent;
	color: var(--yff-primary);
	box-shadow: inset 0 0 0 2px var(--yff-primary);
}

.yff-buy a.yff-btn + a.yff-btn:hover {
	background: var(--yff-sage-tint);
	color: var(--yff-primary-dark);
}

.yff-picks-note {
	font-size: 0.82rem !important;
	color: var(--yff-muted);
	margin-top: 0.6rem;
}

/* "Helpful gear for this": the sticky sidebar box (desktop) and its copy in the text (phones and tablets) */
.yff-picks-box {
	border: 1px solid var(--yff-border);
	border-radius: var(--yff-radius);
	padding: 16px;
	background: var(--yff-surface);
}

.yff-picks-box .widget-title,
.primary-sidebar.widget-area .widget.yff-picks-box .widget-title {
	font-family: var(--yff-serif);
	font-size: 1.15rem;
	font-weight: 700;
	line-height: 1.3;
	letter-spacing: normal;
	text-transform: none;
	color: var(--yff-ink);
	margin: 0 0 10px;
	padding-bottom: 10px;
	border-bottom: 1px solid var(--yff-border);
}

.yff-picks-box ul {
	list-style: none;
	margin: 0;
	padding: 0;
}

.yff-picks-box li.yff-pick {
	display: grid;
	grid-template-columns: 64px 1fr;
	gap: 12px;
	margin: 0;
	padding: 10px 0;
	border-top: 1px solid var(--yff-border);
}

.yff-picks-box li.yff-pick:first-child {
	border-top: 0;
	padding-top: 2px;
}

.yff-pick-name {
	display: block;
	font-size: 0.98rem;
	line-height: 1.3;
	color: var(--yff-ink);
}

.yff-pick-reason {
	margin: 2px 0 4px !important;
	font-size: 0.88rem;
	line-height: 1.4;
	color: var(--yff-muted);
}

.yff-pick-go {
	font-size: 0.9rem;
	font-weight: 600;
	color: var(--yff-primary);
}

span.yff-pick-go {
	color: var(--yff-muted);
}

.yff-disclose {
	font-size: 0.8rem !important;
	line-height: 1.5;
	color: var(--yff-muted);
	margin: 10px 0 0 !important;
}

.yff-disclose a {
	color: var(--yff-muted);
}

.yff-picks-here,
.yff-picks-inline {
	display: none;
}

@media (max-width: 1024px) {
	.yff-picks-inline {
		display: block;
		margin: 1.6rem 0;
	}

	.primary-sidebar .yff-picks-box {
		display: none;
	}
}

/* ---------- Sidebar ---------- */
.primary-sidebar.widget-area .widget .widget-title {
	font-family: var(--yff-serif);
	font-size: 1.15rem;
	font-weight: 700;
	letter-spacing: normal;
	text-transform: none;
	color: var(--yff-ink);
	margin: 0 0 0.6rem;
}

.yff-side-list ul {
	list-style: none;
	margin: 0;
	padding: 0;
}

.yff-side-list li {
	margin: 0;
	padding: 0.5rem 0;
	border-bottom: 1px solid var(--yff-border);
	font-size: 0.95rem;
	line-height: 1.4;
}

.yff-side-list li:last-child {
	border-bottom: 0;
}

.yff-side-list a {
	color: var(--yff-ink);
	font-weight: 600;
	text-decoration: none;
}

.yff-side-list a:hover,
.yff-side-list a:focus-visible {
	color: var(--yff-primary);
	text-decoration: underline;
}

/* ---------- Sources, image credits ---------- */
.yff-sources {
	margin-top: 2.6rem;
	padding-top: 1.4rem;
	border-top: 1px solid var(--yff-border);
}

.entry-content .yff-sources h2 {
	font-size: 1.35rem;
	margin-top: 0;
}

.yff-sources ol {
	font-size: 0.93rem;
	line-height: 1.55;
	color: var(--yff-muted);
	padding-left: 1.3rem;
}

.yff-sources li + li {
	margin-top: 0.4rem;
}

.yff-sources .yff-credits {
	font-size: 0.85rem;
	color: var(--yff-muted);
}

/* ---------- Medical disclaimer (inc/template.php, after every guide) ---------- */
.yff-disclaimer {
	margin: 2rem 0 0;
	padding: 16px 20px;
	border: 1px solid var(--yff-border);
	border-radius: 10px;
	background: var(--yff-sand);
	font-size: 0.93rem;
	line-height: 1.55;
	color: var(--yff-text);
}

.yff-disclaimer p {
	margin: 0;
}

.yff-disclaimer .yff-disclaimer-title {
	font-family: var(--yff-serif);
	font-weight: 700;
	font-size: 1rem;
	color: var(--yff-ink);
	margin-bottom: 4px;
}

/* ---------- Images in guides ---------- */
.yff-shot img {
	border-radius: var(--yff-radius);
}

.entry-content figure.yff-shot.aligncenter {
	margin-left: 0;
	margin-right: 0;
}

.entry-content figure.yff-shot figcaption,
.entry-content figure.yff-shot .wp-element-caption {
	text-align: left;
}

.yff-shot figcaption {
	color: var(--yff-muted);
	font-size: 0.85rem;
	margin-top: 6px;
}

/* ---------- Author box, related guides, archives ---------- */
.entry-author {
	margin-top: 2.4rem;
}

.entry-author-style-normal {
	background: var(--yff-sand);
	border-radius: var(--yff-radius);
	padding: 1.4rem 1.5rem;
	border: 0;
}

.entry-author-name {
	font-family: var(--yff-serif);
	font-size: 1.15rem;
}

.entry-author-description {
	color: var(--yff-text);
	font-size: 1rem;
}

.entry-meta .author-avatar img,
.entry-author-avatar img {
	border-radius: 50%;
}

.entry-related {
	background: var(--yff-sand);
}

.entry-related-title {
	font-size: 1.6rem;
}

/* Related guides (template-parts/content/entry_related.php, a plain grid instead of Kadence's carousel): three
   compact cards in the 720 px column, picture and title only */
.yff-related .entry-summary,
.yff-related .entry-footer {
	display: none;
}

.yff-related .loop-entry .entry-title {
	font-size: 1.05rem;
	line-height: 1.3;
	margin: 0;
}

.yff-related-grid {
	list-style: none;
	margin: 0;
	padding: 0;
}

.loop-entry {
	border: 1px solid var(--yff-border);
	border-radius: var(--yff-radius);
	overflow: hidden;
	box-shadow: none;
}

.loop-entry .entry-title {
	font-size: 1.25rem;
	line-height: 1.3;
}

/* Kadence's unboxed archives drop the card padding (.archive.content-style-unboxed .entry-content-wrap) */
.loop-entry .entry-content-wrap,
body.content-style-unboxed .loop-entry .entry-content-wrap {
	padding: 16px 20px 20px;
}

.loop-entry .entry-summary p {
	font-size: 1rem;
	line-height: 1.55;
	color: var(--yff-muted);
}

/* Pages: title band */
.entry-hero.page-hero-section .entry-header,
.entry-hero.post-archive-hero-section .entry-header {
	min-height: 0;
	padding-top: 2.4rem;
	padding-bottom: 2.2rem;
}

.entry-hero .entry-title {
	margin-bottom: 0;
}

.page:not(.home) .content-area {
	margin-top: 2.2rem;
}

.archive-description {
	max-width: 46rem;
	color: var(--yff-muted);
}

/* ---------- Home page sections (site/build.py home()) ---------- */
.home .entry-content > .yff-band {
	margin: 0;
}

.yff-band {
	padding: 52px 0;
}

.yff-band-sand {
	background: var(--yff-sand);
}

.yff-wrap {
	max-width: var(--global-content-width);
	margin: 0 auto;
	padding: 0 var(--global-content-edge-padding, 1.5rem);
	box-sizing: border-box;
}

.yff-wrap > *,
.yff-wrap > .wp-block-group__inner-container > * {
	margin-top: 0;
}

.entry-content .yff-band h2 {
	margin: 0 0 0.6em;
}

/* Hero */
.yff-hero {
	background: var(--yff-sand);
	padding: 56px 0;
}

.yff-hero-grid {
	display: grid;
	grid-template-columns: 1.2fr 0.8fr;
	gap: 32px;
	align-items: center;
}

.entry-content .yff-hero h1 {
	font-size: clamp(2rem, 1.4rem + 1.8vw, 2.5rem);
	line-height: 1.2;
	margin: 0 0 0.5em;
}

.entry-content .yff-hero .yff-lead {
	margin-bottom: 0;
}

.yff-hero .wp-block-buttons {
	gap: 12px;
	margin-top: 22px;
}

.yff-hero-art {
	margin: 0;
}

.yff-hero-art img {
	display: block;
	width: 100%;
	height: auto;
}

/* Buttons: terracotta for the first step, green outline for the second */
.wp-block-button .wp-block-button__link {
	border-radius: 10px;
	padding: 12px 22px;
	min-height: 44px;
}

.wp-block-button.yff-btn-accent .wp-block-button__link {
	background: var(--yff-accent);
	color: #fff;
}

.wp-block-button.yff-btn-accent .wp-block-button__link:hover {
	background: var(--yff-accent-ink);
}

.wp-block-button.is-style-outline .wp-block-button__link {
	border: 2px solid var(--yff-primary);
	color: var(--yff-primary);
	background: transparent;
	padding: 10px 20px;
}

.wp-block-button.is-style-outline .wp-block-button__link:hover {
	background: var(--yff-sage-tint);
	color: var(--yff-primary-dark);
}

/* Section heads: title left, "All ... ->" right */
.yff-section-head {
	display: flex;
	flex-wrap: wrap;
	align-items: baseline;
	justify-content: space-between;
	column-gap: 12px;
}

.yff-section-head h2 {
	margin: 0 0 0.6em;
}

.entry-content .wp-block-group.yff-section-head {
	margin: 0;
}

.entry-content .yff-section-head p {
	margin: 0;
}

.yff-more a {
	font-weight: 600;
	text-decoration: none;
}

.yff-more a:hover {
	text-decoration: underline;
}

/* Grids */
.yff-grid-3,
.yff-grid-4 {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 20px;
}

.yff-grid-4 {
	grid-template-columns: repeat(4, minmax(0, 1fr));
}

.yff-grid-3 > *,
.yff-grid-4 > *,
.yff-grid-3 > .wp-block-group__inner-container > *,
.yff-grid-4 > .wp-block-group__inner-container > * {
	margin: 0;
}

/* Cards: whole card clickable through its title link, no nested links */
.yff-card {
	position: relative;
	display: flex;
	flex-direction: column;
	background: var(--yff-surface);
	border: 1px solid var(--yff-border);
	border-radius: var(--yff-radius);
	padding: 20px;
	transition: border-color 150ms ease, box-shadow 150ms ease;
}

.yff-card:hover {
	border-color: var(--yff-primary);
	box-shadow: 0 6px 20px rgba(30, 42, 37, 0.07);
}

.yff-card:focus-within {
	border-color: var(--yff-primary);
}

.entry-content .yff-card h3 {
	font-size: 1.2rem;
	line-height: 1.3;
	margin: 0 0 0.35em;
}

.yff-card h3 a {
	color: var(--yff-ink);
	text-decoration: none;
}

.yff-card h3 a::after {
	content: "";
	position: absolute;
	inset: 0;
	border-radius: var(--yff-radius);
}

.yff-card h3 a:focus-visible {
	outline: none;
}

.yff-card h3 a:focus-visible::after {
	outline: 2px solid var(--yff-primary);
	outline-offset: 2px;
}

.entry-content .yff-card p {
	color: var(--yff-muted);
	font-size: 1rem;
	line-height: 1.55;
	margin: 0;
}

/* Kadence's .single-content p / figure margins beat light card rules: these are specific enough to win */
.entry-content .yff-card .yff-card-img {
	margin: -20px -20px 14px;
	border-radius: var(--yff-radius) var(--yff-radius) 0 0;
	overflow: hidden;
	aspect-ratio: 1200 / 630;
	background: var(--yff-sage-tint);
}

.entry-content .yff-card .yff-card-img img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	display: block;
}

.entry-content .yff-pose-card .yff-card-img {
	margin: 0 0 12px;
	border-radius: 8px;
	aspect-ratio: 3 / 2;
}

.entry-content .yff-card p.yff-tag {
	align-self: flex-start;
	font-size: 0.78rem;
	font-weight: 600;
	letter-spacing: 0.04em;
	text-transform: uppercase;
	color: var(--yff-accent-ink);
	margin-bottom: 6px;
}

.entry-content .yff-card p.yff-card-meta {
	margin-top: auto;
	padding-top: 12px;
	font-size: 0.85rem;
}

.entry-content .yff-card p.yff-sk {
	font-family: var(--yff-serif);
	font-style: italic;
	font-size: 0.95rem;
	margin-bottom: 10px;
}

.entry-content .yff-card p.yff-badge {
	align-self: flex-start;
	margin-top: auto;
	color: var(--yff-primary-dark);
	font-size: 0.8rem;
}

.entry-content .yff-card p.yff-chip {
	align-self: flex-start;
}

/* Start-here steps */
.entry-content .yff-step p.yff-step-num {
	display: inline-grid;
	place-items: center;
	align-self: flex-start;
	width: 34px;
	height: 34px;
	border-radius: 50%;
	background: var(--yff-sage-tint);
	color: var(--yff-primary-dark);
	font-weight: 700;
	margin-bottom: 10px;
}

/* Goals: eight tiles with line icons */
.yff-goals {
	display: grid;
	grid-template-columns: repeat(4, minmax(0, 1fr));
	gap: 14px;
}

.entry-content .yff-goals a {
	display: flex;
	align-items: center;
	gap: 12px;
	min-height: 56px;
	padding: 14px 16px;
	background: var(--yff-surface);
	border: 1px solid var(--yff-border);
	border-radius: var(--yff-radius);
	color: var(--yff-ink);
	font-weight: 600;
	line-height: 1.3;
	text-decoration: none;
}

.entry-content .yff-goals a:hover {
	border-color: var(--yff-primary);
	color: var(--yff-primary-dark);
}

.yff-ico {
	flex: none;
	width: 28px;
	height: 28px;
	background: center / contain no-repeat;
}

.yff-ico-flexibility { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%232F6B55' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 18c4-8 12-8 16 0'/%3E%3Ccircle cx='12' cy='6' r='2'/%3E%3C/svg%3E"); }
.yff-ico-mobility { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%232F6B55' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='8'/%3E%3Cpath d='M12 4v4M20 12h-4'/%3E%3C/svg%3E"); }
.yff-ico-strength { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%232F6B55' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3 12h3M18 12h3M6 8v8M18 8v8M6 12h12'/%3E%3C/svg%3E"); }
.yff-ico-back-care { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%232F6B55' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 3c-3 4-3 14 0 18M9 7h6M9 12h6M9 17h6'/%3E%3C/svg%3E"); }
.yff-ico-sleep { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%232F6B55' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M15 4a8 8 0 1 0 5 11 6 6 0 0 1-5-11z'/%3E%3C/svg%3E"); }
.yff-ico-stress { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%232F6B55' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3 12c3-4 6 4 9 0s6 4 9 0'/%3E%3C/svg%3E"); }
.yff-ico-runners { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%232F6B55' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='15' cy='4.5' r='2'/%3E%3Cpath d='M13 8l-3 5 4 3-1 5M10 13l-4 2M14 9l4 2'/%3E%3C/svg%3E"); }
.yff-ico-desk-workers { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%232F6B55' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='4' y='5' width='16' height='10' rx='1'/%3E%3Cpath d='M9 19h6M12 15v4'/%3E%3C/svg%3E"); }

/* Gear: what you actually need */
.yff-gear-row {
	display: grid;
	grid-template-columns: 1.3fr 1fr;
	gap: 32px;
	align-items: center;
}

.entry-content .yff-gear-row .wp-block-buttons {
	margin-top: 18px;
}

.entry-content ul.yff-needs {
	list-style: none;
	margin: 0;
	padding: 0;
	display: grid;
	gap: 10px;
}

.entry-content ul.yff-needs li {
	background: var(--yff-sand);
	border-radius: 10px;
	padding: 14px 16px;
	margin: 0;
}

/* Sections alternate white and sand by position (build.py home()): sand-coloured tiles turn white on a sand band */
.entry-content .yff-band-sand ul.yff-needs li {
	background: var(--yff-surface);
}

.yff-needs strong {
	display: block;
	font-family: var(--yff-serif);
	font-weight: 700;
	color: var(--yff-ink);
}

/* Trust strip */
.yff-trust {
	background: var(--yff-primary-dark);
	color: #fff;
	padding: 36px 0;
	box-shadow: 0 1px 0 0 var(--yff-primary-dark); /* covers a sub-pixel seam above the footer */
}

.yff-trust-row {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 24px;
}

.entry-content .yff-trust h3 {
	color: #fff;
	font-size: 1.15rem;
	margin: 0 0 0.3em;
}

.entry-content .yff-trust p {
	color: #D6E3DC;
	margin: 0;
	font-size: 1rem;
}

.entry-content .yff-trust a {
	color: #fff;
}

.entry-content .yff-trust p.yff-trust-more {
	margin-top: 20px;
	font-weight: 600;
}

@media (max-width: 1024px) {
	.yff-hero {
		padding: 32px 0;
	}

	.yff-hero-grid,
	.yff-gear-row,
	.yff-trust-row,
	.yff-grid-3 {
		grid-template-columns: 1fr;
	}

	.yff-hero-art {
		display: none;
	}

	.yff-goals,
	.yff-grid-4 {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}

	.yff-band {
		padding: 36px 0;
	}
}

/* ---------- Footer (inc/template.php footer()) ---------- */
.yff-footer {
	background: var(--yff-night);
	color: #C9D4CE;
	font-size: 0.95rem;
	padding: 28px 0;
	margin-top: 0;
}

.yff-footer ul {
	list-style: none;
	display: flex;
	flex-wrap: wrap;
	gap: 6px 18px;
	margin: 0 0 10px;
	padding: 0;
}

.yff-footer li {
	margin: 0;
}

.yff-footer a {
	color: #fff;
	text-decoration: none;
	display: inline-block;
	padding: 4px 0;
}

.yff-footer a:hover {
	text-decoration: underline;
}

.yff-footer .yff-footer-topics a {
	color: #C9D4CE;
}

.yff-footer-topics {
	padding-bottom: 6px;
	margin-bottom: 10px;
	border-bottom: 1px solid rgba(255, 255, 255, 0.12);
}

.yff-footer-legal {
	margin: 4px 0 0;
}

/* ---------- Focus and motion ---------- */
:where(a, button, input, summary, .wp-block-button__link):focus-visible {
	outline: 2px solid var(--yff-primary);
	outline-offset: 2px;
	border-radius: 3px;
}

:where(.yff-footer, .yff-trust, #mobile-drawer, #search-drawer) :where(a, button, input):focus-visible {
	outline-color: #fff;
}

@media (prefers-reduced-motion: reduce) {
	.yff-card {
		transition: none;
	}
}
