/**
 * Gravity Forms — Redefine Web design-system overrides.
 *
 * GF 2.7+ ships the "Orbital" theme framework — every input, label, button,
 * and choice control reads its color/radius/padding/font from CSS custom
 * properties (`--gf-ctrl-*`, `--gf-label-*`). The framework's own selectors
 * are `.gform-theme.gform-theme--framework.gform_wrapper :where(...)`, which
 * out-specifies any class-only override we could write — so we drive
 * everything through token overrides instead of fighting the cascade.
 * One source of truth, no specificity arms race.
 *
 * Each form picks a variant via Form Settings → Form CSS Class:
 *   rdw-form-light       — default, light card on paper bg
 *   rdw-form-dark-glass  — dark glass card (services, industry hubs, B2B)
 *   rdw-form-partners    — semi-dark Partners apply card
 *   rdw-form-news        — white press-subscribe card, single column
 *   rdw-form-newsletter  — inline email + button row (footer / blog sidebar)
 *   rdw-form-ppc         — solid ink card, full-width submit (PPC landings)
 *
 * REQUIRED: Form Settings → Form Theme = "Orbital". If a form is set to
 * Legacy or None, these tokens won't apply and the form falls back to default
 * GF styling.
 */

/* ============================================================
 * Universal base — light variant defaults that every form inherits.
 * ============================================================ */

.gform_wrapper {
	font-family: var(--sans, 'Inter Tight', system-ui, sans-serif);
	color: var(--ink, #0a0a0a);

	/* — Submit button (primary CTA) — */
	--gf-ctrl-btn-bg-color-primary: var(--accent, #d24a16) !important;
	--gf-ctrl-btn-bg-color-hover-primary: var(--accent-deep, #b03f12) !important;
	--gf-ctrl-btn-color-primary: #fff !important;
	--gf-ctrl-btn-color-hover-primary: #fff !important;
	--gf-ctrl-btn-border-color-primary: var(--accent, #d24a16) !important;
	--gf-ctrl-btn-border-color-hover-primary: var(--accent-deep, #b03f12) !important;
	--gf-ctrl-btn-border-width-primary: 0 !important;
	--gf-ctrl-btn-radius: 999px !important;
	--gf-ctrl-btn-padding-y: 14px !important;
	--gf-ctrl-btn-padding-x: 22px !important;
	--gf-ctrl-btn-font-family: var(--sans, 'Inter Tight', system-ui, sans-serif) !important;
	--gf-ctrl-btn-font-size: 14.5px !important;
	--gf-ctrl-btn-font-weight: 500 !important;
	--gf-ctrl-btn-letter-spacing: -0.005em !important;
	--gf-ctrl-btn-line-height: 1.2 !important;
	--gf-ctrl-btn-text-transform: none !important;
	--gf-ctrl-btn-shadow: 0 8px 24px -8px rgba(255, 91, 31, 0.5) !important;
	--gf-ctrl-btn-shadow-hover: 0 12px 30px -10px rgba(255, 91, 31, 0.6) !important;
	--gf-ctrl-btn-size-sm: auto !important;
	--gf-ctrl-btn-size: auto !important;
	--gf-ctrl-btn-size-lg: auto !important;

	/* — Inputs / selects / textareas — */
	--gf-ctrl-bg-color: #fff !important;
	--gf-ctrl-bg-color-focus: #fff !important;
	--gf-ctrl-color: var(--ink, #0a0a0a) !important;
	--gf-ctrl-color-placeholder: #6b6b6b !important;
	--gf-ctrl-border-color: var(--line, rgba(10, 10, 10, 0.12)) !important;
	--gf-ctrl-border-color-hover: rgba(10, 10, 10, 0.25) !important;
	--gf-ctrl-border-color-focus: var(--ink, #0a0a0a) !important;
	--gf-ctrl-border-style: solid !important;
	--gf-ctrl-border-width: 1px !important;
	--gf-ctrl-radius: 10px !important;
	--gf-ctrl-padding-y: 12px !important;
	--gf-ctrl-padding-x: 14px !important;
	--gf-ctrl-font-family: var(--sans, 'Inter Tight', system-ui, sans-serif) !important;
	--gf-ctrl-font-size: 14.5px !important;
	--gf-ctrl-line-height: 1.5 !important;
	--gf-ctrl-shadow-focus: 0 0 0 3px rgba(10, 10, 10, 0.06) !important;

	/* — Labels — clean sans, sentence case, no letter-spacing.
	   Orbital reads --gf-ctrl-label-*-primary on .gform-field-label.
	   The plain --gf-label-* tokens are for the form HEADER (which we hide via
	   .gform_heading display:none), not individual field labels. Set both so
	   the styling holds even if a future GF refactor reads either name. */
	--gf-ctrl-label-color-primary: #0a0a0a !important;
	--gf-ctrl-label-color-secondary: #6b6b6b !important;
	--gf-ctrl-label-font-family-primary: var(--sans, 'Inter Tight', system-ui, sans-serif) !important;
	--gf-ctrl-label-font-family-secondary: var(--sans, 'Inter Tight', system-ui, sans-serif) !important;
	--gf-ctrl-label-font-size-primary: 13px !important;
	--gf-ctrl-label-font-size-secondary: 12px !important;
	--gf-ctrl-label-font-weight-primary: 500 !important;
	--gf-ctrl-label-letter-spacing-primary: 0 !important;
	--gf-ctrl-label-line-height-primary: 1.4 !important;
	--gf-ctrl-label-text-transform-primary: none !important;
	--gf-label-color-primary: #0a0a0a !important;
	--gf-label-color-secondary: #6b6b6b !important;
	--gf-label-font-family: var(--sans, 'Inter Tight', system-ui, sans-serif) !important;
	--gf-label-font-size-md: 13px !important;
	--gf-label-font-weight: 500 !important;
	--gf-label-letter-spacing: 0 !important;
	--gf-label-line-height: 1.4 !important;
	--gf-label-text-transform: none !important;

	/* — Choice controls (checkbox / radio) — */
	--gf-ctrl-choice-color: var(--muted, #555) !important;
	--gf-ctrl-choice-color-selected: var(--accent, #d24a16) !important;
	--gf-ctrl-choice-bg-color: #fff !important;
	--gf-ctrl-choice-border-color: var(--line, rgba(10, 10, 10, 0.18)) !important;
}

/* Placeholder readability — bulletproof against Form Theme = Legacy / None
   and against browsers (notably Firefox) that apply a default ~0.54 opacity
   to ::placeholder. We set BOTH a solid color and opacity:1 directly, without
   relying on the --gf-ctrl-color-placeholder token (which Orbital reads but
   Legacy / None ignore). Dark variants below override the color back to a
   light cream so placeholders stay readable on dark backgrounds. */
.gform_wrapper :where(input, select, textarea)::placeholder {
	color: #1a1a1a !important;
	opacity: 1 !important;
}
.gform_wrapper :where(input, select, textarea)::-webkit-input-placeholder {
	color: #1a1a1a !important;
	opacity: 1 !important;
}
.gform_wrapper :where(input, select, textarea)::-moz-placeholder {
	color: #1a1a1a !important;
	opacity: 1 !important;
}

/* Empty <select> "placeholder" — selects don't have ::placeholder, so the
   value text inherits from the select's own color. Make sure the dropdown
   value reads at a usable mid-gray when no option is chosen yet. */
.gform_wrapper select:invalid,
.gform_wrapper select option[value=""] {
	color: #3a3a3a !important;
}
.gform_wrapper select option {
	color: #0a0a0a;
}

/* Select dropdown sizing — Orbital's --gf-ctrl-size token clips text descenders
   on Chrome ("Morning" / "Eastern (ET)" get cut at the bottom). Force a min
   height + line-height that fits the chosen font-size with comfortable padding
   so the value is fully visible without re-rendering the control. */
.gform_wrapper select {
	min-height: 48px !important;
	height: auto !important;
	line-height: 1.4 !important;
	padding-top: 12px !important;
	padding-bottom: 12px !important;
	padding-right: 36px !important;
}

/* Dark-variant placeholder + select-value overrides — keep cream tone on dark
   cards and bump opacity so they read against the dark background. */
.gform_wrapper.rdw-form-dark-glass_wrapper :where(input, select, textarea)::placeholder,
.gform_wrapper.rdw-form-partners_wrapper   :where(input, select, textarea)::placeholder,
.gform_wrapper.rdw-form-ppc_wrapper        :where(input, select, textarea)::placeholder {
	color: rgba(245, 243, 238, 0.78) !important;
	opacity: 1 !important;
}
.gform_wrapper.rdw-form-dark-glass_wrapper select:invalid,
.gform_wrapper.rdw-form-dark-glass_wrapper select option[value=""],
.gform_wrapper.rdw-form-partners_wrapper select:invalid,
.gform_wrapper.rdw-form-partners_wrapper select option[value=""],
.gform_wrapper.rdw-form-ppc_wrapper select:invalid,
.gform_wrapper.rdw-form-ppc_wrapper select option[value=""] {
	color: rgba(245, 243, 238, 0.78) !important;
}

/* Hide GF's auto-rendered title/description — our pages supply their own
   heading, so duplicates would look messy. */
.gform_wrapper .gform_heading,
.gform_wrapper .gform_title,
.gform_wrapper .gform_description {
	display: none;
}

/* 12-column grid container. Per-field width modifiers come from GF's
   Appearance → Field Width picker. */
/* Match Orbital's default 24px row-gap (was overridden to 6px which felt too
   cramped). High-specificity selector + !important to beat any per-form
   inline style block from GF. */
.gform_wrapper .gform_fields,
.gform_wrapper.gform-theme .gform_fields,
.gform-theme--foundation .gform_fields,
.gform-theme--framework .gform_fields {
	display: grid !important;
	grid-template-columns: repeat(12, 1fr) !important;
	row-gap: 18px !important;
	column-gap: 12px !important;
	margin: 0 !important;
	padding: 0 !important;
	list-style: none !important;
}
.gform_wrapper .gfield {
	margin: 0 !important;
	padding: 0 !important;
	grid-column: span 12;
	--gf-label-space-y-md-secondary: 4px !important;
	--gf-label-space-y-secondary: 4px !important;
}
.gform_wrapper .gfield_label {
	margin-bottom: 4px !important;
}
.gform_wrapper .gfield--width-third      { grid-column: span 4; }
.gform_wrapper .gfield--width-half       { grid-column: span 6; }
.gform_wrapper .gfield--width-two-thirds { grid-column: span 8; }
.gform_wrapper .gfield--width-full       { grid-column: span 12; }

@media (max-width: 640px) {
	.gform_wrapper .gfield--width-third,
	.gform_wrapper .gfield--width-half,
	.gform_wrapper .gfield--width-two-thirds {
		grid-column: span 12;
	}
}

.gform_wrapper .gfield_required { color: var(--accent, #d24a16); margin-left: 3px; }

.gform_wrapper .gform_footer {
	margin-top: 18px;
	padding: 0;
}

/* Validation + confirmation states — Orbital doesn't tokenise these. */
.gform_wrapper .gform_validation_errors {
	background: #fff5ed;
	border: 1px solid #f1c2a8;
	color: #b3261e;
	padding: 14px 16px;
	border-radius: 10px;
	margin-bottom: 16px;
	font-size: 13.5px;
}
.gform_wrapper .validation_message,
.gform_wrapper .gfield_validation_message {
	color: #b3261e;
	font-size: 12.5px;
	margin-top: 6px;
}
.gform_confirmation_wrapper .gform_confirmation_message {
	padding: 22px 24px;
	background: #ecfae6;
	border: 1px solid #97c69d;
	border-radius: 12px;
	color: #0d4716;
	font-size: 15px;
	line-height: 1.55;
}

/* Honeypot — visually hidden but focusable. */
.gform_wrapper .gform_validation_container,
.gform_wrapper .gfield_visibility_hidden {
	position: absolute !important;
	left: -9999px;
	width: 1px;
	height: 1px;
	overflow: hidden;
}

/* ============================================================
 * Variant 1 — Dark glass card
 * Translucent inputs over dark .form-card sections, accent-orange focus.
 * Used on every "Get a proposal" form, industry hubs, B2B service pages.
 * Add CSS class to the GF: rdw-form-dark-glass
 * ============================================================ */

.gform_wrapper.rdw-form-dark-glass_wrapper {
	--gf-ctrl-bg-color: rgba(255, 255, 255, 0.04) !important;
	--gf-ctrl-bg-color-focus: rgba(255, 255, 255, 0.07) !important;
	--gf-ctrl-color: var(--paper, #f5f3ee) !important;
	--gf-ctrl-color-placeholder: rgba(245, 243, 238, 0.65) !important;
	--gf-ctrl-border-color: var(--line-light, rgba(245, 243, 238, 0.12)) !important;
	--gf-ctrl-border-color-hover: rgba(245, 243, 238, 0.2) !important;
	--gf-ctrl-border-color-focus: var(--accent, #d24a16) !important;
	--gf-ctrl-shadow-focus: none !important;
	--gf-ctrl-label-color-primary: rgba(245, 243, 238, 0.92) !important;
	--gf-ctrl-label-color-secondary: rgba(245, 243, 238, 0.72) !important;
	--gf-label-color-primary: rgba(245, 243, 238, 0.92) !important;
	--gf-label-color-secondary: rgba(245, 243, 238, 0.72) !important;
	--gf-ctrl-choice-color: var(--muted-light-2, rgba(245, 243, 238, 0.7)) !important;
	--gf-ctrl-choice-bg-color: rgba(255, 255, 255, 0.06) !important;
	--gf-ctrl-choice-border-color: rgba(245, 243, 238, 0.2) !important;
}
/* Native <option>s render in browser chrome and are not tokenised. */
.gform_wrapper.rdw-form-dark-glass_wrapper select option {
	background: var(--ink, #0a0a0a);
	color: var(--paper, #f5f3ee);
}

/* ============================================================
 * Variant 2 — Light card on paper background  (DEFAULT — no class needed)
 * Used inside <div class="form-page-card"> on paper bg.
 * Add CSS class to the GF: rdw-form-light
 * ============================================================ */

.gform_wrapper.rdw-form-light_wrapper {
	/* No-op — base tokens already match. Class exists for marker clarity so a
	   marketer can see "this form intentionally uses the light variant". */
}

/* ============================================================
 * Variant 3 — Partners apply card
 * Semi-dark inputs over deep partners section, slightly denser typography.
 * Add CSS class to the GF: rdw-form-partners
 * ============================================================ */

.gform_wrapper.rdw-form-partners_wrapper {
	--gf-ctrl-bg-color: rgba(0, 0, 0, 0.25) !important;
	--gf-ctrl-bg-color-focus: rgba(0, 0, 0, 0.4) !important;
	--gf-ctrl-color: var(--paper, #f5f3ee) !important;
	--gf-ctrl-color-placeholder: rgba(245, 243, 238, 0.65) !important;
	--gf-ctrl-border-color: var(--line-light, rgba(245, 243, 238, 0.12)) !important;
	--gf-ctrl-border-color-focus: var(--accent, #d24a16) !important;
	--gf-ctrl-padding-y: 13px !important;
	--gf-ctrl-padding-x: 14px !important;
	--gf-ctrl-shadow-focus: none !important;
	--gf-ctrl-label-color-primary: rgba(245, 243, 238, 0.92) !important;
	--gf-ctrl-label-color-secondary: rgba(245, 243, 238, 0.72) !important;
	--gf-label-color-primary: rgba(245, 243, 238, 0.92) !important;
	--gf-label-font-size-md: 12px !important;
	--gf-ctrl-choice-color: var(--muted-light, rgba(245, 243, 238, 0.85)) !important;
	--gf-ctrl-choice-bg-color: rgba(0, 0, 0, 0.25) !important;
	--gf-ctrl-choice-border-color: rgba(245, 243, 238, 0.18) !important;
}
.gform_wrapper.rdw-form-partners_wrapper select option {
	background: var(--ink, #0a0a0a);
	color: var(--paper, #f5f3ee);
}
.gform_wrapper.rdw-form-partners_wrapper textarea {
	min-height: 96px;
}

/* ============================================================
 * Variant 4 — News press-subscribe card
 * Single column, paper-coloured inputs on white card.
 * Add CSS class to the GF: rdw-form-news
 * ============================================================ */

.gform_wrapper.rdw-form-news_wrapper {
	--gf-ctrl-bg-color: var(--paper, #f5f3ee) !important;
	--gf-ctrl-bg-color-focus: var(--paper, #f5f3ee) !important;
	--gf-ctrl-padding-y: 13px !important;
	--gf-ctrl-padding-x: 16px !important;
	--gf-ctrl-border-color-focus: var(--ink, #0a0a0a) !important;
	--gf-ctrl-shadow-focus: none !important;
}
.gform_wrapper.rdw-form-news_wrapper .gform_fields {
	grid-template-columns: 1fr;
	gap: 14px;
}
.gform_wrapper.rdw-form-news_wrapper .gfield {
	grid-column: span 1;
}

/* ============================================================
 * Variant 5 — Inline newsletter (email + button on one row)
 * Pill input flush against pill submit button on the right.
 * Add CSS class to the GF: rdw-form-newsletter
 * ============================================================ */

.gform_wrapper.rdw-form-newsletter_wrapper {
	display: block;
	--gf-ctrl-radius: 999px !important;
	--gf-ctrl-padding-y: 12px !important;
	--gf-ctrl-padding-x: 18px !important;
	--gf-ctrl-font-size: 14px !important;
	--gf-ctrl-btn-padding-y: 12px !important;
	--gf-ctrl-btn-padding-x: 22px !important;
	--gf-ctrl-btn-font-size: 13.5px !important;
}
.gform_wrapper.rdw-form-newsletter_wrapper form {
	display: flex;
	gap: 8px;
	align-items: stretch;
}
.gform_wrapper.rdw-form-newsletter_wrapper .gform_body {
	flex: 1;
	min-width: 0;
}
.gform_wrapper.rdw-form-newsletter_wrapper .gform_fields {
	gap: 0;
	grid-template-columns: 1fr;
}
.gform_wrapper.rdw-form-newsletter_wrapper .gfield {
	grid-column: span 1;
}
.gform_wrapper.rdw-form-newsletter_wrapper .gfield_label {
	display: none;
}
.gform_wrapper.rdw-form-newsletter_wrapper .gform_footer {
	margin: 0;
	flex-shrink: 0;
}
.gform_wrapper.rdw-form-newsletter_wrapper .gform_button {
	white-space: nowrap;
}

/* ============================================================
 * Variant 6 — PPC landing application card
 * Dark inputs on solid ink card, full-width submit, larger conversion type.
 * Add CSS class to the GF: rdw-form-ppc
 * ============================================================ */

.gform_wrapper.rdw-form-ppc_wrapper {
	--gf-ctrl-bg-color: rgba(245, 243, 238, 0.06) !important;
	--gf-ctrl-bg-color-focus: rgba(245, 243, 238, 0.1) !important;
	--gf-ctrl-color: var(--paper, #f5f3ee) !important;
	--gf-ctrl-color-placeholder: rgba(245, 243, 238, 0.72) !important;
	--gf-ctrl-border-color: rgba(245, 243, 238, 0.18) !important;
	--gf-ctrl-border-color-focus: var(--accent, #d24a16) !important;
	--gf-ctrl-padding-y: 13px !important;
	--gf-ctrl-padding-x: 14px !important;
	--gf-ctrl-font-size: 15px !important;
	--gf-ctrl-shadow-focus: none !important;
	--gf-ctrl-label-color-primary: rgba(245, 243, 238, 0.92) !important;
	--gf-ctrl-label-color-secondary: rgba(245, 243, 238, 0.72) !important;
	--gf-label-color-primary: rgba(245, 243, 238, 0.92) !important;
	--gf-label-font-size-md: 12px !important;
	--gf-ctrl-choice-color: rgba(245, 243, 238, 0.7) !important;
	--gf-ctrl-choice-bg-color: rgba(245, 243, 238, 0.06) !important;
	--gf-ctrl-choice-border-color: rgba(245, 243, 238, 0.2) !important;
	--gf-ctrl-btn-padding-y: 16px !important;
	--gf-ctrl-btn-padding-x: 24px !important;
	--gf-ctrl-btn-font-size: 15.5px !important;
}
.gform_wrapper.rdw-form-ppc_wrapper .gform_footer .gform_button {
	width: 100%;
}
/* Belt-and-suspenders: direct typography on field labels — beats Orbital's
   per-form inline style block AND ensures we override regardless of which
   token names a future GF release reads. */
.gform_wrapper .gform-field-label,
.gform_wrapper legend.gfield_label {
	font-family: var(--sans, 'Inter Tight', system-ui, sans-serif) !important;
	font-size: 13px !important;
	font-weight: 500 !important;
	letter-spacing: 0 !important;
	text-transform: none !important;
	line-height: 1.4 !important;
	color: #0a0a0a !important;
}
.gform_wrapper .gform-field-label--type-sub {
	font-size: 12px !important;
	color: #6b6b6b !important;
}
.gform_wrapper.rdw-form-ppc_wrapper .gform-field-label,
.gform_wrapper.rdw-form-ppc_wrapper legend.gfield_label,
.gform_wrapper.rdw-form-dark-glass_wrapper .gform-field-label,
.gform_wrapper.rdw-form-dark-glass_wrapper legend.gfield_label,
.gform_wrapper.rdw-form-partners_wrapper .gform-field-label,
.gform_wrapper.rdw-form-partners_wrapper legend.gfield_label {
	color: rgba(245, 243, 238, 0.92) !important;
}
.gform_wrapper.rdw-form-ppc_wrapper .gform-field-label--type-sub,
.gform_wrapper.rdw-form-dark-glass_wrapper .gform-field-label--type-sub,
.gform_wrapper.rdw-form-partners_wrapper .gform-field-label--type-sub {
	color: rgba(245, 243, 238, 0.72) !important;
}
.gform_wrapper.rdw-form-ppc_wrapper select option {
	background: var(--ink, #0a0a0a);
	color: var(--paper, #f5f3ee);
}

/* ============================================================
 * Container alignment helpers — when a Gravity Form replaces a static <form>
 * inside a static .form-card / .form-page-card / .apply-form / .dist-form
 * container, these tweaks keep spacing consistent with the surrounding card
 * chrome the static templates already define.
 * ============================================================ */

.form-card .gform_wrapper,
.form-page-card .gform_wrapper,
.apply-form .gform_wrapper,
.dist-form .gform_wrapper {
	margin: 0;
}
.form-card .gform_wrapper form,
.form-page-card .gform_wrapper form,
.apply-form .gform_wrapper form,
.dist-form .gform_wrapper form {
	margin: 0;
}