/* ==========================================================================
   Nova Vape - design system

   Rebuilt to match the reference site's visual language:
   white page, #f5f5f5 content bands, black bookends, a single warm accent
   (#fa4500) used as text rather than as filled buttons, and a DIN-style
   grotesque throughout.

   1.  Tokens              7.  Hero
   2.  Reset and base      8.  Bands, tiles and figures
   3.  Layout              9.  Cards
   4.  Typography          10. Product story page
   5.  Links and buttons   11. Forms
   6.  Header and nav      12. Footer and overlays
   ========================================================================== */

/* 1. Tokens ---------------------------------------------------------------- */

:root {
	--nv-white: #ffffff;
	--nv-alt: #f5f5f5;
	--nv-alt-2: #efefef;
	--nv-ink: #000000;
	--nv-copy: #444444;
	--nv-muted: #adadad;
	--nv-faint: #666666;
	--nv-line: #e6e6e6;
	--nv-line-ink: #000000;

	--nv-accent: #fa4500;
	--nv-accent-dark: #c93700;

	--nv-font: "Barlow", "Helvetica Neue", Arial, sans-serif;

	--nv-radius: 4px;
	--nv-pill: 999px;

	--nv-container: 1120px;
	--nv-container-wide: 1440px;
	--nv-gutter: clamp(1.125rem, 4vw, 3rem);

	--nv-band-y: clamp(3rem, 7vw, 6rem);
	--nv-band-y-tight: clamp(2rem, 4vw, 3.5rem);

	--nv-header-h: 64px;
	--nv-alert-h: 52px;

	--nv-ease: cubic-bezier(0.22, 0.61, 0.36, 1);
}

/* 2. Reset and base -------------------------------------------------------- */

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

/*
 * The hidden attribute is a semantic "do not render" signal. Several
 * components below set display (the overlay is display:flex, the to-top link
 * is display:inline-flex), and an author display declaration always beats the
 * user agent's [hidden] rule - which silently turns an element that JavaScript
 * thinks it has hidden into one that is still on screen and still covering the
 * page. This restores the attribute's meaning.
 */
[hidden] {
	display: none !important;
}

html {
	-webkit-text-size-adjust: 100%;
	scroll-behavior: smooth;
	scroll-padding-top: calc(var(--nv-header-h) + 1rem);
}

body.nv-body {
	margin: 0;
	background: var(--nv-white);
	color: var(--nv-ink);
	font-family: var(--nv-font);
	font-size: 1rem;
	font-weight: 400;
	line-height: 1.6;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
	overflow-x: hidden;
}

img,
svg,
video,
iframe {
	max-width: 100%;
	height: auto;
	display: block;
}

figure {
	margin: 0;
}

a {
	color: inherit;
	text-decoration: none;
	transition: color 0.2s var(--nv-ease), opacity 0.2s var(--nv-ease),
		border-color 0.2s var(--nv-ease), background-color 0.2s var(--nv-ease);
}

ul,
ol {
	margin: 0;
	padding: 0;
	list-style: none;
}

button {
	font: inherit;
	color: inherit;
	cursor: pointer;
}

:focus-visible {
	outline: 2px solid var(--nv-accent);
	outline-offset: 2px;
}

.screen-reader-text {
	position: absolute !important;
	width: 1px;
	height: 1px;
	padding: 0;
	margin: -1px;
	overflow: hidden;
	clip: rect(0, 0, 0, 0);
	white-space: nowrap;
	border: 0;
}

.nv-skip-link {
	position: absolute;
	top: -100px;
	left: 1rem;
	z-index: 999;
	padding: 0.6rem 1.1rem;
	background: var(--nv-ink);
	color: var(--nv-white);
	font-weight: 600;
}

.nv-skip-link:focus {
	top: 0.5rem;
	color: var(--nv-white);
}

/* 3. Layout ---------------------------------------------------------------- */

.nv-container {
	width: 100%;
	max-width: var(--nv-container);
	margin-inline: auto;
	padding-inline: var(--nv-gutter);
}

.nv-container--wide {
	max-width: var(--nv-container-wide);
}

.nv-container--narrow {
	max-width: 760px;
}

.nv-container--flush {
	max-width: none;
	padding-inline: 0;
}

.nv-main {
	display: block;
}

.nv-band {
	position: relative;
	padding-block: var(--nv-band-y);
	background: var(--nv-white);
}

.nv-band--tight {
	padding-block: var(--nv-band-y-tight);
}

.nv-band--alt {
	background: var(--nv-alt);
}

.nv-band--dark {
	background: var(--nv-ink);
	color: var(--nv-white);
}

.nv-band--image {
	overflow: hidden;
}

.nv-band--flush {
	padding-block: 0;
}

.nv-band__head {
	max-width: 64ch;
	margin-bottom: clamp(1.5rem, 3vw, 2.75rem);
}

.nv-band__head--center {
	margin-inline: auto;
	text-align: center;
}

.nv-band__head--center .nv-lead {
	margin-inline: auto;
}

/* 4. Typography ------------------------------------------------------------ */

h1,
h2,
h3,
h4 {
	margin: 0 0 0.6rem;
	font-weight: 500;
	line-height: 1.12;
	letter-spacing: -0.005em;
}

h1 {
	font-size: clamp(1.75rem, 3.4vw, 2.5rem);
	font-weight: 600;
	line-height: 1.1;
}

h2 {
	font-size: clamp(1.5rem, 3.2vw, 3.25rem);
}

h3 {
	font-size: clamp(1.05rem, 1.5vw, 1.25rem);
	font-weight: 600;
}

h4 {
	font-size: 1rem;
	font-weight: 600;
}

p {
	margin: 0 0 1rem;
}

p:last-child {
	margin-bottom: 0;
}

.nv-eyebrow {
	display: inline-block;
	margin: 0 0 0.75rem;
	font-size: 0.8125rem;
	font-weight: 600;
	letter-spacing: 0.1em;
	text-transform: uppercase;
	color: var(--nv-ink);
}

.nv-eyebrow--accent {
	color: var(--nv-accent);
}

.nv-band--dark .nv-eyebrow {
	color: var(--nv-white);
}

.nv-lead {
	max-width: 62ch;
	font-size: clamp(1rem, 1.3vw, 1.125rem);
	color: var(--nv-copy);
}

.nv-band--dark .nv-lead {
	color: var(--nv-muted);
}

.nv-section-title {
	font-size: clamp(1.35rem, 2.4vw, 2rem);
	font-weight: 500;
	margin-bottom: 1.25rem;
}

.nv-empty {
	padding: 3rem 0;
	color: var(--nv-copy);
}

/* 5. Links and buttons ----------------------------------------------------- */

/*
 * The reference design is link-driven: almost every call to action is plain
 * text with an underline on hover, not a filled button. Filled surfaces are
 * reserved for the inquiry submit, which is this site's only conversion.
 */

.nv-link {
	display: inline-flex;
	align-items: center;
	gap: 0.45rem;
	font-size: 0.9375rem;
	font-weight: 500;
	color: var(--nv-ink);
	border-bottom: 1px solid transparent;
	padding-bottom: 2px;
}

.nv-link::after {
	content: "";
	width: 18px;
	height: 1px;
	background: currentColor;
	transition: width 0.25s var(--nv-ease);
}

.nv-link:hover {
	color: var(--nv-ink);
	border-bottom-color: currentColor;
}

.nv-link:hover::after {
	width: 28px;
}

.nv-link--accent {
	color: var(--nv-accent);
}

.nv-link--accent:hover {
	color: var(--nv-accent-dark);
}

.nv-band--dark .nv-link {
	color: var(--nv-white);
}

.nv-btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 0.5rem;
	padding: 0.7rem 1.5rem;
	border: 1px solid var(--nv-ink);
	border-radius: var(--nv-pill);
	background: transparent;
	color: var(--nv-ink);
	font-family: inherit;
	font-size: 0.875rem;
	font-weight: 600;
	line-height: 1.2;
	white-space: nowrap;
	cursor: pointer;
	transition: background-color 0.22s var(--nv-ease), color 0.22s var(--nv-ease),
		border-color 0.22s var(--nv-ease);
}

.nv-btn:hover {
	background: var(--nv-ink);
	color: var(--nv-white);
}

.nv-btn--solid {
	background: var(--nv-ink);
	color: var(--nv-white);
}

.nv-btn--solid:hover {
	background: var(--nv-accent);
	border-color: var(--nv-accent);
	color: var(--nv-white);
}

.nv-btn--light {
	border-color: var(--nv-white);
	color: var(--nv-white);
}

.nv-btn--light:hover {
	background: var(--nv-white);
	color: var(--nv-ink);
}

.nv-btn--lg {
	padding: 0.95rem 2rem;
	font-size: 0.9375rem;
}

.nv-btn--block {
	width: 100%;
}

.nv-badge {
	display: inline-block;
	font-size: 0.8125rem;
	font-weight: 600;
	letter-spacing: 0.06em;
	color: var(--nv-accent);
}

.nv-band--dark .nv-badge {
	color: var(--nv-accent);
}

/* 6. Header and nav -------------------------------------------------------- */

.nv-alert {
	background: var(--nv-ink);
	color: var(--nv-white);
}

.nv-alert__inner {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 1rem;
	min-height: var(--nv-alert-h);
	padding-block: 0.5rem;
	text-align: center;
}

.nv-alert__text {
	margin: 0;
	font-size: 0.8125rem;
	font-weight: 600;
	letter-spacing: 0.02em;
}

.nv-alert a {
	color: var(--nv-white);
	text-decoration: underline;
	text-underline-offset: 3px;
}

.nv-header {
	position: sticky;
	top: 0;
	z-index: 90;
	background: var(--nv-white);
	border-bottom: 1px solid var(--nv-line-ink);
}

/*
 * Two equal side tracks so the centre track is genuinely centred. With
 * "auto 1fr auto" the nav only looks centred when the logo and the tool
 * cluster happen to be the same width, which they are not.
 */
.nv-header__inner {
	display: grid;
	grid-template-columns: 1fr auto 1fr;
	align-items: center;
	gap: 1.5rem;
	min-height: var(--nv-header-h);
}

.nv-logo {
	display: inline-flex;
	align-items: center;
	flex: 0 0 auto;
}

.nv-logo__img {
	max-height: 40px;
	width: auto;
}

.nv-logo__text {
	font-size: 1.25rem;
	font-weight: 700;
	letter-spacing: 0.06em;
	text-transform: uppercase;
	line-height: 1;
}

.nv-nav {
	justify-self: center;
}

.nv-menu {
	display: flex;
	align-items: center;
	gap: clamp(1rem, 2.2vw, 2rem);
}

.nv-menu > li {
	position: relative;
}

.nv-menu > li > a {
	display: inline-flex;
	align-items: center;
	gap: 0.3rem;
	padding: 0.5rem 0;
	font-size: 0.8125rem;
	font-weight: 600;
	color: var(--nv-ink);
}

.nv-menu > li > a::after {
	content: "";
	position: absolute;
	left: 0;
	bottom: 0.1rem;
	width: 0;
	height: 1px;
	background: var(--nv-ink);
	transition: width 0.25s var(--nv-ease);
}

.nv-menu > li:hover > a::after,
.nv-menu > li.current-menu-item > a::after,
.nv-menu > li.current-menu-ancestor > a::after {
	width: 100%;
}

.nv-menu .sub-menu {
	position: absolute;
	top: 100%;
	left: -1rem;
	min-width: 210px;
	padding: 0.75rem 0;
	background: var(--nv-white);
	border: 1px solid var(--nv-line);
	box-shadow: 0 18px 40px rgba(0, 0, 0, 0.08);
	opacity: 0;
	visibility: hidden;
	transform: translateY(6px);
	transition: opacity 0.2s var(--nv-ease), transform 0.2s var(--nv-ease),
		visibility 0.2s var(--nv-ease);
	z-index: 20;
}

.nv-menu > li:hover > .sub-menu,
.nv-menu > li:focus-within > .sub-menu {
	opacity: 1;
	visibility: visible;
	transform: translateY(0);
}

.nv-menu .sub-menu a {
	display: block;
	padding: 0.5rem 1.15rem;
	font-size: 0.8125rem;
	color: var(--nv-copy);
}

.nv-menu .sub-menu a:hover {
	background: var(--nv-alt);
	color: var(--nv-ink);
}

.nv-menu .sub-menu .sub-menu {
	top: 0;
	left: 100%;
}

.nv-header__tools {
	display: flex;
	align-items: center;
	gap: 0.75rem;
	justify-self: end;
}

/* The phone number, language switcher and CTA inside the nav are for the
   mobile drawer only; the header tools already carry them on desktop. */
.nv-nav__extras {
	display: none;
}

.nv-header__cta {
	padding: 0.5rem 1.15rem;
	border: 1px solid var(--nv-ink);
	border-radius: var(--nv-pill);
	font-size: 0.8125rem;
	font-weight: 600;
	white-space: nowrap;
}

.nv-header__cta:hover {
	background: var(--nv-ink);
	color: var(--nv-white);
}

.nv-icon-btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 34px;
	height: 34px;
	padding: 0;
	background: none;
	border: 0;
	color: var(--nv-ink);
}

.nv-icon {
	width: 20px;
	height: 20px;
	background-color: currentColor;
	-webkit-mask-repeat: no-repeat;
	mask-repeat: no-repeat;
	-webkit-mask-position: center;
	mask-position: center;
	-webkit-mask-size: contain;
	mask-size: contain;
}

.nv-icon--search {
	-webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.8'%3E%3Ccircle cx='11' cy='11' r='7'/%3E%3Cpath d='m20 20-3.5-3.5'/%3E%3C/svg%3E");
	mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.8'%3E%3Ccircle cx='11' cy='11' r='7'/%3E%3Cpath d='m20 20-3.5-3.5'/%3E%3C/svg%3E");
}

.nv-icon--globe {
	-webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.8'%3E%3Ccircle cx='12' cy='12' r='9'/%3E%3Cpath d='M3 12h18M12 3c2.5 2.7 3.8 5.8 3.8 9S14.5 18.3 12 21c-2.5-2.7-3.8-5.8-3.8-9S9.5 5.7 12 3z'/%3E%3C/svg%3E");
	mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.8'%3E%3Ccircle cx='12' cy='12' r='9'/%3E%3Cpath d='M3 12h18M12 3c2.5 2.7 3.8 5.8 3.8 9S14.5 18.3 12 21c-2.5-2.7-3.8-5.8-3.8-9S9.5 5.7 12 3z'/%3E%3C/svg%3E");
}

.nv-burger {
	display: inline-flex;
	flex-direction: column;
	justify-content: center;
	align-items: center;
	gap: 5px;
	width: 34px;
	height: 34px;
	padding: 0;
	background: none;
	border: 0;
}

.nv-burger__bar {
	display: block;
	width: 20px;
	height: 1.5px;
	background: currentColor;
	transition: transform 0.25s var(--nv-ease), opacity 0.2s var(--nv-ease);
}

.nv-burger[aria-expanded="true"] .nv-burger__bar:nth-child(1) {
	transform: translateY(6.5px) rotate(45deg);
}

.nv-burger[aria-expanded="true"] .nv-burger__bar:nth-child(2) {
	opacity: 0;
}

.nv-burger[aria-expanded="true"] .nv-burger__bar:nth-child(3) {
	transform: translateY(-6.5px) rotate(-45deg);
}

.nv-search-panel {
	border-top: 1px solid var(--nv-line);
	background: var(--nv-white);
	padding: 1.25rem 0 1.5rem;
}

/* Language switcher -------------------------------------------------------- */

.nv-lang {
	position: relative;
}

.nv-lang__toggle {
	display: inline-flex;
	align-items: center;
	gap: 0.4rem;
	padding: 0.4rem 0.5rem;
	background: none;
	border: 0;
	font-size: 0.8125rem;
	font-weight: 500;
}

.nv-lang__list {
	position: absolute;
	top: calc(100% + 6px);
	right: 0;
	min-width: 150px;
	padding: 0.4rem 0;
	background: var(--nv-white);
	border: 1px solid var(--nv-line);
	box-shadow: 0 18px 40px rgba(0, 0, 0, 0.08);
	opacity: 0;
	visibility: hidden;
	transform: translateY(6px);
	transition: opacity 0.2s var(--nv-ease), transform 0.2s var(--nv-ease),
		visibility 0.2s var(--nv-ease);
	z-index: 30;
}

.nv-lang.is-open .nv-lang__list {
	opacity: 1;
	visibility: visible;
	transform: translateY(0);
}

.nv-lang__list a {
	display: block;
	padding: 0.45rem 1rem;
	font-size: 0.8125rem;
	color: var(--nv-copy);
}

.nv-lang__list a:hover {
	background: var(--nv-alt);
	color: var(--nv-ink);
}

.nv-lang__list .is-current a {
	color: var(--nv-accent);
	font-weight: 600;
}

/* 7. Hero ------------------------------------------------------------------ */

.nv-hero {
	position: relative;
	background: var(--nv-ink);
	overflow: hidden;
}

.nv-hero__track {
	display: flex;
	transition: transform 0.7s var(--nv-ease);
	will-change: transform;
}

.nv-hero__slide {
	position: relative;
	flex: 0 0 100%;
	min-height: clamp(420px, 62vh, 660px);
	display: flex;
	align-items: center;
	overflow: hidden;
}

.nv-hero__media {
	position: absolute;
	inset: 0;
	z-index: 0;
}

.nv-hero__media img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.nv-hero__media--mobile {
	display: none;
}

.nv-hero__body {
	position: relative;
	z-index: 1;
	max-width: 40rem;
}

.nv-hero__title {
	font-size: clamp(1.9rem, 4.4vw, 3.25rem);
	font-weight: 500;
	line-height: 1.1;
	margin: 0.75rem 0 0.9rem;
	color: var(--nv-white);
}

.nv-hero__text {
	margin-bottom: 1.5rem;
	font-size: clamp(0.95rem, 1.2vw, 1.0625rem);
	color: rgba(255, 255, 255, 0.82);
	max-width: 46ch;
}

.nv-hero__actions {
	display: flex;
	flex-wrap: wrap;
	gap: 0.75rem;
	align-items: center;
}

.nv-hero__cta {
	display: inline-flex;
	align-items: center;
	gap: 0.5rem;
	padding: 0.75rem 1.6rem;
	border: 1px solid var(--nv-white);
	border-radius: var(--nv-pill);
	color: var(--nv-white);
	font-size: 0.875rem;
	font-weight: 600;
}

.nv-hero__cta:hover {
	background: var(--nv-white);
	color: var(--nv-ink);
}

.nv-hero__link {
	color: var(--nv-white);
	font-size: 0.9375rem;
	font-weight: 500;
	border-bottom: 1px solid transparent;
	padding-bottom: 2px;
}

.nv-hero__link:hover {
	color: var(--nv-white);
	border-bottom-color: currentColor;
}

.nv-hero__dots {
	position: absolute;
	left: 0;
	right: 0;
	bottom: 1.5rem;
	z-index: 2;
	display: flex;
	justify-content: center;
	gap: 0.5rem;
}

.nv-hero__dot {
	width: 28px;
	height: 2px;
	padding: 0;
	border: 0;
	background: rgba(255, 255, 255, 0.4);
	transition: background-color 0.25s var(--nv-ease), width 0.25s var(--nv-ease);
}

.nv-hero__dot.is-active {
	width: 44px;
	background: var(--nv-white);
}

.nv-hero__arrows {
	position: absolute;
	top: 50%;
	left: 0;
	right: 0;
	z-index: 2;
	display: flex;
	justify-content: space-between;
	padding-inline: clamp(0.75rem, 2vw, 1.75rem);
	transform: translateY(-50%);
	pointer-events: none;
}

.nv-hero__arrow {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 44px;
	height: 44px;
	border: 1px solid rgba(255, 255, 255, 0.5);
	border-radius: 50%;
	background: rgba(0, 0, 0, 0.15);
	color: var(--nv-white);
	pointer-events: auto;
}

.nv-hero__arrow::before {
	content: "";
	width: 8px;
	height: 8px;
	border-top: 1.5px solid currentColor;
	border-right: 1.5px solid currentColor;
}

.nv-hero__arrow--prev::before {
	transform: rotate(-135deg) translate(-2px, -2px);
}

.nv-hero__arrow--next::before {
	transform: rotate(45deg) translate(-2px, -2px);
}

.nv-hero__arrow:hover {
	background: var(--nv-white);
	color: var(--nv-ink);
	border-color: var(--nv-white);
}

.nv-breadcrumbs {
	margin-bottom: 1rem;
	font-size: 0.8125rem;
	color: var(--nv-muted);
}

.nv-breadcrumbs ol {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 0.45rem;
}

.nv-breadcrumbs li + li::before {
	content: "/";
	margin-right: 0.45rem;
	color: var(--nv-muted);
}

.nv-breadcrumbs a {
	color: var(--nv-muted);
}

.nv-breadcrumbs a:hover {
	color: var(--nv-ink);
}

/* 8. Bands, tiles and figures ---------------------------------------------- */

/* Full-bleed decorative image with no text on it. */
.nv-figure {
	position: relative;
	display: block;
	width: 100%;
	background: var(--nv-ink);
}

.nv-figure img {
	width: 100%;
	height: auto;
}

.nv-figure--cover img {
	height: clamp(240px, 42vw, 620px);
	object-fit: cover;
}

/* Brand / lifestyle tiles: large square-ish image, eyebrow, title, link. */
.nv-tiles {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(min(100%, 280px), 1fr));
	gap: clamp(0.5rem, 1.2vw, 1rem);
}

@media (min-width: 768px) {
	.nv-tiles--2 {
		grid-template-columns: repeat(2, 1fr);
	}

	.nv-tiles--3 {
		grid-template-columns: repeat(3, 1fr);
	}

	.nv-tiles--4 {
		grid-template-columns: repeat(4, 1fr);
	}
}

.nv-tile {
	position: relative;
	display: flex;
	flex-direction: column;
	background: var(--nv-white);
	overflow: hidden;
}

.nv-band--alt .nv-tile {
	background: var(--nv-white);
}

.nv-tile__media {
	display: block;
	aspect-ratio: 1 / 1;
	overflow: hidden;
	background: var(--nv-alt-2);
}

.nv-tile__media img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	transition: transform 0.7s var(--nv-ease);
}

.nv-tile:hover .nv-tile__media img {
	transform: scale(1.04);
}

.nv-tile__body {
	display: flex;
	flex-direction: column;
	gap: 0.35rem;
	padding: 1.25rem 1.35rem 1.5rem;
}

.nv-tile__title {
	margin: 0;
	font-size: 1.0625rem;
	font-weight: 500;
}

.nv-tile__text {
	margin: 0;
	font-size: 0.9375rem;
	color: var(--nv-copy);
}

.nv-tile__cover {
	position: absolute;
	inset: 0;
	z-index: 3;
}

.nv-tile__link {
	margin-top: 0.5rem;
	font-size: 0.9375rem;
	font-weight: 500;
	border-bottom: 1px solid transparent;
	align-self: flex-start;
}

.nv-tile:hover .nv-tile__link {
	border-bottom-color: currentColor;
}

/* Wide banner carousel. */
.nv-banners {
	position: relative;
	overflow: hidden;
}

.nv-banners__track {
	display: flex;
	gap: clamp(0.5rem, 1.2vw, 1rem);
	transition: transform 0.6s var(--nv-ease);
}

.nv-banner {
	position: relative;
	flex: 0 0 var(--nv-banner-w, 50%);
	overflow: hidden;
	background: var(--nv-alt-2);
}

.nv-banner img {
	width: 100%;
	aspect-ratio: 16 / 7;
	object-fit: cover;
}

.nv-banner__body {
	position: absolute;
	inset: auto 0 0 0;
	padding: clamp(1.25rem, 3vw, 2.5rem);
	background: linear-gradient(180deg, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.62) 100%);
	color: var(--nv-white);
}

.nv-banner__eyebrow {
	display: block;
	font-size: 0.75rem;
	font-weight: 600;
	letter-spacing: 0.1em;
	text-transform: uppercase;
	color: var(--nv-white);
	opacity: 0.85;
	margin-bottom: 0.4rem;
}

.nv-banner__title {
	margin: 0 0 0.35rem;
	font-size: clamp(1.05rem, 1.9vw, 1.6rem);
	font-weight: 500;
	color: var(--nv-white);
}

.nv-banner__text {
	margin: 0;
	font-size: 0.9375rem;
	color: rgba(255, 255, 255, 0.85);
}

.nv-banner__cover {
	position: absolute;
	inset: 0;
	z-index: 3;
}

.nv-banners__nav {
	display: flex;
	justify-content: center;
	gap: 0.5rem;
	margin-top: 1.25rem;
}

.nv-banners__dot {
	width: 28px;
	height: 2px;
	padding: 0;
	border: 0;
	background: var(--nv-line);
}

.nv-banners__dot.is-active {
	width: 44px;
	background: var(--nv-ink);
}

/* Small four-up information grid. */
.nv-infogrid {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(min(100%, 240px), 1fr));
	gap: clamp(0.5rem, 1.2vw, 1rem);
}

.nv-info {
	position: relative;
	background: var(--nv-white);
	overflow: hidden;
}

.nv-info__media {
	display: block;
	aspect-ratio: 4 / 3;
	overflow: hidden;
	background: var(--nv-alt-2);
}

.nv-info__media img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	transition: transform 0.7s var(--nv-ease);
}

.nv-info:hover .nv-info__media img {
	transform: scale(1.04);
}

.nv-info__body {
	padding: 1.15rem 1.25rem 1.4rem;
}

.nv-info__title {
	margin: 0 0 0.3rem;
	font-size: 1rem;
	font-weight: 500;
}

.nv-info__text {
	margin: 0;
	font-size: 0.875rem;
	color: var(--nv-copy);
}

.nv-info__cover {
	position: absolute;
	inset: 0;
	z-index: 3;
}

/* Centred mission statement. */
.nv-mission__inner {
	max-width: 60rem;
	margin-inline: auto;
	text-align: center;
}

.nv-mission__text {
	font-size: clamp(1.0625rem, 2vw, 1.6rem);
	font-weight: 400;
	line-height: 1.5;
	color: var(--nv-ink);
}

.nv-mission__logo {
	margin-top: 2rem;
	display: flex;
	justify-content: center;
}

.nv-mission__logo img {
	max-height: 44px;
	width: auto;
}

/* Split content block (text beside an image). */
.nv-split {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: clamp(1.5rem, 4vw, 3.5rem);
	align-items: center;
}

.nv-split__media img {
	width: 100%;
	aspect-ratio: 4 / 3;
	object-fit: cover;
}

.nv-split__body {
	max-width: 46ch;
}

/* FAQ / accordion used on product and support pages. */
.nv-faq {
	border-top: 1px solid var(--nv-line);
}

.nv-faq__item {
	border-bottom: 1px solid var(--nv-line);
}

.nv-faq__q {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 1rem;
	width: 100%;
	padding: 1.15rem 0;
	background: none;
	border: 0;
	text-align: left;
	font-size: 1rem;
	font-weight: 500;
}

.nv-faq__q::after {
	content: "";
	flex: 0 0 auto;
	width: 10px;
	height: 10px;
	border-right: 1.5px solid currentColor;
	border-bottom: 1.5px solid currentColor;
	transform: rotate(45deg) translateY(-3px);
	transition: transform 0.25s var(--nv-ease);
}

.nv-faq__item.is-open .nv-faq__q::after {
	transform: rotate(-135deg) translateY(-3px);
}

.nv-faq__a {
	padding-bottom: 1.15rem;
	color: var(--nv-copy);
	font-size: 0.9375rem;
}

/* 9. Cards ----------------------------------------------------------------- */

/* Product card: square image plus title. No price, no badge, no button - the
   reference site hands purchasing off to a separate store and keeps the
   catalogue tiles purely navigational. */
.nv-card {
	position: relative;
	display: flex;
	flex-direction: column;
	background: var(--nv-white);
	overflow: hidden;
	transition: transform 0.3s var(--nv-ease);
}

.nv-card:hover {
	transform: translateY(-3px);
}

.nv-card__media {
	display: block;
	aspect-ratio: 1 / 1;
	overflow: hidden;
	background: var(--nv-alt-2);
}

.nv-card__media img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	transition: transform 0.7s var(--nv-ease);
}

.nv-card:hover .nv-card__media img {
	transform: scale(1.04);
}

.nv-card__body {
	padding: 1.1rem 0.25rem 0;
	text-align: center;
}

.nv-card__title {
	margin: 0;
	font-size: 1rem;
	font-weight: 400;
	line-height: 1.35;
}

.nv-card__title a:hover {
	color: var(--nv-accent);
}

.nv-card__badge {
	display: block;
	margin-top: 0.35rem;
	font-size: 0.75rem;
	font-weight: 600;
	letter-spacing: 0.06em;
	text-transform: uppercase;
	color: var(--nv-accent);
}

.nv-card__eyebrow {
	display: block;
	margin-bottom: 0.35rem;
	font-size: 0.75rem;
	font-weight: 600;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	color: var(--nv-accent);
}

.nv-card__text {
	margin: 0.4rem 0 0;
	font-size: 0.875rem;
	color: var(--nv-copy);
}

.nv-card__meta {
	margin: 0.6rem 0 0;
	font-size: 0.8125rem;
	color: var(--nv-muted);
}

.nv-card__more {
	display: inline-block;
	margin-top: 0.6rem;
	font-size: 0.875rem;
	font-weight: 500;
	color: var(--nv-ink);
	border-bottom: 1px solid transparent;
}

.nv-card:hover .nv-card__more {
	border-bottom-color: currentColor;
}

/* Article card keeps a little more copy than a product tile. */
.nv-card--post .nv-card__media {
	aspect-ratio: 3 / 2;
}

.nv-card--post .nv-card__body {
	text-align: left;
}

.nv-card--post .nv-card__title {
	font-size: 1.0625rem;
	font-weight: 500;
}

.nv-card--post .nv-card__title a:hover {
	color: var(--nv-ink);
	text-decoration: underline;
	text-underline-offset: 3px;
}

/* Product grid used on archive pages. */
.nv-products {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(min(100%, 320px), 1fr));
	gap: clamp(1rem, 2.4vw, 1.75rem) clamp(0.75rem, 2vw, 1.5rem);
}

.nv-related {
	margin-top: clamp(3rem, 7vw, 5rem);
}

/* 10. Product story page --------------------------------------------------- */

.nv-productnav {
	position: sticky;
	top: var(--nv-header-h);
	z-index: 60;
	background: rgba(255, 255, 255, 0.94);
	backdrop-filter: saturate(160%) blur(10px);
	-webkit-backdrop-filter: saturate(160%) blur(10px);
	border-bottom: 1px solid var(--nv-line);
}

.nv-productnav__inner {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 1.5rem;
	min-height: 52px;
}

.nv-productnav__name {
	font-size: 0.9375rem;
	font-weight: 600;
}

.nv-productnav__links {
	display: flex;
	align-items: center;
	gap: clamp(0.85rem, 2vw, 1.75rem);
}

.nv-productnav__links a {
	font-size: 0.8125rem;
	font-weight: 500;
	color: var(--nv-copy);
	border-bottom: 1px solid transparent;
	padding-bottom: 2px;
}

.nv-productnav__links a:hover {
	color: var(--nv-ink);
	border-bottom-color: currentColor;
}

.nv-pdp-hero {
	position: relative;
	background: var(--nv-ink);
	overflow: hidden;
}

.nv-pdp-hero__media {
	position: absolute;
	inset: 0;
}

.nv-pdp-hero__media img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.nv-pdp-hero__body {
	position: relative;
	z-index: 1;
	padding-block: clamp(3rem, 9vw, 7rem);
	max-width: 42rem;
}

.nv-pdp-hero__title {
	font-size: clamp(1.9rem, 4.4vw, 3.25rem);
	font-weight: 500;
	line-height: 1.08;
	margin: 0.75rem 0 0.75rem;
	color: var(--nv-white);
}

.nv-pdp-hero__text {
	margin: 0;
	color: rgba(255, 255, 255, 0.82);
	font-size: clamp(0.95rem, 1.2vw, 1.125rem);
	max-width: 44ch;
}

.nv-pdp-hero__actions {
	display: flex;
	flex-wrap: wrap;
	gap: 0.75rem;
	align-items: center;
	margin-top: 1.75rem;
}

.nv-story__intro {
	max-width: 46rem;
	margin-inline: auto;
	text-align: center;
	font-size: clamp(1.0625rem, 1.8vw, 1.375rem);
	line-height: 1.55;
}

.nv-story__block + .nv-story__block {
	margin-top: clamp(2.5rem, 6vw, 5rem);
}

.nv-featuregrid {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(min(100%, 260px), 1fr));
	gap: clamp(1rem, 2.4vw, 2rem);
}

.nv-feature {
	text-align: center;
}

.nv-feature__media {
	aspect-ratio: 4 / 3;
	overflow: hidden;
	background: var(--nv-alt-2);
	margin-bottom: 1rem;
}

.nv-feature__media img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.nv-feature__title {
	margin: 0 0 0.4rem;
	font-size: 1rem;
	font-weight: 600;
}

.nv-feature__text {
	margin: 0;
	font-size: 0.9375rem;
	color: var(--nv-copy);
}

/* Numbered advantage panels: full-bleed image with an overlaid number. */
.nv-advantages {
	display: flex;
	flex-direction: column;
	gap: clamp(1rem, 2.5vw, 2rem);
}

.nv-advantage {
	position: relative;
	background: var(--nv-ink);
	overflow: hidden;
}

.nv-advantage__media img {
	width: 100%;
	height: clamp(300px, 46vw, 620px);
	object-fit: cover;
}

.nv-advantage__body {
	position: absolute;
	inset: auto 0 0 0;
	padding: clamp(1.5rem, 4vw, 3rem);
	background: linear-gradient(180deg, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.68) 100%);
	color: var(--nv-white);
	max-width: 46rem;
}

.nv-advantage__index {
	display: block;
	font-size: 0.8125rem;
	font-weight: 600;
	letter-spacing: 0.16em;
	color: var(--nv-accent);
	margin-bottom: 0.5rem;
}

.nv-advantage__title {
	margin: 0 0 0.5rem;
	font-size: clamp(1.15rem, 2.2vw, 1.75rem);
	font-weight: 500;
	color: var(--nv-white);
}

.nv-advantage__text {
	margin: 0;
	font-size: 0.9375rem;
	color: rgba(255, 255, 255, 0.85);
}

/* Colourway swatches. */
.nv-swatches {
	display: flex;
	flex-wrap: wrap;
	gap: 0.75rem;
	justify-content: center;
}

.nv-swatch {
	display: inline-flex;
	align-items: center;
	gap: 0.5rem;
	padding: 0.35rem 0.85rem 0.35rem 0.4rem;
	border: 1px solid var(--nv-line);
	border-radius: var(--nv-pill);
	font-size: 0.8125rem;
	color: var(--nv-copy);
	background: none;
	transition: border-color 0.2s var(--nv-ease), color 0.2s var(--nv-ease);
}

.nv-swatch:hover,
.nv-swatch.is-active {
	border-color: var(--nv-ink);
	color: var(--nv-ink);
}

.nv-swatch__dot {
	width: 16px;
	height: 16px;
	border-radius: 50%;
	border: 1px solid rgba(0, 0, 0, 0.12);
}

/* Specification table. */
.nv-specs {
	width: 100%;
	border-collapse: collapse;
	border-top: 1px solid var(--nv-line);
}

.nv-specs tr {
	border-bottom: 1px solid var(--nv-line);
}

.nv-specs th,
.nv-specs td {
	padding: 1rem 0.5rem;
	text-align: left;
	font-size: 0.9375rem;
	vertical-align: top;
}

.nv-specs th {
	width: 34%;
	font-weight: 500;
	color: var(--nv-faint);
}

.nv-specs td {
	font-weight: 500;
	color: var(--nv-ink);
}

/* Article / page body copy. */
.nv-content {
	font-size: 1.0625rem;
	color: var(--nv-copy);
}

.nv-content > * + * {
	margin-top: 1.1rem;
}

.nv-content h2,
.nv-content h3 {
	margin-top: 2.25rem;
	color: var(--nv-ink);
}

.nv-content a {
	color: var(--nv-accent);
	text-decoration: underline;
	text-underline-offset: 3px;
}

.nv-content ul,
.nv-content ol {
	padding-left: 1.25rem;
	list-style: disc;
}

.nv-content ol {
	list-style: decimal;
}

.nv-content li + li {
	margin-top: 0.4rem;
}

.nv-content blockquote {
	margin: 2rem 0;
	padding: 1.25rem 1.75rem;
	border-left: 2px solid var(--nv-ink);
	background: var(--nv-alt);
}

.nv-content table {
	width: 100%;
	border-collapse: collapse;
}

.nv-content th,
.nv-content td {
	padding: 0.7rem 1rem;
	border: 1px solid var(--nv-line);
	text-align: left;
}

.nv-single {
	padding-block: clamp(2.25rem, 5vw, 4rem);
}

.nv-single__thumb {
	margin-bottom: 2rem;
}

.nv-article__meta {
	margin-top: 0.85rem;
	font-size: 0.875rem;
	color: var(--nv-muted);
}

.nv-single__footer {
	margin-top: 2.5rem;
	padding-top: 1.5rem;
	border-top: 1px solid var(--nv-line);
}

.nv-tags {
	display: flex;
	flex-wrap: wrap;
	gap: 0.5rem;
}

.nv-tags a {
	display: inline-block;
	padding: 0.3rem 0.75rem;
	border: 1px solid var(--nv-line);
	border-radius: var(--nv-pill);
	font-size: 0.8125rem;
	color: var(--nv-copy);
}

.nv-tags a:hover {
	border-color: var(--nv-ink);
	color: var(--nv-ink);
}

/* Pagination. */
.nv-pagination {
	margin-top: clamp(2rem, 4vw, 3rem);
}

.nv-pagination ul {
	display: flex;
	flex-wrap: wrap;
	gap: 0.35rem;
	justify-content: center;
}

.nv-pagination a,
.nv-pagination span {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 40px;
	height: 40px;
	padding: 0 0.75rem;
	border: 1px solid var(--nv-line);
	border-radius: var(--nv-pill);
	font-size: 0.8125rem;
	font-weight: 500;
	color: var(--nv-copy);
}

.nv-pagination a:hover {
	border-color: var(--nv-ink);
	color: var(--nv-ink);
}

.nv-pagination .current {
	background: var(--nv-ink);
	border-color: var(--nv-ink);
	color: var(--nv-white);
}

/* Archive filters. */
.nv-filters {
	margin-bottom: clamp(1.5rem, 3vw, 2.5rem);
	border-bottom: 1px solid var(--nv-line);
}

.nv-filters__list {
	display: flex;
	flex-wrap: wrap;
	gap: 0.25rem;
}

.nv-filters__list a,
.nv-filters__list span {
	display: inline-flex;
	align-items: center;
	gap: 0.4rem;
	padding: 0.85rem 1rem;
	font-size: 0.875rem;
	font-weight: 500;
	color: var(--nv-copy);
	border-bottom: 2px solid transparent;
}

.nv-filters__list a:hover {
	color: var(--nv-ink);
}

.nv-filters__list .is-active a,
.nv-filters__list .is-active span {
	color: var(--nv-ink);
	border-bottom-color: var(--nv-ink);
}

.nv-filters__count {
	font-size: 0.75rem;
	color: var(--nv-muted);
}

/* 11. Forms ---------------------------------------------------------------- */

.nv-inquiry {
	padding-block: var(--nv-band-y);
	background: var(--nv-alt);
}

.nv-inquiry--inline {
	padding-block: 0;
	background: none;
}

.nv-inquiry__head {
	margin-bottom: 1.75rem;
}

.nv-inquiry__title {
	font-size: clamp(1.35rem, 2.4vw, 1.85rem);
	margin-bottom: 0.5rem;
}

.nv-inquiry__intro {
	max-width: 58ch;
	color: var(--nv-copy);
}

.nv-form__grid {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(min(100%, 260px), 1fr));
	gap: 1rem 1.25rem;
}

.nv-field {
	display: flex;
	flex-direction: column;
	gap: 0.4rem;
}

.nv-field--full {
	grid-column: 1 / -1;
}

.nv-field__label {
	font-size: 0.8125rem;
	font-weight: 600;
	color: var(--nv-ink);
}

.nv-field__required {
	color: var(--nv-accent);
}

.nv-input {
	width: 100%;
	padding: 0.75rem 0.9rem;
	background: var(--nv-white);
	border: 1px solid var(--nv-line);
	border-radius: var(--nv-radius);
	color: var(--nv-ink);
	font-family: inherit;
	font-size: 1rem;
	transition: border-color 0.2s var(--nv-ease);
}

.nv-input:focus {
	outline: none;
	border-color: var(--nv-ink);
}

.nv-input::placeholder {
	color: var(--nv-muted);
}

textarea.nv-input {
	resize: vertical;
	min-height: 120px;
}

select.nv-input {
	appearance: none;
	background-image: linear-gradient(45deg, transparent 50%, currentColor 50%),
		linear-gradient(135deg, currentColor 50%, transparent 50%);
	background-position: calc(100% - 18px) 50%, calc(100% - 13px) 50%;
	background-size: 5px 5px, 5px 5px;
	background-repeat: no-repeat;
	padding-right: 2.5rem;
}

.nv-field.has-error .nv-input {
	border-color: var(--nv-accent);
}

.nv-field__error {
	font-size: 0.8125rem;
	color: var(--nv-accent);
}

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

.nv-form__footer {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 1rem 1.5rem;
	margin-top: 1.5rem;
}

.nv-form__consent {
	margin: 0;
	max-width: 48ch;
	font-size: 0.8125rem;
	color: var(--nv-faint);
}

.nv-btn__spinner {
	display: none;
	width: 14px;
	height: 14px;
	border: 2px solid currentColor;
	border-right-color: transparent;
	border-radius: 50%;
	animation: nv-spin 0.7s linear infinite;
}

.nv-form.is-loading .nv-btn__spinner {
	display: inline-block;
}

.nv-form.is-loading .nv-btn {
	opacity: 0.75;
	pointer-events: none;
}

@keyframes nv-spin {
	to {
		transform: rotate(360deg);
	}
}

.nv-form__message {
	margin-top: 1.25rem;
	padding: 0.9rem 1.15rem;
	border-radius: var(--nv-radius);
	font-size: 0.9375rem;
}

.nv-form__message.is-success {
	background: #f1f8f2;
	border: 1px solid #bcdfc3;
	color: #1c5b2a;
}

.nv-form__message.is-error {
	background: #fdf1ee;
	border: 1px solid #f3c3b6;
	color: #a1351a;
}

/* Search form. */
.nv-searchform {
	position: relative;
	display: flex;
	align-items: center;
	max-width: 640px;
	margin-inline: auto;
}

.nv-searchform__input {
	width: 100%;
	padding: 0.85rem 3.25rem 0.85rem 1.1rem;
	background: var(--nv-white);
	border: 1px solid var(--nv-line);
	border-radius: var(--nv-radius);
	color: var(--nv-ink);
	font-family: inherit;
	font-size: 1rem;
}

.nv-searchform__input:focus {
	outline: none;
	border-color: var(--nv-ink);
}

.nv-searchform__submit {
	position: absolute;
	right: 5px;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 38px;
	height: 38px;
	background: none;
	border: 0;
	color: var(--nv-ink);
}

/* Contact page. */
.nv-contact {
	display: grid;
	grid-template-columns: 1fr 1.15fr;
	gap: clamp(2rem, 5vw, 4rem);
	padding-block: var(--nv-band-y);
	align-items: start;
}

.nv-contact__list {
	margin-top: 2rem;
	display: flex;
	flex-direction: column;
	gap: 1.25rem;
}

.nv-contact__label {
	display: block;
	font-size: 0.75rem;
	font-weight: 600;
	letter-spacing: 0.1em;
	text-transform: uppercase;
	color: var(--nv-muted);
	margin-bottom: 0.15rem;
}

.nv-contact__list a,
.nv-contact__list address {
	font-size: 1.0625rem;
	font-style: normal;
	color: var(--nv-ink);
}

.nv-contact__list a:hover {
	color: var(--nv-accent);
}

.nv-contact__promises {
	margin-top: 2rem;
	display: flex;
	flex-direction: column;
	gap: 0.5rem;
}

.nv-contact__promises li {
	position: relative;
	padding-left: 1.5rem;
	color: var(--nv-copy);
	font-size: 0.9375rem;
}

.nv-contact__promises li::before {
	content: "";
	position: absolute;
	left: 0;
	top: 0.45em;
	width: 9px;
	height: 5px;
	border-left: 2px solid var(--nv-accent);
	border-bottom: 2px solid var(--nv-accent);
	transform: rotate(-45deg);
}

/* 12. Footer and overlays -------------------------------------------------- */

.nv-footer {
	background: var(--nv-ink);
	color: var(--nv-muted);
	padding-top: clamp(2.5rem, 5vw, 4rem);
	font-size: 0.8125rem;
}

.nv-footer__cols {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(160px, 1fr));
	gap: 2rem;
	padding-bottom: clamp(2rem, 4vw, 3rem);
}

.nv-footer__heading {
	margin: 0 0 0.9rem;
	font-size: 0.8125rem;
	font-weight: 600;
	color: var(--nv-muted);
}

.nv-footer__links {
	display: flex;
	flex-direction: column;
	gap: 0.5rem;
}

.nv-footer__links a {
	color: var(--nv-muted);
}

.nv-footer__links a:hover {
	color: var(--nv-white);
}

.nv-footer__subscribe p {
	margin: 0 0 0.85rem;
	color: var(--nv-muted);
	line-height: 1.5;
}

.nv-footer__subscribe-form {
	position: relative;
	display: flex;
	align-items: center;
}

.nv-footer__subscribe-form input[type="email"] {
	width: 100%;
	padding: 0.7rem 2.75rem 0.7rem 0.9rem;
	background: transparent;
	border: 1px solid #3a3a3a;
	border-radius: var(--nv-radius);
	color: var(--nv-white);
	font-family: inherit;
	font-size: 0.875rem;
}

.nv-footer__subscribe-form input[type="email"]::placeholder {
	color: #777777;
}

.nv-footer__subscribe-form input[type="email"]:focus {
	outline: none;
	border-color: var(--nv-white);
}

.nv-footer__subscribe-form button {
	position: absolute;
	right: 4px;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 34px;
	height: 34px;
	background: none;
	border: 0;
	color: var(--nv-white);
}

.nv-footer__note {
	padding-bottom: 1.75rem;
	font-size: 0.75rem;
	line-height: 1.6;
	color: #8c8c8c;
}

.nv-footer__note p + p {
	margin-top: 0.75rem;
}

.nv-footer__note strong {
	color: #b5b5b5;
}

.nv-footer__bottom {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: space-between;
	gap: 1.25rem;
	padding-block: 1.5rem;
	border-top: 1px solid #262626;
}

.nv-footer__copy {
	margin: 0;
	font-size: 0.75rem;
	color: var(--nv-faint);
}

.nv-legal-menu {
	display: flex;
	flex-wrap: wrap;
	gap: 1.25rem;
}

.nv-legal-menu a {
	font-size: 0.75rem;
	color: var(--nv-faint);
}

.nv-legal-menu a:hover {
	color: var(--nv-white);
}

.nv-footer__contact {
	display: flex;
	flex-wrap: wrap;
	gap: 2.5rem;
	padding-bottom: 1.75rem;
}

.nv-footer__contact-group p {
	margin: 0 0 0.35rem;
	font-size: 0.75rem;
	color: #8c8c8c;
}

.nv-footer__contact-group strong {
	display: block;
	margin-bottom: 0.5rem;
	font-size: 0.8125rem;
	color: var(--nv-muted);
}

.nv-footer__contact-group a {
	color: #b5b5b5;
}

.nv-footer__contact-group a:hover {
	color: var(--nv-white);
}

.nv-footer__meta {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: space-between;
	gap: 1.25rem;
	padding-block: 1.5rem;
	border-top: 1px solid #262626;
}

.nv-social {
	display: flex;
	flex-wrap: wrap;
	gap: 0.75rem;
	align-items: center;
}

.nv-social__link {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 34px;
	height: 34px;
	border: 1px solid #3a3a3a;
	border-radius: 50%;
	color: var(--nv-muted);
}

.nv-social__link:hover {
	border-color: var(--nv-white);
	color: var(--nv-white);
}

.nv-icon--facebook { -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M14 9h3V6h-3c-2.2 0-4 1.8-4 4v2H8v3h2v7h3v-7h3l1-3h-4v-2c0-.6.4-1 1-1z'/%3E%3C/svg%3E"); mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M14 9h3V6h-3c-2.2 0-4 1.8-4 4v2H8v3h2v7h3v-7h3l1-3h-4v-2c0-.6.4-1 1-1z'/%3E%3C/svg%3E"); }
.nv-icon--instagram { -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 2c2.7 0 3 0 4.1.1 1.1 0 1.8.2 2.4.5.7.2 1.2.6 1.7 1.1s.9 1 1.1 1.7c.3.6.4 1.3.5 2.4C21.9 9 22 9.3 22 12s0 3-.1 4.1c0 1.1-.2 1.8-.5 2.4-.2.7-.6 1.2-1.1 1.7s-1 .9-1.7 1.1c-.6.3-1.3.4-2.4.5-1.1 0-1.4.1-4.1.1s-3 0-4.1-.1c-1.1 0-1.8-.2-2.4-.5-.7-.2-1.2-.6-1.7-1.1s-.9-1-1.1-1.7c-.3-.6-.4-1.3-.5-2.4C2.1 15 2 14.7 2 12s0-3 .1-4.1c0-1.1.2-1.8.5-2.4.2-.7.6-1.2 1.1-1.7s1-.9 1.7-1.1c.6-.3 1.3-.4 2.4-.5C9 2 9.3 2 12 2zm0 5a5 5 0 100 10 5 5 0 000-10zm0 8.2a3.2 3.2 0 110-6.4 3.2 3.2 0 010 6.4zm5.2-8.4a1.2 1.2 0 11-2.4 0 1.2 1.2 0 012.4 0z'/%3E%3C/svg%3E"); mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 2c2.7 0 3 0 4.1.1 1.1 0 1.8.2 2.4.5.7.2 1.2.6 1.7 1.1s.9 1 1.1 1.7c.3.6.4 1.3.5 2.4C21.9 9 22 9.3 22 12s0 3-.1 4.1c0 1.1-.2 1.8-.5 2.4-.2.7-.6 1.2-1.1 1.7s-1 .9-1.7 1.1c-.6.3-1.3.4-2.4.5-1.1 0-1.4.1-4.1.1s-3 0-4.1-.1c-1.1 0-1.8-.2-2.4-.5-.7-.2-1.2-.6-1.7-1.1s-.9-1-1.1-1.7c-.3-.6-.4-1.3-.5-2.4C2.1 15 2 14.7 2 12s0-3 .1-4.1c0-1.1.2-1.8.5-2.4.2-.7.6-1.2 1.1-1.7s1-.9 1.7-1.1c.6-.3 1.3-.4 2.4-.5C9 2 9.3 2 12 2zm0 5a5 5 0 100 10 5 5 0 000-10zm0 8.2a3.2 3.2 0 110-6.4 3.2 3.2 0 010 6.4zm5.2-8.4a1.2 1.2 0 11-2.4 0 1.2 1.2 0 012.4 0z'/%3E%3C/svg%3E"); }
.nv-icon--youtube { -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M21.6 7.2s-.2-1.4-.8-2c-.8-.8-1.6-.8-2-.9C16.8 4.1 12 4.1 12 4.1h0s-4.8 0-6.8.2c-.4 0-1.2 0-2 .9-.6.6-.8 2-.8 2S2.2 8.8 2.2 10.5v1.6c0 1.6.2 3.3.2 3.3s.2 1.4.8 2c.8.8 1.8.8 2.2.9 1.6.1 6.6.2 6.6.2s4.8 0 6.8-.2c.4 0 1.2 0 2-.9.6-.6.8-2 .8-2s.2-1.6.2-3.3v-1.6c0-1.6-.2-3.3-.2-3.3zM9.9 14.1V8.6l5.4 2.8-5.4 2.7z'/%3E%3C/svg%3E"); mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M21.6 7.2s-.2-1.4-.8-2c-.8-.8-1.6-.8-2-.9C16.8 4.1 12 4.1 12 4.1h0s-4.8 0-6.8.2c-.4 0-1.2 0-2 .9-.6.6-.8 2-.8 2S2.2 8.8 2.2 10.5v1.6c0 1.6.2 3.3.2 3.3s.2 1.4.8 2c.8.8 1.8.8 2.2.9 1.6.1 6.6.2 6.6.2s4.8 0 6.8-.2c.4 0 1.2 0 2-.9.6-.6.8-2 .8-2s.2-1.6.2-3.3v-1.6c0-1.6-.2-3.3-.2-3.3zM9.9 14.1V8.6l5.4 2.8-5.4 2.7z'/%3E%3C/svg%3E"); }
.nv-icon--twitter { -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M18.2 3h3.3l-7.2 8.2L22 21h-6.6l-4.6-6-5.3 6H2.2l7.7-8.8L2 3h6.8l4.2 5.5L18.2 3zm-1.2 16h1.8L7 4.8H5.1L17 19z'/%3E%3C/svg%3E"); mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M18.2 3h3.3l-7.2 8.2L22 21h-6.6l-4.6-6-5.3 6H2.2l7.7-8.8L2 3h6.8l4.2 5.5L18.2 3zm-1.2 16h1.8L7 4.8H5.1L17 19z'/%3E%3C/svg%3E"); }
.nv-icon--linkedin { -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M4.98 3.5a2.5 2.5 0 11-.02 5 2.5 2.5 0 01.02-5zM3 9h4v12H3zM9 9h3.8v1.7h.05c.53-.95 1.8-1.95 3.7-1.95 3.96 0 4.7 2.5 4.7 5.75V21h-4v-5.5c0-1.3-.02-3-1.85-3-1.85 0-2.13 1.42-2.13 2.9V21H9z'/%3E%3C/svg%3E"); mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M4.98 3.5a2.5 2.5 0 11-.02 5 2.5 2.5 0 01.02-5zM3 9h4v12H3zM9 9h3.8v1.7h.05c.53-.95 1.8-1.95 3.7-1.95 3.96 0 4.7 2.5 4.7 5.75V21h-4v-5.5c0-1.3-.02-3-1.85-3-1.85 0-2.13 1.42-2.13 2.9V21H9z'/%3E%3C/svg%3E"); }
.nv-icon--tiktok { -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M16.5 2h-3v13a3 3 0 11-3-3c.3 0 .7 0 1 .1V9a6 6 0 100 6V8.5A6.5 6.5 0 0020 12V9a5 5 0 01-3.5-7z'/%3E%3C/svg%3E"); mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M16.5 2h-3v13a3 3 0 11-3-3c.3 0 .7 0 1 .1V9a6 6 0 100 6V8.5A6.5 6.5 0 0020 12V9a5 5 0 01-3.5-7z'/%3E%3C/svg%3E"); }
.nv-icon--whatsapp { -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 2a10 10 0 00-8.7 15L2 22l5.2-1.3A10 10 0 1012 2zm0 18a8 8 0 01-4.1-1.1l-.3-.2-3 .8.8-2.9-.2-.3A8 8 0 1112 20zm4.5-5.8c-.2-.1-1.4-.7-1.6-.8-.2-.1-.4-.1-.5.1l-.7.9c-.1.2-.3.2-.4.1a6.5 6.5 0 01-3.3-2.9c-.1-.2 0-.4.1-.5l.5-.6c.1-.2.1-.3 0-.5l-.7-1.6c-.2-.4-.4-.4-.5-.4h-.5c-.2 0-.5.1-.7.4-.3.3-.9 1-.9 2.3s1 2.6 1.1 2.8c.1.2 1.9 3 4.7 4.1 1.7.7 2.3.8 3.1.6.5-.1 1.4-.6 1.6-1.2.2-.6.2-1.1.1-1.2z'/%3E%3C/svg%3E"); mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 2a10 10 0 00-8.7 15L2 22l5.2-1.3A10 10 0 1012 2zm0 18a8 8 0 01-4.1-1.1l-.3-.2-3 .8.8-2.9-.2-.3A8 8 0 1112 20zm4.5-5.8c-.2-.1-1.4-.7-1.6-.8-.2-.1-.4-.1-.5.1l-.7.9c-.1.2-.3.2-.4.1a6.5 6.5 0 01-3.3-2.9c-.1-.2 0-.4.1-.5l.5-.6c.1-.2.1-.3 0-.5l-.7-1.6c-.2-.4-.4-.4-.5-.4h-.5c-.2 0-.5.1-.7.4-.3.3-.9 1-.9 2.3s1 2.6 1.1 2.8c.1.2 1.9 3 4.7 4.1 1.7.7 2.3.8 3.1.6.5-.1 1.4-.6 1.6-1.2.2-.6.2-1.1.1-1.2z'/%3E%3C/svg%3E"); }
.nv-icon--wechat { -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M9 3C5.1 3 2 5.7 2 9c0 1.9 1 3.5 2.7 4.6l-.7 2.2 2.5-1.3c.8.2 1.6.3 2.5.3h.4c-.2-.5-.3-1.1-.3-1.7 0-3.3 3.1-5.9 6.9-5.9h.6C15.6 4.9 12.6 3 9 3zm-2.6 3.4a.9.9 0 110 1.8.9.9 0 010-1.8zm5.2 0a.9.9 0 110 1.8.9.9 0 010-1.8zM22 13.1c0-2.7-2.7-4.9-5.9-4.9S10.2 10.4 10.2 13.1s2.7 4.9 5.9 4.9c.7 0 1.4-.1 2-.3l2 1-.6-1.8c1.5-.9 2.5-2.3 2.5-3.8zm-7.8-1.5a.75.75 0 110 1.5.75.75 0 010-1.5zm4.2 0a.75.75 0 110 1.5.75.75 0 010-1.5z'/%3E%3C/svg%3E"); mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M9 3C5.1 3 2 5.7 2 9c0 1.9 1 3.5 2.7 4.6l-.7 2.2 2.5-1.3c.8.2 1.6.3 2.5.3h.4c-.2-.5-.3-1.1-.3-1.7 0-3.3 3.1-5.9 6.9-5.9h.6C15.6 4.9 12.6 3 9 3zm-2.6 3.4a.9.9 0 110 1.8.9.9 0 010-1.8zm5.2 0a.9.9 0 110 1.8.9.9 0 010-1.8zM22 13.1c0-2.7-2.7-4.9-5.9-4.9S10.2 10.4 10.2 13.1s2.7 4.9 5.9 4.9c.7 0 1.4-.1 2-.3l2 1-.6-1.8c1.5-.9 2.5-2.3 2.5-3.8zm-7.8-1.5a.75.75 0 110 1.5.75.75 0 010-1.5zm4.2 0a.75.75 0 110 1.5.75.75 0 010-1.5z'/%3E%3C/svg%3E"); }

.nv-footer__locale {
	display: flex;
	align-items: center;
	gap: 0.75rem;
}

.nv-footer .nv-lang__toggle {
	color: var(--nv-muted);
}

.nv-footer .nv-lang__toggle:hover {
	color: var(--nv-white);
}

.nv-footer .nv-lang__list {
	top: auto;
	bottom: calc(100% + 6px);
	background: #1a1a1a;
	border-color: #333333;
}

.nv-footer .nv-lang__list a {
	color: var(--nv-muted);
}

.nv-footer .nv-lang__list a:hover {
	background: #262626;
	color: var(--nv-white);
}

/* Overlays ---------------------------------------------------------------- */

.nv-age-gate {
	position: fixed;
	inset: 0;
	z-index: 200;
	display: flex;
	align-items: center;
	justify-content: center;
	padding: 1.5rem;
	background: rgba(0, 0, 0, 0.86);
	backdrop-filter: blur(6px);
	-webkit-backdrop-filter: blur(6px);
}

.nv-age-gate__dialog {
	width: 100%;
	max-width: 520px;
	padding: clamp(1.75rem, 4vw, 2.75rem);
	background: var(--nv-white);
	border-radius: var(--nv-radius);
	text-align: center;
}

.nv-age-gate__title {
	font-size: clamp(1.25rem, 2.6vw, 1.75rem);
	margin-bottom: 0.75rem;
}

.nv-age-gate__text {
	color: var(--nv-copy);
	font-size: 0.9375rem;
}

.nv-age-gate__actions {
	display: flex;
	flex-wrap: wrap;
	gap: 0.75rem;
	justify-content: center;
	margin-top: 1.75rem;
}

.nv-cookie {
	position: fixed;
	left: 0;
	right: 0;
	bottom: 0;
	z-index: 150;
	background: var(--nv-ink);
	color: var(--nv-white);
	padding-block: 1rem;
}

.nv-cookie__inner {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: space-between;
	gap: 1rem;
}

.nv-cookie__text {
	margin: 0;
	max-width: 70ch;
	font-size: 0.8125rem;
	color: var(--nv-muted);
}

.nv-to-top {
	position: fixed;
	right: 1.25rem;
	bottom: 1.25rem;
	z-index: 100;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 42px;
	height: 42px;
	background: var(--nv-white);
	border: 1px solid var(--nv-line);
	border-radius: 50%;
	color: var(--nv-ink);
}

.nv-to-top::before {
	content: "";
	width: 8px;
	height: 8px;
	border-top: 1.5px solid currentColor;
	border-left: 1.5px solid currentColor;
	transform: rotate(45deg) translate(1px, 1px);
}

.nv-to-top:hover {
	background: var(--nv-ink);
	border-color: var(--nv-ink);
	color: var(--nv-white);
}

.nv-404 {
	padding-block: clamp(4rem, 12vw, 8rem);
	text-align: center;
}

.nv-404__inner {
	max-width: 620px;
	margin-inline: auto;
}

.nv-404__text {
	color: var(--nv-copy);
}

.nv-404__search {
	display: flex;
	justify-content: center;
	margin: 2rem 0;
}

.nv-404__actions {
	display: flex;
	flex-wrap: wrap;
	gap: 0.75rem;
	justify-content: center;
}

/* 13. Responsive ----------------------------------------------------------- */

@media (max-width: 1023px) {
	.nv-header__inner {
		grid-template-columns: auto 1fr;
	}

	/* Below the sticky header (z-index 90) so the logo and the close button
	   stay clickable while the panel is open. */
	.nv-nav {
		position: fixed;
		inset: 0;
		z-index: 80;
		display: flex;
		flex-direction: column;
		align-items: stretch;
		justify-self: stretch;
		padding: calc(var(--nv-header-h) + 1.75rem) var(--nv-gutter) 3rem;
		background: var(--nv-white);
		overflow-y: auto;
		transform: translateX(-100%);
		transition: transform 0.32s var(--nv-ease);
	}

	.nv-nav.is-open {
		transform: translateX(0);
	}

	.nv-menu {
		flex-direction: column;
		align-items: stretch;
		gap: 0;
	}

	.nv-menu > li {
		border-bottom: 1px solid var(--nv-line);
	}

	.nv-menu > li > a {
		padding: 1rem 0;
		font-size: 0.9375rem;
	}

	.nv-menu .sub-menu {
		position: static;
		opacity: 1;
		visibility: visible;
		transform: none;
		box-shadow: none;
		border: 0;
		padding: 0 0 0.75rem 0.75rem;
	}

	.nv-menu .sub-menu a {
		padding: 0.5rem 0;
	}

	.nv-nav__extras {
		display: flex;
		flex-direction: column;
		align-items: stretch;
		gap: 1rem;
		margin-top: 1.5rem;
	}

	.nv-nav__extras .nv-btn {
		width: 100%;
	}

	.nv-lang__list {
		right: auto;
		left: 0;
	}

	.nv-split,
	.nv-contact {
		grid-template-columns: 1fr;
	}

	.nv-productnav__links {
		display: none;
	}
}

@media (max-width: 767px) {
	:root {
		--nv-header-h: 56px;
		--nv-alert-h: 46px;
	}

	.nv-hero__media--desktop {
		display: none;
	}

	.nv-hero__media--mobile {
		display: block;
	}

	.nv-hero__slide {
		min-height: clamp(360px, 74vh, 520px);
	}

	.nv-hero__arrows {
		display: none;
	}

	.nv-banner {
		flex-basis: 85%;
	}

	.nv-specs th,
	.nv-specs td {
		display: block;
		width: 100%;
		padding-block: 0.25rem;
	}

	.nv-specs tr {
		display: block;
		padding-block: 0.75rem;
	}

	.nv-specs th {
		padding-bottom: 0;
	}

	.nv-cookie__inner {
		flex-direction: column;
		align-items: flex-start;
	}

	.nv-form__footer {
		flex-direction: column;
		align-items: stretch;
	}

	.nv-form__footer .nv-btn {
		width: 100%;
	}

	.nv-footer__bottom,
	.nv-footer__meta {
		flex-direction: column;
		align-items: flex-start;
	}
}

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

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

@media print {
	.nv-header,
	.nv-footer,
	.nv-alert,
	.nv-cookie,
	.nv-age-gate,
	.nv-to-top,
	.nv-inquiry,
	.nv-productnav {
		display: none !important;
	}
}

/* 14. Refinements measured against the reference --------------------------- */

/*
 * Light hero: the reference campaign hero is a centred composition on a pale
 * band, not a full-bleed dark photograph. A section with background "white" or
 * "light grey" gets this treatment; a section set to "black" keeps the
 * full-bleed photographic version above.
 */
.nv-hero--light {
	background: var(--nv-alt);
	color: var(--nv-ink);
}

.nv-hero--light .nv-hero__slide {
	display: block;
	min-height: 0;
	padding-block: clamp(2.5rem, 6vw, 4.5rem) 0;
}

.nv-hero--light .nv-hero__media {
	position: static;
	margin-top: clamp(1.5rem, 4vw, 2.75rem);
}

.nv-hero--light .nv-hero__media img {
	width: 100%;
	height: auto;
	max-height: 480px;
	object-fit: cover;
}

.nv-hero--light .nv-hero__body {
	max-width: 56rem;
	margin-inline: auto;
	text-align: center;
}

.nv-hero--light .nv-hero__title {
	color: var(--nv-ink);
	margin-inline: auto;
	max-width: 24ch;
}

.nv-hero--light .nv-hero__text {
	color: var(--nv-copy);
	margin-inline: auto;
}

.nv-hero--light .nv-hero__actions {
	justify-content: center;
}

.nv-hero--light .nv-hero__cta {
	border-color: var(--nv-ink);
	color: var(--nv-ink);
}

.nv-hero--light .nv-hero__cta:hover {
	background: var(--nv-ink);
	color: var(--nv-white);
}

.nv-hero--light .nv-hero__link {
	color: var(--nv-ink);
}

.nv-hero--light .nv-hero__link:hover {
	color: var(--nv-ink);
}

.nv-hero--light .nv-hero__dots {
	position: static;
	justify-content: center;
	margin-top: 1.75rem;
	padding-bottom: 1.5rem;
}

.nv-hero--light .nv-hero__dot {
	background: rgba(0, 0, 0, 0.18);
}

.nv-hero--light .nv-hero__dot.is-active {
	background: var(--nv-ink);
}

.nv-hero--light .nv-hero__arrows {
	display: none;
}

@media (max-width: 767px) {
	.nv-hero--light .nv-hero__media img {
		max-height: 320px;
	}
}

/*
 * Technology pillars: solid white cards with a soft shadow sitting on the grey
 * band, copy left-aligned inside, title in caps. The section heading stays
 * centred with a lot of air around it.
 */
.nv-feature--card {
	text-align: left;
	background: var(--nv-white);
	box-shadow: 0 12px 32px rgba(0, 0, 0, 0.07);
	padding-bottom: 1.5rem;
}

.nv-feature--card .nv-feature__media {
	margin-bottom: 0;
}

.nv-feature--card .nv-feature__body {
	padding: 1.35rem 1.4rem 0;
}

.nv-feature--card .nv-feature__title {
	margin: 0 0 0.55rem;
	font-size: 0.9375rem;
	font-weight: 700;
	letter-spacing: 0.06em;
	text-transform: uppercase;
}

.nv-feature--card .nv-feature__title a:hover {
	color: var(--nv-accent);
}

.nv-feature--card .nv-feature__text {
	font-size: 0.875rem;
	line-height: 1.6;
	color: var(--nv-copy);
}

/* Quieter centred section heading with deliberate breathing room. */
.nv-band__head--airy {
	max-width: 46rem;
	margin-bottom: clamp(2.5rem, 6vw, 4.5rem);
}

/* Bold all-caps sign-off under the mission paragraph. */
.nv-mission__signoff {
	margin: 1.75rem 0 0;
	font-size: clamp(1rem, 1.9vw, 1.5rem);
	font-weight: 700;
	letter-spacing: 0.12em;
	text-transform: uppercase;
	color: var(--nv-ink);
}

/* Chevron on nav items that open a dropdown. */
.nv-menu > li.menu-item-has-children > a::before {
	content: "";
	order: 2;
	width: 6px;
	height: 6px;
	margin-left: 0.4rem;
	border-right: 1.5px solid currentColor;
	border-bottom: 1.5px solid currentColor;
	transform: rotate(45deg) translate(-1px, -1px);
	transition: transform 0.2s var(--nv-ease);
}

.nv-menu > li.is-open > a::before {
	transform: rotate(-135deg) translate(-2px, -2px);
}

/* The mobile disclosure control is injected by main.js. */
.nv-subtoggle {
	display: none;
}

/*
 * The drawer only exists below 1024px, so the button that opens it must only
 * exist below 1024px too. Left visible on desktop it was clickable, set
 * body{overflow:hidden} and produced no panel at all - a frozen, unscrollable
 * page with no menu.
 */
@media (min-width: 1024px) {
	.nv-burger {
		display: none;
	}
}

@media (max-width: 1023px) {
	.nv-menu > li.menu-item-has-children {
		position: relative;
	}

	.nv-subtoggle {
		display: inline-flex;
		align-items: center;
		justify-content: center;
		position: absolute;
		top: 0;
		right: 0;
		width: 48px;
		height: 48px;
		padding: 0;
		background: none;
		border: 0;
		color: var(--nv-ink);
	}

	.nv-subtoggle::before {
		content: "";
		width: 8px;
		height: 8px;
		border-right: 1.5px solid currentColor;
		border-bottom: 1.5px solid currentColor;
		transform: rotate(45deg) translate(-2px, -2px);
		transition: transform 0.25s var(--nv-ease);
	}

	.nv-menu > li.is-open > .nv-subtoggle::before {
		transform: rotate(-135deg) translate(-2px, -2px);
	}

	/* Collapsed by default on small screens; the toggle opens one branch. */
	.nv-menu .sub-menu {
		display: none;
	}

	.nv-menu > li.is-open > .sub-menu {
		display: block;
	}

	.nv-menu > li > a {
		padding-right: 3rem;
	}
}

/* Email-only capture: one field plus the submit arrow. */
.nv-capture {
	max-width: 30rem;
	margin-inline: auto;
}

.nv-capture__row {
	display: flex;
	align-items: center;
	gap: 0.5rem;
}

.nv-capture__field {
	position: relative;
	flex: 1 1 auto;
	display: flex;
	align-items: center;
}

.nv-capture__input {
	width: 100%;
	padding: 0.8rem 3rem 0.8rem 1rem;
	background: var(--nv-white);
	border: 1px solid var(--nv-line);
	border-radius: var(--nv-radius);
	color: var(--nv-ink);
	font-family: inherit;
	font-size: 1rem;
}

.nv-capture__input:focus {
	outline: none;
	border-color: var(--nv-ink);
}

.nv-capture__submit {
	position: absolute;
	right: 4px;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 36px;
	height: 36px;
	background: var(--nv-ink);
	border: 0;
	border-radius: var(--nv-radius);
	color: var(--nv-white);
}

.nv-capture__submit:hover {
	background: var(--nv-accent);
}

.nv-capture__submit::before {
	content: "";
	width: 8px;
	height: 8px;
	border-top: 1.5px solid currentColor;
	border-right: 1.5px solid currentColor;
	transform: rotate(45deg) translate(-2px, -2px);
}

.nv-capture.is-loading .nv-capture__submit {
	opacity: 0.6;
	pointer-events: none;
}

.nv-capture__message {
	margin-top: 0.85rem;
	font-size: 0.875rem;
	text-align: center;
}

.nv-capture__message.is-success {
	color: #1c5b2a;
}

.nv-capture__message.is-error {
	color: var(--nv-accent-dark);
}

/* Footer variant sits on black, so the field inverts. */
.nv-footer .nv-capture__input {
	background: transparent;
	border-color: #3a3a3a;
	color: var(--nv-white);
}

.nv-footer .nv-capture__input::placeholder {
	color: #777777;
}

.nv-footer .nv-capture__input:focus {
	border-color: var(--nv-white);
}

.nv-footer .nv-capture__submit {
	background: var(--nv-white);
	color: var(--nv-ink);
}

.nv-footer .nv-capture__submit:hover {
	background: var(--nv-accent);
	color: var(--nv-white);
}

.nv-footer .nv-capture__message.is-success {
	color: #7fd39a;
}

.nv-footer .nv-capture__message.is-error {
	color: #ff9b7d;
}

/* 15. Promo grid: edge-to-edge image panels -------------------------------- */

.nv-promogrid {
	display: grid;
	grid-template-columns: 1fr;
	gap: 2px;
	background: var(--nv-white);
}

@media (min-width: 768px) {
	.nv-promogrid--2 {
		grid-template-columns: repeat(2, 1fr);
	}

	.nv-promogrid--3 {
		grid-template-columns: repeat(3, 1fr);
	}

	.nv-promogrid--4 {
		grid-template-columns: repeat(4, 1fr);
	}
}

.nv-panel {
	position: relative;
	display: flex;
	flex-direction: column;
	overflow: hidden;
	background: var(--nv-ink);
	min-height: clamp(300px, 32vw, 480px);
}

.nv-panel__media {
	position: absolute;
	inset: 0;
	z-index: 0;
}

.nv-panel__media img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	transition: transform 0.9s var(--nv-ease);
}

.nv-panel:hover .nv-panel__media img {
	transform: scale(1.04);
}

/* Scrim only across the top, where the copy sits. */
.nv-panel::after {
	content: "";
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	height: 60%;
	z-index: 1;
	pointer-events: none;
	background: linear-gradient(180deg, rgba(0, 0, 0, 0.55) 0%, rgba(0, 0, 0, 0) 100%);
}

.nv-panel__body {
	position: relative;
	z-index: 2;
	padding: clamp(1.5rem, 3vw, 2.5rem) clamp(1rem, 2.5vw, 2rem);
	text-align: center;
	color: var(--nv-white);
}

.nv-panel__label {
	display: block;
	margin-bottom: 0.3rem;
	font-size: clamp(1.25rem, 2.4vw, 2rem);
	font-weight: 600;
	line-height: 1.1;
	color: var(--nv-white);
}

.nv-panel__title {
	margin: 0 0 0.75rem;
	font-size: clamp(0.9375rem, 1.4vw, 1.125rem);
	font-weight: 400;
	line-height: 1.35;
	color: var(--nv-white);
}

.nv-panel__link {
	display: inline-flex;
	align-items: center;
	gap: 0.3rem;
	font-size: 0.9375rem;
	font-weight: 500;
	color: var(--nv-white);
	border-bottom: 1px solid transparent;
	padding-bottom: 1px;
}

.nv-panel:hover .nv-panel__link {
	border-bottom-color: currentColor;
}

.nv-panel__cover {
	position: absolute;
	inset: 0;
	z-index: 3;
}

/* Footer subscribe button: white square with a paper plane, as on the
   reference footer. The bottom-of-page capture keeps the inverted treatment. */
.nv-capture__submit::before {
	content: "";
	width: 15px;
	height: 15px;
	background-color: currentColor;
	-webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M2 21l20-9L2 3v7l14 2-14 2z'/%3E%3C/svg%3E");
	mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M2 21l20-9L2 3v7l14 2-14 2z'/%3E%3C/svg%3E");
	-webkit-mask-repeat: no-repeat;
	mask-repeat: no-repeat;
	-webkit-mask-position: center;
	mask-position: center;
	-webkit-mask-size: contain;
	mask-size: contain;
}

.nv-capture__submit {
	border-radius: 2px;
}

.nv-footer .nv-capture__submit {
	background: var(--nv-white);
	color: var(--nv-ink);
}

.nv-footer .nv-capture__input {
	border-radius: 2px;
}

/* Footer subscribe column is narrower than a link column. */
.nv-footer__subscribe {
	min-width: 220px;
}
