/* ==========================================================================
   Flower Gardening — main stylesheet
   Design system: tokens, typography, components, layouts, utilities.
   No external dependencies. No remote fonts. No image files. Mobile-first.

   Look: a flower border on cream paper — deep garden green for headings and
   the footer, leaf green for small shapes, bloom rose for links and buttons,
   with peony pink, marigold and lavender as accents. Serif display headings
   over a clean system sans. The decorative shapes (a five-petal blossom, a
   petal divider and a large pale bloom) are inline SVG data URIs, so nothing
   is requested from the network.

   Contrast reference (WCAG AA, calculated):
     ink         #1e2a23 on cream #fbf7ee ........... 13.9:1
     ink-soft    #3a4a42 on cream ................... 8.8:1
     ink-muted   #51605a on cream / blush / mint .... 6.2:1 / 5.9:1 / 5.3:1
     green       #1f4a35 on cream / white ........... 9.4:1 / 10.0:1
     rose        #b8325f on cream / white / blush ... 5.4:1 / 5.7:1 / 5.1:1
     white       #ffffff on rose #b8325f ............ 5.7:1
     rose-dark   #8e2448 on cream / blush ........... 7.8:1 / 7.5:1
     ink         #1e2a23 on marigold #eaa92b ........ 7.2:1
     footer text #cfe0d3 on green #1f4a35 ........... 7.2:1
   Leaf #3f7d55, pink #e58aa6, marigold #eaa92b and lavender #7b6bb8 are used
   for shapes and accents only, never for body text on a light background.
   ========================================================================== */

/* --------------------------------------------------------------------------
   1. Tokens
   -------------------------------------------------------------------------- */

:root {
	/* Color */
	--flg-cream: #fbf7ee;
	--flg-cream-deep: #f3ecdc;
	--flg-surface: #ffffff;
	--flg-ink: #1e2a23;
	--flg-ink-soft: #3a4a42;
	--flg-ink-muted: #51605a;
	--flg-green: #1f4a35;
	--flg-leaf: #3f7d55;
	--flg-leaf-light: #9cc8a8;
	--flg-mint: #dcecdf;
	--flg-mint-soft: #eef5ec;
	--flg-mint-line: #c3dcc8;
	--flg-rose: #b8325f;
	--flg-rose-dark: #8e2448;
	--flg-pink: #e58aa6;
	--flg-pink-light: #f4b9c9;
	--flg-blush: #fbeef1;
	--flg-blush-line: #f2cfd9;
	--flg-marigold: #eaa92b;
	--flg-marigold-soft: #fdf0cf;
	--flg-lavender: #7b6bb8;
	--flg-lavender-soft: #ebe7f7;
	--flg-line: #e4dccb;
	--flg-line-strong: #7d8a82;
	--flg-focus: #5d4e9c;

	/* Shapes drawn once and reused as backgrounds */
	--flg-petals: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 44 12'%3E%3Cpath fill='%233f7d55' d='M1 6C6 2 12 2 16 6C12 10 6 10 1 6ZM28 6C32 2 38 2 43 6C38 10 32 10 28 6Z'/%3E%3Cg fill='%23e58aa6'%3E%3Ccircle cx='22' cy='2.9' r='2.3'/%3E%3Ccircle cx='25' cy='5' r='2.3'/%3E%3Ccircle cx='23.8' cy='8.5' r='2.3'/%3E%3Ccircle cx='20.2' cy='8.5' r='2.3'/%3E%3Ccircle cx='19' cy='5' r='2.3'/%3E%3C/g%3E%3Ccircle cx='22' cy='6' r='1.9' fill='%23eaa92b'/%3E%3C/svg%3E");
	--flg-blossom: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cg fill='%23b8325f'%3E%3Ccircle cx='12' cy='5.4' r='4.4'/%3E%3Ccircle cx='18.3' cy='10' r='4.4'/%3E%3Ccircle cx='15.9' cy='17.4' r='4.4'/%3E%3Ccircle cx='8.1' cy='17.4' r='4.4'/%3E%3Ccircle cx='5.7' cy='10' r='4.4'/%3E%3C/g%3E%3Ccircle cx='12' cy='12' r='3.6' fill='%23eaa92b'/%3E%3C/svg%3E");
	--flg-blossom-lavender: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cg fill='%237b6bb8'%3E%3Ccircle cx='12' cy='5.4' r='4.4'/%3E%3Ccircle cx='18.3' cy='10' r='4.4'/%3E%3Ccircle cx='15.9' cy='17.4' r='4.4'/%3E%3Ccircle cx='8.1' cy='17.4' r='4.4'/%3E%3Ccircle cx='5.7' cy='10' r='4.4'/%3E%3C/g%3E%3Ccircle cx='12' cy='12' r='3.6' fill='%23eaa92b'/%3E%3C/svg%3E");
	--flg-blossom-marigold: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cg fill='%23eaa92b'%3E%3Ccircle cx='12' cy='5.4' r='4.4'/%3E%3Ccircle cx='18.3' cy='10' r='4.4'/%3E%3Ccircle cx='15.9' cy='17.4' r='4.4'/%3E%3Ccircle cx='8.1' cy='17.4' r='4.4'/%3E%3Ccircle cx='5.7' cy='10' r='4.4'/%3E%3C/g%3E%3Ccircle cx='12' cy='12' r='3.6' fill='%23a85a1c'/%3E%3C/svg%3E");
	--flg-bloom: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='-110 -110 220 220'%3E%3Cdefs%3E%3Cpath id='a' d='M0 0C-40-40-30-104 0-104C30-104 40-40 0 0Z'/%3E%3Cpath id='b' d='M0 0C-24-26-18-66 0-66C18-66 24-26 0 0Z'/%3E%3C/defs%3E%3Cg fill='%23f7dbe3' stroke='%23fdf3f5' stroke-width='2.5'%3E%3Cuse href='%23a'/%3E%3Cuse href='%23a' transform='rotate(45)'/%3E%3Cuse href='%23a' transform='rotate(90)'/%3E%3Cuse href='%23a' transform='rotate(135)'/%3E%3Cuse href='%23a' transform='rotate(180)'/%3E%3Cuse href='%23a' transform='rotate(225)'/%3E%3Cuse href='%23a' transform='rotate(270)'/%3E%3Cuse href='%23a' transform='rotate(315)'/%3E%3C/g%3E%3Cg fill='%23fae8ed' stroke='%23fdf3f5' stroke-width='2.5'%3E%3Cuse href='%23b' transform='rotate(22)'/%3E%3Cuse href='%23b' transform='rotate(94)'/%3E%3Cuse href='%23b' transform='rotate(166)'/%3E%3Cuse href='%23b' transform='rotate(238)'/%3E%3Cuse href='%23b' transform='rotate(310)'/%3E%3C/g%3E%3Ccircle r='15' fill='%23f6dfa6'/%3E%3C/svg%3E");

	/* Typography — system stacks, nothing to download.
	   Headings: a bookish serif. Body and interface: the system sans. */
	--flg-font-head: "Iowan Old Style", "Palatino Linotype", Palatino, "Book Antiqua", Georgia, "Times New Roman", serif;
	--flg-font-body: system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", sans-serif;
	--flg-font-ui: system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", sans-serif;
	--flg-font-mono: ui-monospace, SFMono-Regular, Menlo, Consolas, "Liberation Mono", monospace;

	--flg-text-xs: 0.8125rem;
	--flg-text-sm: 0.875rem;
	--flg-text-base: 1rem;
	--flg-text-md: 1.0625rem;
	--flg-text-lg: 1.25rem;
	--flg-text-xl: 1.4375rem;
	--flg-text-2xl: 1.75rem;
	--flg-text-3xl: 2.125rem;
	--flg-text-4xl: 2.75rem;

	--flg-leading-tight: 1.18;
	--flg-leading-snug: 1.35;
	--flg-leading-normal: 1.6;
	--flg-leading-relaxed: 1.72;

	/* Spacing — 4px scale */
	--flg-s1: 0.25rem;
	--flg-s2: 0.5rem;
	--flg-s3: 0.75rem;
	--flg-s4: 1rem;
	--flg-s5: 1.5rem;
	--flg-s6: 2rem;
	--flg-s7: 2.5rem;
	--flg-s8: 3rem;
	--flg-s9: 4rem;
	--flg-s10: 5.5rem;

	/* Shape and shadow: soft, evenly rounded cards. */
	--flg-radius-sm: 0.5rem;
	--flg-radius: 0.875rem;
	--flg-pill: 999px;
	--flg-leaf-sm: 0.875rem;
	--flg-leaf-radius: 1.25rem;
	--flg-leaf-lg: 2rem;
	--flg-shadow-sm: 0 1px 2px rgba(31, 74, 53, 0.06);
	--flg-shadow: 0 12px 28px -14px rgba(31, 74, 53, 0.28);
	--flg-shadow-lg: 0 22px 44px -18px rgba(31, 74, 53, 0.32);

	/* Layout */
	--flg-container: 1180px;
	--flg-container-wide: 1320px;
	--flg-container-narrow: 780px;
	--flg-reading: 46rem;
	--flg-measure: 43rem;
	--flg-gutter: var(--flg-s4);

	color-scheme: light;
}

@media (min-width: 48em) {
	:root {
		--flg-gutter: var(--flg-s6);
	}
}

/* --------------------------------------------------------------------------
   2. Light reset
   -------------------------------------------------------------------------- */

*,
*::before,
*::after {
	box-sizing: border-box;
}

html {
	-webkit-text-size-adjust: 100%;
	scroll-behavior: smooth;
	scroll-padding-top: 1.5rem;
}

@media (prefers-reduced-motion: reduce) {
	html {
		scroll-behavior: auto;
	}

	*,
	*::before,
	*::after {
		animation-duration: 0.01ms !important;
		animation-iteration-count: 1 !important;
		transition-duration: 0.01ms !important;
	}

	.flg-card:hover,
	.flg-topic:hover,
	.flg-steps > li:hover {
		transform: none !important;
	}
}

body {
	margin: 0;
	background-color: var(--flg-cream);
	color: var(--flg-ink);
	font-family: var(--flg-font-body);
	font-size: var(--flg-text-md);
	line-height: var(--flg-leading-normal);
	text-rendering: optimizeLegibility;
	-webkit-font-smoothing: antialiased;
	min-height: 100vh;
	display: flex;
	flex-direction: column;
	overflow-wrap: break-word;
}

img,
svg,
video,
iframe {
	max-width: 100%;
	height: auto;
}

img {
	display: block;
}

figure {
	margin: 0;
}

/* Petal divider: a hairline with two leaves and a small blossom at its center. */
hr {
	height: 0.75rem;
	margin: var(--flg-s7) 0;
	border: 0;
	background:
		var(--flg-petals) center / 2.75rem 0.75rem no-repeat,
		linear-gradient(90deg, var(--flg-line) calc(50% - 2.25rem), transparent calc(50% - 2.25rem), transparent calc(50% + 2.25rem), var(--flg-line) calc(50% + 2.25rem)) center / 100% 1px no-repeat;
}

/* --------------------------------------------------------------------------
   3. Typography
   -------------------------------------------------------------------------- */

h1,
h2,
h3,
h4,
h5,
h6 {
	font-family: var(--flg-font-head);
	color: var(--flg-green);
	line-height: var(--flg-leading-tight);
	margin: 0 0 var(--flg-s4);
	font-weight: 700;
	letter-spacing: -0.01em;
	overflow-wrap: break-word;
}

h1 {
	font-size: clamp(2rem, 1.45rem + 2.4vw, var(--flg-text-4xl));
}

h2 {
	font-size: clamp(1.5rem, 1.25rem + 1.2vw, var(--flg-text-3xl));
}

h3 {
	font-size: clamp(1.25rem, 1.12rem + 0.6vw, var(--flg-text-xl));
	letter-spacing: -0.01em;
}

h4 {
	font-size: var(--flg-text-lg);
	letter-spacing: -0.01em;
}

h5,
h6 {
	font-family: var(--flg-font-ui);
	font-size: var(--flg-text-sm);
	letter-spacing: 0.08em;
	text-transform: uppercase;
	color: var(--flg-ink-soft);
}

p {
	margin: 0 0 var(--flg-s4);
}

a {
	color: var(--flg-rose);
	text-decoration-thickness: 1px;
	text-underline-offset: 0.2em;
}

a:hover,
a:focus {
	color: var(--flg-rose-dark);
}

strong,
b {
	font-weight: 700;
}

small {
	font-size: var(--flg-text-sm);
}

mark {
	background: var(--flg-mint);
	color: var(--flg-ink);
	border-radius: 0.2em;
	padding: 0 0.2em;
}

code,
kbd,
samp {
	font-family: var(--flg-font-mono);
	font-size: 0.85em;
	background: var(--flg-cream-deep);
	border-radius: 0.35em;
	padding: 0.12em 0.4em;
}

pre {
	font-family: var(--flg-font-mono);
	font-size: var(--flg-text-sm);
	background: var(--flg-surface);
	border: 1px solid var(--flg-line);
	border-radius: var(--flg-radius);
	padding: var(--flg-s4);
	overflow-x: auto;
	line-height: 1.5;
}

pre code {
	background: none;
	padding: 0;
}

blockquote {
	margin: var(--flg-s6) 0;
	padding: var(--flg-s5) var(--flg-s5) var(--flg-s5) var(--flg-s6);
	background: var(--flg-mint-soft);
	border-radius: var(--flg-leaf-radius);
	font-size: var(--flg-text-lg);
	font-style: italic;
	color: var(--flg-ink-soft);
}

blockquote p:last-child {
	margin-bottom: 0;
}

blockquote cite {
	display: block;
	margin-top: var(--flg-s2);
	font-family: var(--flg-font-ui);
	font-size: var(--flg-text-sm);
	font-style: normal;
	color: var(--flg-ink-muted);
}

/* --------------------------------------------------------------------------
   4. Accessibility
   -------------------------------------------------------------------------- */

:where(a, button, input, select, textarea, summary, [tabindex]):focus-visible {
	outline: 3px solid var(--flg-focus);
	outline-offset: 2px;
}

/* The main landmark only receives focus from the skip link. */
.flg-site-main:focus {
	outline: 0;
}

.screen-reader-text {
	border: 0;
	clip-path: inset(50%);
	height: 1px;
	margin: -1px;
	overflow: hidden;
	padding: 0;
	position: absolute;
	width: 1px;
	word-wrap: normal !important;
}

.screen-reader-text:focus {
	background-color: var(--flg-ink);
	border-radius: var(--flg-pill);
	box-shadow: var(--flg-shadow);
	clip-path: none;
	color: var(--flg-surface);
	display: block;
	font-family: var(--flg-font-ui);
	font-size: var(--flg-text-base);
	font-weight: 600;
	height: auto;
	left: var(--flg-s4);
	line-height: normal;
	outline-color: var(--flg-pink);
	padding: var(--flg-s3) var(--flg-s5);
	text-decoration: none;
	top: var(--flg-s4);
	width: auto;
	z-index: 100000;
}

.flg-skip-link:focus {
	position: fixed;
}

/* --------------------------------------------------------------------------
   5. Layout
   -------------------------------------------------------------------------- */

.flg-container {
	width: 100%;
	max-width: var(--flg-container);
	margin-inline: auto;
	padding-inline: var(--flg-gutter);
}

.flg-container--narrow {
	max-width: var(--flg-container-narrow);
}

.flg-site-main {
	flex: 1 0 auto;
	padding-block: var(--flg-s6) var(--flg-s9);
}

/* Used on the homepage, where the hero sits flush against the header. */
.flg-site-main--flush {
	padding-top: 0;
}

/* minmax(0, 1fr) lets the column shrink below the intrinsic width of wide
   children (tables, long words) so they scroll inside it instead of pushing
   the page sideways. */
.flg-layout {
	display: grid;
	grid-template-columns: minmax(0, 1fr);
	gap: var(--flg-s7);
}

.flg-layout > * {
	min-width: 0;
}

@media (min-width: 66em) {
	.flg-layout--with-sidebar {
		grid-template-columns: minmax(0, 1fr) 19rem;
		gap: var(--flg-s8);
		align-items: start;
	}
}

.flg-stack > * + * {
	margin-top: var(--flg-s4);
}

.flg-section {
	margin-block: var(--flg-s9);
}

.flg-section:first-child {
	margin-top: var(--flg-s8);
}

.flg-section__head {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: space-between;
	gap: var(--flg-s2) var(--flg-s4);
	margin-bottom: var(--flg-s5);
}

.flg-section__title {
	margin: 0;
	font-size: var(--flg-text-2xl);
}

/* A small five-petal blossom in front of every section title; the color
   rotates through rose, lavender and marigold down the page. */
.flg-section__title::before {
	content: "";
	display: inline-block;
	width: 0.78em;
	height: 0.78em;
	margin-right: 0.45em;
	vertical-align: -0.06em;
	background: var(--flg-blossom) center / contain no-repeat;
}

.flg-section:nth-of-type(3n + 2) .flg-section__title::before {
	background-image: var(--flg-blossom-lavender);
}

.flg-section:nth-of-type(3n) .flg-section__title::before {
	background-image: var(--flg-blossom-marigold);
}

/* Always on its own line under the title and the "View all" link. */
.flg-section__description {
	flex: 0 0 100%;
	order: 3;
	margin: 0;
	color: var(--flg-ink-soft);
	font-size: var(--flg-text-base);
}

.flg-section__link {
	display: inline-flex;
	align-items: center;
	min-height: 2.25rem;
	padding: 0.25rem 1rem;
	border: 1.5px solid var(--flg-mint-line);
	border-radius: var(--flg-pill);
	background: var(--flg-surface);
	color: var(--flg-green);
	font-family: var(--flg-font-ui);
	font-size: var(--flg-text-sm);
	font-weight: 600;
	text-decoration: none;
	white-space: nowrap;
}

.flg-section__link:hover,
.flg-section__link:focus {
	background: var(--flg-mint);
	border-color: var(--flg-leaf);
	color: var(--flg-ink);
}

.flg-section__link::after {
	content: "\2192";
	margin-left: 0.4em;
}

/* --------------------------------------------------------------------------
   6. Header and navigation
   One line on large screens: mark and name, the menu, a compact search.
   Below 66em the menu and the search fold into a panel behind a button.
   -------------------------------------------------------------------------- */

/* A thin band in the border colors runs along the top edge. */
.flg-site-header {
	position: relative;
	z-index: 50;
	background:
		linear-gradient(90deg, var(--flg-green) 0%, var(--flg-leaf) 22%, var(--flg-rose) 44%, var(--flg-pink) 62%, var(--flg-marigold) 80%, var(--flg-lavender) 100%) top / 100% 4px no-repeat,
		var(--flg-cream);
	border-bottom: 1px solid var(--flg-line);
	padding-top: 4px;
}

.flg-site-header .flg-container {
	max-width: var(--flg-container-wide);
}

.flg-header__inner {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: var(--flg-s4);
	min-height: 4.25rem;
	min-width: 0;
}

.flg-branding {
	display: flex;
	align-items: center;
	gap: 0.7rem;
	min-width: 0;
}

.flg-branding__mark {
	flex: 0 0 auto;
	width: 2.5rem;
	height: 2.5rem;
}

.flg-branding__text {
	min-width: 0;
}

.flg-branding__title {
	font-family: var(--flg-font-head);
	font-size: 1.3125rem;
	font-weight: 700;
	line-height: 1.1;
	margin: 0;
	letter-spacing: -0.01em;
	white-space: nowrap;
}

.flg-branding__title a {
	color: var(--flg-green);
	text-decoration: none;
}

.flg-branding__title a:hover {
	color: var(--flg-rose);
}

.flg-branding__tagline {
	margin: 0.2rem 0 0;
	font-family: var(--flg-font-ui);
	font-size: var(--flg-text-xs);
	color: var(--flg-ink-muted);
	line-height: 1.3;
}

/* The tagline shows beside the mark on tablets only: on the narrowest phones
   it would wrap under the menu button, and on large screens the header is a
   single line shared with the menu (the footer carries the tagline there). */
@media (max-width: 35.99em), (min-width: 66em) {
	.flg-branding__tagline {
		display: none;
	}
}

.custom-logo-link img {
	max-height: 3rem;
	width: auto;
}

/* Menu button (small screens) */
.flg-menu-toggle {
	flex: 0 0 auto;
	display: inline-flex;
	align-items: center;
	gap: 0.6rem;
	background: var(--flg-surface);
	border: 1.5px solid var(--flg-mint-line);
	border-radius: var(--flg-pill);
	color: var(--flg-ink);
	cursor: pointer;
	font-family: var(--flg-font-ui);
	font-size: var(--flg-text-sm);
	font-weight: 600;
	min-height: 2.75rem;
	padding: var(--flg-s2) var(--flg-s4);
}

.flg-menu-toggle:hover,
.flg-menu-toggle:focus {
	background: var(--flg-mint);
	border-color: var(--flg-leaf);
	color: var(--flg-ink);
}

.flg-menu-toggle[aria-expanded="true"] {
	background: var(--flg-ink);
	border-color: var(--flg-ink);
	color: var(--flg-surface);
}

.flg-menu-toggle__bars {
	display: block;
	position: relative;
	width: 1.125rem;
	height: 2px;
	border-radius: 2px;
	background: currentColor;
}

.flg-menu-toggle__bars::before,
.flg-menu-toggle__bars::after {
	content: "";
	position: absolute;
	left: 0;
	width: 100%;
	height: 2px;
	border-radius: 2px;
	background: currentColor;
}

.flg-menu-toggle__bars::before {
	top: -6px;
}

.flg-menu-toggle__bars::after {
	top: 6px;
}

.flg-header__panel {
	display: none;
	padding-bottom: var(--flg-s5);
}

.flg-header__panel.is-open {
	display: block;
}

.flg-nav {
	font-family: var(--flg-font-ui);
}

.flg-nav__list,
.flg-nav__list .sub-menu {
	list-style: none;
	margin: 0;
	padding: 0;
}

/* Small screens: the menu is a soft white card of full-width rows. */
.flg-nav__list {
	background: var(--flg-surface);
	border: 1px solid var(--flg-line);
	border-radius: var(--flg-leaf-radius);
	padding: var(--flg-s2);
}

.flg-nav__list li {
	position: relative;
}

.flg-nav__list a {
	display: block;
	padding: 0.7rem var(--flg-s4);
	border-radius: var(--flg-pill);
	color: var(--flg-ink);
	font-size: var(--flg-text-base);
	font-weight: 600;
	text-decoration: none;
}

.flg-nav__list a:hover,
.flg-nav__list a:focus {
	background: var(--flg-mint-soft);
	color: var(--flg-ink);
}

.flg-nav__list .sub-menu a {
	padding-left: var(--flg-s6);
	font-weight: 500;
}

.flg-nav .current-menu-item > a,
.flg-nav .current-menu-ancestor > a,
.flg-nav .current_page_item > a {
	background: var(--flg-mint);
	color: var(--flg-ink);
}

.flg-header__search {
	margin-top: var(--flg-s3);
}

/* Shown only to users who can edit menus, when no menu is assigned to the
   primary location. Visitors never see this block. */
.flg-nav--empty {
	margin: 0;
	padding: var(--flg-s3) 0;
	font-size: var(--flg-text-sm);
}

@media (min-width: 66em) {
	.flg-menu-toggle {
		display: none;
	}

	.flg-site-header .flg-container {
		display: flex;
		align-items: center;
		column-gap: var(--flg-s5);
	}

	.flg-header__inner {
		flex: 0 0 auto;
		min-height: 4.75rem;
	}

	/* The panel wrapper dissolves so that its two children (menu and search)
	   sit directly in the header's flex row. */
	.flg-header__panel,
	.flg-header__panel.is-open {
		display: contents;
	}

	.flg-nav {
		flex: 1 1 auto;
		min-width: 0;
	}

	/* Eight items fit on one line; a longer menu wraps onto a second line
	   instead of overflowing the page. */
	.flg-nav__list {
		display: flex;
		flex-wrap: wrap;
		align-items: center;
		justify-content: flex-end;
		gap: 0.125rem;
		background: none;
		border: 0;
		border-radius: 0;
		padding: var(--flg-s2) 0;
	}

	.flg-nav__list a {
		padding: 0.45rem 0.6rem;
		font-size: var(--flg-text-xs);
		white-space: nowrap;
	}

	.flg-nav__list a:hover,
	.flg-nav__list a:focus {
		background: var(--flg-mint);
	}

	/* Between 66em and 80em the line belongs to the menu: the search field
	   returns as soon as there is room for it. */
	.flg-header__search {
		display: none;
		flex: 0 0 9.5rem;
		margin-top: 0;
	}

	/* Submenus (one level) */
	.flg-nav__list .sub-menu {
		display: none;
		position: absolute;
		top: 100%;
		left: 0;
		min-width: 13rem;
		background: var(--flg-surface);
		border: 1px solid var(--flg-line);
		border-radius: var(--flg-leaf-sm);
		box-shadow: var(--flg-shadow-lg);
		padding: var(--flg-s2);
		z-index: 60;
	}

	.flg-nav__list li:hover > .sub-menu,
	.flg-nav__list li:focus-within > .sub-menu {
		display: block;
	}

	.flg-nav__list .sub-menu a {
		padding-left: var(--flg-s3);
		white-space: normal;
	}
}

@media (min-width: 80em) {
	.flg-nav__list a {
		padding-inline: 0.7rem;
		font-size: var(--flg-text-sm);
	}

	.flg-header__search {
		display: block;
		flex-basis: 11.5rem;
	}
}

/* --------------------------------------------------------------------------
   7. Forms
   -------------------------------------------------------------------------- */

label {
	display: block;
	font-family: var(--flg-font-ui);
	font-size: var(--flg-text-sm);
	font-weight: 600;
	margin-bottom: var(--flg-s2);
}

.flg-field {
	margin-bottom: var(--flg-s5);
}

.flg-field__hint {
	display: block;
	margin-top: var(--flg-s2);
	font-family: var(--flg-font-ui);
	font-size: var(--flg-text-xs);
	font-weight: 400;
	color: var(--flg-ink-muted);
}

.flg-required {
	color: var(--flg-rose-dark);
}

input[type="text"],
input[type="email"],
input[type="url"],
input[type="search"],
input[type="tel"],
input[type="number"],
input[type="password"],
select,
textarea {
	width: 100%;
	background: var(--flg-surface);
	border: 1.5px solid var(--flg-line-strong);
	border-radius: var(--flg-radius);
	color: var(--flg-ink);
	font-family: var(--flg-font-ui);
	font-size: var(--flg-text-base);
	line-height: 1.4;
	padding: 0.7rem var(--flg-s4);
}

input:focus,
select:focus,
textarea:focus {
	border-color: var(--flg-green);
}

textarea {
	min-height: 11rem;
	resize: vertical;
	line-height: var(--flg-leading-normal);
}

input::placeholder,
textarea::placeholder {
	color: var(--flg-ink-muted);
	opacity: 1;
}

/* Search field: one pill holding the input and a round button. */
.flg-search-form {
	display: flex;
	align-items: center;
	gap: 0;
	background: var(--flg-surface);
	border: 1.5px solid var(--flg-line-strong);
	border-radius: var(--flg-pill);
	padding: 0.1875rem;
}

.flg-search-form:focus-within {
	border-color: var(--flg-green);
}

.flg-search-form__field {
	flex: 1 1 auto;
	min-width: 0;
}

.flg-search-form input[type="search"] {
	min-height: 2.375rem;
	background: transparent;
	border: 0;
	border-radius: var(--flg-pill);
	padding: var(--flg-s1) var(--flg-s2) var(--flg-s1) var(--flg-s4);
	-webkit-appearance: none;
	appearance: none;
}

.flg-search-form__submit {
	flex: 0 0 auto;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 2.375rem;
	min-width: 2.375rem;
	height: 2.375rem;
	min-height: 2.375rem;
	background: var(--flg-rose);
	border: 0;
	border-radius: 50%;
	color: var(--flg-surface);
	cursor: pointer;
	padding: 0;
}

.flg-search-form__submit:hover,
.flg-search-form__submit:focus {
	background: var(--flg-rose-dark);
	color: var(--flg-surface);
}

.flg-search-form__submit .flg-icon {
	width: 1.0625rem;
	height: 1.0625rem;
}

.flg-header__search input[type="search"] {
	font-size: var(--flg-text-sm);
}

/* --------------------------------------------------------------------------
   8. Buttons — plump pills
   -------------------------------------------------------------------------- */

.flg-button,
.flg-button--primary,
button,
input[type="submit"],
input[type="button"],
.wp-block-button__link {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: var(--flg-s2);
	background: var(--flg-rose);
	border: 1.5px solid var(--flg-rose);
	border-radius: var(--flg-pill);
	color: var(--flg-surface);
	cursor: pointer;
	font-family: var(--flg-font-ui);
	font-size: var(--flg-text-base);
	font-weight: 600;
	line-height: 1.3;
	min-height: 3.125rem;
	padding: 0.8rem 1.9rem;
	text-align: center;
	text-decoration: none;
	transition: background-color 0.15s ease, border-color 0.15s ease, color 0.15s ease;
}

.flg-button:hover,
.flg-button:focus,
button:hover,
input[type="submit"]:hover,
input[type="button"]:hover,
.wp-block-button__link:hover {
	background: var(--flg-rose-dark);
	border-color: var(--flg-rose-dark);
	color: var(--flg-surface);
}

.flg-button--secondary {
	background: var(--flg-surface);
	border-color: var(--flg-green);
	color: var(--flg-green);
}

.flg-button--secondary:hover,
.flg-button--secondary:focus {
	background: var(--flg-mint);
	border-color: var(--flg-leaf);
	color: var(--flg-ink);
}

.flg-button--small {
	font-size: var(--flg-text-sm);
	min-height: 0;
	padding: var(--flg-s2) var(--flg-s4);
}

.flg-button[disabled],
button[disabled] {
	cursor: not-allowed;
	opacity: 0.55;
}

/* --------------------------------------------------------------------------
   9. Labels, categories, metadata
   -------------------------------------------------------------------------- */

.flg-eyebrow {
	display: inline-block;
	align-self: flex-start;
	padding: 0.22rem 0.7rem;
	border-radius: var(--flg-pill);
	background: var(--flg-blush);
	font-family: var(--flg-font-ui);
	font-size: 0.75rem;
	font-weight: 700;
	letter-spacing: 0.07em;
	line-height: 1.4;
	text-transform: uppercase;
	color: var(--flg-rose-dark);
	text-decoration: none;
	margin-bottom: var(--flg-s2);
}

a.flg-eyebrow:hover,
a.flg-eyebrow:focus {
	color: var(--flg-rose-dark);
	text-decoration: underline;
}

/* Category color chips. WordPress adds category-{slug} to every post, so the
   chip takes its color from the guide's category. All pairs pass AA. */
.category-flower-gardening-basics .flg-eyebrow {
	background: var(--flg-mint);
	color: var(--flg-green);
}

.category-annual-flowers .flg-eyebrow,
.category-container-flowers .flg-eyebrow {
	background: var(--flg-marigold-soft);
	color: #6b4a00;
}

.category-perennial-flowers .flg-eyebrow,
.category-seasonal-flower-gardening .flg-eyebrow {
	background: var(--flg-lavender-soft);
	color: #4a3c8c;
}

.category-planting-flowers .flg-eyebrow {
	background: #e3f0e4;
	color: #2c6340;
}

.category-flower-garden-design .flg-eyebrow,
.category-flower-care .flg-eyebrow {
	background: var(--flg-blush);
	color: var(--flg-rose-dark);
}

.flg-chip {
	display: inline-flex;
	align-items: center;
	gap: var(--flg-s1);
	background: var(--flg-surface);
	border: 1.5px solid var(--flg-mint-line);
	border-radius: var(--flg-pill);
	color: var(--flg-ink);
	font-family: var(--flg-font-ui);
	font-size: var(--flg-text-sm);
	font-weight: 600;
	padding: 0.4rem 1rem;
	text-decoration: none;
}

a.flg-chip:hover,
a.flg-chip:focus {
	background: var(--flg-mint);
	border-color: var(--flg-leaf);
	color: var(--flg-ink);
}

.flg-meta {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: var(--flg-s2) var(--flg-s4);
	color: var(--flg-ink-muted);
	font-family: var(--flg-font-ui);
	font-size: var(--flg-text-sm);
	list-style: none;
	margin: 0;
	padding: 0;
}

.flg-meta > li {
	display: inline-flex;
	flex-wrap: wrap;
	align-items: center;
	gap: var(--flg-s2) var(--flg-s4);
}

.flg-meta__item {
	display: inline-flex;
	align-items: center;
	gap: 0.4rem;
}

.flg-meta a {
	color: inherit;
}

.flg-meta svg {
	flex: 0 0 auto;
	color: var(--flg-leaf);
}

.flg-icon {
	width: 1em;
	height: 1em;
	fill: none;
	stroke: currentColor;
	stroke-width: 1.7;
	stroke-linecap: round;
	stroke-linejoin: round;
	vertical-align: -0.125em;
}

/* --------------------------------------------------------------------------
   10. Cards and grids
   -------------------------------------------------------------------------- */

.flg-grid {
	display: grid;
	gap: var(--flg-s5);
	grid-template-columns: minmax(0, 1fr);
}

@media (min-width: 36em) {
	.flg-grid--2,
	.flg-grid--3,
	.flg-grid--4 {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}
}

@media (min-width: 62em) {
	.flg-grid--3 {
		grid-template-columns: repeat(3, minmax(0, 1fr));
	}

	.flg-grid--4 {
		grid-template-columns: repeat(4, minmax(0, 1fr));
		gap: var(--flg-s4);
	}
}

/* A card is a soft white tile: the picture is inset and repeats its corners. */
.flg-card {
	display: flex;
	flex-direction: column;
	background: var(--flg-surface);
	border: 1px solid var(--flg-line);
	border-radius: var(--flg-leaf-radius);
	padding: 0.625rem;
	height: 100%;
	transition: box-shadow 0.2s ease, transform 0.2s ease, border-color 0.2s ease;
}

.flg-card:hover {
	border-color: var(--flg-blush-line);
	box-shadow: var(--flg-shadow);
	transform: translateY(-4px);
}

.flg-card__media {
	display: block;
	background: var(--flg-mint-soft);
	border-radius: 0.75rem;
	aspect-ratio: 16 / 9;
	overflow: hidden;
}

.flg-card__media img,
.flg-card-row__media img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}

/* Posts without a featured image get a pale bloom on a blush tint. */
.flg-card__media--placeholder,
.flg-card-row__media--placeholder {
	background: var(--flg-bloom) center / auto 150% no-repeat, var(--flg-blush);
}

.flg-card__body {
	display: flex;
	flex-direction: column;
	flex: 1 1 auto;
	gap: var(--flg-s2);
	padding: var(--flg-s4) 0.625rem 0.625rem;
}

.flg-card__body .flg-eyebrow {
	margin-bottom: 0;
}

.flg-card__title {
	font-size: var(--flg-text-lg);
	line-height: 1.25;
	margin: 0;
}

.flg-grid--4 .flg-card__title {
	font-size: 1.125rem;
}

.flg-card__title a,
.flg-card-row__title a,
.flg-steps__title a {
	color: var(--flg-ink);
	text-decoration: none;
}

.flg-card__title a:hover,
.flg-card-row__title a:hover,
.flg-steps__title a:hover,
.flg-card__title a:focus,
.flg-card-row__title a:focus,
.flg-steps__title a:focus {
	color: var(--flg-rose);
	text-decoration: underline;
}

.flg-card__excerpt {
	color: var(--flg-ink-soft);
	font-size: var(--flg-text-base);
	line-height: 1.55;
	margin: 0;
}

.flg-grid--4 .flg-card__excerpt {
	font-size: 0.9375rem;
}

.flg-card__footer {
	margin-top: auto;
	padding-top: var(--flg-s3);
}

/* Horizontal card (lists and search results) */
.flg-card-row {
	display: grid;
	grid-template-columns: minmax(0, 1fr);
	gap: var(--flg-s4);
	background: var(--flg-surface);
	border: 1px solid var(--flg-line);
	border-radius: var(--flg-leaf-radius);
	padding: 0.625rem;
}

@media (min-width: 36em) {
	.flg-card-row {
		grid-template-columns: 12rem minmax(0, 1fr);
		gap: var(--flg-s5);
		align-items: center;
	}
}

.flg-card-row__media {
	display: block;
	background: var(--flg-mint-soft);
	border-radius: 0.75rem;
	aspect-ratio: 4 / 3;
	overflow: hidden;
}

/* min-width: 0 keeps long titles from blowing out the grid column. */
.flg-card-row__body {
	min-width: 0;
	padding: var(--flg-s2) var(--flg-s3) var(--flg-s3);
}

@media (min-width: 36em) {
	.flg-card-row__body {
		padding: var(--flg-s3) var(--flg-s4) var(--flg-s3) 0;
	}
}

.flg-card-row__title {
	font-size: var(--flg-text-xl);
	margin: 0 0 var(--flg-s2);
}

.flg-card-row__excerpt {
	color: var(--flg-ink-soft);
	font-size: var(--flg-text-base);
	margin: 0 0 var(--flg-s3);
}

.flg-card-list {
	display: grid;
	grid-template-columns: minmax(0, 1fr);
	gap: var(--flg-s4);
}

/* Numbered path (Start Here): four tiles in a row, each led by its number. */
.flg-steps {
	list-style: none;
	counter-reset: flg-step;
	display: grid;
	grid-template-columns: minmax(0, 1fr);
	gap: var(--flg-s4);
	margin: 0;
	padding: 0;
}

@media (min-width: 40em) {
	.flg-steps {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}
}

@media (min-width: 66em) {
	.flg-steps {
		grid-template-columns: repeat(4, minmax(0, 1fr));
	}
}

.flg-steps > li {
	counter-increment: flg-step;
	display: grid;
	grid-template-columns: 2.75rem minmax(0, 1fr);
	gap: var(--flg-s4);
	align-items: start;
	align-content: start;
	background: var(--flg-surface);
	border: 1px solid var(--flg-line);
	border-top: 4px solid var(--flg-pink);
	border-radius: var(--flg-leaf-radius);
	padding: var(--flg-s5);
	transition: box-shadow 0.2s ease, transform 0.2s ease;
}

.flg-steps > li:hover {
	box-shadow: var(--flg-shadow);
	transform: translateY(-3px);
}

.flg-steps > li:nth-child(4n + 2) {
	border-top-color: var(--flg-marigold);
}

.flg-steps > li:nth-child(4n + 3) {
	border-top-color: var(--flg-lavender);
}

.flg-steps > li:nth-child(4n) {
	border-top-color: var(--flg-leaf);
}

@media (min-width: 66em) {
	.flg-steps > li {
		grid-template-columns: minmax(0, 1fr);
		gap: var(--flg-s3);
	}
}

.flg-steps > li::before {
	content: counter(flg-step);
	display: flex;
	align-items: center;
	justify-content: center;
	width: 2.75rem;
	height: 2.75rem;
	background: var(--flg-green);
	border-radius: 50%;
	color: var(--flg-surface);
	font-family: var(--flg-font-head);
	font-size: var(--flg-text-lg);
	font-weight: 700;
}

.flg-steps__title {
	font-size: 1.1875rem;
	line-height: 1.25;
	margin: 0 0 var(--flg-s2);
}

.flg-steps p {
	color: var(--flg-ink-soft);
	font-size: 0.9375rem;
	line-height: 1.55;
	margin: 0;
}

/* --------------------------------------------------------------------------
   11. Homepage — hero and sections
   -------------------------------------------------------------------------- */

/* Centered copy over a blush-to-cream wash with two pale blooms in the
   corners; a layered flower border grows along the bottom edge. */
.flg-hero {
	background:
		var(--flg-bloom) right -5rem top -6rem / 17rem no-repeat,
		var(--flg-bloom) left -6rem top 11rem / 14rem no-repeat,
		linear-gradient(180deg, var(--flg-blush) 0%, var(--flg-cream) 72%);
	border-bottom: 6px solid var(--flg-green);
	padding-block: var(--flg-s8) 0;
	overflow: hidden;
}

.flg-hero__inner {
	display: grid;
	grid-template-columns: minmax(0, 1fr);
	gap: var(--flg-s6);
	justify-items: center;
}

.flg-hero__copy {
	max-width: 46rem;
	text-align: center;
}

@media (min-width: 62em) {
	.flg-hero {
		background:
			var(--flg-bloom) right -7rem top -8rem / 30rem no-repeat,
			var(--flg-bloom) left -9rem top 9rem / 24rem no-repeat,
			linear-gradient(180deg, var(--flg-blush) 0%, var(--flg-cream) 72%);
		padding-top: var(--flg-s9);
	}

	.flg-hero__inner {
		gap: var(--flg-s7);
	}
}

.flg-hero__title {
	font-size: clamp(2.125rem, 1.35rem + 3.6vw, 3.75rem);
	letter-spacing: -0.01em;
	line-height: 1.06;
	margin: 0 auto var(--flg-s5);
	max-width: 18ch;
}

.flg-hero__text {
	color: var(--flg-ink-soft);
	font-size: clamp(1.125rem, 1.05rem + 0.4vw, 1.3125rem);
	line-height: var(--flg-leading-normal);
	max-width: 36rem;
	margin: 0 auto var(--flg-s6);
}

.flg-hero__actions {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	gap: var(--flg-s3);
}

/* Decorative inline SVG (no image request, no JS). On narrow screens the
   border keeps a readable size and is cropped at both sides by the hero. */
.flg-hero__figure {
	width: 100%;
	max-width: 68rem;
}

.flg-hero__figure svg {
	display: block;
	width: 100%;
	min-width: 40rem;
	max-width: none;
	height: auto;
	margin-left: 50%;
	transform: translateX(-50%);
}

/* Category strip (optional "Browse by Category" section) */
.flg-topics {
	display: grid;
	gap: var(--flg-s4);
	grid-template-columns: repeat(auto-fit, minmax(min(13rem, 100%), 1fr));
	list-style: none;
	margin: 0;
	padding: 0;
}

.flg-topic {
	display: flex;
	flex-direction: column;
	gap: var(--flg-s2);
	background: var(--flg-surface);
	border: 1px solid var(--flg-line);
	border-radius: var(--flg-leaf-radius);
	padding: var(--flg-s5);
	text-decoration: none;
	height: 100%;
	transition: box-shadow 0.2s ease, transform 0.2s ease, border-color 0.2s ease;
}

.flg-topic:hover {
	border-color: var(--flg-blush-line);
	box-shadow: var(--flg-shadow);
	transform: translateY(-3px);
}

.flg-topic__name {
	font-family: var(--flg-font-head);
	font-size: var(--flg-text-lg);
	font-weight: 700;
	letter-spacing: -0.01em;
	line-height: 1.2;
	color: var(--flg-green);
}

.flg-topic:hover .flg-topic__name {
	color: var(--flg-rose);
}

.flg-topic__desc {
	color: var(--flg-ink-soft);
	font-size: 0.9375rem;
	line-height: 1.55;
}

.flg-topic__count {
	margin-top: auto;
	padding-top: var(--flg-s2);
	color: var(--flg-ink-muted);
	font-family: var(--flg-font-ui);
	font-size: var(--flg-text-xs);
	font-weight: 600;
}

/* Closing call to action: a deep green panel with a pale bloom in its corner
   and a marigold button. */
.flg-cta {
	display: grid;
	grid-template-columns: minmax(0, 1fr);
	gap: var(--flg-s5);
	align-items: center;
	background: var(--flg-green);
	border-radius: var(--flg-leaf-lg);
	color: #e6efe6;
	padding: var(--flg-s7) var(--flg-s5);
	position: relative;
	overflow: hidden;
}

.flg-cta::after {
	content: "";
	position: absolute;
	right: -4rem;
	bottom: -5rem;
	width: 16rem;
	height: 16rem;
	background: var(--flg-bloom) center / contain no-repeat;
	opacity: 0.16;
	pointer-events: none;
}

.flg-cta > * {
	position: relative;
	z-index: 1;
}

@media (min-width: 48em) {
	.flg-cta {
		grid-template-columns: minmax(0, 1fr) auto;
		gap: var(--flg-s7);
		padding: var(--flg-s8) var(--flg-s9);
	}
}

.flg-cta__title {
	color: var(--flg-surface);
	margin-bottom: var(--flg-s3);
}

.flg-cta__text {
	color: #e6efe6;
	margin: 0;
	max-width: 54ch;
}

.flg-cta .flg-button {
	background: var(--flg-marigold);
	border-color: var(--flg-marigold);
	color: var(--flg-ink);
}

.flg-cta .flg-button:hover,
.flg-cta .flg-button:focus {
	background: #f4c260;
	border-color: #f4c260;
	color: var(--flg-ink);
}

.flg-cta :focus-visible {
	outline-color: var(--flg-pink-light);
}

/* --------------------------------------------------------------------------
   12. Article
   -------------------------------------------------------------------------- */

.flg-breadcrumbs {
	margin-bottom: var(--flg-s5);
	font-family: var(--flg-font-ui);
	font-size: var(--flg-text-sm);
	color: var(--flg-ink-muted);
}

.flg-breadcrumbs ol {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: var(--flg-s1) var(--flg-s2);
	list-style: none;
	margin: 0;
	padding: 0;
}

.flg-breadcrumbs li {
	display: inline-flex;
	align-items: center;
	gap: var(--flg-s2);
	min-width: 0;
}

/* The separator is a tiny leaf. */
.flg-breadcrumbs li + li::before {
	content: "";
	flex: 0 0 auto;
	width: 0.4rem;
	height: 0.4rem;
	background: var(--flg-leaf-light);
	border-radius: 0 75% 0 75%;
}

.flg-breadcrumbs a {
	color: var(--flg-ink-soft);
	text-decoration: none;
}

.flg-breadcrumbs a:hover,
.flg-breadcrumbs a:focus {
	color: var(--flg-rose-dark);
	text-decoration: underline;
}

.flg-breadcrumbs [aria-current="page"] {
	color: var(--flg-ink-muted);
}

/* Without a sidebar the article sits in a centerd reading column; related
   guides below it keep the full width. */
.flg-no-sidebar.single .flg-breadcrumbs,
.flg-no-sidebar.single .flg-article,
.flg-no-sidebar.single .flg-post-nav,
.flg-no-sidebar.single .flg-comments {
	max-width: var(--flg-reading);
	margin-inline: auto;
}

.flg-article__header {
	margin-bottom: var(--flg-s6);
}

.flg-article__title {
	margin-bottom: var(--flg-s4);
}

.flg-article__summary {
	color: var(--flg-ink-soft);
	font-size: var(--flg-text-lg);
	line-height: var(--flg-leading-normal);
	max-width: var(--flg-measure);
	margin-bottom: var(--flg-s5);
}

.flg-article__meta {
	padding-top: var(--flg-s4);
	border-top: 1px solid var(--flg-line);
}

.flg-article__figure {
	margin-bottom: var(--flg-s6);
}

/* The featured image is the article's only picture: it gets a soft frame,
   a shadow and a blush offset panel behind it. */
.flg-article__figure {
	position: relative;
}

.flg-article__figure img {
	position: relative;
	border-radius: var(--flg-leaf-radius);
	border: 4px solid var(--flg-surface);
	box-shadow: var(--flg-shadow-lg);
	width: 100%;
	background: var(--flg-blush);
}

@media (min-width: 48em) {
	.flg-article__figure::before {
		content: "";
		position: absolute;
		inset: 1.25rem -0.875rem -0.875rem 1.25rem;
		border-radius: var(--flg-leaf-radius);
		background: var(--flg-blush);
		border: 1px solid var(--flg-blush-line);
	}

	.flg-article__figure {
		margin-right: 0.875rem;
		margin-bottom: calc(var(--flg-s6) + 0.875rem);
	}

	.flg-article__figure figcaption {
		position: relative;
		padding-top: 0.875rem;
	}
}

/* Figures and captions */
.flg-article__figure figcaption,
.flg-content figcaption,
.wp-block-image figcaption,
.wp-caption-text {
	margin-top: var(--flg-s3);
	color: var(--flg-ink-muted);
	font-family: var(--flg-font-ui);
	font-size: var(--flg-text-sm);
	line-height: var(--flg-leading-snug);
	text-align: center;
}

/* Body text */
.flg-content {
	font-size: var(--flg-text-md);
	line-height: var(--flg-leading-relaxed);
	min-width: 0;
}

.flg-content > * {
	max-width: var(--flg-measure);
}

.flg-content > .alignwide,
.flg-content > .alignfull,
.flg-content > .flg-tutorial-facts,
.flg-content > .flg-toc,
.flg-content > figure,
.flg-content > .wp-block-image,
.flg-content > .wp-block-gallery,
.flg-content > .wp-block-table,
.flg-content > .flg-table-wrap,
.flg-content > table,
.flg-content > .flg-callout,
.flg-content > .flg-contact,
.flg-content > .flg-ad-slot {
	max-width: 100%;
}

.flg-content h2 {
	margin-top: var(--flg-s8);
}

/* A short rose-to-pink bar under each section heading of a guide. */
.flg-content h2::after {
	content: "";
	display: block;
	width: 3rem;
	height: 3px;
	margin-top: 0.55rem;
	border-radius: 3px;
	background: linear-gradient(90deg, var(--flg-rose), var(--flg-pink));
}

.flg-content h3 {
	margin-top: var(--flg-s6);
}

.flg-content h4 {
	margin-top: var(--flg-s5);
}

.flg-content > h2:first-child,
.flg-content > h3:first-child {
	margin-top: 0;
}

.flg-content ul,
.flg-content ol {
	margin: 0 0 var(--flg-s5);
	padding-left: 1.4em;
}

.flg-content li + li {
	margin-top: var(--flg-s2);
}

.flg-content li > ul,
.flg-content li > ol {
	margin-top: var(--flg-s2);
	margin-bottom: 0;
}

.flg-content ul:not([class]) > li::marker {
	color: var(--flg-leaf);
}

/* Ordered lists are usually the steps of a guide: rose numerals in the
   heading face, with room to breathe. */
.flg-content ol {
	padding-left: 1.7em;
}

.flg-content ol > li {
	padding-left: 0.3em;
}

.flg-content ol > li::marker {
	color: var(--flg-rose);
	font-family: var(--flg-font-head);
	font-weight: 700;
}

.flg-content > ol > li + li {
	margin-top: var(--flg-s3);
}

.flg-content figure,
.flg-content .wp-block-image {
	margin-block: var(--flg-s6);
}

.flg-content img {
	border-radius: var(--flg-leaf-radius);
	background-color: var(--flg-surface);
}

.flg-content a {
	text-decoration: underline;
}

/* Tables — always scroll inside their own box, never the page.
   inc/toc.php wraps every table in .flg-table-wrap; the bare-table rules
   below cover the block editor and any table that escapes the wrapper. */
.flg-table-wrap,
.wp-block-table {
	max-width: 100%;
	overflow-x: auto;
	-webkit-overflow-scrolling: touch;
	margin-block: var(--flg-s6);
	border: 1px solid var(--flg-line);
	border-radius: var(--flg-radius);
	background: var(--flg-surface);
}

/* A block-editor table figure already scrolls: its inner wrapper stays plain. */
.wp-block-table .flg-table-wrap {
	overflow: visible;
	margin: 0;
	border: 0;
	border-radius: 0;
	background: none;
}

.flg-content > table {
	display: block;
	overflow-x: auto;
	margin-block: var(--flg-s6);
}

.flg-content table,
.wp-block-table table {
	width: 100%;
	border-collapse: collapse;
	font-family: var(--flg-font-ui);
	font-size: 0.9375rem;
	line-height: var(--flg-leading-snug);
}

.flg-table-wrap table,
.wp-block-table table {
	min-width: 30rem;
	margin: 0;
}

.flg-content th,
.flg-content td,
.wp-block-table th,
.wp-block-table td {
	border: 0;
	border-bottom: 1px solid var(--flg-line);
	padding: var(--flg-s3) var(--flg-s4);
	text-align: left;
	vertical-align: top;
}

.flg-content tbody tr:last-child > *,
.wp-block-table tbody tr:last-child > * {
	border-bottom: 0;
}

.flg-content tbody tr:nth-child(even),
.wp-block-table tbody tr:nth-child(even) {
	background: rgba(251, 247, 238, 0.75);
}

.flg-content thead th,
.wp-block-table thead th {
	background: var(--flg-green);
	border-bottom: 0;
	color: var(--flg-surface);
	font-size: var(--flg-text-xs);
	font-weight: 700;
	letter-spacing: 0.06em;
	text-transform: uppercase;
}

.flg-content tbody th {
	font-weight: 700;
}

.flg-content table caption {
	caption-side: bottom;
	padding: var(--flg-s3) var(--flg-s4);
	color: var(--flg-ink-muted);
	font-size: var(--flg-text-sm);
	text-align: left;
}

/* Callouts — used in article content and available in the block editor.
   No side stripes: a tinted panel with a small shape in front of the title. */
.flg-callout {
	position: relative;
	background: var(--flg-surface);
	border: 1px solid var(--flg-line);
	border-radius: var(--flg-leaf-radius);
	padding: var(--flg-s5);
	margin-block: var(--flg-s6);
}

.flg-callout > :last-child {
	margin-bottom: 0;
}

.flg-callout__title {
	display: flex;
	align-items: center;
	gap: 0.55rem;
	font-family: var(--flg-font-ui);
	font-size: var(--flg-text-sm);
	font-weight: 700;
	letter-spacing: 0.08em;
	line-height: 1.3;
	text-transform: uppercase;
	color: var(--flg-ink-soft);
	margin-bottom: var(--flg-s2);
}

/* A leaf for tips, a round bead for "good to know" notes. */
.flg-callout__title::before {
	content: "";
	flex: 0 0 auto;
	width: 0.75rem;
	height: 0.75rem;
	border-radius: 0 75% 0 75%;
	background: currentColor;
}

.flg-callout--tip {
	background: var(--flg-mint-soft);
	border-color: var(--flg-mint-line);
}

.flg-callout--tip .flg-callout__title {
	color: var(--flg-green);
}

.flg-callout--warning {
	background: var(--flg-blush);
	border-color: var(--flg-blush-line);
}

.flg-callout--warning .flg-callout__title {
	color: var(--flg-rose-dark);
}

.flg-callout--warning .flg-callout__title::before {
	border-radius: 50%;
	background: var(--flg-rose);
	box-shadow: 0 0 0 3px var(--flg-blush-line);
}

/* "At a glance" card (difficulty, time, best time, suits, what you need) */
.flg-tutorial-facts {
	background: var(--flg-mint-soft);
	border: 1px solid var(--flg-mint-line);
	border-top: 4px solid var(--flg-leaf);
	border-radius: var(--flg-leaf-radius);
	padding: var(--flg-s5);
	margin-bottom: var(--flg-s6);
}

.flg-tutorial-facts__title,
.flg-toc__title {
	font-family: var(--flg-font-ui);
	font-size: var(--flg-text-sm);
	font-weight: 700;
	letter-spacing: 0.09em;
	text-transform: uppercase;
	color: var(--flg-green);
	margin: 0 0 var(--flg-s4);
}

.flg-facts {
	display: grid;
	gap: var(--flg-s4);
	grid-template-columns: repeat(auto-fit, minmax(min(11rem, 100%), 1fr));
	margin: 0;
}

.flg-facts__item {
	display: flex;
	align-items: flex-start;
	gap: var(--flg-s3);
	min-width: 0;
}

.flg-facts__item > span:last-child {
	min-width: 0;
}

.flg-facts__icon {
	flex: 0 0 auto;
	display: flex;
	align-items: center;
	justify-content: center;
	width: 2.5rem;
	height: 2.5rem;
	background: var(--flg-surface);
	border-radius: 50%;
	color: var(--flg-green);
}

.flg-facts__icon .flg-icon {
	width: 1.25rem;
	height: 1.25rem;
}

.flg-facts__label {
	display: block;
	font-family: var(--flg-font-ui);
	font-size: 0.75rem;
	font-weight: 700;
	letter-spacing: 0.07em;
	line-height: var(--flg-leading-snug);
	text-transform: uppercase;
	color: var(--flg-ink-muted);
	margin: 0;
}

.flg-facts__value {
	display: block;
	font-family: var(--flg-font-ui);
	font-size: var(--flg-text-base);
	font-weight: 600;
	line-height: var(--flg-leading-snug);
	margin-top: 0.15rem;
}

.flg-materials {
	margin-top: var(--flg-s5);
	padding-top: var(--flg-s4);
	border-top: 1px solid var(--flg-mint-line);
}

.flg-materials .flg-facts__label {
	margin-bottom: var(--flg-s3);
}

.flg-materials__list {
	list-style: none;
	display: grid;
	gap: var(--flg-s2) var(--flg-s5);
	grid-template-columns: repeat(auto-fit, minmax(min(14rem, 100%), 1fr));
	margin: 0;
	padding: 0;
	font-family: var(--flg-font-ui);
	font-size: var(--flg-text-base);
	line-height: 1.45;
}

.flg-materials__list li {
	display: flex;
	align-items: flex-start;
	gap: 0.6rem;
	margin: 0;
	min-width: 0;
}

.flg-materials__list li::before {
	content: "";
	flex: 0 0 auto;
	width: 0.5rem;
	height: 0.5rem;
	margin-top: 0.48em;
	background: var(--flg-leaf);
	border-radius: 0 75% 0 75%;
}

/* Table of contents */
.flg-toc {
	background: var(--flg-surface);
	border: 1px solid var(--flg-line);
	border-radius: var(--flg-leaf-radius);
	padding: var(--flg-s5);
	margin-bottom: var(--flg-s6);
}

.flg-toc__title {
	margin-bottom: var(--flg-s3);
}

.flg-toc ol {
	counter-reset: flg-toc;
	list-style: none;
	margin: 0;
	padding: 0;
	font-family: var(--flg-font-ui);
	font-size: var(--flg-text-base);
	line-height: 1.45;
}

.flg-toc > ol > li {
	counter-increment: flg-toc;
	margin: 0;
}

.flg-toc > ol > li + li {
	margin-top: var(--flg-s2);
}

.flg-toc > ol > li > a::before {
	content: counter(flg-toc) ". ";
	color: var(--flg-rose);
	font-weight: 700;
}

.flg-toc a {
	color: var(--flg-ink);
	text-decoration: none;
}

.flg-toc a:hover,
.flg-toc a:focus {
	color: var(--flg-rose-dark);
	text-decoration: underline;
}

.flg-toc ol ol {
	margin: var(--flg-s2) 0 0 var(--flg-s5);
	font-size: var(--flg-text-sm);
}

.flg-toc ol ol li + li {
	margin-top: var(--flg-s1);
}

.flg-toc ol ol a {
	color: var(--flg-ink-soft);
}

/* FAQ */
.flg-faq {
	margin-top: var(--flg-s8);
}

.flg-faq > h2 {
	margin-bottom: var(--flg-s5);
}

.flg-faq__item {
	background: var(--flg-surface);
	border: 1px solid var(--flg-line);
	border-left: 4px solid var(--flg-lavender);
	border-radius: var(--flg-leaf-sm);
	margin-bottom: var(--flg-s3);
	padding: var(--flg-s4) var(--flg-s5);
}

.flg-faq__question {
	color: var(--flg-ink);
	font-size: 1.1875rem;
	line-height: 1.3;
	letter-spacing: -0.01em;
	margin: 0 0 var(--flg-s2);
}

.flg-faq__answer {
	color: var(--flg-ink-soft);
	font-size: var(--flg-text-base);
	line-height: 1.65;
}

.flg-faq__answer > :last-child {
	margin-bottom: 0;
}

/* Article footer */
.flg-article__footer {
	margin-top: var(--flg-s8);
	padding-top: var(--flg-s5);
	border-top: 1px solid var(--flg-line);
}

.flg-tags {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: var(--flg-s2);
	list-style: none;
	margin: 0;
	padding: 0;
}

.flg-tags__label {
	font-family: var(--flg-font-ui);
	font-size: var(--flg-text-sm);
	font-weight: 700;
	color: var(--flg-ink-soft);
}

/* Previous / next */
.flg-post-nav {
	margin-top: var(--flg-s7);
}

.flg-post-nav__links {
	display: grid;
	grid-template-columns: minmax(0, 1fr);
	gap: var(--flg-s4);
}

@media (min-width: 48em) {
	.flg-post-nav__links {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}

	/* When only "next" exists it moves to the right-hand column, where its
	   right-aligned text expects to sit. */
	.flg-post-nav__link--next:only-child {
		grid-column: 2;
	}
}

.flg-post-nav__link {
	display: block;
	background: var(--flg-surface);
	border: 1px solid var(--flg-line);
	border-radius: var(--flg-leaf-radius);
	padding: var(--flg-s4) var(--flg-s5);
	text-decoration: none;
	height: 100%;
}

.flg-post-nav__link:hover,
.flg-post-nav__link:focus {
	border-color: var(--flg-pink);
	background: var(--flg-blush);
}

.flg-post-nav__direction {
	display: block;
	font-family: var(--flg-font-ui);
	font-size: 0.75rem;
	font-weight: 700;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	color: var(--flg-ink-muted);
	margin-bottom: var(--flg-s2);
}

.flg-post-nav__title {
	display: block;
	font-family: var(--flg-font-head);
	font-size: 1.0625rem;
	font-weight: 700;
	letter-spacing: -0.01em;
	color: var(--flg-ink);
	line-height: 1.3;
}

.flg-post-nav__link--prev {
	text-align: left;
}

.flg-post-nav__link--next {
	text-align: right;
}

/* --------------------------------------------------------------------------
   13. Sidebar and widgets
   -------------------------------------------------------------------------- */

.flg-sidebar {
	display: grid;
	grid-template-columns: minmax(0, 1fr);
	gap: var(--flg-s5);
}

@media (min-width: 66em) {
	.flg-sidebar--sticky {
		position: sticky;
		top: var(--flg-s5);
	}
}

.flg-widget {
	background: var(--flg-surface);
	border: 1px solid var(--flg-line);
	border-radius: var(--flg-leaf-radius);
	padding: var(--flg-s5);
	font-family: var(--flg-font-ui);
	font-size: var(--flg-text-base);
}

.flg-widget__title,
.flg-widget .widget-title {
	font-family: var(--flg-font-ui);
	font-size: var(--flg-text-sm);
	font-weight: 700;
	letter-spacing: 0.09em;
	text-transform: uppercase;
	color: var(--flg-green);
	margin: 0 0 var(--flg-s4);
}

.flg-widget ul {
	list-style: none;
	margin: 0;
	padding: 0;
}

.flg-widget li + li {
	margin-top: var(--flg-s3);
	padding-top: var(--flg-s3);
	border-top: 1px solid var(--flg-line);
}

.flg-widget a {
	color: var(--flg-ink);
	text-decoration: none;
}

.flg-widget a:hover,
.flg-widget a:focus {
	color: var(--flg-rose);
	text-decoration: underline;
}

.flg-widget .children,
.flg-widget .sub-menu {
	margin-top: var(--flg-s3);
	padding-left: var(--flg-s4);
}

/* --------------------------------------------------------------------------
   14. Archives, pagination, search, 404
   -------------------------------------------------------------------------- */

/* Archive and page titles end in the petal divider mark. */
.flg-archive-header {
	margin-bottom: var(--flg-s7);
}

.flg-archive-header__title {
	margin-bottom: var(--flg-s4);
	padding-bottom: 1.6rem;
	background: var(--flg-petals) left bottom / 2.75rem 0.75rem no-repeat;
}

.flg-archive-header__description {
	color: var(--flg-ink-soft);
	font-size: var(--flg-text-lg);
	line-height: var(--flg-leading-normal);
	max-width: var(--flg-measure);
}

.flg-archive-header__description > :last-child {
	margin-bottom: 0;
}

.flg-archive-header__count {
	margin: var(--flg-s3) 0 0;
	color: var(--flg-ink-muted);
	font-family: var(--flg-font-ui);
	font-size: var(--flg-text-sm);
}

.flg-subcategories {
	display: flex;
	flex-wrap: wrap;
	gap: var(--flg-s2);
	list-style: none;
	margin: var(--flg-s4) 0 0;
	padding: 0;
}

.flg-pagination {
	margin-top: var(--flg-s8);
	font-family: var(--flg-font-ui);
}

.flg-pagination .nav-links {
	display: flex;
	justify-content: center;
}

.flg-pagination ul.page-numbers {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: center;
	gap: var(--flg-s2);
	list-style: none;
	margin: 0;
	padding: 0;
}

.flg-pagination li {
	margin: 0;
}

.flg-pagination a.page-numbers,
.flg-pagination span.page-numbers {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 2.75rem;
	height: 2.75rem;
	padding-inline: var(--flg-s4);
	background: var(--flg-surface);
	border: 1.5px solid var(--flg-mint-line);
	border-radius: var(--flg-pill);
	color: var(--flg-ink);
	font-size: var(--flg-text-sm);
	font-weight: 600;
	text-decoration: none;
}

.flg-pagination a.page-numbers:hover,
.flg-pagination a.page-numbers:focus {
	background: var(--flg-mint);
	border-color: var(--flg-leaf);
	color: var(--flg-ink);
}

.flg-pagination span.page-numbers.current {
	background: var(--flg-rose);
	border-color: var(--flg-rose);
	color: var(--flg-surface);
}

.flg-pagination span.page-numbers.dots {
	border-color: transparent;
	background: none;
	min-width: 1.5rem;
	padding-inline: 0;
}

/* Search */
.flg-search-intro {
	margin-bottom: var(--flg-s6);
}

.flg-search-intro .flg-archive-header__title {
	margin-bottom: var(--flg-s3);
}

.flg-search-intro .flg-search-form {
	max-width: 32rem;
	margin-top: var(--flg-s4);
}

.flg-no-results {
	background: var(--flg-surface);
	border: 1px solid var(--flg-line);
	border-radius: var(--flg-leaf-radius);
	padding: var(--flg-s6) var(--flg-s5);
}

.flg-no-results .flg-search-form {
	max-width: 30rem;
	margin-top: var(--flg-s5);
}

.flg-no-results__suggestions {
	display: grid;
	gap: var(--flg-s2);
	list-style: none;
	margin: var(--flg-s4) 0 var(--flg-s5);
	padding: 0;
}

.flg-no-results__suggestions li {
	padding-left: 1.3em;
	position: relative;
}

.flg-no-results__suggestions li::before {
	content: "";
	position: absolute;
	left: 0;
	top: 0.55em;
	width: 0.5rem;
	height: 0.5rem;
	background: var(--flg-leaf);
	border-radius: 0 75% 0 75%;
}

/* 404 */
.flg-error-404 {
	text-align: center;
	max-width: 46rem;
	margin-inline: auto;
}

/* The number sits on a pale bloom. */
.flg-error-404__code {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 11rem;
	height: 11rem;
	margin: 0 auto var(--flg-s5);
	background: var(--flg-bloom) center / contain no-repeat;
	color: var(--flg-green);
	font-family: var(--flg-font-head);
	font-size: 2.5rem;
	font-weight: 700;
	letter-spacing: -0.01em;
	line-height: 1;
}

.flg-error-404 .flg-search-form {
	max-width: 26rem;
	margin: var(--flg-s5) auto 0;
	text-align: left;
}

.flg-error-404 .flg-subcategories {
	justify-content: center;
	margin-top: var(--flg-s4);
}

.flg-error-404 .flg-section {
	margin-top: var(--flg-s8);
	text-align: left;
}

.flg-error-404__headline {
	margin-top: var(--flg-s7);
	font-size: var(--flg-text-xl);
}

/* --------------------------------------------------------------------------
   15. Pages and contact form
   -------------------------------------------------------------------------- */

.flg-page__header {
	margin-bottom: var(--flg-s6);
}

.flg-page__header .flg-page__title {
	margin-bottom: 0;
	padding-bottom: 1.6rem;
	background: var(--flg-petals) left bottom / 2.75rem 0.75rem no-repeat;
}

.flg-page__updated {
	margin: var(--flg-s3) 0 0;
	color: var(--flg-ink-muted);
	font-family: var(--flg-font-ui);
	font-size: var(--flg-text-sm);
}

.flg-form-notice {
	border-radius: var(--flg-leaf-sm);
	padding: var(--flg-s4) var(--flg-s5);
	margin-bottom: var(--flg-s5);
	border: 1px solid;
	font-family: var(--flg-font-ui);
	font-size: var(--flg-text-base);
}

.flg-form-notice > :last-child {
	margin-bottom: 0;
}

.flg-form-notice--success {
	background: var(--flg-mint-soft);
	border-color: var(--flg-mint-line);
	color: var(--flg-ink);
}

.flg-form-notice--error {
	background: var(--flg-blush);
	border-color: var(--flg-pink);
	color: #7d1f3f;
}

.flg-form-notice--error a {
	color: inherit;
}

.flg-form-notice__list {
	margin: var(--flg-s2) 0 0;
	padding-left: 1.2em;
}

.flg-form {
	max-width: 38rem;
	background: var(--flg-surface);
	border: 1px solid var(--flg-line);
	border-radius: var(--flg-leaf-radius);
	padding: var(--flg-s5);
}

@media (min-width: 36em) {
	.flg-form {
		padding: var(--flg-s6);
	}
}

.flg-form > :last-child {
	margin-bottom: 0;
}

.flg-form input[aria-invalid="true"],
.flg-form textarea[aria-invalid="true"] {
	border-color: var(--flg-rose-dark);
	border-width: 2px;
}

.flg-field__error {
	display: block;
	margin-top: var(--flg-s2);
	color: var(--flg-rose-dark);
	font-family: var(--flg-font-ui);
	font-size: var(--flg-text-sm);
	font-weight: 600;
}

.flg-form__honeypot {
	position: absolute;
	left: -9999px;
	width: 1px;
	height: 1px;
	overflow: hidden;
}

/* Cookie notice. The markup and a neutral inline style come from the Site
   Setup plugin; these rules (one step more specific) bring it into the
   palette. */
body .flg-cookie-notice {
	background: var(--flg-ink);
	color: var(--flg-mint);
	font-family: var(--flg-font-ui);
}

body .flg-cookie-notice a {
	color: var(--flg-pink-light);
}

body .flg-cookie-notice__button {
	min-height: 0;
	background: var(--flg-surface);
	border: 1.5px solid var(--flg-surface);
	border-radius: var(--flg-pill);
	color: var(--flg-ink);
	font-weight: 600;
	padding: 0.5rem 1.4rem;
}

body .flg-cookie-notice__button:hover,
body .flg-cookie-notice__button:focus {
	background: var(--flg-mint);
	border-color: var(--flg-mint);
	color: var(--flg-ink);
}

body .flg-cookie-notice__button:focus-visible {
	outline: 3px solid var(--flg-pink-light);
	outline-offset: 2px;
}

/* --------------------------------------------------------------------------
   16. Comments
   -------------------------------------------------------------------------- */

.flg-comments {
	margin-top: var(--flg-s9);
	padding-top: var(--flg-s6);
	border-top: 1px solid var(--flg-line);
}

.flg-comments__title {
	font-size: var(--flg-text-2xl);
}

.flg-comments .comment-list {
	list-style: none;
	margin: 0 0 var(--flg-s7);
	padding: 0;
}

.flg-comments .comment-list ol.children {
	list-style: none;
	margin: var(--flg-s4) 0 0 var(--flg-s5);
	padding: 0;
}

.flg-comments .comment-body {
	background: var(--flg-surface);
	border: 1px solid var(--flg-line);
	border-radius: var(--flg-leaf-radius);
	padding: var(--flg-s5);
	margin-bottom: var(--flg-s4);
}

.flg-comments .comment-meta {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: var(--flg-s2) var(--flg-s3);
	font-family: var(--flg-font-ui);
	font-size: var(--flg-text-sm);
	color: var(--flg-ink-muted);
	margin-bottom: var(--flg-s3);
}

.flg-comments .comment-author img {
	display: inline-block;
	border-radius: 50%;
	margin-right: var(--flg-s2);
	vertical-align: middle;
}

.flg-comments .reply {
	font-family: var(--flg-font-ui);
	font-size: var(--flg-text-sm);
	font-weight: 600;
}

.comment-respond .comment-form-cookies-consent label,
.comment-respond .comment-notes {
	font-weight: 400;
	font-size: var(--flg-text-sm);
	color: var(--flg-ink-soft);
	display: inline;
}

.comment-form p {
	margin-bottom: var(--flg-s4);
}

/* --------------------------------------------------------------------------
   17. Ad slots (empty and disabled by default; nothing renders without code)
   -------------------------------------------------------------------------- */

.flg-ad-slot {
	margin-block: var(--flg-s6);
	text-align: center;
	overflow: hidden;
}

.flg-ad-slot__label {
	display: block;
	margin-bottom: var(--flg-s2);
	color: var(--flg-ink-muted);
	font-family: var(--flg-font-ui);
	font-size: var(--flg-text-xs);
	letter-spacing: 0.08em;
	text-transform: uppercase;
}

.flg-ad-slot--sidebar {
	margin-block: 0;
}

/* --------------------------------------------------------------------------
   18. Footer — deep garden green, rounded at the top
   -------------------------------------------------------------------------- */

.flg-site-footer {
	background: var(--flg-green);
	border-radius: 2rem 2rem 0 0;
	color: #cfe0d3;
	margin-top: auto;
	padding-block: var(--flg-s8) var(--flg-s6);
	font-family: var(--flg-font-ui);
}

@media (min-width: 48em) {
	.flg-site-footer {
		border-radius: 3rem 3rem 0 0;
		padding-top: var(--flg-s9);
	}
}

.flg-site-footer :focus-visible {
	outline-color: var(--flg-pink-light);
}

.flg-footer__grid {
	display: grid;
	grid-template-columns: minmax(0, 1fr);
	gap: var(--flg-s6);
	margin-bottom: var(--flg-s7);
}

@media (min-width: 48em) {
	.flg-footer__grid {
		grid-template-columns: minmax(0, 1.6fr) minmax(0, 1fr) minmax(0, 1fr);
		gap: var(--flg-s8);
	}
}

.flg-footer__about p {
	color: #cfe0d3;
	font-size: 0.9375rem;
	line-height: 1.55;
	max-width: 40ch;
	margin-bottom: 0;
}

.flg-footer__about .flg-footer__tagline {
	color: var(--flg-mint);
	font-size: var(--flg-text-base);
	margin-bottom: var(--flg-s3);
}

.flg-footer__nav {
	min-width: 0;
}

.flg-footer__heading {
	font-family: var(--flg-font-ui);
	font-size: 0.75rem;
	font-weight: 700;
	letter-spacing: 0.1em;
	text-transform: uppercase;
	color: var(--flg-leaf-light);
	margin: 0 0 var(--flg-s3);
}

.flg-footer__about .flg-footer__heading {
	font-family: var(--flg-font-head);
	font-size: var(--flg-text-2xl);
	letter-spacing: -0.01em;
	text-transform: none;
	color: var(--flg-surface);
	margin-bottom: var(--flg-s2);
}

.flg-footer__menu {
	list-style: none;
	margin: 0;
	padding: 0;
	font-size: var(--flg-text-base);
}

.flg-footer__menu li + li {
	margin-top: 0.125rem;
}

.flg-footer__menu a {
	display: inline-block;
	padding-block: 0.3rem;
	color: var(--flg-mint);
	text-decoration: none;
}

.flg-footer__menu a:hover,
.flg-footer__menu a:focus {
	color: var(--flg-pink-light);
	text-decoration: underline;
}

.flg-footer__bottom {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: space-between;
	gap: var(--flg-s3);
	padding-top: var(--flg-s5);
	border-top: 1px solid rgba(220, 236, 223, 0.22);
	color: #cfe0d3;
	font-size: var(--flg-text-sm);
}

.flg-footer__bottom p {
	margin: 0;
}

/* --------------------------------------------------------------------------
   19. Utilities and editor alignments
   -------------------------------------------------------------------------- */

.flg-visually-balanced {
	max-width: var(--flg-measure);
}

.flg-text-center {
	text-align: center;
}

.flg-mt-0 {
	margin-top: 0;
}

.flg-mb-0 {
	margin-bottom: 0;
}

.alignleft {
	float: left;
	margin: 0 var(--flg-s5) var(--flg-s4) 0;
}

.alignright {
	float: right;
	margin: 0 0 var(--flg-s4) var(--flg-s5);
}

@media (max-width: 35.99em) {
	.alignleft,
	.alignright {
		float: none;
		margin: 0 0 var(--flg-s4);
	}
}

.aligncenter {
	display: block;
	margin-inline: auto;
}

.alignwide,
.alignfull {
	margin-inline: auto;
}

.wp-block-embed__wrapper {
	position: relative;
}

.wp-block-embed.wp-embed-aspect-16-9 .wp-block-embed__wrapper {
	aspect-ratio: 16 / 9;
}

.wp-block-embed.wp-embed-aspect-16-9 iframe {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	border: 0;
	border-radius: var(--flg-leaf-radius);
}

/* --------------------------------------------------------------------------
   20. Print — guides that read well on paper
   -------------------------------------------------------------------------- */

@media print {
	.flg-site-header,
	.flg-site-footer,
	.flg-ad-slot,
	.flg-post-nav,
	.flg-comments,
	.flg-sidebar,
	.flg-related,
	.flg-skip-link,
	.flg-breadcrumbs,
	.flg-cookie-notice {
		display: none !important;
	}

	body {
		background: #fff;
		font-size: 11pt;
	}

	.flg-content > * {
		max-width: none;
	}

	.flg-table-wrap,
	.wp-block-table {
		overflow: visible;
	}

	.flg-table-wrap table,
	.wp-block-table table {
		min-width: 0;
	}

	a {
		color: inherit;
		text-decoration: underline;
	}

	.flg-content h2,
	.flg-content h3 {
		break-after: avoid;
	}

	figure,
	.flg-callout,
	.flg-tutorial-facts,
	.flg-facts__item {
		break-inside: avoid;
	}
}
