/* ==========================================================
   Sydney Health Law — Additional CSS
   ========================================================== */

/* --- Layout ---------------------------------------------- */

:where(.wp-site-blocks) > :first-child {
	min-height: 95px;
}

.wp-block-cover,
.wp-block-cover-image {
	align-items: center;
	background-position: 50%;
	box-sizing: border-box;
	display: flex;
	justify-content: center;
	min-height: 430px;
	padding: 1em;
	position: relative;
}

.wp-block-cover.alignfull.is-light.is-style-default {
	padding: 1.25rem 8%;
	margin-top: 0;
}

/* Hero band: a smoother wash that stays tinted across the
   whole width instead of fading out to white on the right.
   Wider net than before — the gradient may sit on the cover,
   on its background span, or on a preset class. Using
   background-image rather than background so a background
   colour underneath survives. */
.wp-block-cover.alignfull .wp-block-cover__background,
.wp-block-cover.alignfull .wp-block-cover__gradient-background,
.wp-block-cover.alignfull span[class*="has-background-gradient"],
.wp-block-cover.alignfull span[aria-hidden="true"],
.wp-block-cover.alignfull.has-background-gradient,
.wp-block-cover.alignfull::before {
	background-image: linear-gradient(
		115deg,
		#d5e0f4 0%,
		#e2e9f7 40%,
		#eef1f8 75%,
		#f5f6fa 100%
	) !important;
	opacity: 1 !important;
}


/* Content width — widens the theme's default column */
.is-layout-constrained > :where(:not(.alignleft):not(.alignright):not(.alignfull)),
.wp-block-post-content,
.single .wp-block-post-content > :where(:not(.alignleft):not(.alignright):not(.alignfull)) {
	max-width: 900px;
}

/* Requires the class on the group block: Site Editor →
   select block → Advanced → Additional CSS class(es) →
   shl-intro-band. Inert until then. */
.shl-intro-band {
	background: #fafafa;
	padding-bottom: 20px !important;
	margin-top: -10px;
}


/* --- Header ---------------------------------------------- */

/* A hairline under the top bar. On single posts and pages the
   header sits above white, so it needs the separation. On the
   front page the hero band already does that job, so the rule
   is dialled back to near-invisible rather than removed —
   keeps the header height identical across templates. */
header.wp-block-template-part,
.wp-site-blocks > header {
	border-bottom: 1px solid #e8e8e5;
}

.home header.wp-block-template-part,
.blog header.wp-block-template-part,
.home .wp-site-blocks > header,
.blog .wp-site-blocks > header {
	border-bottom-color: rgba(0, 0, 0, 0.025);
}

/* Around tablet width the nav wraps onto a second line and
   lands flush on the border. Give the row a gap and the
   header room underneath. */
header .wp-block-group.is-layout-flex {
	row-gap: 0.85rem;
}

@media only screen and (max-width: 900px) {
	header.wp-block-template-part,
	.wp-site-blocks > header {
		padding-bottom: 0.9rem;
	}
}


/* --- Links and focus ------------------------------------- */

a:focus-visible,
button:focus-visible,
input:focus-visible {
	outline: 2px solid #0148a4;
	outline-offset: 2px;
}

/* One link treatment everywhere. The nav block ships a dotted
   underline on hover; this normalises it to the same thin
   solid rule used in body copy. */
/* Plain at rest, underlined on interaction. The shorthand
   goes first: it resets thickness, so the longhands below
   would be wiped if the order were reversed. */
a {
	text-decoration: none;
	text-decoration-thickness: 1px;
	text-underline-offset: 0.18em;
	text-decoration-skip-ink: auto;
}

/* All four states, not just hover. A mouse click gives :focus
   but NOT :focus-visible, which is why the dotted style kept
   coming back on click. */
a:hover,
a:focus,
a:focus-visible,
a:active {
	text-decoration-line: underline !important;
	text-decoration-style: solid !important;
	text-decoration-thickness: 1px !important;
}

/* Suppress the dotted/solid focus ring for mouse users while
   keeping it for keyboard navigation */
a:focus:not(:focus-visible) {
	outline: none;
}

/* No underline at rest in menus — only on hover */
.wp-block-navigation a,
.wp-block-navigation__responsive-container a,
.wp-block-navigation__responsive-container-content a {
	text-decoration: none;
}

/* Body copy is the exception: a faint underline at rest so
   links are findable in a dense paragraph, deepening to full
   strength on interaction. color-mix keeps it tied to the
   link colour; the rgba line above is the fallback. */
.entry-content a,
.wp-block-cover a {
	text-decoration: underline;
	text-decoration-thickness: 1px;
	text-underline-offset: 0.18em;
	text-decoration-color: rgba(26, 84, 144, 0.32);
	text-decoration-color: color-mix(in srgb, currentColor 32%, transparent);
	transition: text-decoration-color 0.15s ease;
}

.entry-content a:hover,
.entry-content a:focus,
.entry-content a:focus-visible,
.entry-content a:active,
.wp-block-cover a:hover,
.wp-block-cover a:focus,
.wp-block-cover a:focus-visible,
.wp-block-cover a:active {
	text-decoration-color: currentColor !important;
}

/* Site title is a wordmark, not a link to underline */
.wp-block-site-title a:hover,
.wp-block-site-title a:focus,
.wp-block-site-title a:focus-visible,
.wp-block-site-title a:active {
	text-decoration: none !important;
}

/* Hide the Login item if it isn't removable from the menu.
   Hides the whole row, not just the link, and covers the
   several URLs WordPress uses for it. */
.wp-block-navigation__container li:has(> a[href*="wp-admin"]),
.wp-block-navigation__container li:has(> a[href*="wp-login"]),
.wp-block-navigation__container li:has(> a[href*="/log-in"]),
.wp-block-navigation__container li:has(> a[href*="/login"]),
.wp-block-navigation-item:has(> a[href*="wp-login"]) {
	display: none !important;
}

.wp-block-navigation__container li a[href*="wp-admin"],
.wp-block-navigation__container li a[href*="wp-login"] {
	display: none;
}


/* --- Sidebar panels -------------------------------------- */

.contributors {
	background-color: #ecf2f9;
	padding-top: 32px;
	padding-bottom: 40px;
	margin-top: 0;
	margin-bottom: 0;
}

.tagcloud {
	background-color: #e9e9e9;
	padding-top: 32px;
	padding-bottom: 40px;
	margin-top: 0;
	margin-bottom: 0;
}

/* Kill the block gap WordPress writes onto the FOLLOWING
   sibling — this is what closes the white strips */
.contributors + *,
.tagcloud + * {
	margin-top: 0 !important;
}

/* One heading treatment across all four sidebar blocks */
.contributors h2,
.contributors h3,
.tagcloud h2,
.tagcloud h3 {
	font-size: 13px !important;
	letter-spacing: 0.1em;
	text-transform: uppercase;
	font-weight: 600;
	color: #4a4a45;
	margin: 0 0 16px;
	line-height: 1.3;
}

/* These are Jetpack Layout Grids, not Columns blocks: a
   12-column CSS grid placed by the column*-desktop-grid__
   classes on the container. Left panels start at line 2,
   right panels at line 6, so all four align vertically.
   The block's own drag handles are the better fix — they
   rewrite the classes for every breakpoint. */
@media only screen and (min-width: 600px) {
	.wp-block-jetpack-layout-grid.contributors > .wp-block-jetpack-layout-grid-column:nth-child(1),
	.wp-block-jetpack-layout-grid.tagcloud > .wp-block-jetpack-layout-grid-column:nth-child(1) {
		grid-column-start: 2 !important;
		grid-column-end: 6 !important;
	}

	.wp-block-jetpack-layout-grid.contributors > .wp-block-jetpack-layout-grid-column:nth-child(2),
	.wp-block-jetpack-layout-grid.tagcloud > .wp-block-jetpack-layout-grid-column:nth-child(2) {
		grid-column-start: 6 !important;
		grid-column-end: 12 !important;
	}
}


/* --- Contributors ---------------------------------------- */

.contributors ul {
	display: flex;
	flex-wrap: wrap;
	gap: 6px;
	list-style: none;
	padding: 0;
	margin: 0;
}

.contributors ul li {
	margin: 0;
	list-style: none;
}

.contributors ul li a {
	display: inline-block;
	font-size: 11px;
	line-height: 1.5;
	padding: 5px 12px;
	background: #fff;
	border-radius: 6px;
	color: #2c2c2a;
	text-decoration: none;
	white-space: nowrap;
}

.contributors ul li a:hover {
	background: #d8e4f2;
	text-decoration: underline;
}


/* --- Categories list ------------------------------------- */

.wp-block-categories-list {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 6px;
	list-style: none;
	padding: 0;
	margin: 0;
}

/* Hide sub-categories. Flattening them into the same flow
   put a pill inside a pill once the <li> became the pill;
   top-level categories are enough for a sidebar list. */
.wp-block-categories-list ul {
	display: none;
}

/* The pill is the <li>, not the <a>, so the post count is
   enclosed by it. Requires "Show hierarchy" OFF on the block —
   with it on, a parent category nests a pill inside a pill. */
.wp-block-categories-list li {
	display: inline-flex;
	align-items: baseline;
	gap: 5px;
	margin: 0;
	padding: 5px 12px;
	background: #fff;
	border-radius: 6px;
	font-size: 11px;
	line-height: 1.5;
	color: #8a877f;
	list-style: none;
	white-space: nowrap;
}

.wp-block-categories-list a {
	display: inline;
	padding: 0;
	margin: 0;
	background: none;
	border-radius: 0;
	font-size: inherit;
	line-height: inherit;
	letter-spacing: 0.01em;
	text-transform: none;
	font-weight: 400;
	color: #10457e;
	text-decoration: none;
	white-space: nowrap;
}

.wp-block-categories-list li:hover {
	background: #d8e4f2;
}

.wp-block-categories-list li:hover > a {
	text-decoration: underline;
}

/* Confirm the number by inspecting before relying on it */
.wp-block-categories-list li.cat-item-1 {
	display: none;
}


/* --- Post taxonomy --------------------------------------- */

.wp-block-post-template li > .wp-block-group,
.wp-block-post-template li {
	--wp--style--block-gap: 0;
}

.wp-block-post-terms.taxonomy-category {
	margin-top: 0 !important;
	margin-bottom: 0 !important;
	line-height: 1;
}

.wp-block-post-terms.taxonomy-category a {
	display: inline-block;
	font-size: 11px;
	line-height: 1.5;
	letter-spacing: 0.01em;
	text-transform: none;
	font-weight: 400;
	padding: 5px 12px;
	margin: 0 6px 2px 0;
	background: #e3ecf7;
	border-radius: 6px;
	color: #10457e;
	text-decoration: none;
	white-space: nowrap;
}

.wp-block-post-terms.taxonomy-category a:hover {
	background: #cddef2;
	text-decoration: underline;
}

.wp-block-post-terms.taxonomy-category .wp-block-post-terms__separator {
	display: none;
}

.wp-block-post-terms.taxonomy-post_tag {
	margin-top: 0 !important;
	margin-bottom: 0 !important;
	line-height: 1;
}

.wp-block-post-terms.taxonomy-post_tag a {
	display: inline-block;
	font-size: 11px;
	line-height: 1.5;
	padding: 5px 12px;
	margin: 0 6px 6px 0;
	background: #e4e4e2;
	border-radius: 6px;
	color: #2c2c2a;
	text-decoration: none;
	white-space: nowrap;
}

.wp-block-post-terms.taxonomy-post_tag a:hover {
	background: #cfcfcc;
	text-decoration: underline;
}

.wp-block-post-terms.taxonomy-post_tag .wp-block-post-terms__separator {
	display: none;
}

/* Cap listings at four tags; single posts show all */
.wp-block-post-template .taxonomy-post_tag a:nth-of-type(n+5) {
	display: none;
}


/* --- Front page post cards -------------------------------- */

/* Meta row: author and date sit in a flex group that
   inherits a 32px gap from the theme. The middot supplies
   the separation, so close the gap entirely. */
.wp-block-post-template .wp-block-group:has(> .wp-block-post-author-name),
.wp-block-post-template .wp-block-group.is-nowrap.is-layout-flex {
	gap: 0 !important;
}

/* Author and date share one weight and colour — neither
   should read as more important than the other */
.wp-block-post-template .wp-block-post-author-name,
.wp-block-post-template .wp-block-post-author-name a,
.wp-block-post-template .wp-block-post-author,
.wp-block-post-template .wp-block-post-author a,
.wp-block-post-template .wp-block-post-date,
.wp-block-post-template .wp-block-post-date a,
.wp-block-post-template .wp-block-post-date time {
	font-weight: 300 !important;
	font-size: 0.9rem;
	line-height: 1.5;
	color: #1a1a1a !important;
	text-decoration: none;
}

.wp-block-post-template .wp-block-post-author-name a:hover,
.wp-block-post-template .wp-block-post-date a:hover {
	color: #000;
}

.wp-block-post-template .wp-block-post-author-name::after,
.wp-block-post-template .wp-block-post-author::after {
	content: "\00b7";
	display: inline-block;
	margin: 0 0.45em;
	color: #8a877f;
	text-decoration: none;
}

/* Vertical rhythm: meta -> title -> excerpt.
   The theme sets 1.25rem above and below the title, which
   opens a gap the excerpt then repeats. */
.wp-block-post-template .wp-block-post-title {
	margin-top: 0.5rem !important;
	margin-bottom: 0.65rem !important;
}

.wp-block-post-template .wp-block-post-excerpt {
	margin-top: 0 !important;
	margin-bottom: 1.1rem !important;
}

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

/* Categories and tags read as one unit, so keep them close */
.wp-block-post-template .wp-block-post-terms.taxonomy-category {
	margin-bottom: 8px !important;
}

/* Whatever group wraps the two term rows carries a block gap
   of its own; this is usually where the daylight comes from */
.wp-block-post-template li .wp-block-group:has(> .wp-block-post-terms) {
	--wp--style--block-gap: 8px;
	row-gap: 8px;
}

/* Breathing room between one card and the next */
.wp-block-post-template > li {
	padding-bottom: 1.5rem;
}


/* --- Tag cloud ------------------------------------------- */

.wp-block-tag-cloud.is-style-outline a,
.wp-block-tag-cloud a {
	display: inline-block;
	border: 0 solid;
	font-size: 11px !important;
	line-height: 1.5;
	padding: 5px 12px;
	margin: 0 6px 6px 0;
	background: #fff;
	border-radius: 6px !important;
	color: #2c2c2a;
	text-decoration: none;
	white-space: nowrap;
}

.wp-block-tag-cloud.is-style-outline a:hover,
.wp-block-tag-cloud a:hover {
	background: #d9d9d9;
	text-decoration: underline;
}


/* --- Pill shape (single source of truth) ------------------ */

/* Every pill on the site takes the post-card shape: 11px on a
   1.5 line, 5px/12px padding, 6px radius. !important because
   WordPress writes an inline clamp() font-size onto some of
   these list items, and inline beats specificity. */
.wp-block-post-terms.taxonomy-category a,
.wp-block-post-terms.taxonomy-post_tag a,
.wp-block-categories-list li,
.wp-block-tag-cloud a,
.wp-block-tag-cloud.is-style-outline a,
.contributors ul li a {
	font-size: 11px !important;
	line-height: 1.5 !important;
	padding: 5px 12px !important;
	border-radius: 6px !important;
	letter-spacing: 0.01em;
}

/* The categories pill is the <li>, so its link must not add
   padding of its own or carry a different size */
.wp-block-categories-list li a {
	font-size: inherit !important;
	line-height: inherit !important;
	padding: 0 !important;
	border-radius: 0 !important;
}

/* Nor should the inline clamp reach the list wrappers */
.contributors ul,
.contributors ul li,
.wp-block-categories-list,
.wp-block-tag-cloud {
	font-size: 11px !important;
}


/* Categories specifically: the inline clamp() sits on the
   <ul> and each <li>, so raise specificity with the element
   name and catch any inner span as well. */
ul.wp-block-categories-list,
ul.wp-block-categories-list li,
ul.wp-block-categories-list li a,
ul.wp-block-categories-list li span,
ul.wp-block-categories-list li * {
	font-size: 11px !important;
	line-height: 1.5 !important;
}

ul.wp-block-categories-list li {
	padding: 5px 12px !important;
	min-height: 0 !important;
	height: auto !important;
}

ul.wp-block-categories-list li a {
	padding: 0 !important;
	margin: 0 !important;
}


/* --- Latest comments ------------------------------------- */

.wp-block-latest-comments {
	margin-top: 0;
	margin-bottom: 0;
	padding-left: 0;
	list-style: none;
}

.wp-block-latest-comments__comment {
	font-size: 13px;
	line-height: 1.5;
	margin-bottom: 1.25rem;
	padding-bottom: 1.25rem;
	border-bottom: 1px solid #d8d8d5;
	min-height: auto;
}

.wp-block-latest-comments__comment:last-child {
	border-bottom: none;
	margin-bottom: 0;
	padding-bottom: 0;
}

.wp-block-latest-comments__comment-author-link,
.wp-block-latest-comments__comment-link {
	font-size: 13px;
	line-height: 1.45;
	text-decoration: none;
}

/* The author link inherits a pale colour that all but
   disappears against the grey band; force it dark so it
   matches the non-linked names beside it */
.wp-block-latest-comments__comment-author-link,
.wp-block-latest-comments__comment-author {
	color: #2c2c2a !important;
}

.wp-block-latest-comments__comment-author-link:hover {
	color: #10457e !important;
}

.wp-block-latest-comments__comment-link {
	color: #10457e;
}

.wp-block-latest-comments__comment-author-link:hover,
.wp-block-latest-comments__comment-link:hover {
	text-decoration: underline;
}

.wp-block-latest-comments__comment-date {
	display: block;
	font-size: 11px;
	color: #6b6862;
	margin-top: 3px;
}

.wp-block-latest-comments__comment-excerpt p {
	font-size: 12px;
	line-height: 1.5;
	color: #555;
	margin-top: 6px;
	margin-bottom: 0;
}

.wp-block-latest-comments__comment-avatar {
	width: 32px;
	height: 32px;
	border-radius: 50%;
	margin-right: 10px;
}


/* --- Footer ---------------------------------------------- */

footer.wp-block-template-part,
.wp-site-blocks > footer {
	padding-top: 56px;
	padding-bottom: 40px;
	margin-top: 0 !important;
}

/* The wordmark renders in a different family down here;
   inherit so it matches the header */
footer .wp-block-site-title,
footer .wp-block-site-title a {
	font-family: inherit;
	font-size: 1.3rem;
	font-weight: 500;
	letter-spacing: -0.01em;
	text-decoration: none;
}

/* One column-heading treatment, whether the block is marked
   up as a heading or as a bolded paragraph */
footer h2,
footer h3,
footer h4,
footer .wp-block-column > p:first-child strong {
	font-size: 13px !important;
	letter-spacing: 0.1em;
	text-transform: uppercase;
	font-weight: 600;
	font-family: inherit;
	margin: 0 0 14px;
	line-height: 1.3;
	display: block;
}

footer p,
footer li {
	font-size: 14px;
	line-height: 1.6;
	font-family: inherit;
	margin: 0 0 10px;
}

footer a {
	color: #d4d4d0;
	font-family: inherit;
}

footer a:hover,
footer a:focus,
footer a:focus-visible {
	color: #fff;
}

footer ul {
	list-style: none;
	padding-left: 0;
	margin: 0;
}

.shl-acknowledgement {
	font-size: 13px;
	line-height: 1.65;
	color: #c4c4c0;
	max-width: 62ch;
	margin: 40px 0 24px;
	padding-top: 24px;
	border-top: 1px solid #333;
}

.shl-colophon {
	font-size: 12px;
	color: #9a9a96;
	margin: 0;
}


/* --- Typography ------------------------------------------ */

/* Post body. !important is required: the theme writes a
   font-size inline onto .entry-content, and inline styles
   beat stylesheet rules regardless of specificity. */
.entry-content {
	font-size: 1.125rem !important;
}

/* Single post title (theme default was 58px) */
.single .wp-block-post-title {
	font-size: 3rem !important;
	line-height: 1.15;
}

/* Front page and archive listing titles — kept smaller.
   !important needed here only because the rule above
   carries it; without it, that would win. */
.blog .wp-block-post-title,
.home .wp-block-post-title,
.archive .wp-block-post-title {
	font-size: 2rem !important;
	line-height: 1.25;
}

/* Stop a heading dropping one orphaned word onto its own
   line. Balancing evens out the line lengths instead.
   The <a> needs it too: the theme makes it inline-block,
   so it is the block container doing the wrapping. */
.wp-block-post-title,
.wp-block-post-title a,
.entry-content h2,
.entry-content h3 {
	text-wrap: balance;
}

/* Hero band: balance the tagline at every width, and cap the
   measure so it never runs as one very long line on wide
   screens. Remove the max-width if you want a single line
   whenever it fits. */
.wp-block-cover__inner-container p,
.wp-block-cover__inner-container h1,
.wp-block-cover__inner-container h2,
.wp-block-cover__inner-container h3 {
	font-size: clamp(1.3rem, 1.05rem + 1.05vw, 1.75rem) !important;
	line-height: 1.42;
	text-wrap: balance;
	max-width: none;
	margin-left: auto;
	margin-right: auto;
}

/* Excerpts are longer, so prefer the orphan-only rule —
   balance stops working past a few lines anyway */
.wp-block-post-excerpt__excerpt,
.wp-block-post-excerpt p {
	text-wrap: pretty;
}

/* Section headings inside posts (h3 default was 36px) */
.entry-content h2 {
	font-size: 1.75rem;
}

.entry-content h3 {
	font-size: 1.5rem;
}

blockquote {
	border-left: 1px solid #d9d9d9;
	padding-left: 24px;
	margin: 40px 0 0;
}

.wp-block-pullquote blockquote {
	margin: 0;
	padding-left: 0;
	border-left: none;
}

code {
	background-color: #f4f4f2;
	border: 1px solid #e0e0dc;
	padding: 2px 6px;
	font-size: 13px;
	font-family: inherit;
	color: #1a1a1a;
	border-radius: 4px;
	margin-left: 2px;
	vertical-align: 1px;
}

.wp-block-footnotes {
	font-size: 16px;
	word-wrap: break-word;
	padding-left: 25px;
}

sup {
	vertical-align: top;
	position: relative;
	top: -.3em;
}

sup a {
	text-decoration: none;
	font-size: 17px;
}


/* --- Images ---------------------------------------------- */

.wp-block-image figcaption {
	color: #555;
	font-size: 15px;
	margin-top: 15px;
	margin-bottom: 10px;
}

/* Featured image on SINGLE POSTS ONLY: fill the column and
   crop to a letterbox rather than padding the sides.
   object-fit: cover removes the grey bars — contain made them.
   Scoped to .single so the front-page cards are untouched. */
.single .wp-block-post-featured-image {
	max-width: none !important;
	width: 100%;
	margin-left: 0;
	margin-right: 0;
}

.single .wp-block-post-featured-image img {
	width: 100% !important;
	max-width: none !important;
	height: auto !important;
	aspect-ratio: 3.5 / 1;
	object-fit: cover;
	object-position: center;
	display: block;
}

/* Front page and archive cards: landscape crop. Constrain the
   <figure> and have the image fill it, rather than putting
   aspect-ratio on the <img> — the img carries width/height
   attributes and often sits inside a link wrapper, either of
   which can stop the ratio taking effect. */
.wp-block-post-template .wp-block-post-featured-image,
.blog .wp-block-post-featured-image,
.home .wp-block-post-featured-image,
.archive .wp-block-post-featured-image {
	aspect-ratio: 4 / 3 !important;
	overflow: hidden !important;
	display: block !important;
	width: 100%;
	margin-bottom: 0;
}

.wp-block-post-template .wp-block-post-featured-image a,
.blog .wp-block-post-featured-image a,
.home .wp-block-post-featured-image a,
.archive .wp-block-post-featured-image a {
	display: block !important;
	width: 100% !important;
	height: 100% !important;
}

.wp-block-post-template .wp-block-post-featured-image img,
.blog .wp-block-post-featured-image img,
.home .wp-block-post-featured-image img,
.archive .wp-block-post-featured-image img {
	width: 100% !important;
	height: 100% !important;
	max-height: none !important;
	aspect-ratio: auto !important;
	object-fit: cover !important;
	object-position: center !important;
	display: block !important;
}


/* --- Single post header ----------------------------------- */

/* The theme writes these as inline styles on the elements, so
   every rule here needs !important to land. */

/* Gap under the featured image. Put on the image itself, not
   on the element after it — that depends on knowing the
   sibling structure, and it does not always hold. */
.single .wp-block-post-featured-image {
	margin-bottom: 1.6rem !important;
}

.single .wp-block-post-featured-image + .wp-block-group {
	margin-top: 0 !important;
}

/* Meta line. The template nests the date and the author in
   separate rows, so both the outer wrapper and the inner rows
   need flattening to get one line. */
.single .wp-block-post-featured-image + .wp-block-group {
	display: flex !important;
	flex-wrap: wrap;
	align-items: baseline;
	justify-content: flex-start !important;
	column-gap: 0.35rem;
	row-gap: 0;
}

.single .wp-block-group:has(> .wp-block-post-date),
.single .wp-block-group:has(> .wp-block-post-author-name),
.single .wp-block-group:has(> .wp-block-post-author) {
	display: flex !important;
	align-items: baseline;
	column-gap: 0.35rem;
}

/* A constrained layout gives every child auto side margins.
   Inside a flex parent those centre the children, which is
   what was indenting the whole line. */
.single .wp-block-post-featured-image + .wp-block-group > *,
.single .wp-block-post-featured-image + .wp-block-group > * > *,
.single .wp-block-group:has(> .wp-block-post-date) > *,
.single .wp-block-group:has(> .wp-block-post-author-name) > * {
	margin-left: 0 !important;
	margin-right: 0 !important;
	max-width: none !important;
}

/* One weight and colour for every part of the line, including
   the "Posted" and "by" connectors */
.single .wp-block-post-featured-image + .wp-block-group,
.single .wp-block-post-featured-image + .wp-block-group * {
	font-weight: 300 !important;
	font-size: 0.95rem !important;
	line-height: 1.5;
	color: #55534e !important;
	margin-top: 0 !important;
	margin-bottom: 0 !important;
}

.single .wp-block-post-featured-image + .wp-block-group a:hover {
	color: #2c2c2a !important;
}

/* Single posts run at the theme's WIDE size, same as the
   front page, so the header lines up on both. Uses the
   theme's own variable rather than a number, so it cannot
   drift out of step. */
.single .is-layout-constrained > :where(:not(.alignleft):not(.alignright):not(.alignfull)),
.single .wp-block-post-content {
	max-width: var(--wp--style--global--wide-size, 1200px) !important;
}

/* Prose sits at a readable measure, ranged LEFT so it shares
   an edge with the image and title above it. Explicit element
   selectors — the :where() version was losing the cascade. */
.single .entry-content > p,
.single .entry-content > h2,
.single .entry-content > h3,
.single .entry-content > h4,
.single .entry-content > ul,
.single .entry-content > ol,
.single .entry-content > blockquote,
.single .entry-content > .wp-block-quote,
.single .entry-content > .wp-block-list {
	max-width: 780px !important;
	margin-left: 0 !important;
	margin-right: auto !important;
}

/* Even rhythm: meta -> title -> text, same gap either side
   of the title so it sits between them rather than crowding
   one and floating from the other. */
.single .wp-block-post-title {
	margin-top: 1.75rem !important;
	margin-bottom: 0 !important;
}

.single .entry-content,
.single .wp-block-post-content {
	margin-top: 1.75rem !important;
}

/* The first block inside the content carries its own top
   margin, which was stacking on top of the rule above and
   doubling the gap under the title. */
.single .entry-content > *:first-child,
.single .wp-block-post-content > *:first-child {
	margin-top: 0 !important;
	margin-block-start: 0 !important;
}


/* --- Search and buttons ---------------------------------- */

.button {
	border: none;
}

/* A soft filled field, with the icon inside its right edge
   so there is no dead space between text and magnifier */
.wp-block-search__inside-wrapper {
	width: 200px;
	border: 1px solid transparent;
	border-radius: 6px;
	background: #f2f2f0;
	padding: 0 4px 0 12px;
	align-items: center;
	transition: background-color 0.15s ease, border-color 0.15s ease;
}

.wp-block-search__inside-wrapper:focus-within {
	background: #f7f7f5;
	border-color: #c9c9c4;
}

.wp-block-search__input {
	appearance: none;
	background: none;
	border: 0;
	flex-grow: 1;
	min-width: 0;
	margin: 0;
	padding: 7px 0;
	font-size: 14px;
	line-height: 1.5;
	color: #2c2c2a;
	text-decoration: unset !important;
}

.wp-block-search__input::placeholder {
	color: #9a9a96;
	opacity: 1;
}

.wp-block-search__button {
	background: none !important;
	border: 0;
	margin: 0;
	padding: 4px 6px;
	color: #6b6862;
	cursor: pointer;
	flex-shrink: 0;
}

.wp-block-search__button:hover,
.wp-block-search__button:focus-visible {
	color: #10457e;
}

.wp-block-search__button svg {
	width: 17px;
	height: 17px;
	fill: currentColor;
	display: block;
}


/* --- Navigation ------------------------------------------- */

/* Current page: mark it with weight rather than an underline,
   so underline keeps meaning "hover" everywhere on the site */
/* Current page keeps the theme's bold on the desktop bar,
   where it reads as a useful marker. Inside the burger
   overlay the items are large and the weight difference
   reads as a mistake, so it is switched off there only. */
.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item,
.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item > a,
.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item__content,
.wp-block-navigation__responsive-container.is-menu-open li,
.wp-block-navigation__responsive-container.is-menu-open li > a,
.wp-block-navigation__responsive-container.is-menu-open .current-menu-item,
.wp-block-navigation__responsive-container.is-menu-open .current-menu-item > a,
.wp-block-navigation__responsive-container.is-menu-open .current_page_item,
.wp-block-navigation__responsive-container.is-menu-open .current_page_item > a,
.wp-block-navigation__responsive-container.is-menu-open [aria-current="page"] {
	font-weight: 400 !important;
}

/* Hover still underlines, as everywhere else */
.wp-block-navigation li > a:hover,
.wp-block-navigation li > a:focus,
.wp-block-navigation li > a:focus-visible,
.wp-block-navigation li > a:active {
	text-decoration: underline !important;
	text-decoration-thickness: 1px !important;
}


/* Mobile overlay */
.wp-block-navigation:not(.has-background)
	.wp-block-navigation__responsive-container.is-menu-open {
	background-color: #fafafa;
	color: #000;
	padding: 35px;
	font-size: 20px;
}


/* --- Mobile ---------------------------------------------- */

@media only screen and (max-width: 600px) {
	body {
		font-size: 16px;
		line-height: 1.55;
	}

	h2 {
		font-size: 26px;
	}

	h3 {
		font-size: 22px;
	}

	/* Post body: the desktop rule above is !important and
	   would otherwise hold 18px all the way down */
	.entry-content {
		font-size: 1rem !important;
	}

	.single .wp-block-post-title {
		font-size: 2rem !important;
	}

	.blog .wp-block-post-title,
	.home .wp-block-post-title,
	.archive .wp-block-post-title {
		font-size: 1.5rem !important;
	}

	/* These beat the bare h2/h3 rules above on specificity,
	   so they need restating at mobile sizes */
	.entry-content h2 {
		font-size: 26px;
	}

	.entry-content h3 {
		font-size: 22px;
	}

	.single .wp-block-post-featured-image img {
		aspect-ratio: 2.5 / 1;
	}

	sup a,
	sup {
		font-size: 12px;
	}

	.wp-block-footnotes {
		font-size: 13px;
		word-wrap: break-word;
	}

	/* Bigger type needs less band around it */
	.wp-block-cover.alignfull.is-light.is-style-default {
		padding: 1.5rem 1.25rem;
		margin-top: 0;
	}

	.wp-block-cover,
	.wp-block-cover-image {
		min-height: 170px;
	}

	.wp-block-group.has-global-padding.is-layout-constrained.wp-block-group-is-layout-constrained {
		margin-top: 0 !important;
	}

	.wp-block-navigation.items-justified-right {
		font-size: 40px;
	}

	.wp-block-list {
		padding-left: 20px !important;
	}

	.has-contrast-background-color {
		padding: 35px 25px !important;
	}

	.wp-block-image figcaption {
		font-size: 14px;
		color: #555;
	}

	.wp-block-post-terms.taxonomy-post_tag a,
	.wp-block-post-terms.taxonomy-category a,
	.wp-block-categories-list a,
	.contributors ul li a {
		font-size: 11px;
		padding: 4px 10px;
		margin: 0 5px 5px 0;
	}

	.wp-block-tag-cloud.is-style-outline a,
	.wp-block-tag-cloud a {
		font-size: 11px !important;
		padding: 4px 10px;
		margin: 0 5px 5px 0;
	}

	.wp-block-latest-comments__comment,
	.wp-block-latest-comments__comment-author-link,
	.wp-block-latest-comments__comment-link {
		font-size: 12px;
	}

	.contributors,
	.tagcloud {
		padding-top: 24px;
		padding-bottom: 28px;
	}

	/* Both bands stack to a single full-width column with the
	   same left edge, rather than inheriting different spans */
	.contributors > .wp-block-jetpack-layout-grid-column,
	.tagcloud > .wp-block-jetpack-layout-grid-column {
		grid-column: 1 / -1 !important;
		padding-left: 0 !important;
		padding-right: 0 !important;
	}

	.shl-acknowledgement {
		font-size: 12px;
		margin-top: 28px;
	}

	code {
		font-size: 12px;
		padding: 2px 5px;
		margin-left: 0;
	}
}