/*
Theme Name:   GeneratePress Sierra NSP
Theme URI:    https://www.sierra-nsp.org/
Description:  Child theme of GeneratePress that keeps the classic Frontier look of sierra-nsp.org (Sierra NSP blues, banner, tabbed nav, Links sidebar, dark bottom bar) plus the Aug 2026 approved custom styles (Welcome cards, join steps, contact blocks, Caltrans cards, form buttons).
Author:       Webster for Doug Coatney
Template:     generatepress
Version:      1.1.1
License:      GNU General Public License v2 or later
Text Domain:  generatepress-sierra
*/

/* ==========================================================================
   0. Fonts (same self-hosted files Frontier ships)
   ========================================================================== */
@font-face { font-display: swap; font-family: 'Roboto Condensed'; font-style: normal; font-weight: 400; src: url('fonts/roboto-condensed-v25-latin-regular.woff2') format('woff2'); }
@font-face { font-display: swap; font-family: 'Roboto Condensed'; font-style: normal; font-weight: 700; src: url('fonts/roboto-condensed-v25-latin-700.woff2') format('woff2'); }
@font-face { font-display: swap; font-family: 'Arimo'; font-style: normal; font-weight: 400; src: url('fonts/arimo-v27-latin-regular.woff2') format('woff2'); }
@font-face { font-display: swap; font-family: 'Arimo'; font-style: normal; font-weight: 700; src: url('fonts/arimo-v27-latin-700.woff2') format('woff2'); }

:root {
	--nsp-navy: #2A5A8E;        /* Frontier motif / menu blue */
	--nsp-navy-dark: #023266;   /* Frontier menu divider (dark) */
	--nsp-navy-light: #4878AC;  /* Frontier menu divider (light) */
	--nsp-ink: #14324f;         /* Welcome cards */
	--nsp-band: #12263c;        /* banner side fill */
	--nsp-gold: #DC8300;        /* Frontier gold */
	--nsp-link: #0E4D7A;
	--nsp-link-hover: #0000EE;
	--nsp-text: #303030;
	--nsp-main: #F5F5F5;
	--nsp-bar: #222222;
	--nsp-heading-font: 'Roboto Condensed', 'Arial Narrow', Arial, sans-serif;
	--nsp-body-font: Arial, Helvetica, sans-serif;
	--nsp-content-font: Arimo, Arial, Helvetica, sans-serif;
}

/* ==========================================================================
   1. Page canvas: Frontier snow background, 16.5px Arial body
   ========================================================================== */
html,
body {
	overflow-x: hidden;
}
body {
	background: #505050 url('images/snow_4.jpg') repeat left top;
	/* Webster 2026-09-29 perf: same snow art as WebP (43 KB vs 495 KB); browsers without image-set()/type() keep the JPEG above. */
	background-image: image-set(url('images/snow_4.webp') type('image/webp'), url('images/snow_4.jpg') type('image/jpeg'));
	color: var(--nsp-text);
	font-family: var(--nsp-body-font);
	font-size: 16.5px;
	line-height: 1.55;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
	text-rendering: optimizeLegibility;
}
a {
	color: var(--nsp-link);
}
a:hover,
a:focus {
	color: var(--nsp-link-hover);
}
h1, h2, h3, h4, h5, h6 {
	font-family: var(--nsp-heading-font);
	font-weight: 400;
	line-height: 1.2;
	color: inherit;
	text-transform: none;
}
h1 { font-size: 1.5rem; }
h2 { font-size: 1.375rem; }
h3 { font-size: 1.25rem; }
h4 { font-size: 1.125rem; }
h5 { font-size: 1rem; }
h6 { font-size: 0.875rem; }
h1, h2 { letter-spacing: -0.02em; }

/* ==========================================================================
   2. Banner header: header_nsp.jpg (1100x300 baked wordmark + logos).
      Whole image always visible (never cover/crop). Navy side fill when wider.
   ========================================================================== */
.site-header.nsp-banner {
	background: var(--nsp-band);
	padding: 0;
	margin: 0 auto;
	line-height: 0;
	text-align: center;
}
.nsp-banner .nsp-banner-link {
	display: block;
	max-width: 1100px;
	margin: 0 auto;
}
/* Webster 2026-09-29 perf: the banner <img> now sits in a <picture> (WebP source); keep it a block box. */
.nsp-banner picture {
	display: block;
}
.nsp-banner img {
	display: block;
	width: 100%;
	max-width: 1100px;
	height: auto;
	aspect-ratio: 1100 / 300;
	margin: 0 auto;
	object-fit: contain;
}
/* Up to 1100px Frontier kept the banner inside the page column. */
@media (max-width: 1144px) {
	.site-header.nsp-banner {
		width: calc(100% - 24px);
		box-shadow: 0 0 6px #000;
	}
}

/* ==========================================================================
   3. Page column (Frontier #container): 1120px, drop shadow
   ========================================================================== */
#nsp-frame {
	width: calc(100% - 24px);
	max-width: 1120px;
	margin: 0 auto;
	background: var(--nsp-main);
	box-shadow: 0 0 6px #000;
}
@media (min-width: 1145px) {
	#nsp-frame { width: 100%; }
}
#nsp-frame .grid-container,
#nsp-frame .site.grid-container {
	max-width: none;
	width: 100%;
}
.separate-containers .site-content,
.site-content {
	background: var(--nsp-main);
	padding: 24px 21px 42px 30px;
}

/* ==========================================================================
   4. Main navigation: Frontier tabs on #2A5A8E
   ========================================================================== */
.main-navigation,
.main-navigation ul ul {
	background-color: var(--nsp-navy);
}
.main-navigation {
	padding: 4px 8px 4px 10px;
	line-height: 1.2;
	font-family: var(--nsp-heading-font);
}
.main-navigation .inside-navigation {
	padding: 0;
	justify-content: flex-start;
}
.main-navigation .main-nav > ul {
	border-left: 1px solid var(--nsp-navy-dark);
	border-right: 1px solid var(--nsp-navy-light);
}
.main-navigation .main-nav > ul > li {
	background: linear-gradient(to bottom, transparent 70%, rgba(0, 0, 0, 0.15) 100%);
	border-right: 1px solid var(--nsp-navy-dark);
	border-left: 1px solid var(--nsp-navy-light);
}
.main-navigation .main-nav > ul > li > a,
.main-navigation .main-nav > ul > li.menu-item-has-children > a {
	min-width: 80px;
	padding: 11px 16px;
	line-height: 1.2;
	text-align: center;
	color: #fff;
	font-family: var(--nsp-heading-font);
	font-size: 16px;
	font-weight: 400;
	text-shadow: 0 0 2px #222;
	transition: background-color 0.14s ease-out, color 0.14s ease-out;
}
.main-navigation .main-nav > ul > li:hover > a,
.main-navigation .main-nav > ul > li > a:hover,
.main-navigation .main-nav > ul > li > a:focus,
.main-navigation .main-nav > ul > li.sfHover > a {
	background-color: #fff;
	color: #000;
	text-shadow: none;
}
/* Current page: white, black text (Aug 2026 rule, now working on live). */
.main-navigation .main-nav > ul > li.current-menu-item > a,
.main-navigation .main-nav > ul > li.current_page_item > a,
.main-navigation .main-nav > ul > li.current-menu-ancestor > a,
.main-navigation .main-nav > ul > li.current-menu-parent > a,
.main-navigation .main-nav > ul > li.current_page_ancestor > a,
.main-navigation .main-nav ul ul li.current-menu-item > a {
	background-color: #fff;
	color: #111;
	text-shadow: none;
}

/* Desktop: Aug 2026 approved pill menu (live "Sierra NSP visual modern" + "button hover").
   Live applies it from 841px; GeneratePress's desktop menu starts at 769px. */
@media (min-width: 769px) {
	.main-navigation .main-nav > ul {
		border-left: none;
		border-right: none;
	}
	.main-navigation .main-nav > ul > li {
		background: none;
		border-left: none;
		border-right: none;
	}
	.main-navigation .main-nav > ul > li > a,
	.main-navigation .main-nav > ul > li.menu-item-has-children > a {
		border-radius: 999px;
		margin: 4px 2px;
		padding: 8px 16px;
		transition: background 150ms ease, color 150ms ease;
	}
	.main-navigation .main-nav > ul > li.current-menu-item > a:hover,
	.main-navigation .main-nav > ul > li.current_page_item > a:hover,
	.main-navigation .main-nav > ul > li.current-menu-ancestor > a:hover,
	.main-navigation .main-nav > ul > li.current-menu-parent > a:hover,
	.main-navigation .main-nav > ul > li.current_page_ancestor > a:hover {
		background-color: #fff8ee;
		color: #111;
	}
}
/* Dropdown chevron after the label (Frontier used a Genericon). */
.main-navigation .main-nav > ul > li > a .dropdown-menu-toggle {
	padding: 0 0 0 7px;
	line-height: 1;
	height: auto;
	display: inline-block;
	vertical-align: 1px;
}
.main-navigation .dropdown-menu-toggle .gp-icon svg {
	width: 0.7em;
	height: 0.7em;
}
/* Sub-menu: Frontier dark flyout */
.main-navigation ul ul,
.main-navigation .main-nav ul ul {
	background-color: #2B2B2B;
	width: 180px;
	border: 1px solid #000;
	box-shadow: 0 1px 4px #000;
}
.main-navigation .main-nav ul ul li {
	border-top: 1px solid #3B3B3B;
	border-bottom: 1px solid #000;
	background: none;
}
.main-navigation .main-nav ul ul li:first-child { border-top: none; }
.main-navigation .main-nav ul ul li:last-child { border-bottom: none; }
.main-navigation .main-nav ul ul li a {
	padding: 10px 14px;
	line-height: 1.2;
	color: #fff;
	font-size: 15px;
	text-align: left;
	text-shadow: 0 0 2px #222;
}
.main-navigation .main-nav ul ul li a:hover,
.main-navigation .main-nav ul ul li a:focus,
.main-navigation .main-nav ul ul li.current-menu-item > a {
	background-color: #fff;
	color: #000;
	text-shadow: none;
}

/* Mobile: a tidy "Menu" bar that opens Frontier-style stacked rows. */
.main-navigation .menu-toggle {
	width: 100%;
	padding: 12px 16px;
	line-height: 1.2;
	color: #fff;
	background: transparent;
	font-family: var(--nsp-heading-font);
	font-size: 17px;
	letter-spacing: 0.02em;
	text-align: left;
	text-shadow: 0 0 2px #222;
}
.main-navigation .menu-toggle:hover,
.main-navigation .menu-toggle:focus {
	background: rgba(255, 255, 255, 0.08);
	color: #fff;
}
.main-navigation .menu-toggle .gp-icon svg {
	width: 1.1em;
	height: 1.1em;
	vertical-align: -3px;
}
@media (max-width: 768px) {
	.main-navigation {
		padding: 0;
	}
	.main-navigation .main-nav > ul {
		border: none;
	}
	.main-navigation.toggled .main-nav > ul {
		border-top: 1px solid var(--nsp-navy-dark);
	}
	.main-navigation.toggled .main-nav > ul > li {
		border-left: none;
		border-right: none;
		border-bottom: 1px solid #1c3f66;
	}
	.main-navigation.toggled .main-nav > ul > li:last-child { border-bottom: none; }
	.main-navigation.toggled .main-nav > ul > li > a,
	.main-navigation.toggled .main-nav > ul > li.menu-item-has-children > a {
		text-align: left;
		padding: 12px 18px;
	}
	.main-navigation.toggled .main-nav ul ul {
		width: 100%;
		border: none;
		box-shadow: none;
	}
	.main-navigation.toggled .main-nav ul ul li a {
		padding: 11px 18px 11px 34px;
	}
	.main-navigation.toggled .main-nav > ul > li.menu-item-has-children > a .dropdown-menu-toggle {
		float: right;
		padding: 2px 4px 2px 20px;
	}
}

/* ==========================================================================
   5. Layout: content 65% / Links sidebar 35%; stack at 960px like Frontier
   ========================================================================== */
.separate-containers .site-main,
.right-sidebar.separate-containers .site-main {
	margin: 0;
}
.site-content .content-area {
	width: 65%;
	padding-right: 16px;
}
.site-content .is-right-sidebar {
	width: 35%;
	padding-left: 4px;
}
@media (min-width: 961px) {
	/* Frontier's inline-block sidebar sat ~5px higher than the content card. */
	.site-content .is-right-sidebar .inside-right-sidebar {
		margin-top: -5px;
	}
}
.no-sidebar .site-content .content-area {
	width: 100%;
	padding-right: 14px;
}
.separate-containers .inside-right-sidebar {
	margin-top: 0;
	margin-bottom: 0;
}
@media (max-width: 960px) {
	.site-content {
		flex-direction: column;
	}
	.site-content .content-area,
	.site-content .is-right-sidebar,
	.no-sidebar .site-content .content-area {
		width: 100%;
		padding-left: 0;
		padding-right: 0;
	}
	.site-content .is-right-sidebar {
		margin-top: 18px;
	}
}
@media (max-width: 600px) {
	/* Polish: slimmer gutters on phones so the text column is wider. */
	.separate-containers .site-content,
	.site-content {
		padding: 14px 10px 20px;
	}
}

/* ==========================================================================
   6. Content card (Frontier .single-view + Aug 2026 modern pass)
   ========================================================================== */
.separate-containers .inside-article,
.one-container .site-content .inside-article {
	background: #fff;
	border: 1px solid #e2e6eb;
	border-radius: 8px;
	box-shadow: 0 1px 3px rgba(16, 24, 40, 0.08);
	padding: 18px 22px 24px;
	word-wrap: break-word;
}
.separate-containers .site-main > * {
	margin-bottom: 10px;
}
@media (max-width: 600px) {
	.separate-containers .inside-article {
		padding: 16px 16px 20px;
	}
}
.entry-header {
	margin-bottom: 4px;
}
.entry-header .entry-title,
h1.entry-title {
	font-family: var(--nsp-heading-font);
	font-size: 1.5rem;
	font-weight: 400;
	line-height: 1;
	color: var(--nsp-text);
	letter-spacing: -0.02em;
	margin: 0;
}
.entry-title a {
	pointer-events: none;
	text-decoration: none;
	color: inherit;
}
.inside-article > .entry-content:not(:first-child),
.inside-article > .entry-summary:not(:first-child) {
	margin-top: 4px;
}
.page .entry-meta,
.page .entry-byline {
	display: none;
}
.page .comments-area,
.page #comments {
	display: none;
}

/* Post content: Arimo 15px / 1.6 like Frontier .single-view .entry-content */
.entry-content {
	font-family: var(--nsp-content-font);
	font-size: 0.938rem;
	line-height: 1.6;
}
.entry-content a {
	color: var(--nsp-link);
	text-decoration: underline;
}
.entry-content a:hover,
.entry-content a:focus {
	color: var(--nsp-link-hover);
}
.entry-content p {
	margin: 4px 0 12px;
}
.entry-content h1,
.entry-content h2,
.entry-content h3,
.entry-content h4,
.entry-content h5,
.entry-content h6 {
	clear: none;
	margin: 0;
	line-height: 1.5;
	font-weight: 400;
}
.entry-content h2 {
	font-size: 1.375rem;
	letter-spacing: -0.02em;
}
/* Aug 2026 join list/h3 punch */
.entry-content h3 {
	color: var(--nsp-navy);
	margin: 1.35em 0 0.4em;
	font-size: 1.15em;
}
.entry-content strong,
.entry-content b {
	font-weight: 700;
}

/* Lists (Aug 2026 list treatment) */
.entry-content ul,
.entry-content ol {
	margin: 0.6em 0 1.15em;
	padding-left: 1.7em;
}
.entry-content li {
	margin: 0.45em 0;
	line-height: 1.45;
	list-style-position: outside;
	list-style-type: disc;
}
.entry-content ol > li { list-style-type: decimal; }
.entry-content ol > li > ol > li { list-style-type: lower-alpha; }
.entry-content li ul,
.entry-content li ol {
	margin: 0.35em 0 0.5em;
}
.entry-content .page-links li { margin: 0.35em 0; }
/* Join Patrol: maneuvers stay bullets inside step 2 (Aug 2026 rule, now working on live). */
.entry-content ol > li > ul {
	list-style-type: disc;
	margin: 0.4em 0 0.2em;
	padding-left: 1.3em;
}
.entry-content ol > li > ul > li {
	list-style-type: disc;
}

/* Media */
.entry-content img {
	height: auto;
	max-width: 100%;
}
.entry-content iframe {
	max-width: 100%;
	width: 100%;
	aspect-ratio: 16 / 9;
	height: auto;
}
.alignleft { float: left; margin: 4px 8px 4px 0; }
.alignright { float: right; margin: 4px 0 4px 8px; }
.aligncenter { display: block; margin: 4px auto; }
.entry-content table { width: 98%; border-collapse: collapse; margin: 10px auto; }
.entry-content th, .entry-content td { border: 1px solid #AAA; padding: 8px 10px; font-size: 0.875rem; }
.entry-content th { background-color: #DDD; font-weight: normal; }
/* Plain rule like Frontier (browser default), not GP's 40px-spaced hairline. */
.entry-content hr {
	height: 0;
	margin: 0.5em 0;
	border: 0;
	border-top: 1px solid #9a9a9a;
	border-bottom: 1px solid #eeeeee;
	background: none;
}
blockquote {
	background-color: #EDEDED;
	border-left: 6px solid #687888;
	margin: 20px;
	padding: 10px 14px 2px;
	font-style: italic;
	font-size: inherit;
}

/* ==========================================================================
   7. Welcome landing cards (Aug 2026 approved: navy tiles, gold rail, lift)
   ========================================================================== */
.nsp-welcome-cards {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 14px;
	margin: 0.85em 0 1.25em;
}
a.nsp-card,
.nsp-card {
	display: flex;
	align-items: center;
	min-height: 92px;
	padding: 18px 20px 18px 18px;
	background: var(--nsp-ink);
	color: #fff !important;
	text-decoration: none !important;
	font-weight: 700;
	font-size: 1.06rem;
	line-height: 1.35;
	letter-spacing: 0.01em;
	border-radius: 8px;
	border-left: 5px solid var(--nsp-gold);
	box-shadow: 0 8px 18px rgba(8, 18, 32, 0.35);
	cursor: pointer;
	transition: transform 150ms ease, box-shadow 150ms ease, background 150ms ease, border-color 150ms ease;
}
.nsp-welcome-cards a:hover,
.nsp-welcome-cards a:focus,
.nsp-welcome-cards a:focus-visible,
a.nsp-card:hover,
a.nsp-card:focus,
a.nsp-card:focus-visible,
.nsp-card:hover {
	background: #1f6aad;
	border-left-color: #F0A020;
	color: #fff !important;
	transform: translateY(-5px);
	box-shadow: 0 16px 32px rgba(8, 18, 32, 0.55);
}
a.nsp-card:focus {
	outline: 2px solid var(--nsp-gold);
	outline-offset: 2px;
}
@media (max-width: 640px) {
	.nsp-welcome-cards { grid-template-columns: 1fr; }
}

/* ==========================================================================
   8. Join pages: contact blocks (left blue rule)
   ========================================================================== */
.nsp-contact {
	margin: 1.2em 0;
	padding: 0.7em 0.95em;
	border-left: 3px solid var(--nsp-navy);
	background: #f4f7fa;
}
.nsp-contact p {
	margin: 0;
	line-height: 1.4;
}

/* ==========================================================================
   9. Cameras / Road: camera grid + Caltrans cards (JS injects card styles)
   ========================================================================== */
.entry-content .cam-grid {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 12px;
	margin: 0.75em 0 1em;
}
.entry-content .cam-grid figure { margin: 0; }
.entry-content .cam-grid figcaption {
	font-size: 13px;
	margin-top: 4px;
}
@media (max-width: 640px) {
	.entry-content .cam-grid { grid-template-columns: 1fr; }
}
.nsp-cam-poster,
.nsp-caltrans .nsp-cam-poster,
.nsp-caltrans .nsp-cam-video-wrap {
	aspect-ratio: 320 / 260;
}
.nsp-caltrans .nsp-cam-poster img,
.nsp-caltrans .nsp-cam-video {
	width: 100%;
	height: auto;
	aspect-ratio: 320 / 260;
	object-fit: contain;
	object-position: center;
}
.entry-content .cam-grid .nsp-cam-poster iframe,
.entry-content .nsp-cam-poster iframe {
	aspect-ratio: 320 / 260;
	height: auto;
	object-fit: contain;
}
/* GP gives <button> its own blue/padding; the Caltrans poster is a button. Keep it bare. */
.entry-content button.nsp-cam-poster,
.entry-content button.nsp-cam-poster:hover,
.entry-content button.nsp-cam-poster:focus {
	background: #111;
	padding: 0;
	border: 0;
	color: inherit;
	box-shadow: none;
	transform: none;
	line-height: normal;
	font-size: inherit;
}

/* ==========================================================================
   10. Forms and buttons (Aug 2026: navy buttons, brighter hover, gold edge)
   ========================================================================== */
.entry-content form input[type="submit"],
.entry-content form button,
#respond #submit,
.widget_search .search-submit {
	background: var(--nsp-navy);
	color: #fff;
	border: 1px solid #234a74;
	border-radius: 7px;
	padding: 8px 16px;
	margin-left: 6px;
	font-family: inherit;
	font-size: inherit;
	line-height: 1.3;
	cursor: pointer;
	transition: background 150ms ease, box-shadow 150ms ease, border-color 150ms ease, transform 150ms ease;
}
.entry-content form input[type="submit"]:hover,
.entry-content form input[type="submit"]:focus,
.entry-content form button:hover,
.entry-content form button:focus,
#respond #submit:hover,
#respond #submit:focus,
.widget_search .search-submit:hover,
.widget_search .search-submit:focus {
	background: #3a7ab8;
	border-color: #F0A020;
	color: #fff;
	box-shadow: 0 6px 14px rgba(8, 18, 32, 0.28);
	transform: translateY(-1px);
}
.entry-content form input[type="text"],
.entry-content form input[type="email"],
.entry-content form input[type="number"],
.entry-content form textarea,
.entry-content form select {
	border: 1px solid #555;
	border-radius: 7px;
	padding: 8px 10px;
	background: #fff;
	color: var(--nsp-text);
}

/* ==========================================================================
   11. Links sidebar (Frontier widget + Aug 2026 soft card)
   ========================================================================== */
.sidebar .widget,
.separate-containers .widget-area .widget {
	background-color: #fafbfc;
	border: 1px solid #e4e8ee;
	border-radius: 10px;
	box-shadow: 0 1px 3px rgba(16, 24, 40, 0.08);
	padding: 14px 16px 16px;
	margin: 0 0 10px;
	font-size: 16.5px;
	word-wrap: break-word;
}
.sidebar .widget .widget-title,
.widget-area .widget-title {
	background-color: transparent;
	color: var(--nsp-navy);
	text-shadow: none;
	margin: 0 0 10px;
	padding: 0 0 8px;
	border-bottom: 1px solid #e4e8ee;
	font-family: var(--nsp-heading-font);
	font-size: 1.05rem;
	font-weight: 400;
	line-height: 1.2;
}
.sidebar .widget-title a { color: var(--nsp-navy); }
.sidebar .widget ul {
	margin: 4px 0 8px;
	padding: 0 4px;
}
.sidebar .widget ul li {
	list-style: none;
	margin: 0;
	padding: 5px 0;
	border-bottom: 1px solid #E0E0E0;
	line-height: 1.55;
}
.sidebar .widget ul li:last-child {
	border-bottom: none;
}
.sidebar .widget a {
	color: var(--nsp-link);
	text-decoration: none;
}
.sidebar .widget a:hover,
.sidebar .widget a:focus {
	color: var(--nsp-link-hover);
}

/* ==========================================================================
   12. Bottom bar (Frontier #bottom-bar)
   ========================================================================== */
.site-footer,
.site-info {
	background-color: var(--nsp-bar);
	color: #fff;
}
.site-info {
	font-size: 14px;
	text-align: left;
	border-top: none;
}
.site-info .inside-site-info {
	padding: 0;
	min-height: 44px;
	justify-content: flex-start;
}
.site-info .copyright-bar {
	display: flex;
	width: 100%;
	flex-wrap: wrap;
	align-items: center;
	justify-content: space-between;
}
.nsp-bottom-text {
	padding: 12px 16px;
}
.nsp-theme-link {
	margin: 12px 16px 12px auto;
	font-family: var(--nsp-heading-font);
	font-size: 13px;
}
.site-info a,
.nsp-theme-link a {
	color: #CCC;
	text-decoration: none;
}
.site-info a:hover,
.nsp-theme-link a:hover {
	color: var(--nsp-gold);
}

/* Keyboard focus that matches the palette (polish). */
a:focus-visible,
button:focus-visible {
	outline: 2px solid var(--nsp-gold);
	outline-offset: 2px;
}