/**
 * Theme 26 — header, footer, mobile nav.
 */

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

.fk-header {
	position: fixed;
	top: 0;
	left: 0;
	right: 0;
	z-index: 50;
	backdrop-filter: blur(16px);
	-webkit-backdrop-filter: blur(16px);
	background: rgba(5, 5, 12, 0.82);
	border-bottom: 1px solid var(--fk-hairline-strong);
}

.fk-chromatic-rule {
	height: 2px;
	background: linear-gradient(
		90deg,
		rgba(255, 0, 180, 0.55) 0%,
		rgba(122, 60, 255, 0.5) 22%,
		rgba(0, 230, 255, 0.5) 44%,
		rgba(5, 5, 12, 0) 72%
	);
}

.fk-chromatic-rule--footer {
	background: linear-gradient(
		90deg,
		rgba(0, 230, 255, 0.4) 0%,
		rgba(122, 60, 255, 0.4) 26%,
		rgba(255, 0, 180, 0.45) 48%,
		rgba(5, 5, 12, 0) 78%
	);
}

.fk-header__inner {
	max-width: var(--fk-max);
	margin: 0 auto;
	padding: 0 var(--fk-gutter);
	height: var(--fk-header-h);
	display: flex;
	align-items: center;
	gap: clamp(14px, 2.5vw, 34px);
}

.fk-header__brand {
	display: flex;
	align-items: center;
	flex: 0 0 auto;
}

.fk-header__brand img {
	height: 42px;
	width: auto;
}

.fk-header__nav {
	display: flex;
	align-items: baseline;
	gap: clamp(12px, 2vw, 26px);
	list-style: none;
	margin: 0;
	padding: 0;
}

.fk-header__nav a {
	position: relative;
	display: block;
	padding: 4px 0;
	font-size: 15px;
	font-weight: 500;
	color: rgba(242, 244, 255, 0.6);
	white-space: nowrap;
	transition: color 160ms ease;
}

.fk-header__nav a:hover {
	color: var(--fk-text);
}

.fk-header__nav .current-menu-item > a,
.fk-header__nav .current_page_item > a,
.fk-header__nav .current-menu-ancestor > a,
.fk-header__nav a[aria-current="page"] {
	color: var(--fk-text);
}

.fk-header__nav .current-menu-item > a::after,
.fk-header__nav .current_page_item > a::after,
.fk-header__nav .current-menu-ancestor > a::after,
.fk-header__nav a[aria-current="page"]::after {
	content: "";
	position: absolute;
	left: 0;
	right: 0;
	bottom: -2px;
	height: 1px;
	background: var(--ice);
}

.fk-header__email {
	font-family: var(--fk-mono);
	font-size: 13px;
	color: var(--fk-text-62);
	white-space: nowrap;
	padding-left: clamp(10px, 2vw, 26px);
	border-left: 1px solid var(--fk-hairline-12);
	transition: color 160ms ease;
}

.fk-header__email:hover {
	color: var(--ice);
}

.fk-header__langs {
	display: flex;
	align-items: baseline;
	gap: 8px;
	font-family: var(--fk-mono);
	font-size: 12px;
}

.fk-header__langs .wpml-ls-legacy-list-horizontal,
.fk-header__langs .wpml-ls-statics-shortcode_actions {
	padding: 0;
	margin: 0;
	border: 0;
	background: transparent;
}

.fk-header__langs .wpml-ls-legacy-list-horizontal > ul,
.fk-header__langs ul {
	display: flex;
	align-items: baseline;
	gap: 8px;
	list-style: none;
	margin: 0;
	padding: 0;
}

.fk-header__langs a,
.fk-header__langs .wpml-ls-legacy-list-horizontal a {
	font-family: var(--fk-mono);
	font-size: 12px;
	color: var(--fk-text-40);
	padding: 0;
	border: 0;
	background: none;
	transition: color 160ms ease;
}

.fk-header__langs a:hover,
.fk-header__langs a.is-active,
.fk-header__langs a[aria-current="true"],
.fk-header__langs .wpml-ls-current-language > a {
	color: var(--fk-text);
}

.fk-header__langs .wpml-ls-flag {
	display: none;
}

.fk-header__toggle {
	display: none;
	margin-left: auto;
	border: 0;
	background: none;
	padding: 8px 0;
	cursor: pointer;
	font-family: var(--fk-mono);
	font-size: 12px;
	letter-spacing: 0.04em;
	color: var(--fk-text-62);
	text-transform: uppercase;
}

.fk-header__toggle:hover {
	color: var(--fk-text);
}

.fk-header__panel {
	margin-left: auto;
	display: flex;
	align-items: center;
	gap: clamp(14px, 2.5vw, 34px);
	min-width: 0;
}

.fk-header__panel > nav {
	display: flex;
	align-items: baseline;
	min-width: 0;
}

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

.fk-footer {
	border-top: 1px solid var(--fk-hairline-12);
}

.fk-footer__grid {
	max-width: var(--fk-max);
	margin: 0 auto;
	padding: clamp(50px, 8vh, 86px) var(--fk-gutter) 0;
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(min(100%, 240px), 1fr));
	gap: clamp(32px, 5vw, 64px);
}

.fk-footer__logo {
	height: 48px;
	width: auto;
}

.fk-footer__blurb {
	margin: 22px 0 0;
	font-size: 16px;
	line-height: 1.6;
	color: rgba(242, 244, 255, 0.6);
	white-space: pre-line;
}

.fk-footer__email {
	display: inline-block;
	margin-top: 12px;
	font-family: var(--fk-mono);
	font-size: 14px;
	color: var(--ice);
}

.fk-footer__email:hover {
	color: var(--fk-text);
}

.fk-footer__label {
	font-family: var(--fk-mono);
	font-size: 11px;
	color: var(--fk-text-40);
}

.fk-footer__links {
	display: grid;
	gap: 9px;
	margin-top: 16px;
	list-style: none;
	padding: 0;
	margin-left: 0;
	margin-bottom: 0;
}

.fk-footer__links a {
	font-size: 16px;
	color: rgba(242, 244, 255, 0.6);
}

.fk-footer__links a:hover {
	color: var(--fk-text);
}

.fk-footer__legal {
	max-width: var(--fk-max);
	margin: clamp(44px, 6vh, 70px) auto 0;
	padding: 24px var(--fk-gutter) 30px;
	border-top: 1px solid var(--fk-hairline);
	display: flex;
	flex-wrap: wrap;
	gap: 14px;
	justify-content: space-between;
	font-family: var(--fk-mono);
	font-size: 12px;
	color: var(--fk-text-36);
}

/* Body lock when mobile nav is open */
body.fk-nav-open {
	overflow: hidden;
}

/* ---------- Homepage ---------- */

.fk-todo {
	margin: 8px 0 0;
	font-family: var(--fk-mono);
	font-size: 12px;
	line-height: 1.7;
	color: rgba(122, 60, 255, 0.85);
}

.fk-home-hero {
	position: relative;
	overflow: hidden;
	padding: clamp(120px, 16vh, 190px) 0 0;
}

.fk-home-hero__mark {
	position: absolute;
	top: -120px;
	left: -340px;
	width: 1500px;
	max-width: none;
	height: auto;
	opacity: 0.06;
	pointer-events: none;
}

.fk-home-hero__text {
	animation: fkIn 700ms cubic-bezier(0.2, 0.7, 0.2, 1) both;
}

.fk-home-hero__title {
	margin: 0;
	max-width: 20ch;
	font-size: clamp(46px, 8vw, 118px);
	line-height: 0.9;
	letter-spacing: -0.04em;
	font-weight: 700;
}

.fk-home-hero__title-accent {
	color: var(--fk-lilac);
}

.fk-home-hero__lead {
	margin: 36px 0 0;
	max-width: 60ch;
	font-size: clamp(17px, 1.5vw, 21px);
	line-height: 1.62;
	color: rgba(242, 244, 255, 0.72);
}

.fk-home-hero__text .fk-studio__prose {
	margin-top: clamp(36px, 5vh, 56px);
}

.fk-home-hero__sub {
	margin: clamp(28px, 4vh, 40px) 0 0;
	max-width: 60ch;
	font-size: 16px;
	line-height: 1.7;
	color: rgba(242, 244, 255, 0.5);
}

.fk-sprite {
	margin-top: clamp(56px, 9vh, 110px);
	border-top: 1px solid var(--fk-hairline-strong);
	border-bottom: 1px solid var(--fk-hairline-strong);
	background: var(--fk-band);
	overflow: hidden;
}

.fk-sprite__caption {
	padding: 12px var(--fk-gutter) 4px;
	display: flex;
	justify-content: space-between;
	gap: 16px;
	font-family: var(--fk-mono);
	font-size: 11px;
	color: var(--fk-text-36);
}

.fk-sprite__viewport {
	height: 150px;
	overflow: hidden;
}

.fk-sprite__track {
	display: flex;
	width: max-content;
	align-items: flex-end;
	height: 150px;
}

.fk-sprite__frame {
	height: 140px;
	width: auto;
	flex: 0 0 auto;
	opacity: 0.8;
	max-width: none;
}

.fk-sprite:hover .fk-sprite__track,
.fk-sprite:focus-within .fk-sprite__track {
	animation: fkScrub 2.2s steps(5) infinite;
}

.fk-home-now__lead {
	margin: 0;
	max-width: 30ch;
	font-size: clamp(26px, 2.8vw, 38px);
	line-height: 1.18;
	letter-spacing: -0.02em;
	font-weight: 600;
	color: rgba(242, 244, 255, 0.9);
}

.fk-home-noir {
	display: block;
	margin-top: clamp(40px, 6vh, 68px);
	color: var(--fk-text);
}

.fk-home-noir__media {
	display: block;
	position: relative;
	overflow: hidden;
	color: var(--fk-text);
}

.fk-home-noir__media:hover {
	color: var(--fk-text);
}

.fk-home-noir__media img,
.fk-home-noir img {
	width: 100%;
	aspect-ratio: 21 / 9;
	object-fit: cover;
	filter: saturate(1.05);
}

.fk-home-noir__overlay {
	position: absolute;
	inset: 0;
	background: linear-gradient(
		90deg,
		rgba(5, 5, 12, 0.86) 0%,
		rgba(5, 5, 12, 0.2) 62%,
		rgba(5, 5, 12, 0.5) 100%
	);
}

.fk-home-noir__copy {
	position: absolute;
	left: clamp(18px, 4vw, 56px);
	bottom: clamp(18px, 4vw, 48px);
	right: clamp(18px, 4vw, 56px);
	display: block;
}

.fk-home-noir__meta {
	display: block;
	font-family: var(--fk-mono);
	font-size: 11px;
	color: rgba(242, 244, 255, 0.6);
}

.fk-home-noir__title {
	display: block;
	margin: 12px 0 0;
	font-size: clamp(34px, 5.6vw, 82px);
	line-height: 0.94;
	letter-spacing: -0.035em;
	font-weight: 700;
}

.fk-home-noir__body {
	margin-top: clamp(24px, 3vw, 36px);
	max-width: 62ch;
}

.fk-home-noir__lead {
	margin: 0;
	font-size: 18px;
	font-weight: 600;
	line-height: 1.45;
	color: rgba(242, 244, 255, 0.9);
}

.fk-home-noir__text {
	display: block;
	margin: 14px 0 0;
	font-size: 16px;
	line-height: 1.6;
	color: rgba(242, 244, 255, 0.72);
}

.fk-home-noir__tagline {
	margin: 14px 0 0;
	font-size: 16px;
	line-height: 1.6;
	font-weight: 600;
	color: rgba(242, 244, 255, 0.82);
}

.fk-home-noir__links {
	margin: 18px 0 0;
	font-family: var(--fk-mono);
	font-size: 12px;
	color: rgba(242, 244, 255, 0.55);
}

.fk-home-noir__links a {
	color: rgba(242, 244, 255, 0.82);
}

.fk-home-noir__gallery {
	margin-top: clamp(20px, 3vw, 32px);
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(min(100%, 220px), 1fr));
	gap: clamp(10px, 2vw, 16px);
}

.fk-home-noir__gallery img {
	width: 100%;
	aspect-ratio: 16 / 9;
	object-fit: cover;
	border-radius: 2px;
}

.fk-home-noir__media:hover .fk-chromatic,
.fk-home-noir__media:focus-visible .fk-chromatic {
	text-shadow: -3px 0 var(--fk-fringe-magenta), 3px 0 var(--fk-fringe-cyan);
}

.fk-case__cta {
	margin: 18px 0 0;
	font-family: var(--fk-mono);
	font-size: 12px;
}

.fk-case__cta a {
	color: rgba(242, 244, 255, 0.82);
}

.fk-home-skin {
	margin-top: clamp(40px, 6vh, 70px);
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(min(100%, 300px), 1fr));
	gap: clamp(28px, 4vw, 64px);
	align-items: end;
}

.fk-home-skin__copy {
	max-width: 46ch;
}

.fk-home-skin__meta {
	font-family: var(--fk-mono);
	font-size: 11px;
	color: rgba(242, 244, 255, 0.45);
}

.fk-home-skin__title {
	margin: 12px 0 0;
	font-size: clamp(26px, 3vw, 40px);
	line-height: 1.02;
	letter-spacing: -0.03em;
	font-weight: 600;
}

.fk-home-skin__text {
	margin: 14px 0 0;
	font-size: 16px;
	line-height: 1.65;
	color: rgba(242, 244, 255, 0.6);
}

/*
 * The screenshot is exported on the page background, so it needs no frame —
 * the screens read as floating rather than sitting in a card.
 */
.fk-home-skin__shot {
	margin: 0;
}

.fk-home-skin__shot img {
	width: 100%;
	aspect-ratio: 1 / 1;
	object-fit: contain;
}

.fk-home-skin__shot-caption {
	margin: 10px 0 0;
	font-family: var(--fk-mono);
	font-size: 11px;
	line-height: 1.7;
	color: var(--fk-text-40);
}

.fk-home-alli {
	margin: clamp(36px, 5vh, 60px) 0 0;
	max-width: 68ch;
	font-size: 16px;
	line-height: 1.75;
	color: var(--fk-text-55);
}

.fk-home-log__title,
.fk-home-client__title {
	margin: 0;
	max-width: 26ch;
	font-size: clamp(28px, 3.4vw, 46px);
	line-height: 1.06;
	letter-spacing: -0.03em;
	font-weight: 600;
}

.fk-home-log__title {
	max-width: 24ch;
}

.fk-home-log__intro,
.fk-home-client__intro {
	margin: 18px 0 0;
	max-width: 62ch;
	font-size: 16px;
	line-height: 1.72;
	color: var(--fk-text-55);
}

.fk-home-log__intro {
	max-width: 58ch;
	line-height: 1.7;
}

.fk-home-log__rows {
	margin-top: clamp(34px, 5vh, 54px);
}

.fk-home-log__row {
	display: grid;
	grid-template-columns: 96px minmax(0, 1fr);
	gap: clamp(14px, 3vw, 40px);
	padding: 20px 0;
	border-top: 1px solid var(--fk-hairline);
}

.fk-home-log__year {
	font-family: var(--fk-mono);
	font-size: 13px;
	color: rgba(242, 244, 255, 0.5);
	padding-top: 3px;
}

.fk-home-log__text {
	margin: 0;
	max-width: 62ch;
	font-size: 17px;
	line-height: 1.6;
	color: rgba(242, 244, 255, 0.82);
}

.fk-home-log__spec {
	margin: 8px 0 0;
	font-family: var(--fk-mono);
	font-size: 12px;
	color: var(--fk-text-40);
}

.fk-home-client__projects {
	padding-bottom: clamp(70px, 10vh, 120px);
}

.fk-home-feature {
	display: block;
	position: relative;
	overflow: hidden;
	color: var(--fk-text);
}

.fk-home-feature:hover {
	color: var(--fk-text);
}

.fk-home-feature img {
	width: 100%;
	aspect-ratio: 2 / 1;
	object-fit: cover;
}

.fk-home-feature__overlay {
	position: absolute;
	inset: 0;
	background: linear-gradient(
		180deg,
		rgba(5, 5, 12, 0.15) 0%,
		rgba(5, 5, 12, 0.1) 40%,
		rgba(5, 5, 12, 0.9) 100%
	);
}

.fk-home-feature__title {
	position: absolute;
	left: clamp(14px, 3vw, 42px);
	bottom: clamp(10px, 2vw, 26px);
	margin: 0;
	font-size: clamp(38px, 7vw, 104px);
	line-height: 0.9;
	letter-spacing: -0.045em;
	font-weight: 700;
}

.fk-home-feature__spec {
	position: absolute;
	right: clamp(14px, 3vw, 42px);
	bottom: clamp(16px, 2vw, 32px);
	font-family: var(--fk-mono);
	font-size: 12px;
	color: rgba(242, 244, 255, 0.7);
}

.fk-home-feature:hover .fk-chromatic,
.fk-home-feature:focus-visible .fk-chromatic {
	text-shadow: -3px 0 var(--fk-fringe-magenta), 3px 0 var(--fk-fringe-cyan);
}

.fk-home-client__pair {
	margin-top: 22px;
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(min(100%, 280px), 1fr));
	gap: 22px;
	align-items: start;
}

.fk-home-client__offset {
	display: grid;
	gap: 22px;
	margin-top: clamp(0px, 8vw, 90px);
}

.fk-home-card {
	display: block;
	color: var(--fk-text);
}

.fk-home-card:hover {
	color: var(--fk-text);
}

.fk-home-card img {
	width: 100%;
	aspect-ratio: 3 / 4;
	object-fit: cover;
}

/* Selectors are element-qualified so they outrank `.fk-home-card img` above. */
.fk-home-card img.fk-home-card__img--wide {
	aspect-ratio: 16 / 9;
}

.fk-home-card img.fk-home-card__img--square {
	aspect-ratio: 1 / 1;
}

.fk-home-card__title {
	margin: 16px 0 0;
	font-size: clamp(24px, 2.6vw, 34px);
	line-height: 1;
	letter-spacing: -0.03em;
	font-weight: 600;
}

.fk-home-card__spec {
	margin: 10px 0 0;
	font-family: var(--fk-mono);
	font-size: 12px;
	color: var(--fk-text-42);
}

.fk-home-card__text {
	margin: 12px 0 0;
	max-width: 40ch;
	font-size: 15px;
	line-height: 1.6;
	color: rgba(242, 244, 255, 0.6);
}

.fk-home-card:hover .fk-chromatic,
.fk-home-card:focus-visible .fk-chromatic {
	text-shadow: -2px 0 rgba(255, 0, 180, 0.8), 2px 0 rgba(0, 230, 255, 0.8);
}

.fk-home-list {
	margin-top: clamp(44px, 7vh, 80px);
	max-width: 900px;
}

.fk-home-list__row {
	display: grid;
	grid-template-columns: minmax(0, 1fr) auto;
	gap: 20px;
	align-items: baseline;
	padding: 16px 0;
	border-top: 1px solid var(--fk-hairline);
}

.fk-home-list__name {
	font-size: 19px;
	font-weight: 500;
}

.fk-home-list__note {
	font-size: 15px;
	color: rgba(242, 244, 255, 0.5);
}

.fk-home-list__spec {
	font-family: var(--fk-mono);
	font-size: 12px;
	color: var(--fk-text-40);
	white-space: nowrap;
}

.fk-home-ending {
	padding: clamp(70px, 11vh, 130px) 0 clamp(80px, 12vh, 150px);
	border-top: 1px solid var(--fk-hairline-strong);
}

.fk-home-ending__email {
	display: inline-block;
	font-family: var(--fk-mono);
	font-size: clamp(22px, 5.4vw, 74px);
	line-height: 1.05;
	letter-spacing: -0.03em;
	color: var(--fk-text);
	word-break: break-word;
}

.fk-home-ending__email:hover {
	color: var(--fk-text);
}

.fk-home-ending__text {
	margin: 32px 0 0;
	max-width: 56ch;
	font-size: 17px;
	line-height: 1.68;
	color: rgba(242, 244, 255, 0.6);
}

/* ---------- Work index ---------- */

.fk-work-index__header {
	border-bottom: 1px solid var(--fk-hairline-strong);
	padding-top: clamp(60px, 9vh, 110px);
	padding-bottom: clamp(50px, 7vh, 80px);
}

.fk-work-index__title {
	margin: 0;
	max-width: 22ch;
	font-size: clamp(38px, 6.4vw, 92px);
	line-height: 0.94;
	letter-spacing: -0.04em;
	font-weight: 700;
}

.fk-work-index__intro {
	margin: 26px 0 0;
	max-width: 58ch;
	font-size: 17px;
	line-height: 1.68;
	color: rgba(242, 244, 255, 0.6);
}

.fk-work-index__list {
	padding-bottom: clamp(80px, 12vh, 150px);
}

.fk-project-row {
	display: grid;
	grid-template-columns: 90px minmax(0, 1fr);
	gap: clamp(14px, 3vw, 40px);
	padding: clamp(26px, 4vh, 44px) 0;
	border-bottom: 1px solid var(--fk-hairline);
}

.fk-project-row__year {
	font-family: var(--fk-mono);
	font-size: 13px;
	color: rgba(242, 244, 255, 0.45);
	padding-top: 6px;
}

.fk-project-row__body {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(min(100%, 260px), 1fr));
	gap: clamp(20px, 3vw, 48px);
	align-items: start;
}

.fk-project-row__title-link {
	color: var(--fk-text);
	display: inline-block;
}

.fk-project-row__title-link:hover {
	color: var(--fk-text);
}

.fk-project-row__title {
	margin: 0;
	font-size: clamp(26px, 3.4vw, 44px);
	line-height: 1;
	letter-spacing: -0.03em;
	font-weight: 600;
}

.fk-project-row__title-link:hover .fk-chromatic,
.fk-project-row__title-link:focus-visible .fk-chromatic {
	text-shadow: -2px 0 rgba(255, 0, 180, 0.8), 2px 0 rgba(0, 230, 255, 0.8);
}

.fk-project-row__spec {
	margin: 12px 0 0;
	font-family: var(--fk-mono);
	font-size: 12px;
	color: var(--fk-text-42);
}

.fk-project-row__text {
	margin: 16px 0 0;
	max-width: 48ch;
	font-size: 16px;
	line-height: 1.65;
	color: var(--fk-text-62);
}

.fk-project-row__case {
	display: inline-block;
	margin-top: 16px;
	font-size: 15px;
	font-weight: 500;
	color: var(--ice);
}

.fk-project-row__case:hover {
	color: var(--fk-text);
}

.fk-project-row__media {
	display: block;
	overflow: hidden;
}

.fk-project-row__media img {
	width: 100%;
	aspect-ratio: 16 / 10;
	object-fit: cover;
}

/* ---------- Case study ---------- */

.fk-case__header {
	padding-top: clamp(50px, 7vh, 90px);
}

.fk-case__back {
	font-family: var(--fk-mono);
	font-size: 12px;
	color: rgba(242, 244, 255, 0.5);
}

.fk-case__back:hover {
	color: var(--ice);
}

.fk-case__title {
	margin: 0;
	font-size: clamp(40px, 7vw, 100px);
	line-height: 0.92;
	letter-spacing: -0.04em;
	font-weight: 700;
}

.fk-case__intro {
	margin: 24px 0 0;
	max-width: 54ch;
	font-size: clamp(17px, 1.6vw, 22px);
	line-height: 1.58;
	color: var(--fk-text-75);
}

.fk-case__hero {
	margin-top: clamp(44px, 6vh, 72px);
}

.fk-case__hero img {
	width: 100%;
	aspect-ratio: 21 / 9;
	object-fit: cover;
}

.fk-case-spec {
	padding-top: clamp(50px, 7vh, 84px);
}

.fk-case-spec__table {
	max-width: 760px;
}

.fk-case-spec__row {
	display: grid;
	grid-template-columns: 150px minmax(0, 1fr);
	gap: 20px;
	padding: 13px 0;
	border-top: 1px solid var(--fk-hairline);
}

.fk-case-spec__label {
	font-family: var(--fk-mono);
	font-size: 12px;
	color: var(--fk-text-42);
}

.fk-case-spec__value {
	font-size: 16px;
	line-height: 1.5;
}

.fk-case-prose {
	padding-top: clamp(56px, 8vh, 100px);
}

.fk-case-prose__grid {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(min(100%, 280px), 1fr));
	gap: clamp(30px, 4vw, 64px);
}

.fk-case-prose__heading {
	margin: 0;
	font-size: 20px;
	font-weight: 600;
	letter-spacing: -0.015em;
	color: var(--fk-lilac);
}

.fk-case-prose__body {
	margin: 16px 0 0;
	font-size: 16px;
	line-height: 1.72;
	color: var(--fk-text-70);
}

.fk-case-gallery {
	padding-top: clamp(56px, 8vh, 100px);
	padding-bottom: clamp(60px, 9vh, 110px);
}

.fk-case-gallery__grid {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(min(100%, 300px), 1fr));
	gap: 20px;
	align-items: start;
}

.fk-case-gallery__item {
	margin: 0;
}

.fk-case-gallery__item img {
	width: 100%;
	aspect-ratio: 4 / 3;
	object-fit: cover;
}

.fk-case-gallery__caption {
	margin: 10px 0 0;
	font-family: var(--fk-mono);
	font-size: 11px;
	color: rgba(242, 244, 255, 0.38);
}

.fk-case-next {
	border-top: 1px solid var(--fk-hairline-strong);
}

.fk-case-next__link {
	display: block;
	color: var(--fk-text);
	padding: clamp(44px, 7vh, 84px) 0;
}

.fk-case-next__link:hover {
	color: var(--fk-text);
}

.fk-case-next__title {
	margin: 0;
	font-size: clamp(30px, 5vw, 66px);
	line-height: 1;
	letter-spacing: -0.035em;
	font-weight: 600;
}

.fk-case-next__link:hover .fk-chromatic,
.fk-case-next__link:focus-visible .fk-chromatic {
	text-shadow: -3px 0 var(--fk-fringe-magenta), 3px 0 var(--fk-fringe-cyan);
}

/* ---------- Studio ---------- */

.fk-studio__intro {
	border-bottom: 1px solid var(--fk-hairline-strong);
	padding-top: clamp(60px, 9vh, 110px);
	padding-bottom: clamp(60px, 9vh, 100px);
}

.fk-studio__title {
	margin: 0;
	max-width: 24ch;
	font-size: clamp(36px, 5.6vw, 80px);
	line-height: 0.96;
	letter-spacing: -0.04em;
	font-weight: 700;
	text-wrap: balance;
}

.fk-studio__title-accent {
	color: var(--fk-lilac);
}

.fk-studio__name {
	color: var(--fk-lilac);
}

.fk-studio__name-link {
	text-decoration: none;
}

.fk-studio__name-link:hover,
.fk-studio__name-link:focus-visible {
	color: var(--fk-ice);
	text-decoration: underline;
	text-underline-offset: 0.15em;
}

.fk-studio__prose {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(min(100%, 300px), 1fr));
	gap: clamp(28px, 4vw, 64px);
	margin-top: clamp(36px, 5vh, 56px);
}

.fk-studio__prose-col p {
	margin: 0;
	font-size: 17px;
	line-height: 1.72;
	color: var(--fk-text-70);
}

.fk-studio__prose-col p + p {
	margin-top: 1.25em;
}

.fk-studio__prose-link {
	color: var(--fk-lilac);
	text-decoration: underline;
	text-decoration-thickness: 1px;
	text-underline-offset: 0.15em;
}

.fk-studio__prose-link:hover,
.fk-studio__prose-link:focus-visible {
	color: var(--ice);
}

.fk-studio__capabilities {
	border-bottom: 1px solid var(--fk-hairline-strong);
	padding-top: clamp(50px, 7vh, 90px);
	padding-bottom: clamp(50px, 7vh, 90px);
}

.fk-studio__cap-list {
	max-width: 860px;
}

.fk-studio__cap-row {
	display: grid;
	grid-template-columns: minmax(0, 220px) minmax(0, 1fr);
	gap: clamp(16px, 3vw, 40px);
	padding: 20px 0;
	border-top: 1px solid var(--fk-hairline);
}

.fk-studio__cap-title {
	margin: 0;
	font-size: 19px;
	font-weight: 600;
	letter-spacing: -0.01em;
}

.fk-studio__cap-text {
	margin: 0;
	font-size: 16px;
	line-height: 1.65;
	color: rgba(242, 244, 255, 0.6);
}

.fk-studio__stack {
	margin: 30px 0 0;
	max-width: 62ch;
	font-family: var(--fk-mono);
	font-size: 13px;
	line-height: 1.75;
	color: rgba(242, 244, 255, 0.45);
}

.fk-studio__artifacts {
	padding-top: clamp(50px, 7vh, 90px);
	padding-bottom: clamp(80px, 12vh, 140px);
}

.fk-studio__artifacts-intro {
	margin: 0 0 clamp(28px, 4vh, 44px);
	max-width: 56ch;
	font-size: 17px;
	line-height: 1.7;
	color: rgba(242, 244, 255, 0.65);
}

.fk-studio__artifacts-grid {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(min(100%, 320px), 1fr));
	gap: 22px;
	align-items: start;
}

.fk-studio__artifact {
	margin: 0;
}

.fk-studio__artifact img {
	width: 100%;
	aspect-ratio: 16 / 10;
	object-fit: cover;
	border: 1px solid var(--fk-hairline-strong);
}

.fk-studio__artifact-caption {
	margin: 10px 0 0;
	font-family: var(--fk-mono);
	font-size: 11px;
	line-height: 1.6;
	color: var(--fk-text-40);
}

/* ---------- Notes ---------- */

.fk-notes__header {
	border-bottom: 1px solid var(--fk-hairline-strong);
	padding-top: clamp(60px, 9vh, 110px);
	padding-bottom: clamp(44px, 6vh, 70px);
}

.fk-notes__title {
	margin: 0;
	max-width: 22ch;
	font-size: clamp(36px, 5.6vw, 80px);
	line-height: 0.96;
	letter-spacing: -0.04em;
	font-weight: 700;
}

.fk-notes__intro {
	margin: 26px 0 0;
	max-width: 56ch;
	font-size: 17px;
	line-height: 1.7;
	color: rgba(242, 244, 255, 0.65);
}

.fk-notes__list-wrap {
	padding-bottom: clamp(80px, 12vh, 140px);
}

.fk-notes__list {
	max-width: 820px;
}

.fk-notes__row {
	display: grid;
	grid-template-columns: 110px minmax(0, 1fr);
	gap: clamp(14px, 3vw, 34px);
	align-items: start;
	padding: 26px 0;
	border-top: 1px solid var(--fk-hairline-strong);
	color: var(--fk-text);
}

.fk-notes__row:hover {
	color: var(--fk-text);
}

.fk-notes__row:hover .fk-chromatic,
.fk-notes__row:focus-visible .fk-chromatic {
	text-shadow: -2px 0 rgba(255, 0, 180, 0.75), 2px 0 rgba(0, 230, 255, 0.75);
}

.fk-notes__date {
	font-family: var(--fk-mono);
	font-size: 12px;
	color: var(--fk-text-40);
	padding-top: 5px;
}

.fk-notes__post-title {
	display: block;
	margin: 0;
	font-size: clamp(20px, 2.2vw, 27px);
	font-weight: 600;
	letter-spacing: -0.02em;
	line-height: 1.22;
}

.fk-notes__excerpt {
	display: block;
	margin: 10px 0 0;
	max-width: 60ch;
	font-size: 15px;
	line-height: 1.65;
	color: var(--fk-text-55);
}

.fk-notes__empty {
	margin: 26px 0 0;
	color: var(--fk-text-55);
}

/* ---------- Contact ---------- */

.fk-contact__write {
	padding-top: clamp(60px, 9vh, 110px);
	padding-bottom: clamp(50px, 7vh, 80px);
}

.fk-contact__or {
	padding-top: clamp(50px, 7vh, 80px);
	padding-bottom: clamp(70px, 10vh, 120px);
	border-top: 1px solid var(--fk-hairline-strong);
}

.fk-contact__email {
	display: inline-block;
	margin: 0;
	font-family: var(--fk-mono);
	font-size: clamp(21px, 5vw, 68px);
	font-weight: 400;
	line-height: 1.05;
	letter-spacing: -0.03em;
	color: var(--fk-text);
	word-break: break-word;
}

.fk-contact__email a {
	color: inherit;
}

.fk-contact__email a:hover {
	color: inherit;
}

.fk-contact__intro {
	margin: 30px 0 0;
	max-width: 54ch;
	font-size: 17px;
	line-height: 1.68;
	color: var(--fk-text-62);
	text-wrap: pretty;
}

.fk-contact__form {
	display: grid;
	gap: 26px;
	max-width: 680px;
}

.fk-contact__hp {
	position: absolute;
	width: 1px;
	height: 1px;
	padding: 0;
	margin: -1px;
	overflow: hidden;
	clip: rect(0, 0, 0, 0);
	white-space: nowrap;
	border: 0;
}

.fk-contact__alert {
	padding: 14px 0 4px;
	border-top: 1px solid rgba(255, 120, 120, 0.45);
	color: var(--fk-text-75);
}

.fk-contact__alert p {
	margin: 0 0 8px;
	font-size: 15px;
	line-height: 1.5;
}

.fk-contact__alert p:last-child {
	margin-bottom: 0;
}

.fk-contact__field {
	display: grid;
	gap: 8px;
	border-top: 1px solid var(--fk-hairline-12);
	padding-top: 10px;
}

.fk-contact__label {
	font-family: var(--fk-mono);
	font-size: 11px;
	color: rgba(242, 244, 255, 0.45);
}

.fk-contact__input,
.fk-contact__textarea {
	width: 100%;
	margin: 0;
	padding: 8px 0;
	border: 0;
	border-bottom: 1px solid rgba(242, 244, 255, 0.18);
	border-radius: 0;
	background: transparent;
	color: var(--fk-text);
	font-family: var(--fk-font);
	font-size: 19px;
	line-height: 1.4;
	box-shadow: none;
	appearance: none;
}

.fk-contact__textarea {
	resize: vertical;
	min-height: 6.5em;
}

.fk-contact__input:focus,
.fk-contact__textarea:focus {
	border-bottom-color: var(--ice);
}

.fk-contact__input:focus-visible,
.fk-contact__textarea:focus-visible {
	outline: 2px solid var(--ice);
	outline-offset: 4px;
	border-bottom-color: var(--ice);
}

.fk-contact__input::placeholder,
.fk-contact__textarea::placeholder {
	color: var(--fk-text-36);
}

.fk-contact__submit {
	justify-self: start;
	margin: 4px 0 0;
	padding: 0;
	border: 0;
	background: none;
	color: var(--ice);
	font-family: var(--fk-mono);
	font-size: 15px;
	letter-spacing: 0.02em;
	cursor: pointer;
}

.fk-contact__submit:hover,
.fk-contact__submit:focus-visible {
	color: var(--fk-text);
}

.fk-contact__sent {
	max-width: 680px;
	padding-top: 18px;
	border-top: 1px solid rgba(111, 227, 255, 0.4);
}

.fk-contact__sent-title {
	margin: 0;
	font-size: 24px;
	font-weight: 600;
	letter-spacing: -0.02em;
	line-height: 1.2;
}

.fk-contact__sent-body {
	margin: 12px 0 0;
	font-size: 16px;
	line-height: 1.65;
	color: var(--fk-text-62);
}

/* ---------- Note single ---------- */

.fk-note-single__header {
	padding-top: clamp(60px, 9vh, 110px);
	padding-bottom: clamp(36px, 5vh, 56px);
	border-bottom: 1px solid var(--fk-hairline-strong);
}

.fk-note-single__back {
	color: var(--fk-text-40);
}

.fk-note-single__back:hover,
.fk-note-single__back:focus-visible {
	color: var(--ice);
}

.fk-note-single__date {
	margin: 0;
	font-family: var(--fk-mono);
	font-size: 12px;
	color: var(--fk-text-40);
}

.fk-note-single__title {
	margin: 14px 0 0;
	max-width: 22ch;
	font-size: clamp(32px, 5vw, 64px);
	line-height: 1.05;
}

.fk-note-single__body {
	padding-top: clamp(36px, 5vh, 64px);
	padding-bottom: clamp(70px, 10vh, 120px);
}

.fk-note-single__content {
	max-width: 62ch;
	font-size: 17px;
	line-height: 1.7;
	color: var(--fk-text-75);
}

.fk-note-single__content > *:first-child {
	margin-top: 0;
}

.fk-note-single__content a {
	text-decoration: underline;
	text-underline-offset: 2px;
}