/* Generated by tools/build_plugin.py from the preview stylesheet: every rule is
   scoped to .nsvh-page so it cannot reach the theme's header or footer.
   Edit assets/css/page.css in the preview and rebuild; do not edit this file. */

/* Theme neutralisation. The page sets its typography on the wrapper and lets it
   inherit; a theme that styles bare elements would otherwise win on everything the page
   does not name explicitly. Same specificity as the page's own rules and placed first,
   so every real rule below still overrides this. */
.nsvh-page.nsvh-page {
	font-weight: 400;
	font-style: normal;
	letter-spacing: normal;
	text-align: left;
	text-transform: none;
}

.nsvh-page.nsvh-page h1,
.nsvh-page.nsvh-page h2,
.nsvh-page.nsvh-page h3,
.nsvh-page.nsvh-page p,
.nsvh-page.nsvh-page ul,
.nsvh-page.nsvh-page li,
.nsvh-page.nsvh-page a,
.nsvh-page.nsvh-page button,
.nsvh-page.nsvh-page input,
.nsvh-page.nsvh-page textarea,
.nsvh-page.nsvh-page label,
.nsvh-page.nsvh-page summary {
	font: inherit;
	color: inherit;
	letter-spacing: inherit;
	text-transform: none;
}

/* Northwoods Signature Vacation Homes — property management landing page.
   The inquiry form is still a styled preview: ActiveCampaign's embed replaces the
   fields in both the inline card and the modal, and inherits these styles. */

/* Both faces are served from this site rather than fonts.googleapis.com: that request
   was measured blocking the first paint for 751 ms, and it also sends every visitor's
   IP to a third party. Files are the latin subsets, SIL OFL, licences in assets/fonts/. */

@font-face {
	font-family: Oswald;
	font-style: normal;
	/* One variable file covers the 400/500/600 the page uses, so it is a single request. */
	font-weight: 400 600;
	font-display: swap;
	src: url('../fonts/oswald-latin-var.woff2') format('woff2');
	unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

@font-face {
	font-family: Lato;
	font-style: normal;
	font-weight: 400;
	font-display: swap;
	src: url('../fonts/lato-latin-400.woff2') format('woff2');
	unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

/* Nothing on the page is bold today, but the ActiveCampaign embed emits its own markup
   in stage 3; this keeps a real bold available instead of a synthesised one. */
@font-face {
	font-family: Lato;
	font-style: normal;
	font-weight: 700;
	font-display: swap;
	src: url('../fonts/lato-latin-700.woff2') format('woff2');
	unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

:root {
	/* Sampled from the logo file so the logo tile melts into the header bar. */
	--brand: #007072;
	--brand-dark: #005c5e;
	--brand-deep: #003f40;
	--accent: #0dbdad;
	--ink: #1d1d22;
	--ink-soft: #4c5457;
	--line: #d9e5e4;
	--paper: #ffffff;
	--tint: #f1f7f6;
	--radius: 10px;
	--wrap: 1180px;
	--z-sticky: 90;
	--z-modal: 100;
}

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

html {
	scroll-behavior: smooth;
	/* Reserve the scrollbar track permanently: locking body scroll for the modal used to
	   remove it, and the whole page jumped sideways as it reflowed wider. */
	scrollbar-gutter: stable;
}

/* Without JS the CTA is a real anchor to a section 10,000 px down; smooth-scrolling that
   distance is exactly the motion someone asking for less of it does not want. */
@media (prefers-reduced-motion: reduce) {
	html {
		scroll-behavior: auto;
	}
}

/* The browser default is a thin near-black ring, which is invisible against the teal
   header and the accent buttons. One ring for light surfaces, white on the dark ones. */
.nsvh-page.nsvh-page :focus-visible {
	outline: 3px solid var(--brand-dark);
	outline-offset: 2px;
}

.nsvh-page.nsvh-page .topbar a:focus-visible,
.nsvh-page.nsvh-page .siteheader a:focus-visible,
.nsvh-page.nsvh-page .hero .btn:focus-visible,
.nsvh-page.nsvh-page .finalcta .btn:focus-visible,
.nsvh-page.nsvh-page .sitefooter a:focus-visible {
	outline-color: #fff;
}

.nsvh-page.nsvh-page {
	margin: 0;
	font-family: Lato, "Segoe UI", system-ui, sans-serif;
	font-size: 17px;
	line-height: 1.62;
	color: var(--ink);
	background: var(--paper);
	-webkit-font-smoothing: antialiased;
}

.nsvh-page.nsvh-page h1,
.nsvh-page.nsvh-page h2,
.nsvh-page.nsvh-page h3 {
	font-family: Oswald, "Arial Narrow", sans-serif;
	font-weight: 500;
	line-height: 1.14;
	margin: 0 0 .6em;
	letter-spacing: .01em;
	/* Several of his headings run long enough to leave one word on the last line. */
	text-wrap: balance;
}

.nsvh-page.nsvh-page h1 {
	font-size: clamp(2.1rem, 4.4vw, 3.35rem);
}

.nsvh-page.nsvh-page h2 {
	font-size: clamp(1.65rem, 3vw, 2.4rem);
}

.nsvh-page.nsvh-page h3 {
	font-size: clamp(1.15rem, 1.6vw, 1.4rem);
}

.nsvh-page.nsvh-page p {
	margin: 0 0 1.05em;
	text-wrap: pretty;
}

.nsvh-page.nsvh-page a {
	color: var(--brand);
}

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

.nsvh-page.nsvh-page .wrap {
	width: 100%;
	max-width: var(--wrap);
	margin-inline: auto;
	padding-inline: 24px;
}

/* ---- Site frame ---- */

.nsvh-page.nsvh-page .topbar {
	background: var(--brand-deep);
	color: #cfe7e5;
	font-size: 13px;
}

.nsvh-page.nsvh-page .topbar__inner {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 20px;
	min-height: 40px;
	flex-wrap: wrap;
}

.nsvh-page.nsvh-page .topbar__tagline {
	margin: 0;
	letter-spacing: .02em;
}

.nsvh-page.nsvh-page .topbar a {
	color: inherit;
	text-decoration: none;
}

.nsvh-page.nsvh-page .topbar a:hover {
	color: #fff;
}

.nsvh-page.nsvh-page .topbar__meta {
	display: flex;
	gap: 26px;
	margin: 0;
	padding: 0;
	list-style: none;
	flex-wrap: wrap;
}

/* The live site breaks this address mid-word inside a narrow column; keep it intact. */
.nsvh-page.nsvh-page .topbar__meta li {
	white-space: nowrap;
}

.nsvh-page.nsvh-page .siteheader {
	background: var(--brand);
	color: #fff;
}

.nsvh-page.nsvh-page .siteheader__inner {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 32px;
	padding-block: 14px;
	flex-wrap: wrap;
}

.nsvh-page.nsvh-page .siteheader__logo img {
	display: block;
	width: 128px;
	height: auto;
}

.nsvh-page.nsvh-page .siteheader__nav {
	display: flex;
	align-items: center;
	gap: 26px;
	flex-wrap: wrap;
	font-family: Oswald, "Arial Narrow", sans-serif;
	font-size: 15px;
	text-transform: uppercase;
	letter-spacing: .04em;
}

.nsvh-page.nsvh-page .siteheader__nav a {
	color: #fff;
	text-decoration: none;
	padding-block: 6px;
	border-bottom: 2px solid transparent;
}

.nsvh-page.nsvh-page .siteheader__nav a:hover {
	border-bottom-color: var(--accent);
}

.nsvh-page.nsvh-page .siteheader__cta {
	background: var(--accent);
	color: var(--brand-deep) !important;
	padding: 8px 18px;
	border-radius: 999px;
	border-bottom: 0 !important;
}

.nsvh-page.nsvh-page .siteheader__cta:hover {
	background: #fff;
}

/* ---- Buttons ---- */

.nsvh-page.nsvh-page .btn {
	display: inline-block;
	font-family: Oswald, "Arial Narrow", sans-serif;
	font-size: 16px;
	letter-spacing: .04em;
	text-transform: uppercase;
	text-decoration: none;
	padding: 15px 32px;
	border-radius: 999px;
	border: 2px solid transparent;
	cursor: pointer;
	transition: background-color .15s ease, color .15s ease;
}

.nsvh-page.nsvh-page .btn--solid {
	background: var(--accent);
	color: var(--brand-deep);
}

.nsvh-page.nsvh-page .btn--solid:hover {
	background: #fff;
	color: var(--brand-dark);
}

.nsvh-page.nsvh-page .btn--light {
	background: #fff;
	color: var(--brand-dark);
}

.nsvh-page.nsvh-page .btn--light:hover {
	background: var(--accent);
	color: var(--brand-deep);
}

.nsvh-page.nsvh-page .btn--block {
	display: block;
	width: 100%;
	font-size: 15px;
	padding-inline: 18px;
}

.nsvh-page.nsvh-page .btn[disabled] {
	opacity: .85;
}

/* ---- Hero ---- */

.nsvh-page.nsvh-page .hero {
	position: relative;
	isolation: isolate;
	color: #fff;
	padding-block: clamp(60px, 9vw, 128px);
	/* Hold the band at the clip's own 12:5 so a wide window stops cropping the cabin roof
	   and the far shore away. Capped, or a very wide monitor would swallow the screen. The
	   svh term is what keeps the button on screen: the first two terms are driven by
	   viewport WIDTH, so on a wide-and-short window the hero outgrew the window itself. */
	min-height: min(calc(100vw / 2.4), 860px, calc(100svh - 180px));
	display: flex;
	align-items: center;
	background: var(--brand-dark);
}

/* The still used to be this section's background image. As a background it was invisible
   to the preload scanner and always the desktop file, which made it the slowest thing on
   a phone; as a real <img> it is found in the first HTML pass and a phone downloads the
   900 px rendition. It stays out of the layout, so it cannot shift anything. */
.nsvh-page.nsvh-page .hero__still {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	object-fit: cover;
	object-position: center 34%;
}

.nsvh-page.nsvh-page .hero__video {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	object-fit: cover;
	/* On a wide, short window cover still trims the top and bottom; hold the upper band,
	   which is where the cabin roof and the far shoreline live. */
	object-position: center 34%;
	opacity: 0;
	transition: opacity .6s ease;
}

.nsvh-page.nsvh-page .hero__video.is-visible {
	opacity: 1;
}

/* Photography this busy needs a heavy veil, weighted to the side the copy sits on. The
   right-hand stops were lifted after sampling the composited pixels: the h1 runs the full
   width now, so its last words sit over the thinnest part of the veil, and a bright frame
   of the clip took the measured contrast there to 3.33:1 against a 3.0 floor. */
.nsvh-page.nsvh-page .hero__veil {
	position: absolute;
	inset: 0;
	background: linear-gradient(100deg, rgba(0, 47, 48, .93) 0%, rgba(0, 47, 48, .82) 42%, rgba(0, 40, 41, .46) 100%);
}

/* Dan's 2026-07-19 note — the hero should read "vibrant, bolder, clearer, warmer" — was
   as much about this veil as about the photo: at .46 the teal tint sat on the regraded
   image and kept it muted. Desktop puts all copy in the left column, so only there the
   right end thins to .36 and loses most of its green; the tight h1 shadow below keeps
   the headline's last words legible where the veil no longer carries them. Phones keep
   the heavy veil: below 960 px the copy spans the full gradient. The headline's last
   glyph sits at 80% of the gradient axis at 1440 px, so the 86% stop holds the old
   slope through everything a letter can touch and only then falls away, opening the
   brightest corner of the photography (the golden birches) that no text ever crosses.
   All four stops are measured, not felt: tools/measure_hero_contrast.py puts the
   headline's worst composited pixel at 3.41:1 on the luxury still and 4.1:1+ on every
   clip frame, against the 3.0 large-text floor. */
@media (min-width: 961px) {
	.nsvh-page.nsvh-page .hero__veil {
		background: linear-gradient(100deg, rgba(0, 47, 48, .93) 0%, rgba(0, 47, 48, .80) 42%, rgba(0, 30, 31, .47) 86%, rgba(0, 30, 31, .22) 100%);
	}
}

/* The /luxury2 comparison variant (Dan, 2026-07-19): same page, but the veil carries no
   teal at all. A neutral near-black scrim dims for legibility without shifting hue, so
   the photograph keeps its true colours — the teal film was what read as "washed out".
   Some dimming must stay: the white h1 crosses bright sky at full width. Neutral ink is
   darker than teal at equal opacity, so the photo side runs thinner here; stops are
   verified by the same probe (see the unveiled scenario in measure_hero_contrast.py). */
.nsvh-page.nsvh-page .hero--unveiled .hero__veil {
	background: linear-gradient(100deg, rgba(12, 15, 16, .92) 0%, rgba(12, 15, 16, .74) 100%);
}

@media (min-width: 961px) {
	.nsvh-page.nsvh-page .hero--unveiled .hero__veil {
		background: linear-gradient(100deg, rgba(12, 15, 16, .88) 0%, rgba(12, 15, 16, .66) 42%, rgba(12, 15, 16, .46) 86%, rgba(12, 15, 16, .14) 100%);
	}
}

.nsvh-page.nsvh-page .hero__inner {
	position: relative;
	z-index: 1;
	width: 100%;
}

/* Full width, same as before the video went in: boxed to 18ch it wrapped to three lines.
   The tight first shadow gives every glyph its own dark edge, so legibility over the
   thinned desktop veil comes from the letterform, not from flat background contrast. */
.nsvh-page.nsvh-page .hero h1 {
	max-width: none;
	margin-bottom: .45em;
	text-shadow: 0 1px 3px rgba(0, 25, 26, .65), 0 2px 24px rgba(0, 25, 26, .55);
}

/* No italic: Oswald ships none, so the browser was skewing the upright by hand. The line
   separates from the h1 on weight and colour instead. */
.nsvh-page.nsvh-page .hero__lead {
	font-family: Oswald, "Arial Narrow", sans-serif;
	font-size: clamp(1.15rem, 1.9vw, 1.5rem);
	font-weight: 400;
	color: var(--accent);
	line-height: 1.3;
	margin-bottom: 1.1em;
}

.nsvh-page.nsvh-page .hero p {
	color: #e4f1f0;
	max-width: 54ch;
}

.nsvh-page.nsvh-page .hero .btn {
	margin-top: 12px;
}

/* ---- Sections ---- */

.nsvh-page.nsvh-page .section {
	padding-block: clamp(52px, 6.5vw, 92px);
}

.nsvh-page.nsvh-page .section--light {
	background: var(--paper);
}

.nsvh-page.nsvh-page .section--tint {
	background: var(--tint);
}

.nsvh-page.nsvh-page .section--dark {
	background: var(--ink);
	color: #e7edec;
}

.nsvh-page.nsvh-page .section h2 {
	color: var(--brand-dark);
	max-width: 22ch;
}

.nsvh-page.nsvh-page .section--dark h2 {
	color: #fff;
	max-width: 26ch;
}

/* ---- Lists ---- */

.nsvh-page.nsvh-page .ticklist {
	list-style: none;
	margin: 0 0 1.2em;
	padding: 0;
}

.nsvh-page.nsvh-page .ticklist li {
	position: relative;
	padding-left: 28px;
	margin-bottom: .5em;
}

.nsvh-page.nsvh-page .ticklist li::before {
	content: "";
	position: absolute;
	left: 4px;
	top: .62em;
	width: 9px;
	height: 9px;
	border-radius: 2px;
	background: var(--accent);
	transform: rotate(45deg);
}

/* Column width first: inside a narrow card the list falls back to one column by itself. */
.nsvh-page.nsvh-page .ticklist--two {
	columns: 210px 2;
	column-gap: 34px;
}

.nsvh-page.nsvh-page .ticklist--two li {
	break-inside: avoid;
}

/* ---- Owner burden ---- */

.nsvh-page.nsvh-page .burden {
	display: grid;
	grid-template-columns: minmax(0, 1.4fr) minmax(0, 1fr);
	gap: clamp(28px, 4vw, 56px);
	align-items: start;
}

.nsvh-page.nsvh-page .burden__label,
.nsvh-page.nsvh-page .service__label,
.nsvh-page.nsvh-page .situation__label,
.nsvh-page.nsvh-page .whofor__label,
.nsvh-page.nsvh-page .request__label {
	font-family: Oswald, "Arial Narrow", sans-serif;
	font-size: 1.02rem;
	color: var(--brand-dark);
	margin-bottom: .7em;
}

.nsvh-page.nsvh-page .burden__note {
	background: var(--brand);
	color: #eaf5f4;
	padding: clamp(24px, 3vw, 34px);
	border-radius: var(--radius);
}

.nsvh-page.nsvh-page .burden__note p:last-child {
	margin-bottom: 0;
}

/* ---- Services ---- */

.nsvh-page.nsvh-page .services {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	column-gap: clamp(30px, 4vw, 56px);
	row-gap: clamp(28px, 3vw, 40px);
}

.nsvh-page.nsvh-page .service {
	padding: clamp(24px, 2.6vw, 34px);
}

/* Seven identically boxed cards read as a template and as one undifferentiated wall. The
   lead card keeps its panel; the other six give up the box and are separated by a rule,
   so the eye gets a list of services instead of six copies of the same object. */
.nsvh-page.nsvh-page .service:not(.service--feature) {
	border-top: 1px solid var(--line);
	padding: 24px 0 0;
}

.nsvh-page.nsvh-page .service h3 {
	color: var(--brand-dark);
}

.nsvh-page.nsvh-page .service__title {
	display: flex;
	align-items: center;
	gap: 14px;
}

.nsvh-page.nsvh-page .service__icon {
	flex: none;
	width: 44px;
	height: 44px;
	padding: 9px;
	border-radius: 10px;
	color: var(--brand);
	background: rgba(13, 189, 173, .14);
}

/* A tinted rounded tile above every one of seven headings is the template tell; the mark
   itself was asked for, so it stays, drawn straight into the line at text size. */
.nsvh-page.nsvh-page .service:not(.service--feature) .service__icon {
	width: 26px;
	height: 26px;
	padding: 0;
	border-radius: 0;
	background: none;
}

.nsvh-page.nsvh-page .service--feature .service__icon {
	color: #fff;
	background: rgba(255, 255, 255, .16);
}

.nsvh-page.nsvh-page .service p:last-child {
	margin-bottom: 0;
}

.nsvh-page.nsvh-page .service__close {
	color: var(--ink-soft);
	font-size: .96rem;
}

/* service-lists.js moves each label and its list into this, so the detail folds away on a
   phone. Without JS there is no <details> at all and everything stays visible. */
.nsvh-page.nsvh-page .service__more > summary {
	list-style: none;
	cursor: pointer;
}

.nsvh-page.nsvh-page .service__more > summary::-webkit-details-marker {
	display: none;
}

/* Above the phone breakpoint every list is open and stays open, so the summary is just the
   label his copy already had; clicking it should not fold anything away. */
@media (min-width: 701px) {
	.nsvh-page.nsvh-page .service__more > summary {
		pointer-events: none;
	}
}

@media (prefers-reduced-motion: reduce) {
	.nsvh-page.nsvh-page .service__more > summary::after {
		transition: none;
	}
}

/* The lead card runs full width so the remaining six pair off evenly below it. */
.nsvh-page.nsvh-page .service--feature {
	grid-column: 1 / -1;
	background: var(--brand);
	border-color: var(--brand);
	color: #eaf5f4;
}

.nsvh-page.nsvh-page .service--feature h3,
.nsvh-page.nsvh-page .service--feature .service__label {
	color: #fff;
}

/* #cfe7e5 measured 4.55:1 on this teal, five hundredths above the 4.5 floor; this one
   sits at 5.24 so a later tweak to the brand colour cannot silently break it. */
.nsvh-page.nsvh-page .service--feature .service__close {
	color: #e8f4f3;
}

.nsvh-page.nsvh-page .service--feature .ticklist li::before {
	background: var(--accent);
}

/* ---- Who it's for ---- */

.nsvh-page.nsvh-page .whofor {
	display: grid;
	grid-template-columns: minmax(0, 1.3fr) minmax(0, 1fr);
	gap: clamp(28px, 4vw, 56px);
	align-items: center;
	margin-bottom: clamp(36px, 4vw, 60px);
}

.nsvh-page.nsvh-page .situations {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 22px;
}

.nsvh-page.nsvh-page .situation {
	background: var(--tint);
	border-radius: var(--radius);
	padding: clamp(26px, 3vw, 38px);
}

.nsvh-page.nsvh-page .situation h3 {
	color: var(--brand-dark);
}

.nsvh-page.nsvh-page .situation__close {
	margin-bottom: 0;
	color: var(--ink-soft);
	font-size: .96rem;
}

.nsvh-page.nsvh-page .situation--dark {
	background: var(--brand-deep);
	color: #dceceb;
}

.nsvh-page.nsvh-page .situation--dark h3,
.nsvh-page.nsvh-page .situation--dark .situation__label {
	color: #fff;
}

.nsvh-page.nsvh-page .situation--dark .situation__close {
	color: #b9d6d4;
}

/* ---- Why owners choose ---- */

.nsvh-page.nsvh-page .valueprops {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: clamp(24px, 3vw, 40px);
}

/* These six carried 01-06 until the numbers were read back as a claim: they are not a
   sequence, nothing happens first, and the reader gains nothing by counting them. */
.nsvh-page.nsvh-page .valueprop {
	padding-top: 20px;
	border-top: 2px solid rgba(13, 189, 173, .45);
}

.nsvh-page.nsvh-page .valueprop h3 {
	color: #fff;
	margin-bottom: .45em;
}

.nsvh-page.nsvh-page .valueprop p {
	margin-bottom: 0;
	color: #b7c2c2;
	font-size: .98rem;
}

/* ---- Areas we serve ---- */

.nsvh-page.nsvh-page .areas {
	display: grid;
	grid-template-columns: minmax(0, 1.1fr) minmax(0, 1fr);
	gap: clamp(28px, 4vw, 56px);
	align-items: center;
}

.nsvh-page.nsvh-page .chips {
	display: flex;
	flex-wrap: wrap;
	gap: 10px;
	list-style: none;
	margin: 0 0 1.2em;
	padding: 0;
}

.nsvh-page.nsvh-page .chips li {
	background: var(--paper);
	border: 1px solid var(--line);
	border-radius: 999px;
	padding: 9px 18px;
	font-family: Oswald, "Arial Narrow", sans-serif;
	font-size: .95rem;
	color: var(--brand-dark);
}

.nsvh-page.nsvh-page .areas__note {
	color: var(--ink-soft);
	font-size: .96rem;
	margin-bottom: 0;
}

/* ---- Request information + form ---- */

.nsvh-page.nsvh-page .request {
	display: grid;
	grid-template-columns: minmax(0, 1fr) minmax(0, .85fr);
	gap: clamp(28px, 4vw, 56px);
	align-items: start;
}

.nsvh-page.nsvh-page .request__close {
	color: var(--ink-soft);
	margin-bottom: 0;
}

.nsvh-page.nsvh-page .formcard {
	background: var(--tint);
	border: 1px solid var(--line);
	border-radius: var(--radius);
	padding: clamp(24px, 3vw, 34px);
}

.nsvh-page.nsvh-page .formcard h3 {
	color: var(--brand-dark);
	margin-bottom: .9em;
}

/* The markup below the form card is ActiveCampaign's, generated into the page by
   tools/build_ac_form.py. Their stylesheet is dropped at generation time, which is why
   none of these rules need !important: with their CSS gone there is no specificity fight,
   and the form is styled from scratch like every other component on the page. */

.nsvh-page.nsvh-page ._form {
	margin: 0;
}

.nsvh-page.nsvh-page ._form_element {
	margin-bottom: 14px;
}

.nsvh-page.nsvh-page ._form-label {
	display: block;
	font-family: Oswald, "Arial Narrow", sans-serif;
	font-size: .88rem;
	letter-spacing: .03em;
	color: var(--brand-dark);
}

.nsvh-page.nsvh-page .field-required {
	margin-left: .15em;
	color: #a3240b;
}

.nsvh-page.nsvh-page ._form_element input[type="text"],
.nsvh-page.nsvh-page ._form_element textarea {
	display: block;
	width: 100%;
	margin-top: 6px;
	padding: 12px 14px;
	font: inherit;
	font-size: 16px;
	color: var(--ink);
	background: var(--paper);
	border: 1px solid var(--line);
	border-radius: 8px;
}

.nsvh-page.nsvh-page ._form_element input[type="text"]:focus,
.nsvh-page.nsvh-page ._form_element textarea:focus {
	outline: 2px solid var(--accent);
	outline-offset: 1px;
}

.nsvh-page.nsvh-page ._form_element textarea {
	resize: vertical;
	/* AC emits no rows attribute, so the height is set here. The popup has less room and
	   a taller box would push the submit button below the dialog's fold. */
	min-height: 7.4em;
}

.nsvh-page.nsvh-page #inquiry-form-modal ._form_element textarea {
	min-height: 4.6em;
}

/* intl-tel-input wraps the phone field once it loads and brings its own stylesheet; these
   two stop the wrapper from shrinking the field to its default width. */
.nsvh-page.nsvh-page .iti {
	width: 100%;
}

.nsvh-page.nsvh-page .iti input[type="text"] {
	width: 100%;
}

/* Validation. AC positions these as floating tooltips; as plain text under the field they
   survive a narrow column, never cover the next input, and read in source order. */
.nsvh-page.nsvh-page ._error {
	display: block;
	margin-top: 6px;
}

.nsvh-page.nsvh-page ._error-arrow {
	display: none;
}

.nsvh-page.nsvh-page ._error-inner {
	display: block;
	font-size: .82rem;
	line-height: 1.45;
	color: #8c1d08;
}

.nsvh-page.nsvh-page ._form_element input._has_error,
.nsvh-page.nsvh-page ._form_element textarea._has_error {
	border-color: #a3240b;
}

.nsvh-page.nsvh-page ._show_be_error {
	margin-bottom: 12px;
}

.nsvh-page.nsvh-page .sms_consent_checkbox {
	display: flex;
	align-items: flex-start;
	gap: 10px;
	margin: 2px 0 0;
	cursor: pointer;
}

.nsvh-page.nsvh-page .sms_consent_checkbox input[type="checkbox"] {
	flex: 0 0 auto;
	width: 17px;
	height: 17px;
	margin-top: 2px;
}

.nsvh-page.nsvh-page .sms_consent_message {
	font-size: .78rem;
	line-height: 1.5;
	color: var(--ink-soft);
}

.nsvh-page.nsvh-page ._button-wrapper {
	margin-top: 18px;
}

.nsvh-page.nsvh-page ._submit {
	display: block;
	width: 100%;
	font-family: Oswald, "Arial Narrow", sans-serif;
	font-size: 15px;
	letter-spacing: .04em;
	text-transform: uppercase;
	padding: 15px 18px;
	border-radius: 999px;
	border: 2px solid transparent;
	background: var(--accent);
	color: var(--brand-deep);
	cursor: pointer;
	transition: background-color .15s ease, color .15s ease;
}

.nsvh-page.nsvh-page ._submit:hover {
	background: #fff;
	color: var(--brand-dark);
}

.nsvh-page.nsvh-page ._submit:disabled {
	cursor: progress;
	opacity: .6;
}

.nsvh-page.nsvh-page ._form-thank-you {
	padding: 16px 2px;
	font-size: 1.02rem;
	line-height: 1.55;
	color: var(--brand-dark);
}

.nsvh-page.nsvh-page .formcard__privacy {
	margin: 14px 0 0;
	font-size: .82rem;
	line-height: 1.5;
	color: var(--ink-soft);
}

/* ---- FAQ ---- */

.nsvh-page.nsvh-page .section--faq {
	border-top: 1px solid var(--line);
}

.nsvh-page.nsvh-page .faq {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: clamp(22px, 3vw, 38px);
}

.nsvh-page.nsvh-page .faq__item h3 {
	color: var(--brand-dark);
	margin-bottom: .4em;
}

.nsvh-page.nsvh-page .faq__item p {
	margin-bottom: 0;
	color: var(--ink-soft);
}

/* ---- Final CTA ---- */

.nsvh-page.nsvh-page .finalcta {
	background: var(--brand);
	color: #fff;
	padding-block: clamp(48px, 6vw, 80px);
	text-align: center;
}

.nsvh-page.nsvh-page .finalcta h2 {
	color: #fff;
	max-width: 20ch;
	margin-inline: auto;
}

.nsvh-page.nsvh-page .finalcta p {
	max-width: 62ch;
	margin-inline: auto;
	/* 4.84:1 before; same reasoning as .service--feature .service__close. */
	color: #e8f4f3;
}

.nsvh-page.nsvh-page .finalcta .btn {
	margin-top: 14px;
}

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

.nsvh-page.nsvh-page .sitefooter {
	background: var(--ink);
	color: #aab4b4;
	padding-block: 46px;
	text-align: center;
	font-size: .95rem;
}

.nsvh-page.nsvh-page .sitefooter p {
	margin: 0 0 .4em;
}

.nsvh-page.nsvh-page .sitefooter__brand {
	font-family: Oswald, "Arial Narrow", sans-serif;
	font-size: 1.25rem;
	color: #fff;
}

.nsvh-page.nsvh-page .sitefooter__tagline {
	color: #8f9b9b;
}

.nsvh-page.nsvh-page .sitefooter__meta {
	display: flex;
	justify-content: center;
	gap: 24px;
	list-style: none;
	margin: 14px 0;
	padding: 0;
	flex-wrap: wrap;
}

.nsvh-page.nsvh-page .sitefooter a {
	color: var(--accent);
	text-decoration: none;
}

.nsvh-page.nsvh-page .sitefooter__copy {
	margin-top: 18px;
	font-size: .82rem;
	/* #6f7a7a measured 3.78:1 on this background, under the 4.5:1 WCAG AA floor for
	   text this size; #8f9b9b measures 5.86:1 and still reads as the quietest line. */
	color: #8f9b9b;
}

.nsvh-page.nsvh-page .sitefooter__legal {
	max-width: 720px;
	margin: 26px auto 0;
	padding-top: 24px;
	border-top: 1px solid rgba(255, 255, 255, .14);
}

.nsvh-page.nsvh-page .sitefooter__legal p {
	font-size: .78rem;
	line-height: 1.6;
	color: #8f9b9b;
	margin-bottom: .9em;
}

.nsvh-page.nsvh-page .sitefooter__nav {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	gap: 6px 20px;
	margin-top: 8px;
	font-size: .82rem;
}

/* ---- Inquiry modal ---- */

.nsvh-page.nsvh-page .modal[hidden] {
	display: none;
}

.nsvh-page.nsvh-page .modal {
	position: fixed;
	inset: 0;
	z-index: var(--z-modal);
	display: flex;
	align-items: center;
	justify-content: center;
	padding: 20px;
}

.nsvh-page.nsvh-page .modal__backdrop {
	position: absolute;
	inset: 0;
	background: rgba(0, 30, 30, .68);
}

.nsvh-page.nsvh-page .modal__dialog {
	position: relative;
	width: min(520px, 100%);
	max-height: calc(100vh - 40px);
	overflow-y: auto;
	background: var(--paper);
	border-radius: var(--radius);
	/* Tight on purpose: six fields, a reassurance line and the privacy note have to fit a
	   900 px laptop without the submit button falling below the dialog's own scroll. */
	padding: clamp(24px, 2.4vw, 32px);
	box-shadow: 0 24px 60px rgba(0, 20, 20, .35);
	animation: modal-in .18s ease-out;
}

@media (prefers-reduced-motion: reduce) {
	.nsvh-page.nsvh-page .modal__dialog {
		animation: none;
	}
}

@keyframes modal-in {
	from {
		opacity: 0;
		transform: translateY(12px);
	}
}

/* Off the section-h2 clamp: at its full size this wrapped to two lines and pushed the
   submit button below the dialog's own scroll fold on a 900 px-tall laptop. */
.nsvh-page.nsvh-page .modal__title {
	color: var(--brand-dark);
	font-size: 1.4rem;
	margin-bottom: .35em;
	padding-right: 44px;
}

.nsvh-page.nsvh-page .modal__lead {
	color: var(--ink-soft);
	font-size: .96rem;
	margin-bottom: .5em;
}

.nsvh-page.nsvh-page .modal__reassure {
	font-size: .92rem;
	line-height: 1.5;
	color: var(--brand-dark);
	background: var(--tint);
	border-radius: 8px;
	padding: 10px 14px;
	margin-bottom: .9em;
}

/* 44 px is the touch-target floor; this was 38. */
.nsvh-page.nsvh-page .modal__close {
	position: absolute;
	top: 12px;
	right: 12px;
	display: flex;
	align-items: center;
	justify-content: center;
	width: 44px;
	height: 44px;
	color: var(--ink-soft);
	background: var(--tint);
	border: 0;
	border-radius: 50%;
	cursor: pointer;
}

.nsvh-page.nsvh-page .modal__close:hover {
	color: var(--brand-dark);
	background: var(--line);
}

.has-modal-open {
	overflow: hidden;
}

/* ---- Sticky phone CTA ---- */

/* Desktop keeps the hero button in view and the form is two scrolls away; this exists for
   the phone, where the form sits at 77% depth with nothing to act on before it. */
.nsvh-page.nsvh-page .stickycta {
	display: none;
}

.has-modal-open .stickycta {
	visibility: hidden;
}

/* ---- Section imagery ---- */

.nsvh-page.nsvh-page .whofor__photo {
	display: block;
	width: 100%;
	border-radius: var(--radius);
}

/* Lake geometry rides in its own cached SVG; the pins sit on top as inline markup so
   their labels use the page font. */
.nsvh-page.nsvh-page .servicemap {
	position: relative;
	border: 1px solid var(--line);
	border-radius: var(--radius);
	overflow: hidden;
}

.nsvh-page.nsvh-page .servicemap__base,
.nsvh-page.nsvh-page .servicemap__pins {
	display: block;
	width: 100%;
	height: auto;
}

.nsvh-page.nsvh-page .servicemap__pins {
	position: absolute;
	inset: 0;
}

.nsvh-page.nsvh-page .servicemap__dot {
	fill: #b23b2e;
	stroke: #fff;
	stroke-width: 1.5;
}

.nsvh-page.nsvh-page .servicemap__hub {
	fill: #9d2f22;
	stroke: #fff;
	stroke-width: 2;
}

.nsvh-page.nsvh-page .servicemap__halo {
	fill: #b23b2e;
	opacity: .18;
}

.nsvh-page.nsvh-page .servicemap__label {
	font-family: Oswald, "Arial Narrow", sans-serif;
	font-size: 19px;
	fill: #123a3b;
	paint-order: stroke;
	stroke: rgba(255, 255, 255, .85);
	stroke-width: 4;
	stroke-linejoin: round;
}

.nsvh-page.nsvh-page .servicemap__label--hub {
	font-size: 24px;
	font-weight: 600;
}

.nsvh-page.nsvh-page .servicemap__scale {
	stroke: var(--brand-dark);
	stroke-width: 2;
	opacity: .55;
	fill: none;
}

.nsvh-page.nsvh-page .servicemap__scaletext {
	font-family: Oswald, "Arial Narrow", sans-serif;
	font-size: 15px;
	fill: #123a3b;
	paint-order: stroke;
	stroke: rgba(255, 255, 255, .85);
	stroke-width: 4;
	stroke-linejoin: round;
}

.nsvh-page.nsvh-page .areas__credit {
	margin: 10px 0 0;
	font-size: .78rem;
	color: var(--ink-soft);
}

/* ---- Image placeholders (stage 2 fills these) ---- */

.nsvh-page.nsvh-page .imgslot {
	position: relative;
	display: flex;
	align-items: center;
	justify-content: center;
	min-height: 260px;
	padding: 20px;
	border: 2px dashed rgba(13, 189, 173, .7);
	border-radius: var(--radius);
	background: rgba(13, 189, 173, .07);
}

.nsvh-page.nsvh-page .imgslot::after {
	content: attr(data-slot);
	font-family: Oswald, "Arial Narrow", sans-serif;
	font-size: .9rem;
	letter-spacing: .04em;
	text-align: center;
	color: var(--brand);
}

.nsvh-page.nsvh-page .hero .imgslot::after {
	color: var(--accent);
}

.nsvh-page.nsvh-page .imgslot--tall {
	min-height: 340px;
}

.nsvh-page.nsvh-page .imgslot--map {
	min-height: 300px;
}

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

@media (max-width: 960px) {
	.nsvh-page.nsvh-page .burden,
.nsvh-page.nsvh-page .whofor,
.nsvh-page.nsvh-page .areas,
.nsvh-page.nsvh-page .request {
		grid-template-columns: minmax(0, 1fr);
	}

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

	.nsvh-page.nsvh-page .hero h1 {
		max-width: none;
	}
}

@media (max-width: 700px) {
	.nsvh-page.nsvh-page .imgslot,
.nsvh-page.nsvh-page .imgslot--tall,
.nsvh-page.nsvh-page .imgslot--map {
		min-height: 200px;
	}
}

@media (max-width: 700px) {
	.nsvh-page.nsvh-page .stickycta {
		position: fixed;
		left: 0;
		right: 0;
		bottom: 0;
		z-index: var(--z-sticky);
		display: flex;
		gap: 10px;
		padding: 10px 14px calc(10px + env(safe-area-inset-bottom));
		background: rgba(26, 30, 31, .97);
		border-top: 1px solid rgba(255, 255, 255, .14);
	}

	.nsvh-page.nsvh-page .stickycta__ask {
		flex: 1;
		padding: 14px 12px;
		font-size: 14px;
		text-align: center;
	}

	.nsvh-page.nsvh-page .stickycta__call {
		display: flex;
		flex: none;
		flex-direction: column;
		align-items: center;
		justify-content: center;
		gap: 1px;
		min-width: 68px;
		font-family: Oswald, "Arial Narrow", sans-serif;
		font-size: 12px;
		letter-spacing: .04em;
		text-transform: uppercase;
		color: #fff;
		text-decoration: none;
		border: 1px solid rgba(255, 255, 255, .4);
		border-radius: 999px;
	}

	.nsvh-page.nsvh-page .stickycta a:focus-visible {
		outline-color: #fff;
	}

	.nsvh-page.nsvh-page .service__more > summary {
		display: flex;
		align-items: center;
		justify-content: space-between;
		gap: 12px;
		padding-block: 4px;
	}

	.nsvh-page.nsvh-page .service__more > summary::after {
		content: "";
		flex: none;
		width: 9px;
		height: 9px;
		border-right: 2px solid var(--brand);
		border-bottom: 2px solid var(--brand);
		transform: rotate(45deg) translate(-3px, -3px);
		transition: transform .15s ease;
	}

	.nsvh-page.nsvh-page .service--feature .service__more > summary::after {
		border-color: #fff;
	}

	.nsvh-page.nsvh-page .service__more[open] > summary::after {
		transform: rotate(-135deg);
	}

	.nsvh-page.nsvh-page {
		font-size: 16px;
		/* Or the sticky bar covers the last line of the footer at the end of the scroll. */
		padding-bottom: 92px;
	}

	.nsvh-page.nsvh-page .services,
.nsvh-page.nsvh-page .situations,
.nsvh-page.nsvh-page .faq,
.nsvh-page.nsvh-page .valueprops {
		grid-template-columns: minmax(0, 1fr);
	}

	.nsvh-page.nsvh-page .ticklist--two {
		columns: 1;
	}

	.nsvh-page.nsvh-page .siteheader__inner {
		justify-content: center;
		text-align: center;
	}

	.nsvh-page.nsvh-page .siteheader__nav {
		justify-content: center;
		gap: 16px;
		font-size: 14px;
	}

	.nsvh-page.nsvh-page .topbar__inner {
		justify-content: center;
	}
}

/* Lift the theme's content width off the containers holding this page, so the hero and the
   dark bands can reach both edges. Matches nothing on any other page. */
.entry-content.entry-content:has(.nsvh-page),
.wp-block-post-content.wp-block-post-content:has(.nsvh-page),
main.wp-block-group:has(.nsvh-page),
main.post-page-area:has(.nsvh-page) {
	max-width: none;
	/* !important is load-bearing here and nowhere else in this file. The block editor writes
	   the group's spacing into a style ATTRIBUTE on <main>, and an inline style beats every
	   selector regardless of specificity; a stylesheet !important is the only thing that
	   outranks it. Measured on the live site: without it the hero sits at 1377 of a usable
	   1425, with it the page reaches both edges. The earlier note that specificity alone was
	   enough came from a page whose main carried no inline spacing. */
	padding-left: 0 !important;
	padding-right: 0 !important;
}

/* The theme opens every page with a cover block carrying the page title over a photo. This
   page brings its own hero and its own h1, so the two stack up as competing titles above
   competing images. Hidden only where this page is mounted; every other page keeps it.
   The selector was read off the live site, not guessed: the banner is a .wp-block-cover
   sitting as a direct child of .wp-site-blocks, beside <main>, and the :has() narrows it to
   the one that actually holds the title. */
.wp-site-blocks:has(.nsvh-page) > .wp-block-cover:has(.wp-block-post-title) {
	display: none;
}