/*
 * Growth Without Grind Score: the assessment and the coaching application forms.
 *
 * Follows the site's 2026 design system (the "jh" styles in the Elementor kit): Ocean
 * backgrounds, Ash text, Sun (gold) accents, Larken for display type, Inter for body, and
 * the Contact page's underlined form fields. The values are copied here rather than read
 * from the kit's --jh-* variables so the forms still look right if those are renamed.
 *
 * Gravity Forms prints its theme CSS after this file, so order can't be relied on. The
 * wrapper class is deliberately written twice in every selector: that extra weight is
 * what lets these rules outrank Gravity Forms' own (.gform_wrapper.gravity-theme …).
 */

/* The page behind the forms goes dark with them. An Elementor page background, if one is set, outranks this. */
body:has(.gwg-scorecard_wrapper),
body:has(.gwg-application_wrapper) {
	background-color: #182b2d;
}

/*
 * The headline above each form follows the site's habit of setting one phrase in gold
 * italic. Those headlines are Elementor headings, and its editor strips classes and inline
 * styles from heading text, so the colour for an <em> inside them has to come from here.
 */
body:has(.gwg-scorecard_wrapper) h1 em,
body:has(.gwg-application_wrapper) h1 em {
	color: #dab61d;
	font-style: italic;
}

.gform_wrapper.gwg-scorecard_wrapper.gwg-scorecard_wrapper,
.gform_wrapper.gwg-application_wrapper.gwg-application_wrapper {
	--gwg-ocean: #182b2d;
	--gwg-panel: #1f3537;
	--gwg-ash: #d8cfb8;
	--gwg-quartz: #b7a39d;
	--gwg-sun: #dab61d;
	--gwg-sun-deep: #b49400;
	--gwg-error: #f0b4a8;
	--gwg-hairline: rgba(216, 207, 184, 0.14);
	--gwg-line: rgba(216, 207, 184, 0.4);
	--gwg-display: "Larken", "Iowan Old Style", Georgia, serif;
	--gwg-ui: "Inter", system-ui, -apple-system, "Segoe UI", sans-serif;

	/*
	 * 820px of content plus a gutter, so the form never touches the screen edge inside an
	 * unpadded container, and bottom space so it never sits flush against the footer.
	 */
	box-sizing: border-box;
	max-width: 860px;
	margin: 0 auto;
	padding: 0 20px 96px;
	color: var(--gwg-ash);
	font-family: var(--gwg-ui);
	font-weight: 400;
	font-size: 17px;
	line-height: 1.6;
}

/* Browsers without :has() can't darken the page, so the forms carry their own background. */
@supports not selector(:has(*)) {
	.gform_wrapper.gwg-scorecard_wrapper.gwg-scorecard_wrapper,
	.gform_wrapper.gwg-application_wrapper.gwg-application_wrapper {
		background-color: #182b2d;
	}
}

/* wpautop (e.g. Elementor's Text Editor widget) can leave stray tags inside the form. */
.gform_wrapper.gwg-scorecard_wrapper.gwg-scorecard_wrapper p:empty,
.gform_wrapper.gwg-application_wrapper.gwg-application_wrapper p:empty,
.gform_wrapper.gwg-scorecard_wrapper.gwg-scorecard_wrapper .gchoice br,
.gform_wrapper.gwg-scorecard_wrapper.gwg-scorecard_wrapper .gform_footer br,
.gform_wrapper.gwg-application_wrapper.gwg-application_wrapper .gform_footer br {
	display: none;
}

.gform_wrapper.gwg-scorecard_wrapper.gwg-scorecard_wrapper .gform_required_legend,
.gform_wrapper.gwg-scorecard_wrapper.gwg-scorecard_wrapper .gfield_required,
.gform_wrapper.gwg-application_wrapper.gwg-application_wrapper .gform_required_legend {
	display: none !important;
}

/* ---------- Stepper ---------- */

/* Until the stepper script has run, don't flash the full 20-question page. */
.gwg-js .gform_wrapper.gwg-scorecard_wrapper.gwg-scorecard_wrapper:not(.gwg-ready) form {
	visibility: hidden;
	max-height: 70vh;
	overflow: hidden;
}

.gform_wrapper.gwg-scorecard_wrapper.gwg-scorecard_wrapper.gwg-ready .gfield.gwg-q:not(.gwg-active),
.gform_wrapper.gwg-scorecard_wrapper.gwg-scorecard_wrapper.gwg-ready .gfield.gwg-contact:not(.gwg-active),
.gform_wrapper.gwg-scorecard_wrapper.gwg-scorecard_wrapper.gwg-ready .gform_footer:not(.gwg-active) {
	display: none !important;
}

.gform_wrapper.gwg-scorecard_wrapper.gwg-scorecard_wrapper.gwg-ready .gfield.gwg-active {
	animation: gwg-step-in 0.32s ease both;
}

@keyframes gwg-step-in {
	from {
		opacity: 0;
		transform: translateY(8px);
	}
}

.gform_wrapper.gwg-scorecard_wrapper.gwg-scorecard_wrapper.gwg-ready .gform_fields {
	display: block;
	min-height: 330px;
}

.gwg-progress {
	margin-bottom: 44px;
}

.gwg-progress__text {
	margin-bottom: 14px;
	color: var(--gwg-sun);
	font-family: var(--gwg-ui);
	font-size: 12px;
	font-weight: 400;
	line-height: 1;
	letter-spacing: 0.22em;
	text-transform: uppercase;
}

.gwg-progress__track {
	height: 1px;
	background: var(--gwg-line);
}

.gwg-progress__fill {
	width: 0;
	height: 3px;
	margin-top: -1px;
	background: var(--gwg-sun);
	transition: width 0.3s ease;
}

.gwg-nav {
	display: flex;
	justify-content: space-between;
	gap: 16px;
	margin-top: 20px;
}

.gform_wrapper.gwg-scorecard_wrapper.gwg-scorecard_wrapper .gwg-nav button {
	padding: 10px 0;
	border: 0;
	border-radius: 0;
	background: none;
	color: var(--gwg-quartz);
	font-family: var(--gwg-ui);
	font-size: 12px;
	font-weight: 400;
	letter-spacing: 0.16em;
	text-transform: uppercase;
	cursor: pointer;
	transition: color 0.25s ease;
}

.gform_wrapper.gwg-scorecard_wrapper.gwg-scorecard_wrapper .gwg-nav button:hover,
.gform_wrapper.gwg-scorecard_wrapper.gwg-scorecard_wrapper .gwg-nav button:focus-visible {
	background: none;
	color: var(--gwg-sun);
}

.gform_wrapper.gwg-scorecard_wrapper.gwg-scorecard_wrapper .gwg-nav button:disabled {
	color: var(--gwg-quartz);
	opacity: 0.35;
	cursor: default;
}

.gform_wrapper.gwg-scorecard_wrapper.gwg-scorecard_wrapper .gwg-nav button[hidden] {
	display: none;
}

.gwg-nav__next {
	margin-left: auto;
}

/* ---------- Questions ---------- */

.gform_wrapper.gwg-scorecard_wrapper.gwg-scorecard_wrapper .gfield.gwg-q {
	margin: 0;
	padding: 0;
	border: 0;
}

.gform_wrapper.gwg-scorecard_wrapper.gwg-scorecard_wrapper .gfield.gwg-q > .gfield_label {
	display: block;
	width: 100%;
	margin: 0 0 40px;
	padding: 0;
	color: var(--gwg-ash);
	font-family: var(--gwg-display);
	font-size: clamp(26px, 3.4vw, 38px);
	font-weight: 400;
	line-height: 1.15;
	text-wrap: pretty;
}

.gform_wrapper.gwg-scorecard_wrapper.gwg-scorecard_wrapper .gwg-q .gfield_radio {
	display: grid;
	grid-template-columns: repeat(5, 1fr);
	gap: 12px;
}

.gform_wrapper.gwg-scorecard_wrapper.gwg-scorecard_wrapper .gwg-q .gchoice {
	position: relative;
	display: block;
	margin: 0;
	padding: 0;
}

.gform_wrapper.gwg-scorecard_wrapper.gwg-scorecard_wrapper .gwg-q .gchoice input[type="radio"] {
	position: absolute;
	width: 1px;
	height: 1px;
	margin: 0;
	opacity: 0;
}

.gform_wrapper.gwg-scorecard_wrapper.gwg-scorecard_wrapper .gwg-q .gchoice label {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 100%;
	max-width: none;
	min-height: 72px;
	margin: 0;
	padding: 12px 10px;
	border: 1px solid var(--gwg-line);
	border-radius: 0;
	color: var(--gwg-ash);
	font-family: var(--gwg-ui);
	font-size: 12px;
	font-weight: 500;
	line-height: 1.5;
	letter-spacing: 0.14em;
	text-transform: uppercase;
	text-align: center;
	cursor: pointer;
	transition: color 0.2s ease, background-color 0.2s ease, border-color 0.2s ease;
}

/*
 * Hover only changes the outline, and only where a real pointer exists. After auto-advance
 * the cursor (or, on touch screens, the "stuck" hover) sits on the same option of the next
 * question, and a filled hover would make it look pre-selected.
 */
@media (hover: hover) {
	.gform_wrapper.gwg-scorecard_wrapper.gwg-scorecard_wrapper .gwg-q .gchoice label:hover {
		border-color: var(--gwg-sun);
		color: var(--gwg-sun);
	}
}

.gform_wrapper.gwg-scorecard_wrapper.gwg-scorecard_wrapper .gwg-q .gchoice input:checked ~ label {
	border-color: var(--gwg-sun);
	background: var(--gwg-sun);
	color: var(--gwg-ocean);
	font-weight: 600;
}

.gform_wrapper.gwg-scorecard_wrapper.gwg-scorecard_wrapper .gwg-q .gchoice input:focus-visible ~ label {
	outline: 2px solid var(--gwg-sun);
	outline-offset: 3px;
}

/* ---------- Contact step and the application form ---------- */

.gform_wrapper.gwg-scorecard_wrapper.gwg-scorecard_wrapper .gwg-contact h3 {
	margin: 0 0 12px;
	color: var(--gwg-ash);
	font-family: var(--gwg-display);
	font-size: clamp(26px, 3.4vw, 38px);
	font-weight: 400;
	line-height: 1.15;
}

.gform_wrapper.gwg-scorecard_wrapper.gwg-scorecard_wrapper .gfield.gwg-contact {
	margin-bottom: 26px;
}

/* Short labels (name, email) are the site's small caps. */
.gform_wrapper.gwg-scorecard_wrapper.gwg-scorecard_wrapper .gwg-contact .gfield_label,
.gform_wrapper.gwg-application_wrapper.gwg-application_wrapper .gfield_label {
	display: block;
	margin-bottom: 4px;
	color: var(--gwg-quartz);
	font-family: var(--gwg-ui);
	font-size: 12px;
	font-weight: 400;
	line-height: 1.4;
	letter-spacing: 0.18em;
	text-transform: uppercase;
}

/* The application's questions are sentences, so they are set as display type instead. */
.gform_wrapper.gwg-application_wrapper.gwg-application_wrapper .gfield--type-textarea .gfield_label {
	margin-bottom: 8px;
	color: var(--gwg-ash);
	font-family: var(--gwg-display);
	font-size: 22px;
	line-height: 1.3;
	letter-spacing: 0;
	text-transform: none;
	text-wrap: pretty;
}

.gform_wrapper.gwg-application_wrapper.gwg-application_wrapper .gfield_required {
	color: var(--gwg-quartz);
	font-family: var(--gwg-ui);
	font-size: 11px;
	font-style: normal;
	letter-spacing: 0.08em;
	text-transform: none;
}

/* One hairline under each field, as on the Contact page. */
.gform_wrapper.gwg-scorecard_wrapper.gwg-scorecard_wrapper .gwg-contact input[type="text"],
.gform_wrapper.gwg-scorecard_wrapper.gwg-scorecard_wrapper .gwg-contact input[type="email"],
.gform_wrapper.gwg-application_wrapper.gwg-application_wrapper input[type="text"],
.gform_wrapper.gwg-application_wrapper.gwg-application_wrapper input[type="email"],
.gform_wrapper.gwg-application_wrapper.gwg-application_wrapper textarea {
	width: 100%;
	min-height: 0;
	padding: 12px 0;
	border: 0;
	border-bottom: 1px solid var(--gwg-line);
	border-radius: 0;
	box-shadow: none;
	background: transparent;
	color: var(--gwg-ash);
	font-family: var(--gwg-ui);
	font-size: 17px;
	font-weight: 400;
	line-height: 1.6;
	transition: border-color 0.25s ease;
}

.gform_wrapper.gwg-scorecard_wrapper.gwg-scorecard_wrapper .gwg-contact input[type="text"]:focus,
.gform_wrapper.gwg-scorecard_wrapper.gwg-scorecard_wrapper .gwg-contact input[type="email"]:focus,
.gform_wrapper.gwg-application_wrapper.gwg-application_wrapper input[type="text"]:focus,
.gform_wrapper.gwg-application_wrapper.gwg-application_wrapper input[type="email"]:focus,
.gform_wrapper.gwg-application_wrapper.gwg-application_wrapper textarea:focus {
	outline: 0;
	box-shadow: none;
	border-bottom-color: var(--gwg-sun);
}

/* ".gfield textarea" because Gravity Forms sets the height four classes deep (.gfield textarea.medium). */
.gform_wrapper.gwg-application_wrapper.gwg-application_wrapper .gfield textarea {
	height: 140px;
	min-height: 120px;
	resize: vertical;
}

.gform_wrapper.gwg-scorecard_wrapper.gwg-scorecard_wrapper .gwg-fineprint {
	margin: 0;
	color: var(--gwg-quartz);
	font-family: var(--gwg-ui);
	font-size: 13px;
	line-height: 1.5;
}

.gform_wrapper.gwg-application_wrapper.gwg-application_wrapper .gform_description {
	display: block;
	max-width: 560px;
	margin-bottom: 48px;
	color: var(--gwg-ash);
	font-family: var(--gwg-ui);
	font-size: 18px;
	line-height: 1.6;
}

.gform_wrapper.gwg-application_wrapper.gwg-application_wrapper .gfield {
	margin-bottom: 36px;
}

.gform_wrapper.gwg-scorecard_wrapper.gwg-scorecard_wrapper .gform_footer,
.gform_wrapper.gwg-application_wrapper.gwg-application_wrapper .gform_footer {
	margin: 0;
	padding: 12px 0 0;
}

/* The site's gold button. */
.gform_wrapper.gwg-scorecard_wrapper.gwg-scorecard_wrapper .gform_footer input[type="submit"],
.gform_wrapper.gwg-scorecard_wrapper.gwg-scorecard_wrapper .gform_footer button[type="submit"],
.gform_wrapper.gwg-application_wrapper.gwg-application_wrapper .gform_footer input[type="submit"],
.gform_wrapper.gwg-application_wrapper.gwg-application_wrapper .gform_footer button[type="submit"] {
	width: auto;
	min-height: 0;
	margin: 0;
	padding: 18px 30px;
	border: 0;
	border-radius: 0;
	background: var(--gwg-sun);
	color: var(--gwg-ocean);
	font-family: var(--gwg-ui);
	font-size: 12px;
	font-weight: 600;
	line-height: 1.2;
	letter-spacing: 0.18em;
	text-transform: uppercase;
	cursor: pointer;
	transition: background-color 0.25s ease;
}

.gform_wrapper.gwg-scorecard_wrapper.gwg-scorecard_wrapper .gform_footer input[type="submit"]:hover,
.gform_wrapper.gwg-scorecard_wrapper.gwg-scorecard_wrapper .gform_footer button[type="submit"]:hover,
.gform_wrapper.gwg-application_wrapper.gwg-application_wrapper .gform_footer input[type="submit"]:hover,
.gform_wrapper.gwg-application_wrapper.gwg-application_wrapper .gform_footer button[type="submit"]:hover {
	background: var(--gwg-sun-deep);
	color: var(--gwg-ocean);
}

/* ---------- Validation and confirmation ---------- */

.gform_wrapper.gwg-scorecard_wrapper.gwg-scorecard_wrapper .gform_validation_errors,
.gform_wrapper.gwg-application_wrapper.gwg-application_wrapper .gform_validation_errors {
	margin: 0 0 32px;
	padding: 16px 0;
	border: 0;
	border-top: 1px solid var(--gwg-error);
	border-bottom: 1px solid var(--gwg-error);
	border-radius: 0;
	box-shadow: none;
	background: transparent;
}

.gform_wrapper.gwg-scorecard_wrapper.gwg-scorecard_wrapper .gform_validation_errors > h2,
.gform_wrapper.gwg-application_wrapper.gwg-application_wrapper .gform_validation_errors > h2,
.gform_wrapper.gwg-scorecard_wrapper.gwg-scorecard_wrapper .gform_validation_errors .gform_submission_error,
.gform_wrapper.gwg-application_wrapper.gwg-application_wrapper .gform_validation_errors .gform_submission_error {
	color: var(--gwg-error);
	font-family: var(--gwg-ui);
	font-size: 14px;
	font-weight: 400;
	line-height: 1.5;
}

.gform_wrapper.gwg-scorecard_wrapper.gwg-scorecard_wrapper .gfield_error .gfield_label,
.gform_wrapper.gwg-application_wrapper.gwg-application_wrapper .gfield_error .gfield_label,
.gform_wrapper.gwg-scorecard_wrapper.gwg-scorecard_wrapper .gfield_error legend,
.gform_wrapper.gwg-application_wrapper.gwg-application_wrapper .gfield_error legend {
	color: var(--gwg-error);
}

.gform_wrapper.gwg-scorecard_wrapper.gwg-scorecard_wrapper .gfield_error input,
.gform_wrapper.gwg-application_wrapper.gwg-application_wrapper .gfield_error input,
.gform_wrapper.gwg-application_wrapper.gwg-application_wrapper .gfield_error textarea {
	border-color: var(--gwg-error);
}

.gform_wrapper.gwg-scorecard_wrapper.gwg-scorecard_wrapper .gfield_validation_message,
.gform_wrapper.gwg-scorecard_wrapper.gwg-scorecard_wrapper .validation_message,
.gform_wrapper.gwg-application_wrapper.gwg-application_wrapper .gfield_validation_message,
.gform_wrapper.gwg-application_wrapper.gwg-application_wrapper .validation_message {
	margin-top: 8px;
	padding: 0;
	border: 0;
	background: transparent;
	color: var(--gwg-error);
	font-family: var(--gwg-ui);
	font-size: 13px;
	line-height: 1.5;
}

/* Shown in place of a form once it has been sent. Gravity Forms swaps the form wrapper for this one. */
.gform_confirmation_wrapper.gwg-application_wrapper .gform_confirmation_message,
.gform_confirmation_wrapper.gwg-scorecard_wrapper .gform_confirmation_message {
	max-width: 820px;
	margin: 0 auto;
	padding: 28px 0;
	border-top: 1px solid rgba(218, 182, 29, 0.6);
	border-bottom: 1px solid rgba(218, 182, 29, 0.6);
	color: #d8cfb8;
	font-family: "Larken", "Iowan Old Style", Georgia, serif;
	font-size: 24px;
	line-height: 1.3;
}

@media (max-width: 640px) {
	.gform_wrapper.gwg-scorecard_wrapper.gwg-scorecard_wrapper .gwg-q .gfield_radio {
		grid-template-columns: 1fr;
		gap: 10px;
	}

	.gform_wrapper.gwg-scorecard_wrapper.gwg-scorecard_wrapper .gwg-q .gchoice label {
		min-height: 54px;
	}

	.gform_wrapper.gwg-scorecard_wrapper.gwg-scorecard_wrapper.gwg-ready .gform_fields {
		min-height: 0;
	}

	.gwg-progress {
		margin-bottom: 32px;
	}

	.gform_wrapper.gwg-application_wrapper.gwg-application_wrapper .gfield--type-textarea .gfield_label {
		font-size: 20px;
	}
}

@media (prefers-reduced-motion: reduce) {
	.gform_wrapper.gwg-scorecard_wrapper.gwg-scorecard_wrapper.gwg-ready .gfield.gwg-active {
		animation: none;
	}
}

/* The question is focused programmatically between steps (for keyboard shortcuts); no ring needed. */
.gform_wrapper.gwg-scorecard_wrapper.gwg-scorecard_wrapper .gfield.gwg-q:focus {
	outline: none;
}