/*
Theme Name: ProjectV
Description: Project Nim editorial reference theme. Sits on top of bootstrap.min.css.
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: projectv
Fonts: IBM Plex Sans and IBM Plex Serif, SIL Open Font License 1.1.
*/

/* ---------------------------------------------------------------
   1. Fonts and tokens
   --------------------------------------------------------------- */
@font-face {
	font-family: "IBMPlexSans";
	src: url("../fonts/IBMPlexSans-Regular.woff2") format("woff2");
	font-weight: 400;
	font-style: normal;
	font-display: swap;
}
/* Real bold for strong, b, th and dt (no faux bold). Latin subset (fontsource), 24 KB. */
@font-face {
	font-family: "IBMPlexSans";
	src: url("../fonts/IBMPlexSans-SemiBold.woff2") format("woff2");
	font-weight: 600;
	font-style: normal;
	font-display: swap;
	unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC,
		U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* Headings only. Latin subset (fontsource), 20 KB. */
@font-face {
	font-family: "IBMPlexSerif";
	src: url("../fonts/IBMPlexSerif-SemiBold.woff2") format("woff2");
	font-weight: 600;
	font-style: normal;
	font-display: swap;
	unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC,
		U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

/* Metric-matched local fallback, so the heading swap does not reflow lines. */
@font-face {
	font-family: "IBMPlexSerifFallback";
	src: local("Georgia Bold"), local("Georgia-Bold");
	font-weight: 600;
	font-style: normal;
	size-adjust: 94.26%;
	ascent-override: 108.74%;
	descent-override: 29.18%;
	line-gap-override: 0%;
}

:root {
	--paper: #fbfaf7;        /* page canvas */
	--surface: #ffffff;      /* header, menus, logo plates */
	--sunk: #f3efe7;         /* intro panel, footer, correction boxes */
	--rule: #e2ddd2;         /* hairlines */
	--rule-strong: #c9c1b2;
	--ink: #1b1a17;          /* text, 16.7:1 on paper */
	--ink-2: #3f3b35;        /* secondary text, 9.7:1 on sunk */
	--muted: #5e594f;        /* meta text, 6.1:1 on sunk */
	--accent: #1d3a63;       /* the one accent: links and rules, 10:1+ */
	--accent-ink: #0f2647;
	--accent-tint: #e8edf4;
	--band: #172b46;         /* footer notice band, accent family */
	--band-2: #122339;
	--measure: 40rem;        /* about 70 characters of 18px body copy */
	--sans: "IBMPlexSans", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
	--serif: "IBMPlexSerif", "IBMPlexSerifFallback", Georgia, Cambria, "Times New Roman", serif;
}

/* ---------------------------------------------------------------
   2. Base
   --------------------------------------------------------------- */
html {
	-webkit-text-size-adjust: 100%;
	text-size-adjust: 100%;
}
body {
	font-family: var(--sans);
	color: var(--ink);
	background: var(--paper);
	font-size: 1rem;
	line-height: 1.6;
}
h1, h2, h3, h4, h5, h6 {
	font-family: var(--serif);
	font-weight: 600;
	color: var(--ink);
	letter-spacing: -0.01em;
}
h1 {
	font-size: clamp(2rem, 1.5rem + 1.6vw, 2.625rem);
	line-height: 1.14;
	margin: 0 0 1.25rem;
	text-wrap: balance;
}
h2 {
	font-size: clamp(1.375rem, 1.2rem + 0.6vw, 1.625rem);
	line-height: 1.25;
	margin: 2.1em 0 0.55em;
	text-wrap: balance;
}
h3 {
	font-size: 1.25rem;
	line-height: 1.3;
	margin: 2em 0 0.5em;
}
strong, b, dt {
	font-weight: 600;
	color: var(--ink);
}
a {
	color: var(--accent);
}
a:hover {
	color: var(--accent-ink);
}
img {
	max-width: 100%;
}

/* Focus: always visible, never colour alone. */
a:focus-visible,
button:focus-visible,
[tabindex]:focus-visible {
	outline: 2px solid var(--accent);
	outline-offset: 3px;
	border-radius: 2px;
}

.skip-link {
	position: absolute;
	left: -9999px;
	top: 0;
	z-index: 100001;
	padding: 0.6rem 1rem;
	background: var(--accent);
	color: #fff;
	font-weight: 600;
	text-decoration: underline;
}
.skip-link:focus {
	left: 1rem;
	top: 0.5rem;
	color: #fff;
}
.skip-link:focus-visible {
	outline-color: var(--accent-ink);
}

/* carried over from wp-block-library-inline-css (load-bearing) */
html :where(img[class*="wp-image-"]) {
	height: auto;
	max-width: 100%;
}

/* ---------------------------------------------------------------
   3. Masthead
   --------------------------------------------------------------- */
header {
	position: relative;
	z-index: 50;
	background: var(--surface);
	border-bottom: 1px solid var(--rule);
}
.main-head {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 1.5rem;
	max-width: 1140px;
	margin: 0 auto;
	padding: 0.7rem 15px;
	background: none;
}
.head-logo {
	display: block;
	flex: none;
}
.head-logo a {
	display: flex;
	align-items: center;
	gap: 0.7rem;
	color: var(--ink);
	text-decoration: none;
}
.head-logo a:hover {
	color: var(--accent);
	text-decoration: none;
}
.head-logo img,
.head-logo .site-logo {
	display: block;
	width: 44px;
	height: 44px;
	max-width: none;
}
/* Wordmark. The image already carries the accessible name, so the
   generated text is given an empty alternative to avoid a double read. */
.head-logo a::after {
	content: "Project Nim";
	content: "Project Nim" / "";
	font-family: var(--serif);
	font-weight: 600;
	font-size: 1.3rem;
	line-height: 1;
	letter-spacing: -0.01em;
	white-space: nowrap;
}

.header-menu {
	display: flex;
	align-items: center;
	margin: 0;
	position: relative;
}
#menu-main-menu {
	display: flex;
	flex-wrap: wrap;
	justify-content: flex-end;
	margin: 0;
	padding: 0;
	list-style: none;
}
.menu > li {
	display: block;
	margin: 0;
	position: relative;
}
.menu > li > a {
	display: inline-block;
	padding: 0.55rem 0.7rem;
	color: var(--ink-2);
	font-size: 0.9375rem;
	font-weight: 400;
	text-decoration: none;
}
.menu > li > a:hover {
	color: var(--accent);
	text-decoration: underline;
	text-decoration-thickness: 1px;
	text-underline-offset: 0.35em;
}
.menu > li.current-menu-item > a,
.menu > li.current-menu-ancestor > a {
	color: var(--accent);
	text-decoration: underline;
	text-decoration-thickness: 2px;
	text-underline-offset: 0.35em;
}

/* Desktop dropdowns: visibility (not opacity alone) keeps hidden links out of the tab order. */
.header-menu .sub-menu {
	position: absolute;
	z-index: 999;
	top: 100%;
	right: 0;
	left: auto;
	min-width: 13rem;
	margin: 0;
	padding: 0.4rem 0;
	list-style: none;
	background: var(--surface);
	border: 1px solid var(--rule);
	border-radius: 4px;
	box-shadow: 0 10px 24px rgba(27, 26, 23, 0.08);
	opacity: 0;
	visibility: hidden;
}
.header-menu .sub-menu > li {
	padding: 0;
}
.header-menu .sub-menu > li > a {
	display: block;
	padding: 0.4rem 1rem;
	color: var(--ink-2);
	font-size: 0.9375rem;
	text-decoration: none;
	white-space: nowrap;
}
.header-menu .sub-menu > li > a:hover,
.header-menu .sub-menu > li > a:focus-visible {
	background: var(--sunk);
	color: var(--accent);
}
.header-menu .sub-menu > li > a[aria-current="page"] {
	color: var(--accent);
	text-decoration: underline;
	text-underline-offset: 0.25em;
}
#menu-main-menu li.menu-item-has-children:hover > .sub-menu,
#menu-main-menu li.menu-item-has-children:focus-within > .sub-menu {
	opacity: 1;
	visibility: visible;
}
@media (prefers-reduced-motion: no-preference) {
	.header-menu .sub-menu {
		transition: opacity 0.12s ease, visibility 0.12s;
	}
}

/* Mobile opener */
.mobile-menu-icon {
	display: none;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	gap: 4px;
	width: 44px;
	height: 44px;
	min-width: 44px;
	min-height: 44px;
	padding: 0;
	border: 1px solid var(--rule);
	border-radius: 4px;
	background: var(--surface);
	cursor: pointer;
}
.mobile-menu-icon span {
	display: block;
	width: 20px;
	height: 2px;
	border-radius: 1px;
	background: var(--ink);
}
.mobile-menu-icon:hover {
	border-color: var(--rule-strong);
}
body.menu-open {
	overflow: hidden;
}

/* Mobile drawer */
.mobile-menu-overlay {
	position: fixed;
	inset: 0;
	z-index: 100000;
	display: block;
	background: rgba(23, 27, 33, 0.45);
	visibility: hidden;
}
.mobile-menu-overlay.active {
	visibility: visible;
}
.mobile-menu-overlay .mmobile-toggle {
	position: absolute;
	top: 0;
	right: 0;
	bottom: 0;
	display: block;
	width: 86%;
	max-width: 320px;
	overflow-y: auto;
	background: var(--surface);
	border-left: 1px solid var(--rule);
	padding-bottom: 2rem;
}
.mmobile-logo {
	display: flex;
	align-items: center;
	gap: 0.6rem;
	margin: 0;
	padding: 0.75rem 1.25rem;
	min-height: 4.25rem;
	text-align: left;
	border-bottom: 1px solid var(--rule);
}
.mmobile-logo::after {
	content: "Project Nim";
	content: "Project Nim" / "";
	font-family: var(--serif);
	font-weight: 600;
	font-size: 1.2rem;
	color: var(--ink);
}
.mmobile-logo img,
.mmobile-logo .site-logo {
	display: block;
	width: 44px;
	height: 44px;
}
.mobile-menu-close-button {
	position: absolute;
	top: 0.75rem;
	right: 0.75rem;
	width: 44px;
	height: 44px;
	min-width: 44px;
	min-height: 44px;
	padding: 0;
	border: 1px solid var(--rule);
	border-radius: 4px;
	background: var(--surface);
	cursor: pointer;
}
.mobile-menu-close-button span {
	position: absolute;
	left: 11px;
	top: 20px;
	width: 20px;
	height: 2px;
	background: var(--ink);
}
.close-icon .to-right {
	transform: rotate(135deg);
}
.close-icon .to-left {
	transform: rotate(45deg);
}
ul.mobmenu {
	list-style: none;
	margin: 0;
	padding: 0.5rem 1.25rem;
}
ul.mobmenu > li {
	padding: 0;
	border-bottom: 1px solid var(--rule);
}
ul.mobmenu li a {
	display: block;
	padding: 0.7rem 0;
	color: var(--ink);
	font-weight: 400;
	text-decoration: none;
}
ul.mobmenu li a[aria-current="page"] {
	color: var(--accent);
	text-decoration: underline;
	text-decoration-thickness: 2px;
	text-underline-offset: 0.3em;
}
.mobmenu .sub-menu {
	position: relative;
	list-style: none;
	margin: -0.25rem 0 0.6rem;
	padding: 0 0 0 0.9rem;
	border-left: 2px solid var(--rule);
}
.mobmenu .sub-menu li a {
	padding: 0.4rem 0;
	color: var(--ink-2);
	font-size: 0.9375rem;
}

/* ---------------------------------------------------------------
   4. Homepage intro panel (replaces the slot-machine hero)
   --------------------------------------------------------------- */
.home-banner {
	position: relative;
	padding: 3.5rem 0 3.25rem;
	background: var(--sunk);
	border-bottom: 1px solid var(--rule);
	color: var(--ink);
	text-align: left;
	box-shadow: none;
}
.home-banner .banner-background-overlay {
	display: none;
}
.home-banner .home-banner-content {
	position: relative;
}
.home-banner .container > * {
	max-width: var(--measure);
	margin-left: auto;
	margin-right: auto;
}
.home-banner h1 {
	font-size: clamp(2.125rem, 1.5rem + 2vw, 3rem);
	line-height: 1.1;
	margin-top: 0;
	margin-bottom: 0.9rem;
}
.home-banner h1::before {
	content: "";
	display: block;
	width: 3rem;
	height: 3px;
	margin-bottom: 1.4rem;
	background: var(--accent);
}
.home-banner .page-updated {
	margin-bottom: 1.1rem;
	padding: 0;
	border: 0;
}
.home-banner .home-banner-content p:not(.page-updated) {
	font-size: 1.25rem;
	line-height: 1.55;
	color: var(--ink-2);
	margin-bottom: 0;
}
.guide-links {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 0.75rem;
	margin-top: 2rem;
}
.guide-links a {
	position: relative;
	display: block;
	padding: 0.85rem 2.25rem 0.85rem 1rem;
	background: var(--surface);
	border: 1px solid var(--rule);
	border-top: 2px solid var(--accent);
	border-radius: 2px;
	color: var(--accent);
	font-size: 1rem;
	line-height: 1.35;
	text-decoration: none;
}
.guide-links a::after {
	content: "\2192";
	content: "\2192" / "";
	position: absolute;
	right: 1rem;
	top: 50%;
	transform: translateY(-50%);
	color: var(--accent);
}
.guide-links a:hover {
	background: var(--accent-tint);
	color: var(--accent-ink);
	text-decoration: underline;
	text-underline-offset: 0.25em;
}

/* ---------------------------------------------------------------
   5. Article
   --------------------------------------------------------------- */
main > .container > article {
	max-width: var(--measure);
	margin: 0 auto;
	padding: 2.25rem 0 4rem;
	font-size: 1.125rem;
	line-height: 1.68;
}
main > .container > article::after {
	content: "";
	display: block;
	clear: both;
}
article > :first-child,
article > nav.breadcrumb + h1 {
	margin-top: 0;
}
article p,
article ul,
article ol,
article dl {
	margin-bottom: 1.15em;
}
main a {
	color: var(--accent);
	text-decoration: underline;
	text-decoration-thickness: 1px;
	text-decoration-color: rgba(29, 58, 99, 0.45);
	text-underline-offset: 0.2em;
}
main a:hover {
	color: var(--accent-ink);
	text-decoration-color: currentColor;
	text-decoration-thickness: 2px;
}
article ul,
article ol {
	padding-left: 1.35em;
}
article li {
	margin-bottom: 0.45em;
	padding-left: 0.15em;
}
article li::marker {
	color: var(--accent);
}
article ol > li::marker {
	font-weight: 600;
}

/* Breadcrumb: quiet running head, not a grey pill */
.breadcrumb {
	display: block;
	margin: 0 0 1.25rem;
	padding: 0;
	background: none;
	border-radius: 0;
	font-size: 0.875rem;
	line-height: 1.5;
	color: var(--muted);
}
.breadcrumb ol {
	display: flex;
	flex-wrap: wrap;
	gap: 0.15rem 0.5rem;
	margin: 0;
	padding: 0;
	list-style: none;
}
.breadcrumb li {
	margin: 0;
	padding: 0;
}
.breadcrumb li + li::before {
	content: "/";
	margin-right: 0.5rem;
	color: var(--muted);
	opacity: 0.6;
}
.breadcrumb a {
	color: var(--muted);
	text-decoration-color: var(--rule-strong);
}
.breadcrumb a:hover {
	color: var(--accent);
}
.breadcrumb [aria-current="page"] {
	color: var(--muted);
}

/* Dateline and byline, set between hairlines like a newspaper byline */
.page-updated {
	margin: 0;
	padding-top: 0.8rem;
	border-top: 1px solid var(--rule);
	font-size: 0.875rem;
	line-height: 1.5;
	color: var(--muted);
}
.editorial-note {
	margin: 0.3rem 0 0;
	padding-bottom: 0.9rem;
	border-bottom: 1px solid var(--rule);
	font-size: 0.875rem;
	line-height: 1.55;
	color: var(--muted);
}
article .page-updated:not(:has(+ .editorial-note)) {
	padding-bottom: 0.8rem;
	border-bottom: 1px solid var(--rule);
}
.editorial-note a {
	color: var(--accent);
}
/* Standfirst: the first paragraph after the byline. Positional by design (no markup
   change): it only matches a direct child of the article that follows the dateline,
   the byline note or the provider logo. New pages get it automatically. */
main article > .page-updated + p:not(.editorial-note),
main article > .editorial-note + p,
main article > .provider-mark + p {
	margin-top: 1.6rem;
	font-size: 1.25rem;
	line-height: 1.55;
	color: var(--ink-2);
}

/* Provider logo: a small inset plate beside the standfirst */
.provider-mark {
	float: right;
	width: 8.5rem;
	max-width: 8.5rem;
	margin: 1.75rem 0 1rem 1.75rem;
	padding: 0.4rem;
	background: var(--surface);
	border: 1px solid var(--rule);
}
.provider-mark img {
	display: block;
	width: 100%;
	height: auto;
}
article h2 {
	clear: both;
}
figcaption {
	color: var(--muted);
	font-size: 0.875rem;
	margin: 8px 0 28px;
}

/* Corrections: boxed, like a printed correction notice */
.source-note {
	margin: 2.75rem 0 1rem;
	padding: 1rem 1.25rem 1.05rem;
	background: var(--sunk);
	border: 1px solid var(--rule);
	border-top: 3px solid var(--accent);
	font-size: 0.9375rem;
	line-height: 1.6;
	color: var(--ink-2);
}
.source-note + .source-note {
	margin-top: 0.75rem;
}

/* Definition lists */
article dt {
	font-family: var(--serif);
	font-weight: 600;
	font-size: 1.0625rem;
	margin-top: 1.1rem;
}
article dd {
	margin: 0.2rem 0 0;
	padding-left: 1rem;
	border-left: 2px solid var(--rule);
}

/* ---------------------------------------------------------------
   6. Tables: ruled, no cell grid
   --------------------------------------------------------------- */
.table-scroll {
	overflow-x: auto;
	margin: 1.75rem 0 2rem;
	border-top: 2px solid var(--ink);
	-webkit-overflow-scrolling: touch;
	/* Scroll hint: the paper-coloured covers move with the content, the shadows stay
	   at the edges, so a shadow only shows where there is more table to scroll to. */
	background:
		linear-gradient(to right, var(--paper) 30%, rgba(251, 250, 247, 0)) left center / 2.5rem 100% no-repeat local,
		linear-gradient(to left, var(--paper) 30%, rgba(251, 250, 247, 0)) right center / 2.5rem 100% no-repeat local,
		radial-gradient(farthest-side at 0 50%, rgba(27, 26, 23, 0.16), rgba(27, 26, 23, 0)) left center / 0.875rem 100% no-repeat scroll,
		radial-gradient(farthest-side at 100% 50%, rgba(27, 26, 23, 0.16), rgba(27, 26, 23, 0)) right center / 0.875rem 100% no-repeat scroll;
}
.table-scroll:focus-visible {
	outline-offset: 4px;
}
table {
	width: 100%;
	margin-bottom: 0;
	border-collapse: collapse;
}
.table-scroll table {
	width: 100%;
	min-width: 520px;
	border-collapse: collapse;
	font-size: 0.9375rem;
	line-height: 1.5;
}
table th,
table td,
.table-scroll th,
.table-scroll td {
	padding: 0.75rem 1rem 0.75rem 0;
	border: 0;
	border-bottom: 1px solid var(--rule);
	text-align: left;
	vertical-align: top;
	background: none;
}
table th:last-child,
table td:last-child {
	padding-right: 0;
}
.table-scroll thead {
	background: none;
}
table thead th {
	padding-top: 0.6rem;
	padding-bottom: 0.6rem;
	border-bottom: 1px solid var(--ink-2);
	font-family: var(--sans);
	font-size: 0.8125rem;
	font-weight: 400;
	letter-spacing: 0.06em;
	text-transform: uppercase;
	color: var(--muted);
	background: none;
}
table tbody th {
	font-family: var(--serif);
	font-weight: 600;
	font-size: 1rem;
	color: var(--ink);
	background: none;
}
table tbody tr:last-child > * {
	border-bottom: 1px solid var(--rule-strong);
}

/* ---------------------------------------------------------------
   7. Footer
   --------------------------------------------------------------- */
footer .footer-top {
	background: var(--sunk);
	border-top: 1px solid var(--rule);
	font-size: 0.9375rem;
}
footer .footer-top .footer-top-grid {
	display: grid;
	grid-template-columns: minmax(0, 1.5fr) minmax(0, 1fr) minmax(0, 1fr);
	gap: 2rem;
	padding: 3rem 0 2.75rem;
	border-top: 0;
}
footer .footer-top .footer-top-grid .footer-top-desc,
footer .footer-top .footer-top-grid .footer-top-menu {
	padding: 0;
}
.footer-top-desc .textwidget {
	display: grid;
	grid-template-columns: 44px minmax(0, 1fr);
	column-gap: 0.75rem;
	align-items: center;
}
.footer-top-desc .site-logo {
	grid-column: 1;
	width: 44px;
	height: 44px;
	max-width: none;
}
.footer-top-desc .site-name {
	grid-column: 2;
	margin: 0;
	font-family: var(--serif);
	font-weight: 600;
	font-size: 1.25rem;
	line-height: 1.2;
	color: var(--ink);
}
.footer-top-desc .textwidget > p:not(.site-name),
.footer-top-desc .textwidget > a {
	grid-column: 1 / -1;
	justify-self: start;
}
.footer-top-desc .textwidget > p:not(.site-name) {
	max-width: 28rem;
	margin: 1rem 0 0.6rem;
	color: var(--ink-2);
}
.footer-top-desc a {
	color: var(--accent);
	text-decoration: underline;
	text-decoration-color: rgba(29, 58, 99, 0.45);
	text-underline-offset: 0.2em;
}
.footer-menu-wrap ul {
	list-style: none;
	margin: 0;
	padding: 0;
}
.footer-menu-wrap ul li a {
	display: inline-block;
	padding: 0.2rem 0;
	color: var(--ink-2);
	text-decoration: none;
}
.footer-menu-wrap ul li a:hover,
.footer-top-desc a:hover {
	color: var(--accent-ink);
	text-decoration: underline;
	text-decoration-color: currentColor;
	text-underline-offset: 0.2em;
}
.footer-menu-wrap .footer-title {
	margin: 0 0 0.6rem;
	padding-bottom: 0.5rem;
	border-bottom: 1px solid var(--rule-strong);
	font-family: var(--serif);
	font-weight: 600;
	font-size: 1rem;
	color: var(--ink);
}

/* Responsible-gambling notice band */
.rg-notice {
	background: var(--band);
	color: #e7ecf3;
	font-size: 0.875rem;
	line-height: 1.65;
	padding: 1.5rem 0 1.1rem;
}
.rg-notice p {
	margin: 0 0 0.6rem;
	max-width: 62rem;
}
.rg-notice strong {
	color: #fff;
}
.rg-notice a {
	color: #fff;
	text-decoration: underline;
	text-decoration-color: rgba(255, 255, 255, 0.55);
	text-underline-offset: 0.2em;
}
.rg-notice a:hover {
	color: #fff;
	text-decoration-color: #fff;
}
.rg-notice .editorial-links {
	color: #b9c4d4;
	font-size: 0.875rem;
	margin: 0;
}
.editorial-links a {
	display: inline-block;
	margin: 0.15rem 0;
	padding: 0.2rem 0;
}
.rg-notice a:focus-visible,
.footer-copyright a:focus-visible {
	outline-color: #fff;
}
.footer-copyright {
	background: var(--band-2);
	color: #c9d2de;
	font-size: 0.8125rem;
	padding: 0.9rem 0;
}
.footer-copyright p {
	margin: 0;
	text-align: left;
}

/* ---------------------------------------------------------------
   8. Utility pages
   --------------------------------------------------------------- */
.error404 main > .container {
	max-width: var(--measure);
}
.error404 main h1 {
	margin-bottom: 1rem;
}
.error404 main ul li {
	margin: 0.35rem 0;
}

/* Legacy theme components kept for any page that still uses them */
.border-wrapper-white {
	background: var(--surface);
	border: 1px solid var(--rule);
	border-radius: 4px;
	padding: 15px;
	margin: 5px;
}
.site-name {
	font-family: var(--serif);
	font-weight: 600;
	color: var(--ink);
}
.site-logo {
	max-width: 120px;
	height: auto;
}

/* ---------------------------------------------------------------
   9. Responsive
   --------------------------------------------------------------- */
@media (min-width: 768px) and (max-width: 991px) {
	.head-logo a::after {
		display: none;
	}
	.menu > li > a {
		padding: 0.55rem 0.45rem;
		font-size: 0.875rem;
	}
}

@media (max-width: 767px) {
	.container {
		padding-left: 20px;
		padding-right: 20px;
	}
	.main-head {
		padding: 0.6rem 20px;
	}
	.hidden-md-down,
	#menu-main-menu.hidden-md-down {
		display: none;
	}
	.mobile-menu-icon {
		display: flex;
	}
	.head-logo img,
	.head-logo .site-logo {
		width: 38px;
		height: 38px;
	}
	.head-logo a {
		gap: 0.6rem;
	}
	.head-logo a::after {
		font-size: 1.2rem;
	}

	.home-banner {
		padding: 2.25rem 0 2.25rem;
	}
	.home-banner h1 {
		font-size: 2.125rem;
	}
	.home-banner .home-banner-content p:not(.page-updated) {
		font-size: 1.125rem;
	}
	.guide-links {
		grid-template-columns: 1fr;
		gap: 0.5rem;
		margin-top: 1.5rem;
	}

	main > .container > article {
		padding: 1.5rem 0 3rem;
		font-size: 1.0625rem;
		line-height: 1.65;
	}
	main h1 {
		font-size: 2rem;
		line-height: 1.15;
	}
	main article > .page-updated + p:not(.editorial-note),
	main article > .editorial-note + p,
	main article > .provider-mark + p {
		font-size: 1.125rem;
	}
	.provider-mark {
		width: 6rem;
		max-width: 6rem;
		margin: 1.6rem 0 0.75rem 1rem;
	}
	.source-note {
		padding: 0.9rem 1rem;
	}
	.error404 main > .container {
		padding-left: 20px !important;
		padding-right: 20px !important;
	}
	.table-scroll table {
		min-width: 480px;
		font-size: 0.875rem;
	}
	table thead th {
		font-size: 0.75rem;
	}
	table tbody th {
		font-size: 0.9375rem;
	}

	footer .footer-top .footer-top-grid {
		grid-template-columns: 1fr 1fr;
		gap: 2rem 1.5rem;
		padding: 2.25rem 0 2rem;
		text-align: left;
	}
	footer .footer-top .footer-top-grid .footer-top-desc {
		grid-column: 1 / -1;
	}
	footer .footer-top .footer-top-grid .footer-top-desc,
	footer .footer-top .footer-top-grid .footer-top-menu {
		margin: 0;
	}
}

@media (prefers-reduced-motion: reduce) {
	*,
	*::before,
	*::after {
		transition: none !important;
		animation: none !important;
		scroll-behavior: auto !important;
	}
}

/* ---------------------------------------------------------------
   Restyle additions (2026-10)
   --------------------------------------------------------------- */
/* Caret on top-level items that open a submenu */
.menu > .menu-item-has-children > a::after {
	content: "";
	display: inline-block;
	width: 0.36em;
	height: 0.36em;
	margin-left: 0.45em;
	border-right: 1.5px solid currentColor;
	border-bottom: 1.5px solid currentColor;
	transform: translateY(-0.2em) rotate(45deg);
}

/* Phones: footer editorial links one per line, so no separator dangles at a line end.
   The " · " separators are text nodes in the markup; font-size 0 hides them visually. */
@media (max-width: 575px) {
	.editorial-links {
		font-size: 0;
	}
	.editorial-links a {
		display: block;
		font-size: 0.875rem;
	}
}

@media print {
	.skip-link,
	header .menu,
	.mobile-menu-icon,
	.mobile-menu-overlay,
	.footer-top-menu,
	.footer-menu-wrap {
		display: none !important;
	}
	body,
	main,
	.home-banner,
	.footer,
	.rg-notice,
	.footer-copyright {
		background: #fff !important;
		color: #000 !important;
	}
	a {
		color: #000;
		text-decoration: underline;
	}
	.table-scroll {
		overflow: visible;
		background: none;
	}
	h1, h2, h3 {
		break-after: avoid;
	}
}