/*
Theme Name: Non-Linear
Theme URI: https://nonlinearconsulting.com
Description: Industrial-editorial hybrid. Fraunces + IBM Plex Mono, cream substrate, navy typographic gravity, blueprint-blue technical accent, brass hairlines.
Author: Non-Linear LLC
Template: twentytwentyfive
Version: 0.9.0
Requires at least: 6.5
Requires PHP: 8.0
License: GPL v2 or later
Text Domain: non-linear
*/

:root {
	--nl-white: #FBFAF6;
	--nl-cream: #F4EEE1;
	--nl-cream-deep: #EAE2D0;
	--nl-navy: #0F1E33;
	--nl-navy-2: #1A2B44;
	--nl-graphite: #3B3B3D;
	--nl-blueprint: #2E4A6B;
	--nl-blueprint-deep: #233B57;
	--nl-blueprint-light: #4A6889;
	--nl-brass: #8B7355;
	--nl-mono: "IBM Plex Mono", ui-monospace, "SFMono-Regular", Menlo, monospace;
	--nl-serif: "Fraunces", Georgia, "Iowan Old Style", serif;
	--nl-ease: cubic-bezier(0.22, 0.61, 0.36, 1);
	--nl-ease-out: cubic-bezier(0.16, 1, 0.3, 1);
	--nl-shadow-sm: 0 4px 12px -4px rgba(15,30,51,0.08), 0 2px 6px -3px rgba(15,30,51,0.05);
	--nl-shadow-md: 0 20px 40px -20px rgba(15,30,51,0.18), 0 8px 20px -10px rgba(15,30,51,0.08);
	--nl-shadow-lg: 0 40px 80px -30px rgba(15,30,51,0.22), 0 16px 40px -20px rgba(15,30,51,0.12);
}

/* RESPONSIVE FIX — TT5 alignfull escape */
.wp-site-blocks .wp-block-post-content > .alignfull,
.wp-site-blocks main .wp-block-group.alignfull,
.wp-site-blocks main .wp-block-cover.alignfull {
	margin-inline: calc(50% - 50vw) !important;
	max-width: 100vw !important;
	width: 100vw !important;
}
.wp-site-blocks main .wp-block-group.alignfull > .wp-block-group,
.wp-site-blocks main .wp-block-cover.alignfull > .wp-block-cover__inner-container {
	max-width: 1360px;
	margin-inline: auto;
	padding-inline: clamp(1rem, 3vw, 2.5rem);
	width: 100%;
}

body {
	font-variation-settings: "opsz" 14, "SOFT" 30;
	font-optical-sizing: auto;
	-webkit-font-smoothing: antialiased;
	font-feature-settings: "ss01" 1;
	background: var(--nl-white);
}
h1, h2, h3, h4, .wp-block-heading {
	font-variation-settings: "opsz" 144, "SOFT" 30;
	text-wrap: balance;
	font-feature-settings: "ss01" 1, "kern" 1;
}
p, .wp-block-paragraph { text-wrap: pretty; hyphens: none; }
::selection { background: var(--nl-blueprint); color: var(--nl-white); }
:focus-visible { outline: 2px solid var(--nl-blueprint); outline-offset: 3px; }
html { scroll-behavior: smooth; background: var(--nl-white); }

/* TECH / MONO */
.nl-tech, .nl-tagline {
	font-family: var(--nl-mono);
	font-size: 12px;
	font-weight: 500;
	letter-spacing: 0.14em;
	text-transform: uppercase;
	color: var(--nl-blueprint);
	line-height: 1.4;
}
.nl-eyebrow {
	font-family: var(--nl-mono);
	font-size: 11px;
	font-weight: 500;
	letter-spacing: 0.18em;
	text-transform: uppercase;
	color: var(--nl-blueprint);
	margin-bottom: clamp(1rem, 2vw, 1.5rem);
	display: block;
}
.nl-eyebrow.has-text-align-center { display: block; }

/* HEADER */
.nl-header { position: relative; z-index: 5; }
.nl-header .wp-block-site-title a {
	color: var(--nl-navy);
	text-decoration: none;
	font-style: italic;
	transition: color 240ms var(--nl-ease);
}
.nl-header .wp-block-site-title a:hover { color: var(--nl-blueprint); }
.nl-header .nl-tagline { margin: 0; }
@media (max-width: 700px) { .nl-header .nl-tagline { font-size: 10px; } }

/* HERO */
.nl-hero {
	position: relative;
	min-height: clamp(560px, 82vh, 820px);
	overflow: hidden;
	color: var(--nl-white);
	isolation: isolate;
	background-attachment: fixed;
	background-size: cover;
	background-position: center;
}
.nl-hero .wp-block-cover__image-background {
	filter: saturate(0.5) contrast(1.1) brightness(0.85);
}
.nl-hero .wp-block-cover__background,
.nl-hero::after {
	background:
		linear-gradient(135deg, rgba(15, 30, 51, 0.68) 0%, rgba(15, 30, 51, 0.82) 100%),
		radial-gradient(ellipse at 20% 40%, rgba(46, 74, 107, 0.35) 0%, rgba(15, 30, 51, 0) 65%) !important;
}
.nl-hero .wp-block-cover__inner-container { position: relative; z-index: 2; }

.nl-hero-eyebrow {
	font-family: var(--nl-mono);
	font-size: 11px;
	font-weight: 500;
	letter-spacing: 0.18em;
	text-transform: uppercase;
	color: #C4B599;
	margin: 0 0 clamp(1.25rem, 2vw, 2rem) 0;
}
.nl-hero-display {
	font-family: var(--nl-serif);
	font-weight: 500;
	line-height: 0.92;
	letter-spacing: -0.035em;
	font-variation-settings: "opsz" 144;
	color: var(--nl-white);
	margin: 0;
	max-width: 15ch;
}
.nl-hero-lede {
	font-family: var(--nl-serif);
	font-size: clamp(19px, 1.4vw, 24px);
	line-height: 1.5;
	font-weight: 400;
	color: #E4DBC7;
	max-width: 52ch;
	margin: clamp(1.5rem, 3vw, 2.5rem) 0;
	font-variation-settings: "opsz" 24;
}
.nl-hero a.nl-textlink,
.nl-hero .nl-textlink a {
	color: var(--nl-white) !important;
	border-bottom-color: rgba(196, 181, 153, 0.55);
}
.nl-hero a.nl-textlink:hover,
.nl-hero .nl-textlink a:hover {
	color: #C4B599 !important;
	border-bottom-color: var(--nl-white);
}
@media (max-width: 900px), (hover: none) {
	.nl-hero { background-attachment: scroll; }
}

/* SECTOR BAR — REVERTED to flex + hairline pseudo dividers.
   Equidistance via flex:1 on each item (equal cells, small hairline between). */
.nl-sector-bar {
	display: flex;
	justify-content: center;
	align-items: center;
	max-width: 920px;
	margin: 0 auto;
	font-family: var(--nl-mono);
	font-size: 12px;
	font-weight: 500;
	letter-spacing: 0.16em;
	text-transform: uppercase;
	color: var(--nl-navy);
	gap: 0;
}
.nl-sector-bar > * {
	flex: 1;
	padding: 0.5rem 0.75rem;
	text-align: center;
	position: relative;
	color: var(--nl-navy);
	text-decoration: none;
}
.nl-sector-bar > * + *::before {
	content: "";
	position: absolute;
	left: 0;
	top: 50%;
	transform: translateY(-50%);
	width: 1px;
	height: 12px;
	background: rgba(139, 115, 85, 0.55);
}
.nl-sector-bar strong { color: var(--nl-blueprint); font-weight: 500; }
.nl-sector-bar a:hover { color: var(--nl-blueprint); }
@media (max-width: 640px) {
	.nl-sector-bar { flex-wrap: wrap; font-size: 11px; letter-spacing: 0.12em; }
	.nl-sector-bar > * { flex: 1 1 40%; padding: 0.4rem 0.5rem; }
	.nl-sector-bar > *:nth-child(odd)::before { display: none; }
}

/* SPEC-SHEET SERVICE TILES */
.nl-spec-stack { margin: 0; }
.nl-spec-tile {
	display: grid;
	grid-template-columns: 1fr;
	gap: clamp(1.5rem, 3vw, 3rem);
	padding: clamp(2.5rem, 4vw, 4rem) 0;
	border-top: 2px solid var(--nl-navy);
	align-items: start;
	scroll-margin-top: 100px;
}
.nl-spec-tile:last-child { border-bottom: 2px solid var(--nl-navy); }
@media (min-width: 900px) {
	.nl-spec-tile {
		grid-template-columns: 1.05fr 0.95fr;
		gap: clamp(3rem, 5vw, 5rem);
	}
	.nl-spec-tile.nl-row-reverse .nl-spec-media { order: 2; }
	.nl-spec-tile.nl-row-reverse .nl-spec-text  { order: 1; }
}

.nl-spec-media {
	position: relative;
	aspect-ratio: 5 / 4;
	overflow: hidden;
	box-shadow: var(--nl-shadow-md);
	background: var(--nl-cream-deep);
	border-radius: 2px;
}
/* LIGHTER filter — no more brightness kill */
.nl-spec-media img {
	width: 100%; height: 100%;
	object-fit: cover;
	display: block;
	transition: transform 900ms var(--nl-ease-out), filter 500ms ease;
	filter: saturate(0.75) contrast(1.03);
}
.nl-spec-media:hover img { transform: scale(1.03); }
/* Very subtle bottom fade only — no overall darkening */
.nl-spec-media::after {
	content: "";
	position: absolute; inset: 0;
	pointer-events: none;
	background: linear-gradient(180deg, rgba(15,30,51,0) 65%, rgba(15,30,51,0.15) 100%);
}

/* FIG caption — global styles */
.nl-fig {
	display: block;
	margin-top: 0.75rem;
	font-family: var(--nl-mono);
	font-size: 11px;
	letter-spacing: 0.12em;
	text-transform: uppercase;
	color: var(--nl-graphite);
	font-style: normal;
}
.nl-fig strong { color: var(--nl-blueprint); font-weight: 500; }
/* Figs INSIDE media containers: DARKER text on lighter background */
.nl-spec-media .nl-fig,
.nl-spec-media figcaption {
	color: var(--nl-navy) !important;
	font-weight: 600;
}
.nl-spec-media .nl-fig strong,
.nl-spec-media figcaption strong {
	color: var(--nl-navy) !important;
	font-weight: 600;
}

.nl-spec-code {
	display: block;
	font-family: var(--nl-mono);
	font-size: 11px;
	font-weight: 500;
	letter-spacing: 0.16em;
	text-transform: uppercase;
	color: var(--nl-blueprint);
	margin: 0 0 clamp(1rem, 2vw, 1.5rem) 0;
	padding-bottom: 0.6rem;
	border-bottom: 1px solid rgba(139, 115, 85, 0.35);
}
.nl-spec-title {
	font-family: var(--nl-serif);
	font-variation-settings: "opsz" 144;
	font-weight: 500;
	font-size: clamp(32px, 3.8vw, 52px);
	color: var(--nl-navy);
	line-height: 1.02;
	letter-spacing: -0.025em;
	margin: 0 0 clamp(1.25rem, 2vw, 1.75rem) 0;
	text-wrap: balance;
}
.nl-spec-attrs {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: clamp(0.75rem, 1.5vw, 1.25rem);
	margin: 0 0 clamp(1.5rem, 3vw, 2rem) 0;
	padding: 0.9rem 0;
	border-top: 1px solid rgba(139, 115, 85, 0.4);
	border-bottom: 1px solid rgba(139, 115, 85, 0.4);
}
@media (max-width: 640px) { .nl-spec-attrs { grid-template-columns: 1fr; gap: 0.75rem; } }
.nl-spec-attr dt {
	font-family: var(--nl-mono);
	font-size: 10px;
	font-weight: 500;
	letter-spacing: 0.14em;
	text-transform: uppercase;
	color: var(--nl-graphite);
	margin: 0 0 0.35rem 0;
}
.nl-spec-attr dd {
	font-family: var(--nl-serif);
	font-size: 14px;
	line-height: 1.35;
	color: var(--nl-navy);
	margin: 0;
	font-weight: 400;
}
.nl-spec-body {
	font-family: var(--nl-serif);
	font-size: clamp(17px, 1.1vw, 19px);
	line-height: 1.6;
	color: var(--nl-graphite);
	max-width: 62ch;
	margin: 0;
}

/* PRINCIPAL split + portrait */
.nl-split {
	display: grid;
	grid-template-columns: 1fr;
	gap: clamp(2rem, 4vw, 4rem);
	align-items: start;
}
@media (min-width: 900px) {
	.nl-split { grid-template-columns: 0.9fr 1.1fr; gap: clamp(3rem, 6vw, 5rem); }
	.nl-split-40-60 { grid-template-columns: 0.7fr 1.3fr; }
	.nl-split-portrait { grid-template-columns: 0.55fr 1fr; }
}
.nl-split-right { padding-top: clamp(1rem, 2vw, 2rem); }
.nl-portrait {
	position: relative;
	aspect-ratio: 4 / 5;
	overflow: hidden;
	background: var(--nl-navy);
	box-shadow: var(--nl-shadow-lg);
	border-radius: 2px;
}
.nl-portrait img {
	width: 100%; height: 100%;
	object-fit: cover;
	display: block;
	filter: saturate(0.15) contrast(1.15) brightness(0.55) sepia(0.15);
}
.nl-portrait::after {
	content: "";
	position: absolute; inset: 0;
	pointer-events: none;
	background: linear-gradient(160deg, rgba(46, 74, 107, 0.55) 0%, rgba(15, 30, 51, 0.85) 100%);
	mix-blend-mode: multiply;
}
.nl-portrait-annotate {
	position: absolute;
	right: 12px;
	bottom: 12px;
	z-index: 2;
	color: #E4DBC7;
	font-family: var(--nl-mono);
	font-size: 10px;
	letter-spacing: 0.16em;
	text-transform: uppercase;
	text-align: right;
	line-height: 1.7;
	padding: 0.5rem 0.75rem;
	background: rgba(15, 30, 51, 0.55);
	border: 1px solid rgba(196, 181, 153, 0.25);
	backdrop-filter: blur(4px);
}
.nl-lede::first-letter {
	font-variation-settings: "opsz" 144;
	font-weight: 500;
	font-size: 3.4em;
	float: left;
	line-height: 0.85;
	margin: 0.06em 0.14em 0 -0.03em;
	color: var(--nl-blueprint);
}

/* TEXT-LINK CTA + BIG CTA */
.nl-textlink,
.nl-textlink a {
	font-family: var(--nl-serif);
	font-size: 20px;
	font-weight: 500;
	color: var(--nl-navy) !important;
	text-decoration: none;
	border-bottom: 1px solid var(--nl-blueprint);
	padding-bottom: 4px;
	transition: color 240ms var(--nl-ease), border-color 240ms var(--nl-ease);
	display: inline-block;
	font-variation-settings: "opsz" 24;
}
.nl-textlink a::after,
a.nl-textlink::after {
	content: " →";
	display: inline-block;
	margin-left: 0.4em;
	transition: transform 380ms var(--nl-ease-out);
}
.nl-textlink:hover a::after,
a.nl-textlink:hover::after { transform: translateX(6px); }
.nl-textlink:hover a,
a.nl-textlink:hover {
	color: var(--nl-blueprint) !important;
	border-color: var(--nl-navy);
}

.nl-cta-big,
.nl-cta-big a {
	font-family: var(--nl-serif);
	font-size: clamp(28px, 3.2vw, 42px);
	font-weight: 500;
	color: var(--nl-navy) !important;
	text-decoration: none;
	border-bottom: 2px solid var(--nl-blueprint);
	padding-bottom: 8px;
	transition: color 260ms var(--nl-ease), border-color 260ms var(--nl-ease);
	display: inline-block;
	font-variation-settings: "opsz" 96;
	letter-spacing: -0.02em;
}
.nl-cta-big a::after, a.nl-cta-big::after {
	content: " →";
	display: inline-block;
	margin-left: 0.35em;
	transition: transform 440ms var(--nl-ease-out);
}
.nl-cta-big:hover a::after, a.nl-cta-big:hover::after { transform: translateX(10px); }
.nl-cta-big:hover a, a.nl-cta-big:hover {
	color: var(--nl-blueprint) !important;
	border-color: var(--nl-navy);
}

.nl-footer a {
	text-decoration: none;
	border-bottom: 1px solid rgba(46, 74, 107, 0.4);
	padding-bottom: 1px;
	transition: color 200ms var(--nl-ease), border-color 200ms var(--nl-ease);
}
.nl-footer a:hover { color: var(--nl-blueprint) !important; border-color: var(--nl-blueprint); }
.nl-colophon {
	font-family: var(--nl-mono);
	font-size: 10px;
	letter-spacing: 0.16em;
	text-transform: uppercase;
	color: var(--nl-graphite);
	line-height: 1.8;
	margin: clamp(1.5rem, 3vw, 2rem) 0 0 0;
	padding-top: 1rem;
	border-top: 1px solid rgba(139, 115, 85, 0.35);
}

hr, .wp-block-separator {
	border: none;
	border-top: 1px solid rgba(139, 115, 85, 0.3);
	margin-block: clamp(2rem, 4vw, 3.5rem);
	max-width: none;
	opacity: 1;
}

.nl-section { padding-block: var(--wp--preset--spacing--90); position: relative; }
.nl-section-tight { padding-block: clamp(2.5rem, 5vw, 4.5rem); }
.nl-bg-cream { background: var(--nl-cream); }
.nl-bg-cream-deep { background: var(--nl-cream-deep); }
.nl-bg-white { background: var(--nl-white); }

@media (prefers-reduced-motion: no-preference) {
	@supports (animation-timeline: view()) {
		main .nl-spec-tile,
		main .nl-sector-bar,
		main .nl-split,
		main .nl-cta-big {
			animation: nl-fade-up linear both;
			animation-timeline: view();
			animation-range: entry 0% cover 15%;
		}
	}
}
@keyframes nl-fade-up {
	from { opacity: 0; transform: translateY(28px); filter: blur(2px); }
	to   { opacity: 1; transform: translateY(0);    filter: blur(0);  }
}
main > .wp-block-cover:first-of-type,
main > .wp-block-group:first-of-type .wp-block-cover {
	animation: none !important;
	opacity: 1 !important;
	transform: none !important;
	filter: none !important;
}

body::before {
	content: "";
	position: fixed; inset: 0;
	pointer-events: none;
	background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='160' height='160'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='2' stitchTiles='stitch'/><feColorMatrix values='0 0 0 0 0.55 0 0 0 0 0.45 0 0 0 0 0.33 0 0 0 0.35 0'/></filter><rect width='160' height='160' filter='url(%23n)'/></svg>");
	opacity: 0.03;
	mix-blend-mode: multiply;
	z-index: 1;
}
main, header, footer { position: relative; z-index: 2; }

@media (prefers-reduced-motion: reduce) {
	*, *::before, *::after {
		animation-duration: 0.001ms !important;
		animation-iteration-count: 1 !important;
		transition-duration: 0.001ms !important;
	}
	html { scroll-behavior: auto; }
	.nl-hero { background-attachment: scroll; }
}
@media print {
	body::before { display: none; }
	body { background: white; color: black; }
	.nl-hero, .nl-header, .nl-footer { border: none; }
}
