/**
 * MLTK HubSpot updated-form presentation.
 *
 * The outer component is owned by the child theme. The embedded form is styled
 * exclusively through HubSpot's documented `--hsf-*` custom properties; no
 * generated HubSpot class name or DOM structure is treated as an interface.
 */

@layer hubspot {
	body.mltk-site .mltk-hubspot-form {
		--hsf-global__font-family: var(--mltk-font-body);
		--hsf-global__font-size: var(--mltk-text-base);
		--hsf-global__color: var(--mltk-color-ink);
		--hsf-global-error__color: var(--mltk-color-error);
		--hsf-row__horizontal-spacing: var(--mltk-space-2);
		--hsf-row__vertical-spacing: var(--mltk-space-2);
		--hsf-module__vertical-spacing: var(--mltk-space-3);
		--hsf-button__font-family: var(--mltk-font-body);
		--hsf-button__font-size: var(--mltk-text-base);
		--hsf-button__color: var(--mltk-color-accent-ink);
		--hsf-button__background-color: var(--mltk-color-accent);
		--hsf-button__background-image: none;
		--hsf-button__border-radius: var(--mltk-radius-sm);
		--hsf-button__padding: 0.875rem 1.5rem;
		--hsf-button__box-shadow: 0 0.25rem 0.75rem rgb(37 26 0 / 18%);
		--hsf-richtext__font-family: var(--mltk-font-body);
		--hsf-richtext__font-size: var(--mltk-text-sm);
		--hsf-richtext__color: var(--mltk-color-ink-muted);
		--hsf-heading__font-family: var(--mltk-font-display);
		--hsf-heading__color: var(--mltk-color-primary);
		--hsf-heading__text-shadow: none;
		--hsf-background__background-color: transparent;
		--hsf-background__background-image: none;
		--hsf-background__background-size: auto;
		--hsf-background__background-position: center;
		--hsf-background__background-repeat: no-repeat;
		--hsf-background__border-style: none;
		--hsf-background__border-color: transparent;
		--hsf-background__border-radius: 0;
		--hsf-background__border-width: 0;
		--hsf-background__padding: 0;
		--hsf-progressbar-text__font-family: var(--mltk-font-body);
		--hsf-progressbar-text__font-size: var(--mltk-text-sm);
		--hsf-progressbar-text__color: var(--mltk-color-primary);
		--hsf-progressbar-progressLine__background-color: var(
			--mltk-color-primary
		);
		--hsf-progressbar-progressLine__background-image: none;
		--hsf-progressbar-progressLine__border-color: var(
			--mltk-color-primary
		);
		--hsf-progressbar-progressLine__border-style: solid;
		--hsf-progressbar-progressLine__border-width: 0.0625rem;
		--hsf-progressbar-trackLine__background-color: var(
			--mltk-color-border-soft
		);
		--hsf-erroralert__font-family: var(--mltk-font-body);
		--hsf-erroralert__font-size: var(--mltk-text-sm);
		--hsf-erroralert__color: var(--mltk-color-error);
		--hsf-infoalert__font-family: var(--mltk-font-body);
		--hsf-infoalert__font-size: var(--mltk-text-sm);
		--hsf-infoalert__color: var(--mltk-color-primary);
		--hsf-field-label__font-family: var(--mltk-font-body);
		--hsf-field-label__font-size: var(--mltk-text-sm);
		--hsf-field-label__color: var(--mltk-color-ink);
		--hsf-field-label-requiredindicator__color: var(--mltk-color-error);
		--hsf-field-description__font-family: var(--mltk-font-body);
		--hsf-field-description__color: var(--mltk-color-ink-muted);
		--hsf-field-footer__font-family: var(--mltk-font-body);
		--hsf-field-footer__color: var(--mltk-color-ink-muted);
		--hsf-field-input__font-family: var(--mltk-font-body);
		--hsf-field-input__color: var(--mltk-color-ink);
		--hsf-field-input__background-color: var(--mltk-color-surface-raised);
		--hsf-field-input__placeholder-color: #5a6255;
		--hsf-field-input__border-color: var(--mltk-color-border);
		--hsf-field-input__border-width: 0.125rem;
		--hsf-field-input__border-style: solid;
		--hsf-field-input__border-radius: var(--mltk-radius-sm);
		--hsf-field-input__padding: 0.75rem 0.875rem;
		--hsf-field-textarea__font-family: var(--mltk-font-body);
		--hsf-field-textarea__color: var(--mltk-color-ink);
		--hsf-field-textarea__background-color: var(--mltk-color-surface-raised);
		--hsf-field-textarea__placeholder-color: #5a6255;
		--hsf-field-textarea__border-color: var(--mltk-color-border);
		--hsf-field-textarea__border-width: 0.125rem;
		--hsf-field-textarea__border-style: solid;
		--hsf-field-textarea__border-radius: var(--mltk-radius-sm);
		--hsf-field-textarea__padding: 0.75rem 0.875rem;
		--hsf-field-checkbox__padding: 0.25rem;
		--hsf-field-checkbox__background-color: var(
			--mltk-color-surface-raised
		);
		--hsf-field-checkbox__color: var(--mltk-color-primary);
		--hsf-field-checkbox__border-color: var(--mltk-color-border);
		--hsf-field-checkbox__border-width: 0.125rem;
		--hsf-field-checkbox__border-style: solid;
		--hsf-field-radio__padding: 0.25rem;
		--hsf-field-radio__background-color: var(--mltk-color-surface-raised);
		--hsf-field-radio__color: var(--mltk-color-primary);
		--hsf-field-radio__border-color: var(--mltk-color-border);
		--hsf-field-radio__border-width: 0.125rem;
		--hsf-field-radio__border-style: solid;

		background: var(--mltk-color-surface-raised);
		border: 0.0625rem solid var(--mltk-color-border-soft);
		border-radius: clamp(1rem, 0.8rem + 0.8vw, 1.75rem);
		box-shadow: inset 0 0 0 0.0625rem rgb(255 255 255 / 30%), var(--mltk-shadow-lg);
		display: grid;
		grid-template-columns: minmax(0, 0.9fr) minmax(22rem, 1.1fr);
		inline-size: min(100%, var(--mltk-container));
		isolation: isolate;
		margin-inline: auto;
		position: relative;
	}

	body.mltk-site .mltk-hubspot-form::before {
		background: var(--mltk-gradient-foil);
		block-size: 0.375rem;
		border-radius: 999px;
		content: "";
		inset-block-start: -0.1875rem;
		inset-inline: clamp(1rem, 4vw, 4rem);
		position: absolute;
		z-index: 2;
	}

	body.mltk-site .mltk-hubspot-form__intro,
	body.mltk-site .mltk-hubspot-form__panel {
		min-inline-size: 0;
		padding: clamp(1.5rem, 0.9rem + 2.4vw, 3.75rem);
	}

	body.mltk-site .mltk-hubspot-form__intro {
		align-content: center;
		background:
			radial-gradient(
				circle at 15% 10%,
				rgb(188 240 174 / 18%),
				transparent 42%
			),
			linear-gradient(
				145deg,
				var(--mltk-color-hero-surface),
				var(--mltk-color-primary-hover)
			);
		border-radius: clamp(0.9375rem, 0.75rem + 0.8vw, 1.6875rem) 0 0
			clamp(0.9375rem, 0.75rem + 0.8vw, 1.6875rem);
		color: var(--mltk-color-hero-ink);
		display: grid;
		position: relative;
	}

	body.mltk-site .mltk-hubspot-form__eyebrow {
		background: rgb(255 255 255 / 10%);
		backdrop-filter: blur(10px);
		-webkit-backdrop-filter: blur(10px);
		border: 0.0625rem solid rgb(255 255 255 / 22%);
		border-radius: 999px;
		color: var(--mltk-color-accent);
		display: inline-block;
		font-size: var(--mltk-text-xs);
		font-weight: 800;
		letter-spacing: 0.11em;
		margin-block-end: var(--mltk-space-2);
		padding: 0.4rem 1rem;
		text-transform: uppercase;
	}

	@media (forced-colors: active) {
		body.mltk-site .mltk-hubspot-form__eyebrow {
			backdrop-filter: none;
			background: Canvas;
			border-color: CanvasText;
		}
	}

	body.mltk-site .mltk-hubspot-form__title {
		color: var(--mltk-color-hero-ink);
		font-size: clamp(2rem, 1.55rem + 1.8vw, 3.375rem);
		margin-block-end: var(--mltk-space-3);
		max-inline-size: 13ch;
	}

	body.mltk-site .mltk-hubspot-form__lead {
		color: var(--mltk-color-hero-sub);
		font-size: var(--mltk-text-lead);
		margin-block-end: var(--mltk-space-4);
		max-inline-size: 37ch;
	}

	body.mltk-site .mltk-hubspot-form__assurances {
		display: grid;
		gap: var(--mltk-space-2);
		list-style: none;
		margin: 0;
		padding: 0;
	}

	body.mltk-site .mltk-hubspot-form__assurances li {
		align-items: start;
		color: var(--mltk-color-hero-ink);
		display: grid;
		font-size: var(--mltk-text-sm);
		gap: 0.75rem;
		grid-template-columns: 1.5rem minmax(0, 1fr);
	}

	body.mltk-site .mltk-hubspot-form__assurances li::before {
		align-items: center;
		background: var(--mltk-color-accent);
		block-size: 1.5rem;
		border-radius: 999px;
		color: var(--mltk-color-accent-ink);
		content: "✓";
		display: inline-flex;
		font-size: 0.875rem;
		font-weight: 900;
		inline-size: 1.5rem;
		justify-content: center;
		margin-block-start: 0.125rem;
	}

	body.mltk-site .mltk-hubspot-form__panel {
		align-content: start;
		background:
			linear-gradient(180deg, rgb(255 255 255 / 92%), transparent 28%),
			linear-gradient(160deg, rgb(255 255 255 / 97%), rgb(255 255 255 / 88%));
		backdrop-filter: blur(8px);
		-webkit-backdrop-filter: blur(8px);
		border-radius: 0 clamp(0.9375rem, 0.75rem + 0.8vw, 1.6875rem)
			clamp(0.9375rem, 0.75rem + 0.8vw, 1.6875rem) 0;
		display: grid;
	}

	@media (forced-colors: active) {
		body.mltk-site .mltk-hubspot-form__panel {
			backdrop-filter: none;
		}
	}

	body.mltk-site .mltk-hubspot-form__panel-heading {
		font-size: clamp(1.625rem, 1.4rem + 0.8vw, 2.25rem);
		margin-block-end: var(--mltk-space-1);
	}

	body.mltk-site .mltk-hubspot-form__panel-intro {
		color: var(--mltk-color-ink-muted);
		font-size: var(--mltk-text-sm);
		margin-block-end: var(--mltk-space-3);
	}

	body.mltk-site .mltk-hubspot-form__embed {
		min-block-size: 12rem;
		min-inline-size: 0;
		position: relative;
	}

	body.mltk-site .mltk-hubspot-direct-form {
		display: grid;
		gap: var(--mltk-space-3);
	}

	body.mltk-site .mltk-hubspot-direct-form__grid {
		display: grid;
		gap: var(--mltk-space-3);
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}

	body.mltk-site .mltk-field {
		display: grid;
		gap: 0.45rem;
		margin: 0;
		position: relative;
	}

	body.mltk-site .mltk-field--wide {
		grid-column: 1 / -1;
	}

	body.mltk-site .mltk-field--trap {
		block-size: 1px;
		clip-path: inset(50%);
		inline-size: 1px;
		margin: 0;
		opacity: 0;
		position: absolute;
		white-space: nowrap;
	}

	body.mltk-site .mltk-field label {
		color: var(--mltk-color-ink);
		font-size: var(--mltk-text-sm);
		font-weight: 760;
	}

	body.mltk-site .mltk-field label span {
		color: var(--mltk-color-error);
	}

	body.mltk-site .mltk-field :where(input, select, textarea) {
		background: var(--mltk-color-surface-raised);
		border: 0.125rem solid var(--mltk-color-border);
		border-radius: var(--mltk-radius-sm);
		color: var(--mltk-color-ink);
		font: inherit;
		inline-size: 100%;
		min-block-size: 3rem;
		padding: 0.75rem 0.875rem;
		transition:
			background-color var(--mltk-motion-fast) ease,
			border-color var(--mltk-motion-fast) ease,
			box-shadow var(--mltk-motion-fast) ease;
	}

	body.mltk-site .mltk-field textarea {
		min-block-size: 9rem;
		resize: vertical;
	}

	body.mltk-site .mltk-field :where(input, select, textarea):hover {
		border-color: color-mix(
			in srgb,
			var(--mltk-color-primary) 44%,
			var(--mltk-color-border)
		);
	}

	body.mltk-site .mltk-field :where(input, select, textarea):user-invalid {
		background: var(--mltk-color-error-soft);
		border-color: var(--mltk-color-error);
	}

	body.mltk-site .mltk-field :where(input, select, textarea):focus-visible {
		box-shadow: var(--mltk-focus-ring);
		outline: 0.125rem solid transparent;
	}

	body.mltk-site .mltk-hubspot-form__privacy {
		color: var(--mltk-color-ink-muted);
		font-size: var(--mltk-text-sm);
		margin: 0;
	}

	body.mltk-site .mltk-hubspot-form__actions {
		align-items: center;
		display: flex;
		flex-wrap: wrap;
		gap: var(--mltk-space-2);
	}

	body.mltk-site .mltk-hubspot-form__actions .mltk-button {
		box-shadow:
			0 0.75rem 1.5rem rgb(37 26 0 / 18%),
			inset 0 0.0625rem 0 rgb(255 255 255 / 38%);
	}

	body.mltk-site .mltk-hubspot-form__actions .mltk-button:disabled {
		cursor: progress;
		opacity: 0.72;
		transform: none;
	}

	body.mltk-site .mltk-hubspot-form__loading,
	body.mltk-site .mltk-hubspot-form__success,
	body.mltk-site .mltk-hubspot-form__failed,
	body.mltk-site .mltk-hubspot-form__unavailable {
		align-items: center;
		border-inline-start: 0.25rem solid currentColor;
		display: none;
		font-size: var(--mltk-text-sm);
		gap: 0.75rem;
		margin-block: var(--mltk-space-2);
		padding: var(--mltk-space-2);
	}

	body.mltk-site
		.mltk-hubspot-form[data-hubspot-form-state="submitting"]
		.mltk-hubspot-form__loading {
		background: var(--mltk-color-surface-soft);
		color: var(--mltk-color-primary);
		display: flex;
	}

	body.mltk-site
		.mltk-hubspot-form[data-hubspot-form-state="success"]
		.mltk-hubspot-form__success {
		background: rgb(188 240 174 / 24%);
		color: var(--mltk-color-primary);
		display: flex;
	}

	body.mltk-site
		.mltk-hubspot-form[data-hubspot-form-state="failed"]
		.mltk-hubspot-form__failed {
		background: var(--mltk-color-error-soft);
		color: var(--mltk-color-error);
		display: flex;
	}

	body.mltk-site
		.mltk-hubspot-form[data-hubspot-form-state="unavailable"]
		.mltk-hubspot-form__unavailable {
		background: var(--mltk-color-error-soft);
		color: var(--mltk-color-error);
		display: flex;
	}

	body.mltk-site .mltk-hubspot-form__loading::before {
		animation: mltk-hubspot-loading 900ms linear infinite;
		block-size: 1.25rem;
		border: 0.1875rem solid var(--mltk-color-border-soft);
		border-block-start-color: var(--mltk-color-primary);
		border-radius: 50%;
		content: "";
		flex: 0 0 auto;
		inline-size: 1.25rem;
	}

	body.mltk-site .mltk-hubspot-form__fallback {
		border-block-start: 0.0625rem solid var(--mltk-color-border-soft);
		color: var(--mltk-color-ink-muted);
		font-size: var(--mltk-text-sm);
		margin-block-start: var(--mltk-space-4);
		padding-block-start: var(--mltk-space-3);
	}

	body.mltk-site .mltk-hubspot-form__fallback p {
		margin-block-end: var(--mltk-space-1);
	}

	body.mltk-site .mltk-hubspot-form__fallback-links {
		display: flex;
		flex-wrap: wrap;
		gap: var(--mltk-space-1) var(--mltk-space-3);
	}

	body.mltk-site .mltk-hubspot-form__fallback a {
		font-weight: 750;
	}

	body.mltk-site .mltk-hubspot-form__fallback a:focus-visible {
		border-radius: 0.125rem;
		box-shadow: var(--mltk-focus-ring);
		outline: 0.125rem solid transparent;
	}

	@keyframes mltk-hubspot-loading {
		to {
			transform: rotate(1turn);
		}
	}

	@media (max-width: 55rem) {
		body.mltk-site .mltk-hubspot-form {
			grid-template-columns: minmax(0, 1fr);
		}

		body.mltk-site .mltk-hubspot-form__intro {
			border-radius: clamp(0.9375rem, 0.75rem + 0.8vw, 1.6875rem)
				clamp(0.9375rem, 0.75rem + 0.8vw, 1.6875rem) 0 0;
		}

		body.mltk-site .mltk-hubspot-form__title,
		body.mltk-site .mltk-hubspot-form__lead {
			max-inline-size: 30ch;
		}

		body.mltk-site .mltk-hubspot-form__panel {
			border-radius: 0 0
				clamp(0.9375rem, 0.75rem + 0.8vw, 1.6875rem)
				clamp(0.9375rem, 0.75rem + 0.8vw, 1.6875rem);
		}
	}

	@media (max-width: 30rem) {
		body.mltk-site .mltk-hubspot-form__intro,
		body.mltk-site .mltk-hubspot-form__panel {
			padding: var(--mltk-space-4) var(--mltk-space-3);
		}

		body.mltk-site .mltk-hubspot-form__fallback-links {
			align-items: stretch;
			flex-direction: column;
		}

		body.mltk-site .mltk-hubspot-direct-form__grid {
			grid-template-columns: minmax(0, 1fr);
		}

		body.mltk-site .mltk-hubspot-form__fallback a {
			align-items: center;
			display: inline-flex;
			min-block-size: 3rem;
		}

		body.mltk-site .mltk-hubspot-form__actions .mltk-button {
			inline-size: 100%;
			justify-content: center;
		}
	}

	@media (prefers-reduced-motion: reduce) {
		body.mltk-site .mltk-field :where(input, select, textarea) {
			transition: none;
		}

		body.mltk-site .mltk-hubspot-form__loading::before {
			animation: none;
		}
	}

	@media (forced-colors: active) {
		body.mltk-site .mltk-hubspot-form,
		body.mltk-site .mltk-hubspot-form__intro,
		body.mltk-site .mltk-hubspot-form__panel {
			background: Canvas;
			border-color: CanvasText;
			box-shadow: none;
			color: CanvasText;
			forced-color-adjust: auto;
		}

		body.mltk-site .mltk-hubspot-form::before {
			background: Highlight;
		}

		body.mltk-site
			:where(
				.mltk-hubspot-form__title,
				.mltk-hubspot-form__lead,
				.mltk-hubspot-form__eyebrow,
				.mltk-hubspot-form__assurances li
			) {
			color: CanvasText;
		}

		body.mltk-site .mltk-hubspot-form__assurances li::before {
			background: Canvas;
			border: 0.125rem solid CanvasText;
			color: CanvasText;
		}

		body.mltk-site
			:where(
				.mltk-hubspot-form__loading,
				.mltk-hubspot-form__success,
				.mltk-hubspot-form__failed,
				.mltk-hubspot-form__unavailable
			) {
			background: Canvas;
			color: CanvasText;
		}

		body.mltk-site .mltk-hubspot-form__loading::before {
			border-color: CanvasText;
			border-block-start-color: Highlight;
		}

		body.mltk-site .mltk-hubspot-form__fallback a:focus-visible {
			box-shadow: none;
			outline: 0.1875rem solid Highlight;
		}
	}
}
