/**
 * Studiolo — block content styles (handle: studiolo-blocks).
 *
 * 1. .st-flow — the block-content wrapper (widths, alignments, rhythm)
 * 2. Registered block styles (see inc/blocks/block-styles.php)
 * 3. Core blocks
 * 4. Full-bleed sections (kept last so they win ties)
 *
 * Shared typography for .is-style-lead / -label / -display / -card and the
 * colour scopes .is-style-surface / -inverted / -accent live in base.css next
 * to their .st-* twins. Everything here is built from --st-* tokens; inline
 * block-support values (padding, colours, radius, gap) always win.
 *
 * @package Studiolo
 */

/* ==========================================================================
   1. .st-flow
   ========================================================================== */

.st-flow {
	padding-inline: var(--st-gutter);
}

.st-flow::after {
	content: "";
	display: table;
	clear: both;
}

.st-flow > * {
	max-inline-size: var(--st-content-width);
	margin-block: 0;
	margin-inline: auto;
}

/* Wide-content variant: default children use the wide measure. */
.st-flow--wide > * {
	max-inline-size: var(--st-wide-width);
}

.st-flow > .alignwide {
	max-inline-size: var(--st-wide-width);
	clear: both;
}

.st-flow > .alignfull {
	inline-size: auto;
	max-inline-size: none;
	margin-inline: calc(-1 * var(--st-gutter));
	clear: both;
}

/* Floats align to the edges of the content column, not the viewport. */
.st-flow > .alignleft,
.st-flow > .alignright {
	max-inline-size: min(50%, calc(var(--st-content-width) * 0.5));
	margin-block: var(--st-space-3xs) var(--st-space-s);
}

.st-flow > .alignleft {
	float: left;
	float: inline-start;
	margin-inline: max(0px, (100% - var(--st-content-width)) / 2) var(--st-space-l);
}

.st-flow > .alignright {
	float: right;
	float: inline-end;
	margin-inline: var(--st-space-l) max(0px, (100% - var(--st-content-width)) / 2);
}

@media (max-width: 39.99em) {
	.st-flow > .alignleft,
	.st-flow > .alignright {
		float: none;
		max-inline-size: 100%;
		margin-inline: auto;
	}
}

/*
 * Vertical rhythm. Every rule is (0,1,0) thanks to :where(), so source order
 * decides: base gap → media/wide → headings → after headings → full-bleed.
 */
.st-flow > * + * {
	margin-block-start: var(--st-space-m);
}

.st-flow > :where(*) + :where(.alignwide, .wp-block-image, .wp-block-gallery, .wp-block-embed, .wp-block-video, .wp-block-cover, .wp-block-media-text, .wp-block-columns, .wp-block-table, .wp-block-pullquote, .is-style-statement, .has-background, .is-style-surface, .is-style-inverted, .is-style-accent, .is-style-card, .is-style-bordered, hr, .wp-block-separator, .wp-block-query, .wp-block-latest-posts, .wp-block-file),
.st-flow > :where(.alignwide, .wp-block-image, .wp-block-gallery, .wp-block-embed, .wp-block-video, .wp-block-cover, .wp-block-media-text, .wp-block-columns, .wp-block-table, .wp-block-pullquote, .is-style-statement, .has-background, .is-style-surface, .is-style-inverted, .is-style-accent, .is-style-card, .is-style-bordered, hr, .wp-block-separator, .wp-block-query, .wp-block-latest-posts, .wp-block-file) + :where(*) {
	margin-block-start: var(--st-space-xl);
}

.st-flow > :where(*) + :where(h2, .is-style-display),
.st-flow > :where(*) + :where(.is-style-label:has(+ :is(h1, h2, .is-style-display))) {
	margin-block-start: var(--st-space-2xl);
}

.st-flow > :where(*) + :where(h3),
.st-flow > :where(*) + :where(.is-style-label:has(+ h3)) {
	margin-block-start: var(--st-space-xl);
}

.st-flow > :where(*) + :where(h4, h5, h6) {
	margin-block-start: var(--st-space-l);
}

.st-flow > :where(h1, h2, .is-style-display) + :where(*) {
	margin-block-start: var(--st-space-m);
}

.st-flow > :where(h3, h4, h5, h6) + :where(*) {
	margin-block-start: var(--st-space-s);
}

.st-flow > :where(*) + :where(.alignfull),
.st-flow > :where(.alignfull) + :where(*) {
	margin-block-start: var(--st-space-2xl);
}

/* Stacked full-bleed sections sit edge to edge; their padding sets the rhythm. */
.st-flow > :where(.alignfull) + :where(.alignfull) {
	margin-block-start: 0;
}

/* Spacer blocks are the spacing. */
.st-flow > :where(.wp-block-spacer),
.st-flow > :where(.wp-block-spacer) + :where(*) {
	margin-block-start: 0;
}

.st-flow > :first-child {
	margin-block-start: 0;
}

/* Eyebrow labels hug the heading they introduce (any layout). */
.is-style-label + :is(h1, h2, h3, h4, h5, h6, .is-style-display, .is-style-lead) {
	margin-block-start: var(--st-space-xs);
}

/* ==========================================================================
   2. Block styles
   ========================================================================== */

/* Paragraph: Lead / Label, Heading: Display — typography in base.css. */
p.is-style-label {
	text-wrap: balance;
}

/* Button: Arrow link — text link with an animated arrow (mask: follows currentColor). */
.wp-block-button.is-style-arrow > .wp-block-button__link {
	gap: 0.55em;
	padding: 0;
	border: 0;
	border-radius: 0;
	background-color: transparent;
	color: var(--st-color-text);
	text-align: start;
	text-decoration-line: underline;
	text-decoration-thickness: max(1px, 0.08em);
	text-decoration-color: color-mix(in srgb, currentColor 30%, transparent);
	text-underline-offset: 0.45em;
}

.wp-block-button.is-style-arrow > .wp-block-button__link.has-background {
	padding-inline: var(--st-space-m);
	border-radius: var(--st-radius-button);
}

.wp-block-button.is-style-arrow > .wp-block-button__link::after {
	content: "";
	flex: none;
	inline-size: 1.2em;
	block-size: 1.2em;
	background-color: currentColor;
	-webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 12h15M13 6l6 6-6 6'/%3E%3C/svg%3E") center / contain no-repeat;
	mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 12h15M13 6l6 6-6 6'/%3E%3C/svg%3E") center / contain no-repeat;
	transition: translate var(--st-duration-fast) var(--st-ease);
}

.wp-block-button.is-style-arrow > .wp-block-button__link:dir(rtl)::after {
	scale: -1 1;
}

.wp-block-button.is-style-arrow > .wp-block-button__link:hover {
	box-shadow: none;
	color: var(--st-color-accent);
	text-decoration-color: currentColor;
}

.wp-block-button.is-style-arrow > .wp-block-button__link:hover::after,
.wp-block-button.is-style-arrow > .wp-block-button__link:focus-visible::after {
	translate: calc(var(--st-b-dir) * 0.3em) 0;
}

/* Group: Card (look follows the Card style setting; see base.css). */
.wp-block-group.is-style-card.has-background {
	padding: var(--st-space-l);
	border-radius: var(--st-radius-card);
}

/* Group: Surface / Inverted / Accent — padding & corners (colours: base.css scopes). */
.wp-block-group:where(.has-background, .is-style-surface, .is-style-inverted, .is-style-accent) {
	padding: var(--st-space-xl) var(--st-space-l);
}

.wp-block-group:where(.has-background, .is-style-surface, .is-style-inverted, .is-style-accent):where(:not(.alignfull)) {
	border-radius: var(--st-radius-lg);
}

/* Group: Top rule. */
.wp-block-group.is-style-bordered {
	padding-block-start: var(--st-space-m);
	border-block-start: var(--st-b-rule) solid var(--st-color-text);
}

/* Columns: Divided — hairlines centred in the gutter, horizontal once stacked. */
.wp-block-columns.is-style-divided {
	--st-b-divide-gap: var(--st-space-2xl);
	column-gap: var(--st-b-divide-gap);
	row-gap: var(--st-b-divide-gap);
}

.wp-block-columns.is-style-divided > .wp-block-column {
	position: relative;
}

.wp-block-columns.is-style-divided > .wp-block-column + .wp-block-column::before {
	content: "";
	position: absolute;
	inset-block: 0;
	inset-inline-start: calc(var(--st-b-divide-gap) * -0.5);
	border-inline-start: var(--st-b-rule) solid var(--st-color-border);
	pointer-events: none;
}

@media (max-width: 781px) {
	.wp-block-columns.is-style-divided:not(.is-not-stacked-on-mobile) > .wp-block-column + .wp-block-column::before {
		inset-block: calc(var(--st-b-divide-gap) * -0.5) auto;
		inset-inline: 0;
		border-inline-start: 0;
		border-block-start: var(--st-b-rule) solid var(--st-color-border);
	}
}

/*
 * List: Divided / Plain. A string marker (not `none`) keeps list semantics in
 * Safari/VoiceOver.
 */
:is(ul, ol).is-style-divided,
:is(ul, ol).is-style-plain {
	padding-inline-start: 0;
	list-style-type: "\200B";
}

:is(ul, ol).is-style-divided {
	border-block-start: var(--st-b-rule) solid var(--st-color-border);
}

:is(ul, ol).is-style-divided > li {
	margin-block-start: 0;
	padding-block: var(--st-space-s);
	border-block-end: var(--st-b-rule) solid var(--st-color-border);
}

ol.is-style-divided > li {
	position: relative;
	padding-inline-start: 2.5em;
}

ol.is-style-divided > li::before {
	content: counter(list-item, decimal-leading-zero);
	position: absolute;
	inset-block-start: calc(var(--st-space-s) + 0.2em);
	inset-inline-start: 0;
	color: var(--st-color-muted);
	font-family: var(--st-font-ui);
	font-size: var(--st-b-fs-xs);
	font-variant-numeric: tabular-nums;
	letter-spacing: var(--st-ui-tracking);
}

:is(ul, ol).is-style-plain > li + li {
	margin-block-start: var(--st-space-2xs);
}

/* Quote: Statement. */
.wp-block-quote.is-style-statement {
	padding: 0;
	border: 0;
	font-family: var(--st-font-heading);
	font-size: min(var(--st-fs-4), calc(6vw + 1rem));
	font-weight: var(--st-heading-weight);
	line-height: max(var(--st-heading-leading), 1.12);
	letter-spacing: var(--st-heading-tracking);
	font-synthesis: style;
	font-synthesis-weight: none;
	text-wrap: balance;
}

.wp-block-quote.is-style-statement::before {
	content: open-quote;
	content: open-quote / "";
	display: block;
	block-size: 0.5em;
	margin-block-end: var(--st-space-2xs);
	color: var(--st-color-accent);
	font-size: 2em;
	line-height: 1;
}

.wp-block-quote.is-style-statement p {
	font-size: inherit;
	line-height: inherit;
}

.wp-block-quote.is-style-statement cite {
	margin-block-start: var(--st-space-m);
	font-family: var(--st-font-ui);
	font-weight: 500;
	letter-spacing: var(--st-ui-tracking);
}

/* Image: Framed — a passe-partout on the surface colour. */
.wp-block-image.is-style-framed {
	padding: clamp(var(--st-space-m), 4vw, var(--st-space-2xl));
	border-radius: var(--st-radius-media);
	background-color: var(--st-color-surface);
}

.wp-block-image.is-style-framed img {
	border-radius: calc(var(--st-radius-media) * 0.4);
	box-shadow: var(--st-shadow-sm);
}

.wp-block-image.is-style-framed .wp-element-caption {
	margin-block-start: var(--st-space-s);
	text-align: center;
}

/* Cover: Readable scrim — a graded black veil under light text, on any image. */
.wp-block-cover.is-style-scrim::before {
	content: "";
	position: absolute;
	inset: 0;
	z-index: 1;
	background: linear-gradient(to top, rgb(0 0 0 / 0.72) 0%, rgb(0 0 0 / 0.4) 45%, rgb(0 0 0 / 0.14) 100%);
	pointer-events: none;
}

.wp-block-cover.is-style-scrim .wp-block-cover__inner-container,
.wp-block-cover.is-style-scrim.is-light .wp-block-cover__inner-container {
	color: #fff;
}

/* ==========================================================================
   3. Core blocks
   ========================================================================== */

/* Paragraph & heading with a background. */
:is(p, h1, h2, h3, h4, h5, h6).has-background {
	padding: var(--st-space-m) var(--st-space-l);
	border-radius: var(--st-radius);
}

/* Drop cap. */
.has-drop-cap:not(:focus)::first-letter {
	float: left;
	float: inline-start;
	margin-block: 0.06em 0;
	margin-inline: 0 0.1em;
	font-family: var(--st-font-heading);
	font-size: 3.6em;
	font-weight: var(--st-heading-weight);
	line-height: 0.82;
	text-transform: uppercase;
}

/* Columns. */
.wp-block-columns {
	row-gap: var(--st-space-l);
	column-gap: var(--st-space-xl);
}

.wp-block-columns.has-background {
	padding: var(--st-space-xl) var(--st-space-l);
	border-radius: var(--st-radius-lg);
}

.wp-block-column.has-background {
	padding: var(--st-space-l);
	border-radius: var(--st-radius-lg);
}

/* Buttons group. */
.wp-block-buttons {
	gap: var(--st-space-xs);
}

/* Image. */
.wp-block-image img {
	border-radius: var(--st-radius-media);
}

.wp-block-image.alignfull img {
	border-radius: 0;
}

/* Gallery. */
.wp-block-gallery.has-nested-images {
	--wp--style--unstable-gallery-gap: var(--st-space-s);
	gap: var(--st-space-s);
}

.wp-block-gallery.has-nested-images figure.wp-block-image {
	overflow: hidden;
	border-radius: var(--st-radius-media);
}

.wp-block-gallery.has-nested-images figure.wp-block-image img {
	border-radius: 0;
}

/* Two stacked overlay layers ≈ 80% at the text baseline, fading upwards. */
.wp-block-gallery.has-nested-images figure.wp-block-image figcaption {
	padding: var(--st-space-l) var(--st-space-s) var(--st-space-xs);
	background:
		linear-gradient(to top, var(--st-color-overlay), transparent 70%),
		linear-gradient(to top, var(--st-color-overlay), transparent);
	color: var(--st-color-bg);
	font-family: var(--st-font-ui);
	font-size: var(--st-b-fs-xs);
	line-height: 1.4;
	text-align: start;
}

.wp-block-gallery.has-nested-images figure.wp-block-image figcaption :any-link {
	color: inherit;
}

.wp-block-gallery .blocks-gallery-caption {
	inline-size: 100%;
}

/* Cover. */
.wp-block-cover,
.wp-block-cover-image {
	--st-color-focus: currentColor;
	padding: var(--st-space-xl) var(--st-space-l);
}

.wp-block-cover:not(.alignfull),
.wp-block-cover-image:not(.alignfull) {
	border-radius: var(--st-radius-media);
}

.wp-block-cover.alignfull,
.wp-block-cover-image.alignfull {
	padding-block: var(--st-space-2xl);
}

/* Media & text. */
.wp-block-media-text > .wp-block-media-text__content {
	padding: var(--st-space-l) clamp(var(--st-space-m), 6%, var(--st-space-2xl));
}

.wp-block-media-text:not(.has-background) > .wp-block-media-text__content {
	padding-block: 0;
}

.wp-block-media-text:not(.has-background):not(.alignfull) > .wp-block-media-text__media :is(img, video) {
	border-radius: var(--st-radius-media);
}

.wp-block-media-text.has-background:not(.alignfull) {
	overflow: hidden;
	border-radius: var(--st-radius-lg);
}

@media (max-width: 600px) {
	.wp-block-media-text.is-stacked-on-mobile:not(.has-background) > .wp-block-media-text__content {
		padding: var(--st-space-m) 0 0;
	}

	.wp-block-media-text.is-stacked-on-mobile.has-background > .wp-block-media-text__content {
		padding: var(--st-space-l) var(--st-space-m);
	}
}

/* Quote. */
.wp-block-quote {
	overflow-wrap: break-word;
}

.wp-block-quote:is(.has-text-align-center, .is-style-plain) {
	padding-inline-start: 0;
	border-inline-start: 0;
}

.wp-block-quote:is(.is-style-large, .is-large):not(.is-style-plain) {
	font-size: var(--st-fs-2);
}

/* Pullquote. */
.wp-block-pullquote {
	padding: var(--st-space-xl) 0;
	border-block: var(--st-b-rule) solid var(--st-color-text);
	font-family: var(--st-font-heading);
	font-size: var(--st-fs-3);
	line-height: max(var(--st-heading-leading), 1.15);
	letter-spacing: var(--st-heading-tracking);
	text-align: center;
}

.wp-block-pullquote blockquote {
	padding: 0;
	border: 0;
	font: inherit;
	letter-spacing: inherit;
}

.wp-block-pullquote p {
	font-size: inherit;
	line-height: inherit;
	text-wrap: balance;
}

.wp-block-pullquote cite {
	margin-block-start: var(--st-space-m);
}

.wp-block-pullquote.has-background {
	padding-inline: var(--st-space-l);
	border-radius: var(--st-radius-lg);
}

.wp-block-pullquote:is(.alignleft, .alignright) {
	font-size: var(--st-fs-2);
}

/* Separator. */
.wp-block-separator {
	block-size: 0;
	border: 0;
	border-block-start: var(--st-b-rule) solid var(--st-color-border);
	color: var(--st-color-border);
}

.wp-block-separator.has-alpha-channel-opacity {
	opacity: 1;
}

.wp-block-separator.has-background:not(.is-style-dots) {
	block-size: var(--st-b-rule);
	border: 0;
}

.wp-block-separator.has-text-color:not(.has-background):not(.is-style-dots) {
	border-block-start-color: currentColor;
}

.wp-block-separator.is-style-dots {
	block-size: auto;
	border: 0;
	background: none !important;
	color: var(--st-color-muted);
	line-height: 1;
	text-align: center;
}

.wp-block-separator.is-style-dots::before {
	content: "\00B7\00B7\00B7";
	padding-inline-start: 1em;
	font-family: var(--st-font-heading);
	font-size: var(--st-fs-2);
	letter-spacing: 1em;
}

/* Table. */
.wp-block-table {
	overflow-x: auto;
}

.wp-block-table table {
	inline-size: 100%;
	border-collapse: collapse;
}

.wp-block-table :where(table:not(.has-border-color):not([style*="border"])) :is(th, td) {
	padding: var(--st-space-xs) var(--st-space-s);
	border: 0;
	border-block-end: var(--st-b-rule) solid var(--st-color-border);
}

.wp-block-table :where(table:not(.has-border-color):not([style*="border"])) :is(thead, tfoot) {
	border: 0;
}

.wp-block-table :where(table:not(.has-border-color):not([style*="border"])) thead :is(th, td) {
	border-block-end-color: var(--st-color-text);
}

.wp-block-table :where(table:not(.has-border-color):not([style*="border"])) tfoot :is(th, td) {
	border-block-start: var(--st-b-rule) solid var(--st-color-text);
	border-block-end: 0;
}

/* Editorial: first and last cells sit flush with the text column. */
.wp-block-table:not(.is-style-stripes) :where(table:not(.has-border-color):not([style*="border"]):not(.has-background)) :is(th, td):first-child {
	padding-inline-start: 0;
}

.wp-block-table:not(.is-style-stripes) :where(table:not(.has-border-color):not([style*="border"]):not(.has-background)) :is(th, td):last-child {
	padding-inline-end: 0;
}

.wp-block-table.is-style-stripes {
	border-block-end: 0;
}

.wp-block-table.is-style-stripes :is(th, td) {
	border-color: transparent;
}

.wp-block-table.is-style-stripes tbody tr:nth-child(odd) {
	background-color: var(--st-color-surface);
}

/* Details (accordion). */
.wp-block-details {
	border-block: var(--st-b-rule) solid var(--st-color-border);
}

.wp-block-details + .wp-block-details {
	margin-block-start: 0;
	border-block-start: 0;
}

.wp-block-details.has-background {
	padding-inline: var(--st-space-m);
	border-radius: var(--st-radius);
}

.wp-block-details > summary {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: var(--st-space-s);
	min-block-size: 2.75rem;
	padding-block: var(--st-space-s);
	font-family: var(--st-font-heading);
	font-size: var(--st-fs-1);
	font-weight: var(--st-heading-weight);
	line-height: max(var(--st-heading-leading), 1.25);
	letter-spacing: calc(var(--st-heading-tracking) * 0.5);
	text-transform: var(--st-heading-case);
	font-synthesis: style;
	font-synthesis-weight: none;
	list-style: none;
	cursor: pointer;
	transition: color var(--st-duration-fast) var(--st-ease);
}

.wp-block-details > summary::-webkit-details-marker {
	display: none;
}

.wp-block-details > summary:hover {
	color: var(--st-color-accent);
}

/* Plus that turns into a minus. */
.wp-block-details > summary::after {
	--st-b-stroke: max(1.5px, var(--st-border-width));
	content: "";
	flex: none;
	inline-size: 0.75em;
	block-size: 0.75em;
	background:
		linear-gradient(currentColor, currentColor) center / 100% var(--st-b-stroke) no-repeat,
		linear-gradient(currentColor, currentColor) center / var(--st-b-stroke) 100% no-repeat;
	transition:
		rotate var(--st-duration) var(--st-ease),
		background-size var(--st-duration) var(--st-ease);
}

.wp-block-details[open] > summary::after {
	rotate: 180deg;
	background-size: 100% var(--st-b-stroke), var(--st-b-stroke) 0%;
}

.wp-block-details > summary + * {
	margin-block-start: 0;
}

.wp-block-details > :not(summary):last-child {
	padding-block-end: var(--st-space-m);
}

/* Smooth open/close where supported (no-op elsewhere; motion kill switch applies). */
.wp-block-details::details-content {
	overflow-y: clip;
	block-size: 0;
	transition:
		block-size var(--st-duration) var(--st-ease),
		content-visibility var(--st-duration) var(--st-ease) allow-discrete;
}

.wp-block-details[open]::details-content {
	block-size: auto;
}

/* Code, preformatted, verse. */
.wp-block-code {
	padding: var(--st-space-m);
	border: 0;
	border-radius: var(--st-radius);
	background-color: var(--st-color-surface);
}

.wp-block-code code {
	font-family: var(--st-b-mono);
}

.wp-block-preformatted {
	white-space: pre-wrap;
}

.wp-block-verse {
	overflow: auto;
	padding: 0;
	border-radius: 0;
	background: none;
	font-family: var(--st-font-heading);
	font-size: var(--st-fs-1);
	line-height: 1.55;
	letter-spacing: calc(var(--st-heading-tracking) * 0.4);
	white-space: pre-wrap;
}

.wp-block-verse.has-background {
	padding: var(--st-space-m) var(--st-space-l);
	border-radius: var(--st-radius);
}

/* Embeds, video, audio. */
.wp-block-embed.wp-has-aspect-ratio .wp-block-embed__wrapper,
.wp-block-video video {
	overflow: hidden;
	border-radius: var(--st-radius-media);
}

.wp-block-video video {
	display: block;
	inline-size: 100%;
}

.wp-block-audio audio {
	inline-size: 100%;
}

/* File. */
.wp-block-file {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: space-between;
	gap: var(--st-space-xs) var(--st-space-m);
	padding-block: var(--st-space-s);
	border-block: var(--st-b-rule) solid var(--st-color-border);
}

.wp-block-file:not(.wp-element-button) {
	font-size: inherit;
}

.wp-block-file > a:not(.wp-block-file__button) {
	overflow-wrap: anywhere;
}

.wp-block-file .wp-block-file__button {
	min-block-size: 2.25rem;
	margin: 0;
	padding: var(--st-space-2xs) var(--st-space-s);
	font-size: max(var(--st-b-fs-xs), 0.8125rem);
}

.wp-block-file .wp-block-file__embed {
	flex-basis: 100%;
	margin-block-end: var(--st-space-s);
	border-radius: var(--st-radius-media);
}

/* Search. */
.wp-block-search__label {
	display: block;
	margin-block-end: var(--st-space-2xs);
	color: var(--st-color-muted);
	font-family: var(--st-font-ui);
	font-size: var(--st-b-fs-xs);
	font-weight: 500;
	letter-spacing: var(--st-ui-tracking);
	text-transform: var(--st-ui-case);
}

.wp-block-search .wp-block-search__inside-wrapper {
	gap: var(--st-space-2xs);
}

.wp-block-search .wp-block-search__input {
	min-inline-size: 0;
	min-block-size: 2.75rem;
	margin: 0;
	padding: var(--st-space-xs) var(--st-space-s);
	border: var(--st-b-rule) solid color-mix(in srgb, var(--st-color-text) 45%, var(--st-color-border));
	border-radius: var(--st-radius-sm);
	background-color: var(--st-color-bg);
	color: var(--st-color-text);
	font-family: inherit;
	font-size: max(1rem, var(--st-fs-0));
	line-height: 1.4;
	transition: var(--st-b-transition);
}

.wp-block-search .wp-block-search__input:focus {
	border-color: var(--st-color-text);
}

.wp-block-search .wp-block-search__button {
	flex: none;
	margin: 0;
}

.wp-block-search .wp-block-search__button.has-icon {
	min-inline-size: 2.75rem;
	padding-inline: var(--st-space-xs);
	line-height: 0;
}

.wp-block-search .wp-block-search__button svg {
	inline-size: 1.25em;
	min-inline-size: 1.25em;
	block-size: 1.25em;
	min-block-size: 1.25em;
	fill: currentColor;
}

.wp-block-search.wp-block-search__button-inside .wp-block-search__inside-wrapper {
	padding: var(--st-space-3xs);
	border: var(--st-b-rule) solid color-mix(in srgb, var(--st-color-text) 45%, var(--st-color-border));
	border-radius: var(--st-radius-button);
	background-color: var(--st-color-bg);
	transition: var(--st-b-transition);
}

.wp-block-search.wp-block-search__button-inside .wp-block-search__inside-wrapper:focus-within {
	border-color: var(--st-color-text);
	outline: 2px solid var(--st-color-focus);
	outline-offset: 3px;
}

.wp-block-search.wp-block-search__button-inside .wp-block-search__inside-wrapper .wp-block-search__input {
	min-block-size: 2.25rem;
	padding: 0 var(--st-space-xs);
	border: 0;
	border-radius: 0;
	background-color: transparent;
	outline: 0;
}

.wp-block-search.wp-block-search__button-inside .wp-block-search__inside-wrapper .wp-block-search__button {
	min-block-size: 2.25rem;
	padding: var(--st-space-2xs) var(--st-space-s);
	border-radius: max(0px, calc(var(--st-radius-button) - var(--st-space-3xs)));
}

/* Social links: brand colours stay; targets grow to 44px invisibly. */
.wp-block-social-links .wp-social-link a {
	position: relative;
}

.wp-block-social-links .wp-social-link a::before {
	content: "";
	position: absolute;
	top: 50%;
	left: 50%;
	inline-size: max(100%, 2.75rem);
	block-size: max(100%, 2.75rem);
	translate: -50% -50%;
}

.wp-block-social-links .wp-social-link a:focus-visible {
	border-radius: inherit;
	outline-offset: 2px;
}

/* Latest posts. */
.wp-block-latest-posts.wp-block-latest-posts__list {
	padding-inline-start: 0;
	list-style: none;
}

.wp-block-latest-posts:not(.is-grid) {
	border-block-start: var(--st-b-rule) solid var(--st-color-border);
}

.wp-block-latest-posts:not(.is-grid) > li {
	margin-block-start: 0;
	padding-block: var(--st-space-m);
	border-block-end: var(--st-b-rule) solid var(--st-color-border);
}

.wp-block-latest-posts.is-grid {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(min(100%, 16rem), 1fr));
	gap: var(--st-space-xl) var(--st-space-l);
}

.wp-block-latest-posts.is-grid > li {
	inline-size: auto;
	min-inline-size: 0;
	margin: 0;
}

@media (min-width: 40em) {
	.wp-block-latest-posts.is-grid:is(.columns-2, .columns-3, .columns-4, .columns-5, .columns-6) {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}
}

@media (min-width: 60em) {
	.wp-block-latest-posts.is-grid.columns-3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
	.wp-block-latest-posts.is-grid.columns-4 { grid-template-columns: repeat(4, minmax(0, 1fr)); }
	.wp-block-latest-posts.is-grid.columns-5 { grid-template-columns: repeat(5, minmax(0, 1fr)); }
	.wp-block-latest-posts.is-grid.columns-6 { grid-template-columns: repeat(6, minmax(0, 1fr)); }
}

.wp-block-latest-posts__post-title {
	display: inline-block;
	font-family: var(--st-font-heading);
	font-size: var(--st-fs-2);
	font-weight: var(--st-heading-weight);
	line-height: max(var(--st-heading-leading), 1.2);
	letter-spacing: calc(var(--st-heading-tracking) * 0.75);
	text-transform: var(--st-heading-case);
	font-synthesis: style;
	font-synthesis-weight: none;
	text-decoration-line: none;
	text-wrap: balance;
}

.wp-block-latest-posts__post-title:hover {
	text-decoration-line: underline;
	text-decoration-thickness: max(1px, 0.05em);
	text-underline-offset: 0.14em;
}

.wp-block-latest-posts__post-date,
.wp-block-latest-posts__post-author {
	display: block;
	margin-block-start: var(--st-space-2xs);
	color: var(--st-color-muted);
	font-family: var(--st-font-ui);
	font-size: var(--st-b-fs-xs);
	font-weight: 500;
	letter-spacing: var(--st-ui-tracking);
	text-transform: var(--st-ui-case);
}

.wp-block-latest-posts__post-excerpt,
.wp-block-latest-posts__post-full-content {
	margin-block: var(--st-space-xs) 0;
	color: var(--st-color-muted);
}

.wp-block-latest-posts__featured-image {
	margin-block-end: var(--st-space-s);
}

.wp-block-latest-posts__featured-image img {
	border-radius: var(--st-radius-media);
}

.wp-block-latest-posts.is-grid .wp-block-latest-posts__featured-image:not(.alignleft):not(.alignright) :is(a, img) {
	display: block;
	inline-size: 100%;
}

/* Query loop. */
.wp-block-post-template-is-layout-grid {
	gap: var(--st-space-xl) var(--st-space-l);
}

@media (min-width: 37.5em) and (max-width: 59.99em) {
	.wp-block-post-template.is-layout-grid:is(.columns-3, .columns-4, .columns-5, .columns-6) {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}
}

.wp-block-post-template > li {
	min-inline-size: 0;
}

.wp-block-post-title :any-link {
	color: inherit;
}

.wp-block-post-date,
.wp-block-post-modified-date,
.wp-block-post-terms,
.wp-block-post-author-name,
.wp-block-post-author__name,
.wp-block-post-comments-count {
	color: var(--st-color-muted);
	font-family: var(--st-font-ui);
	font-size: var(--st-b-fs-xs);
	font-weight: 500;
	letter-spacing: var(--st-ui-tracking);
	text-transform: var(--st-ui-case);
}

:is(.wp-block-post-date, .wp-block-post-modified-date, .wp-block-post-terms, .wp-block-post-author-name) :any-link {
	color: inherit;
	text-decoration-line: none;
}

:is(.wp-block-post-date, .wp-block-post-modified-date, .wp-block-post-terms, .wp-block-post-author-name) :any-link:hover {
	color: var(--st-color-text);
	text-decoration-line: underline;
}

.wp-block-post-terms__separator {
	opacity: 0.6;
}

.wp-block-post-excerpt__excerpt {
	margin-block: 0;
}

.wp-block-post-excerpt__more-text {
	margin-block-start: var(--st-space-xs);
}

.wp-block-post-excerpt__more-link,
.wp-block-read-more {
	font-family: var(--st-font-ui);
	font-size: var(--st-b-fs-sm);
	font-weight: 500;
	letter-spacing: var(--st-ui-tracking);
	text-transform: var(--st-ui-case);
}

.wp-block-post-featured-image {
	overflow: hidden;
	border-radius: var(--st-radius-media);
}

.wp-block-post-featured-image img {
	transition: scale var(--st-duration) var(--st-ease);
}

.wp-block-post-featured-image.alignfull {
	border-radius: 0;
}

@media (prefers-reduced-motion: no-preference) {
	.st-motion .wp-block-post-featured-image a:hover img {
		scale: 1.03;
	}
}

/* Query pagination. */
.wp-block-query-pagination {
	gap: var(--st-space-xs);
	font-family: var(--st-font-ui);
	font-size: var(--st-b-fs-sm);
	font-weight: 500;
	letter-spacing: var(--st-ui-tracking);
	text-transform: var(--st-ui-case);
}

.wp-block-query-pagination :is(a, .page-numbers) {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-inline-size: 2.75rem;
	min-block-size: 2.75rem;
	text-decoration-line: none;
}

.wp-block-query-pagination .page-numbers.current {
	border-radius: var(--st-radius-button);
	background-color: var(--st-color-accent);
	color: var(--st-color-accent-contrast);
}

/* Navigation (basic). */
.wp-block-navigation {
	font-family: var(--st-font-ui);
	font-size: max(var(--st-b-fs-sm), 0.875rem);
	font-weight: 500;
	letter-spacing: var(--st-ui-tracking);
	text-transform: var(--st-ui-case);
}

.wp-block-navigation .wp-block-navigation-item__content {
	text-decoration-line: none;
}

.wp-block-navigation .wp-block-navigation-item__content:hover,
.wp-block-navigation .current-menu-item > .wp-block-navigation-item__content {
	text-decoration-line: underline;
	text-decoration-color: currentColor;
	text-underline-offset: 0.35em;
}

.wp-block-navigation:not(.has-background) .wp-block-navigation__submenu-container {
	padding-block: var(--st-space-2xs);
	border: var(--st-b-rule) solid var(--st-color-border);
	border-radius: var(--st-radius-sm);
	background-color: var(--st-color-bg);
	box-shadow: var(--st-shadow-md);
	color: var(--st-color-text);
}

.wp-block-navigation:not(.has-background) .wp-block-navigation__responsive-container.is-menu-open {
	background-color: var(--st-color-bg);
	color: var(--st-color-text);
}

/* Tag cloud. */
.wp-block-tag-cloud a {
	text-decoration-line: none;
}

.wp-block-tag-cloud.is-style-outline a {
	padding: 0.3em 0.85em;
	border: var(--st-b-rule) solid var(--st-color-border);
	border-radius: var(--st-radius-button);
	font-family: var(--st-font-ui);
	letter-spacing: var(--st-ui-tracking);
	text-transform: var(--st-ui-case);
	transition: var(--st-b-transition);
}

.wp-block-tag-cloud.is-style-outline a:hover {
	border-color: var(--st-color-text);
	color: var(--st-color-text);
}

/* Spacer. */
.wp-block-spacer {
	clear: both;
}

/* Footnotes. */
.wp-block-footnotes {
	padding-block-start: var(--st-space-m);
	border-block-start: var(--st-b-rule) solid var(--st-color-border);
	color: var(--st-color-muted);
	font-size: var(--st-b-fs-sm);
}

.wp-block-footnotes > li > a[href^="#"]:last-child {
	margin-inline-start: 0.25em;
	text-decoration-line: none;
}

sup.fn > a {
	padding-inline: 0.1em;
	font-family: var(--st-font-ui);
	font-weight: 500;
	text-decoration-line: none;
}

/* ==========================================================================
   4. Full-bleed sections
   ========================================================================== */

/* Content inside edge-to-edge blocks keeps the page gutter. */
.st-flow > .alignfull:where(.wp-block-group, .wp-block-cover, .wp-block-cover-image, .wp-block-columns, .wp-block-query, .wp-block-heading, .wp-block-pullquote, .wp-block-quote, .wp-block-table, .wp-block-latest-posts, .wp-block-buttons, .wp-block-search, .wp-block-social-links, .wp-block-details, .wp-block-post-template, .wp-block-footnotes) {
	padding-inline: var(--st-gutter);
}

/* Coloured full-width groups become sections. */
.wp-block-group.alignfull:where(.has-background, .is-style-surface, .is-style-inverted, .is-style-accent) {
	padding-block: var(--st-section);
}

/* A full-width child of a full-width group still bleeds (when the gutter padding is ours). */
.st-flow > .wp-block-group.alignfull.is-layout-constrained:not([style*="padding-left"]):not([style*="padding-right"]) > .alignfull {
	max-inline-size: none;
	margin-inline: calc(-1 * var(--st-gutter));
}

.st-flow > .alignfull:where(.wp-block-embed, .wp-block-video) :is(.wp-block-embed__wrapper, video) {
	border-radius: 0;
}

/* Captions of edge-to-edge media stay off the screen edge. */
.st-flow > .alignfull:where(.wp-block-image, .wp-block-gallery, .wp-block-embed, .wp-block-video) > .wp-element-caption {
	padding-inline: var(--st-gutter);
}