/**
 * Contact — docs/sections/CONTACT.md.
 * Copy lives in Elementor; the form is the CF7 form "GO Contact" (template in CONTACT.md §8),
 * styled here and stepped by go-contact.js (which adds .is-stepped). Without JS both steps show
 * and the form posts normally. Shared components from go-base.css: frame, dividers, gradient,
 * eyebrow, scroll-linked H2, pill buttons. Breakpoints: 1000 px and 640 px.
 */

.e-con.go-contact {
	--padding-top: 0px;
	--padding-right: 0px;
	--padding-bottom: 0px;
	--padding-left: 0px;
	--gap: 0px;
	--row-gap: 0px;
	--column-gap: 0px;
	overflow-x: clip;
}

/* ---------- Split row: 5 / 7, divided by a 1 px grid line ---------- */

.e-con.go-contact__split {
	--padding-top: 0px;
	--padding-right: 0px;
	--padding-bottom: 0px;
	--padding-left: 0px;
	background: var(--go-line);
}

/* ---------- Left panel: heading, orbit, note; conic gradient glowing from the bottom left ---------- */

.e-con.go-contact__intro {
	--go-gradient-mask: radial-gradient(110% 80% at 0% 100%, #000 0%, rgba(0, 0, 0, .5) 45%, transparent 85%);
	--padding-top: clamp(40px, 5vw, 72px);
	--padding-bottom: clamp(32px, 4vw, 56px);
	--padding-left: var(--go-pad-x);
	--padding-right: var(--go-pad-x);
	--gap: 40px;
	--row-gap: 40px;
	--justify-content: space-between;
}

/* Conic layer only (no diagonal band). */
.go-contact__intro .go-gradient__band {
	display: none;
}

.e-con.go-contact__head {
	--padding-top: 0px;
	--padding-right: 0px;
	--padding-bottom: 0px;
	--padding-left: 0px;
	--gap: 24px;
	--row-gap: 24px;
}

.go-contact__head .go-h2 .elementor-heading-title {
	max-width: 8em;
}

/* Orbit art (GO Orbit widget): fills the space between heading and note, bleeding to the panel edges. */
.elementor.elementor .e-con > .elementor-widget-go-orbit {
	flex: 1 1 auto;
	align-self: stretch;
	width: auto;
	max-width: none;
	min-height: clamp(400px, 40vw, 560px);
	margin-inline: calc(-1 * var(--go-pad-x));
}

.go-orbit {
	position: absolute;
	inset: 0;
}

.go-orbit__svg {
	display: block;
	width: 100%;
	height: 100%;
	overflow: visible;
}

.go-orbit__ring {
	fill: none;
	stroke: #9a9a96;
	stroke-width: 1;
	vector-effect: non-scaling-stroke;
	transition: stroke .6s ease;
}

.go-orbit__rings {
	transition: opacity .6s ease;
}

.go-orbit.is-idle .go-orbit__rings {
	opacity: .7;
}

.go-orbit__link {
	stroke: var(--go-ink);
	stroke-width: 1;
	stroke-dasharray: 2 4;
	vector-effect: non-scaling-stroke;
	opacity: 0;
	transition: opacity .4s ease;
}

.go-orbit__links {
	opacity: var(--go-orbit-links, .14);
	transition: opacity .6s ease;
}

.go-orbit.is-idle .go-orbit__links {
	opacity: 0;
}

.go-orbit__node {
	opacity: 0;
	transition: opacity .5s ease;
}

/* Tiles grow from 60 % as they fade in (the design scales them with their opacity). */
.go-orbit__body {
	scale: .6;
	transition: scale .5s var(--go-ease);
}

.go-orbit__node.is-on > .go-orbit__body {
	scale: 1;
}

.go-orbit__link.is-on,
.go-orbit__node.is-on {
	opacity: 1;
}

.go-orbit__frame {
	fill: var(--go-white);
	stroke: var(--go-line);
	stroke-width: 1;
	vector-effect: non-scaling-stroke;
}

.go-orbit__tile {
	fill: var(--go-orbit-tile, var(--go-mint));
	transition: fill .5s ease;
}

.go-orbit__node--lavender {
	--go-orbit-tile: var(--go-lavender);
}

.go-orbit__node--lime {
	--go-orbit-tile: var(--go-lime);
}

.go-orbit__glyph {
	fill: var(--go-ink);
	transition: fill-opacity .5s ease;
}

.go-orbit.is-sized .go-orbit__ring {
	stroke: var(--go-lavender);
}

/* No size chosen: grey ghost tiles. */
.go-orbit.is-idle .go-orbit__tile {
	fill: #ecece9;
}

.go-orbit.is-idle .go-orbit__node.is-on {
	opacity: .75;
}

.go-orbit.is-idle .go-orbit__glyph {
	fill-opacity: .3;
}

/* "Recommend a team": tiles still to be decided. */
.go-orbit.is-tbd .go-orbit__tile {
	fill: #f3f3f1;
}

.go-orbit.is-tbd .go-orbit__frame {
	stroke: #9a9a96;
	stroke-dasharray: 3 3;
}

.go-orbit.is-tbd .go-orbit__glyph {
	fill-opacity: .4;
}

.go-orbit.is-sent .go-orbit__tile {
	fill: var(--go-lime);
}

/* "No commitment" note: Ink square with a Lime pixel check, stretching to the text height. */
.e-con.go-contact__note {
	--padding-top: 0px;
	--padding-right: 0px;
	--padding-bottom: 0px;
	--padding-left: 66px;
	--gap: 4px;
	--row-gap: 4px;
	--justify-content: center;
	position: relative;
	max-width: 26em;
	min-height: 50px;
}

:is(.go-contact__note, .e-con.go-contact__note)::before {
	content: "";
	position: absolute;
	top: 0;
	bottom: 0;
	left: 0;
	width: 50px;
	height: auto;
	border: 0;
	border-radius: 0;
	background: url("../icons/check-lime.svg") center / 21px 18px no-repeat, var(--go-ink);
	opacity: 1;
	mix-blend-mode: normal;
	transition: none;
}

.go-contact__note-title .elementor-heading-title {
	margin: 0;
	color: var(--go-ink);
	font-family: var(--go-font-sans);
	font-size: 17px;
	font-weight: 500;
	line-height: 1.3;
}

.go-contact__note-text .elementor-heading-title {
	margin: 0;
	color: var(--go-text-body);
	font-family: var(--go-font-sans);
	font-size: 15px;
	font-weight: 400;
	line-height: 1.45;
}

/* ---------- Right panel: soft static glow + grain ---------- */

.elementor-widget.go-contact__form {
	position: relative;
	isolation: isolate;
	display: flex;
	flex-direction: column;
	box-sizing: border-box;
	padding: clamp(32px, 4vw, 56px) var(--go-pad-x);
	background:
		radial-gradient(70% 55% at 0% 100%, rgba(169, 162, 242, .32) 0%, rgba(169, 162, 242, 0) 75%),
		radial-gradient(60% 45% at 100% 0%, rgba(160, 226, 207, .35) 0%, rgba(160, 226, 207, 0) 75%),
		radial-gradient(45% 35% at 100% 100%, rgba(210, 255, 31, .22) 0%, rgba(210, 255, 31, 0) 75%),
		#f7f8f6;
}

.elementor-widget.go-contact__form::before {
	content: "";
	position: absolute;
	inset: 0;
	z-index: -1;
	background-image: var(--go-grain);
	opacity: .25;
	mix-blend-mode: overlay;
	pointer-events: none;
}

/* Let the form fill the panel so each step's footer sits at the bottom. */
.go-contact__form :is(.elementor-widget-container, .elementor-shortcode, .wpcf7),
.go-form {
	flex: 1 1 auto;
	display: flex;
	flex-direction: column;
	min-width: 0;
}

/* ---------- Form ---------- */

.go-form {
	margin: 0;
	color: var(--go-ink);
	font-family: var(--go-font-sans);
}

.go-form__states,
.go-form__steps {
	flex: 1 1 auto;
	display: grid;
	min-width: 0;
}

/* One grid cell per stack: the panel is as tall as the tallest state, so nothing jumps. */
.go-form__states > *,
.go-form.is-stepped .go-form__steps > * {
	grid-area: 1 / 1;
	min-width: 0;
}

/* go-contact.js also sets inert and aria-hidden on these. */
.go-form .is-off {
	visibility: hidden;
}

.go-form__main {
	display: flex;
	flex-direction: column;
	gap: 28px;
	min-width: 0;
}

/* Info banner */
.go-form__banner {
	display: inline-flex;
	align-self: flex-start;
	align-items: center;
	flex-wrap: wrap;
	gap: 10px;
	margin: 0 0 -8px;
	padding: 9px 14px;
	border: 1px solid var(--go-line);
	border-left: 3px solid var(--go-lime);
	background: var(--go-white);
	font-size: 14px;
	font-weight: 500;
	line-height: 1.3;
}

.go-form__banner::before {
	content: "";
	flex: none;
	width: 16px;
	height: 16px;
	background: url("../icons/info.svg") center / 100% 100% no-repeat;
}

.go-optional {
	display: inline-block;
	padding: 3px 7px;
	background: #efefec;
	color: var(--go-text-2);
	font-family: var(--go-font-mono);
	font-size: 11px;
	font-weight: 400;
	line-height: 1.2;
}

/* Progress */
.go-form__progress {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 8px;
	margin: 0;
	padding: 0;
	list-style: none;
}

.go-form__progress li {
	display: grid;
	grid-template-columns: 26px minmax(0, 1fr);
	align-items: center;
	column-gap: 10px;
	margin: 0;
	padding: 12px 0 0;
	border-top: 3px solid var(--go-line);
}

.go-form__progress li.is-current,
.go-form__progress li.is-done {
	border-top-color: var(--go-ink);
}

.go-form__tile {
	display: grid;
	place-items: center;
	box-sizing: border-box;
	width: 26px;
	height: 26px;
	border: 1px solid var(--go-line);
	background: var(--go-white);
	color: var(--go-ink);
	font-family: var(--go-font-mono);
	font-size: 12px;
	line-height: 1;
}

.is-current > .go-form__tile {
	border-color: var(--go-ink);
	background: var(--go-ink);
	color: var(--go-white);
}

.is-done > .go-form__tile {
	border-color: #9a9a96;
	background: url("../icons/check.svg") center / 14px 12px no-repeat, var(--go-lime);
	color: transparent;
}

.go-form__progress-text {
	display: flex;
	flex-direction: column;
	min-width: 0;
}

.go-form__progress-num {
	color: var(--go-text-2);
	font-family: var(--go-font-mono);
	font-size: 11px;
	line-height: 1.3;
}

/* Upcoming label: #555555, not the design's #9A9A96 (fails contrast, as on Capabilities). */
.go-form__progress-label {
	overflow: hidden;
	color: var(--go-text-2);
	font-size: 15px;
	font-weight: 500;
	line-height: 1.3;
	white-space: nowrap;
	text-overflow: ellipsis;
}

:is(.is-current, .is-done) .go-form__progress-label {
	color: var(--go-ink);
}

/* Steps */
.go-form__step {
	display: flex;
	flex-direction: column;
	gap: 24px;
	min-width: 0;
}

.go-form__fields {
	flex: 1 1 auto;
	display: flex;
	flex-direction: column;
	gap: 24px;
	min-width: 0;
}

.go-form__step--details .go-form__fields {
	flex: 0 0 auto;
	gap: 14px;
}

.go-form__foot {
	display: flex;
	flex-direction: column;
	gap: 24px;
	margin-top: auto;
}

.go-form__step--details .go-form__foot {
	gap: 20px;
}

/* ---------- Fields ---------- */

/* 26 px under each control: an 8 px gap plus the fixed 18 px hint/error line. */
.go-field {
	position: relative;
	display: flex;
	flex-direction: column;
	gap: 8px;
	min-width: 0;
	margin: 0;
	padding: 0 0 26px;
	border: 0;
}

/* Legends don't take part in flex layout; float them into the flow instead. */
fieldset.go-field {
	display: block;
}

fieldset.go-field > legend {
	float: left;
	width: 100%;
	margin: 0 0 8px;
	padding: 0;
}

fieldset.go-field > legend + * {
	clear: both;
}

.go-field--grow {
	flex: 1 1 auto;
}

.go-field__label {
	display: flex;
	align-items: center;
	flex-wrap: wrap;
	gap: 10px;
	margin: 0;
	color: var(--go-ink);
	font-family: var(--go-font-sans);
	font-size: 15px;
	font-weight: 500;
	line-height: 1.3;
}

.go-form .go-field .wpcf7-form-control-wrap {
	position: static;
	display: block;
}

.go-field--grow .wpcf7-form-control-wrap {
	flex: 1 1 auto;
	display: flex;
	flex-direction: column;
}

.go-form :is(input[type="text"], input[type="email"], input[type="tel"], textarea) {
	box-sizing: border-box;
	width: 100%;
	height: auto;
	margin: 0;
	padding: 13px 16px;
	border: 1px solid var(--go-line);
	border-radius: 0;
	background: rgba(255, 255, 255, .35);
	-webkit-backdrop-filter: blur(6px);
	backdrop-filter: blur(6px);
	box-shadow: none;
	color: var(--go-ink);
	font-family: var(--go-font-sans);
	font-size: 16px;
	font-weight: 400;
	line-height: 1.4;
	transition: border-color .2s ease, box-shadow .2s ease;
}

/* CF7 prints rows="10"; size from CSS instead (the need field then grows to fill the step). */
.go-form textarea.wpcf7-textarea {
	height: 96px;
	min-height: 96px;
	padding: 14px 16px;
	line-height: 1.5;
	resize: vertical;
}

.go-field--grow textarea.wpcf7-textarea {
	flex: 1 1 auto;
}

.go-form :is(input, textarea)::placeholder {
	color: #9a9a96;
	opacity: 1;
}

.go-form :is(input[type="text"], input[type="email"], input[type="tel"], textarea):hover {
	border-color: #bdbdb8;
}

/* Focus (BRAND.md §15): Ink border + Lime ring. The design's border-only change fails WCAG 2.4.7. */
.go-form :is(input[type="text"], input[type="email"], input[type="tel"], textarea):focus {
	border-color: var(--go-ink);
	outline: none;
	box-shadow: 0 0 0 3px rgba(210, 255, 31, .55);
}

.go-form .wpcf7-not-valid:is(input, textarea),
.go-form .wpcf7-not-valid:is(input, textarea):hover {
	border-color: var(--go-error);
}

/* Hint and error share the 18 px line under the control. */
.go-field__hint,
.go-form .go-field .wpcf7-not-valid-tip {
	position: absolute;
	right: 0;
	bottom: 0;
	left: 0;
	overflow: hidden;
	margin: 0;
	font-family: var(--go-font-sans);
	font-size: 13px;
	font-weight: 400;
	line-height: 18px;
	white-space: nowrap;
	text-overflow: ellipsis;
}

.go-field__hint {
	color: var(--go-text-2);
}

.go-field:has(.wpcf7-not-valid-tip) .go-field__hint {
	visibility: hidden;
}

.go-form .go-field .wpcf7-not-valid-tip {
	color: var(--go-error);
}

.go-form .wpcf7-not-valid-tip::before {
	content: "";
	display: inline-block;
	width: 6px;
	height: 6px;
	margin-right: 8px;
	background: var(--go-error);
	vertical-align: 1px;
}

/* ---------- Option tiles: native radios styled as tiles ---------- */

.go-choice .wpcf7-radio {
	display: grid;
	grid-template-columns: repeat(var(--go-choice-cols, 2), minmax(0, 1fr));
	gap: 8px;
}

.go-choice--size {
	--go-choice-cols: 3;
}

.go-choice .wpcf7-list-item {
	display: block;
	margin: 0;
}

.go-choice .wpcf7-list-item label {
	position: relative;
	display: flex;
	align-items: center;
	box-sizing: border-box;
	height: 100%;
	min-height: 52px;
	margin: 0;
	padding: 12px 16px;
	border: 1px solid var(--go-line);
	background: rgba(255, 255, 255, .35);
	color: var(--go-ink);
	font-size: 15px;
	font-weight: 500;
	line-height: 1.25;
	cursor: pointer;
	transition: border-color .2s ease, background-color .2s ease;
}

.go-choice .wpcf7-list-item label:hover {
	border-color: #bdbdb8;
}

.go-choice .wpcf7-list-item label:has(input:checked) {
	border-color: #9a9a96;
	background: var(--go-lime);
}

.go-choice .wpcf7-not-valid .wpcf7-list-item label {
	border-color: var(--go-error);
}

.go-choice .wpcf7-list-item label:has(input:focus-visible) {
	outline: 2px solid var(--go-lavender);
	outline-offset: 2px;
}

/* Visually hidden, still focusable and announced. */
.go-form .wpcf7-list-item input[type="radio"],
.go-form .wpcf7-list-item input[type="checkbox"] {
	position: absolute;
	width: 1px;
	height: 1px;
	margin: 0;
	padding: 0;
	opacity: 0;
	pointer-events: none;
}

.go-choice .wpcf7-list-item-label {
	display: flex;
	align-items: center;
	gap: 12px;
	margin: 0;
}

.go-choice .wpcf7-list-item-label::before {
	content: "";
	flex: none;
	box-sizing: border-box;
	width: 16px;
	height: 16px;
	border: 1px solid var(--go-ink);
	background: var(--go-white);
}

.go-choice input:checked + .wpcf7-list-item-label::before {
	background: linear-gradient(var(--go-lime) 0 0) center / 6px 6px no-repeat, var(--go-ink);
}

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

.go-form__privacy {
	display: flex;
	align-items: center;
	gap: 10px;
	margin: 0;
	color: var(--go-text-2);
	font-size: 14px;
	line-height: 1.4;
}

.go-form__privacy::before {
	content: "";
	flex: none;
	width: 14px;
	height: 17px;
	background: url("../icons/padlock.svg") center / 100% 100% no-repeat;
}

/* Consent checkbox: the real input is hidden; a 20 px box is drawn before the text. */
.go-consent {
	padding-bottom: 26px;
}

.go-consent .wpcf7-list-item {
	display: block;
	margin: 0;
}

.go-consent label {
	position: relative;
	display: flex;
	align-items: flex-start;
	margin: 0;
	color: var(--go-text-body);
	font-size: 15px;
	line-height: 20px;
	cursor: pointer;
}

/* Text stays inline (the link sits mid-sentence); the box is drawn in the left padding. */
.go-consent .wpcf7-list-item-label {
	display: block;
	padding-left: 32px;
}

.go-consent .wpcf7-list-item-label::before {
	content: "";
	position: absolute;
	top: 0;
	left: 0;
	box-sizing: border-box;
	width: 20px;
	height: 20px;
	border: 1px solid #bdbdb8;
	background: var(--go-white);
	transition: border-color .2s ease;
}

.go-consent input:checked + .wpcf7-list-item-label::before {
	border-color: var(--go-ink);
	background: url("../icons/check-lime.svg") center / 11px 9px no-repeat, var(--go-ink);
}

.go-consent .wpcf7-not-valid .wpcf7-list-item-label::before {
	border-color: var(--go-error);
}

.go-consent input:focus-visible + .wpcf7-list-item-label::before {
	outline: 2px solid var(--go-lavender);
	outline-offset: 2px;
}

.go-consent a {
	color: var(--go-ink);
	text-decoration: underline;
	text-underline-offset: 2px;
}

.go-form .go-consent .wpcf7-not-valid-tip {
	left: 32px;
}

.go-form .wpcf7-turnstile {
	min-height: 65px;
}

.go-form__actions {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: space-between;
	gap: 12px 16px;
}

.go-form__next {
	align-self: flex-start;
	min-width: 200px;
}

.go-form__back {
	--go-btn-bg-hover: var(--go-surface);
	flex-direction: row-reverse;
}

.go-form__back .go-btn__arrow {
	transform: scaleX(-1);
}

.go-form__summary {
	display: flex;
	align-items: center;
	gap: 8px;
	margin: 0;
	color: var(--go-error);
	font-size: 14px;
	line-height: 1.3;
}

.go-form__summary[hidden] {
	display: none;
}

.go-form__summary::before {
	content: "";
	flex: none;
	width: 8px;
	height: 8px;
	background: var(--go-error);
}

/* Sending */
.go-form .go-form__submit:disabled {
	--go-btn-bg: var(--go-text-body);
	--go-btn-bg-hover: var(--go-text-body);
	cursor: progress;
	transform: none;
}

.go-form__submit:disabled .go-btn__arrow g {
	transform: translateX(6px);
}

/* CF7's response box: only for send failures and spam (field errors show inline). The .wpcf7 form prefix beats CF7's styles. */
.wpcf7 form.go-form .wpcf7-response-output {
	display: none;
	margin: 0;
	padding: 10px 14px;
	border: 1px solid var(--go-error);
	border-left-width: 3px;
	background: var(--go-white);
	color: var(--go-ink);
	font-size: 14px;
	line-height: 1.4;
}

.wpcf7 form.go-form:is(.failed, .aborted, .spam) .wpcf7-response-output,
.wpcf7 form.go-form:not(.is-stepped):not(.init) .wpcf7-response-output {
	display: block;
	border-color: var(--go-error);
}

.wpcf7 form.go-form.sent:not(.is-stepped) .wpcf7-response-output {
	border-color: var(--go-ink);
}

.go-form .wpcf7-spinner {
	display: none;
}

/* ---------- Success panel ---------- */

.go-form__success {
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	gap: 20px;
	min-width: 0;
	text-align: center;
}

.go-form__success-icon {
	width: 44px;
	height: 44px;
	border-radius: 11px;
	background: url("../icons/check.svg") center / 18px 15px no-repeat, var(--go-lime);
}

.go-form .go-form__success-title {
	margin: 0;
	color: var(--go-ink);
	font-family: var(--go-font-sans);
	font-size: clamp(26px, 2.4vw, 36px);
	font-weight: 500;
	line-height: 1.05;
	letter-spacing: -.03em;
	text-wrap: balance;
}

.go-form__success-title:focus {
	outline: none;
}

.go-form__success-text {
	max-width: 28em;
	margin: 0;
	color: var(--go-text-body);
	font-size: 17px;
	line-height: 1.55;
}

.go-form__success-email {
	display: flex;
	align-items: center;
	gap: 12px;
	max-width: 100%;
	margin: 0;
	color: var(--go-ink);
	font-family: var(--go-font-mono);
	font-size: 15px;
	line-height: 1.3;
}

.go-form__success-email::before {
	content: "";
	flex: none;
	width: 28px;
	height: 28px;
	background: url("../icons/envelope-lime.svg") center / 14px 11px no-repeat, var(--go-ink);
}

.go-form__success-email span {
	overflow: hidden;
	white-space: nowrap;
	text-overflow: ellipsis;
}

.go-form__again {
	margin-top: 8px;
}

/* ---------- Without JS: one long form ---------- */

.go-form:not(.is-stepped) .go-form__steps {
	display: flex;
	flex-direction: column;
	gap: 40px;
}

.go-form:not(.is-stepped) :is(.go-form__progress, .go-form__next, .go-form__back) {
	display: none;
}

/* ---------- Tablet and mobile ---------- */

@media (max-width: 999.98px) {
	.e-con.go-contact__intro {
		--gap: 28px;
		--row-gap: 28px;
	}

	.elementor.elementor .e-con > .elementor-widget-go-orbit {
		display: none;
	}
}

@media (max-width: 639.98px) {
	.go-choice--size {
		--go-choice-cols: 1;
	}

	.go-form__next,
	.go-form__submit {
		width: 100%;
	}

	/* The consent message is too long for one line here: let it wrap below the box. */
	.go-consent:has(.wpcf7-not-valid-tip) {
		padding-bottom: 0;
	}

	.go-form .go-consent .wpcf7-not-valid-tip {
		position: static;
		margin: 8px 0 0 32px;
		white-space: normal;
	}
}

@media (prefers-reduced-motion: reduce) {
	.go-orbit__ring,
	.go-orbit__rings,
	.go-orbit__body,
	.go-orbit__link,
	.go-orbit__links,
	.go-orbit__node,
	.go-orbit__tile,
	.go-orbit__glyph,
	.go-form :is(input, textarea),
	.go-choice .wpcf7-list-item label,
	.go-consent .wpcf7-list-item-label::before {
		transition: none;
	}
}
