/* ═══════════════════════════════════════════════════════════════════
   PROSE — editor content (Gutenberg), post bodies and archive intros.

   The design has no interior page, so nothing here is measured off a
   frame; it is built from the homepage's own tokens so a legal page
   reads as the same site. Body copy is the design's 20/26 Book,
   headings its Demi red and Demi ink.

   These headings size themselves rather than sitting in a type-scale
   wrapper: the editor emits bare <h2>/<h3> and there is nothing to
   hang a .titleXXYY class on. It is the one place the wrapper rule is
   deliberately not followed - so the sizes are repeated here, once.
   ═══════════════════════════════════════════════════════════════════ */

.prose {
	color: var(--red-ink);
	font-size: clamp(18px, 17.42px + 0.149vw, 20px);
	line-height: 26px;
}

/* One rhythm for the whole flow, so a block never has to know what
   follows it. */
.prose > * + * { margin-top: 20px; }

/* The page title keeps its .title4428 wrapper for the size; the wrapper says
   nothing about weight or leading, and .prose's 26px line box would otherwise
   crush a 44px heading. */
.prose h1 {
	font-weight: 600;
	line-height: 1.273;
	color: var(--red-ink);
}

.prose h2,
.prose h3,
.prose h4 {
	font-weight: 600;
	text-wrap: balance;
}

/* 44 -> 28, the section heading */
.prose h2 {
	margin-top: clamp(30px, 25.63px + 1.121vw, 45px);
	font-size: clamp(28px, 23.34px + 1.196vw, 44px);
	line-height: 1.273;
	color: var(--red);
}

/* 32 -> 22, the card and panel title */
.prose h3 {
	margin-top: clamp(24px, 20.50px + 0.897vw, 36px);
	font-size: clamp(22px, 19.09px + 0.747vw, 32px);
	line-height: 1.28;
}

/* 28 -> 22, Head Office */
.prose h4 {
	margin-top: 24px;
	font-size: clamp(22px, 20.25px + 0.448vw, 28px);
	line-height: 1.286;
}

.prose h2:first-child,
.prose h3:first-child,
.prose h4:first-child { margin-top: 0; }

/* No `.prose p { margin: 0 }` here: style.css already zeroes every p, and such
   a rule out-specifies `.prose > * + *` (0,1,1 against 0,1,0), which silently
   removed the space between every paragraph on the page. */

.prose a {
	color: var(--red);
	text-decoration: underline;
	text-underline-position: from-font;
	transition: color .2s ease;
}
.prose a:hover,
.prose a:focus-visible { color: var(--red-ink); }

.prose ul,
.prose ol {
	padding-left: 24px;
	list-style: disc;
}
.prose ol { list-style: decimal; }
.prose li + li { margin-top: 8px; }
.prose li::marker { color: var(--red); }

.prose strong { font-weight: 600; }

.prose blockquote {
	padding-left: 20px;
	border-left: 2px solid var(--red);
	font-size: clamp(22px, 19.09px + 0.747vw, 32px);
	line-height: 1.28;
}

.prose img,
.prose figure { border-radius: var(--radius); }
.prose figcaption {
	margin-top: 10px;
	font-size: 16px;
	line-height: 21px;
	color: var(--ink-muted);
}

.prose hr {
	height: 1px;
	margin-block: clamp(30px, 25.63px + 1.121vw, 45px);
	border: 0;
	background: var(--red-tint);
}

.prose table { width: 100%; border-collapse: collapse; }
.prose th,
.prose td {
	padding: 10px 15px;
	border-bottom: 1px solid var(--red-tint);
	text-align: left;
}
.prose th { font-weight: 600; }

/* The heading a footer link targets has to clear the pinned bar, the same
   way a homepage section does. */
.prose [id] { scroll-margin-top: clamp(90px, 84.17px + 1.495vw, 110px); }