/* Homepage parity with the current velta.sg stage design. */

.vs-in {
	box-sizing: border-box;
	width: 100%;
	max-width: 1480px;
	margin: 0 auto;
	padding-right: 20px;
	padding-left: 20px;
}

.vs-eye,
.vhp-overline {
	margin: 0;
	font-size: 11px;
	line-height: 1.5;
	letter-spacing: 0.2em;
	text-transform: uppercase;
}

.vs-btn {
	display: inline-flex;
	align-items: center;
	justify-content: space-between;
	min-height: 48px;
	gap: 32px;
	border: 1px solid #161817;
	padding: 12px 20px;
	background: #161817;
	color: #fff;
	font-size: 14px;
	line-height: 1.4;
	text-decoration: none;
	transition: border-color 0.18s, background-color 0.18s, color 0.18s;
}

.vs-btn:hover,
.vs-btn:focus-visible {
	border-color: #0d1793;
	background: #0d1793;
	color: #fff;
}

.vs-btn-outline {
	background: transparent;
	color: #161817;
}

.vs-btn-light {
	border-color: #fff;
	background: #fff;
	color: #161817;
}

.vs-btn-light:hover,
.vs-btn-light:focus-visible {
	border-color: #fff;
	background: transparent;
	color: #fff;
}

.vs-btn:focus-visible,
.vs-tlink:focus-visible {
	outline: 2px solid #2e42d4;
	outline-offset: 3px;
}

.vs-tlink {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	border-bottom: 1px solid currentColor;
	padding-bottom: 4px;
	color: #111;
	font-size: 14px;
	text-decoration: none;
	transition: color 0.18s;
}

.vs-tlink:hover,
.vs-tlink:focus-visible {
	color: #0d1793;
}

.vs-tlink-light {
	color: #fff;
}

.vs-tlink-light:hover,
.vs-tlink-light:focus-visible {
	color: rgba(255, 255, 255, 0.72);
}

/* Source-compatible not-found page. */

.v404,
.v404 * {
	box-sizing: border-box;
}

.v404-in {
	width: 100%;
	max-width: 1480px;
	margin: 0 auto;
	padding: 96px 20px;
}

.v404-code {
	margin: 0;
	color: #626865;
	font-size: 11px;
	line-height: 1.5;
	letter-spacing: 0.2em;
	text-transform: uppercase;
}

.v404 h1 {
	max-width: 48rem;
	margin: 20px 0 0;
	color: #161817;
	font-family: var(--wp--preset--font-family--heading);
	font-size: 2.15rem;
	font-weight: 700;
	line-height: 1.05;
	letter-spacing: -0.025em;
}

.v404-copy {
	max-width: 36rem;
	margin: 24px 0 0;
	color: #5d625f;
	font-size: 16px;
	line-height: 1.75;
}

.v404-actions {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: 28px;
	margin-top: 40px;
}

.v404-home {
	margin: 48px 0 0;
	color: #5d625f;
	font-size: 14px;
	line-height: 1.75;
}

.v404-home a {
	border-bottom: 1px solid currentColor;
	color: inherit;
	text-decoration: none;
	transition: color 0.18s;
}

.v404-home a:hover,
.v404-home a:focus-visible {
	color: #0d1793;
}

@media (min-width: 640px) {
	.v404-in {
		padding: 144px 32px;
	}

	.v404 h1 {
		font-size: 3rem;
	}

	.v404-actions {
		flex-direction: row;
		align-items: center;
		gap: 40px;
	}
}

@media (min-width: 1024px) {
	.v404-in {
		padding-right: 48px;
		padding-left: 48px;
	}
}

.vhp,
.vhp * {
	box-sizing: border-box;
}

.vhp {
	color: #161817;
}

.vhp figure {
	margin: 0;
}

.vhp img {
	display: block;
	max-width: 100%;
}

.vhp h1,
.vhp h2,
.vhp h3,
.vhp h4,
.vhp p {
	margin-block-end: 0;
}

.vhp a {
	color: inherit;
}

.vhp-section-head {
	display: grid;
	min-width: 0;
	grid-template-columns: 1fr;
	gap: 20px;
}

.vhp-section-head .vs-eye {
	color: #5f6663;
}

.vhp-section-head > div {
	min-width: 0;
}

.vhp-section-head h2 {
	max-width: 896px;
	margin: 0;
	font-family: var(--wp--preset--font-family--heading);
	font-size: 2.15rem;
	font-weight: 300;
	line-height: 1.02;
	letter-spacing: -0.025em;
}

.vhp-section-head > div > p {
	max-width: 672px;
	margin-top: 24px;
	font-size: 16px;
	line-height: 1.75;
	color: #5d625f;
}

.vhp-section-head-dark,
.vhp-section-head-dark .vs-eye,
.vhp-section-head-dark > div > p {
	color: #fff;
}

.vhp-section-head-dark > div > p {
	color: rgba(255, 255, 255, 0.7);
}

.vhp-actions {
	display: flex;
	flex-wrap: wrap;
	gap: 12px;
	margin-top: 32px;
}

.vhp-end-action {
	display: flex;
	justify-content: flex-end;
	margin-top: 48px;
}

/* Hero */

.vhp-hero {
	position: relative;
	overflow: hidden;
	border-bottom: 1px solid rgba(0, 0, 0, 0.1);
	background: #eeeae2;
}

.vhp-hero-bg {
	display: none;
}

.vhp-hero-mobile > div {
	position: relative;
	aspect-ratio: 4 / 3;
	overflow: hidden;
	background: #e5e0d8;
}

.vhp-hero-mobile img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	object-position: right center;
}

.vhp-hero-mobile figcaption {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 20px;
	border-top: 1px solid rgba(0, 0, 0, 0.2);
	padding: 16px 20px;
	font-size: 12px;
	color: #535a5c;
}

.vhp-hero-in {
	position: relative;
	z-index: 1;
	display: grid;
	grid-template-columns: 1fr;
}

.vhp-hero-copy {
	min-width: 0;
	padding: 48px 0;
}

.vhp-hero-copy .vs-eye {
	color: #4d5557;
}

.vhp-hero h1 {
	max-width: 896px;
	margin: 32px 0 0;
	font-family: var(--wp--preset--font-family--heading);
	font-size: 3rem;
	font-weight: 300;
	line-height: 0.93;
	letter-spacing: -0.045em;
	color: #111513;
}

.vhp-hero h1 > span {
	color: #1426b5;
}

.vhp-hero h1 small {
	display: block;
	margin-top: 8px;
	font-size: 0.62em;
	font-weight: 300;
	line-height: 1.05;
	letter-spacing: -0.03em;
}

.vhp-hero-lead {
	max-width: 576px;
	margin-top: 32px;
	font-size: 18px;
	line-height: 32px;
	color: #505759;
}

.vhp-hero-facts {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 12px 32px;
	margin-top: 32px;
	border-top: 1px solid rgba(0, 0, 0, 0.2);
	border-bottom: 1px solid rgba(0, 0, 0, 0.2);
	padding: 20px 0;
	color: #505759;
}

.vhp-hero-facts p {
	margin: 0;
	font-size: 14px;
	line-height: 24px;
}

/* Reverse osmosis */

.vhp-ro {
	scroll-margin-top: 96px;
	overflow: hidden;
	padding: 80px 0;
	background: #111513;
	color: #fff;
}

.vhp-ro .vs-eye,
.vhp-ro .vhp-overline {
	color: rgba(255, 255, 255, 0.7);
}

.vhp-ro-intro {
	display: grid;
	grid-template-columns: 1fr;
	gap: 48px;
}

.vhp-ro-intro h2 {
	position: relative;
	max-width: 1024px;
	margin: 28px 0 0;
	font-family: var(--wp--preset--font-family--heading);
	font-size: 3rem;
	font-weight: 300;
	line-height: 0.98;
	letter-spacing: -0.035em;
}

.vhp-ro-intro-note {
	position: relative;
	margin-top: 56px;
}

.vhp-ro-intro-note img {
	position: absolute;
	top: 0;
	left: -12px;
	z-index: 1;
	width: 160px;
	height: 160px;
	object-fit: contain;
	transform: translateY(-57%) scaleX(-1);
}

.vhp-ro-intro-note p {
	min-height: 112px;
	margin: 0;
	border-top: 1px solid rgba(255, 255, 255, 0.3);
	padding: 24px 8px 8px 112px;
	font-size: 16px;
	line-height: 28px;
	color: rgba(255, 255, 255, 0.7);
}

.vhp-ro-facts {
	display: grid;
	grid-template-columns: 1fr;
	margin-top: 64px;
	border-top: 1px solid rgba(255, 255, 255, 0.2);
	border-bottom: 1px solid rgba(255, 255, 255, 0.2);
}

.vhp-ro-scale {
	padding: 32px 0;
}

.vhp-ro-scale strong {
	display: block;
	font-family: var(--wp--preset--font-family--heading);
	font-size: 4.5rem;
	font-weight: 300;
	line-height: 1;
	letter-spacing: -0.05em;
	color: #9eb4ff;
}

.vhp-ro-scale p {
	max-width: 512px;
	margin-top: 20px;
	font-size: 14px;
	line-height: 28px;
	color: rgba(255, 255, 255, 0.7);
}

.vhp-ro-fact-grid {
	display: grid;
	grid-template-columns: 1fr;
}

.vhp-ro-fact-grid article {
	border-top: 1px solid rgba(255, 255, 255, 0.2);
	padding: 32px 0;
}

.vhp-ro-fact-grid h3 {
	margin: 0;
	font-family: var(--wp--preset--font-family--heading);
	font-size: 24px;
	font-weight: 300;
	line-height: 1.25;
}

.vhp-ro-fact-grid p {
	margin-top: 16px;
	font-size: 14px;
	line-height: 24px;
	color: rgba(255, 255, 255, 0.7);
}

.vhp-ro-treatment {
	margin-top: 56px;
}

.vhp-subhead {
	display: flex;
	flex-direction: column;
	justify-content: space-between;
	gap: 20px;
	border-top: 1px solid rgba(255, 255, 255, 0.2);
	border-bottom: 1px solid rgba(255, 255, 255, 0.2);
	padding: 28px 0;
}

.vhp-subhead h3 {
	max-width: 672px;
	margin: 0;
	font-family: var(--wp--preset--font-family--heading);
	font-size: 30px;
	font-weight: 300;
	line-height: 1.25;
}

.vhp-subhead p {
	max-width: 448px;
	font-size: 14px;
	line-height: 24px;
	color: rgba(255, 255, 255, 0.7);
}

.vhp-treatment-grid {
	display: grid;
	grid-template-columns: 1fr;
	gap: 1px;
	background: rgba(255, 255, 255, 0.2);
}

.vhp-treatment-grid article {
	display: flex;
	min-height: 470px;
	flex-direction: column;
	background: #181c1a;
}

.vhp-treatment-grid figure {
	position: relative;
	overflow: hidden;
	aspect-ratio: 4 / 3;
	border-bottom: 1px solid rgba(255, 255, 255, 0.15);
	background: #111513;
}

.vhp-treatment-grid figure img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.vhp-treatment-grid figure span {
	position: absolute;
	top: 12px;
	right: 12px;
	padding: 6px 10px;
	background: rgba(17, 21, 19, 0.85);
	font-size: 10px;
	color: rgba(255, 255, 255, 0.7);
}

.vhp-treatment-grid article > div {
display: flex;
	flex: 1;
	flex-direction: column;
	padding: 24px;
}

.vhp-treatment-grid h4 {
	margin: 16px 0 0;
	font-family: var(--wp--preset--font-family--heading);
	font-size: 30px;
	font-weight: 300;
	line-height: 1.25;
}

.vhp-treatment-grid article > div > p:last-child {
	margin-top: 20px;
	font-size: 14px;
	line-height: 24px;
	color: rgba(255, 255, 255, 0.7);
}

.vhp-performance {
	margin-top: 80px;
	border-top: 1px solid rgba(255, 255, 255, 0.2);
	padding-top: 64px;
}

.vhp-performance-head {
	display: grid;
	grid-template-columns: 1fr;
	gap: 40px;
}

.vhp-performance-head h3 {
	max-width: 896px;
	margin: 24px 0 0;
	font-family: var(--wp--preset--font-family--heading);
	font-size: 2.25rem;
	font-weight: 300;
	line-height: 1.02;
	letter-spacing: -0.03em;
}

.vhp-performance-head > p {
	border-top: 1px solid rgba(255, 255, 255, 0.25);
	padding-top: 20px;
	font-size: 14px;
	line-height: 28px;
	color: rgba(255, 255, 255, 0.7);
}

.vhp-performance-grid {
	display: grid;
	grid-template-columns: 1fr;
	gap: 1px;
	margin-top: 48px;
	background: rgba(255, 255, 255, 0.2);
}

.vhp-performance-grid article {
	background: #181c1a;
}

.vhp-performance-grid figure {
	position: relative;
	overflow: hidden;
	aspect-ratio: 4 / 3;
	background: #e8ece9;
}

.vhp-performance-grid figure img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.vhp-performance-grid figure.contain img {
	padding: 28px;
	object-fit: contain;
}

.vhp-performance-grid article > div {
	padding: 24px;
}

.vhp-performance-grid h4 {
	margin: 20px 0 0;
	font-family: var(--wp--preset--font-family--heading);
	font-size: 30px;
	font-weight: 300;
	line-height: 1.25;
}

.vhp-performance-grid article > div > p:last-child {
	margin-top: 20px;
	font-size: 14px;
	line-height: 28px;
	color: rgba(255, 255, 255, 0.7);
}

.vhp-performance-foot {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: space-between;
	gap: 24px;
	margin-top: 40px;
	border-top: 1px solid rgba(255, 255, 255, 0.2);
	padding-top: 32px;
}

.vhp-performance-foot > p {
	max-width: 672px;
	font-size: 14px;
	line-height: 24px;
	color: rgba(255, 255, 255, 0.7);
}

/* HydroSpark flagship */

.vhp-flagship {
	scroll-margin-top: 96px;
	overflow: hidden;
	padding: 80px 0;
	background: #171918;
	color: #fff;
}

.vhp-flagship-stage {
	display: grid;
	grid-template-columns: 1fr;
	margin-top: 64px;
	border: 1px solid rgba(255, 255, 255, 0.2);
}

.vhp-flagship-stage > figure {
	position: relative;
	min-height: 480px;
	overflow: hidden;
	background: #eeece6;
}

.vhp-flagship-stage > figure img {
	position: absolute;
	inset: 0;
	z-index: 2;
	width: 100%;
	height: 100%;
	padding: 32px;
	object-fit: contain;
}

.vhp-flagship-stage > figure i {
	position: absolute;
	z-index: 1;
	display: block;
	border: 1px solid rgba(28, 47, 184, 0.18);
	border-radius: 50%;
}

.vhp-flagship-stage > figure i:nth-child(1) {
	top: 80px;
	left: -64px;
	width: 224px;
	height: 224px;
}

.vhp-flagship-stage > figure i:nth-child(2) {
	top: 40px;
	left: 48px;
	width: 32px;
	height: 32px;
}

.vhp-flagship-stage > figure i:nth-child(3) {
	right: 32px;
	bottom: 96px;
	width: 160px;
	height: 160px;
}

.vhp-flagship-panel {
	display: flex;
	flex-direction: column;
	justify-content: space-between;
	padding: 28px;
	background: #1c2fb8;
}

.vhp-flagship-panel .vhp-overline {
	color: rgba(255, 255, 255, 0.7);
}

.vhp-flagship-panel h3 {
	max-width: 448px;
	margin: 28px 0 0;
	font-family: var(--wp--preset--font-family--heading);
	font-size: 2.25rem;
	font-weight: 300;
	line-height: 1.02;
	letter-spacing: -0.025em;
}

.vhp-flagship-panel > div > p:last-child {
	max-width: 448px;
	margin-top: 28px;
	font-size: 16px;
	line-height: 28px;
	color: rgba(255, 255, 255, 0.75);
}

.vhp-mode-grid {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	margin-top: 56px;
	border-top: 1px solid rgba(255, 255, 255, 0.25);
	border-left: 1px solid rgba(255, 255, 255, 0.25);
}

.vhp-mode-grid > div {
	border-right: 1px solid rgba(255, 255, 255, 0.25);
	border-bottom: 1px solid rgba(255, 255, 255, 0.25);
	padding: 16px;
	color: #fff;
}

.vhp-mode-grid > div.active {
	background: #fff;
	color: #1426b5;
}

.vhp-mode-grid span {
	display: block;
	font-size: 9px;
	letter-spacing: 0.16em;
	text-transform: uppercase;
	opacity: 0.75;
}

.vhp-mode-grid strong {
	display: block;
	margin-top: 20px;
	font-family: var(--wp--preset--font-family--heading);
	font-size: 20px;
	font-weight: 300;
}

.vhp-flagship-benefits {
	display: grid;
	grid-template-columns: 1fr;
	border-bottom: 1px solid rgba(255, 255, 255, 0.2);
}

.vhp-flagship-benefits article {
	border-top: 1px solid rgba(255, 255, 255, 0.2);
	padding: 32px 0;
}

.vhp-flagship-benefits article > span {
	font-size: 10px;
	color: rgba(255, 255, 255, 0.7);
}

.vhp-flagship-benefits h3 {
	margin: 32px 0 0;
	font-family: var(--wp--preset--font-family--heading);
	font-size: 24px;
	font-weight: 300;
	line-height: 1.25;
}

.vhp-flagship-benefits p {
	margin-top: 16px;
	font-size: 14px;
	line-height: 24px;
	color: rgba(255, 255, 255, 0.7);
}

.vhp-flagship-actions {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: space-between;
	gap: 24px;
	margin-top: 40px;
}

/* Product range */

.vhp-range,
.vhp-guides {
	padding: 80px 0;
	background: #fff;
}

.vhp-range-grid {
	display: grid;
	grid-template-columns: 1fr;
	gap: 40px 28px;
	margin-top: 64px;
}

.vhp-range-grid article {
	border-top: 1px solid #aeb3af;
	padding-top: 16px;
}

.vhp-range-grid a {
	display: block;
	color: inherit;
	text-decoration: none;
}

.vhp-range-grid figure {
	position: relative;
	overflow: hidden;
	aspect-ratio: 4 / 4.6;
}

.vhp-range-grid figure img {
	width: 100%;
	height: 100%;
	padding: 32px;
	object-fit: contain;
	transition: transform 0.7s;
}

.vhp-range-grid a:hover figure img,
.vhp-range-grid a:focus-visible figure img {
	transform: scale(1.035);
}

.vhp-range-grid figure > span {
	position: absolute;
	top: 16px;
	left: 16px;
	max-width: calc(100% - 32px);
	border: 1px solid rgba(22, 24, 23, 0.3);
	padding: 8px 12px;
	background: rgba(255, 255, 255, 0.8);
	font-size: 10px;
	line-height: 1.35;
	letter-spacing: 0.18em;
	text-transform: uppercase;
}

.tone-spark { background: #e7eeee; }
.tone-form { background: #ece9e2; }
.tone-view { background: #e3eceb; }
.tone-hhuhu { background: #eee8e8; }
.tone-first { background: #e5e7e4; }
.tone-vitality { background: #e8ece9; }

.tone-vitality img {
	mix-blend-mode: multiply;
}

.vhp-product-copy {
	display: flex;
	align-items: flex-start;
	justify-content: space-between;
	gap: 24px;
	padding: 20px 0;
}

.vhp-product-copy > div {
	min-width: 0;
}

.vhp-product-copy .vhp-overline {
	color: #626865;
	letter-spacing: 0.16em;
}

.vhp-product-copy h3 {
	margin: 8px 0 0;
	font-family: var(--wp--preset--font-family--heading);
	font-size: 24px;
	font-weight: 400;
	line-height: 1.25;
	letter-spacing: -0.02em;
}

.vhp-product-copy > div > p:not(.vhp-overline, .vhp-price) {
	max-width: 448px;
	margin-top: 8px;
	font-size: 14px;
	line-height: 24px;
	color: #5d625f;
}

.vhp-product-copy .vhp-price {
	margin-top: 16px;
	font-size: 14px;
}

.vhp-product-copy .price,
.vhp-product-copy .woocommerce-Price-amount {
	font-weight: inherit;
	color: inherit;
}

.vhp-product-copy > b {
	margin-top: 28px;
	font-size: 18px;
	font-weight: 400;
	transition: transform 0.18s;
}

.vhp-range-grid a:hover .vhp-product-copy > b,
.vhp-range-grid a:focus-visible .vhp-product-copy > b {
	transform: translate(4px, -4px);
}

/* Refill */

.vhp-refill {
	overflow: hidden;
	padding: 64px 0;
	background: #e8f0f7;
}

.vhp-refill .vs-in {
	display: grid;
	grid-template-columns: 1fr;
	gap: 32px;
}

.vhp-refill .vs-eye {
	color: #5b666d;
}

.vhp-refill h2 {
	max-width: 896px;
	margin: 24px 0 0;
	font-family: var(--wp--preset--font-family--heading);
	font-size: 3rem;
	font-weight: 300;
	line-height: 0.98;
	letter-spacing: -0.035em;
}

.vhp-refill .vs-in > div > p:not(.vs-eye) {
	max-width: 672px;
	margin-top: 28px;
	font-size: 18px;
	line-height: 32px;
	color: #505a5f;
}

.vhp-refill-facts {
	display: grid;
	grid-template-columns: 1fr;
	margin-top: 36px;
	border-top: 1px solid rgba(0, 0, 0, 0.2);
	border-bottom: 1px solid rgba(0, 0, 0, 0.2);
}

.vhp-refill-facts span {
	border-bottom: 1px solid rgba(0, 0, 0, 0.15);
	padding: 16px 0;
	font-size: 14px;
}

.vhp-refill-facts span:last-child {
	border-bottom: 0;
}

.vhp-refill .vs-btn {
	margin-top: 36px;
}

.vhp-refill figure {
	position: relative;
	min-height: 360px;
}

.vhp-refill figure img {
	width: 100%;
	height: 100%;
	object-fit: contain;
}

/* Service and warranty */

.vhp-support {
	padding: 80px 0;
	background: #dfe3e8;
}

.vhp-support-grid {
	display: grid;
	grid-template-columns: 1fr;
	gap: 1px;
	margin-top: 64px;
	border: 1px solid rgba(0, 0, 0, 0.2);
	background: rgba(0, 0, 0, 0.2);
}

.vhp-support-grid article {
	min-height: 270px;
	padding: 24px;
	background: #eef0f2;
}

.vhp-support-grid h3 {
	margin: 0;
	font-family: var(--wp--preset--font-family--heading);
	font-size: 24px;
	font-weight: 300;
	line-height: 1.25;
}

.vhp-support-grid dl {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 20px 16px;
	margin: 56px 0 0;
	font-size: 14px;
}

.vhp-support-grid dl .wide {
	grid-column: 1 / -1;
}

.vhp-support-grid dt {
	font-size: 10px;
	line-height: 1.4;
	letter-spacing: 0.16em;
	text-transform: uppercase;
	color: #5f6663;
}

.vhp-support-grid dd {
	margin: 4px 0 0;
	line-height: 1.55;
}

/* Guides */

.vhp-guide-grid {
	display: grid;
	grid-template-columns: 1fr;
	gap: 40px 32px;
	margin-top: 56px;
}

.vhp-guide-grid a {
	display: block;
	border-top: 1px solid rgba(0, 0, 0, 0.3);
	padding-top: 16px;
	color: inherit;
	text-decoration: none;
}

.vhp-guide-grid .vhp-overline {
	color: #6b716d;
	letter-spacing: 0.18em;
}

.vhp-guide-grid h3 {
	margin: 48px 0 0;
	font-family: var(--wp--preset--font-family--heading);
	font-size: 30px;
	font-weight: 300;
	line-height: 1.25;
	transition: color 0.18s;
}

.vhp-guide-grid a:hover h3,
.vhp-guide-grid a:focus-visible h3 {
	color: #1426b5;
}

.vhp-guide-grid a > p:not(.vhp-overline) {
	margin-top: 16px;
	font-size: 14px;
	line-height: 24px;
	color: #5d625f;
}

.vhp-guide-grid b {
	display: block;
	margin-top: 32px;
	font-size: 18px;
	font-weight: 400;
}

/* Category range */

.vhp-categories {
	scroll-margin-top: 96px;
	padding: 80px 0;
	background: #f6f4ee;
}

.vhp-category-grid {
	display: grid;
	grid-template-columns: 1fr;
	gap: 48px 20px;
	margin-top: 64px;
}

.vhp-category-grid > a {
	display: block;
	color: inherit;
	text-decoration: none;
}

.vhp-category-grid figure {
	position: relative;
	overflow: hidden;
	aspect-ratio: 4 / 3;
	background: #e5e0d8;
}

.vhp-category-grid figure img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	transition: transform 0.5s;
}

.vhp-category-grid a:hover figure img,
.vhp-category-grid a:focus-visible figure img {
	transform: scale(1.015);
}

.vhp-category-grid figure span {
	position: absolute;
	top: 16px;
	left: 16px;
	padding: 8px 12px;
	background: rgba(255, 255, 255, 0.9);
	font-size: 9px;
	letter-spacing: 0.16em;
	text-transform: uppercase;
}

.vhp-category-grid > a > div {
	border-top: 1px solid rgba(0, 0, 0, 0.25);
	padding-top: 20px;
}

.vhp-category-grid .vhp-overline {
	color: #6b716d;
	letter-spacing: 0.18em;
}

.vhp-category-grid h2 {
	display: flex;
	align-items: flex-start;
	justify-content: space-between;
	gap: 24px;
	margin: 12px 0 0;
	font-family: var(--wp--preset--font-family--heading);
	font-size: 30px;
	font-weight: 300;
	line-height: 1.25;
	transition: color 0.18s;
}

.vhp-category-grid h2 b {
	font-size: 18px;
	font-weight: 400;
}

.vhp-category-grid a:hover h2,
.vhp-category-grid a:focus-visible h2 {
	color: #1426b5;
}

.vhp-category-grid > a > div > p:not(.vhp-overline) {
	max-width: 576px;
	margin-top: 16px;
	font-size: 14px;
	line-height: 24px;
	color: #5d625f;
}

.vhp-category-grid small {
	display: block;
	margin-top: 16px;
	font-size: 12px;
	line-height: 1.5;
	letter-spacing: 0.14em;
	text-transform: uppercase;
	color: #5f6663;
}

.vhp-category-actions {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: flex-end;
	gap: 32px;
	margin-top: 48px;
}

/* Showroom and advice */

.vhp-showroom {
	border-top: 1px solid rgba(0, 0, 0, 0.15);
	padding: 56px 0;
	background: #ddd8ce;
}

.vhp-showroom .vs-in {
	display: grid;
	grid-template-columns: 1fr;
	gap: 32px;
}

.vhp-showroom figure {
	position: relative;
	min-height: 280px;
	overflow: hidden;
}

.vhp-showroom figure img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.vhp-showroom .vs-eye {
	color: #5b605d;
}

.vhp-showroom h2 {
	max-width: 768px;
	margin: 20px 0 0;
	font-family: var(--wp--preset--font-family--heading);
	font-size: 2.25rem;
	font-weight: 300;
	line-height: 1.25;
}

.vhp-showroom .vs-in > div > p:not(.vs-eye) {
	max-width: 672px;
	margin-top: 20px;
	font-size: 16px;
	line-height: 28px;
	color: #555b57;
}

.vhp-showroom .vs-btn {
	margin-top: 28px;
}

.vhp-advice {
	padding: 64px 0;
	background: #101a86;
	color: #fff;
}

.vhp-advice .vs-in {
	display: grid;
	grid-template-columns: 1fr;
	gap: 32px;
	align-items: center;
}

.vhp-advice .vs-eye {
	color: rgba(255, 255, 255, 0.65);
}

.vhp-advice h2 {
	max-width: 896px;
	margin: 20px 0 0;
	font-family: var(--wp--preset--font-family--heading);
	font-size: 2.25rem;
	font-weight: 300;
	line-height: 1.03;
	letter-spacing: -0.025em;
}

.vhp-advice .vs-in > div:first-child > p:not(.vs-eye) {
	max-width: 672px;
	margin-top: 24px;
	font-size: 16px;
	line-height: 28px;
	color: rgba(255, 255, 255, 0.7);
}

.vhp-advice figure {
	width: 100%;
	max-width: 170px;
	margin-left: auto;
	aspect-ratio: 1;
}

.vhp-advice figure img {
	width: 100%;
	height: 100%;
	object-fit: contain;
}

@media (min-width: 512px) {
	.vhp-hero h1 {
		font-size: 3.75rem;
	}

	.vhp-ro-intro-note img {
		width: 176px;
		height: 176px;
	}

	.vhp-ro-intro-note p {
		padding-left: 128px;
	}

	.vhp-ro-fact-grid {
		grid-template-columns: repeat(3, minmax(0, 1fr));
	}

	.vhp-ro-fact-grid article {
		border-top: 0;
		border-left: 1px solid rgba(255, 255, 255, 0.2);
		padding-right: 24px;
		padding-left: 24px;
	}

	.vhp-treatment-grid {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}

	.vhp-flagship-stage > figure img {
		padding: 56px;
	}

	.vhp-flagship-panel {
		padding: 40px;
	}

	.vhp-range-grid {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}

	.vhp-range-grid figure img {
		padding: 48px;
	}

	.vhp-refill-facts {
		grid-template-columns: repeat(3, minmax(0, 1fr));
	}

	.vhp-refill-facts span {
		border-right: 1px solid rgba(0, 0, 0, 0.15);
		border-bottom: 0;
		padding-right: 16px;
		padding-left: 16px;
	}

	.vhp-refill-facts span:first-child {
		padding-left: 0;
	}

	.vhp-refill-facts span:last-child {
		border-right: 0;
	}

	.vhp-support-grid {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}
}

@media (min-width: 768px) {
	.vhp-guide-grid {
		grid-template-columns: repeat(3, minmax(0, 1fr));
	}
}

@media (min-width: 1024px) {
	.vs-in {
		padding-right: 32px;
		padding-left: 32px;
	}

	.vhp-section-head {
		grid-template-columns: repeat(12, minmax(0, 1fr));
	}

	.vhp-section-head > .vs-eye {
		grid-column: span 3 / span 3;
	}

	.vhp-section-head > div {
		grid-column: 5 / span 8;
	}

	.vhp-section-head h2 {
		font-size: 3rem;
	}

	.vhp-section-head > div > p {
		font-size: 18px;
	}

	.vhp-hero-bg {
		position: absolute;
		inset: 0;
		display: block;
	}

	.vhp-hero-bg img {
		width: 100%;
		height: 100%;
		object-fit: cover;
		object-position: center;
	}

	.vhp-hero-bg::after {
		position: absolute;
		inset: 0;
		content: "";
		background: linear-gradient(90deg, rgba(244, 241, 234, 0.98) 0%, rgba(244, 241, 234, 0.95) 36%, rgba(244, 241, 234, 0.62) 52%, rgba(244, 241, 234, 0.08) 72%, rgba(244, 241, 234, 0) 100%);
	}

	.vhp-hero-mobile {
		display: none;
	}

	.vhp-hero-in {
		min-height: 760px;
		grid-template-columns: repeat(12, minmax(0, 1fr));
	}

	.vhp-hero-copy {
		grid-column: span 7 / span 7;
		align-self: center;
		padding: 80px 0;
	}

	.vhp-hero h1 {
		font-size: 4.5rem;
	}

	.vhp-ro,
	.vhp-flagship,
	.vhp-range,
	.vhp-support,
	.vhp-guides,
	.vhp-categories {
		padding-top: 112px;
		padding-bottom: 112px;
	}

	.vhp-ro-intro {
		grid-template-columns: repeat(12, minmax(0, 1fr));
		align-items: end;
	}

	.vhp-ro-intro > div:first-child {
		grid-column: span 7 / span 7;
	}

	.vhp-ro-intro-note {
		grid-column: 8 / span 5;
		margin-top: 0;
	}

	.vhp-ro-intro-note img {
		width: 192px;
		height: 192px;
	}

	.vhp-ro-intro-note p {
		padding-left: 144px;
	}

	.vhp-ro-intro h2 {
		font-size: 3.75rem;
	}

	.vhp-ro-facts {
		grid-template-columns: repeat(12, minmax(0, 1fr));
	}

	.vhp-ro-scale {
		grid-column: span 5 / span 5;
		border-right: 1px solid rgba(255, 255, 255, 0.2);
		padding-right: 40px;
	}

	.vhp-ro-scale strong {
		font-size: 6.5rem;
	}

	.vhp-ro-fact-grid {
		grid-column: span 7 / span 7;
	}

	.vhp-subhead {
		flex-direction: row;
		align-items: flex-end;
	}

	.vhp-subhead h3 {
		font-size: 36px;
	}

	.vhp-performance-head {
		grid-template-columns: repeat(12, minmax(0, 1fr));
		align-items: end;
	}

	.vhp-performance-head > div {
		grid-column: span 7 / span 7;
	}

	.vhp-performance-head > p {
		grid-column: 9 / span 4;
	}

	.vhp-performance-head h3 {
		font-size: 3rem;
	}

	.vhp-performance-grid {
		grid-template-columns: repeat(3, minmax(0, 1fr));
	}

	.vhp-performance-grid article > div {
		padding: 32px;
	}

	.vhp-flagship-benefits {
		grid-template-columns: repeat(3, minmax(0, 1fr));
	}

	.vhp-flagship-benefits article {
		border-right: 1px solid rgba(255, 255, 255, 0.2);
		padding: 32px;
	}

	.vhp-flagship-benefits article:first-child {
		padding-left: 0;
	}

	.vhp-flagship-benefits article:last-child {
		border-right: 0;
		padding-right: 0;
	}

	.vhp-refill {
		padding-top: 80px;
		padding-bottom: 80px;
	}

	.vhp-refill .vs-in {
		grid-template-columns: repeat(12, minmax(0, 1fr));
		align-items: center;
	}

	.vhp-refill .vs-in > div {
		grid-column: span 7 / span 7;
	}

	.vhp-refill figure {
		grid-column: span 5 / span 5;
		min-height: 500px;
	}

	.vhp-support-grid {
		grid-template-columns: repeat(3, minmax(0, 1fr));
	}

	.vhp-category-grid {
		grid-template-columns: repeat(12, minmax(0, 1fr));
	}

	.vhp-category-grid .water,
	.vhp-category-grid .vital {
		grid-column: span 7 / span 7;
	}

	.vhp-category-grid .hydrogen,
	.vhp-category-grid .air {
		grid-column: span 5 / span 5;
	}

	.vhp-showroom {
		padding-top: 80px;
		padding-bottom: 80px;
	}

	.vhp-showroom .vs-in {
		grid-template-columns: repeat(12, minmax(0, 1fr));
		align-items: center;
	}

	.vhp-showroom figure {
		grid-column: span 4 / span 4;
	}

	.vhp-showroom .vs-in > div {
		grid-column: 6 / span 7;
	}

	.vhp-showroom h2 {
		font-size: 3rem;
	}

	.vhp-advice {
		padding-top: 96px;
		padding-bottom: 96px;
	}

	.vhp-advice .vs-in {
		grid-template-columns: repeat(12, minmax(0, 1fr));
	}

	.vhp-advice .vs-in > div:first-child {
		grid-column: span 6 / span 6;
	}

	.vhp-advice figure {
		grid-column: span 2 / span 2;
		max-width: 220px;
	}

	.vhp-advice .vs-in > div:last-child {
		display: flex;
		grid-column: span 4 / span 4;
		justify-content: flex-end;
	}

	.vhp-advice h2 {
		font-size: 3.75rem;
	}
}

@media (min-width: 1280px) {
	.vs-in {
		padding-right: 48px;
		padding-left: 48px;
	}

	.vhp-section-head h2 {
		font-size: 3.75rem;
	}

	.vhp-hero-copy {
		grid-column: span 6 / span 6;
		padding-top: 96px;
		padding-bottom: 96px;
	}

	.vhp-hero h1 {
		font-size: 6rem;
	}

	.vhp-ro-intro h2 {
		font-size: 4.5rem;
	}

	.vhp-treatment-grid {
		grid-template-columns: repeat(4, minmax(0, 1fr));
	}

	.vhp-flagship-stage {
		grid-template-columns: repeat(12, minmax(0, 1fr));
	}

	.vhp-flagship-stage > figure {
		grid-column: span 7 / span 7;
		min-height: 680px;
		border-right: 1px solid rgba(255, 255, 255, 0.2);
	}

	.vhp-flagship-stage > figure img {
		padding: 80px;
	}

	.vhp-flagship-panel {
		grid-column: span 5 / span 5;
		padding: 48px;
	}

	.vhp-flagship-panel h3 {
		font-size: 3rem;
	}

	.vhp-range-grid {
		grid-template-columns: repeat(4, minmax(0, 1fr));
	}

	.vhp-range-grid article:nth-child(5) {
		grid-column: 2;
	}
}

/* Onest needs a heavier numeric weight than the source's former display face
   to preserve the same visual authority and line density. */
.vhp-tech {
	padding: 84px 0;
	background: #111513;
	color: #fff;
}

.vhp-tech-head {
	display: grid;
	grid-template-columns: 1fr;
	gap: 24px;
}

.vhp-tech-head .vs-eye,
.vhp-tech-head p,
.vhp-tech-foot p,
.vhp-tech-grid .vhp-overline,
.vhp-tech-grid > a > span {
	color: rgba(255, 255, 255, 0.64);
}

.vhp-tech-head h2 {
	max-width: 760px;
	margin: 0;
	color: #fff;
	font-size: clamp(2.8rem, 6vw, 5rem);
	font-weight: 700;
	line-height: 0.94;
	letter-spacing: -0.05em;
}

.vhp-tech-head p {
	max-width: 590px;
	margin: 24px 0 0;
	font-size: 16px;
	line-height: 1.7;
}

.vhp-tech-grid {
	display: grid;
	grid-template-columns: 1fr;
	gap: 1px;
	margin-top: 58px;
	background: rgba(255, 255, 255, 0.2);
}

.vhp-tech-grid > a {
	position: relative;
	display: block;
	min-height: 320px;
	padding: 24px;
	background: #111513;
	color: #fff;
	text-decoration: none;
	transition: background-color 180ms ease;
}

.vhp-tech-grid > a:hover,
.vhp-tech-grid > a:focus-visible {
	background: #1426b5;
	color: #fff;
}

.vhp-tech-grid .vhp-overline {
	margin-top: 50px;
}

.vhp-tech-grid h3 {
	margin: 18px 0 0;
	color: #fff;
	font-size: 2rem;
	font-weight: 600;
	letter-spacing: -0.035em;
}

.vhp-tech-grid p:not(.vhp-overline) {
	max-width: 340px;
	margin: 18px 0 0;
	color: rgba(255, 255, 255, 0.66);
	font-size: 14px;
	line-height: 1.7;
}

.vhp-tech-grid b {
	position: absolute;
	right: 24px;
	bottom: 22px;
	font-weight: 400;
}

.vhp-tech-foot {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: 28px;
	margin-top: 40px;
}

.vhp-tech-foot p {
	max-width: 660px;
	margin: 0;
	font-size: 13px;
	line-height: 1.7;
}

.vhp-proof {
	padding: 84px 0;
	background: #dce8f0;
}

.vhp-proof .vs-in {
	display: grid;
	grid-template-columns: 1fr;
	gap: 36px;
}

.vhp-proof h2 {
	max-width: 780px;
	margin: 24px 0 0;
	font-size: clamp(2.8rem, 6vw, 5rem);
	font-weight: 700;
	line-height: 0.94;
	letter-spacing: -0.05em;
}

.vhp-proof p:not(.vs-eye) {
	max-width: 680px;
	margin: 26px 0 0;
	color: #5f6663;
	font-size: 16px;
	line-height: 1.75;
}

.vhp-proof-actions {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: 28px;
}

@media (min-width: 1024px) {
	.vhp-tech {
		padding: 120px 0;
	}

	.vhp-tech-head {
		grid-template-columns: repeat(12, minmax(0, 1fr));
		align-items: end;
	}

	.vhp-tech-head > .vs-eye {
		grid-column: span 3;
		align-self: start;
	}

	.vhp-tech-head > div {
		grid-column: 5 / span 8;
	}

	.vhp-tech-grid {
		grid-template-columns: repeat(4, minmax(0, 1fr));
	}

	.vhp-tech-foot {
		flex-direction: row;
		align-items: center;
		justify-content: space-between;
	}

	.vhp-proof {
		padding: 110px 0;
	}

	.vhp-proof .vs-in {
		grid-template-columns: minmax(0, 1.35fr) minmax(300px, 0.65fr);
		align-items: end;
	}

	.vhp-proof-actions {
		align-items: flex-end;
	}
}

.vhp-hero h1,
.vhp-ro-intro h2,
.vhp-section-head h2,
.vhp-refill h2,
.vhp-showroom h2,
.vhp-advice h2,
.vhp-performance-head h3,
.vhp-flagship-panel h3 {
	font-weight: 700;
}

.vhp-ro h2,
.vhp-ro h3,
.vhp-ro h4,
.vhp-flagship h2,
.vhp-flagship h3,
.vhp-advice h2 {
	color: #fff;
}

.vhp-subhead h3,
.vhp-treatment-grid h4,
.vhp-performance-grid h4,
.vhp-flagship-benefits h3,
.vhp-product-copy h3,
.vhp-support-grid h3,
.vhp-guide-grid h3,
.vhp-category-grid h2 {
	font-weight: 600;
}

/* The scoped link reset has greater specificity than the shared button
   primitive, so restate the intended colour variants inside the homepage. */
.vhp a.vs-btn {
	color: #fff;
}

.vhp a.vs-btn-outline {
	color: #161817;
}

.vhp a.vs-btn-light {
	color: #161817;
}

.vhp a.vs-btn:hover,
.vhp a.vs-btn:focus-visible,
.vhp a.vs-btn-outline:hover,
.vhp a.vs-btn-outline:focus-visible {
	color: #fff;
}

.vhp a.vs-tlink-light {
	color: #fff;
}

@media (prefers-reduced-motion: reduce) {
	.vhp *,
	.vs-btn,
	.vs-tlink {
		scroll-behavior: auto !important;
		transition-duration: 0.01ms !important;
	}
}

/* 2026 four-pillar brand homepage. */
.vhome { background:#f5f3ed; }
.vhome-hero { position:relative; min-height:calc(100svh - 84px); overflow:hidden; background:#101211; color:#fff; }
.vhome-hero > figure { position:absolute; inset:0; }
.vhome-hero > figure::after { content:""; position:absolute; inset:0; background:linear-gradient(90deg,rgba(10,13,12,.84) 0%,rgba(10,13,12,.48) 52%,rgba(10,13,12,.15) 100%); }
.vhome-hero > figure img { width:100%; height:100%; object-fit:cover; filter:saturate(.78); }
.vhome-hero-copy { position:relative; z-index:1; display:flex; min-height:calc(100svh - 84px); flex-direction:column; align-items:flex-start; justify-content:flex-end; padding-top:120px; padding-bottom:72px; }
.vhome-hero-copy h1 { max-width:950px; margin:20px 0 0; color:#fff; font-family:var(--wp--preset--font-family--heading); font-size:clamp(4rem,11vw,10.5rem); font-weight:700; line-height:.83; letter-spacing:-.065em; }
.vhome-hero-copy > p:not(.vs-eye) { max-width:650px; margin:34px 0 0; color:rgba(255,255,255,.84); font-size:clamp(1.15rem,2vw,1.65rem); line-height:1.45; }
.vhome-hero-copy .vs-btn { margin-top:38px; }

.vhome-manifesto { padding:92px 0; background:#f5f3ed; }
.vhome-manifesto .vs-in { display:grid; gap:42px; }
.vhome-manifesto h2 { max-width:1050px; margin:0; font-family:var(--wp--preset--font-family--heading); font-size:clamp(2.4rem,5.8vw,5.6rem); font-weight:700; line-height:.96; letter-spacing:-.045em; }
.vhome-manifesto-copy > p { max-width:780px; margin:32px 0 0; color:#59605d; font-size:18px; line-height:1.72; }
.vhome-manifesto-aside { display:flex; flex-direction:column; }
.vhome-mascot-home { width:min(300px,78vw); margin:38px auto -12px; }

.vhome-pillars { padding:92px 0 110px; background:#fff; }
.vhome-pillars header,.vhome-stories header { display:grid; gap:20px; margin-bottom:55px; }
.vhome-pillars header h2,.vhome-stories header h2,.vhome-evidence header h2,.vhome-learn h2,.vhome-close h2 { max-width:940px; margin:0; font-family:var(--wp--preset--font-family--heading); font-size:clamp(2.7rem,6vw,6rem); font-weight:700; line-height:.94; letter-spacing:-.045em; }
.vhome-pillars header > p:last-child,.vhome-stories header > p:last-child,.vhome-evidence header > p:last-child { max-width:680px; margin:0; color:#626865; font-size:17px; line-height:1.65; }
.vhome-pillar-grid { display:grid; gap:1px; background:#c9cbc8; border:1px solid #c9cbc8; }
.vhome-pillar-grid > a { display:grid; min-width:0; grid-template-rows:auto 300px 1fr; background:#f7f7f4; color:#161817; text-decoration:none; transition:background .2s,transform .2s; }
.vhome-pillar-grid > a:hover { background:#fff; }
.vhome-pillar-logo { display:flex; height:105px; align-items:center; padding:24px; background:#fff; }
.vhome-pillar-logo img { width:auto; height:38px; max-width:min(100%,290px); }
.vhome-pillar-grid figure { overflow:hidden; }
.vhome-pillar-grid figure img { width:100%; height:100%; object-fit:cover; transition:transform .35s; }
.vhome-pillar-grid > a:hover figure img { transform:scale(1.025); }
.vhome-pillar-grid > a > div:last-child { display:flex; flex-direction:column; padding:28px; }
.vhome-pillar-grid span { color:#6d7470; font-size:11px; letter-spacing:.18em; text-transform:uppercase; }
.vhome-pillar-grid h3 { margin:22px 0 0; font-size:1.8rem; line-height:1.06; letter-spacing:-.03em; }
.vhome-pillar-grid p { margin:20px 0 0; color:#626865; line-height:1.62; }
.vhome-pillar-grid b { margin-top:auto; padding-top:34px; font-size:14px; font-weight:500; text-decoration:underline; text-underline-offset:5px; }

@media (max-width:600px) {
	.vhome-pillar-logo img { height:34px; max-width:100%; }
}

.vhome-evidence { padding:105px 0; background:#101211; color:#fff; }
.vhome-evidence .vs-in { position:relative; }
.vhome-evidence header { display:grid; gap:22px; }
.vhome-evidence header h2 { color:#fff; }
.vhome-evidence header > p:last-child { color:rgba(255,255,255,.68); }
.vhome-evidence-grid { display:grid; margin-top:58px; border-top:1px solid rgba(255,255,255,.25); border-left:1px solid rgba(255,255,255,.25); }
.vhome-evidence-grid article { display:flex; min-height:500px; flex-direction:column; border-right:1px solid rgba(255,255,255,.25); border-bottom:1px solid rgba(255,255,255,.25); padding:24px; }
.vhome-evidence-grid span { color:#7b8580; font-size:12px; }
.vhome-evidence-grid figure { position:relative; height:170px; margin:24px 0 0; overflow:hidden; background:#f0f1ee; }
.vhome-evidence-grid figure img { width:100%; height:100%; object-fit:cover; }
.vhome-evidence-grid h3 { margin:28px 0 0; color:#fff; font-size:1.45rem; line-height:1.1; }
.vhome-evidence-grid p { margin:18px 0 0; color:rgba(255,255,255,.65); line-height:1.65; }
.vhome-evidence-sgs { display:flex; flex-direction:column; align-items:center; justify-content:center; padding:16px; background:#fff !important; }
.vhome-evidence-grid .vhome-evidence-sgs img { width:auto; max-width:72%; height:104px; object-fit:contain; }
.vhome-evidence-sgs small { margin-top:10px; color:#646a67; font-size:9px; letter-spacing:.18em; text-transform:uppercase; }
.vhome-evidence-actions { display:flex; flex-wrap:wrap; align-items:center; gap:32px; margin-top:42px; }
.vhome-mascot { display:block; height:auto; pointer-events:none; user-select:none; }
.vhome-mascot-evidence { width:180px; margin:34px 0 -14px auto; }

.vhome-stories { padding:105px 0; background:#f5f3ed; }
.vhome-story { display:grid; gap:42px; border-top:1px solid #aaaFAA; padding:60px 0; }
.vhome-story figure { min-height:430px; overflow:hidden; background:#e8e9e4; }
.vhome-story figure img { width:100%; height:100%; min-height:430px; object-fit:cover; }
.vhome-story-ro figure img,.vhome-story-h2 figure img { object-fit:contain; }
.vhome-story-featured figure img { object-position:76% center; }
.vhome-story > div { display:flex; min-width:0; flex-direction:column; justify-content:center; }
.vhome-story > div > span { color:#6d7470; font-size:11px; letter-spacing:.18em; text-transform:uppercase; }
.vhome-story h3 { max-width:680px; margin:24px 0 0; font-family:var(--wp--preset--font-family--heading); font-size:clamp(2.25rem,4.6vw,4.5rem); line-height:.96; letter-spacing:-.045em; }
.vhome-story p { max-width:660px; margin:26px 0 0; color:#59605d; font-size:17px; line-height:1.68; }
.vhome-story dl { margin:32px 0 0; border-top:1px solid #b8bbb7; }
.vhome-story dl > div { display:grid; gap:8px; border-bottom:1px solid #b8bbb7; padding:16px 0; }
.vhome-story dt { font-weight:700; }
.vhome-story dd { margin:0; color:#626865; line-height:1.5; }
.vhome-story ul { display:grid; gap:0; margin:32px 0 0; padding:0; border-top:1px solid #b8bbb7; list-style:none; }
.vhome-story li { border-bottom:1px solid #b8bbb7; padding:16px 0; color:#4f5652; }
.vhome-story > div > a { align-self:flex-start; margin-top:34px; color:#161817; font-weight:600; text-decoration:underline; text-underline-offset:6px; }

.vhome-learn { padding:105px 0; background:#dfe8e3; }
.vhome-learn .vs-in { display:grid; gap:60px; }
.vhome-learn-copy { position:relative; }
.vhome-learn h2 { margin-top:22px; }
.vhome-learn-copy > p:not(.vs-eye) { max-width:660px; margin:28px 0 0; color:#59605d; font-size:17px; line-height:1.65; }
.vhome-mascot-guides { width:min(270px,72vw); margin:36px 0 -28px auto; }
.vhome-learn nav { border-top:1px solid #7f8883; }
.vhome-learn nav a { display:flex; align-items:center; justify-content:space-between; gap:24px; border-bottom:1px solid #7f8883; padding:25px 4px; color:#161817; text-decoration:none; }
.vhome-learn nav span { font-size:1.4rem; font-weight:650; }
.vhome-learn nav b { font-size:14px; font-weight:500; }

.vhome-close { padding:105px 0; background:#1321a1; color:#fff; }
.vhome-close .vs-in { display:grid; gap:50px; }
.vhome-close h2 { margin-top:20px; color:#fff; }
.vhome-close p:not(.vs-eye) { max-width:680px; margin:28px 0 0; color:rgba(255,255,255,.75); font-size:17px; line-height:1.65; }
.vhome-close .vs-in > div:last-child { display:flex; flex-wrap:wrap; align-items:center; gap:30px; }
.vhome-mascot-inhalation { width:min(300px,78vw); flex:0 0 100%; margin:0 0 2px auto; }
.vhp .vhome-close a.vhome-book { border:1px solid rgba(255,255,255,.7); background:transparent; color:#fff; }
.vhp .vhome-close a.vhome-book:hover,.vhp .vhome-close a.vhome-book:focus-visible { background:#fff; color:#161817; }

@media (min-width:760px) {
	.vhome-manifesto .vs-in { grid-template-columns:280px minmax(0,1fr); }
	.vhome-mascot-home { width:300px; max-width:none; margin:50px 0 0 -20px; }
	.vhome-pillar-grid,.vhome-evidence-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
	.vhome-story { grid-template-columns:minmax(0,1.05fr) minmax(0,.95fr); gap:70px; }
	.vhome-story-h2 figure { order:2; }
	.vhome-story-h2 > div { order:1; }
	.vhome-story dl > div { grid-template-columns:150px minmax(0,1fr); }
}
@media (min-width:1100px) {
	.vhome-hero-copy,.vhome-manifesto,.vhome-pillars,.vhome-evidence,.vhome-stories,.vhome-learn,.vhome-close { padding-right:48px; padding-left:48px; }
	.vhome-pillar-grid,.vhome-evidence-grid { grid-template-columns:repeat(4,minmax(0,1fr)); }
	.vhome-learn .vs-in,.vhome-close .vs-in { grid-template-columns:minmax(0,1.15fr) minmax(380px,.85fr); align-items:end; }
	.vhome-close .vs-in > div:last-child { justify-content:flex-end; }
	.vhome-mascot-evidence { position:absolute; top:-20px; right:0; width:210px; margin:0; }
	.vhome-evidence header { padding-right:230px; }
	.vhome-mascot-guides { width:300px; margin-top:42px; margin-right:8%; }
}
@media (max-width:759px) {
	.vhome-hero { min-height:760px; }
	.vhome-hero-copy { min-height:760px; padding-bottom:50px; }
	.vhome-hero > figure::after { background:linear-gradient(0deg,rgba(10,13,12,.92),rgba(10,13,12,.12) 80%); }
	.vhome-pillar-grid > a { grid-template-rows:auto 250px 1fr; }
	.vhome-evidence-grid article { min-height:460px; }
	.vhome-story { padding:44px 0; }
	.vhome-story figure,.vhome-story figure img { min-height:330px; }
}