/* ==========================================================================
   Theme primitives — ported from tokens/wordpress.css + base.css
   Class-based primitives keep their original names (.postmeta, .byline,
   .notice, .tagcloud, .principle-tag, …) for use inside patterns, AND are
   mapped onto the equivalent core blocks (query-pagination, search,
   comments, tag-cloud) so stock blocks render in-brand with no classes.
   Values reference --wp--preset--* / --wp--custom--* only.
   ========================================================================== */

/* Positioning context for .principle-tag / is-style-principle-tag */
.sheris-relative {
	position: relative;
}

/* Measure utilities — composition text widths from the UI kit
   (layout.selfStretch only applies inside flex parents, so these are classes) */
.sheris-measure-300 { max-width: 300px; }
.sheris-measure-420 { max-width: 420px; }
.sheris-measure-560 { max-width: 560px; }
.sheris-measure-860 { max-width: 860px; }
.sheris-center { margin-left: auto !important; margin-right: auto !important; }

/* Recipe-card media must beat the prose img reset (height:auto) inside post content */
.sheris-recipe-card__media {
	overflow: hidden;
}

:is(.prose, .wp-block-post-content) .sheris-recipe-card__media img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	border-radius: 0;
}

/* Query-loop post card — the one card anatomy applied to core post blocks */
.sheris-post-card {
	background: var(--wp--custom--color--surface-card);
	border: 1px solid var(--wp--custom--color--border-subtle);
	border-radius: var(--wp--custom--radius--card, 22px);
	overflow: hidden;
	display: flex;
	flex-direction: column;
	height: 100%;
	transition: transform var(--wp--custom--duration--base) var(--wp--custom--ease--standard), box-shadow var(--wp--custom--duration--base) var(--wp--custom--ease--standard);
}

.sheris-post-card:hover {
	transform: translateY(-4px);
	box-shadow: 0 16px 36px rgba(15, 53, 73, 0.14);
}

.sheris-post-card .wp-block-post-featured-image {
	height: 190px;
	margin: 0;
}

.sheris-post-card .wp-block-post-featured-image img,
.sheris-post-card .wp-block-post-featured-image a {
	width: 100%;
	height: 100%;
	object-fit: cover;
	display: block;
}

/* Gradient placeholder when a post has no featured image */
.sheris-post-card .wp-block-post-featured-image:empty {
	background: var(--wp--preset--gradient--tide);
}

.sheris-post-card__body {
	padding: 20px 22px 22px;
	display: flex;
	flex-direction: column;
	gap: 6px;
	flex: 1;
}

.sheris-post-card .wp-block-post-title {
	font-size: var(--wp--preset--font-size--lg);
	line-height: 1.1;
	margin: 0;
}

.sheris-post-card .wp-block-post-title a {
	color: var(--wp--custom--color--text-primary);
	text-decoration: none;
}

.sheris-post-card .wp-block-post-excerpt {
	font-size: var(--wp--preset--font-size--sm);
	font-weight: 300;
	color: var(--wp--custom--color--text-secondary);
	margin: 0;
}

.sheris-post-card .wp-block-post-excerpt__more-link {
	display: none;
}

/* ---- Accessible focus (DS: 2–3px teal outlines) ---- */
:where(a, button, input, select, textarea, summary, [tabindex]):focus-visible {
	outline: 3px solid var(--wp--preset--color--teal-300);
	outline-offset: 2px;
}

/* ---- Post meta / byline ---- */
.byline {
	display: flex;
	align-items: center;
	gap: 14px;
	font-family: var(--wp--preset--font-family--sans);
}

.avatar,
.wp-block-avatar img {
	width: 48px;
	height: 48px;
	border-radius: 50%;
	object-fit: cover;
	background: var(--wp--preset--color--teal-100);
	border: 2px solid #fff;
	box-shadow: var(--wp--preset--shadow--sm);
}

.byline .who {
	display: flex;
	flex-direction: column;
	gap: 2px;
}

.byline .name {
	font-weight: 700;
	font-size: var(--wp--preset--font-size--sm);
	color: var(--wp--custom--color--text-primary);
}

.byline .meta {
	font-size: var(--wp--preset--font-size--xs);
	color: var(--wp--custom--color--text-secondary);
}

.postmeta,
.wp-block-post-terms,
.wp-block-post-date {
	font-family: var(--wp--preset--font-family--sans);
	font-size: var(--wp--preset--font-size--xs);
	font-weight: 700;
	letter-spacing: var(--wp--custom--tracking--wider);
	text-transform: uppercase;
	color: var(--wp--custom--color--text-secondary);
}

.postmeta {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 8px 14px;
}

.postmeta .cat,
.wp-block-post-terms.is-category-terms a {
	color: var(--wp--preset--color--coral-deep);
}

.wp-block-post-terms a {
	color: inherit;
	text-decoration: none;
}

/* ---- Breadcrumbs ---- */
.breadcrumb {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 10px;
	font-family: var(--wp--preset--font-family--sans);
	font-size: var(--wp--preset--font-size--xs);
	font-weight: 700;
	letter-spacing: var(--wp--custom--tracking--wider);
	text-transform: uppercase;
}

.breadcrumb a {
	color: var(--wp--custom--color--text-secondary);
	text-decoration: none;
}

.breadcrumb a:hover {
	color: var(--wp--custom--color--text-link-hover);
}

.breadcrumb .sep { color: var(--wp--preset--color--ink-300); }
.breadcrumb .here { color: var(--wp--custom--color--text-primary); }

/* ---- Notices (front-end alerts; Woo reuses these tones later) ---- */
.notice {
	display: flex;
	gap: 14px;
	align-items: flex-start;
	font-family: var(--wp--preset--font-family--sans);
	font-size: var(--wp--preset--font-size--sm);
	line-height: var(--wp--custom--leading--normal);
	border-radius: var(--wp--custom--radius--lg);
	padding: 16px 20px;
}

.notice b {
	display: block;
	font-size: var(--wp--preset--font-size--xs);
	font-weight: 800;
	letter-spacing: var(--wp--custom--tracking--wider);
	text-transform: uppercase;
	margin-bottom: 3px;
}

.notice-success { background: var(--wp--preset--color--aqua-100); color: #1d4f49; }
.notice-info { background: var(--wp--preset--color--teal-100); color: var(--wp--preset--color--teal-900); }
.notice-warning { background: #FBF0D7; color: #6b5416; }
.notice-error { background: var(--wp--preset--color--coral-100); color: #7c2d1a; }

/* ---- Principle / section tag — coral margin label (base.css) ----
   Pin to the left edge of a position:relative section.
   Also exposed as the core/group style variation `is-style-principle-tag`. */
.principle-tag,
.wp-block-group.is-style-principle-tag {
	position: absolute;
	top: 24px;
	left: 0;
	z-index: var(--wp--custom--z--raised);
	background: var(--wp--preset--color--coral);
	color: #fff;
	font-family: var(--wp--preset--font-family--serif);
	font-weight: 400;
	font-size: 13px;
	letter-spacing: 0.16em;
	text-transform: uppercase;
	padding: 9px 18px 9px 24px;
	border-radius: 0 999px 999px 0;
	box-shadow: 0 4px 14px rgba(0, 0, 0, 0.18);
	width: fit-content;
}

.principle-tag small,
.wp-block-group.is-style-principle-tag small {
	display: block;
	font-family: var(--wp--preset--font-family--sans);
	font-weight: 300;
	font-size: 10px;
	letter-spacing: 0.08em;
	opacity: 0.9;
	text-transform: none;
}

/* Zero out group margins/padding inside the label so it stays a tag */
.wp-block-group.is-style-principle-tag > * {
	margin: 0;
	color: inherit;
	font-family: inherit;
	font-size: inherit;
	letter-spacing: inherit;
	text-transform: inherit;
}

/* ==========================================================================
   Section recipes shared across patterns (from the UI kit)
   ========================================================================== */

/* Kicker — tiny tracked uppercase intro line */
p.sheris-kicker,
.sheris-kicker {
	font-family: var(--wp--preset--font-family--sans);
	font-size: var(--wp--preset--font-size--xs);
	font-weight: 300;
	letter-spacing: var(--wp--custom--tracking--wider);
	text-transform: uppercase;
	color: var(--wp--preset--color--flame);
	margin: 0;
}

p.sheris-kicker.sheris-kicker--light,
.sheris-kicker--light {
	color: var(--wp--preset--color--gold);
}

/* Icon circle — 60px teal-100 disc with a Lucide glyph */
.sheris-icon-circle {
	width: 60px;
	height: 60px;
	border-radius: 50%;
	background: var(--wp--preset--color--teal-100);
	display: flex;
	align-items: center;
	justify-content: center;
	margin-left: auto;
	margin-right: auto;
}

.sheris-icon-circle .wp-block-image {
	margin: 0;
	line-height: 0;
}

.sheris-icon-circle img,
.sheris-icon-circle svg {
	width: 26px;
	height: 26px;
}

/* Numbered editorial rows — oversized teal-300 numerals, 3px first rule */
.sheris-numbered__row {
	display: grid;
	grid-template-columns: 72px 1fr;
	gap: 24px;
	padding: 26px 0;
	border-top: 1px solid var(--wp--custom--color--border-subtle);
	align-items: baseline;
}

.sheris-numbered__row:first-child {
	border-top: 3px solid var(--wp--preset--color--ink-900);
}

.sheris-numbered__num {
	font-family: var(--wp--preset--font-family--serif);
	font-weight: 400;
	font-size: 52px;
	line-height: 1;
	color: var(--wp--preset--color--teal-300);
	margin: 0;
}

.sheris-numbered__row h3 {
	font-size: var(--wp--preset--font-size--xl);
	margin: 0 0 6px;
}

.sheris-numbered__row p {
	font-family: var(--wp--preset--font-family--sans);
	font-weight: 300;
	font-size: var(--wp--preset--font-size--sm);
	color: var(--wp--custom--color--text-secondary);
	line-height: var(--wp--custom--leading--relaxed);
	margin: 0;
}

/* Collection tile — native Cover with icon disc + bottom scrim (Home.jsx) */
.sheris-collection {
	overflow: hidden;
	height: 240px;
	min-height: 0 !important;
	padding: 0 !important;
}

.sheris-collection::after {
	content: "";
	position: absolute;
	inset: 0;
	z-index: 1;
	background: linear-gradient(rgba(0, 0, 0, 0) 40%, rgba(15, 53, 73, 0.55));
	pointer-events: none;
}

/* Inner container spans the full tile so the icon anchors to the tile's
   top-left and the stretched link covers the whole card; text sits at the
   bottom via flex-end (cover's bottom-left content position). */
.sheris-collection .wp-block-cover__inner-container {
	position: relative;
	z-index: 2;
	height: 100%;
	box-sizing: border-box;
	display: flex;
	flex-direction: column;
	justify-content: flex-end;
	align-items: flex-start;
	padding: 22px;
}

.sheris-collection__icon {
	position: absolute;
	top: 18px;
	left: 18px;
	width: 44px;
	height: 44px;
	border-radius: 50%;
	background: rgba(255, 255, 255, 0.9);
}

.sheris-collection__icon .wp-block-image {
	margin: 0;
	line-height: 0;
}

.sheris-collection__icon img {
	width: 22px;
	height: 22px;
}

.sheris-collection .sheris-collection__title {
	font-size: var(--wp--preset--font-size--xl);
	color: #fff;
	margin: 0;
}

.sheris-collection__title a {
	color: #fff;
	text-decoration: none;
}

.sheris-collection__title a::after {
	content: "";
	position: absolute;
	inset: 0;
}

.sheris-collection .sheris-collection__count {
	font-family: var(--wp--preset--font-family--sans);
	font-size: var(--wp--preset--font-size--sm);
	color: rgba(255, 255, 255, 0.85);
	margin: 4px 0 0;
}

/* Recipe post pieces (RecipePost.jsx) */
.sheris-chef-note {
	padding-left: 18px;
	border-left: 3px solid var(--wp--preset--color--coral);
	margin-top: 20px;
}

.sheris-statbar {
	display: flex;
	flex-wrap: wrap;
	gap: 20px;
	margin: 40px 0;
	padding: 28px 0;
	border-top: 1px solid var(--wp--custom--color--border-subtle);
	border-bottom: 1px solid var(--wp--custom--color--border-subtle);
}

.sheris-stat {
	text-align: center;
	flex: 1;
	min-width: 120px;
}

.sheris-stat__n {
	font-family: var(--wp--preset--font-family--serif);
	font-weight: 400;
	text-transform: uppercase;
	font-size: var(--wp--preset--font-size--2-xl);
	color: var(--wp--preset--color--teal-deep);
}

.sheris-stat__label {
	font-family: var(--wp--preset--font-family--sans);
	font-size: var(--wp--preset--font-size--xs);
	letter-spacing: var(--wp--custom--tracking--wider);
	text-transform: uppercase;
	color: var(--wp--custom--color--text-secondary);
	margin-top: 6px;
}

.sheris-ingredients__group {
	margin-bottom: 18px;
}

.sheris-ingredients__head {
	font-family: var(--wp--preset--font-family--sans);
	font-size: var(--wp--preset--font-size--xs);
	font-weight: 800;
	letter-spacing: var(--wp--custom--tracking--wide);
	text-transform: uppercase;
	color: var(--wp--preset--color--teal-deep);
	margin-bottom: 10px;
}

.sheris-ingredients__group label {
	display: flex;
	gap: 12px;
	align-items: flex-start;
	font-family: var(--wp--preset--font-family--sans);
	font-size: var(--wp--preset--font-size--base);
	cursor: pointer;
	margin-bottom: 12px;
}

.sheris-ingredients__group input[type="checkbox"] {
	width: 22px;
	height: 22px;
	margin: 0;
	accent-color: var(--wp--custom--color--action-primary);
	flex-shrink: 0;
}

.sheris-steps {
	list-style: none;
	margin: 0;
	padding: 0;
	display: flex;
	flex-direction: column;
	gap: 20px;
}

.sheris-steps li {
	display: flex;
	gap: 16px;
	margin: 0;
}

.sheris-steps__n {
	flex-shrink: 0;
	width: 46px;
	height: 46px;
	border-radius: 50%;
	background: var(--wp--preset--color--teal-500);
	color: #fff;
	font-family: var(--wp--preset--font-family--serif);
	display: flex;
	align-items: center;
	justify-content: center;
	font-size: var(--wp--preset--font-size--lg);
}

.sheris-steps p {
	font-family: var(--wp--preset--font-family--sans);
	font-size: var(--wp--preset--font-size--base);
	line-height: var(--wp--custom--leading--relaxed);
	margin: 0;
	padding-top: 4px;
}

/* Seasonal ingredient pills */
.sheris-pillrow {
	display: flex;
	flex-wrap: wrap;
	gap: 10px;
	margin: 20px 0 26px;
}

.sheris-pillrow > * {
	margin: 0;
}

.sheris-pillrow span,
.sheris-pillrow > p {
	font-family: var(--wp--preset--font-family--sans);
	font-size: var(--wp--preset--font-size--sm);
	background: var(--wp--custom--color--surface-card);
	border: 1px solid var(--wp--custom--color--border-subtle);
	border-radius: var(--wp--custom--radius--pill, 999px);
	padding: 8px 16px;
	color: var(--wp--custom--color--text-primary);
}

/* Newsletter lead form — 60px+ Fitts input, shadowed */
.sheris-lead-form {
	display: flex;
	gap: 10px;
	margin-top: 24px;
	flex-wrap: wrap;
}

.sheris-lead-form input {
	font-family: var(--wp--preset--font-family--sans);
	font-size: 18px;
	font-weight: 300;
	padding: 22px 28px;
	border: none;
	border-radius: var(--wp--custom--radius--pill, 999px);
	background: var(--wp--custom--color--surface-card);
	box-shadow: var(--wp--preset--shadow--md);
	box-sizing: border-box;
	min-width: 0;
	max-width: 100%;
	flex: 1 1 280px;
}

.sheris-lead-form__btn {
	border: none;
	cursor: pointer;
	font-family: var(--wp--preset--font-family--sans);
	font-weight: 400;
	text-transform: uppercase;
	letter-spacing: 1px;
	font-size: 14px;
	padding: 15px 28px;
	border-radius: var(--wp--custom--radius--pill, 999px);
	background: var(--wp--custom--color--action-primary);
	color: var(--wp--custom--color--text-on-brand);
	box-shadow: var(--wp--preset--shadow--brand);
	transition: background var(--wp--custom--duration--base) var(--wp--custom--ease--standard);
}

.sheris-lead-form__btn:hover {
	background: var(--wp--custom--color--action-primary-hover);
}

/* Reel strip — 3:4 gradient Covers, play discs */
.sheris-reels {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
	gap: 16px;
}

.sheris-reel {
	aspect-ratio: 3 / 4;
	min-height: 0;
	overflow: hidden;
}

.sheris-reel__play {
	width: 46px;
	height: 46px;
	border-radius: 50%;
	background: rgba(255, 255, 255, 0.85);
	margin-inline: auto;
}

.sheris-reel__play .wp-block-image {
	margin: 0;
	line-height: 0;
}

.sheris-reel__play img {
	width: 20px;
	height: 20px;
}

/* Recipes filter row — whole serif word is the target (Fitts) */
.sheris-filter {
	display: flex;
	flex-wrap: wrap;
	gap: 0 8px;
	align-items: baseline;
	margin: 16px 0 44px;
}

.sheris-filter a {
	font-family: var(--wp--preset--font-family--serif);
	font-weight: 400;
	text-transform: uppercase;
	font-size: var(--wp--preset--font-size--3-xl);
	padding: 8px 10px;
	margin: -8px -2px;
	color: var(--wp--preset--color--ink-300);
	text-decoration: none;
	transition: color var(--wp--custom--duration--base) var(--wp--custom--ease--standard);
}

.sheris-filter a:hover,
.sheris-filter a.is-current {
	color: var(--wp--custom--color--text-primary);
}

/* Pricing tiers (Club.jsx) */
.sheris-tier {
	background: var(--wp--custom--color--surface-card);
	border-radius: var(--wp--custom--radius--card, 22px);
	box-shadow: var(--wp--preset--shadow--md);
	border: 2px solid transparent;
	padding: var(--wp--preset--spacing--8, 32px);
	font-family: var(--wp--preset--font-family--sans);
	display: flex;
	flex-direction: column;
	height: 100%;
}

.sheris-tier--best {
	box-shadow: var(--wp--preset--shadow--brand);
	border-color: var(--wp--custom--color--border-brand);
}

.sheris-tier .sheris-tier__name,
.sheris-tier h3.sheris-tier__name {
	font-family: var(--wp--preset--font-family--serif);
	font-weight: 400;
	text-transform: uppercase;
	font-size: var(--wp--preset--font-size--2-xl);
	margin: 0;
}

.sheris-tier p.sheris-tier__price {
	margin: 10px 0 20px;
}

.sheris-tier__price strong {
	font-family: var(--wp--preset--font-family--serif);
	font-weight: 400;
	text-transform: uppercase;
	font-size: var(--wp--preset--font-size--3-xl);
	color: var(--wp--preset--color--teal-deep);
}

.sheris-tier__price span {
	font-size: var(--wp--preset--font-size--sm);
	font-weight: 300;
	color: var(--wp--custom--color--text-secondary);
}

ul.sheris-tier__feats {
	flex: 1;
	margin: 0 0 22px;
	padding: 0;
	list-style: none;
}

ul.sheris-tier__feats li {
	margin: 0;
	padding: 10px 0;
	border-top: 1px solid var(--wp--custom--color--border-subtle);
	font-size: var(--wp--preset--font-size--sm);
	font-weight: 300;
	color: var(--wp--custom--color--text-secondary);
}

ul.sheris-tier__feats li:first-child {
	border-top: none;
}

/* ==========================================================================
   Recipe article (sheris/recipe-article) — field-driven single-recipe layout
   ========================================================================== */

.sheris-recipe-article__head {
	max-width: 1140px;
	margin: 0 auto;
	padding: 56px 24px 0;
	text-align: center;
}

.sheris-recipe-article__kicker {
	justify-content: center;
}

.sheris-recipe-article__kicker a.cat {
	color: var(--wp--preset--color--coral-deep);
	text-decoration: none;
}

.sheris-recipe-article__title {
	font-size: var(--wp--preset--font-size--4-xl);
	line-height: 1.08;
	margin: 18px 0 20px;
}

.sheris-recipe-article__date {
	font-family: var(--wp--preset--font-family--sans);
	font-size: var(--wp--preset--font-size--sm);
	color: var(--wp--custom--color--text-secondary);
	margin: 0;
}

/* Print button — circle disc like the design's social icons */
.sheris-recipe-article__print {
	width: 34px;
	height: 34px;
	border-radius: 50%;
	border: none;
	cursor: pointer;
	background: var(--wp--preset--color--teal-100);
	display: inline-flex;
	align-items: center;
	justify-content: center;
	margin-top: 14px;
	padding: 0;
	transition: background var(--wp--custom--duration--fast) var(--wp--custom--ease--standard);
}

.sheris-recipe-article__print:hover {
	background: var(--wp--preset--color--teal-300);
}

.sheris-recipe-article__print svg {
	width: 16px;
	height: 16px;
	stroke: var(--wp--preset--color--teal-900);
}

/* Print mode — just the recipe, no chrome */
@media print {
	.sheris-header,
	.sheris-header__spacer,
	.sheris-footer,
	.sheris-similar,
	.sheris-recipe-article__print,
	footer.wp-block-template-part,
	header.wp-block-template-part {
		display: none !important;
	}

	.wp-block-sheris-recipe-article {
		padding: 0 !important;
	}

	.sheris-recipe-article__hero img {
		height: 260px !important;
	}
}

.sheris-recipe-article__hero {
	max-width: 1140px;
	margin: 32px auto 0;
	padding: 0 24px;
}

.sheris-recipe-article__hero img {
	width: 100%;
	height: 440px;
	object-fit: cover;
	border-radius: var(--wp--custom--radius--card, 22px);
	display: block;
}

.sheris-recipe-article__intro {
	padding-top: 40px;
	padding-inline: 24px;
}

.sheris-recipe-article__intro > p:first-child {
	font-size: var(--wp--preset--font-size--xl);
	font-weight: 300;
	line-height: var(--wp--custom--leading--relaxed);
	color: var(--wp--custom--color--text-primary);
}

.sheris-recipe-article__cols {
	max-width: 1140px;
	margin: 8px auto 0;
	padding: 0 24px;
	display: grid;
	grid-template-columns: 36fr 64fr;
	gap: 44px;
	align-items: start;
}

.sheris-recipe-article__cols h2 {
	font-size: var(--wp--preset--font-size--2-xl);
	margin: 0 0 16px;
}

/* Wave divider + serving note (RecipePost.jsx WaveRule + closing) */
.sheris-recipe-article__closing {
	max-width: 940px;
	margin: 48px auto 0;
	padding: 0 24px;
}

.sheris-recipe-article__wave {
	display: block;
	width: 100%;
	height: 26px;
	margin: 8px 0;
	color: #7FC0C8;
}

.sheris-recipe-article__serving {
	font-family: var(--wp--preset--font-family--sans);
	font-size: var(--wp--preset--font-size--lg);
	font-weight: 300;
	line-height: var(--wp--custom--leading--relaxed);
	color: var(--wp--custom--color--text-secondary);
	text-align: center;
	margin: 8px 0 0;
}

/* YouTube video embed — responsive 16:9, 22px radius */
.sheris-recipe-article__video {
	max-width: 1140px;
	margin: 48px auto 0;
	padding: 0 24px;
}

.sheris-video-embed {
	position: relative;
	aspect-ratio: 16 / 9;
	border-radius: var(--wp--custom--radius--card, 22px);
	overflow: hidden;
	background: var(--wp--preset--color--ink-900);
}

.sheris-video-embed iframe {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	border: 0;
	display: block;
}

.sheris-recipe-article__byline {
	max-width: 940px;
	margin: 48px auto 0;
	padding: 0 24px;
}

@media (max-width: 767px) {
	.sheris-recipe-article__cols {
		grid-template-columns: 1fr;
	}

	.sheris-recipe-article__hero img {
		height: 260px;
	}
}

/* Field-driven Ingredients card (wysiwyg h4 + ul) */
.sheris-ingredients--auto {
	border-radius: var(--wp--custom--radius--card, 22px);
	padding: var(--wp--preset--spacing--6, 24px);
}

.sheris-ingredients--auto h4 {
	font-family: var(--wp--preset--font-family--sans);
	font-size: var(--wp--preset--font-size--xs);
	font-weight: 800;
	letter-spacing: var(--wp--custom--tracking--wide);
	text-transform: uppercase;
	color: var(--wp--preset--color--teal-deep);
	margin: 18px 0 10px;
}

.sheris-ingredients--auto ul {
	list-style: none;
	margin: 0;
	padding: 0;
	display: flex;
	flex-direction: column;
	gap: 12px;
}

.sheris-ingredients--auto li {
	font-family: var(--wp--preset--font-family--sans);
	font-size: var(--wp--preset--font-size--base);
	margin: 0;
}

/* Real, checkable rows — render.php wraps each li in label + checkbox */
.sheris-ingredients--auto li label {
	display: flex;
	gap: 12px;
	align-items: flex-start;
	cursor: pointer;
}

.sheris-ingredients--auto li input[type="checkbox"] {
	width: 22px;
	height: 22px;
	margin: 0;
	flex-shrink: 0;
	accent-color: var(--wp--custom--color--action-primary);
	cursor: pointer;
}

.sheris-ingredients--auto li input[type="checkbox"]:checked + span {
	color: var(--wp--custom--color--text-secondary);
	text-decoration: line-through;
	text-decoration-color: var(--wp--preset--color--ink-300);
}

/* Field-driven Instructions (wysiwyg ol) — teal numbered circles */
.sheris-steps-auto ol {
	list-style: none;
	counter-reset: sheris-step;
	margin: 0;
	padding: 0;
	display: flex;
	flex-direction: column;
	gap: 20px;
}

.sheris-steps-auto li {
	counter-increment: sheris-step;
	display: flex;
	gap: 16px;
	font-family: var(--wp--preset--font-family--sans);
	font-size: var(--wp--preset--font-size--base);
	line-height: var(--wp--custom--leading--relaxed);
	margin: 0;
}

.sheris-steps-auto li::before {
	content: counter(sheris-step);
	flex-shrink: 0;
	width: 46px;
	height: 46px;
	border-radius: 50%;
	background: var(--wp--preset--color--teal-500);
	color: #fff;
	font-family: var(--wp--preset--font-family--serif);
	display: flex;
	align-items: center;
	justify-content: center;
	font-size: var(--wp--preset--font-size--lg);
}

/* Similar recipes wrapper */
.sheris-similar {
	max-width: 1140px;
	margin: 64px auto 0;
	padding: 0 24px;
}

.sheris-similar__heading {
	font-size: var(--wp--preset--font-size--2-xl);
	margin: 0 0 22px;
}

/* Tier CTAs — variation CSS isn't emitted inside wp:html blocks, so the
   button looks are declared here explicitly (sm size, full width) */
.sheris-tier .wp-block-button {
	width: 100%;
}

.sheris-tier .wp-block-button__link {
	display: block;
	width: 100%;
	box-sizing: border-box;
	text-align: center;
	font-size: 12px;
	padding: 9px 16px;
	color: var(--wp--custom--color--text-on-brand);
}

.sheris-tier .is-style-outline .wp-block-button__link {
	background: transparent;
	color: var(--wp--custom--color--action-primary);
	border: 2px solid var(--wp--custom--color--border-brand);
}

.sheris-tier .is-style-outline .wp-block-button__link:hover {
	background: var(--wp--preset--color--teal-100);
}

.sheris-tier .is-style-primary .wp-block-button__link {
	box-shadow: var(--wp--preset--shadow--brand);
}

/* Celiac-101 numbered circles (Mindset.jsx) */
p.sheris-gfstep__n,
.sheris-gfstep__n {
	width: 44px;
	height: 44px;
	border-radius: 50%;
	border: 1px solid rgba(255, 255, 255, 0.6);
	display: flex;
	align-items: center;
	justify-content: center;
	font-family: var(--wp--preset--font-family--serif);
	font-size: var(--wp--preset--font-size--base);
	color: #fff;
	margin-bottom: 14px;
}

p.sheris-gfstep__title,
.sheris-gfstep__title {
	font-family: var(--wp--preset--font-family--sans);
	font-size: var(--wp--preset--font-size--sm);
	font-weight: 300;
	letter-spacing: var(--wp--custom--tracking--wide);
	text-transform: uppercase;
	color: #fff;
	margin: 0 0 6px;
}

/* Email-capture row (Club header) — sunken pill input + coral button */
.sheris-capture {
	display: flex;
	gap: 10px;
	margin-top: 28px;
	flex-wrap: wrap;
}

.sheris-capture input {
	font-family: var(--wp--preset--font-family--sans);
	font-size: 18px;
	font-weight: 300;
	padding: 20px 28px;
	border: none;
	border-radius: var(--wp--custom--radius--pill, 999px);
	background: var(--wp--custom--color--surface-sunken);
	box-sizing: border-box;
	min-width: 0;
	flex: 1 1 240px;
}

.sheris-capture__btn {
	border: none;
	cursor: pointer;
	font-family: var(--wp--preset--font-family--sans);
	font-weight: 400;
	text-transform: uppercase;
	letter-spacing: 0.06em;
	font-size: 16px;
	padding: 20px 44px;
	border-radius: var(--wp--custom--radius--pill, 999px);
	background: var(--wp--custom--color--action-secondary);
	color: var(--wp--custom--color--text-on-brand);
	transition: background var(--wp--custom--duration--base) var(--wp--custom--ease--standard);
}

.sheris-capture__btn:hover {
	background: var(--wp--custom--color--action-secondary-hover);
}

/* Card grid — auto-fit reflow used by recipe/collection grids */
.sheris-grid {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(240px, 1fr));
	gap: 24px;
}

/* These grids live inside flow-layout groups — WordPress core's flow gap
   (margin-block-start on every sibling after the first) would misalign
   grid rows, so the grid's own gap is the only spacing source. */
.sheris-grid > *,
.sheris-reels > * {
	margin-block-start: 0 !important;
	margin-block-end: 0 !important;
}

.sheris-grid--wide {
	grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
}

@media (max-width: 767px) {
	.sheris-grid,
	.sheris-grid--wide {
		grid-template-columns: 1fr;
	}

	.wp-block-sheris-recipe-card.is-featured {
		grid-column: auto;
	}
}

/* ==========================================================================
   Button style variations — generated-button parity layer.
   The CANONICAL definitions (rest + :hover/:active/:focus-visible states)
   live natively in styles/blocks/button-*.json + theme.json (WP 7.0
   pseudo-class states). WordPress only emits that CSS for real block
   instances — buttons generated inside plugin render.php (dialog, toast,
   ritual-rotator) never get it, so this layer mirrors the same tokens for
   them. Keep values in lockstep with the JSON files.
   ========================================================================== */

.wp-block-button.is-style-primary .wp-block-button__link {
	background-color: var(--wp--preset--color--teal-500);
	color: var(--wp--preset--color--cream-50);
	box-shadow: var(--wp--preset--shadow--brand);
}

.wp-block-button.is-style-secondary .wp-block-button__link {
	background-color: var(--wp--preset--color--coral-500);
	color: var(--wp--preset--color--cream-50);
}

.wp-block-button.is-style-outline .wp-block-button__link {
	background-color: transparent;
	color: var(--wp--preset--color--teal-500);
	border: 2px solid var(--wp--preset--color--teal-500);
}

.wp-block-button.is-style-ghost .wp-block-button__link {
	background-color: transparent;
	color: var(--wp--preset--color--teal-500);
}

/* Primary (teal) — hover steps down the ramp, press one more */
.wp-block-button.is-style-primary .wp-block-button__link:hover,
.wp-block-button.is-style-primary .wp-block-button__link:focus {
	background-color: var(--wp--preset--color--teal-600);
	color: var(--wp--preset--color--cream-50);
}

.wp-block-button.is-style-primary .wp-block-button__link:active {
	background-color: var(--wp--preset--color--teal-700);
}

/* Secondary (coral) — hover per Button.jsx: action-secondary-hover */
.wp-block-button.is-style-secondary .wp-block-button__link:hover,
.wp-block-button.is-style-secondary .wp-block-button__link:focus {
	background-color: var(--wp--preset--color--coral-600);
	color: var(--wp--preset--color--cream-50);
}

.wp-block-button.is-style-secondary .wp-block-button__link:active {
	background-color: var(--wp--preset--color--coral-deep);
}

/* Outline / Ghost — hover fills teal-100 per Button.jsx */
.wp-block-button.is-style-outline .wp-block-button__link:hover,
.wp-block-button.is-style-outline .wp-block-button__link:focus,
.wp-block-button.is-style-ghost .wp-block-button__link:hover,
.wp-block-button.is-style-ghost .wp-block-button__link:focus {
	background-color: var(--wp--preset--color--teal-100);
	color: var(--wp--preset--color--teal-500);
}

.wp-block-button.is-style-outline .wp-block-button__link:active,
.wp-block-button.is-style-ghost .wp-block-button__link:active {
	background-color: var(--wp--preset--color--teal-100);
	color: var(--wp--preset--color--teal-600);
}

/* Icon button — square pill, icon-only content */
.wp-block-button.is-style-icon .wp-block-button__link {
	padding: 12px;
	min-width: 44px;
	line-height: 1;
}

/* Press feedback (Button.jsx: scale .97 on mousedown) */
.wp-block-button__link:active {
	transform: scale(0.97);
}

.wp-block-button__link {
	transition: background var(--wp--custom--duration--base) var(--wp--custom--ease--standard), transform var(--wp--custom--duration--fast) var(--wp--custom--ease--standard);
}

/* Size classes — replace per-button inline font-size/padding so the button
   markup carries only a className and stays self-validating in the editor. */
.wp-block-button.sheris-btn-sm .wp-block-button__link {
	font-size: 12px;
	padding: 9px 16px;
}

.wp-block-button.sheris-btn-lg .wp-block-button__link {
	font-size: 14px;
	padding: 15px 28px;
}

.wp-block-button.sheris-btn-xl .wp-block-button__link {
	font-size: 16px;
	padding: 22px 48px;
}

/* Native-paragraph resets inside prose context (statbar, pullquote, byline) */
.sheris-stat p,
.pullquote p,
.byline p {
	margin: 0 !important;
}

.sheris-stat p.sheris-stat__label {
	margin-top: 6px !important;
}

/* Header logo as core Image block */
.sheris-header__logo.wp-block-image {
	margin: 0;
	flex-shrink: 0;
	line-height: 0;
}

/* Prose-leak guards — component text inside page content keeps its margins */
:is(.prose, .wp-block-post-content) :is(p.sheris-kicker, .sheris-collection__count, p.sheris-gfstep__title) {
	margin-bottom: 0;
}

:is(.prose, .wp-block-post-content) p.sheris-tier__price {
	margin: 10px 0 20px;
}

:is(.prose, .wp-block-post-content) :is(.sheris-collection__title, .sheris-tier__name, .sheris-collection__count) {
	margin-top: 0;
	margin-bottom: 0;
}

:is(.prose, .wp-block-post-content) p.sheris-gfstep__n {
	margin: 0 0 14px;
}

:is(.prose, .wp-block-post-content) .sheris-tier__price {
	margin: 10px 0 20px;
}

:is(.prose, .wp-block-post-content) .sheris-tier__name {
	font-size: var(--wp--preset--font-size--2-xl);
	letter-spacing: normal;
}

:is(.prose, .wp-block-post-content) .sheris-collection__title {
	font-size: var(--wp--preset--font-size--xl);
	letter-spacing: normal;
}

/* Query-loop recipe grids — post-template renders <li> items */
ul.sheris-grid {
	list-style: none;
	margin: 0;
	padding: 0;
}

.sheris-grid > li {
	margin: 0;
	list-style: none;
	min-width: 0;
}

.sheris-grid > li > .wp-block-sheris-recipe-card {
	height: 100%;
}

.sheris-grid--featured-first > li:first-child {
	grid-column: span 2;
}

.sheris-grid--featured-first > li:first-child .sheris-recipe-card__media {
	height: 300px;
}

.sheris-grid--featured-first > li:first-child .sheris-recipe-card__title {
	font-size: var(--wp--preset--font-size--2-xl);
}

@media (max-width: 767px) {
	.sheris-grid--featured-first > li:first-child {
		grid-column: auto;
	}

	.sheris-grid--featured-first > li:first-child .sheris-recipe-card__media {
		height: 190px;
	}
}

/* ==========================================================================
   Full-bleed overlay hero — lives here (not header.css) so add_editor_style
   gives the editor iframe the same scrim as the front end.
   ========================================================================== */

.sheris-hero--overlay {
	position: relative;
	min-height: 100vh;
	display: flex;
	align-items: center;
	justify-content: center;
	text-align: center;
	overflow: hidden;
	z-index: 0;
}

/* Teal scrim over the hero image — the Cover block carries the photo at
   dimRatio 0 (native, self-validating markup) and the graded overlay lives
   here so the block stays canonical. Preset-driven via color-mix. */
.sheris-hero--overlay::after {
	content: "";
	position: absolute;
	inset: 0;
	z-index: 1;
	pointer-events: none;
	background: linear-gradient(
		color-mix(in srgb, var(--wp--preset--color--teal-900) 34%, transparent) 0%,
		color-mix(in srgb, var(--wp--preset--color--teal-900) 12%, transparent) 45%,
		color-mix(in srgb, var(--wp--preset--color--teal-900) 30%, transparent) 100%
	);
}

.sheris-hero--overlay .wp-block-cover__inner-container {
	position: relative;
	z-index: 2;
}
/* Section headings inside field-driven Instructions (wysiwyg h4 + ol).
   Mirrors .sheris-ingredients--auto h4 so both columns read as one system. */
.sheris-steps-auto h4 {
	font-family: var(--wp--preset--font-family--sans);
	font-size: var(--wp--preset--font-size--xs);
	font-weight: 800;
	letter-spacing: var(--wp--custom--tracking--wide);
	text-transform: uppercase;
	color: var(--wp--preset--color--teal-deep);
	margin: 32px 0 16px;
}

.sheris-steps-auto h4:first-child {
	margin-top: 0;
}