/*
 * NetiServer — site styles on top of theme.json.
 * White and ink, Geist, large photography, one brand blue. Calm by default;
 * the photo hero with the domain search is the one loud moment.
 */

:root {
	--ns-ink: var(--wp--preset--color--ink);
	--ns-body: var(--wp--preset--color--body);
	--ns-muted: var(--wp--preset--color--muted);
	--ns-line: var(--wp--preset--color--line);
	--ns-mist: var(--wp--preset--color--mist);
	--ns-sky: var(--wp--preset--color--sky);
	--ns-blue: var(--wp--preset--color--blue);
	--ns-tint: var(--wp--preset--color--tint);
	--ns-mono: var(--wp--preset--font-family--mono);
	--ns-inset: clamp(0.5rem, 1.2vw, 1rem);
	--ns-radius-lg: clamp(1.25rem, 2vw, 1.75rem);
	--ns-radius: 1.25rem;
	--ns-shadow: 0 1px 2px rgb(11 13 18 / 0.04), 0 12px 32px -16px rgb(11 13 18 / 0.18);
	--ns-check: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3E%3Cpath d='M4.5 10.5l3.5 3.5 7.5-8' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
}

/* ---------- Base ---------- */

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

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

p {
	text-wrap: pretty;
}

strong {
	font-weight: 600;
	color: var(--ns-ink);
}

:where(a, button, input, textarea, select, [tabindex]):focus-visible {
	outline: 2px solid var(--ns-blue);
	outline-offset: 3px;
	border-radius: 6px;
}

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

.ns-nowrap {
	white-space: nowrap;
}

/* bands sit flush; spacing comes from their own padding */
.wp-site-blocks > *,
.ns-main > .wp-block-post-content > * {
	margin-block-start: 0;
}

/* ---------- Header: a dark info strip and a strong main bar ---------- */

.ns-header {
	position: sticky;
	top: -2.25rem; /* the info strip scrolls away, the main bar stays */
	z-index: 50;
	background: #fff;
	box-shadow: 0 1px 0 var(--ns-line);
}

.admin-bar .ns-header {
	top: calc(var(--wp-admin--admin-bar--height, 0px) - 2.25rem);
}

.ns-header > * {
	margin-block: 0;
}

.ns-topbar {
	background: var(--ns-ink);
	color: rgb(255 255 255 / 0.72);
	font-size: 0.8125rem;
}

.ns-topbar__inner {
	min-height: 2.25rem;
	gap: 1.5rem;
}

.ns-topbar p {
	margin: 0;
}

.ns-topbar a {
	color: #fff;
	font-weight: 500;
}

.ns-topbar a:hover {
	color: var(--ns-sky);
}

.ns-topbar__links {
	display: flex;
	gap: 1.5rem;
}

.ns-topbar__end {
	gap: 1.5rem;
}

/* Language switcher (Slop Lang): a quiet link in the strip, a white card below it */
.ns-lang .slop-lang-switcher > summary {
	color: #fff;
	font-weight: 500;
}

.ns-lang .slop-lang-switcher > summary:hover,
.ns-lang .slop-lang-switcher[open] > summary {
	color: var(--ns-sky);
}

.ns-lang .slop-lang-switcher > summary:focus-visible {
	outline: 2px solid var(--ns-sky);
	outline-offset: 3px;
	border-radius: 2px;
}

.ns-lang .slop-lang-switcher > ul {
	color: var(--ns-ink);
	background: #fff;
	border-color: var(--ns-line);
	border-radius: 0.875rem;
	box-shadow: var(--ns-shadow);
	font-size: 0.9375rem;
}

.ns-topbar .ns-lang .slop-lang-switcher > ul a {
	color: var(--ns-ink);
	font-weight: 500;
}

.ns-lang .slop-lang-switcher > ul > li > * {
	border-radius: 0.5rem;
}

.ns-lang .slop-lang-switcher > ul > li > a:hover,
.ns-lang .slop-lang-switcher > ul > li > a:focus-visible {
	background: var(--ns-mist);
}

.ns-lang .slop-lang-switcher > ul [aria-current] {
	color: var(--ns-blue);
}

.ns-lang .slop-lang-switcher__code {
	font-family: var(--ns-mono);
}

.ns-header__bar {
	min-height: 5rem;
	gap: 2.5rem;
}

.ns-logo {
	display: block;
	flex: none;
	width: 9.5rem;
	line-height: 0;
}

.ns-logo svg {
	width: 100%;
	height: auto;
}

.ns-nav {
	flex: 1;
	color: var(--ns-ink);
}

.ns-header .ns-nav .wp-block-navigation-item > .wp-block-navigation-item__content {
	padding: 0.55rem 0.95rem;
	border-radius: 999px;
	font-size: 1rem;
	font-weight: 500;
	color: var(--ns-ink);
	transition: background-color 0.15s ease;
}

.ns-header .ns-nav .wp-block-navigation-item > .wp-block-navigation-item__content:hover {
	background: var(--ns-mist);
	color: var(--ns-ink);
}

.ns-header .ns-nav .current-menu-item > .wp-block-navigation-item__content {
	background: var(--ns-tint);
	color: var(--ns-blue);
	font-weight: 600;
}

.ns-header__actions {
	flex: none;
	gap: 0.5rem;
}

.ns-header__actions .wp-block-button__link {
	padding: 0.7rem 1.25rem;
	font-size: 0.9375rem;
}

.ns-header__actions .is-style-outline > .wp-block-button__link {
	padding: calc(0.7rem - 1px) calc(1.25rem - 1px);
}

@media (max-width: 1000px) {
	.ns-header__primary {
		display: none !important;
	}
}

@media (max-width: 599px) {
	.ns-topbar__info {
		display: none;
	}

	.ns-topbar__inner {
		justify-content: flex-end !important;
	}

	.ns-header__bar {
		min-height: 4.25rem;
		gap: 0.75rem;
	}

	.ns-logo {
		width: 7.75rem;
	}

	.ns-nav {
		order: 3;
		flex: none;
	}

	.ns-header__actions {
		margin-inline-start: auto;
	}
}

.ns-nav .wp-block-navigation__responsive-container.is-menu-open {
	padding: 1.5rem clamp(1.25rem, 5vw, 2.5rem);
}

.ns-nav .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-container-content {
	padding-top: 4rem;
}

.ns-nav .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__container {
	gap: 0.25rem;
}

.ns-nav .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item__content {
	padding-inline: 0;
	font-size: 2rem;
	font-weight: 500;
	letter-spacing: -0.03em;
	background: none;
}

/* ---------- Text pieces ---------- */

.ns-eyebrow {
	display: inline-flex;
	align-items: center;
	gap: 0.55rem;
	font-size: 0.875rem;
	font-weight: 500;
	color: var(--ns-ink);
}

.ns-eyebrow::before {
	content: "";
	width: 0.45rem;
	height: 0.45rem;
	border-radius: 50%;
	background: var(--ns-sky);
}

.ns-lead {
	font-size: var(--wp--preset--font-size--large);
	line-height: 1.55;
	color: var(--ns-body);
	max-width: 38rem;
}

.ns-arrow-link,
.ns-arrow-link > a {
	font-weight: 500;
	color: var(--ns-blue);
}

.ns-arrow-link > a::after,
a.ns-arrow-link::after {
	content: "→";
	display: inline-block;
	margin-inline-start: 0.35em;
	transition: transform 0.2s ease;
}

.ns-arrow-link > a:hover::after,
a.ns-arrow-link:hover::after {
	transform: translateX(3px);
}

.wp-block-button.is-style-outline > .wp-block-button__link {
	background: #fff;
	color: var(--ns-ink);
	border: 1px solid var(--ns-line);
	padding: calc(0.8rem - 1px) calc(1.45rem - 1px);
}

.wp-block-button.is-style-outline > .wp-block-button__link:hover {
	border-color: #c9ccd3;
	background: #fff;
	color: var(--ns-ink);
}

.ns-btn {
	box-sizing: border-box;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	padding: 0.8rem 1.45rem;
	border: 0;
	border-radius: 999px;
	background: var(--ns-ink);
	color: #fff;
	font: inherit;
	font-size: 0.96875rem;
	font-weight: 500;
	line-height: 1.25;
	text-decoration: none;
	cursor: pointer;
	transition: background-color 0.15s ease;
}

.ns-btn:hover,
.ns-btn:focus-visible {
	background: #2a2e37;
	color: #fff;
}

.ns-btn--small {
	padding: 0.55rem 1rem;
	font-size: 0.875rem;
	white-space: nowrap;
}

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

.ns-section {
	padding-block: var(--wp--preset--spacing--60);
}

.ns-section--mist {
	background: var(--ns-mist);
}

/* two plain bands in a row share one gap */
:where(.ns-section:not(.ns-section--mist), .ns-pagehead) + .ns-section:not(.ns-section--mist) {
	padding-block-start: 0;
}

.ns-wrap > * {
	margin-block: 0;
}

.ns-wrap > * + * {
	margin-block-start: var(--wp--preset--spacing--50);
}

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

.ns-head > * + * {
	margin-block-start: 1rem;
}

.ns-head h2 {
	max-width: 20ch;
}

.ns-head--center {
	text-align: center;
	margin-inline: auto;
}

.ns-head--center h2,
.ns-head--center .ns-lead {
	margin-inline: auto;
}

/* ---------- Home hero: one big photo, text on its quiet side ---------- */

.ns-hero {
	padding: var(--ns-inset) var(--ns-inset) 0 !important;
}

.ns-hero > .ns-wrap {
	position: relative;
	max-width: none !important;
	min-height: clamp(32rem, 74vh, 44rem);
	border-radius: var(--ns-radius-lg);
	overflow: hidden;
	display: flex;
	align-items: center;
	background: #eef0f2;
}

.ns-hero__media {
	position: absolute !important;
	inset: 0;
	margin: 0 !important;
}

.ns-hero__media img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	object-position: 72% 50%;
}

/* a soft wash so the headline reads on any crop of the wall */
.ns-hero > .ns-wrap::before {
	content: "";
	position: absolute;
	inset: 0;
	z-index: 1;
	background: linear-gradient(90deg, rgb(255 255 255 / 0.82) 0%, rgb(255 255 255 / 0.55) 38%, rgb(255 255 255 / 0) 62%);
	pointer-events: none;
}

.ns-hero__content {
	position: relative;
	z-index: 2;
	box-sizing: border-box;
	width: 100%;
	max-width: calc(1200px + 2 * clamp(1.25rem, 5vw, 2.5rem));
	margin: 0 auto !important;
	padding: clamp(2.5rem, 6vw, 5rem) clamp(1.25rem, 5vw, 2.5rem);
}

.ns-hero__content > * {
	max-width: 36rem;
	margin-block: 0;
}

.ns-hero__content > * + * {
	margin-block-start: 1.5rem;
}

.ns-hero h1 {
	max-width: 13ch;
	font-size: clamp(2.75rem, 1.6rem + 4vw, 5rem);
}

.ns-hero .ns-lead {
	color: #3d4250;
}

.ns-hero .ns-search {
	margin-block-start: 2.25rem;
}

@media (max-width: 900px) {
	.ns-hero > .ns-wrap {
		display: flex;
		flex-direction: column;
		min-height: 0;
		background: none;
		border-radius: 0;
		overflow: visible;
	}

	.ns-hero > .ns-wrap::before {
		display: none;
	}

	.ns-hero__content {
		order: -1;
		padding: 2.5rem clamp(0.75rem, 4vw, 2rem) 2rem;
	}

	.ns-hero__media {
		position: relative !important;
		inset: auto;
	}

	.ns-hero__media img {
		aspect-ratio: 4 / 3;
		height: auto;
		border-radius: var(--ns-radius-lg);
		object-position: 68% 50%;
	}
}

/* ---------- Domain search ---------- */

.ns-search {
	max-width: 36rem;
}

.ns-search__form {
	position: relative;
	display: flex;
	align-items: center;
	gap: 0.5rem;
	margin: 0;
	padding: 0.375rem 0.375rem 0.375rem 1.25rem;
	border: 1px solid var(--ns-line);
	border-radius: 999px;
	background: #fff;
	box-shadow: var(--ns-shadow);
	transition: border-color 0.15s ease, box-shadow 0.15s ease;
}

.ns-search__form:focus-within {
	border-color: #b9c3cf;
	box-shadow: 0 0 0 4px rgb(86 181 224 / 0.22), var(--ns-shadow);
}

.ns-search__icon {
	flex: none;
	color: var(--ns-muted);
}

.ns-search__input {
	flex: 1;
	min-width: 0;
	height: 3.25rem;
	padding: 0;
	border: 0;
	background: transparent;
	color: var(--ns-ink);
	font: inherit;
	font-size: 1.0625rem;
	outline: none;
}

.ns-search__input:focus-visible {
	outline: none;
}

.ns-search__input::placeholder {
	color: #8a909c;
}

.ns-search__button {
	flex: none;
	height: 3.25rem;
	padding: 0 1.6rem;
	border: 0;
	border-radius: 999px;
	background: var(--ns-ink);
	color: #fff;
	font: inherit;
	font-weight: 500;
	cursor: pointer;
	transition: background-color 0.15s ease;
}

.ns-search__button:hover,
.ns-search__button:focus-visible {
	background: #2a2e37;
}

.ns-search__tlds {
	display: flex;
	flex-wrap: wrap;
	gap: 0.5rem;
	margin: 1rem 0 0;
	padding: 0;
	list-style: none;
	font-size: 0.875rem;
	color: var(--ns-body);
}

.ns-search__tlds li {
	padding: 0.3rem 0.75rem;
	border: 1px solid rgb(11 13 18 / 0.08);
	border-radius: 999px;
	background: rgb(255 255 255 / 0.7);
}

.ns-search__tld {
	font-family: var(--ns-mono);
	font-weight: 500;
	color: var(--ns-ink);
}

.ns-search__tlds a {
	font-weight: 500;
}

/* ---------- Facts row ---------- */

.ns-stats {
	display: grid;
	grid-template-columns: repeat(4, minmax(0, 1fr));
}

.ns-main .ns-stats > * {
	margin: 0;
	padding: 0.25rem 1.75rem;
	border-inline-start: 1px solid var(--ns-line);
}

.ns-main .ns-stats > :first-child {
	padding-inline-start: 0;
	border-inline-start: 0;
}

.ns-stats > * > * {
	margin: 0;
}

.ns-stats > [class*="ns-ico-"]::before {
	content: "";
	display: block;
	width: 3rem;
	height: 3rem;
	margin: 0 0 1rem -0.2rem;
	background: var(--ns-icon) center / contain no-repeat;
}

.ns-stat__value {
	font-size: clamp(1.75rem, 1.3rem + 1.3vw, 2.375rem);
	font-weight: 500;
	letter-spacing: -0.035em;
	line-height: 1.1;
	color: var(--ns-ink);
}

.ns-stat__label {
	margin-block-start: 0.4rem !important;
	font-size: 0.9375rem;
	color: var(--ns-body);
}

@media (max-width: 800px) {
	.ns-stats {
		grid-template-columns: repeat(2, minmax(0, 1fr));
		row-gap: 2rem;
	}

	.ns-main .ns-stats > :nth-child(3) {
		padding-inline-start: 0;
		border-inline-start: 0;
	}
}

/* ---------- Photo + text rows ---------- */

.ns-row {
	display: grid;
	grid-template-columns: minmax(0, 1fr) minmax(0, 1.1fr);
	gap: clamp(2.5rem, 7vw, 6rem);
	align-items: center;
}

.ns-main .ns-row > * {
	margin: 0;
}

.ns-wrap > .ns-row + .ns-row {
	margin-block-start: var(--wp--preset--spacing--60);
}

.ns-row--reverse .ns-row__media {
	order: -1;
}

.ns-row__text > * {
	margin-block: 0;
}

.ns-row__text > * + * {
	margin-block-start: 1.25rem;
}

.ns-row__text h2 {
	font-size: clamp(2rem, 1.4rem + 2vw, 3rem);
}

.ns-row__media img {
	display: block;
	width: 100%;
	height: auto;
	aspect-ratio: 5 / 4;
	object-fit: cover;
	border-radius: var(--ns-radius-lg);
}

.ns-points {
	padding: 0;
	list-style: none;
}

.ns-points li {
	position: relative;
	padding-inline-start: 1.75rem;
	color: var(--ns-ink);
}

.ns-points li + li {
	margin-block-start: 0.55rem;
}

.ns-points li::before {
	content: "";
	position: absolute;
	left: 0;
	top: 0.2em;
	width: 1.15rem;
	height: 1.15rem;
	background: var(--ns-blue);
	-webkit-mask: var(--ns-check) center / contain no-repeat;
	mask: var(--ns-check) center / contain no-repeat;
}

@media (max-width: 900px) {
	.ns-row {
		grid-template-columns: minmax(0, 1fr);
	}

	.ns-row--reverse .ns-row__media {
		order: 0;
	}

	.ns-row__media img {
		aspect-ratio: 4 / 3;
	}
}

/* ---------- Large photo cards (home services) ---------- */

.ns-tiles {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 1.25rem;
}

.ns-main .ns-tiles > * {
	margin: 0;
}

.ns-tile {
	display: flex;
	flex-direction: column;
	border-radius: var(--ns-radius-lg);
	background: var(--ns-mist);
	overflow: hidden;
}

.ns-tile > * {
	margin: 0;
}

.ns-tile__media img {
	display: block;
	width: 100%;
	height: auto;
	aspect-ratio: 4 / 3;
	object-fit: cover;
	transition: transform 0.6s cubic-bezier(0.2, 0.7, 0.2, 1);
}

.ns-tile:hover .ns-tile__media img {
	transform: scale(1.03);
}

.ns-tile__body {
	display: flex;
	flex: 1;
	flex-direction: column;
	padding: 1.75rem;
}

.ns-tile__body > * {
	margin-block: 0;
}

.ns-tile__body > * + * {
	margin-block-start: 0.75rem;
}

.ns-tile__body h3 {
	font-size: clamp(1.4rem, 1.1rem + 0.8vw, 1.75rem);
	letter-spacing: -0.03em;
}

.ns-tile__foot {
	display: flex;
	flex-wrap: wrap;
	align-items: baseline;
	justify-content: space-between;
	gap: 0.5rem 1rem;
	margin-block-start: auto !important;
	padding-block-start: 1.5rem;
}

.ns-tile__foot > * {
	margin: 0;
}

@media (max-width: 960px) {
	.ns-tiles {
		grid-template-columns: minmax(0, 1fr);
	}

	.ns-tile {
		display: grid;
		grid-template-columns: minmax(0, 0.9fr) minmax(0, 1.1fr);
	}

	.ns-tile__media img {
		height: 100%;
	}
}

@media (max-width: 600px) {
	.ns-tile {
		display: flex;
	}
}

/* ---------- Dark photo band (strong contrast, used once per page) ---------- */

.ns-band > .ns-wrap {
	position: relative;
	max-width: none !important;
	min-height: clamp(26rem, 52vw, 36rem);
	display: flex;
	align-items: center;
	border-radius: var(--ns-radius-lg);
	overflow: hidden;
	background: var(--ns-ink);
}

.ns-band__media {
	position: absolute !important;
	inset: 0;
	margin: 0 !important;
}

.ns-band__media img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	object-position: 30% 50%;
}

.ns-band > .ns-wrap::before {
	content: "";
	position: absolute;
	inset: 0;
	z-index: 1;
	background: linear-gradient(270deg, rgb(11 13 18 / 0.92) 0%, rgb(11 13 18 / 0.78) 42%, rgb(11 13 18 / 0.1) 72%);
}

.ns-band__content {
	position: relative;
	z-index: 2;
	box-sizing: border-box;
	width: 100%;
	max-width: calc(1200px + 2 * clamp(1.25rem, 5vw, 2.5rem));
	margin: 0 auto !important;
	padding: var(--wp--preset--spacing--60) clamp(1.25rem, 5vw, 2.5rem);
	display: flex;
	flex-direction: column;
	align-items: flex-end;
}

.ns-band__content > * {
	width: 100%;
	max-width: 32rem;
	margin-block: 0;
}

.ns-band__content > * + * {
	margin-block-start: 1.25rem;
}

.ns-band__content h2 {
	color: #fff;
}

.ns-band__content .ns-lead {
	color: rgb(255 255 255 / 0.78);
}

.ns-band__content .ns-eyebrow {
	color: #fff;
}

.ns-band__content .wp-block-button__link {
	background: #fff;
	color: var(--ns-ink);
}

.ns-band__content .wp-block-button__link:hover {
	background: var(--ns-tint);
	color: var(--ns-ink);
}

@media (max-width: 760px) {
	.ns-band > .ns-wrap::before {
		background: linear-gradient(0deg, rgb(11 13 18 / 0.94) 0%, rgb(11 13 18 / 0.8) 55%, rgb(11 13 18 / 0.25) 100%);
	}

	.ns-band > .ns-wrap {
		align-items: flex-end;
	}

	.ns-band__content {
		align-items: flex-start;
		padding-block: 14rem 2.5rem;
	}
}

/* ---------- Ink panel: the inner pages' one strong moment ---------- */

.ns-section--ink > .ns-wrap {
	max-width: none !important;
	box-sizing: border-box;
	padding: var(--wp--preset--spacing--60) clamp(1.25rem, 5vw, 2.5rem);
	border-radius: var(--ns-radius-lg);
	background: var(--ns-ink);
	color: rgb(255 255 255 / 0.74);
}

.ns-section--ink > .ns-wrap > * {
	max-width: 1200px;
	margin-inline: auto !important;
}

.ns-section--ink :where(h2, h3) {
	color: #fff;
}

.ns-section--ink .ns-lead {
	color: rgb(255 255 255 / 0.74);
}

.ns-section--ink .ns-eyebrow {
	color: #fff;
}

.ns-section--ink .ns-feature {
	background: rgb(255 255 255 / 0.06);
	box-shadow: inset 0 0 0 1px rgb(255 255 255 / 0.08);
}

.ns-section--ink .ns-feature p {
	color: rgb(255 255 255 / 0.68);
}

.ns-section--ink .wp-block-button__link {
	background: #fff;
	color: var(--ns-ink);
}

.ns-section--ink .wp-block-button__link:hover {
	background: var(--ns-tint);
	color: var(--ns-ink);
}

/* a band that follows a coloured panel needs its own top space */
:where(.ns-section--ink, .ns-panel, .ns-band) + .ns-section:not(.ns-section--mist, .ns-section--ink) {
	padding-block-start: var(--wp--preset--spacing--60) !important;
}

/* ---------- Getting started: heading beside the steps ---------- */

.ns-start {
	display: grid;
	grid-template-columns: minmax(0, 0.9fr) minmax(0, 1.1fr);
	gap: clamp(2.5rem, 6vw, 5rem);
	align-items: start;
}

.ns-main .ns-start > * {
	margin: 0;
}

.ns-start .ns-head h2 {
	max-width: 14ch;
}

.ns-start .ns-steps {
	grid-template-columns: minmax(0, 1fr);
	gap: 0;
}

.ns-start .ns-step {
	display: grid;
	grid-template-columns: 3.5rem minmax(0, 1fr);
	padding-block: 1.5rem;
}

.ns-start .ns-step:last-child {
	border-bottom: 1px solid var(--ns-line);
}

.ns-start .ns-step::before {
	grid-row: span 2;
	margin: 0;
	font-size: 1.5rem;
	font-family: inherit;
	font-weight: 500;
	letter-spacing: -0.03em;
	color: var(--ns-blue);
}

@media (max-width: 860px) {
	.ns-start {
		grid-template-columns: minmax(0, 1fr);
	}
}

/* ---------- "From" price ---------- */

.ns-from {
	display: flex;
	align-items: baseline;
	gap: 0.35rem;
	color: var(--ns-muted);
	font-size: 0.9375rem;
}

.ns-from__amount {
	font-size: 1.5rem;
	font-weight: 500;
	letter-spacing: -0.03em;
	color: var(--ns-ink);
	font-variant-numeric: tabular-nums;
}

/* ---------- Feature cards ---------- */

.ns-features {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 1rem;
}

.ns-main .ns-features > * {
	margin: 0;
}

.ns-feature {
	--ns-icon: none;
	position: relative;
	padding: 1.75rem;
	border-radius: var(--ns-radius);
	background: var(--ns-mist);
}

.ns-section--mist .ns-feature {
	background: #fff;
}

.ns-feature > * {
	margin-block: 0;
}

/* the cut-paper icon */
.ns-feature::before {
	content: "";
	display: block;
	width: 3.75rem;
	height: 3.75rem;
	margin: -0.25rem 0 1.25rem -0.25rem;
	background: var(--ns-icon) center / contain no-repeat;
}

.ns-feature h3 {
	font-size: 1.125rem;
	font-weight: 500;
}

.ns-feature p {
	margin-block-start: 0.5rem;
	font-size: 0.96875rem;
}

@media (max-width: 900px) {
	.ns-features {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}
}

@media (max-width: 600px) {
	.ns-features {
		grid-template-columns: minmax(0, 1fr);
		gap: 0.75rem;
	}

	/* compact rows: icon on the left, text beside it */
	.ns-feature {
		display: grid;
		grid-template-columns: 3.25rem minmax(0, 1fr);
		column-gap: 1rem;
		padding: 1.25rem;
	}

	.ns-feature::before {
		grid-row: span 2;
		width: 3.25rem;
		height: 3.25rem;
		margin: 0;
	}

	.ns-feature p {
		margin-block-start: 0.25rem;
	}
}

.ns-ico-shield { --ns-icon: url(../img/paper/ico-shield.webp); }
.ns-ico-code { --ns-icon: url(../img/paper/ico-code.webp); }
.ns-ico-panel { --ns-icon: url(../img/paper/ico-panel.webp); }
.ns-ico-scan { --ns-icon: url(../img/paper/ico-scan.webp); }
.ns-ico-cloud { --ns-icon: url(../img/paper/ico-cloud.webp); }
.ns-ico-mail { --ns-icon: url(../img/paper/ico-mail.webp); }
.ns-ico-gauge { --ns-icon: url(../img/paper/ico-gauge.webp); }
.ns-ico-filter { --ns-icon: url(../img/paper/ico-filter.webp); }
.ns-ico-support { --ns-icon: url(../img/paper/ico-support.webp); }
.ns-ico-lock { --ns-icon: url(../img/paper/ico-lock.webp); }
.ns-ico-bell { --ns-icon: url(../img/paper/ico-bell.webp); }
.ns-ico-dns { --ns-icon: url(../img/paper/ico-dns.webp); }
.ns-ico-layers { --ns-icon: url(../img/paper/ico-layers.webp); }
.ns-ico-key { --ns-icon: url(../img/paper/ico-key.webp); }
.ns-ico-sliders { --ns-icon: url(../img/paper/ico-sliders.webp); }
.ns-ico-globe { --ns-icon: url(../img/paper/ico-globe.webp); }

/* ---------- Steps ---------- */

.ns-steps {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 1.5rem;
	counter-reset: ns-step;
}

.ns-main .ns-steps > * {
	margin: 0;
}

.ns-step {
	counter-increment: ns-step;
	padding-block-start: 1.5rem;
	border-top: 1px solid var(--ns-line);
}

.ns-step > * {
	margin-block: 0;
}

.ns-step::before {
	content: counter(ns-step, decimal-leading-zero);
	display: block;
	margin-block-end: 1.25rem;
	font-family: var(--ns-mono);
	font-size: 0.8125rem;
	color: var(--ns-muted);
}

.ns-step h3 {
	font-size: 1.125rem;
}

.ns-step p {
	margin-block-start: 0.5rem;
}

@media (max-width: 800px) {
	.ns-steps {
		grid-template-columns: minmax(0, 1fr);
		gap: 2rem;
	}
}

/* ---------- Brand panel (what customers can count on) ---------- */

/* inset panels: a small white margin all round, like the hero */
.ns-panel,
.ns-band,
.ns-section--ink {
	padding: var(--ns-inset) !important;
}

.ns-main .wp-block-post-content > :last-child:is(.ns-panel, .ns-band, .ns-section--ink) {
	padding-block-end: var(--wp--preset--spacing--50) !important;
}

.ns-panel > .ns-wrap {
	position: relative;
	max-width: none !important;
	overflow: hidden;
	box-sizing: border-box;
	padding: var(--wp--preset--spacing--60) clamp(1.25rem, 5vw, 2.5rem);
	border-radius: var(--ns-radius-lg);
	background:
		radial-gradient(circle at 100% 0%, rgb(255 255 255 / 0.1) 0 22rem, transparent 22rem),
		radial-gradient(circle at 0% 100%, rgb(0 0 0 / 0.1) 0 18rem, transparent 18rem),
		var(--ns-blue);
	color: rgb(255 255 255 / 0.82);
}

.ns-panel > .ns-wrap > * {
	max-width: 1200px;
	margin-inline: auto !important;
}

.ns-panel :where(h2, h3) {
	color: #fff;
}

.ns-panel .ns-lead {
	color: rgb(255 255 255 / 0.82);
}

.ns-panel .ns-eyebrow {
	color: #fff;
}

.ns-panel .ns-eyebrow::before {
	background: #fff;
}

.ns-promises {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 1rem;
}

.ns-main .ns-promises > * {
	margin: 0;
}

.ns-promise {
	display: flex;
	flex-direction: column;
	padding: 1.75rem;
	border-radius: var(--ns-radius);
	background: rgb(255 255 255 / 0.08);
	box-shadow: inset 0 0 0 1px rgb(255 255 255 / 0.12);
}

.ns-main .ns-promise > * {
	margin: 0;
}

.ns-promise h3 {
	font-size: 1.375rem;
}

.ns-promise p {
	margin-block-start: 0.75rem !important;
	font-size: 1.0625rem;
	line-height: 1.6;
}

.ns-promise .ns-arrow-link {
	margin-block-start: auto !important;
	padding-block-start: 1.5rem;
}

.ns-promise .ns-arrow-link > a {
	color: #fff;
	text-decoration: none;
}

@media (max-width: 900px) {
	.ns-promises {
		grid-template-columns: minmax(0, 1fr);
	}
}

/* ---------- Closing call to action ---------- */

.ns-cta {
	text-align: center;
}

.ns-cta > * {
	margin-inline: auto;
}

.ns-cta h2 {
	max-width: 18ch;
}

.ns-cta .wp-block-buttons {
	justify-content: center;
}

/* ---------- Illustrated call to action (cut-paper scene, text on the sky) ---------- */

.ns-ill {
	padding: var(--ns-inset) !important;
}

.ns-ill > .ns-wrap {
	position: relative;
	max-width: none !important;
	min-height: clamp(30rem, 46vw, 40rem);
	border-radius: var(--ns-radius-lg);
	overflow: hidden;
	background: var(--ns-tint);
}

.ns-ill__media {
	position: absolute !important;
	inset: 0;
	margin: 0 !important;
}

.ns-ill__media img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	object-position: 50% 100%;
}

.ns-ill__content {
	position: relative;
	z-index: 1;
	margin: 0 auto !important;
	padding: clamp(3rem, 6vw, 5rem) clamp(1.25rem, 5vw, 2.5rem) 0;
	text-align: center;
}

.ns-ill__content > * {
	margin-block: 0;
	margin-inline: auto;
}

.ns-ill__content > * + * {
	margin-block-start: 1.1rem;
}

.ns-ill__content h2 {
	max-width: 18ch;
}

.ns-ill__content .ns-lead {
	color: #2f3644;
}

.ns-ill__content .wp-block-buttons {
	justify-content: center;
	margin-block-start: 1.75rem;
}

/* scenes whose accent sits right of centre keep the text on the left */
.ns-ill--left .ns-ill__content {
	padding-inline: max(clamp(1.25rem, 5vw, 2.5rem), calc((100% - 1200px) / 2));
	text-align: left;
}

.ns-ill--left .ns-ill__content > * {
	margin-inline: 0;
	max-width: 30rem;
}

.ns-ill--left .ns-ill__content .wp-block-buttons {
	justify-content: flex-start;
}

.ns-main .wp-block-post-content > .ns-ill:last-child {
	padding-block-end: var(--wp--preset--spacing--50) !important;
}

@media (max-width: 700px) {
	.ns-ill > .ns-wrap {
		min-height: 36rem;
	}

	.ns-ill__media img {
		object-position: 62% 100%;
	}
}

/* ---------- Cut-paper pieces around the top of each page ---------- */

.ns-pagehead > .ns-wrap,
.ns-head--deco {
	position: relative;
}

.ns-pagehead > .ns-wrap::before,
.ns-pagehead > .ns-wrap::after {
	content: "";
	position: absolute;
	z-index: 0;
	width: clamp(4.5rem, 10vw, 9rem);
	aspect-ratio: 1;
	background: center / contain no-repeat;
	pointer-events: none;
}

.ns-pagehead > .ns-wrap::before {
	top: -0.5rem;
	left: 2%;
	background-image: var(--ns-deco-a);
	transform: rotate(-4deg);
}

.ns-pagehead > .ns-wrap::after {
	top: clamp(2.5rem, 5vw, 4.5rem);
	right: 3%;
	background-image: var(--ns-deco-b);
	transform: rotate(3deg);
}

.ns-pagehead > .ns-wrap > * {
	position: relative;
	z-index: 1;
}

.ns-deco--hosting { --ns-deco-a: url(../img/paper/deco-house-red.webp); --ns-deco-b: url(../img/paper/deco-cloud.webp); }
.ns-deco--agency { --ns-deco-a: url(../img/paper/deco-boat-red.webp); --ns-deco-b: url(../img/paper/deco-cloud-small.webp); }
.ns-deco--domains { --ns-deco-a: url(../img/paper/deco-cloud.webp); --ns-deco-b: url(../img/paper/deco-plane.webp); }
.ns-deco--contact { --ns-deco-a: url(../img/paper/deco-envelope.webp); --ns-deco-b: url(../img/paper/deco-cloud-small.webp); }
.ns-deco--compare { --ns-deco-a: url(../img/paper/deco-cloud-small.webp); --ns-deco-b: url(../img/paper/deco-hill.webp); }
.ns-deco--agency-compare { --ns-deco-a: url(../img/paper/deco-boat.webp); --ns-deco-b: url(../img/paper/deco-cloud.webp); }
.ns-deco--terms { --ns-deco-a: url(../img/paper/deco-envelope.webp); --ns-deco-b: url(../img/paper/deco-house-blue.webp); }
.ns-deco--campaign { --ns-deco-a: url(../img/paper/deco-house-blue.webp); --ns-deco-b: url(../img/paper/deco-plane.webp); }
.ns-deco--authorities { --ns-deco-a: url(../img/paper/deco-hill.webp); --ns-deco-b: url(../img/paper/deco-plane.webp); }

.ns-art-cloud { --ns-deco-a: url(../img/paper/deco-cloud.webp); }
.ns-art-cloud-small { --ns-deco-a: url(../img/paper/deco-cloud-small.webp); }
.ns-art-plane { --ns-deco-a: url(../img/paper/deco-plane.webp); }
.ns-art-boat { --ns-deco-a: url(../img/paper/deco-boat.webp); }
.ns-art-boat-red { --ns-deco-a: url(../img/paper/deco-boat-red.webp); }
.ns-art-house-red { --ns-deco-a: url(../img/paper/deco-house-red.webp); }
.ns-art-house-blue { --ns-deco-a: url(../img/paper/deco-house-blue.webp); }
.ns-art-envelope { --ns-deco-a: url(../img/paper/deco-envelope.webp); }
.ns-art-hill { --ns-deco-a: url(../img/paper/deco-hill.webp); }

/* a small paper piece above a centred section heading */
.ns-head--deco::before {
	content: "";
	display: block;
	width: 5.5rem;
	height: 4.25rem;
	margin: 0 auto 0.75rem;
	background: var(--ns-deco-a) center / contain no-repeat;
}

@media (max-width: 760px) {
	.ns-pagehead > .ns-wrap::before {
		top: -1.5rem;
		left: -0.25rem;
		width: 3.75rem;
	}

	.ns-pagehead > .ns-wrap::after {
		top: -1.25rem;
		right: -0.25rem;
		width: 3.75rem;
	}
}

/* home hero: a paper plane and a cloud on the quiet wall */
.ns-hero__content::before,
.ns-hero__content::after {
	content: "";
	position: absolute;
	pointer-events: none;
	background: center / contain no-repeat;
}

.ns-hero__content::before {
	top: clamp(1.5rem, 4vw, 3.5rem);
	left: min(46rem, 52%);
	width: clamp(4.5rem, 8vw, 7.5rem);
	aspect-ratio: 1;
	background-image: url(../img/paper/deco-plane.webp);
	transform: rotate(-6deg);
}

.ns-hero__content::after {
	bottom: clamp(1rem, 3vw, 2.5rem);
	left: min(40rem, 46%);
	width: clamp(5rem, 9vw, 8rem);
	aspect-ratio: 1.4;
	background-image: url(../img/paper/deco-cloud-small.webp);
	opacity: 0.95;
}

@media (max-width: 900px) {
	.ns-hero__content::before {
		top: 1rem;
		left: auto;
		right: 0.5rem;
		width: 4rem;
	}

	.ns-hero__content::after {
		display: none;
	}
}

/* ---------- Inner page head ---------- */

.ns-pagehead {
	padding-block: var(--wp--preset--spacing--50) var(--wp--preset--spacing--60);
}

.ns-pagehead .ns-wrap {
	text-align: center;
}

.ns-pagehead .ns-wrap > * {
	margin-block: 0;
	margin-inline: auto;
}

.ns-pagehead .ns-wrap > * + * {
	margin-block-start: 1.25rem;
}

.ns-pagehead h1 {
	max-width: 16ch;
	font-size: clamp(2.5rem, 1.5rem + 3.6vw, 4.5rem);
}

.ns-pagehead .ns-lead {
	max-width: 40rem;
}

.ns-pagehead .ns-wrap > .ns-search {
	margin-block-start: 2.25rem;
	text-align: left;
}

.ns-pagehead .ns-search__tlds {
	justify-content: center;
}

.ns-pagehead .ns-wrap > .ns-pagehead__media {
	max-width: none;
	margin-block-start: var(--wp--preset--spacing--50);
}

.ns-pagehead__media img {
	display: block;
	width: 100%;
	height: auto;
	aspect-ratio: 21 / 9;
	object-fit: cover;
	border-radius: var(--ns-radius-lg);
}

@media (max-width: 700px) {
	.ns-pagehead__media img {
		aspect-ratio: 4 / 3;
	}
}

/* ---------- Packages ---------- */

.ns-billing {
	display: flex;
	width: max-content;
	margin: 0 auto 2.5rem;
	padding: 0.25rem;
	border: 0;
	border-radius: 999px;
	background: var(--ns-mist);
}

.ns-billing__input {
	position: absolute;
	opacity: 0;
	width: 1px;
	height: 1px;
}

.ns-billing__label {
	padding: 0.55rem 1.25rem;
	border-radius: 999px;
	font-size: 0.9375rem;
	font-weight: 500;
	color: var(--ns-body);
	cursor: pointer;
	transition: background-color 0.15s ease, color 0.15s ease, box-shadow 0.15s ease;
}

.ns-billing__input:checked + .ns-billing__label {
	background: #fff;
	color: var(--ns-ink);
	box-shadow: 0 1px 2px rgb(11 13 18 / 0.08), 0 4px 12px -6px rgb(11 13 18 / 0.2);
}

.ns-billing__input:focus-visible + .ns-billing__label {
	outline: 2px solid var(--ns-blue);
	outline-offset: 2px;
}

.ns-packages:has(.ns-billing__input[value="monthly"]:checked) .ns-card__offer:not([data-cycle="monthly"]),
.ns-packages:has(.ns-billing__input[value="annually"]:checked) .ns-card__offer:not([data-cycle="annually"]) {
	display: none;
}

.ns-cards {
	display: grid;
	grid-template-columns: repeat(var(--ns-cards, 3), minmax(0, 1fr));
	gap: 1rem;
}

.ns-card {
	display: flex;
	flex-direction: column;
	padding: clamp(1.5rem, 2.5vw, 2.25rem);
	border: 1px solid var(--ns-line);
	border-radius: var(--ns-radius-lg);
	background: #fff;
}

.ns-card > * {
	margin: 0;
}

.ns-card__art {
	display: block;
	width: 4.5rem;
	height: 4.5rem;
	margin: -0.5rem 0 0.75rem -0.35rem !important;
	object-fit: contain;
}

.ns-card__name {
	font-size: 1.25rem;
	font-weight: 500;
}

.ns-card__summary {
	margin-block-start: 0.35rem;
	min-height: 3.2em;
	font-size: 0.96875rem;
	color: var(--ns-body);
}

.ns-card__offer {
	margin-block-start: 1.75rem;
}

.ns-card__offer > * {
	margin: 0;
}

.ns-card__price {
	display: flex;
	align-items: baseline;
	gap: 0.25rem;
}

.ns-card__amount {
	font-size: clamp(2.5rem, 1.9rem + 1.6vw, 3.25rem);
	font-weight: 500;
	line-height: 1;
	letter-spacing: -0.045em;
	color: var(--ns-ink);
	font-variant-numeric: tabular-nums;
}

.ns-card__unit {
	color: var(--ns-muted);
}

.ns-card__note {
	margin-block-start: 0.5rem;
	font-family: var(--ns-mono);
	font-size: 0.8125rem;
	color: var(--ns-muted);
}

.ns-card__offer .ns-btn {
	width: 100%;
	margin-block-start: 1.5rem;
}

.ns-card__specs {
	margin-block-start: 1.75rem;
	padding: 1.5rem 0 0;
	border-top: 1px solid var(--ns-line);
	list-style: none;
}

.ns-card__specs li {
	position: relative;
	padding-inline-start: 1.75rem;
	color: var(--ns-ink);
	font-size: 0.96875rem;
}

.ns-card__specs li + li {
	margin-block-start: 0.65rem;
}

.ns-card__specs li::before {
	content: "";
	position: absolute;
	left: 0;
	top: 0.15em;
	width: 1.15rem;
	height: 1.15rem;
	background: var(--ns-blue);
	-webkit-mask: var(--ns-check) center / contain no-repeat;
	mask: var(--ns-check) center / contain no-repeat;
}

.ns-common {
	margin-block-start: 1rem;
	padding: clamp(1.5rem, 2.5vw, 2.25rem);
	border-radius: var(--ns-radius-lg);
	background: var(--ns-mist);
}

.ns-common__title {
	margin: 0 0 1.25rem;
	font-size: 1rem;
	font-weight: 500;
}

.ns-common__list {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(14rem, 1fr));
	gap: 0.75rem 1.5rem;
	margin: 0;
	padding: 0;
	list-style: none;
	font-size: 0.96875rem;
}

.ns-common__list li {
	display: flex;
	gap: 0.6rem;
	align-items: flex-start;
	color: var(--ns-ink);
}

.ns-check {
	flex: none;
	width: 1.15rem;
	height: 1.15rem;
	margin-block-start: 0.15em;
	color: var(--ns-blue);
}

.ns-packages__footer {
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	gap: 0.75rem 2rem;
	margin: 1.5rem 0 0;
}

.ns-vat {
	font-size: 0.875rem;
	color: var(--ns-muted);
}

@media (max-width: 860px) {
	.ns-cards {
		grid-template-columns: minmax(0, 1fr);
	}

	.ns-card__summary {
		min-height: 0;
	}
}

/* ---------- Comparison and price tables ---------- */

.ns-compare__scroll {
	position: relative; /* keeps the cells' hidden labels inside the scroll box */
	overflow-x: auto;
}

.ns-compare__table {
	width: 100%;
	min-width: 36rem;
	border-collapse: collapse;
	font-size: 0.96875rem;
	font-variant-numeric: tabular-nums;
}

.ns-compare__table :where(th, td) {
	padding: 0.85rem 1rem;
	border-bottom: 1px solid var(--ns-line);
	text-align: center;
	vertical-align: middle;
	color: var(--ns-ink);
	font-weight: 400;
}

.ns-compare__table tbody th[scope="row"],
.ns-compare__table thead td {
	position: sticky;
	left: 0;
	z-index: 1;
	padding-inline-start: 0;
	background: #fff;
	text-align: left;
	color: var(--ns-body);
}

.ns-compare__table thead th {
	padding-block: 0 1.25rem;
	font-size: 1.25rem;
	font-weight: 500;
	letter-spacing: -0.015em;
	border-bottom-color: var(--ns-ink);
}

.ns-compare__table thead td {
	border-bottom-color: var(--ns-ink);
}

.ns-compare__section th {
	padding: 2.25rem 0 0.75rem !important;
	font-family: var(--ns-mono);
	font-size: 0.75rem !important;
	font-weight: 500 !important;
	letter-spacing: 0.06em;
	text-transform: uppercase;
	text-align: left !important;
	color: var(--ns-muted) !important;
}

.ns-compare__table .ns-check {
	display: inline-block;
	margin: 0;
	vertical-align: middle;
}

.ns-compare__price td {
	font-size: 1.125rem;
	font-weight: 500;
	letter-spacing: -0.02em;
}

.ns-compare__unit {
	font-size: 0.875rem;
	font-weight: 400;
	color: var(--ns-muted);
}

.ns-compare__table tfoot td {
	padding-block: 1.5rem;
	border-bottom: 0;
}

.ns-compare .ns-vat {
	margin-block-start: 1.25rem;
}

.ns-domains .ns-compare__table {
	min-width: 30rem;
}

.ns-domains .ns-compare__table thead th {
	font-size: 0.875rem;
	font-weight: 500;
	letter-spacing: 0;
	color: var(--ns-muted);
	border-bottom-color: var(--ns-line);
}

.ns-domains .ns-compare__table thead th:first-child {
	text-align: left;
	padding-inline-start: 0;
}

.ns-tld {
	font-family: var(--ns-mono);
	font-weight: 500;
	color: var(--ns-ink) !important;
}

.ns-free {
	display: inline-block;
	padding: 0.1rem 0.6rem;
	border-radius: 999px;
	background: var(--ns-tint);
	color: var(--ns-blue);
	font-size: 0.875rem;
	font-weight: 500;
}

/* ---------- Add-ons ---------- */

.ns-addons {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 0 3rem;
	margin: 0;
	padding: 0;
	list-style: none;
}

.ns-addons__item {
	display: flex;
	justify-content: space-between;
	gap: 1rem;
	padding-block: 1rem;
	border-bottom: 1px solid var(--ns-line);
	color: var(--ns-ink);
}

.ns-addons__price {
	font-weight: 500;
	white-space: nowrap;
	font-variant-numeric: tabular-nums;
}

@media (max-width: 700px) {
	.ns-addons {
		grid-template-columns: minmax(0, 1fr);
	}
}

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

.ns-contact {
	display: grid;
	grid-template-columns: minmax(0, 0.85fr) minmax(0, 1.15fr);
	gap: clamp(2.5rem, 6vw, 5rem);
	align-items: start;
}

.ns-main .ns-contact > * {
	margin: 0;
}

.ns-contact__facts > * {
	margin-block: 0;
}

.ns-contact__facts h3 {
	margin-block-start: 2rem;
	font-family: var(--ns-mono);
	font-size: 0.75rem;
	font-weight: 500;
	letter-spacing: 0.06em;
	text-transform: uppercase;
	color: var(--ns-muted);
}

.ns-contact__facts h3:first-child {
	margin-block-start: 0;
}

.ns-contact__facts p {
	margin-block-start: 0.5rem;
	color: var(--ns-ink);
}

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

.ns-form {
	padding: clamp(1.5rem, 3vw, 2.5rem);
	border-radius: var(--ns-radius-lg);
	background: var(--ns-mist);
	scroll-margin-top: 6rem;
}

.ns-form > * {
	margin: 0;
}

.ns-form > * + * {
	margin-block-start: 1.15rem;
}

.ns-form__title {
	font-size: 1.5rem;
	font-weight: 500;
}

.ns-form__field label {
	display: block;
	margin-block-end: 0.4rem;
	font-size: 0.9375rem;
	font-weight: 500;
	color: var(--ns-ink);
}

.ns-form__field :where(input, textarea) {
	box-sizing: border-box;
	width: 100%;
	padding: 0.8rem 1rem;
	border: 1px solid var(--ns-line);
	border-radius: 0.75rem;
	background: #fff;
	color: var(--ns-ink);
	font: inherit;
	transition: border-color 0.15s ease, box-shadow 0.15s ease;
}

.ns-form__field :where(input, textarea):focus-visible {
	border-color: #9fb3c4;
	outline: none;
	box-shadow: 0 0 0 4px rgb(86 181 224 / 0.22);
}

.ns-form__field textarea {
	resize: vertical;
	min-height: 9rem;
}

.ns-form__trap {
	position: absolute !important;
	left: -10000px;
	width: 1px;
	height: 1px;
	overflow: hidden;
}

.ns-form__errors {
	padding: 1rem 1.25rem;
	border-radius: 0.75rem;
	background: #fdecea;
	color: #7a1d14;
}

.ns-form__errors > * {
	margin: 0;
}

.ns-form__errors p {
	font-weight: 500;
}

.ns-form__errors ul {
	margin-block-start: 0.35rem;
	padding-inline-start: 1.1rem;
}

.ns-form--done {
	background: var(--ns-tint);
}

/* ---------- Long text (terms) ---------- */

.ns-prose {
	max-width: 44rem;
	margin-inline: auto;
}

.ns-prose h2 {
	margin-block-start: 3rem;
	font-size: 1.375rem;
	letter-spacing: -0.02em;
}

.ns-prose p,
.ns-prose li {
	color: var(--ns-body);
}

.ns-prose :where(ol, ul) li + li {
	margin-block-start: 0.5rem;
}

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

.ns-footer {
	margin-block-start: 0;
	padding-block: var(--wp--preset--spacing--60) 2rem;
	border-top: 1px solid var(--ns-line);
	font-size: 0.9375rem;
}

.ns-footer a {
	color: var(--ns-body);
}

.ns-footer a:hover {
	color: var(--ns-ink);
}

.ns-footer__grid {
	display: grid;
	grid-template-columns: 1.5fr repeat(3, 1fr);
	gap: 2.5rem;
}

.ns-footer__grid > * > * {
	margin-block: 0;
}

.ns-footer__grid > * > * + * {
	margin-block-start: 1rem;
}

.ns-footer__brand p {
	max-width: 20rem;
	margin-block-start: 1.25rem;
}

.ns-footer__title {
	font-size: 0.875rem;
	font-weight: 500;
	letter-spacing: 0;
	color: var(--ns-ink);
}

.ns-footer__links {
	padding: 0;
	list-style: none;
}

.ns-footer__links li + li {
	margin-block-start: 0.55rem;
}

.ns-footer__bottom {
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	gap: 0.5rem 2rem;
	margin-block-start: var(--wp--preset--spacing--50);
	padding-block-start: 1.5rem;
	border-top: 1px solid var(--ns-line);
	font-size: 0.875rem;
	color: var(--ns-muted);
}

.ns-footer__bottom > * {
	margin: 0;
}

.ns-footer__bottom a {
	color: inherit;
}

@media (max-width: 900px) {
	.ns-footer__grid {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}

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

@media (max-width: 480px) {
	.ns-footer__grid {
		grid-template-columns: minmax(0, 1fr);
	}
}

/* ---------- 404 ---------- */

.ns-notfound {
	position: relative;
	padding-block: var(--wp--preset--spacing--70);
	text-align: center;
}

/* a lone paper boat and a cloud: the page that drifted off */
.ns-notfound::before,
.ns-notfound::after {
	content: "";
	position: absolute;
	width: clamp(4.5rem, 10vw, 8.5rem);
	aspect-ratio: 1;
	background: center / contain no-repeat;
	pointer-events: none;
}

.ns-notfound::before {
	top: 2rem;
	left: 4%;
	background-image: url(../img/paper/deco-cloud.webp);
}

.ns-notfound::after {
	bottom: 2rem;
	right: 6%;
	background-image: url(../img/paper/deco-boat-red.webp);
	transform: rotate(-5deg);
}

.ns-notfound > * {
	margin-inline: auto;
}

.ns-notfound .wp-block-buttons {
	justify-content: center;
}

@media (prefers-reduced-motion: reduce) {
	*,
	*::before,
	*::after {
		transition-duration: 0.01ms !important;
		animation-duration: 0.01ms !important;
	}
}