/*
Theme Name: IT Spektrum
Description: Et terminalinspireret portfolio-tema til web, serverdrift, datacenter og AI med kvadratisk forsidegrid, store coverbilleder og lys/mørk tilstand.
Version: 1.0.5
Requires at least: 6.4
Requires PHP: 7.4
Author: WLE, OpenAI
License: GNU General Public License v2 or later
License URI: https://www.gnu.org/licenses/gpl-2.0.html
Text Domain: it-spektrum
Tags: portfolio, blog, grid-layout, wide-blocks, custom-logo, custom-colors, featured-images, threaded-comments, translation-ready
*/

/* --------------------------------------------------------------------------
   Design tokens
   -------------------------------------------------------------------------- */

:root {
	--theme-primary: #08783d;
	--theme-secondary: #006b35;
	--theme-highlight: #18a558;
	--color-primary: var(--theme-primary);
	--color-secondary: var(--theme-secondary);
	--color-highlight: var(--theme-highlight);
	--color-violet: #315f42;
	--color-sky: #1b8e4d;
	--color-bg: #f6f9f7;
	--color-bg-alt: #e9f2ec;
	--color-surface: #ffffff;
	--color-surface-soft: rgba(255, 255, 255, 0.88);
	--color-text: #101a13;
	--color-text-soft: #4a6251;
	--color-border: rgba(6, 70, 35, 0.18);
	--color-header: rgba(250, 252, 250, 0.94);
	--color-on-accent: #ffffff;
	--color-terminal: #030705;
	--color-terminal-text: #eaffef;
	--color-terminal-soft: #a8c8b1;
	--shadow-soft: 0 18px 60px rgba(3, 39, 20, 0.11);
	--shadow-card: 0 20px 70px rgba(1, 27, 13, 0.2);
	--font-terminal: "JetBrains Mono", "Fira Code", "Cascadia Code", "Ubuntu Mono", "Liberation Mono", "DejaVu Sans Mono", Menlo, Consolas, monospace;
	--radius-small: 0;
	--radius-medium: 0;
	--radius-large: 0;
	--layout-wide: 1720px;
	--layout-content: 1380px;
	--header-height: 84px;
	--transition: 180ms ease;
	color-scheme: light;
}

html[data-theme="dark"] {
	--color-primary: color-mix(in srgb, var(--theme-primary) 24%, #72ff9a);
	--color-secondary: color-mix(in srgb, var(--theme-secondary) 25%, #3ee880);
	--color-highlight: color-mix(in srgb, var(--theme-highlight) 20%, #a3ffbd);
	--color-violet: #8ce8a8;
	--color-sky: #54e388;
	--color-bg: #030504;
	--color-bg-alt: #07100a;
	--color-surface: #090e0b;
	--color-surface-soft: rgba(8, 13, 9, 0.88);
	--color-text: #f2fff5;
	--color-text-soft: #a5c8ae;
	--color-border: rgba(85, 255, 142, 0.2);
	--color-header: rgba(3, 5, 4, 0.94);
	--color-on-accent: #021007;
	--color-terminal: #010302;
	--color-terminal-text: #f2fff5;
	--color-terminal-soft: #9dc5a8;
	--shadow-soft: 0 18px 60px rgba(0, 0, 0, 0.5);
	--shadow-card: 0 24px 80px rgba(0, 0, 0, 0.58);
	color-scheme: dark;
}

@media (prefers-color-scheme: dark) {
	html:not([data-theme]) {
		--color-primary: color-mix(in srgb, var(--theme-primary) 24%, #72ff9a);
		--color-secondary: color-mix(in srgb, var(--theme-secondary) 25%, #3ee880);
		--color-highlight: color-mix(in srgb, var(--theme-highlight) 20%, #a3ffbd);
		--color-violet: #8ce8a8;
		--color-sky: #54e388;
		--color-bg: #030504;
		--color-bg-alt: #07100a;
		--color-surface: #090e0b;
		--color-surface-soft: rgba(8, 13, 9, 0.88);
		--color-text: #f2fff5;
		--color-text-soft: #a5c8ae;
		--color-border: rgba(85, 255, 142, 0.2);
		--color-header: rgba(3, 5, 4, 0.94);
		--color-on-accent: #021007;
		--color-terminal: #010302;
		--color-terminal-text: #f2fff5;
		--color-terminal-soft: #9dc5a8;
		--shadow-soft: 0 18px 60px rgba(0, 0, 0, 0.5);
		--shadow-card: 0 24px 80px rgba(0, 0, 0, 0.58);
		color-scheme: dark;
	}
}

/* --------------------------------------------------------------------------
   Base and accessibility
   -------------------------------------------------------------------------- */

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

html {
	scroll-behavior: smooth;
	overflow-x: hidden;
}

body {
	margin: 0;
	background:
		radial-gradient(circle at 4% 7%, color-mix(in srgb, var(--color-primary) 7%, transparent), transparent 26rem),
		repeating-linear-gradient(0deg, transparent 0, transparent 31px, color-mix(in srgb, var(--color-primary) 2.5%, transparent) 32px),
		var(--color-bg);
	color: var(--color-text);
	font-family: var(--font-terminal);
	font-feature-settings: "liga" 0, "calt" 0;
	font-variant-ligatures: none;
	font-size: 17px;
	line-height: 1.65;
	transition: background-color var(--transition), color var(--transition);
}

body.menu-open {
	overflow: hidden;
}

::selection {
	background: var(--color-primary);
	color: var(--color-on-accent);
}

a {
	color: var(--color-primary);
	text-decoration-thickness: 0.09em;
	text-underline-offset: 0.18em;
}

a:hover {
	color: var(--color-secondary);
}

button,
input,
textarea,
select {
	font: inherit;
}

button,
a {
	-webkit-tap-highlight-color: transparent;
}

img {
	display: block;
	height: auto;
	max-width: 100%;
}

svg {
	display: block;
}

hr {
	border: 0;
	border-top: 1px solid var(--color-border);
	margin: 3rem auto;
}

:focus-visible {
	outline: 3px solid var(--color-highlight);
	outline-offset: 4px;
}

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

.screen-reader-text:focus,
.skip-link:focus {
	clip: auto !important;
	clip-path: none;
	height: auto;
	left: 1rem;
	padding: 0.8rem 1rem;
	top: 1rem;
	width: auto;
	z-index: 100000;
	background: var(--color-surface);
	border-radius: var(--radius-small);
	color: var(--color-text);
}

.layout-wide {
	margin-inline: auto;
	width: min(calc(100% - 56px), var(--layout-wide));
}

.layout-content {
	margin-inline: auto;
	width: min(calc(100% - 40px), var(--layout-content));
}

.site-main {
	min-height: 60vh;
}

.eyebrow {
	align-items: center;
	color: var(--color-secondary);
	display: flex;
	font-size: 0.75rem;
	font-weight: 800;
	gap: 0.65rem;
	letter-spacing: 0.15em;
	line-height: 1.3;
	margin: 0 0 1rem;
	text-transform: uppercase;
}

.eyebrow::before {
	background: none;
	content: "$";
	font-size: 1em;
	font-weight: 900;
	height: auto;
	width: auto;
}

.button,
.wp-block-button__link,
button[type="submit"],
input[type="submit"] {
	align-items: center;
	background: var(--color-surface);
	border: 1px solid var(--color-border);
	border-radius: 999px;
	color: var(--color-text);
	cursor: pointer;
	display: inline-flex;
	font-weight: 750;
	gap: 0.75rem;
	justify-content: center;
	line-height: 1;
	padding: 1rem 1.3rem;
	text-decoration: none;
	transition: transform var(--transition), box-shadow var(--transition), background var(--transition);
}

.button:hover,
.wp-block-button__link:hover,
button[type="submit"]:hover,
input[type="submit"]:hover {
	box-shadow: 0 12px 30px rgba(3, 90, 43, 0.24);
	color: var(--color-text);
	transform: translateY(-2px);
}

.button--primary,
.is-style-fill > .wp-block-button__link {
	background: linear-gradient(120deg, var(--color-primary), color-mix(in srgb, var(--color-secondary) 86%, var(--color-highlight)));
	border-color: transparent;
	box-shadow: 0 16px 40px color-mix(in srgb, var(--color-primary) 28%, transparent);
	color: var(--color-on-accent);
}

.button--primary:hover,
.is-style-fill > .wp-block-button__link:hover {
	box-shadow: 0 20px 50px color-mix(in srgb, var(--color-primary) 38%, transparent);
	color: var(--color-on-accent);
}

/* --------------------------------------------------------------------------
   Header, menus and search
   -------------------------------------------------------------------------- */

.site-header {
	backdrop-filter: blur(18px) saturate(140%);
	background: var(--color-header);
	border-bottom: 1px solid var(--color-border);
	position: sticky;
	top: 0;
	z-index: 1000;
}

.admin-bar .site-header {
	top: 32px;
}

.site-header__inner {
	align-items: center;
	display: grid;
	gap: clamp(1rem, 2.2vw, 2.6rem);
	grid-template-columns: auto minmax(0, 1fr) auto;
	min-height: var(--header-height);
}

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

.site-branding__logo {
	flex: 0 0 auto;
}

.custom-logo-link {
	display: block;
}

.custom-logo {
	max-height: 48px;
	max-width: 150px;
	object-fit: contain;
	width: auto;
}

.site-title {
	font-size: clamp(1rem, 1.45vw, 1.32rem);
	font-weight: 850;
	letter-spacing: -0.04em;
	line-height: 1.05;
	margin: 0;
	white-space: nowrap;
}

.site-title a {
	color: var(--color-text);
	text-decoration: none;
}

.main-navigation {
	justify-self: center;
}

.mobile-menu-search {
	display: none;
}

.menu,
.footer-menu {
	list-style: none;
	margin: 0;
	padding: 0;
}

.primary-menu {
	align-items: center;
	display: flex;
	gap: 0.2rem;
}

.primary-menu li {
	position: relative;
}

.primary-menu > li > a {
	border-radius: 999px;
	color: var(--color-text);
	display: block;
	font-size: 0.91rem;
	font-weight: 690;
	padding: 0.64rem 0.82rem;
	text-decoration: none;
	transition: background var(--transition), color var(--transition);
}

.primary-menu > li > a:hover,
.primary-menu > .current-menu-item > a,
.primary-menu > .current-menu-ancestor > a {
	background: color-mix(in srgb, var(--color-primary) 12%, transparent);
	color: var(--color-primary);
}

.primary-menu .sub-menu {
	background: var(--color-surface);
	border: 1px solid var(--color-border);
	border-radius: var(--radius-medium);
	box-shadow: var(--shadow-soft);
	left: 0;
	list-style: none;
	margin: 0;
	min-width: 220px;
	opacity: 0;
	padding: 0.55rem;
	pointer-events: none;
	position: absolute;
	top: calc(100% + 0.7rem);
	transform: translateY(-8px);
	transition: opacity var(--transition), transform var(--transition);
	z-index: 10;
}

.primary-menu .sub-menu::before {
	content: "";
	height: 0.8rem;
	left: 0;
	position: absolute;
	top: -0.8rem;
	width: 100%;
}

.primary-menu .sub-menu .sub-menu {
	left: calc(100% + 0.55rem);
	top: -0.55rem;
}

.primary-menu li:hover > .sub-menu,
.primary-menu li:focus-within > .sub-menu {
	opacity: 1;
	pointer-events: auto;
	transform: translateY(0);
}

.primary-menu .sub-menu a {
	border-radius: 12px;
	color: var(--color-text);
	display: block;
	font-size: 0.9rem;
	font-weight: 650;
	padding: 0.72rem 0.8rem;
	text-decoration: none;
}

.primary-menu .sub-menu a:hover {
	background: var(--color-bg-alt);
	color: var(--color-secondary);
}

.header-tools {
	align-items: center;
	display: flex;
	gap: 0.55rem;
	justify-self: end;
}

.search-form {
	align-items: center;
	background: var(--color-surface-soft);
	border: 1px solid var(--color-border);
	border-radius: 999px;
	display: flex;
	min-height: 44px;
	overflow: hidden;
	transition: border-color var(--transition), box-shadow var(--transition), background var(--transition);
}

.search-form:focus-within {
	background: var(--color-surface);
	border-color: color-mix(in srgb, var(--color-primary) 60%, transparent);
	box-shadow: 0 0 0 4px color-mix(in srgb, var(--color-primary) 11%, transparent);
}

.search-field {
	background: transparent;
	border: 0;
	color: var(--color-text);
	font-size: 0.88rem;
	min-width: 0;
	outline: 0;
	padding: 0.62rem 0 0.62rem 1rem;
	width: clamp(96px, 9vw, 158px);
}

.search-field::placeholder {
	color: var(--color-text-soft);
	opacity: 0.8;
}

.search-submit,
.theme-toggle,
.menu-toggle {
	align-items: center;
	background: transparent;
	border: 0;
	color: var(--color-text);
	cursor: pointer;
	display: inline-flex;
	justify-content: center;
}

.search-submit {
	border-radius: 50%;
	flex: 0 0 42px;
	height: 42px;
	padding: 0;
}

.search-submit:hover {
	background: color-mix(in srgb, var(--color-primary) 12%, transparent);
	box-shadow: none;
	color: var(--color-primary);
	transform: none;
}

.search-submit svg,
.theme-toggle svg {
	fill: none;
	height: 20px;
	stroke: currentColor;
	stroke-linecap: round;
	stroke-linejoin: round;
	stroke-width: 1.8;
	width: 20px;
}

.theme-toggle {
	background: linear-gradient(135deg, color-mix(in srgb, var(--color-primary) 14%, var(--color-surface)), color-mix(in srgb, var(--color-secondary) 14%, var(--color-surface)));
	border: 1px solid var(--color-border);
	border-radius: 50%;
	flex: 0 0 44px;
	height: 44px;
	padding: 0;
	transition: transform var(--transition), background var(--transition);
}

.theme-toggle:hover {
	box-shadow: none;
	transform: rotate(9deg);
}

.theme-toggle__moon,
html[data-theme="dark"] .theme-toggle__sun {
	display: none;
}

html[data-theme="dark"] .theme-toggle__moon {
	display: block;
}

.menu-toggle {
	display: none;
	height: 44px;
	padding: 0;
	width: 44px;
}

.menu-toggle__bars {
	display: grid;
	gap: 5px;
	width: 22px;
}

.menu-toggle__bars span {
	background: currentColor;
	border-radius: 2px;
	display: block;
	height: 2px;
	transition: transform var(--transition), opacity var(--transition);
}

/* --------------------------------------------------------------------------
   Portfolio hero
   -------------------------------------------------------------------------- */

.portfolio-hero {
	background:
		linear-gradient(125deg, color-mix(in srgb, var(--color-primary) 11%, var(--color-bg)) 0%, var(--color-bg) 45%, color-mix(in srgb, var(--color-highlight) 20%, var(--color-bg)) 100%);
	border-bottom: 1px solid var(--color-border);
	isolation: isolate;
	min-height: min(790px, calc(100vh - var(--header-height)));
	overflow: hidden;
	position: relative;
}

.portfolio-hero::before {
	background: linear-gradient(90deg, var(--color-primary), var(--color-highlight), var(--color-secondary));
	content: "";
	height: 5px;
	left: 0;
	position: absolute;
	top: 0;
	width: 100%;
}

.portfolio-hero__mesh,
.mesh-grid,
.mesh-orb {
	inset: 0;
	pointer-events: none;
	position: absolute;
}

.mesh-grid {
	background-image:
		linear-gradient(color-mix(in srgb, var(--color-primary) 9%, transparent) 1px, transparent 1px),
		linear-gradient(90deg, color-mix(in srgb, var(--color-primary) 9%, transparent) 1px, transparent 1px);
	background-size: 58px 58px;
	mask-image: linear-gradient(to right, transparent 10%, #000 55%, #000 100%);
	opacity: 0.7;
}

.mesh-orb {
	border-radius: 50%;
	filter: blur(2px);
	height: 430px;
	width: 430px;
}

.mesh-orb--one {
	background: color-mix(in srgb, var(--color-sky) 26%, transparent);
	left: auto;
	right: -90px;
	top: -130px;
}

.mesh-orb--two {
	background: color-mix(in srgb, var(--color-highlight) 25%, transparent);
	bottom: -180px;
	left: 36%;
	top: auto;
}

.portfolio-hero__inner {
	align-items: center;
	display: grid;
	gap: clamp(3rem, 6vw, 8rem);
	grid-template-columns: minmax(0, 1.08fr) minmax(460px, 0.92fr);
	min-height: inherit;
	padding-block: clamp(5rem, 9vw, 9rem);
	position: relative;
	z-index: 1;
}

.portfolio-hero__copy {
	max-width: 960px;
}

.portfolio-hero h1 {
	font-size: clamp(3.2rem, 6.25vw, 7.6rem);
	font-weight: 880;
	letter-spacing: -0.075em;
	line-height: 0.94;
	margin: 0;
	max-width: 12ch;
}

.portfolio-hero h1::first-line {
	color: var(--color-primary);
}

.portfolio-hero__lead {
	color: var(--color-text-soft);
	font-size: clamp(1.08rem, 1.45vw, 1.4rem);
	line-height: 1.55;
	margin: 2rem 0 2.25rem;
	max-width: 680px;
}

.expertise-map {
	display: grid;
	gap: 1rem;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	transform: rotate(1.2deg);
}

.expertise-card {
	backdrop-filter: blur(16px);
	background: color-mix(in srgb, var(--color-surface) 86%, transparent);
	border: 1px solid color-mix(in srgb, var(--color-primary) 16%, var(--color-border));
	border-radius: var(--radius-large);
	box-shadow: var(--shadow-soft);
	display: flex;
	flex-direction: column;
	min-height: 220px;
	overflow: hidden;
	padding: 1.5rem;
	position: relative;
	transition: transform 260ms ease, border-color 260ms ease;
}

.expertise-card:nth-child(2),
.expertise-card:nth-child(3) {
	transform: translateY(1.5rem);
}

.expertise-card:hover {
	border-color: color-mix(in srgb, var(--color-highlight) 60%, transparent);
	transform: translateY(-5px) rotate(-1deg);
}

.expertise-card:nth-child(2):hover,
.expertise-card:nth-child(3):hover {
	transform: translateY(calc(1.5rem - 5px)) rotate(-1deg);
}

.expertise-card::after {
	background: var(--card-glow, var(--color-primary));
	border-radius: 50%;
	content: "";
	filter: blur(28px);
	height: 95px;
	bottom: -48px;
	position: absolute;
	right: -30px;
	width: 95px;
}

.expertise-card--server { --card-glow: var(--color-secondary); }
.expertise-card--data { --card-glow: var(--color-violet); }
.expertise-card--ai { --card-glow: var(--color-highlight); }

.expertise-card__number {
	color: var(--color-text-soft);
	font-size: 0.7rem;
	font-weight: 800;
	letter-spacing: 0.12em;
	position: absolute;
	right: 1.35rem;
	top: 1.15rem;
}

.expertise-card svg {
	fill: none;
	height: 56px;
	margin: 0 0 auto;
	stroke: var(--card-glow, var(--color-primary));
	stroke-linecap: round;
	stroke-linejoin: round;
	stroke-width: 1.8;
	width: 56px;
}

.expertise-card strong {
	font-size: 1.2rem;
	letter-spacing: -0.03em;
	line-height: 1.2;
	margin-top: 1.1rem;
}

.expertise-card > span:last-child {
	color: var(--color-text-soft);
	font-size: 0.82rem;
	margin-top: 0.25rem;
}

.front-page-content {
	background: var(--color-surface);
	border-bottom: 1px solid var(--color-border);
	padding-block: clamp(4rem, 8vw, 8rem);
}

/* --------------------------------------------------------------------------
   Portfolio mosaic and archive
   -------------------------------------------------------------------------- */

.latest-work {
	padding-block: clamp(4.5rem, 8vw, 9rem);
}

.section-heading {
	align-items: end;
	display: flex;
	gap: 3rem;
	justify-content: space-between;
	margin-bottom: clamp(2rem, 4vw, 3.5rem);
}

.section-heading h2,
.page-context h1,
.archive-hero h1 {
	font-size: clamp(2.5rem, 5vw, 5.4rem);
	font-weight: 850;
	letter-spacing: -0.065em;
	line-height: 0.98;
	margin: 0;
}

.section-heading > p {
	color: var(--color-text-soft);
	margin: 0;
	max-width: 420px;
}

.portfolio-grid {
	display: grid;
	gap: clamp(0.9rem, 1.4vw, 1.45rem);
	grid-template-columns: repeat(4, minmax(0, 1fr));
}

.portfolio-card {
	aspect-ratio: 1 / 1;
	border: 1px solid rgba(255, 255, 255, 0.16);
	border-radius: var(--radius-large);
	box-shadow: var(--shadow-card);
	min-height: 0;
	overflow: hidden;
	position: relative;
	transform: translateZ(0);
}

.portfolio-card__link {
	color: #fff;
	display: block;
	height: 100%;
	text-decoration: none;
}

.portfolio-card__link:hover {
	color: #fff;
}

.portfolio-card__media,
.portfolio-card__media img,
.portfolio-card__fallback,
.portfolio-card__overlay {
	height: 100%;
	inset: 0;
	position: absolute;
	width: 100%;
}

.portfolio-card__media img {
	object-fit: cover;
	transition: transform 600ms cubic-bezier(0.2, 0.75, 0.2, 1), filter 300ms ease;
}

.portfolio-card:hover .portfolio-card__media img {
	filter: saturate(1.14) contrast(1.03);
	transform: scale(1.055);
}

.portfolio-card__fallback {
	background:
		radial-gradient(circle at 78% 24%, rgba(255, 255, 255, 0.35), transparent 25%),
		linear-gradient(135deg, var(--tone-a), var(--tone-b));
	overflow: hidden;
}

.portfolio-card--tone-1 { --tone-a: #052f1b; --tone-b: #16a85c; }
.portfolio-card--tone-2 { --tone-a: #08130c; --tone-b: #08783d; }
.portfolio-card--tone-3 { --tone-a: #0c4f2e; --tone-b: #243a2b; }
.portfolio-card--tone-4 { --tone-a: #07120b; --tone-b: #20b766; }
.portfolio-card--tone-5 { --tone-a: #0b3922; --tone-b: #57d887; }

.fallback-ring {
	border: clamp(24px, 4vw, 70px) solid rgba(255, 255, 255, 0.13);
	border-radius: 50%;
	height: min(38vw, 520px);
	position: absolute;
	right: -9%;
	top: -18%;
	transform: rotate(-18deg);
	width: min(38vw, 520px);
}

.fallback-code {
	color: rgba(255, 255, 255, 0.22);
	font-family: var(--font-terminal);
	font-size: clamp(5rem, 12vw, 13rem);
	font-weight: 900;
	letter-spacing: -0.15em;
	position: absolute;
	right: 9%;
	top: 50%;
	transform: translateY(-50%);
}

.portfolio-card__overlay {
	background: linear-gradient(to top, rgba(1, 9, 5, 0.92) 0%, rgba(2, 15, 8, 0.34) 58%, rgba(2, 15, 8, 0.08) 100%);
	transition: background var(--transition);
}

.portfolio-card:hover .portfolio-card__overlay {
	background: linear-gradient(to top, rgba(1, 9, 5, 0.96) 0%, rgba(2, 15, 8, 0.27) 68%, rgba(2, 15, 8, 0.04) 100%);
}

.portfolio-card__content {
	bottom: 0;
	display: flex;
	flex-direction: column;
	left: 0;
	padding: clamp(1.25rem, 2.4vw, 2.35rem);
	position: absolute;
	right: 0;
	z-index: 2;
}

.portfolio-card__topline {
	align-items: center;
	display: flex;
	font-size: 0.71rem;
	font-weight: 750;
	gap: 0.8rem;
	justify-content: space-between;
	letter-spacing: 0.05em;
	margin-bottom: 0.75rem;
	text-transform: uppercase;
}

.category-chip {
	backdrop-filter: blur(10px);
	background: rgba(255, 255, 255, 0.18);
	border: 1px solid rgba(255, 255, 255, 0.22);
	border-radius: 999px;
	padding: 0.34rem 0.64rem;
}

.portfolio-card__date {
	color: rgba(255, 255, 255, 0.72);
}

.portfolio-card__title {
	display: -webkit-box;
	font-size: clamp(1.35rem, 2.2vw, 2.35rem);
	font-weight: 820;
	-webkit-box-orient: vertical;
	-webkit-line-clamp: 3;
	letter-spacing: -0.045em;
	line-height: 1.04;
	margin: 0;
	max-width: 20ch;
	overflow: hidden;
}


.portfolio-card__arrow {
	align-items: center;
	background: rgba(255, 255, 255, 0.15);
	border: 1px solid rgba(255, 255, 255, 0.26);
	border-radius: 50%;
	display: flex;
	font-size: 1rem;
	height: 42px;
	justify-content: center;
	position: absolute;
	right: clamp(1.1rem, 2vw, 2rem);
	top: 50%;
	transform: translateY(-5%);
	transition: background var(--transition), transform var(--transition);
	width: 42px;
}

.portfolio-card:hover .portfolio-card__arrow {
	background: var(--color-highlight);
	color: var(--color-on-accent);
	transform: translate(4px, -9%);
}

.page-context,
.archive-hero {
	padding-block: clamp(5rem, 9vw, 9rem) clamp(2.5rem, 5vw, 5rem);
}

.page-context + .latest-work {
	padding-top: 1rem;
}

.archive-hero {
	background: linear-gradient(120deg, color-mix(in srgb, var(--color-primary) 13%, var(--color-bg)), color-mix(in srgb, var(--color-secondary) 12%, var(--color-bg)));
	border-bottom: 1px solid var(--color-border);
}

.archive-description {
	color: var(--color-text-soft);
	font-size: 1.08rem;
	margin-top: 1.4rem;
	max-width: 720px;
}

.pagination {
	margin-top: clamp(2.5rem, 5vw, 5rem);
}

.pagination ul,
.page-numbers {
	align-items: center;
	display: flex;
	flex-wrap: wrap;
	gap: 0.55rem;
	justify-content: center;
	list-style: none;
	margin: 0;
	padding: 0;
}

.pagination .page-numbers a,
.pagination .page-numbers span {
	align-items: center;
	background: var(--color-surface);
	border: 1px solid var(--color-border);
	border-radius: 0;
	color: var(--color-text);
	display: inline-flex;
	font-size: 0.88rem;
	font-weight: 750;
	justify-content: center;
	min-height: 44px;
	min-width: 44px;
	padding: 0.6rem 0.9rem;
	text-decoration: none;
}

.pagination .page-numbers a:hover,
.pagination .page-numbers .current {
	background: var(--color-primary);
	border-color: var(--color-primary);
	color: var(--color-on-accent);
}

.no-results {
	background: var(--color-surface);
	border: 1px solid var(--color-border);
	border-radius: var(--radius-large);
	box-shadow: var(--shadow-soft);
	margin-inline: auto;
	max-width: 760px;
	padding: clamp(2rem, 5vw, 4.5rem);
	text-align: center;
}

.no-results__icon {
	color: var(--color-primary);
	font-size: 5rem;
	font-weight: 200;
	line-height: 1;
}

.no-results h2 {
	font-size: clamp(2rem, 4vw, 3.5rem);
	letter-spacing: -0.05em;
	margin: 0.4rem 0;
}

.no-results p {
	color: var(--color-text-soft);
}

.no-results .search-form {
	margin: 1.5rem auto 0;
	max-width: 440px;
}

.no-results .search-field {
	width: 100%;
}

/* --------------------------------------------------------------------------
   Singular content and full-width blocks
   -------------------------------------------------------------------------- */

.article-hero {
	align-items: end;
	background: linear-gradient(135deg, #030705, #08783d 72%, #18a558);
	color: #fff;
	display: flex;
	isolation: isolate;
	min-height: clamp(520px, 72vh, 820px);
	overflow: hidden;
	position: relative;
}

.article-hero__media,
.article-hero__media img,
.article-hero__shade,
.article-hero__pattern {
	height: 100%;
	inset: 0;
	position: absolute;
	width: 100%;
}

.article-hero__media img {
	object-fit: cover;
}

.article-hero__shade {
	background: linear-gradient(to top, rgba(1, 8, 4, 0.94) 0%, rgba(1, 12, 6, 0.5) 55%, rgba(1, 12, 6, 0.1) 100%);
	z-index: -1;
}

.article-hero__media {
	z-index: -2;
}

.article-hero__pattern {
	background-image:
		linear-gradient(rgba(255, 255, 255, 0.12) 1px, transparent 1px),
		linear-gradient(90deg, rgba(255, 255, 255, 0.12) 1px, transparent 1px);
	background-size: 70px 70px;
	z-index: -2;
}

.article-hero__pattern span {
	background: rgba(255, 255, 255, 0.15);
	border-radius: 50%;
	filter: blur(2px);
	height: 440px;
	position: absolute;
	right: -80px;
	top: -80px;
	width: 440px;
}

.article-hero__inner {
	padding-block: clamp(4rem, 9vw, 8rem);
}

.entry-categories {
	display: flex;
	flex-wrap: wrap;
	gap: 0.5rem;
	margin-bottom: 1.4rem;
}

.entry-categories a {
	background: rgba(255, 255, 255, 0.16);
	border: 1px solid rgba(255, 255, 255, 0.25);
	border-radius: 999px;
	color: #fff;
	font-size: 0.75rem;
	font-weight: 750;
	padding: 0.4rem 0.75rem;
	text-decoration: none;
	text-transform: uppercase;
}

.entry-title {
	font-size: clamp(3rem, 7vw, 8rem);
	font-weight: 880;
	letter-spacing: -0.07em;
	line-height: 0.94;
	margin: 0;
	max-width: 15ch;
}

.entry-meta {
	align-items: center;
	color: rgba(255, 255, 255, 0.72);
	display: flex;
	flex-wrap: wrap;
	font-size: 0.88rem;
	gap: 0.7rem;
	margin-top: 1.8rem;
}

.entry-content {
	font-size: clamp(1.03rem, 1.25vw, 1.17rem);
	padding-block: clamp(4rem, 8vw, 8rem);
}

.entry-content::after {
	clear: both;
	content: "";
	display: table;
}

.entry-content > * {
	margin-left: auto;
	margin-right: auto;
	max-width: min(calc(100% - 40px), var(--layout-content));
}

.entry-content > .alignwide {
	max-width: min(calc(100% - 56px), 1380px);
	width: 100%;
}

.entry-content > .alignfull {
	margin-left: calc(50% - 50vw);
	margin-right: calc(50% - 50vw);
	max-width: none;
	width: 100vw;
}

.entry-content > .wp-block-group.alignfull,
.entry-content > .wp-block-cover.alignfull {
	padding-left: max(28px, calc((100vw - var(--layout-wide)) / 2));
	padding-right: max(28px, calc((100vw - var(--layout-wide)) / 2));
}

.entry-content h2,
.entry-content h3,
.entry-content h4 {
	font-weight: 820;
	letter-spacing: -0.045em;
	line-height: 1.1;
}

.entry-content h2 {
	font-size: clamp(2rem, 4vw, 3.7rem);
	margin-bottom: 1.1rem;
	margin-top: 2.8rem;
}

.entry-content h3 {
	font-size: clamp(1.5rem, 2.6vw, 2.4rem);
	margin-bottom: 0.8rem;
	margin-top: 2.2rem;
}

.entry-content p,
.entry-content ul,
.entry-content ol {
	margin-bottom: 1.45em;
	margin-top: 0;
}

.entry-content a:not(.wp-block-button__link) {
	font-weight: 650;
}

.entry-content blockquote,
.wp-block-quote {
	background: linear-gradient(120deg, color-mix(in srgb, var(--color-primary) 10%, var(--color-surface)), color-mix(in srgb, var(--color-secondary) 10%, var(--color-surface)));
	border: 0;
	border-left: 5px solid var(--color-highlight);
	border-radius: 0 var(--radius-medium) var(--radius-medium) 0;
	font-size: clamp(1.25rem, 2vw, 1.7rem);
	font-weight: 620;
	margin-bottom: 2.5rem;
	margin-top: 2.5rem;
	padding: 1.7rem 2rem;
}

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

.entry-content pre,
.entry-content .wp-block-code {
	background: var(--color-terminal);
	border: 1px solid color-mix(in srgb, var(--color-primary) 34%, transparent);
	border-radius: var(--radius-medium);
	color: var(--color-terminal-text);
	overflow-x: auto;
	padding: 1.35rem;
}

.entry-content code {
	background: color-mix(in srgb, var(--color-primary) 10%, var(--color-surface));
	border-radius: 5px;
	font-family: var(--font-terminal);
	font-size: 0.9em;
	padding: 0.12em 0.3em;
}

.entry-content pre code {
	background: transparent;
	padding: 0;
}

.entry-content figure,
.wp-block-image {
	margin-bottom: 2.5rem;
	margin-top: 2.5rem;
}

.entry-content figure img,
.wp-block-image img,
.wp-block-media-text,
.wp-block-cover:not(.alignfull) {
	border-radius: var(--radius-medium);
}

.entry-content figcaption {
	color: var(--color-text-soft);
	font-size: 0.78rem;
	margin-top: 0.7rem;
	text-align: center;
}

.entry-content table,
.wp-block-table table {
	border-collapse: collapse;
	font-size: 0.94rem;
	width: 100%;
}

.entry-content th,
.entry-content td {
	border-bottom: 1px solid var(--color-border);
	padding: 0.8rem;
	text-align: left;
}

.entry-content th {
	background: color-mix(in srgb, var(--color-primary) 8%, var(--color-surface));
}

.wp-block-separator.is-style-wide {
	max-width: min(calc(100% - 56px), 1380px);
}

.wp-block-columns {
	gap: clamp(1rem, 3vw, 2.5rem);
}

.wp-block-group.has-background,
.wp-block-column.has-background {
	border-radius: var(--radius-medium);
	padding: clamp(1.5rem, 3vw, 3rem);
}

.entry-footer {
	padding-bottom: clamp(4rem, 8vw, 8rem);
}

.tag-list {
	display: flex;
	flex-wrap: wrap;
	gap: 0.5rem;
	margin-bottom: 3rem;
}

.tag-list a {
	background: var(--color-surface);
	border: 1px solid var(--color-border);
	border-radius: 999px;
	color: var(--color-text-soft);
	font-size: 0.78rem;
	font-weight: 700;
	padding: 0.42rem 0.7rem;
	text-decoration: none;
}

.tag-list a:hover {
	border-color: var(--color-secondary);
	color: var(--color-secondary);
}

.author-box {
	align-items: center;
	background: linear-gradient(125deg, color-mix(in srgb, var(--color-primary) 10%, var(--color-surface)), color-mix(in srgb, var(--color-highlight) 9%, var(--color-surface)));
	border: 1px solid var(--color-border);
	border-radius: var(--radius-large);
	display: flex;
	gap: 1.5rem;
	padding: clamp(1.4rem, 3vw, 2.5rem);
}

.author-box__avatar {
	border: 4px solid var(--color-surface);
	border-radius: 50%;
	box-shadow: var(--shadow-soft);
	height: 92px;
	width: 92px;
}

.author-box .eyebrow {
	margin-bottom: 0.3rem;
}

.author-box h2 {
	font-size: 1.55rem;
	letter-spacing: -0.04em;
	margin: 0;
}

.author-box p:last-child {
	color: var(--color-text-soft);
	margin: 0.5rem 0 0;
}

.post-navigation {
	border-bottom: 1px solid var(--color-border);
	border-top: 1px solid var(--color-border);
	display: grid;
	gap: 2rem;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	padding-block: 3rem;
}

.post-navigation > div:last-child {
	text-align: right;
}

.post-navigation > div:last-child .eyebrow {
	justify-content: flex-end;
}

.post-navigation a {
	color: var(--color-text);
	font-size: clamp(1rem, 1.6vw, 1.3rem);
	font-weight: 760;
	text-decoration: none;
}

.post-navigation a:hover {
	color: var(--color-primary);
}

.page-hero {
	background: linear-gradient(120deg, color-mix(in srgb, var(--color-primary) 16%, var(--color-bg)), color-mix(in srgb, var(--color-secondary) 13%, var(--color-bg)));
	border-bottom: 1px solid var(--color-border);
	isolation: isolate;
	min-height: 430px;
	position: relative;
}

.page-hero--image {
	align-items: end;
	color: #fff;
	display: flex;
	min-height: clamp(500px, 65vh, 760px);
	overflow: hidden;
}

.page-hero__media,
.page-hero__media img,
.page-hero__shade {
	height: 100%;
	inset: 0;
	position: absolute;
	width: 100%;
}

.page-hero__media {
	z-index: -2;
}

.page-hero__media img {
	object-fit: cover;
}

.page-hero__shade {
	background: linear-gradient(to top, rgba(2, 10, 5, 0.9), rgba(2, 10, 5, 0.12));
	z-index: -1;
}

.page-hero__inner {
	padding-block: clamp(5rem, 9vw, 8rem);
}

.page-hero:not(.page-hero--image) .page-hero__inner {
	padding-top: clamp(7rem, 12vw, 11rem);
}

.page-hero--image .eyebrow {
	color: var(--color-highlight);
}

.error-page {
	align-items: center;
	display: flex;
	min-height: calc(100vh - var(--header-height));
	overflow: hidden;
}

.error-hero {
	align-items: center;
	display: grid;
	gap: clamp(2rem, 7vw, 7rem);
	grid-template-columns: minmax(300px, 0.8fr) minmax(0, 1fr);
	padding-block: 5rem;
}

.error-hero__code {
	background: linear-gradient(135deg, var(--color-primary), var(--color-highlight));
	-webkit-background-clip: text;
	background-clip: text;
	color: transparent;
	font-size: clamp(9rem, 25vw, 25rem);
	font-weight: 950;
	letter-spacing: -0.14em;
	line-height: 0.72;
}

.error-hero h1 {
	font-size: clamp(3rem, 6vw, 6.5rem);
	letter-spacing: -0.07em;
	line-height: 0.95;
	margin: 0;
}

.error-hero__copy > p:not(.eyebrow) {
	color: var(--color-text-soft);
	max-width: 620px;
}

.error-hero .search-form {
	margin: 1.5rem 0;
	max-width: 480px;
}

.error-hero .search-field {
	width: 100%;
}

/* --------------------------------------------------------------------------
   Comments and forms
   -------------------------------------------------------------------------- */

.comments-wrap {
	padding-block: clamp(4rem, 8vw, 7rem);
}

.comments-title,
.comment-reply-title {
	font-size: clamp(1.8rem, 3vw, 2.8rem);
	letter-spacing: -0.045em;
}

.comment-list,
.comment-list .children {
	list-style: none;
	padding: 0;
}

.comment-list .children {
	margin-left: 2rem;
}

.comment-body {
	background: var(--color-surface);
	border: 1px solid var(--color-border);
	border-radius: var(--radius-medium);
	margin-bottom: 1rem;
	padding: 1.4rem;
}

.comment-meta {
	font-size: 0.82rem;
}

.comment-author {
	align-items: center;
	display: flex;
	font-size: 1rem;
	gap: 0.7rem;
}

.comment-author .avatar {
	border-radius: 50%;
}

.comment-form label {
	display: block;
	font-size: 0.83rem;
	font-weight: 750;
	margin-bottom: 0.35rem;
}

input[type="text"],
input[type="email"],
input[type="url"],
input[type="password"],
input[type="search"],
textarea,
select {
	background: var(--color-surface);
	border: 1px solid var(--color-border);
	border-radius: var(--radius-small);
	color: var(--color-text);
	max-width: 100%;
	padding: 0.8rem 0.9rem;
}

.comment-form input:not([type="checkbox"]):not([type="submit"]),
.comment-form textarea {
	width: 100%;
}

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

.site-footer {
	background: var(--color-terminal);
	color: var(--color-terminal-text);
	overflow: hidden;
	position: relative;
}

.site-footer__glow {
	background: linear-gradient(90deg, var(--color-primary), var(--color-highlight), var(--color-secondary));
	filter: blur(45px);
	height: 60px;
	left: 10%;
	top: -30px;
	position: absolute;
	width: 80%;
}

.site-footer__inner {
	padding-block: clamp(3rem, 6vw, 6rem) 2rem;
	position: relative;
}

.footer-widgets {
	border-bottom: 1px solid rgba(255, 255, 255, 0.13);
	display: grid;
	gap: 3rem;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	padding-bottom: 4rem;
}

.footer-widget__title {
	color: var(--color-terminal-text);
	font-size: 1rem;
	letter-spacing: -0.02em;
}

.footer-widget,
.footer-widget p,
.footer-widget li {
	color: var(--color-terminal-soft);
	font-size: 0.9rem;
}

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

.footer-widget a,
.site-footer a {
	color: var(--color-terminal-text);
}

.footer-widget a:hover,
.site-footer a:hover {
	color: var(--color-highlight);
}

.site-footer__bottom {
	align-items: center;
	display: grid;
	gap: 2rem;
	grid-template-columns: minmax(220px, 1fr) auto minmax(220px, 1fr);
	padding-top: 2rem;
}

.footer-brand {
	align-items: center;
	display: flex;
	gap: 0.8rem;
}

.footer-brand__mark {
	background: linear-gradient(135deg, var(--color-primary), var(--color-highlight));
	border-radius: 8px 50% 50% 50%;
	height: 30px;
	transform: rotate(15deg);
	width: 30px;
}

.footer-brand strong,
.footer-brand span {
	display: block;
}

.footer-brand span {
	color: var(--color-terminal-soft);
	font-size: 0.75rem;
}

.footer-menu {
	display: flex;
	flex-wrap: wrap;
	gap: 1.1rem;
	justify-content: center;
}

.footer-menu a {
	font-size: 0.82rem;
	font-weight: 700;
	text-decoration: none;
}

.site-info {
	color: var(--color-terminal-soft);
	font-size: 0.76rem;
	margin: 0;
	text-align: right;
}

/* --------------------------------------------------------------------------
   WordPress utility classes
   -------------------------------------------------------------------------- */

.alignleft {
	float: left;
	margin: 0.4rem 2rem 1rem 0;
}

.alignright {
	float: right;
	margin: 0.4rem 0 1rem 2rem;
}

.aligncenter {
	display: block;
	margin-left: auto;
	margin-right: auto;
}

.wp-caption {
	max-width: 100%;
}

.wp-caption-text,
.gallery-caption {
	color: var(--color-text-soft);
	font-size: 0.8rem;
}

.sticky {
	outline: 2px solid color-mix(in srgb, var(--color-highlight) 70%, transparent);
}

.bypostauthor .comment-body {
	border-color: color-mix(in srgb, var(--color-primary) 45%, var(--color-border));
}

.page-links {
	align-items: center;
	display: flex;
	font-weight: 700;
	gap: 0.5rem;
	margin-top: 2rem;
}

/* --------------------------------------------------------------------------
   Responsive behavior
   -------------------------------------------------------------------------- */

@media (max-width: 1220px) {
	.site-header__inner {
		gap: 1rem;
		grid-template-columns: auto auto minmax(0, 1fr) auto;
	}

	.menu-toggle {
		display: inline-flex;
		grid-column: 2;
	}

	.main-navigation {
		background: var(--color-surface);
		border-bottom: 1px solid var(--color-border);
		box-shadow: var(--shadow-soft);
		grid-column: 1 / -1;
		justify-self: stretch;
		left: 0;
		max-height: calc(100vh - var(--header-height));
		opacity: 0;
		overflow-y: auto;
		padding: 1rem max(28px, calc((100vw - var(--layout-wide)) / 2)) 1.5rem;
		pointer-events: none;
		position: absolute;
		top: 100%;
		transform: translateY(-10px);
		transition: opacity var(--transition), transform var(--transition);
		visibility: hidden;
		width: 100%;
	}

	.main-navigation.is-open {
		opacity: 1;
		pointer-events: auto;
		transform: translateY(0);
		visibility: visible;
	}

	.menu-toggle[aria-expanded="true"] .menu-toggle__bars span:nth-child(1) {
		transform: translateY(7px) rotate(45deg);
	}

	.menu-toggle[aria-expanded="true"] .menu-toggle__bars span:nth-child(2) {
		opacity: 0;
	}

	.menu-toggle[aria-expanded="true"] .menu-toggle__bars span:nth-child(3) {
		transform: translateY(-7px) rotate(-45deg);
	}

	.primary-menu {
		align-items: stretch;
		flex-direction: column;
		gap: 0.2rem;
	}

	.primary-menu > li > a {
		font-size: 1.05rem;
		padding: 0.8rem;
	}

	.primary-menu .sub-menu,
	.primary-menu .sub-menu .sub-menu {
		background: color-mix(in srgb, var(--color-primary) 6%, var(--color-surface));
		border: 0;
		box-shadow: none;
		left: auto;
		margin: 0.2rem 0 0.5rem 1rem;
		min-width: 0;
		opacity: 1;
		padding: 0.35rem;
		pointer-events: auto;
		position: static;
		transform: none;
	}

	.mobile-menu-search {
		display: none;
		margin-top: 1rem;
		max-width: 480px;
	}

	.mobile-menu-search .search-field {
		width: 100%;
	}

	.header-tools {
		grid-column: 4;
	}

	.portfolio-hero__inner {
		gap: 3rem;
		grid-template-columns: minmax(0, 1fr) minmax(390px, 0.75fr);
	}

}

@media (max-width: 900px) {
	:root {
		--header-height: 76px;
	}

	.admin-bar .site-header {
		top: 46px;
	}

	.portfolio-hero {
		min-height: auto;
	}

	.portfolio-hero__inner {
		grid-template-columns: 1fr;
		padding-block: 6rem;
	}

	.portfolio-hero h1 {
		max-width: 13ch;
	}

	.expertise-map {
		margin-inline: auto;
		max-width: 680px;
		transform: none;
		width: 100%;
	}

	.portfolio-grid {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}

	.site-footer__bottom {
		grid-template-columns: 1fr;
		text-align: center;
	}

	.footer-brand,
	.footer-menu {
		justify-content: center;
	}

	.site-info {
		text-align: center;
	}

	.error-hero {
		grid-template-columns: 1fr;
	}

	.error-hero__code {
		font-size: 11rem;
		text-align: center;
	}
}

@media (max-width: 680px) {
	.layout-wide {
		width: min(calc(100% - 32px), var(--layout-wide));
	}

	.site-header__inner {
		gap: 0.35rem;
		grid-template-columns: minmax(0, 1fr) auto auto;
	}

	.site-branding {
		grid-column: 1;
	}

	.menu-toggle {
		grid-column: 2;
	}

	.header-tools {
		grid-column: 3;
	}

	.header-search {
		display: none;
	}

	.mobile-menu-search {
		display: block;
	}

	.main-navigation {
		grid-column: 1 / -1;
	}

	.custom-logo {
		max-height: 38px;
		max-width: 90px;
	}

	.site-title {
		font-size: 1rem;
		overflow: hidden;
		text-overflow: ellipsis;
		white-space: nowrap;
	}

	.portfolio-hero__inner {
		padding-block: 4.5rem;
	}

	.portfolio-hero h1 {
		font-size: clamp(2.8rem, 14vw, 4.7rem);
	}

	.expertise-map {
		gap: 0.7rem;
	}

	.expertise-card {
		border-radius: var(--radius-medium);
		min-height: 180px;
		padding: 1.1rem;
	}

	.expertise-card:nth-child(2),
	.expertise-card:nth-child(3) {
		transform: none;
	}

	.expertise-card svg {
		height: 44px;
		width: 44px;
	}

	.section-heading {
		align-items: start;
		flex-direction: column;
		gap: 1rem;
	}

	.portfolio-grid {
		display: grid;
		grid-template-columns: 1fr;
	}

	.portfolio-card {
		aspect-ratio: 1 / 1;
		margin-bottom: 0;
		min-height: 0;
	}

	.portfolio-card__title {
		font-size: clamp(1.65rem, 7vw, 2.4rem);
	}

	.entry-title {
		font-size: clamp(2.6rem, 14vw, 4.8rem);
	}

	.article-hero,
	.page-hero--image {
		min-height: 560px;
	}

	.post-navigation {
		grid-template-columns: 1fr;
	}

	.post-navigation > div:last-child,
	.post-navigation > div:last-child .eyebrow {
		justify-content: flex-start;
		text-align: left;
	}

	.footer-widgets {
		grid-template-columns: 1fr;
	}

	.author-box {
		align-items: flex-start;
		flex-direction: column;
	}

	.alignleft,
	.alignright {
		float: none;
		margin: 1.5rem auto;
	}
}

@media (max-width: 380px) {
	.site-branding__logo + .site-branding__text {
		display: none;
	}

	.expertise-map {
		grid-template-columns: 1fr;
	}

	.expertise-card {
		min-height: 160px;
	}
}

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