/*
 * NSB Sinar, editorial-industrial system v2. Tokens and rules: /DESIGN.md
 * Z-index scale: header 60, whatsapp 50.
 */

/* ==========================================================================
   Tokens
   ========================================================================== */

:root {
	--ink: #0b0d12;
	--ink-2: #22262f;
	--muted: #5b6370;
	--paper: #fff;
	--surface: #f3f4f6;
	--line: #e2e3e7;
	--line-dark: rgba(255, 255, 255, 0.14);
	--accent: #ff5a1f;
	--accent-ink: #c33c0b;
	--on-ink-muted: #a8aebb;

	--section: clamp(5rem, 3rem + 7vw, 10rem);
	--section-tight: clamp(3.5rem, 2.5rem + 3vw, 5.5rem);
	--gutter: clamp(1.25rem, 3.5vw, 3rem);
	--measure: 62ch;
	--header-h: 80px;

	--ease: cubic-bezier(0.22, 1, 0.36, 1);
	--t-micro: 180ms;
	--t-ui: 400ms;
	--t-reveal: 800ms;
	--t-image: 1200ms;

	--font-display: "Clash Display", "Instrument Sans", system-ui, sans-serif;
	--ico-arrow: url("../icons/arrow-right.svg");
	--ico-check: url("../icons/check.svg");
}

.nsb-ico-television { --nsb-ico: url("../icons/television-simple.svg"); }
.nsb-ico-washer { --nsb-ico: url("../icons/washing-machine.svg"); }
.nsb-ico-fan { --nsb-ico: url("../icons/fan.svg"); }
.nsb-ico-lightbulb { --nsb-ico: url("../icons/lightbulb.svg"); }
.nsb-ico-plug { --nsb-ico: url("../icons/plug.svg"); }
.nsb-ico-cooking-pot { --nsb-ico: url("../icons/cooking-pot.svg"); }
.nsb-ico-hair-dryer { --nsb-ico: url("../icons/hair-dryer.svg"); }
.nsb-ico-battery { --nsb-ico: url("../icons/battery-charging.svg"); }
.nsb-ico-seal-check { --nsb-ico: url("../icons/seal-check.svg"); }
.nsb-ico-tag { --nsb-ico: url("../icons/tag.svg"); }
.nsb-ico-package { --nsb-ico: url("../icons/package.svg"); }
.nsb-ico-history { --nsb-ico: url("../icons/clock-counter-clockwise.svg"); }
.nsb-ico-lightning { --nsb-ico: url("../icons/lightning.svg"); }
.nsb-ico-headset { --nsb-ico: url("../icons/headset.svg"); }
.nsb-ico-warehouse { --nsb-ico: url("../icons/warehouse.svg"); }
.nsb-ico-storefront { --nsb-ico: url("../icons/storefront.svg"); }
.nsb-ico-briefcase { --nsb-ico: url("../icons/briefcase.svg"); }
.nsb-ico-truck { --nsb-ico: url("../icons/truck.svg"); }
.nsb-ico-wrench { --nsb-ico: url("../icons/wrench.svg"); }
.nsb-ico-handshake { --nsb-ico: url("../icons/handshake.svg"); }
.nsb-ico-buildings { --nsb-ico: url("../icons/buildings.svg"); }
.nsb-ico-drone { --nsb-ico: url("../icons/drone.svg"); }
.nsb-ico-cpu { --nsb-ico: url("../icons/cpu.svg"); }
.nsb-ico-circuitry { --nsb-ico: url("../icons/circuitry.svg"); }
.nsb-ico-wifi { --nsb-ico: url("../icons/wifi-high.svg"); }
.nsb-ico-power-charging { --nsb-ico: url("../icons/plug-charging.svg"); }
.nsb-ico-monitor { --nsb-ico: url("../icons/monitor.svg"); }

/* ==========================================================================
   Base
   ========================================================================== */

html {
	scroll-behavior: smooth;
	scroll-padding-top: calc(var(--header-h) + 24px);
}

/* Anchored sections must clear the sticky header, even after late layout shifts. */
.nsb-main [id] {
	scroll-margin-top: calc(var(--header-h) + 24px);
}

body {
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
	overflow-x: hidden;
}

:where(.wp-site-blocks) > * {
	margin-block-start: 0;
}

.nsb-main .wp-block-post-content > .alignfull {
	margin-block: 0;
}

h1, h2, h3, h4 {
	text-wrap: balance;
}

p, li {
	text-wrap: pretty;
}

::selection {
	background: var(--accent);
	color: #fff;
}

:focus-visible {
	outline: 2px solid var(--ink);
	outline-offset: 3px;
}

.nsb-hero :focus-visible,
.nsb-footer :focus-visible {
	outline-color: #fff;
}

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

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

/* ==========================================================================
   Type helpers
   ========================================================================== */

.nsb-hero-type {
	font-family: var(--font-display) !important;
	font-size: clamp(3rem, 1.6rem + 6vw, 7rem) !important;
	font-weight: 600 !important;
	line-height: 0.95 !important;
	letter-spacing: -0.035em !important;
}

.nsb-display-2 {
	font-size: clamp(1.75rem, 1.35rem + 1.8vw, 2.75rem) !important;
	line-height: 1.05 !important;
	letter-spacing: -0.025em !important;
}

.nsb-mega {
	font-family: var(--font-display);
	font-size: clamp(5rem, 2rem + 13vw, 14rem);
	font-weight: 600;
	line-height: 0.8;
	letter-spacing: -0.05em;
	font-variant-numeric: tabular-nums;
	margin: 0;
}

.nsb-label {
	display: flex;
	align-items: center;
	gap: 0.75rem;
	margin: 0 0 1.5rem;
	font-size: 0.75rem;
	font-weight: 500;
	line-height: 1;
	letter-spacing: 0.14em;
	text-transform: uppercase;
	color: var(--muted);
}

.nsb-label::before {
	content: "";
	width: 24px;
	height: 2px;
	background: var(--accent);
	flex: none;
}

.nsb-tag {
	display: inline-flex;
	align-items: center;
	gap: 0.5rem;
	margin: 0 0 1.25rem;
	padding: 0.4rem 0.85rem;
	border: 1px solid var(--line);
	border-radius: 999px;
	font-size: 0.8125rem;
	font-weight: 500;
	line-height: 1.2;
	color: var(--ink-2);
	width: fit-content;
}

.nsb-tag::before {
	content: "";
	width: 6px;
	height: 6px;
	border-radius: 50%;
	background: var(--accent);
	flex: none;
}

.nsb-lead {
	max-width: 52ch;
	font-size: clamp(1.0625rem, 1rem + 0.35vw, 1.3125rem);
	line-height: 1.5;
	color: var(--ink-2);
}

.nsb-muted {
	color: var(--muted);
}

.nsb-prose p,
.nsb-prose li {
	max-width: var(--measure);
	color: var(--ink-2);
}

/* ==========================================================================
   Buttons and links
   ========================================================================== */

.wp-element-button,
.wp-block-button__link {
	position: relative;
	display: inline-flex;
	align-items: center;
	gap: 0.6rem;
	min-height: 52px;
	white-space: nowrap;
	transition: background-color var(--t-ui) var(--ease), color var(--t-ui) var(--ease),
		transform var(--t-micro) var(--ease), box-shadow var(--t-ui) var(--ease);
}

.wp-block-button__link::after {
	content: "";
	width: 1.05em;
	height: 1.05em;
	background: currentColor;
	-webkit-mask: var(--ico-arrow) center / contain no-repeat;
	mask: var(--ico-arrow) center / contain no-repeat;
	transition: transform var(--t-ui) var(--ease);
}

.wp-block-button__link:hover {
	transform: translateY(-1px);
}

.wp-block-button__link:hover::after {
	transform: translateX(4px);
}

.wp-block-button__link:active {
	transform: translateY(0);
}

.nsb-btn-ghost .wp-block-button__link {
	background: transparent;
	color: var(--ink);
	box-shadow: inset 0 0 0 1px var(--ink);
}

.nsb-btn-ghost .wp-block-button__link:hover,
.nsb-btn-ghost .wp-block-button__link:focus {
	background: var(--ink);
	color: var(--paper);
}

.nsb-hero .nsb-btn-ghost .wp-block-button__link {
	color: #fff;
	box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.6);
}

.nsb-hero .nsb-btn-ghost .wp-block-button__link:hover,
.nsb-hero .nsb-btn-ghost .wp-block-button__link:focus {
	background: #fff;
	color: var(--ink);
}

.wp-block-buttons {
	gap: 0.75rem;
}

/* Text link with sweeping accent underline */
.nsb-link {
	margin-block-start: 1.25rem !important;
}

.nsb-link a,
a.nsb-link-inline {
	display: inline-flex;
	align-items: center;
	gap: 0.5rem;
	padding-bottom: 3px;
	font-weight: 600;
	color: var(--ink);
	text-decoration: none;
	background-image: linear-gradient(var(--accent), var(--accent));
	background-repeat: no-repeat;
	background-position: 0 100%;
	background-size: 0 2px;
	transition: background-size var(--t-ui) var(--ease);
}

.nsb-link a::after,
a.nsb-link-inline::after {
	content: "";
	width: 1em;
	height: 1em;
	background: currentColor;
	-webkit-mask: var(--ico-arrow) center / contain no-repeat;
	mask: var(--ico-arrow) center / contain no-repeat;
	transition: transform var(--t-ui) var(--ease);
}

.nsb-link a:hover,
a.nsb-link-inline:hover {
	background-size: 100% 2px;
}

.nsb-link a:hover::after,
a.nsb-link-inline:hover::after {
	transform: translateX(4px);
}

.nsb-prose a:not(.wp-element-button) {
	color: var(--ink);
	text-decoration: underline;
	text-decoration-color: var(--accent);
	text-decoration-thickness: 2px;
	text-underline-offset: 3px;
}

/* ==========================================================================
   Motion
   ========================================================================== */

/* Hidden only once JavaScript has confirmed it can reveal them again. */
.nsb-js .nsb-reveal {
	opacity: 0;
	transform: translateY(28px);
	transition: opacity var(--t-reveal) var(--ease), transform var(--t-reveal) var(--ease);
	transition-delay: calc(var(--i, 0) * 80ms);
}

.nsb-js .nsb-reveal.is-in {
	opacity: 1;
	transform: none;
}

/* ==========================================================================
   Header
   ========================================================================== */

.nsb-site-header {
	position: fixed;
	top: 0;
	left: 0;
	right: 0;
	z-index: 60;
	color: var(--ink);
	transition: background-color var(--t-ui) var(--ease), box-shadow var(--t-ui) var(--ease),
		color var(--t-ui) var(--ease);
}

.admin-bar .nsb-site-header {
	top: var(--wp-admin--admin-bar--height, 0px);
}

body.nsb-has-hero .nsb-site-header:not(.is-stuck) {
	color: #fff;
}

/* Over photography the header CTA inverts so it stays a visible pill. */
body.nsb-has-hero .nsb-site-header:not(.is-stuck) .nsb-header__cta .wp-block-button__link {
	background: #fff;
	color: var(--ink);
}

body.nsb-has-hero .nsb-site-header:not(.is-stuck) .nsb-header__cta .wp-block-button__link:hover {
	background: var(--accent);
	color: #fff;
}

/*
 * The frosted backdrop lives on a pseudo-element on purpose: backdrop-filter on the
 * header itself would make it the containing block for its fixed-position children,
 * which collapses the mobile navigation overlay into the 80px header strip.
 */
.nsb-site-header::before {
	content: "";
	position: absolute;
	inset: 0;
	z-index: -1;
	opacity: 0;
	background: rgba(255, 255, 255, 0.92);
	backdrop-filter: saturate(1.4) blur(12px);
	-webkit-backdrop-filter: saturate(1.4) blur(12px);
	box-shadow: inset 0 -1px 0 var(--line);
	transition: opacity var(--t-ui) var(--ease);
	pointer-events: none;
}

.nsb-site-header.is-stuck::before,
body:not(.nsb-has-hero) .nsb-site-header::before {
	opacity: 1;
}

.nsb-header {
	padding-block: 0;
}

.nsb-header__inner {
	min-height: var(--header-h);
	gap: 2rem;
}

.nsb-header__actions {
	gap: 2.5rem;
}

.nsb-wordmark {
	display: inline-flex;
	align-items: flex-end;
	padding-block: 0.75rem;
	gap: 0.3em;
	font-family: var(--font-display);
	font-size: 1.35rem;
	font-weight: 600;
	line-height: 1;
	letter-spacing: -0.01em;
	text-transform: uppercase;
	color: inherit;
	text-decoration: none;
	white-space: nowrap;
}

.nsb-wordmark::after {
	content: "";
	width: 7px;
	height: 7px;
	background: var(--accent);
	margin-bottom: 0.15em;
	flex: none;
}

.nsb-wordmark:hover {
	color: inherit;
}

.nsb-wordmark__light {
	font-weight: 500;
	opacity: 0.78;
}

.nsb-nav {
	font-size: 0.9375rem;
	font-weight: 500;
}

.nsb-nav .wp-block-navigation__container {
	gap: 2.25rem;
}

.nsb-nav .wp-block-navigation-item__content {
	position: relative;
	color: inherit;
	text-decoration: none;
	padding-block: 0.35rem;
}

.nsb-nav .wp-block-navigation-item__content::after {
	content: "";
	position: absolute;
	left: 0;
	bottom: 0;
	width: 100%;
	height: 2px;
	background: var(--accent);
	transform: scaleX(0);
	transform-origin: left;
	transition: transform var(--t-ui) var(--ease);
}

.nsb-nav .wp-block-navigation-item__content:hover::after,
.nsb-nav .current-menu-item > .wp-block-navigation-item__content::after {
	transform: scaleX(1);
}

.nsb-nav .wp-block-navigation__responsive-container-open,
.nsb-nav .wp-block-navigation__responsive-container-close {
	width: 44px;
	height: 44px;
	align-items: center;
	justify-content: center;
	color: inherit;
}

/*
 * Core ships `.wp-block-navigation:not(.has-background) ... .is-menu-open {background:#fff}`
 * at a higher specificity than a theme class, which left white links on a white
 * overlay. These two declarations deliberately override that default.
 */
.nsb-nav .wp-block-navigation__responsive-container.is-menu-open {
	padding: 1.25rem var(--gutter) 2rem;
	background-color: var(--ink) !important;
	color: #fff !important;
}

.nsb-nav .is-menu-open .wp-block-navigation__responsive-container-content {
	padding-top: 5rem;
	align-items: stretch;
}

.nsb-nav .is-menu-open .wp-block-navigation__container {
	gap: 0;
	width: 100%;
}

.nsb-nav .is-menu-open .wp-block-navigation-item {
	width: 100%;
	border-bottom: 1px solid var(--line-dark);
}

.nsb-nav .is-menu-open .wp-block-navigation__responsive-container-close {
	color: #fff;
}

.nsb-nav .is-menu-open .wp-block-navigation-item__content {
	display: block;
	width: 100%;
	padding-block: 1.1rem !important;
	font-family: var(--font-display);
	font-size: 2rem;
	font-weight: 600;
	letter-spacing: -0.02em;
	color: #fff;
}

.nsb-nav .is-menu-open .wp-block-navigation-item__content::after {
	display: none;
}

@media (max-width: 599px) {
	.nsb-header .nsb-header__cta {
		display: none !important;
	}
}

/* ==========================================================================
   Sections
   ========================================================================== */

.nsb-section {
	padding-block: var(--section);
}

.nsb-section--tight {
	padding-block: var(--section-tight);
}

.nsb-band {
	background: var(--surface);
}

.nsb-head {
	max-width: 46rem;
	margin-bottom: clamp(2.5rem, 2rem + 3vw, 4.5rem);
}

.nsb-head > * {
	margin-block: 0;
}

.nsb-head > * + * {
	margin-block-start: 1.25rem;
}

.nsb-head--split {
	display: grid;
	grid-template-columns: minmax(0, 1fr) minmax(0, 0.7fr);
	align-items: end;
	gap: 2rem 4rem;
	max-width: none;
}

.nsb-head--split > * {
	margin-block: 0 !important;
}

.nsb-head--split .nsb-head__text > * {
	margin-block: 0;
}

.nsb-head--split .nsb-head__text > * + * {
	margin-block-start: 1.25rem;
}

.nsb-head--split .nsb-head__aside {
	justify-self: end;
}

@media (max-width: 899px) {
	.nsb-head--split {
		grid-template-columns: minmax(0, 1fr);
		align-items: start;
	}

	.nsb-head--split .nsb-head__aside {
		justify-self: start;
	}
}

/* ==========================================================================
   Home hero
   ========================================================================== */

.nsb-hero {
	position: relative;
	display: flex;
	align-items: flex-end;
	min-height: min(100svh, 920px);
	padding-block: calc(var(--header-h) + 3rem) clamp(3rem, 3vw + 2rem, 5.5rem);
	overflow: clip;
	color: #fff;
	background: var(--ink);
	isolation: isolate;
}

.nsb-hero__media {
	position: absolute;
	inset: 0;
	z-index: -2;
	margin: 0 !important;
	max-width: none !important;
	width: 100%;
}

.nsb-hero__media img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	filter: saturate(0.7) contrast(1.05) brightness(0.9);
	animation: nsb-hero-zoom 1800ms var(--ease) both;
}

@keyframes nsb-hero-zoom {
	from { transform: scale(1.08); }
	to { transform: scale(1); }
}

.nsb-hero::after {
	content: "";
	position: absolute;
	inset: 0;
	z-index: -1;
	background:
		linear-gradient(to top, rgba(11, 13, 18, 0.92) 0%, rgba(11, 13, 18, 0.55) 40%, rgba(11, 13, 18, 0.2) 72%),
		linear-gradient(to right, rgba(11, 13, 18, 0.65) 0%, rgba(11, 13, 18, 0) 58%);
}

.nsb-hero__inner > * {
	margin-block: 0;
}

.nsb-hero .nsb-label {
	margin-bottom: 1.5rem;
	color: rgba(255, 255, 255, 0.85);
}

.nsb-hero h1 {
	color: #fff;
	max-width: 16ch;
}

.nsb-hero__grid {
	display: grid;
	grid-template-columns: minmax(0, 1.25fr) minmax(0, 1fr);
	align-items: end;
	gap: 2.5rem 4rem;
	margin-top: clamp(2rem, 1.5rem + 2vw, 3.5rem) !important;
}

.nsb-hero__grid > * {
	margin: 0 !important;
}

.nsb-hero__grid p {
	color: rgba(255, 255, 255, 0.86);
	font-size: clamp(1.0625rem, 1rem + 0.35vw, 1.25rem);
	line-height: 1.5;
	max-width: 46ch;
}

.nsb-hero .wp-block-button:not(.nsb-btn-ghost) .wp-block-button__link {
	background: #fff;
	color: var(--ink);
}

.nsb-hero .wp-block-button:not(.nsb-btn-ghost) .wp-block-button__link:hover {
	background: var(--accent);
	color: #fff;
}

@media (max-width: 899px) {
	.nsb-hero {
		min-height: min(100svh, 760px);
	}

	.nsb-hero__grid {
		grid-template-columns: minmax(0, 1fr);
		gap: 1.75rem;
	}
}

/* ==========================================================================
   Marquee
   ========================================================================== */

.nsb-marquee {
	overflow: hidden;
	border-bottom: 1px solid var(--line);
	padding-block: 1.15rem;
	background: var(--paper);
}

.nsb-marquee__track {
	display: flex;
	width: max-content;
	gap: 3rem;
	animation: nsb-marquee 40s linear infinite;
}

.nsb-marquee:hover .nsb-marquee__track {
	animation-play-state: paused;
}

.nsb-marquee__item {
	display: inline-flex;
	align-items: center;
	gap: 3rem;
	font-family: var(--font-display);
	font-size: clamp(1rem, 0.9rem + 0.4vw, 1.25rem);
	font-weight: 500;
	letter-spacing: -0.01em;
	color: var(--ink);
	white-space: nowrap;
}

.nsb-marquee__item::after {
	content: "";
	width: 7px;
	height: 7px;
	background: var(--accent);
	flex: none;
}

@keyframes nsb-marquee {
	from { transform: translateX(0); }
	to { transform: translateX(-50%); }
}

/* ==========================================================================
   Capability bento
   ========================================================================== */

.nsb-bento {
	display: grid;
	grid-template-columns: repeat(12, minmax(0, 1fr));
	gap: 1px;
	background: var(--line);
	border: 1px solid var(--line);
}

.nsb-bento > * {
	margin: 0 !important;
}

.nsb-cell {
	position: relative;
	display: flex;
	flex-direction: column;
	justify-content: space-between;
	gap: 2.5rem;
	min-height: 15rem;
	padding: clamp(1.5rem, 1rem + 1.5vw, 2.5rem);
	background: var(--paper);
	transition: background-color var(--t-ui) var(--ease);
}

.nsb-cell > * {
	margin: 0;
}

.nsb-cell:hover {
	background: var(--surface);
}

.nsb-cell__icon {
	width: 2rem;
	height: 2rem;
	flex: none;
	background: var(--ink);
	-webkit-mask: var(--nsb-ico) center / contain no-repeat;
	mask: var(--nsb-ico) center / contain no-repeat;
	transition: background-color var(--t-ui) var(--ease), transform var(--t-ui) var(--ease);
}

.nsb-cell:hover .nsb-cell__icon {
	background: var(--accent);
	transform: translateY(-2px);
}

.nsb-cell__body > * {
	margin: 0;
}

.nsb-cell__body p {
	margin-top: 0.5rem;
	color: var(--muted);
	font-size: 0.9375rem;
	line-height: 1.55;
}

.nsb-cell h3 a {
	color: inherit;
	text-decoration: none;
}

.nsb-cell h3 a::after {
	content: "";
	position: absolute;
	inset: 0;
}

.nsb-cell--span-3 { grid-column: span 3; }
.nsb-cell--span-4 { grid-column: span 4; }
.nsb-cell--span-5 { grid-column: span 5; }
.nsb-cell--span-6 { grid-column: span 6; }
.nsb-cell--span-7 { grid-column: span 7; }
.nsb-cell--span-8 { grid-column: span 8; }

.nsb-cell--photo {
	justify-content: flex-end;
	min-height: 27rem;
	padding: 0;
	overflow: hidden;
	background: var(--ink);
	color: #fff;
}

.nsb-cell--photo:hover {
	background: var(--ink);
}

.nsb-cell__img {
	position: absolute;
	inset: 0;
	margin: 0;
}

.nsb-cell__img img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	filter: saturate(0.8) contrast(1.03);
	transition: transform var(--t-image) var(--ease);
}

.nsb-cell--photo:hover .nsb-cell__img img {
	transform: scale(1.04);
}

.nsb-cell--photo .nsb-cell__body {
	position: relative;
	z-index: 2;
	padding: clamp(1.5rem, 1rem + 1.5vw, 2.5rem);
	background: linear-gradient(to top, rgba(11, 13, 18, 0.9), rgba(11, 13, 18, 0));
}

.nsb-cell--photo h3 {
	font-family: var(--font-display);
	font-size: clamp(1.5rem, 1.2rem + 1vw, 2rem);
	font-weight: 600;
	letter-spacing: -0.02em;
	color: #fff;
}

.nsb-cell--photo p {
	color: rgba(255, 255, 255, 0.84);
}

@media (max-width: 1023px) {
	.nsb-bento {
		grid-template-columns: repeat(6, minmax(0, 1fr));
	}

	.nsb-cell--span-3,
	.nsb-cell--span-4,
	.nsb-cell--span-5,
	.nsb-cell--span-7,
	.nsb-cell--span-8 { grid-column: span 3; }

	.nsb-cell--span-6 { grid-column: span 6; }
}

@media (max-width: 599px) {
	.nsb-bento {
		grid-template-columns: minmax(0, 1fr);
	}

	.nsb-cell,
	.nsb-cell--span-3,
	.nsb-cell--span-4,
	.nsb-cell--span-5,
	.nsb-cell--span-6,
	.nsb-cell--span-7,
	.nsb-cell--span-8 {
		grid-column: auto;
		min-height: 0;
		gap: 1.75rem;
	}

	.nsb-cell--photo {
		min-height: 20rem;
	}
}

/* ==========================================================================
   Two tracks
   ========================================================================== */

.nsb-tracks {
	display: grid;
	grid-template-columns: minmax(0, 0.8fr) minmax(0, 1.4fr);
	gap: clamp(2rem, 1rem + 5vw, 6rem);
}

.nsb-tracks > * {
	margin: 0 !important;
}

.nsb-tracks__head > * {
	margin-block: 0;
}

.nsb-tracks__head > * + * {
	margin-block-start: 1.25rem;
}

@media (min-width: 900px) {
	.nsb-tracks__head {
		position: sticky;
		top: calc(var(--header-h) + 3rem);
		align-self: start;
	}
}

.nsb-track {
	display: grid;
	grid-template-columns: minmax(0, 0.85fr) minmax(0, 1fr);
	align-items: center;
	gap: clamp(1.5rem, 1rem + 2vw, 3rem);
	padding-block: clamp(2rem, 1.5rem + 2vw, 3.5rem);
	border-top: 1px solid var(--line);
}

.nsb-tracks__list > *:last-child {
	border-bottom: 1px solid var(--line);
}

.nsb-track > * {
	margin: 0;
}

.nsb-track__media {
	overflow: hidden;
	margin: 0;
}

.nsb-track__media img {
	display: block;
	width: 100%;
	aspect-ratio: 4 / 3;
	object-fit: cover;
	filter: saturate(0.82) contrast(1.02);
	transition: transform var(--t-image) var(--ease);
}

.nsb-track:hover .nsb-track__media img {
	transform: scale(1.04);
}

.nsb-track__body > * {
	margin: 0;
}

.nsb-track__body h3 {
	font-family: var(--font-display);
	font-size: clamp(1.5rem, 1.25rem + 1vw, 2.25rem);
	font-weight: 600;
	letter-spacing: -0.02em;
}

.nsb-track__body p {
	margin-top: 0.75rem;
	color: var(--ink-2);
	max-width: 46ch;
}

@media (max-width: 899px) {
	.nsb-tracks,
	.nsb-track {
		grid-template-columns: minmax(0, 1fr);
	}
}

/* ==========================================================================
   Counters
   ========================================================================== */

.nsb-counters {
	display: grid;
	grid-template-columns: repeat(4, minmax(0, 1fr));
	gap: 1px;
	background: var(--line);
	border-block: 1px solid var(--line);
}

.nsb-counters > * {
	margin: 0 !important;
}

.nsb-counter {
	padding: clamp(1.75rem, 1.25rem + 1.5vw, 2.75rem) clamp(1.25rem, 1rem + 1vw, 2rem);
	background: var(--surface);
}

.nsb-counter > * {
	margin: 0;
}

.nsb-counter__value {
	font-family: var(--font-display);
	font-size: clamp(2.5rem, 1.8rem + 2.6vw, 4rem);
	font-weight: 600;
	line-height: 1;
	letter-spacing: -0.03em;
	font-variant-numeric: tabular-nums;
	color: var(--ink);
}

.nsb-counter__label {
	margin-top: 0.85rem !important;
	font-size: 0.9375rem;
	line-height: 1.5;
	color: var(--muted);
}

@media (max-width: 899px) {
	.nsb-counters {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}
}

/* ==========================================================================
   CTA slab
   ========================================================================== */

.nsb-cta {
	display: grid;
	grid-template-columns: minmax(0, 1.4fr) minmax(0, 0.8fr);
	align-items: end;
	gap: 2.5rem 4rem;
}

.nsb-cta > * {
	margin: 0 !important;
}

.nsb-cta__text > * {
	margin-block: 0;
}

.nsb-cta__text > * + * {
	margin-block-start: 1.25rem;
}

.nsb-cta__actions {
	justify-self: end;
}

@media (max-width: 899px) {
	.nsb-cta {
		grid-template-columns: minmax(0, 1fr);
		align-items: start;
	}

	.nsb-cta__actions {
		justify-self: start;
	}
}

/* ==========================================================================
   Inner page opener
   ========================================================================== */

.nsb-opener {
	padding-block: calc(var(--header-h) + clamp(3rem, 2rem + 4vw, 6rem)) var(--section-tight);
	border-bottom: 1px solid var(--line);
}

.nsb-opener__grid {
	display: grid;
	grid-template-columns: minmax(0, 1.25fr) minmax(0, 1fr);
	align-items: end;
	gap: 2rem 4rem;
}

.nsb-opener__grid > * {
	margin: 0 !important;
}

.nsb-opener__grid > * > * {
	margin-block: 0;
}

.nsb-opener__grid > * > * + * {
	margin-block-start: 1.25rem;
}

.nsb-opener h1 {
	max-width: 15ch;
}

@media (max-width: 899px) {
	.nsb-opener__grid {
		grid-template-columns: minmax(0, 1fr);
	}
}

/* ==========================================================================
   About
   ========================================================================== */

.nsb-story {
	display: grid;
	grid-template-columns: minmax(0, 0.9fr) minmax(0, 1.3fr);
	gap: clamp(2rem, 1rem + 5vw, 6rem);
}

.nsb-story > * {
	margin: 0 !important;
}

.nsb-story__aside > * {
	margin-block: 0;
}

.nsb-story__aside > * + * {
	margin-block-start: 1.5rem;
}

@media (min-width: 900px) {
	.nsb-story__aside {
		position: sticky;
		top: calc(var(--header-h) + 3rem);
		align-self: start;
	}
}

.nsb-story__text > * {
	margin-block: 0;
	max-width: var(--measure);
	color: var(--ink-2);
}

.nsb-story__text > * + * {
	margin-block-start: 1.5rem;
}

.nsb-story__text > p:first-child {
	font-size: clamp(1.25rem, 1.1rem + 0.8vw, 1.75rem);
	line-height: 1.35;
	letter-spacing: -0.015em;
	color: var(--ink);
}

@media (max-width: 899px) {
	.nsb-story {
		grid-template-columns: minmax(0, 1fr);
	}
}

.nsb-figure {
	margin: 0 !important;
	overflow: hidden;
}

/* True edge-to-edge: cancel the root padding that alignfull keeps. */
.nsb-figure.alignfull {
	margin-left: calc(-1 * var(--wp--style--root--padding-left, var(--gutter))) !important;
	margin-right: calc(-1 * var(--wp--style--root--padding-right, var(--gutter))) !important;
	max-width: none !important;
	width: auto !important;
}

.nsb-figure img {
	display: block;
	width: 100%;
	aspect-ratio: 21 / 9;
	object-fit: cover;
	filter: saturate(0.7) contrast(1.03);
}

@media (max-width: 599px) {
	.nsb-figure img {
		aspect-ratio: 3 / 2;
	}
}

.nsb-rows {
	border-bottom: 1px solid var(--line);
}

.nsb-rows > * {
	margin: 0 !important;
}

.nsb-row {
	display: grid;
	grid-template-columns: minmax(0, 0.55fr) minmax(0, 1fr);
	gap: 1rem clamp(1.5rem, 1rem + 3vw, 4rem);
	padding-block: clamp(1.5rem, 1.25rem + 1vw, 2.25rem);
	border-top: 1px solid var(--line);
}

.nsb-row > * {
	margin: 0;
}

.nsb-row h3 {
	font-family: var(--font-display);
	font-size: clamp(1.25rem, 1.1rem + 0.6vw, 1.625rem);
	font-weight: 600;
	letter-spacing: -0.02em;
}

.nsb-row p {
	color: var(--ink-2);
	max-width: 54ch;
}

@media (max-width: 767px) {
	.nsb-row {
		grid-template-columns: minmax(0, 1fr);
		gap: 0.5rem;
	}
}

.nsb-sheet {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 0 clamp(2rem, 1rem + 4vw, 5rem);
	border-top: 1px solid var(--line);
}

.nsb-sheet > * {
	margin: 0 !important;
}

.nsb-sheet__item {
	display: grid;
	grid-template-columns: minmax(0, 0.7fr) minmax(0, 1fr);
	gap: 1rem;
	padding-block: 1.35rem;
	border-bottom: 1px solid var(--line);
}

.nsb-sheet__item > * {
	margin: 0;
}

.nsb-sheet__k {
	font-size: 0.8125rem;
	font-weight: 500;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	color: var(--muted);
	line-height: 1.6;
}

.nsb-sheet__v {
	font-size: 1.0625rem;
	font-weight: 500;
	color: var(--ink);
	font-variant-numeric: tabular-nums;
}

@media (max-width: 899px) {
	.nsb-sheet {
		grid-template-columns: minmax(0, 1fr);
	}
}

@media (max-width: 479px) {
	.nsb-sheet__item {
		grid-template-columns: minmax(0, 1fr);
		gap: 0.35rem;
	}
}

/* ==========================================================================
   Products index
   ========================================================================== */

.nsb-index {
	border-bottom: 1px solid var(--line);
}

.nsb-index > * {
	margin: 0 !important;
}

.nsb-index__row {
	position: relative;
	display: grid;
	grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) 2.5rem;
	align-items: center;
	gap: 1rem clamp(1.5rem, 1rem + 3vw, 4rem);
	padding: clamp(1.5rem, 1.25rem + 1vw, 2.25rem) 0;
	border-top: 1px solid var(--line);
	transition: padding var(--t-ui) var(--ease), background-color var(--t-ui) var(--ease);
}

.nsb-index__row > * {
	margin: 0;
}

.nsb-index__row h2,
.nsb-index__row h3 {
	font-family: var(--font-display);
	font-size: clamp(1.5rem, 1.15rem + 1.6vw, 2.5rem);
	font-weight: 600;
	line-height: 1.05;
	letter-spacing: -0.03em;
	transition: transform var(--t-ui) var(--ease);
}

.nsb-index__row h2 a,
.nsb-index__row h3 a {
	color: inherit;
	text-decoration: none;
}

.nsb-index__row h2 a::after,
.nsb-index__row h3 a::after {
	content: "";
	position: absolute;
	inset: 0;
}

.nsb-index__row p {
	color: var(--muted);
	max-width: 46ch;
}

.nsb-index__row::after {
	content: "";
	justify-self: end;
	width: 1.5rem;
	height: 1.5rem;
	background: var(--ink);
	-webkit-mask: var(--ico-arrow) center / contain no-repeat;
	mask: var(--ico-arrow) center / contain no-repeat;
	opacity: 0.3;
	transition: opacity var(--t-ui) var(--ease), transform var(--t-ui) var(--ease),
		background-color var(--t-ui) var(--ease);
}

.nsb-index__row:hover {
	background: var(--surface);
	padding-inline: clamp(0.75rem, 1vw, 1.5rem);
}

.nsb-index__row:hover h2,
.nsb-index__row:hover h3 {
	transform: translateX(6px);
}

.nsb-index__row:hover::after {
	opacity: 1;
	background: var(--accent);
	transform: translateX(6px);
}

@media (max-width: 767px) {
	.nsb-index__row {
		grid-template-columns: minmax(0, 1fr) 1.5rem;
	}

	.nsb-index__row p {
		grid-column: 1;
	}

	/* Keep the arrow beside the row instead of stranding it under the text. */
	.nsb-index__row::after {
		grid-column: 2;
		grid-row: 1 / -1;
		align-self: center;
	}
}

/* Photo strip */
.nsb-strip {
	display: grid;
	grid-template-columns: repeat(4, minmax(0, 1fr));
	gap: 1.25rem;
}

.nsb-strip > * {
	margin: 0 !important;
}

.nsb-strip__item > * {
	margin: 0;
}

.nsb-strip__item figure {
	margin: 0;
	overflow: hidden;
}

.nsb-strip__item img {
	display: block;
	width: 100%;
	aspect-ratio: 3 / 4;
	object-fit: cover;
	filter: saturate(0.82) contrast(1.02);
	transition: transform var(--t-image) var(--ease);
}

.nsb-strip__item:hover img {
	transform: scale(1.05);
}

.nsb-strip__item p {
	margin-top: 0.9rem !important;
	font-size: 0.8125rem;
	font-weight: 500;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	color: var(--muted);
}

@media (max-width: 899px) {
	.nsb-strip {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}
}

/* ==========================================================================
   Services
   ========================================================================== */

.nsb-stack {
	display: flex;
	flex-direction: column;
	gap: 1.5rem;
}

.nsb-stack > * {
	margin: 0 !important;
}

.nsb-panel {
	display: grid;
	grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
	gap: clamp(1.5rem, 1rem + 3vw, 4rem);
	padding: clamp(1.5rem, 1rem + 2vw, 3rem);
	background: var(--paper);
	border: 1px solid var(--line);
}

.nsb-panel > * {
	margin: 0;
}

@media (min-width: 900px) {
	.nsb-panel {
		position: sticky;
		top: calc(var(--header-h) + 2rem);
	}

	.nsb-stack > *:nth-child(2) { top: calc(var(--header-h) + 3.5rem); }
	.nsb-stack > *:nth-child(3) { top: calc(var(--header-h) + 5rem); }
}

.nsb-panel__media {
	overflow: hidden;
	align-self: stretch;
	margin: 0;
}

.nsb-panel__media img {
	display: block;
	width: 100%;
	height: 100%;
	min-height: 19rem;
	object-fit: cover;
	filter: saturate(0.82) contrast(1.02);
	transition: transform var(--t-image) var(--ease);
}

.nsb-panel:hover .nsb-panel__media img {
	transform: scale(1.03);
}

.nsb-panel__body > * {
	margin-block: 0;
}

.nsb-panel__body > * + * {
	margin-block-start: 1.25rem;
}

.nsb-panel__body h2 {
	font-size: clamp(1.75rem, 1.4rem + 1.4vw, 2.5rem);
}

.nsb-panel--flip .nsb-panel__media {
	order: 2;
}

@media (max-width: 899px) {
	.nsb-panel {
		grid-template-columns: minmax(0, 1fr);
	}

	.nsb-panel--flip .nsb-panel__media {
		order: 0;
	}
}

.nsb-checklist {
	list-style: none;
	padding: 0;
	margin: 0;
}

.nsb-checklist li {
	position: relative;
	padding-left: 1.85rem;
	margin: 0;
	color: var(--ink-2);
}

.nsb-checklist li + li {
	margin-top: 0.65rem;
}

.nsb-checklist li::before {
	content: "";
	position: absolute;
	left: 0;
	top: 0.25em;
	width: 1.1rem;
	height: 1.1rem;
	background: var(--accent);
	-webkit-mask: var(--ico-check) center / contain no-repeat;
	mask: var(--ico-check) center / contain no-repeat;
}

/* Steps */
.nsb-steps > * {
	margin: 0 !important;
}

.nsb-step {
	position: relative;
	display: grid;
	grid-template-columns: minmax(0, 0.5fr) minmax(0, 1fr);
	gap: 1rem clamp(1.5rem, 1rem + 3vw, 4rem);
	padding: clamp(1.5rem, 1.25rem + 1vw, 2.25rem) 0 clamp(1.5rem, 1.25rem + 1vw, 2.25rem) 2.5rem;
	border-top: 1px solid var(--line);
}

.nsb-steps > *:last-child {
	border-bottom: 1px solid var(--line);
}

.nsb-step > * {
	margin: 0;
}

.nsb-step::before {
	content: "";
	position: absolute;
	left: 0;
	top: calc(clamp(1.5rem, 1.25rem + 1vw, 2.25rem) + 0.4em);
	width: 10px;
	height: 10px;
	background: var(--accent);
	border-radius: 50%;
}

.nsb-step::after {
	content: "";
	position: absolute;
	left: 4px;
	top: calc(clamp(1.5rem, 1.25rem + 1vw, 2.25rem) + 1.6em);
	bottom: 0;
	width: 1px;
	background: var(--line);
}

.nsb-steps > *:last-child::after {
	display: none;
}

.nsb-step h3 {
	font-family: var(--font-display);
	font-size: clamp(1.25rem, 1.1rem + 0.6vw, 1.625rem);
	font-weight: 600;
	letter-spacing: -0.02em;
}

.nsb-step p {
	color: var(--ink-2);
	max-width: 52ch;
}

@media (max-width: 767px) {
	.nsb-step {
		grid-template-columns: minmax(0, 1fr);
		gap: 0.5rem;
	}
}

/* Questions */
.nsb-qa {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 0 clamp(2rem, 1rem + 4vw, 5rem);
	border-top: 1px solid var(--line);
}

.nsb-qa > * {
	margin: 0 !important;
}

.nsb-qa__item {
	padding-block: clamp(1.5rem, 1.25rem + 1vw, 2rem);
	border-bottom: 1px solid var(--line);
}

.nsb-qa__item > * {
	margin: 0;
}

.nsb-qa__item h3 {
	font-size: 1.125rem;
}

.nsb-qa__item p {
	margin-top: 0.6rem;
	color: var(--muted);
	max-width: 52ch;
}

@media (max-width: 767px) {
	.nsb-qa {
		grid-template-columns: minmax(0, 1fr);
	}
}


/* ==========================================================================
   Statement (large editorial paragraph)
   ========================================================================== */

.nsb-statement {
	display: grid;
	grid-template-columns: minmax(0, 0.35fr) minmax(0, 1fr);
	gap: clamp(1.5rem, 1rem + 4vw, 5rem);
	align-items: start;
}

.nsb-statement > * {
	margin: 0 !important;
}

.nsb-statement__body > * {
	margin-block: 0;
}

.nsb-statement__body > * + * {
	margin-block-start: 1.5rem;
}

.nsb-statement__body > p:first-child {
	font-family: var(--font-display);
	font-size: clamp(1.5rem, 1.1rem + 1.8vw, 2.5rem);
	font-weight: 500;
	line-height: 1.22;
	letter-spacing: -0.025em;
	color: var(--ink);
	max-width: 24ch;
}

.nsb-statement__body > p:first-child strong {
	font-weight: 500;
	background-image: linear-gradient(var(--accent), var(--accent));
	background-repeat: no-repeat;
	background-position: 0 92%;
	background-size: 100% 3px;
}

.nsb-statement__body p {
	color: var(--ink-2);
	max-width: 58ch;
}

@media (max-width: 899px) {
	.nsb-statement {
		grid-template-columns: minmax(0, 1fr);
	}
}

/* ==========================================================================
   Division rail (horizontal scroll, one per page)
   ========================================================================== */

.nsb-rail {
	display: flex;
	gap: 1.25rem;
	overflow-x: auto;
	scroll-snap-type: x mandatory;
	scroll-padding-left: var(--gutter);
	padding-bottom: 1.5rem;
	scrollbar-width: thin;
	scrollbar-color: var(--line) transparent;
}

.nsb-rail > * {
	margin: 0 !important;
	flex: 0 0 clamp(17rem, 27vw, 24rem);
	scroll-snap-align: start;
}

.nsb-rail::-webkit-scrollbar {
	height: 4px;
}

.nsb-rail::-webkit-scrollbar-thumb {
	background: var(--line);
}

.nsb-division {
	position: relative;
	display: flex;
	flex-direction: column;
	border-top: 2px solid var(--ink);
	padding-top: 1.25rem;
	transition: border-color var(--t-ui) var(--ease);
}

.nsb-division > * {
	margin: 0;
}

.nsb-division:hover {
	border-color: var(--accent);
}

.nsb-division figure {
	margin: 0 0 1.25rem;
	overflow: hidden;
	order: -1;
}

.nsb-division img {
	display: block;
	width: 100%;
	aspect-ratio: 4 / 3;
	object-fit: cover;
	filter: saturate(0.78) contrast(1.04);
	transition: transform var(--t-image) var(--ease);
}

.nsb-division:hover img {
	transform: scale(1.05);
}

.nsb-division h3 {
	font-family: var(--font-display);
	font-size: clamp(1.25rem, 1.1rem + 0.5vw, 1.5rem);
	font-weight: 600;
	letter-spacing: -0.02em;
}

.nsb-division p {
	margin-top: 0.65rem;
	font-size: 0.9375rem;
	line-height: 1.55;
	color: var(--muted);
}

.nsb-division h3 a {
	color: inherit;
	text-decoration: none;
}

.nsb-division h3 a::after {
	content: "";
	position: absolute;
	inset: 0;
}

/* ==========================================================================
   Industry chips
   ========================================================================== */

.nsb-chips {
	display: flex;
	flex-wrap: wrap;
	gap: 0.75rem;
}

.nsb-chips > * {
	margin: 0 !important;
}

.nsb-chip {
	padding: 0.7rem 1.25rem;
	border: 1px solid var(--line);
	border-radius: 999px;
	font-size: 0.9375rem;
	font-weight: 500;
	color: var(--ink-2);
	transition: border-color var(--t-ui) var(--ease), color var(--t-ui) var(--ease),
		background-color var(--t-ui) var(--ease);
}

.nsb-chip:hover {
	border-color: var(--ink);
	color: var(--ink);
}

/* ==========================================================================
   Group heading (product index groups)
   ========================================================================== */

.nsb-group-head {
	display: flex;
	align-items: baseline;
	justify-content: space-between;
	gap: 1.5rem;
	padding-bottom: 1rem;
	margin-bottom: 0.5rem !important;
	border-bottom: 2px solid var(--ink);
}

.nsb-group-head > * {
	margin: 0 !important;
}

.nsb-group-head h2 {
	font-size: clamp(1.25rem, 1.1rem + 0.5vw, 1.5rem);
	letter-spacing: -0.02em;
}

.nsb-group-head p {
	font-size: 0.8125rem;
	font-weight: 500;
	letter-spacing: 0.1em;
	text-transform: uppercase;
	color: var(--muted);
	white-space: nowrap;
}

.nsb-index + .nsb-group-head {
	margin-top: clamp(3rem, 2rem + 3vw, 5rem) !important;
}


/* ==========================================================================
   Section background media (low opacity, parallax)
   ========================================================================== */

.nsb-bg {
	position: relative;
	isolation: isolate;
	overflow: clip;
}

.nsb-bg > .nsb-bg__media {
	position: absolute;
	inset: -12% 0;
	z-index: -1;
	margin: 0 !important;
	max-width: none !important;
	width: 100%;
	pointer-events: none;
}

.nsb-bg__media img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	opacity: 0.06;
	filter: grayscale(1) contrast(1.35);
}

.nsb-bg--tint > .nsb-bg__media img {
	opacity: 0.14;
	filter: grayscale(0.85) contrast(1.1);
}

.nsb-parallax {
	will-change: transform;
}

/* Two-up image band */
.nsb-duo {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 1.25rem;
	margin-top: clamp(3rem, 2rem + 3vw, 4.5rem) !important;
}

.nsb-duo > * {
	margin: 0 !important;
	overflow: hidden;
}

.nsb-duo img {
	display: block;
	width: 100%;
	aspect-ratio: 4 / 3;
	object-fit: cover;
	filter: saturate(0.8) contrast(1.03);
	transition: transform var(--t-image) var(--ease);
}

.nsb-duo > *:hover img {
	transform: scale(1.04);
}

@media (max-width: 599px) {
	.nsb-duo {
		grid-template-columns: minmax(0, 1fr);
	}
}

/* ==========================================================================
   Contact
   ========================================================================== */

.nsb-contact {
	display: grid;
	grid-template-columns: minmax(0, 0.9fr) minmax(0, 1.1fr);
	gap: clamp(2.5rem, 1rem + 5vw, 6rem);
}

.nsb-contact > * {
	margin: 0 !important;
}

.nsb-contact__aside > * {
	margin-block: 0;
}

.nsb-contact__aside > * + * {
	margin-block-start: 1.5rem;
}

.nsb-contact-details {
	border-top: 1px solid var(--line);
}

.nsb-contact-item {
	display: grid;
	grid-template-columns: minmax(0, 0.6fr) minmax(0, 1fr);
	gap: 1rem;
	padding-block: 1.25rem;
	border-bottom: 1px solid var(--line);
}

.nsb-contact-item__label {
	font-size: 0.8125rem;
	font-weight: 500;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	color: var(--muted);
}

.nsb-contact-item__value {
	color: var(--ink);
	font-weight: 500;
}

.nsb-contact-item__value a {
	color: var(--ink);
	text-decoration: underline;
	text-decoration-color: var(--accent);
	text-decoration-thickness: 2px;
	text-underline-offset: 3px;
}

@media (max-width: 479px) {
	.nsb-contact-item {
		grid-template-columns: minmax(0, 1fr);
		gap: 0.25rem;
	}
}

.nsb-form-panel {
	padding: clamp(1.5rem, 1rem + 2.5vw, 3rem);
	background: var(--surface);
}

.nsb-form-panel > * {
	margin-block: 0;
}

.nsb-form-panel > * + * {
	margin-block-start: 0.65rem;
}

.nsb-form-panel .nsb-form-wrap {
	margin-block-start: 2rem;
}

@media (max-width: 899px) {
	.nsb-contact {
		grid-template-columns: minmax(0, 1fr);
	}
}

/* Form */
.nsb-form {
	display: grid;
	gap: 1.25rem;
}

.nsb-form__row {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 1.25rem;
}

@media (max-width: 599px) {
	.nsb-form__row {
		grid-template-columns: minmax(0, 1fr);
	}
}

.nsb-field {
	display: grid;
	gap: 0.5rem;
	margin: 0;
}

.nsb-field label {
	font-size: 0.8125rem;
	font-weight: 500;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	color: var(--muted);
}

.nsb-req {
	color: var(--accent-ink);
}

.nsb-field input[type="text"],
.nsb-field input[type="email"],
.nsb-field input[type="tel"],
.nsb-field select,
.nsb-field textarea {
	box-sizing: border-box;
	width: 100%;
	min-height: 52px;
	padding: 0.85rem 1rem;
	font: inherit;
	font-size: 1rem;
	color: var(--ink);
	background: var(--paper);
	border: 1px solid var(--line);
	border-radius: 0;
	transition: border-color var(--t-ui) var(--ease), box-shadow var(--t-ui) var(--ease);
	-webkit-appearance: none;
	appearance: none;
}

.nsb-field select {
	padding-right: 2.75rem;
	background-image: url("../icons/caret-down.svg");
	background-repeat: no-repeat;
	background-position: right 1rem center;
	background-size: 1rem;
}

.nsb-field textarea {
	min-height: 9rem;
	resize: vertical;
}

.nsb-field input:hover,
.nsb-field select:hover,
.nsb-field textarea:hover {
	border-color: var(--muted);
}

.nsb-field input:focus,
.nsb-field select:focus,
.nsb-field textarea:focus {
	outline: none;
	border-color: var(--ink);
	box-shadow: inset 0 -2px 0 var(--accent);
}

.nsb-field [aria-invalid="true"] {
	border-color: var(--accent-ink);
}

.nsb-field__help,
.nsb-field__error {
	margin: 0;
	font-size: 0.875rem;
	line-height: 1.4;
}

.nsb-field__help {
	color: var(--muted);
	text-transform: none;
	letter-spacing: 0;
}

.nsb-field__error {
	color: var(--accent-ink);
	font-weight: 500;
}

.nsb-field--check {
	grid-template-columns: auto minmax(0, 1fr);
	align-items: start;
	column-gap: 0.75rem;
}

.nsb-field--check input {
	width: 1.5rem;
	height: 1.5rem;
	margin: 0.15rem 0 0;
	accent-color: var(--ink);
}

.nsb-field--check label {
	font-size: 0.9375rem;
	font-weight: 400;
	letter-spacing: 0;
	text-transform: none;
	line-height: 1.5;
	color: var(--ink-2);
}

.nsb-field--check label a {
	color: var(--ink);
	text-decoration: underline;
	text-decoration-color: var(--accent);
	text-underline-offset: 3px;
}

.nsb-field--check .nsb-field__error {
	grid-column: 2;
}

.nsb-form__submit {
	margin: 0.25rem 0 0;
}

.nsb-form__submit .wp-element-button {
	border: 0;
	cursor: pointer;
	font-family: inherit;
}

.nsb-form__submit .wp-element-button::after {
	content: "";
	width: 1.05em;
	height: 1.05em;
	background: currentColor;
	-webkit-mask: var(--ico-arrow) center / contain no-repeat;
	mask: var(--ico-arrow) center / contain no-repeat;
	transition: transform var(--t-ui) var(--ease);
}

.nsb-form__submit .wp-element-button:hover::after {
	transform: translateX(4px);
}

.nsb-form__submit .wp-element-button[aria-busy="true"] {
	opacity: 0.7;
	pointer-events: none;
}

.nsb-hp {
	position: absolute !important;
	left: -9999px;
	width: 1px;
	height: 1px;
	overflow: hidden;
}

.nsb-notice {
	margin-bottom: 1.5rem;
	padding: 1rem 1.125rem;
	font-size: 0.9875rem;
	line-height: 1.5;
	border-left: 3px solid;
}

.nsb-notice.is-success {
	color: #12633a;
	background: #eef6f1;
	border-color: #12633a;
}

.nsb-notice.is-error {
	color: var(--accent-ink);
	background: #fdf1ec;
	border-color: var(--accent-ink);
}

.nsb-map iframe {
	display: block;
	width: 100%;
	height: clamp(20rem, 42vw, 30rem);
	border: 0;
	filter: grayscale(0.2);
}

/* ==========================================================================
   Legal and 404
   ========================================================================== */

.nsb-legal h2 {
	margin-block: 3rem 1rem;
	padding-top: 1.75rem;
	font-size: clamp(1.375rem, 1.2rem + 0.7vw, 1.75rem);
	letter-spacing: -0.02em;
	border-top: 1px solid var(--line);
}

.nsb-legal > :first-child {
	margin-top: 0;
}

.nsb-404 {
	min-height: 78svh;
	display: grid;
	align-content: center;
}

.nsb-404__inner > * {
	margin-block: 0;
}

.nsb-404__inner > * + * {
	margin-block-start: 1.5rem;
}

/* ==========================================================================
   Footer
   ========================================================================== */

.nsb-footer {
	padding-block: clamp(4rem, 3rem + 3vw, 6rem) 2rem;
	background: var(--ink);
	color: var(--on-ink-muted);
	font-size: 0.9375rem;
}

.nsb-footer__mark,
.nsb-footer__mark:hover {
	background-image: none;
}

.nsb-footer a {
	color: #fff;
	text-decoration: none;
	background-image: linear-gradient(var(--accent), var(--accent));
	background-repeat: no-repeat;
	background-position: 0 100%;
	background-size: 0 1px;
	transition: background-size var(--t-ui) var(--ease);
}

.nsb-footer a:hover {
	background-size: 100% 1px;
}

.nsb-footer__mark {
	display: block;
	margin: 0 0 clamp(2.5rem, 2rem + 3vw, 4.5rem) !important;
	font-family: var(--font-display);
	font-size: clamp(2.75rem, 1.5rem + 7.5vw, 8.5rem);
	font-weight: 600;
	line-height: 0.85;
	letter-spacing: -0.04em;
	text-transform: uppercase;
	color: #fff;
}

.nsb-footer__mark span {
	color: var(--accent);
}

.nsb-footer__main {
	display: grid;
	grid-template-columns: minmax(0, 1.3fr) minmax(0, 0.7fr) minmax(0, 1fr);
	gap: 2.5rem clamp(2rem, 1rem + 4vw, 5rem);
	padding-top: clamp(2rem, 1.5rem + 2vw, 3rem);
	border-top: 1px solid var(--line-dark);
}

.nsb-footer__main > *,
.nsb-footer__brand > *,
.nsb-footer__col > * {
	margin: 0;
}

.nsb-footer__brand {
	max-width: 30rem;
}

.nsb-footer__brand p + p {
	margin-top: 1rem;
}

.nsb-footer__legal {
	color: #fff;
	font-size: 0.875rem;
	line-height: 1.7;
}

.nsb-footer__title {
	margin-bottom: 1.25rem !important;
	font-family: var(--font-display);
	font-size: 0.8125rem;
	font-weight: 500;
	letter-spacing: 0.12em;
	text-transform: uppercase;
	color: var(--on-ink-muted);
}

.nsb-footer__links,
.nsb-contact-list {
	list-style: none;
	margin: 0;
	padding: 0;
}

.nsb-footer__links li + li,
.nsb-contact-list li + li {
	margin-top: 0.35rem;
}

/* Comfortable touch targets for the small link lists. */
.nsb-footer__links a,
.nsb-contact-list a,
.nsb-footer__bottom a {
	display: inline-block;
	padding-block: 0.45rem;
}

.nsb-contact-item__value a {
	display: inline-block;
	padding-block: 0.3rem;
}

.nsb-contact-list li {
	line-height: 1.6;
	color: #fff;
}

.nsb-footer__bottom {
	margin-top: clamp(2.5rem, 2rem + 2vw, 4rem) !important;
	padding-top: 1.5rem;
	border-top: 1px solid var(--line-dark);
	font-size: 0.8125rem;
	gap: 0.75rem 2rem;
}

.nsb-footer__bottom p {
	margin: 0;
}

@media (max-width: 899px) {
	.nsb-footer__main {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}

	.nsb-footer__brand {
		grid-column: 1 / -1;
	}
}

@media (max-width: 479px) {
	.nsb-footer__main {
		grid-template-columns: minmax(0, 1fr);
	}
}

/* ==========================================================================
   WhatsApp
   ========================================================================== */

.nsb-whatsapp {
	position: fixed;
	right: max(1.25rem, env(safe-area-inset-right));
	bottom: max(1.25rem, env(safe-area-inset-bottom));
	z-index: 50;
	display: grid;
	place-items: center;
	width: 56px;
	height: 56px;
	border-radius: 50%;
	background: #1fa855;
	color: #fff;
	box-shadow: 0 10px 30px -12px rgba(11, 13, 18, 0.45);
	transition: transform var(--t-ui) var(--ease);
}

.nsb-whatsapp:hover {
	transform: translateY(-3px);
	color: #fff;
}

/* ==========================================================================
   Reduced motion
   ========================================================================== */

@media (prefers-reduced-motion: reduce) {
	html {
		scroll-behavior: auto;
	}

	*,
	*::before,
	*::after {
		transition-duration: 0.01ms !important;
		animation-duration: 0.01ms !important;
		animation-iteration-count: 1 !important;
	}

	.nsb-js .nsb-reveal {
		opacity: 1 !important;
		transform: none !important;
	}

	.nsb-marquee__track {
		animation: none;
	}
}