/* Vitality Wellness: site styles. Loaded after Elementor. */
:root {
	/* Designed as a light site: keep browsers' automatic dark mode from muddying the gold. */
	color-scheme: only light;
	--vw-ink: #15130F;
	/* Accent yellow (kept under the old --vw-gold names so every rule follows it). */
	--vw-gold: #E4EE5A;
	--vw-gold-dark: #C9D23F;
	--vw-paper: #F6F2EA;
	--vw-line: #E2DBCE;
	--vw-stopper: #2A2622;
}

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

html { scroll-behavior: smooth; }

/* Header stays on screen; anchors land below it. The offer strip above the bar (.vw-topbar)
   scrolls away: vw.js sets --vw-bar to its height and the header sticks that far above the top. */
.elementor-location-header {
	position: sticky;
	top: calc(-1 * var(--vw-bar, 0px));
	z-index: 100;
	transition: transform .45s cubic-bezier(.4, 0, .2, 1);
}
.elementor-location-header.vw-hide { transform: translateY(-100%); }

/* Header layout: equal sides keep the logo centred; the bar slims once the page scrolls. */
.vw-header { transition: min-height .3s ease; }
.vw-header .vw-hd-side { flex: 1 1 0 !important; min-width: 0; }
.vw-header .vw-logo { flex: none; }
.vw-logo img { display: block; transition: width .3s ease; }
/* Seven menu items beside a centred logo: tighter type between 1280 and 1399px,
   and below 1280 the menu folds into the toggle (as on tablets). */
@media (min-width: 1280px) and (max-width: 1399px) {
	.vw-header .elementor-nav-menu--main .elementor-item { font-size: 14px !important; padding-left: 7px !important; padding-right: 7px !important; }
}
@media (min-width: 1025px) and (max-width: 1279px) {
	.vw-header .elementor-nav-menu--main { display: none !important; }
	.vw-header .elementor-menu-toggle { display: flex !important; }
	.vw-header .elementor-nav-menu--dropdown { display: block !important; }
}
.vw-scrolled .vw-header { min-height: 68px !important; }
.vw-scrolled .vw-logo img { width: 132px !important; }
.vw-hd-phone .elementor-icon-list-item > a { align-items: center; }
@media (max-width: 1024px) {
	.vw-scrolled .vw-header { min-height: 62px !important; }
	.vw-scrolled .vw-logo img { width: 116px !important; }
	.vw-hd-call .elementor-icon { padding: 11px !important; }
}

/* Offer strip above the header. */
.vw-topbar { text-align: center; }
.vw-topbar p { margin: 0; }

/* The logo link and buttons are inline-blocks, which leave a descender gap below
   them and push them above the row's centre; flex removes the gap. Elementor's
   own hide-on-device classes are restated after it so they still win. */
.vw-logo.elementor-widget-image,
.vw-syringe.elementor-widget-button,
.vw-call.elementor-widget-icon { display: flex; align-items: center; }
@media (min-width: 1025px) {
	.vw-syringe.elementor-hidden-desktop, .vw-call.elementor-hidden-desktop { display: none; }
}
@media (min-width: 768px) and (max-width: 1024px) {
	.vw-syringe.elementor-hidden-tablet, .vw-call.elementor-hidden-tablet { display: none; }
}
@media (max-width: 767px) {
	.vw-syringe.elementor-hidden-mobile, .vw-call.elementor-hidden-mobile { display: none; }
}
.admin-bar .elementor-location-header { top: calc(32px - var(--vw-bar, 0px)); }
@media (max-width: 782px) {
	.admin-bar .elementor-location-header { top: calc(-1 * var(--vw-bar, 0px)); }
}
.elementor-location-single [id], .elementor [id].e-con { scroll-margin-top: 92px; }

/* ------------------------------------------------------------------
 * Injection button. Add the class "vw-syringe" to any Button widget
 * (Advanced > CSS Classes) or to a Form widget for its submit button;
 * add "vw-syringe--dark" as well on dark backgrounds.
 * At rest it is a plain outlined button, like an empty syringe barrel.
 * On hover gold fills it from left to right behind a dark rubber
 * stopper, the way a syringe fills, and the dose marks appear.
 * Moving away drains it again.
 *   ::before   the gold fill, with the stopper as its leading edge
 *   ::after    dose marks along the bottom, shown while filled
 * ------------------------------------------------------------------ */
.vw-syringe .elementor-button {
	position: relative;
	isolation: isolate;
	overflow: hidden;
	border: 1.5px solid var(--vw-ink);
	border-radius: 4px;
	background-color: transparent;
	transition: color .3s ease .15s, border-color .3s ease;
}
.vw-syringe--dark .elementor-button { border-color: var(--vw-gold); }

.vw-syringe .elementor-button::before {
	content: "";
	position: absolute;
	z-index: -1;
	top: 0;
	bottom: 0;
	left: -9px;
	width: 0;
	/* The theme sets border-box on pseudo-elements; content-box keeps the stopper
	   outside the fill, so it slides off the end once the button is full. */
	box-sizing: content-box;
	background: var(--vw-gold);
	border-right: 9px solid var(--vw-stopper);
	box-shadow: inset -2px 0 0 rgba(255, 255, 255, .45);
	transition: width .45s cubic-bezier(.4, 0, .2, 1);
}

.vw-syringe .elementor-button::after {
	content: "";
	position: absolute;
	z-index: -1;
	left: 14px;
	right: 14px;
	bottom: 0;
	height: 8px;
	background:
		repeating-linear-gradient(90deg, rgba(21, 19, 15, .45) 0 1px, transparent 1px 8px) 0 100% / 100% 4px no-repeat,
		repeating-linear-gradient(90deg, rgba(21, 19, 15, .5) 0 1px, transparent 1px 40px) 0 100% / 100% 8px no-repeat;
	opacity: 0;
	transition: opacity .2s ease;
	pointer-events: none;
}

.vw-syringe .elementor-button:hover::before,
.vw-syringe .elementor-button:focus-visible::before {
	width: calc(100% + 9px);
	transition: width .8s cubic-bezier(.65, 0, .35, 1);
}
.vw-syringe .elementor-button:hover::after,
.vw-syringe .elementor-button:focus-visible::after {
	opacity: 1;
	transition: opacity .3s ease .45s;
}
.vw-syringe .elementor-button:hover,
.vw-syringe .elementor-button:focus-visible { border-color: var(--vw-gold); }
.vw-syringe .elementor-button:active::before { background: var(--vw-gold-dark); }
.vw-syringe .elementor-button:focus-visible {
	outline: 2px solid currentColor;
	outline-offset: 4px;
}

/* Solid variant (header): yellow at rest; hover fills it with cream the same injection way. */
.vw-syringe--solid .elementor-button {
	background-color: var(--vw-gold) !important;
	border-color: var(--vw-gold) !important;
	color: var(--vw-ink) !important;
}
.vw-syringe--solid .elementor-button::before { background: #F4EFE6; }
.vw-syringe--solid .elementor-button:active::before { background: #E6DFD2; }
.vw-syringe--solid .elementor-button:hover,
.vw-syringe--solid .elementor-button:focus-visible { border-color: #F4EFE6 !important; }

/* Ink variant (yellow backgrounds): the fill is ink and the text turns cream. */
.vw-syringe--ink .elementor-button:hover,
.vw-syringe--ink .elementor-button:focus-visible { border-color: var(--vw-ink); }
.vw-syringe--ink .elementor-button::before { background: var(--vw-ink); border-right-color: #3A352E; box-shadow: none; }
.vw-syringe--ink .elementor-button:active::before { background: #000000; }
.vw-syringe--ink .elementor-button::after {
	background:
		repeating-linear-gradient(90deg, rgba(244, 239, 230, .45) 0 1px, transparent 1px 8px) 0 100% / 100% 4px no-repeat,
		repeating-linear-gradient(90deg, rgba(244, 239, 230, .5) 0 1px, transparent 1px 40px) 0 100% / 100% 8px no-repeat;
}

/* ------------------------------------------------------------------
 * Syringe-shaped injection button (hero CTA only). Add
 * "vw-syringe--shape" next to "vw-syringe" to draw the button as a
 * syringe: the button is the barrel, with a dose scale along its top
 * edge; the plunger and finger flange sit behind it, the tip and needle
 * in front. On hover the plunger pushes in while the barrel fills, and a
 * drop forms on the needle.
 *   holder ::before   plunger and flange    (holder = the Button widget,
 *   holder ::after    tip, needle and drop    or the form's submit row)
 *   button ::after    the dose scale, always shown
 * ------------------------------------------------------------------ */
.vw-syringe--shape {
	--syr-c: var(--vw-ink);     /* outline, plunger and needle */
	--syr-mark: var(--vw-ink);  /* dose scale */
	--syr-back: 38px;           /* room for the plunger */
	--syr-front: 44px;          /* room for the tip and needle */
	--syr-push: 12px;           /* plunger travel on hover */
	--syr-inset: 0px;
}
.vw-syringe--shape.vw-syringe--dark { --syr-c: var(--vw-gold); --syr-mark: var(--vw-gold); }
@media (max-width: 767px) {
	.vw-syringe--shape { --syr-back: 26px; --syr-front: 30px; --syr-push: 8px; }
}

.vw-syringe--shape.elementor-widget-button,
.vw-syringe--shape .e-form__buttons {
	position: relative;
	padding-left: calc(var(--syr-inset) + var(--syr-back)) !important;
	padding-right: calc(var(--syr-inset) + var(--syr-front)) !important;
}
.vw-syringe--shape.elementor-widget-button { width: fit-content; max-width: 100%; }
/* The form's submit row keeps Elementor's half column gap on each side. */
.vw-syringe--shape .e-form__buttons { --syr-inset: 7px; }

/* Plunger (thumb press and rod) and the flange at the back of the barrel. */
.vw-syringe--shape.elementor-widget-button::before,
.vw-syringe--shape .e-form__buttons::before {
	content: "";
	position: absolute;
	top: -6px;
	bottom: -6px;
	left: var(--syr-inset);
	width: var(--syr-back);
	background-color: var(--syr-c);
	-webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 38 28' preserveAspectRatio='none'%3E%3Crect width='5' height='28' rx='1.5'/%3E%3Crect x='5' y='12' width='33' height='4'/%3E%3C/svg%3E"), linear-gradient(#000 0 0);
	        mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 38 28' preserveAspectRatio='none'%3E%3Crect width='5' height='28' rx='1.5'/%3E%3Crect x='5' y='12' width='33' height='4'/%3E%3C/svg%3E"), linear-gradient(#000 0 0);
	-webkit-mask-size: 100% 28px, 4px 100%;
	        mask-size: 100% 28px, 4px 100%;
	-webkit-mask-position: 0 50%, 100% 0;
	        mask-position: 0 50%, 100% 0;
	-webkit-mask-repeat: no-repeat;
	        mask-repeat: no-repeat;
	transition: -webkit-mask-position .45s cubic-bezier(.4, 0, .2, 1), mask-position .45s cubic-bezier(.4, 0, .2, 1);
	pointer-events: none;
}

/* Tip and needle in front of the barrel, and the drop that forms on it. */
.vw-syringe--shape.elementor-widget-button::after,
.vw-syringe--shape .e-form__buttons::after {
	content: "";
	position: absolute;
	top: calc(50% - 13px);
	right: var(--syr-inset);
	width: var(--syr-front);
	height: 26px;
	background-color: var(--syr-c);
	-webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 44 26' preserveAspectRatio='none'%3E%3Cpath d='M0 7l7 3v6l-7 3z'/%3E%3Crect x='7' y='9.5' width='6' height='7' rx='1'/%3E%3Cpath d='M13 12h25l5.5 1-5.5 1H13z'/%3E%3C/svg%3E"), url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 6 8'%3E%3Cpath d='M3 0S0 3.6 0 5a3 3 0 0 0 6 0C6 3.6 3 0 3 0z'/%3E%3C/svg%3E");
	        mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 44 26' preserveAspectRatio='none'%3E%3Cpath d='M0 7l7 3v6l-7 3z'/%3E%3Crect x='7' y='9.5' width='6' height='7' rx='1'/%3E%3Cpath d='M13 12h25l5.5 1-5.5 1H13z'/%3E%3C/svg%3E"), url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 6 8'%3E%3Cpath d='M3 0S0 3.6 0 5a3 3 0 0 0 6 0C6 3.6 3 0 3 0z'/%3E%3C/svg%3E");
	-webkit-mask-size: 100% 100%, 0 0;
	        mask-size: 100% 100%, 0 0;
	-webkit-mask-position: 0 0, right 1px top 15px;
	        mask-position: 0 0, right 1px top 15px;
	-webkit-mask-repeat: no-repeat;
	        mask-repeat: no-repeat;
	transition: -webkit-mask-size .15s ease, mask-size .15s ease;
	pointer-events: none;
}

.vw-syringe--shape .elementor-button,
.vw-syringe--shape .elementor-button:hover,
.vw-syringe--shape .elementor-button:focus-visible { border-color: var(--syr-c); }

/* Dose scale along the top edge: a short mark every 8px and a long one every 40px. */
.vw-syringe--shape .elementor-button::after,
.vw-syringe--shape .elementor-button:hover::after,
.vw-syringe--shape .elementor-button:focus-visible::after {
	top: 0;
	bottom: auto;
	left: 18px;
	right: 18px;
	height: 7px;
	background:
		repeating-linear-gradient(90deg, var(--syr-mark) 0 1px, transparent 1px 8px) 0 0 / 100% 4px no-repeat,
		repeating-linear-gradient(90deg, var(--syr-mark) 0 1px, transparent 1px 40px) 0 0 / 100% 7px no-repeat;
	opacity: .45;
	transition: none;
}
.vw-syringe--shape .elementor-button:hover,
.vw-syringe--shape .elementor-button:focus-visible { --syr-mark: var(--vw-ink); }

/* Hover and keyboard focus: the plunger pushes in and a drop forms. */
.vw-syringe--shape.elementor-widget-button:has(.elementor-button:hover, .elementor-button:focus-visible)::before,
.vw-syringe--shape .e-form__buttons:has(.elementor-button:hover, .elementor-button:focus-visible)::before {
	-webkit-mask-position: var(--syr-push) 50%, 100% 0;
	        mask-position: var(--syr-push) 50%, 100% 0;
	transition-duration: .8s;
	transition-timing-function: cubic-bezier(.65, 0, .35, 1);
}
.vw-syringe--shape.elementor-widget-button:has(.elementor-button:hover, .elementor-button:focus-visible)::after,
.vw-syringe--shape .e-form__buttons:has(.elementor-button:hover, .elementor-button:focus-visible)::after {
	-webkit-mask-size: 100% 100%, 6px 8px;
	        mask-size: 100% 100%, 6px 8px;
	transition: -webkit-mask-size .3s cubic-bezier(.3, 1.4, .5, 1) .75s, mask-size .3s cubic-bezier(.3, 1.4, .5, 1) .75s;
}
/* A tap on touch screens pushes the plunger straight away. */
.vw-syringe--shape.elementor-widget-button:has(.elementor-button:active)::before,
.vw-syringe--shape .e-form__buttons:has(.elementor-button:active)::before {
	-webkit-mask-position: var(--syr-push) 50%, 100% 0;
	        mask-position: var(--syr-push) 50%, 100% 0;
	transition-duration: .15s;
}

/* Header phone: a quiet outlined button beside the yellow one, same height and corners. */
.vw-hd-phone .elementor-icon-list-item > a {
	display: inline-flex;
	align-items: center;
	min-height: 43px;
	padding: 0 18px;
	border: 1.5px solid rgba(244, 239, 230, .3);
	border-radius: 4px;
	transition: border-color .25s ease, color .25s ease;
}
.vw-hd-phone .elementor-icon-list-item > a:hover,
.vw-hd-phone .elementor-icon-list-item > a:focus-visible { border-color: var(--vw-gold); }
.vw-hd-phone .elementor-icon-list-item > a:hover .elementor-icon-list-text { color: var(--vw-gold); }
.vw-hd-phone .elementor-icon-list-item > a:focus-visible { outline: 2px solid #F4EFE6; outline-offset: 3px; }
.vw-hd-phone .elementor-icon-list-text { font-weight: 600; font-size: 14px; letter-spacing: .3px; }

/* Round phone button next to a CTA. Its wrapper is flex so no inline gap pushes it off-centre. */
.vw-call .elementor-icon-wrapper { display: flex; line-height: 0; }
.vw-call .elementor-icon { transition: background-color .2s ease, color .2s ease; }
.vw-call .elementor-icon:focus-visible { outline: 2px solid var(--vw-ink); outline-offset: 4px; }
.vw-hero .vw-call .elementor-icon:focus-visible, .vw-map-card .vw-call .elementor-icon:focus-visible { outline-color: #F4EFE6; }
@media (max-width: 767px) {
	.vw-call .elementor-icon { padding: 14px !important; }
}

/* ------------------------------------------------------------------ motion (see vw.js) */

/* Hero copy waits for its entrance animation (max 3s, see vw-assets.php). */
html.vw-js:not(.vw-anim-ready) .vw-hero .vw-split,
html.vw-js:not(.vw-anim-ready) .vw-hero .vw-hero-pre,
html.vw-js:not(.vw-anim-ready) .vw-hero .vw-hero-fade,
html.vw-js:not(.vw-anim-ready) .vw-hero .vw-hero-media,
html.vw-js:not(.vw-anim-ready) .vw-hero .vw-hero-tag,
html.vw-js:not(.vw-anim-ready) .vw-hero .vw-hero-form,
html.vw-js:not(.vw-anim-ready) .vw-hero .vw-clip { opacity: 0; }

/* vw.js moves these elements frame by frame. Elementor gives every container and widget
   a 0.4s transform transition, which made them trail behind each animation and keep
   drifting after it had ended; switch it off for anything the script moves. */
.vw-hero-form,
.vw-hero-pre,
.vw-hero-fade,
.vw-hero-tag,
.vw-fade,
.vw-stagger > .elementor-element,
.vw-float,
.vw-collage > .e-con {
	--e-con-transform-transition-duration: 0s;
	--e-transform-transition-duration: 0s;
}

/* Images that move inside their frame. */
.vw-parallax, .vw-clip { overflow: hidden; border-radius: 6px; }
.vw-parallax img, .vw-clip img { display: block; will-change: transform; }

/* ------------------------------------------------------------------ hero */

/* Keeps a hyphenated phrase on one line. */
.vw-nowrap { white-space: nowrap; }

/* Dark panel with a curved edge into the photo; the form sits over the photo. */
.vw-hero-media { position: relative; overflow: hidden; }
.vw-hero-media img { display: block; border-radius: 0 !important; }
.vw-hero-tag {
	position: absolute !important;
	z-index: 2;
	right: 24px;
	bottom: 24px;
	width: auto !important;
	max-width: calc(100% - 48px);
}
@media (min-width: 1025px) {
	.vw-hero { min-height: calc(100vh - 84px - var(--vw-bar, 0px)); }
	/* The two-line headline (kit "vwhero") scales with the copy column so it never takes a third line. */
	.vw-hero-copy { --e-global-typography-vwhero-font-size: min(2.97vw - 4.5px, .27vw + 31.5px, 40px); }
	.vw-hero-copy {
		position: relative;
		z-index: 2;
		padding-left: max(32px, calc((100% - 1240px) / 2)) !important;
	}
	.vw-hero-copy::after {
		content: "";
		position: absolute;
		top: 0;
		bottom: 0;
		right: -119px;
		width: 120px;
		background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 120 1000' preserveAspectRatio='none'%3E%3Cpath d='M0 0H60C120 180 120 330 70 480C25 620 30 800 95 1000H0Z' fill='%2315130F'/%3E%3C/svg%3E") no-repeat 0 0 / 100% 100%;
		pointer-events: none;
	}
	.vw-hero-media { z-index: 1; }
	/* The photo fills the column without setting its height, so the hero is one screen tall. */
	.vw-hero-media .elementor-widget-image {
		position: absolute !important;
		inset: 0;
		width: 100% !important;
		margin: 0 !important;
	}
	.vw-hero-media .elementor-widget-image > .elementor-widget-container { height: 100%; }
	.vw-hero-media .elementor-widget-image img { width: 100% !important; height: 100% !important; }
	.vw-hero-form {
		position: absolute !important;
		z-index: 3;
		top: 0;
		bottom: 0;
		left: 120px;
		right: 0;
		margin: auto !important;
		height: fit-content;
		width: min(480px, calc(100% - 200px)) !important;
	}
	/* Short laptop screens: trim the panel padding so the longer headline still fits one screen. */
	@media (max-height: 780px) {
		.vw-hero-copy { padding-top: 40px !important; padding-bottom: 48px !important; }
	}
	/* Without the scroll script (editor, reduced motion) the photo simply stays blurred behind the form. */
	html:not(.vw-js) .vw-hero-media .elementor-widget-image img { filter: blur(10px) brightness(.78); transform: scale(1.06); }
}
@media (max-width: 1024px) {
	.vw-hero-tag { display: none !important; }
	.vw-hero-form { position: relative; z-index: 2; width: auto !important; margin: -96px 20px 0 !important; }
}
@media (min-width: 768px) and (max-width: 1024px) {
	.vw-hero-form { margin: -120px 28px 0 !important; }
}

/* ------------------------------------------------------------------ treatments: widening photo panels */

.vw-panel { overflow: hidden; }
@media (min-width: 1025px) {
	.vw-panels > .vw-panel {
		flex: 1 1 0 !important;
		min-width: 0;
		cursor: pointer;
		transition: flex-grow .75s cubic-bezier(.65, 0, .35, 1);
	}
	.vw-panels.is-live > .vw-panel.is-open,
	.vw-panels:not(.is-live) > .vw-panel:first-child { flex-grow: 2.6 !important; cursor: default; }
	.vw-panel .vw-panel-body {
		max-height: 0;
		opacity: 0;
		overflow: hidden;
		transition: opacity .3s ease, max-height .5s ease;
	}
	.vw-panels.is-live > .vw-panel.is-open .vw-panel-body,
	.vw-panels:not(.is-live) > .vw-panel:first-child .vw-panel-body {
		max-height: 320px;
		opacity: 1;
		transition: opacity .5s ease .35s, max-height .7s ease .15s;
	}
}

/* ------------------------------------------------------------------ how it works: full-width triptych */

.vw-tri-img img { display: block; }
.vw-tri-img, .vw-tri-img img { border-radius: 0 !important; }
.vw-tri-text { flex: 1 1 auto; }
@media (min-width: 1025px) {
	.vw-tri > .vw-tri-col { flex: 1 1 0 !important; min-width: 0; }
}

/* ------------------------------------------------------------------ Meet Corina: overlapping photos */

.vw-duo { position: relative; }
.vw-inset {
	position: absolute !important;
	z-index: 2;
	right: -56px;
	bottom: -64px;
	width: 44% !important;
	border: 8px solid #FFFFFF;
	border-radius: 8px;
	overflow: hidden;
}
.vw-inset img { display: block; border-radius: 0 !important; }
@media (max-width: 1024px) {
	.vw-duo { margin-bottom: 48px; }
	.vw-inset { right: 16px; bottom: -44px; width: 42% !important; }
}

/* ------------------------------------------------------------------ clinic: drifting photo collage */

.vw-collage .elementor-widget-image img { display: block; }
@media (min-width: 1025px) {
	.vw-collage > .e-con { flex: 1 1 0 !important; min-width: 0; }
}
@media (max-width: 1024px) {
	.vw-collage > .e-con { flex-direction: row !important; }
	.vw-collage > .e-con > .elementor-widget-image { flex: 1 1 0 !important; min-width: 0; }
}

/* ------------------------------------------------------------------ financing: plain answers table */

@media (min-width: 768px) {
	.vw-spec-value { text-align: right; }
}

/* ------------------------------------------------------------------ contact: map with a floating card */

.vw-map-full iframe { display: block; }
@media (min-width: 1025px) {
	.vw-mapsec { position: relative; }
	.vw-map-card {
		position: absolute !important;
		z-index: 2;
		top: 0;
		bottom: 0;
		margin: auto 0 !important;
		height: fit-content;
		right: max(32px, calc((100% - 1240px) / 2));
		width: 440px !important;
	}
}

/* ------------------------------------------------------------------ about */

/* Hero: paper above, white below, so the team photo sits across both bands. */
.vw-ab-hero {
	min-height: 0 !important;
	background: linear-gradient(var(--vw-paper) 0 calc(100% - 220px), #FFFFFF calc(100% - 220px)) !important;
}
@media (max-width: 767px) {
	.vw-ab-hero { background: linear-gradient(var(--vw-paper) 0 calc(100% - 120px), #FFFFFF calc(100% - 120px)) !important; }
}

/* Story: a line runs down the left of the beats and fills (--tl, set by vw.js) as they
   scroll past; each beat's dot turns solid once reached. Without the script it is full. */
.vw-tl {
	--tl: 1;
	--tl-pad: 48px;
	padding-left: var(--tl-pad) !important;
	background:
		linear-gradient(var(--vw-ink), var(--vw-ink)) 7px 18px / 2px calc((100% - 18px) * var(--tl)) no-repeat,
		linear-gradient(var(--vw-line), var(--vw-line)) 7px 18px / 2px calc(100% - 18px) no-repeat;
}
.vw-tl-title .elementor-heading-title { position: relative; }
.vw-tl-title .elementor-heading-title::before {
	content: "";
	position: absolute;
	left: calc(-1 * var(--tl-pad));
	top: calc(.6em - 8px);
	width: 16px;
	height: 16px;
	box-sizing: border-box;
	border: 2px solid var(--vw-ink);
	border-radius: 50%;
	background: var(--vw-ink);
	transition: background-color .35s ease, border-color .35s ease;
}
.vw-motion .vw-tl-beat:not(.is-on) .vw-tl-title .elementor-heading-title::before {
	background: #FFFFFF;
	border-color: var(--vw-line);
}
@media (max-width: 767px) {
	.vw-tl { --tl-pad: 36px; }
}

/* Meet Corina: copy on ink beside a photo that runs to the edge of the screen. */
.vw-bleed-media .vw-clip,
.vw-bleed-media img { border-radius: 0 !important; }
@media (min-width: 1025px) {
	.vw-bleed-copy { padding-left: max(32px, calc((100% - 1240px) / 2)) !important; }
	.vw-bleed-media { position: relative; min-height: 680px; }
	.vw-bleed-media > .elementor-widget-image {
		position: absolute !important;
		inset: 0;
		width: 100% !important;
		margin: 0 !important;
	}
	.vw-bleed-media > .elementor-widget-image img { width: 100% !important; height: 100% !important; }
}

/* Approach: the item in focus (under the pointer, or mid-screen) shows its photo. Desktop only. */
.vw-pillar-media img { display: block; }
@media (min-width: 1025px) {
	.vw-pillar-media { position: relative; min-height: 560px; }
	.vw-pillar-media > .elementor-widget-image {
		position: absolute !important;
		inset: 0;
		width: 100% !important;
		margin: 0 !important;
		opacity: 0;
		transform: scale(1.05);
		transition: opacity .7s ease, transform 1.4s cubic-bezier(.2, .7, .2, 1);
	}
	.vw-pillar-media > .elementor-widget-image img { width: 100% !important; height: 100% !important; }
	.vw-pillars:not(.is-live) .vw-pillar-media > .elementor-widget-image:first-child,
	.vw-pillar-media > .elementor-widget-image.is-active { opacity: 1; transform: none; }
	.vw-pillars.is-live .vw-pillar { opacity: .4; transition: opacity .45s ease; }
	.vw-pillars.is-live .vw-pillar.is-active { opacity: 1; }
}
@media (max-width: 1024px) {
	.vw-pillar-media { display: none !important; }
}

/* ------------------------------------------------------------------ editor and reduced motion */

/* Elementor editor: open every treatment panel so all text can be edited. */
.elementor-editor-active .vw-panel .vw-panel-body { max-height: none !important; opacity: 1 !important; }

@media (prefers-reduced-motion: reduce) {
	html { scroll-behavior: auto; }
	.elementor-location-header,
	.vw-syringe .elementor-button,
	.vw-syringe .elementor-button::before,
	.vw-syringe .elementor-button::after,
	.vw-syringe--shape.elementor-widget-button::before,
	.vw-syringe--shape.elementor-widget-button::after,
	.vw-syringe--shape .e-form__buttons::before,
	.vw-syringe--shape .e-form__buttons::after,
	.vw-panels > .vw-panel,
	.vw-panel .vw-panel-body { transition: none !important; }
}

/* ------------------------------------------------------------------ layout helpers */

/* Even line lengths on headings, so no single word hangs on its own line. */
.elementor-heading-title { text-wrap: balance; }

/* Phone numbers never break across lines. */
a[href^="tel:"] { white-space: nowrap; }

/* Header phone link: no underline until hover. */
.vw-header .vw-links a { text-decoration: none; }
.vw-header .vw-links a:hover { color: var(--vw-gold); }

/* Text widgets: no trailing gap after the last paragraph, and no single word left alone on the last line. */
.elementor-widget-text-editor p:last-child { margin-bottom: 0; }
.elementor-widget-text-editor p { text-wrap: pretty; }
.vw-details p { margin-bottom: 18px; }
.vw-details strong { display: inline-block; margin-bottom: 2px; font-weight: 600; color: var(--vw-gold); }

/* Plain text links inside copy. */
.vw-links a { color: inherit; text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: 3px; }
.vw-links a:hover { text-decoration-thickness: 2px; }
.vw-links.vw-on-dark a:hover { color: var(--vw-gold); }

/* Hero form: a little more air between rows of fields. */
.vw-form .elementor-field-group { margin-bottom: 14px; }
.vw-form .elementor-field-type-submit { margin-top: 6px; margin-bottom: 0; }
.vw-form .elementor-field-textual:focus { border-color: var(--vw-ink) !important; box-shadow: none; }

/* Styled dropdown (vw.js selects()): the native select is kept, visually hidden. */
.vw-select-src {
	position: absolute !important;
	width: 1px !important;
	height: 1px !important;
	overflow: hidden;
	clip-path: inset(50%);
	white-space: nowrap;
}
.vw-select { position: relative; width: 100%; }
.vw-select-btn {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 12px;
	width: 100%;
	min-height: 48px;
	padding: 0 16px;
	border: 1px solid var(--vw-line);
	border-radius: 4px;
	background: #FFFFFF;
	color: var(--vw-ink);
	font: 400 17px/1.3 "Supreme", sans-serif;
	text-align: left;
	cursor: pointer;
	transition: border-color .2s ease;
}
/* Hello Elementor paints focused/hovered buttons pink (#c36); keep the field white in every state. */
.vw-select-btn:hover,
.vw-select-btn:focus,
.vw-select-btn:active,
.vw-select.is-open .vw-select-btn { border-color: var(--vw-ink); background: #FFFFFF; color: var(--vw-ink); }
.vw-select-btn:focus-visible { outline: 2px solid var(--vw-ink); outline-offset: 2px; }
.vw-select-value.is-placeholder { color: #8A8378; }
.vw-select-chev { flex: none; width: 12px; height: 12px; transition: transform .25s ease; }
.vw-select.is-open .vw-select-chev { transform: rotate(180deg); }
.vw-select-list {
	position: absolute;
	z-index: 30;
	left: 0;
	right: 0;
	top: calc(100% + 6px);
	max-height: 280px;
	margin: 0;
	padding: 6px;
	list-style: none;
	overflow: auto;
	background: #FFFFFF;
	border: 1px solid var(--vw-line);
	border-radius: 6px;
	box-shadow: 0 14px 30px -14px rgba(21, 19, 15, .28);
	opacity: 0;
	visibility: hidden;
	transform: translateY(-4px);
	transition: opacity .18s ease, transform .18s ease, visibility 0s linear .18s;
}
.vw-select.is-up .vw-select-list { top: auto; bottom: calc(100% + 6px); transform: translateY(4px); }
.vw-select.is-open .vw-select-list {
	opacity: 1;
	visibility: visible;
	transform: none;
	transition: opacity .18s ease, transform .18s ease;
}
.vw-select-list:focus { outline: none; }
.vw-select-list li {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 12px;
	padding: 11px 12px;
	border-radius: 4px;
	color: var(--vw-ink);
	font: 400 16px/1.3 "Supreme", sans-serif;
	cursor: pointer;
}
.vw-select-list li.is-active { background: var(--vw-paper); }
.vw-select-list li[aria-selected="true"] { font-weight: 600; }
.vw-select-list li[aria-selected="true"]::after {
	content: "";
	flex: none;
	width: 14px;
	height: 10px;
	background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 14 10'%3E%3Cpath d='M1 5l4 4 8-8' fill='none' stroke='%2315130F' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") no-repeat center / contain;
}
@media (max-width: 767px) {
	.vw-select-btn { font-size: 16px; }
}
@media (prefers-reduced-motion: reduce) {
	.vw-select-list, .vw-select-chev { transition: none !important; }
}

/* FAQ: full-width questions in large type, quiet dividers. */
.vw-faq .elementor-toggle-item { border-bottom: 1px solid var(--vw-line); }
.vw-faq .elementor-toggle-item:first-child { border-top: 1px solid var(--vw-line); }
.vw-faq .elementor-toggle .elementor-tab-title { border: 0; padding: 28px 0; }
.vw-faq .elementor-toggle .elementor-tab-content { border: 0; padding: 0 0 30px; max-width: 760px; }
.vw-faq .elementor-toggle-icon svg { width: 15px; height: 15px; }