.elementor-12016 .elementor-element.elementor-element-4a3c1ef{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--padding-top:100px;--padding-bottom:120px;--padding-left:0px;--padding-right:0px;}@media(max-width:767px){.elementor-12016 .elementor-element.elementor-element-4a3c1ef{--padding-top:100px;--padding-bottom:100px;--padding-left:10px;--padding-right:10px;}}/* Start custom CSS for text-editor, class: .elementor-element-2212f9b *//* =========================================================
   CONSULTATION FUNNEL – GRAVITY FORMS
   Form ID: 15
   ========================================================= */

#gform_wrapper_15 {
	--funnel-text: #17202a;
	--funnel-muted: #667085;
	--funnel-border: #d9dee7;
	--funnel-border-hover: #8e9bad;
	--funnel-selected: #17202a;
	--funnel-selected-text: #ffffff;
	--funnel-background: #ffffff;
	--funnel-soft-background: #f7f8fa;
	--funnel-radius: 14px;
	--funnel-transition: 180ms ease;

	width: 100%;
	max-width: 820px;
	margin: 0 auto;
	font-family: inherit;
	color: var(--funnel-text);
}

/* Prevent the form from jumping between differently sized pages */
#gform_wrapper_15 .gform-body,
#gform_wrapper_15 .gform_body {
	min-height: 460px;
}

/* One centered question per page */
#gform_wrapper_15 .gform_page {
	width: 100%;
	animation: funnelFadeIn 260ms ease;
}

@keyframes funnelFadeIn {
	from {
		opacity: 0;
		transform: translateY(8px);
	}

	to {
		opacity: 1;
		transform: translateY(0);
	}
}

/* Question headings */
#gform_wrapper_15 .gfield_label {
	display: block;
	max-width: 760px;
	margin: 0 auto 14px;
	font-size: clamp(28px, 4vw, 46px);
	font-weight: 600;
	line-height: 1.12;
	letter-spacing: -0.025em;
	text-align: center;
	color: var(--funnel-text);
}

/* Descriptions and instructions */
#gform_wrapper_15 .gfield_description,
#gform_wrapper_15 .gfield_description_above,
#gform_wrapper_15 .gfield_description_below {
	max-width: 620px;
	margin: 0 auto 28px;
	font-size: 16px;
	line-height: 1.6;
	text-align: center;
	color: var(--funnel-muted);
}

/* Remove excessive default field spacing */
#gform_wrapper_15 .gform_fields {
	row-gap: 24px;
}

#gform_wrapper_15 .gfield {
	margin: 0;
}

/* =========================================================
   CARD-STYLE CHECKBOXES AND RADIO BUTTONS
   ========================================================= */

#gform_wrapper_15 .cta-card-options .gfield_checkbox,
#gform_wrapper_15 .cta-card-options .gfield_radio {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 12px;
	max-width: 760px;
	margin: 0 auto;
}

/* Older Gravity Forms markup fallback */
#gform_wrapper_15 .cta-card-options .gfield_checkbox > li,
#gform_wrapper_15 .cta-card-options .gfield_radio > li,
#gform_wrapper_15 .cta-card-options .gchoice {
	position: relative;
	margin: 0;
	padding: 0;
	list-style: none;
}

/* Visually hide native checkbox and radio controls */
#gform_wrapper_15 .cta-card-options input[type="checkbox"],
#gform_wrapper_15 .cta-card-options input[type="radio"] {
	position: absolute;
	width: 1px;
	height: 1px;
	opacity: 0;
	pointer-events: none;
}

/* Turn each choice label into a card */
#gform_wrapper_15 .cta-card-options input + label,
#gform_wrapper_15 .cta-card-options .gchoice label {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 100%;
	min-height: 64px;
	margin: 0;
	padding: 15px 18px;
	border: 1px solid var(--funnel-border);
	border-radius: var(--funnel-radius);
	background: var(--funnel-background);
	color: var(--funnel-text);
	font-size: 16px;
	font-weight: 500;
	line-height: 1.3;
	text-align: center;
	cursor: pointer;
	transition:
		border-color var(--funnel-transition),
		background-color var(--funnel-transition),
		color var(--funnel-transition),
		transform var(--funnel-transition),
		box-shadow var(--funnel-transition);
}

#gform_wrapper_15 .cta-card-options input + label:hover {
	border-color: var(--funnel-border-hover);
	transform: translateY(-1px);
	box-shadow: 0 7px 22px rgba(16, 24, 40, 0.08);
}

/* Keyboard focus */
#gform_wrapper_15 .cta-card-options input:focus-visible + label {
	outline: 3px solid rgba(23, 32, 42, 0.18);
	outline-offset: 3px;
}

/* Selected card */
#gform_wrapper_15 .cta-card-options input:checked + label {
	border-color: var(--funnel-selected);
	background: var(--funnel-selected);
	color: var(--funnel-selected-text);
	box-shadow: 0 8px 24px rgba(16, 24, 40, 0.14);
}

/* =========================================================
   TEXT, EMAIL, PHONE AND TEXTAREA FIELDS
   ========================================================= */

#gform_wrapper_15 input[type="text"],
#gform_wrapper_15 input[type="email"],
#gform_wrapper_15 input[type="tel"],
#gform_wrapper_15 input[type="number"],
#gform_wrapper_15 textarea {
	width: 100%;
	border: 1px solid var(--funnel-border);
	border-radius: 12px;
	background: #ffffff;
	color: var(--funnel-text);
	font-family: inherit;
	font-size: 17px;
	box-shadow: none;
	transition:
		border-color var(--funnel-transition),
		box-shadow var(--funnel-transition);
}

#gform_wrapper_15 input[type="text"],
#gform_wrapper_15 input[type="email"],
#gform_wrapper_15 input[type="tel"],
#gform_wrapper_15 input[type="number"] {
	min-height: 58px;
	padding: 13px 16px;
}

#gform_wrapper_15 textarea {
	min-height: 180px;
	padding: 16px 18px;
	resize: vertical;
}

#gform_wrapper_15 input:focus,
#gform_wrapper_15 textarea:focus {
	outline: none;
	border-color: var(--funnel-text);
	box-shadow: 0 0 0 4px rgba(23, 32, 42, 0.08);
}

/* Make the outcome question feel prominent */
#gform_wrapper_15 .cta-outcome-field {
	max-width: 700px;
	margin: 0 auto;
}

/* =========================================================
   PROGRESS BAR
   ========================================================= */

#gform_wrapper_15 .gf_progressbar_wrapper,
#gform_wrapper_15 .gf_progressbar {
	max-width: 760px;
	margin-left: auto;
	margin-right: auto;
}

#gform_wrapper_15 .gf_progressbar_wrapper {
	margin-bottom: 48px;
}

/* Hide Step X of X text */
#gform_wrapper_15 .gf_progressbar_title {
	position: absolute;
	width: 1px;
	height: 1px;
	overflow: hidden;
	clip: rect(0, 0, 0, 0);
	white-space: nowrap;
}

/* Progress track */
#gform_wrapper_15 .gf_progressbar {
	height: 5px;
	border: 0;
	border-radius: 100px;
	background: #e8ebef;
	box-shadow: none;
	overflow: hidden;
}

/* Filled progress */
#gform_wrapper_15 .gf_progressbar_percentage {
	height: 100%;
	border-radius: 100px;
	background: var(--funnel-text);
}

#gform_wrapper_15 .gf_progressbar_percentage span {
	display: none;
}

/* =========================================================
   PAGE NAVIGATION
   ========================================================= */

#gform_wrapper_15 .gform_page_footer,
#gform_wrapper_15 .gform_footer {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 12px;
	max-width: 760px;
	margin: 34px auto 0;
	padding: 0;
	border: 0;
}

/* Next and submit buttons */
#gform_wrapper_15 .gform_next_button,
#gform_wrapper_15 .gform_button,
#gform_wrapper_15 input[type="submit"] {
	min-width: 180px;
	min-height: 54px;
	margin: 0;
	padding: 13px 28px;
	border: 1px solid var(--funnel-text);
	border-radius: 100px;
	background: var(--funnel-text);
	color: #ffffff;
	font-family: inherit;
	font-size: 16px;
	font-weight: 600;
	line-height: 1;
	cursor: pointer;
	transition:
		transform var(--funnel-transition),
		opacity var(--funnel-transition),
		box-shadow var(--funnel-transition);
}

#gform_wrapper_15 .gform_next_button:hover,
#gform_wrapper_15 .gform_button:hover,
#gform_wrapper_15 input[type="submit"]:hover {
	transform: translateY(-1px);
	box-shadow: 0 8px 24px rgba(16, 24, 40, 0.16);
}

/* Previous button */
#gform_wrapper_15 .gform_previous_button {
	min-height: 50px;
	margin: 0;
	padding: 12px 20px;
	border: 0;
	background: transparent;
	color: var(--funnel-muted);
	font-family: inherit;
	font-size: 15px;
	font-weight: 500;
	text-decoration: underline;
	text-underline-offset: 4px;
	cursor: pointer;
}

#gform_wrapper_15 .gform_previous_button:hover {
	color: var(--funnel-text);
}

/* Loading spinner */
#gform_wrapper_15 .gform_ajax_spinner {
	position: absolute;
}

/* =========================================================
   VALIDATION
   ========================================================= */

#gform_wrapper_15 .gform_validation_errors {
	max-width: 760px;
	margin: 0 auto 28px;
	padding: 14px 18px;
	border: 1px solid #d92d20;
	border-radius: 10px;
	background: #fff6f5;
	box-shadow: none;
}

#gform_wrapper_15 .gfield_error {
	border: 0;
	background: transparent;
}

#gform_wrapper_15 .validation_message {
	margin-top: 8px;
	color: #b42318;
	font-size: 14px;
	text-align: left;
}

/* =========================================================
   MOBILE
   ========================================================= */

@media (max-width: 767px) {
	#gform_wrapper_15 {
		padding-left: 4px;
		padding-right: 4px;
	}

	#gform_wrapper_15 .gform-body,
	#gform_wrapper_15 .gform_body {
		min-height: 0;
	}

	#gform_wrapper_15 .gfield_label {
		font-size: clamp(27px, 9vw, 36px);
	}

	#gform_wrapper_15 .cta-card-options .gfield_checkbox,
	#gform_wrapper_15 .cta-card-options .gfield_radio {
		grid-template-columns: 1fr;
		gap: 10px;
	}

	#gform_wrapper_15 .cta-card-options input + label,
	#gform_wrapper_15 .cta-card-options .gchoice label {
		min-height: 58px;
		padding: 14px 16px;
	}

	#gform_wrapper_15 .gf_progressbar_wrapper {
		margin-bottom: 34px;
	}

	#gform_wrapper_15 .gform_page_footer,
	#gform_wrapper_15 .gform_footer {
		flex-wrap: wrap;
		margin-top: 28px;
	}

	#gform_wrapper_15 .gform_next_button,
	#gform_wrapper_15 .gform_button,
	#gform_wrapper_15 input[type="submit"] {
		width: 100%;
	}

	#gform_wrapper_15 .gform_previous_button {
		order: 2;
		width: 100%;
	}
}



/* =========================================================
   VITALITY HEALTH FUNNEL — DESIGN UPDATES
   Gravity Form ID: 15
   Add after the existing form CSS
   ========================================================= */

#gform_wrapper_15 {
	--funnel-blue: #0054A4;
	--funnel-orange: #F89828;
	--funnel-orange-hover: #e98617;
}

/* =========================================================
   PROGRESS BAR
   ========================================================= */

/* Blue completed portion of progress bar */
#gform_wrapper_15 .gf_progressbar_percentage {
	background: #0054A4;
}

/* Keep the uncompleted track neutral */
#gform_wrapper_15 .gf_progressbar {
	background: #e8ebef;
}

/* =========================================================
   SECTION TITLES AND DESCRIPTIONS
   ========================================================= */

/*
 * Section title size is intentionally not changed.
 * It will continue using its current styling.
 */

#gform_wrapper_15 .gsection_description {
	font-size: 20px;
	line-height: 1.55;
}

/* Newer Gravity Forms markup fallback */
#gform_wrapper_15 .gsection_description p {
	font-size: inherit;
	line-height: inherit;
}

/* =========================================================
   QUESTION FIELD LABELS
   ========================================================= */

/* Reduce question size without changing section titles */
#gform_wrapper_15 .gfield_label {
	font-size: clamp(21px, 2.5vw, 30px);
	line-height: 1.25;
	letter-spacing: -0.015em;
}

/* =========================================================
   CHECKBOX AND RADIO OPTION CARDS
   ========================================================= */

/* Orange outline on unselected options */
#gform_wrapper_15 .cta-card-options input + label,
#gform_wrapper_15 .cta-card-options .gchoice label {
	border-color: #F89828;
}

/* Orange hover state */
#gform_wrapper_15 .cta-card-options input + label:hover,
#gform_wrapper_15 .cta-card-options .gchoice label:hover {
	border-color: #F89828;
	background: rgba(248, 152, 40, 0.08);
	box-shadow: 0 7px 22px rgba(248, 152, 40, 0.16);
}

/* Orange selected state */
#gform_wrapper_15 .cta-card-options input:checked + label {
	border-color: #F89828;
	background: #F89828;
	color: #ffffff;
	box-shadow: 0 8px 24px rgba(248, 152, 40, 0.28);
}

/* Orange keyboard-focus outline */
#gform_wrapper_15 .cta-card-options input:focus-visible + label {
	outline: 3px solid rgba(248, 152, 40, 0.28);
	outline-offset: 3px;
}

/* =========================================================
   NEXT AND SUBMIT BUTTONS
   ========================================================= */

#gform_wrapper_15 .gform_next_button,
#gform_wrapper_15 .gform_button,
#gform_wrapper_15 input[type="submit"] {
	border-color: #F89828;
	background: #F89828;
	color: #ffffff;
}

/* Hover and focus state */
#gform_wrapper_15 .gform_next_button:hover,
#gform_wrapper_15 .gform_next_button:focus,
#gform_wrapper_15 .gform_button:hover,
#gform_wrapper_15 .gform_button:focus,
#gform_wrapper_15 input[type="submit"]:hover,
#gform_wrapper_15 input[type="submit"]:focus {
	border-color: #e98617;
	background: #e98617;
	color: #ffffff;
	box-shadow: 0 8px 24px rgba(248, 152, 40, 0.28);
}

/* =========================================================
   MOBILE TYPOGRAPHY
   ========================================================= */

@media (max-width: 767px) {
	#gform_wrapper_15 .gsection_description {
		font-size: 18px;
	}

	#gform_wrapper_15 .gfield_label {
		font-size: clamp(20px, 6.5vw, 26px);
		line-height: 1.3;
	}
}

/* =========================================================
   SHOW PROGRESS TEXT + PERCENTAGE
   Gravity Form ID: 15
   ========================================================= */

/* Show "Step 1 of 6" above the progress bar */
#gform_wrapper_15 .gf_progressbar_title {
	position: static;
	width: auto;
	height: auto;
	margin: 0 0 10px;
	overflow: visible;
	clip: auto;
	white-space: normal;

	color: #0054A4;
	font-size: 15px;
	font-weight: 700;
	line-height: 1.3;
	text-align: center;
}

/* Make the progress bar tall enough for percentage text */
#gform_wrapper_15 .gf_progressbar {
	position: relative;
	height: 26px;
	border-radius: 100px;
	background: #e8ebef;
	overflow: hidden;
}

/* Blue completed section */
#gform_wrapper_15 .gf_progressbar_percentage {
	display: flex;
	align-items: center;
	justify-content: flex-end;
	height: 100%;
	min-width: 48px;
	padding: 0 9px;
	border-radius: 100px;
	background: #0054A4;
	box-sizing: border-box;
	transition: width 300ms ease;
}

/* Show percentage inside the blue portion */
#gform_wrapper_15 .gf_progressbar_percentage span {
	display: block;
	color: #ffffff;
	font-size: 13px;
	font-weight: 700;
	line-height: 1;
	white-space: nowrap;
}

/* Progress bar spacing */
#gform_wrapper_15 .gf_progressbar_wrapper {
	margin-bottom: 42px;
}

/* Mobile adjustment */
@media (max-width: 767px) {
	#gform_wrapper_15 .gf_progressbar_title {
		font-size: 14px;
		margin-bottom: 8px;
	}

	#gform_wrapper_15 .gf_progressbar {
		height: 24px;
	}

	#gform_wrapper_15 .gf_progressbar_percentage span {
		font-size: 12px;
	}
}

/* =========================================================
   STACK OPTIONS WHEN THE FIELD HAS AN ODD NUMBER OF CHOICES
   Gravity Form ID: 15
   ========================================================= */

/*
 * Fields with an odd number of choices become one column.
 * Fields with an even number remain in the existing two-column layout.
 */
#gform_wrapper_15 .cta-card-options .gfield_checkbox:has(.gchoice:last-child:nth-child(odd)),
#gform_wrapper_15 .cta-card-options .gfield_radio:has(.gchoice:last-child:nth-child(odd)) {
	grid-template-columns: 1fr;
	max-width: 560px;
}

/* Ensure every option fills the stacked column */
#gform_wrapper_15
.cta-card-options
.gfield_checkbox:has(.gchoice:last-child:nth-child(odd))
.gchoice,
#gform_wrapper_15
.cta-card-options
.gfield_radio:has(.gchoice:last-child:nth-child(odd))
.gchoice {
	grid-column: auto;
	width: 100%;
	justify-self: stretch;
}

/* Remove the previous centered-last-option behavior */
#gform_wrapper_15
.cta-card-options
.gfield_checkbox
.gchoice:last-child:nth-child(odd),
#gform_wrapper_15
.cta-card-options
.gfield_radio
.gchoice:last-child:nth-child(odd) {
	grid-column: auto;
	width: 100%;
	justify-self: stretch;
}

/* =========================================================
   STEP 6 CONTACT FIELD ALIGNMENT
   Gravity Form ID: 15
   ========================================================= */

/* Left-align the Name, Email and Phone field labels */
#gform_wrapper_15 input[type="text"],
#gform_wrapper_15 input[type="email"],
#gform_wrapper_15 input[type="tel"] {
	text-align: left;
}

/* Left-align labels for standard contact fields */
#gform_wrapper_15 .gfield--type-name .gfield_label,
#gform_wrapper_15 .gfield--type-email .gfield_label,
#gform_wrapper_15 .gfield--type-phone .gfield_label {
	max-width: none;
	margin-left: 0;
	margin-right: 0;
	text-align: left;
}

/* Fallback for installations without the newer field-type classes */
#gform_wrapper_15 .gfield_contains_required:has(input[type="text"]) > .gfield_label,
#gform_wrapper_15 .gfield_contains_required:has(input[type="email"]) > .gfield_label,
#gform_wrapper_15 .gfield_contains_required:has(input[type="tel"]) > .gfield_label {
	max-width: none;
	margin-left: 0;
	margin-right: 0;
	text-align: left;
}

/* Left-align Name sub-labels such as First and Last */
#gform_wrapper_15 .ginput_complex label,
#gform_wrapper_15 .ginput_complex legend,
#gform_wrapper_15 .ginput_container_phone label {
	text-align: left;
}

/* =========================================================
   INTERNATIONAL PHONE FIELD
   Match country .elementor-12016 .elementor-element.elementor-element-2212f9b height to phone input
   ========================================================= */

/* Keep the country .elementor-12016 .elementor-element.elementor-element-2212f9b and phone input aligned */
#gform_wrapper_15 .ginput_container_phone,
#gform_wrapper_15 .iti {
	width: 100%;
}

/* Match the international phone .elementor-12016 .elementor-element.elementor-element-2212f9b height */
#gform_wrapper_15 .iti__selected-country,
#gform_wrapper_15 .iti__selected-flag,
#gform_wrapper_15 .iti__flag-container {
	height: 58px;
	min-height: 58px;
	box-sizing: border-box;
}

/* Style the visible country dropdown area */
#gform_wrapper_15 .iti__selected-country,
#gform_wrapper_15 .iti__selected-flag {
	display: flex;
	align-items: center;
	padding-top: 0;
	padding-bottom: 0;
	border-radius: 12px 0 0 12px;
}

/* Ensure the phone input uses the same height */
#gform_wrapper_15 .iti input[type="tel"],
#gform_wrapper_15 input[type="tel"] {
	height: 58px;
	min-height: 58px;
	box-sizing: border-box;
}

/* Gravity Forms international phone field layout fallback */
#gform_wrapper_15 .ginput_container_phone .gfield_phone_country,
#gform_wrapper_15 .ginput_container_phone select {
	height: 58px;
	min-height: 58px;
	box-sizing: border-box;
}

/* Align country and phone sub-labels */
#gform_wrapper_15 .ginput_container_phone .gfield_label,
#gform_wrapper_15 .ginput_container_phone label {
	text-align: left;
}

/* Mobile keeps the same alignment */
@media (max-width: 767px) {
	#gform_wrapper_15 .gfield--type-name .gfield_label,
	#gform_wrapper_15 .gfield--type-email .gfield_label,
	#gform_wrapper_15 .gfield--type-phone .gfield_label {
		text-align: left;
	}

	#gform_wrapper_15 .iti__selected-country,
	#gform_wrapper_15 .iti__selected-flag,
	#gform_wrapper_15 .iti__flag-container,
	#gform_wrapper_15 .iti input[type="tel"],
	#gform_wrapper_15 input[type="tel"],
	#gform_wrapper_15 .ginput_container_phone select {
		height: 58px;
		min-height: 58px;
	}
}
/* =========================================================
   MOBILE OPTION CARD CENTERING
   Gravity Form ID: 15
   ========================================================= */

@media (max-width: 767px) {

	/* Make every choice occupy the full available width */
	#gform_wrapper_15 .cta-card-options .gchoice,
	#gform_wrapper_15 .cta-card-options .gfield_checkbox > li,
	#gform_wrapper_15 .cta-card-options .gfield_radio > li {
		display: flex;
		width: 100%;
		max-width: 100%;
		margin-left: 0;
		margin-right: 0;
		padding-left: 0;
		padding-right: 0;
		box-sizing: border-box;
	}

	/* Force option labels to fill and center inside each card */
	#gform_wrapper_15 .cta-card-options .gchoice label,
	#gform_wrapper_15 .cta-card-options input + label {
		display: flex;
		align-items: center;
		justify-content: center;

		width: 100% !important;
		max-width: none !important;
		min-width: 0;

		margin-left: 0 !important;
		margin-right: 0 !important;
		padding: 14px 18px;

		text-align: center !important;
		text-indent: 0;
		box-sizing: border-box;
	}

	/* Ensure the option grids themselves are centered */
	#gform_wrapper_15 .cta-card-options .gfield_checkbox,
	#gform_wrapper_15 .cta-card-options .gfield_radio {
		width: 100%;
		max-width: 100%;
		margin-left: auto;
		margin-right: auto;
		padding-left: 0;
		padding-right: 0;
		grid-template-columns: minmax(0, 1fr);
		box-sizing: border-box;
	}

	/* Prevent Samsung Internet from adding label offsets */
	#gform_wrapper_15 .cta-card-options input[type="checkbox"],
	#gform_wrapper_15 .cta-card-options input[type="radio"] {
		margin: 0;
	}

	/* Keep long option text centered on multiple lines */
	#gform_wrapper_15 .cta-card-options label {
		white-space: normal;
		word-break: normal;
		overflow-wrap: break-word;
	}
}
/* =========================================================
   FORCE SELECTED CARD COLOR ON MOBILE
   Gravity Form ID: 15
   ========================================================= */

#gform_wrapper_15 .cta-card-options input[type="radio"]:checked + label,
#gform_wrapper_15 .cta-card-options input[type="checkbox"]:checked + label,
#gform_wrapper_15 .cta-card-options .gchoice input:checked + label {
	background: #F89828 !important;
	border-color: #F89828 !important;
	color: #ffffff !important;
	box-shadow: 0 8px 24px rgba(248,152,40,.28) !important;
}

/* Prevent the active state from overriding the selected state */
#gform_wrapper_15 .cta-card-options label:active {
	background: #F89828;
	border-color: #F89828;
	color: #ffffff;
}

/* Samsung Internet / Chrome Android fix */
@media (hover: none) {

	#gform_wrapper_15 .cta-card-options input[type="radio"]:checked + label,
	#gform_wrapper_15 .cta-card-options input[type="checkbox"]:checked + label {
		background: #F89828 !important;
		color: #fff !important;
		border-color: #F89828 !important;
	}
}/* End custom CSS */