.tf-contact,
.tf-contact-footer {
  --tf-ink: #101b48;
  --tf-muted: #596681;
  --tf-navy: #103956;
  --tf-orange: #ff651f;
  --tf-orange-text: #b5440c;
  --tf-button: #c64709;
  --tf-button-hover: #a83908;
  --tf-pale: #edf9ff;
  --tf-line: #dbe8ee;
  --tf-focus: #176bac;
  --tf-error: #ab2323;
  color: var(--tf-ink);
  background: #fff;
  font-family: "TransFlow Roboto", Arial, sans-serif;
  font-size: 15px;
  line-height: 1.5;
  text-align: start;
  -webkit-text-size-adjust: 100%;
  text-size-adjust: 100%;
}

.tf-contact *,
.tf-contact *::before,
.tf-contact *::after,
.tf-contact-footer *,
.tf-contact-footer *::before,
.tf-contact-footer *::after { box-sizing: border-box; }

.tf-contact [hidden],
.tf-contact-footer [hidden] { display: none !important; }

.tf-contact :where(h2, h3, p, ul, ol, fieldset),
.tf-contact-footer :where(h2, p, ul) { margin: 0; }

.tf-contact :where(h2, h3),
.tf-contact-footer h2 { color: inherit; font-family: inherit; }

.tf-contact h2 {
  font-size: clamp(1.5rem, 1.06rem + 1.45vw, 2.125rem);
  font-weight: 750;
  line-height: 1.14;
  letter-spacing: -0.025em;
  text-wrap: balance;
}

.tf-contact h3 { font-size: 1rem; font-weight: 700; line-height: 1.35; }
.tf-contact p { color: var(--tf-muted); }
.tf-contact a { color: var(--tf-orange-text); text-underline-offset: 3px; }
.tf-contact a:hover { text-decoration-thickness: 2px; }
.tf-contact :where(a, button, input, select, textarea, summary):focus-visible,
.tf-contact-footer a:focus-visible { outline: 3px solid var(--tf-focus); outline-offset: 4px; }

.tf-contact__container { width: min(90%, 1200px); margin-inline: auto; }
.tf-contact__icon { display: inline-block; flex: 0 0 auto; vertical-align: middle; }
.tf-contact__sr-only {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip-path: inset(50%);
  white-space: nowrap;
  border: 0;
}

.tf-contact__intro { padding-block: 32px; background: var(--tf-pale); }
.tf-contact__intro-grid { display: grid; grid-template-columns: minmax(0, 0.71fr) minmax(0, 1fr); gap: 28px; align-items: start; }
.tf-contact__intro-grid > *,
.tf-contact__fields-grid > *,
.tf-contact__topic-grid > * { min-width: 0; }
.tf-contact__guidance h2 { max-width: none; }
.tf-contact__lead { margin-block-start: 10px !important; font-size: 1.0625rem; line-height: 1.5; }

.tf-contact__benefits { display: grid; gap: 22px; padding: 0; margin-block: 20px 26px !important; list-style: none; }
.tf-contact__benefits li { display: grid; grid-template-columns: 64px minmax(0, 1fr); gap: 16px; align-items: start; }
.tf-contact__benefits h3 { margin-block: 4px 3px; }
.tf-contact__benefits p { line-height: 1.4; }
.tf-contact__benefit-icon,
.tf-contact__email-icon { display: grid; place-items: center; width: 64px; height: 64px; border-radius: 50%; color: var(--tf-orange); background: #d8f0fe; }
.tf-contact__benefit-icon svg,
.tf-contact__email-icon svg { width: 36px; height: 36px; }
.tf-contact__team-photo { display: block; width: 100%; height: auto; aspect-ratio: 1561 / 1007; object-fit: cover; border-radius: 4px; }
.tf-contact__email-card { display: grid; grid-template-columns: 64px minmax(0, 1fr); gap: 16px; align-items: center; margin-block-start: 12px; padding: 16px; border-radius: 4px; background: #fff; }
.tf-contact__email-icon { background: #fff0e8; }
.tf-contact__email-card h3 { font-size: 1.125rem; }
.tf-contact__email-card p { margin-block: 2px; font-size: .875rem; }
.tf-contact__email-card a { display: inline-block; padding-block: 3px; font-weight: 650; overflow-wrap: anywhere; }

.tf-contact__form-card { padding: clamp(18px, 2.3vw, 28px); border: 1px solid var(--tf-line); border-radius: 5px; background: #fff; box-shadow: 0 2px 10px rgb(16 57 86 / 2%); scroll-margin-block-start: 24px; }
.tf-contact__form-card > p { margin-block-start: 5px; font-size: .9375rem; }
.tf-contact__form-fields,
.tf-contact__topics { padding: 0; border: 0; min-inline-size: 0; }
.tf-contact__topics { margin-block: 14px 18px; }
.tf-contact__topic-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; }
.tf-contact__topic { position: relative; display: flex; align-items: center; gap: 9px; min-height: 64px; padding: 10px; border: 1px solid var(--tf-line); border-radius: 3px; cursor: pointer; }
.tf-contact__topic span { display: grid; gap: 3px; min-width: 0; }
.tf-contact__topic strong { font-size: .75rem; font-weight: 700; line-height: 1.3; }
.tf-contact__topic small { color: var(--tf-muted); font-size: .6875rem; line-height: 1.4; }
.tf-contact__topic:has(input:checked) { border-color: var(--tf-orange); background: #fff6f0; box-shadow: 0 0 0 1px rgb(255 101 31 / 8%); }
.tf-contact__topic:focus-within { outline: 3px solid var(--tf-focus); outline-offset: 3px; }
.tf-contact__topic input:focus-visible { outline: none; }

.tf-contact :where(input, select, textarea, button) { font: inherit; letter-spacing: normal; }
.tf-contact__fields-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px 20px; }
.tf-contact__full { grid-column: 1 / -1; }
.tf-contact__field > label { display: block; margin-block-end: 5px; font-size: .8125rem; font-weight: 650; line-height: 1.5; }
.tf-contact__optional { font-weight: 400; }
.tf-contact__required { color: var(--tf-orange-text); }
.tf-contact__field :where(input:not([type="checkbox"]), select, textarea) {
  display: block;
  width: 100%;
  min-width: 0;
  min-height: 40px;
  padding: 8px 11px;
  border: 1px solid #ccdce5;
  border-radius: 3px;
  color: var(--tf-ink);
  background: #fff;
  box-shadow: 0 1px 2px rgb(16 57 86 / 3%) inset;
  font-size: .875rem;
  line-height: 1.4;
}
.tf-contact__field select { padding-inline-end: 28px; }
.tf-contact__field textarea { min-height: 90px; resize: vertical; }
.tf-contact__field ::placeholder { color: #66728b; opacity: 1; }
.tf-contact__field .tf-contact__field-help { margin-block-start: 6px; color: var(--tf-muted); font-size: .8125rem; line-height: 1.4; }
.tf-contact :where(input[type="checkbox"], input[type="radio"]) { flex: 0 0 auto; width: 18px; height: 18px; margin: 0; accent-color: var(--tf-orange-text); cursor: pointer; }
.tf-contact__consent-row { display: flex; align-items: center; gap: 10px; min-height: 36px; }
.tf-contact__consent-row label { padding-block: 8px; cursor: pointer; font-size: .8125rem; }
.tf-contact__consent-row a { font-weight: 550; }
.tf-contact__field [aria-invalid="true"] { border-color: var(--tf-error); }
.tf-contact__error { display: block; margin-block-start: 5px; color: var(--tf-error); font-size: .8125rem; line-height: 1.45; overflow-wrap: anywhere; }
.tf-contact__error-summary { margin-block: 16px; padding: 14px 16px; border: 1px solid #d39a9a; border-inline-start: 4px solid var(--tf-error); border-radius: 3px; color: #711818; background: #fff5f5; }
.tf-contact__error-summary h3 { margin-block-end: 8px; }
.tf-contact__error-summary ul { padding-inline-start: 20px; }
.tf-contact__error-summary a { color: inherit; }
.tf-contact__error-summary li + li { margin-block-start: 5px; }
.tf-contact__error-summary:focus { outline: 3px solid var(--tf-focus); outline-offset: 4px; }

.tf-contact .tf-contact__button {
  display: inline-flex;
  justify-content: center;
  align-items: center;
  gap: 10px;
  min-height: 44px;
  padding: 10px 20px;
  border: 1px solid transparent;
  border-radius: 3px;
  font-size: .875rem;
  font-weight: 650;
  line-height: 1.4;
  text-align: center;
  text-decoration: none;
  cursor: pointer;
  transition: background-color 160ms ease, border-color 160ms ease;
}
.tf-contact .tf-contact__button svg { width: 19px; height: 19px; }
.tf-contact .tf-contact__button--primary { color: #fff; background: var(--tf-button); }
.tf-contact .tf-contact__button--primary:hover { background: var(--tf-button-hover); }
.tf-contact .tf-contact__button--outline { color: var(--tf-ink); background: transparent; border-color: var(--tf-ink); }
.tf-contact .tf-contact__button--outline:hover { background: #e0f0fa; }
.tf-contact .tf-contact__button--light { color: #fff; border-color: #d2e2ed; background: transparent; }
.tf-contact .tf-contact__button--light:hover { background: #244c65; }
.tf-contact .tf-contact__button:disabled { opacity: .65; cursor: not-allowed; }
.tf-contact__submit { width: 100%; margin-block-start: 8px; }
.tf-contact__reset { margin-block-start: 10px; }
.tf-contact__status,
.tf-contact__no-script { margin-block-start: 14px !important; padding: 12px 14px; border: 1px solid #b8d6e9; border-radius: 3px; color: #173f58; background: #f0f9ff; font-size: .875rem; overflow-wrap: anywhere; }
.tf-contact__status[data-state="success"] { color: #175637; border-color: #93bfa5; background: #f1faf4; }
.tf-contact__status[data-state="error"] { color: #711818; border-color: #d39a9a; background: #fff5f5; }
.tf-contact__status:focus { outline: 2px solid var(--tf-focus); outline-offset: 3px; }
.tf-contact__form-card .tf-contact__quote-note { margin-block-start: 15px; padding-block-start: 12px; border-block-start: 1px solid var(--tf-line); text-align: center; font-size: .8125rem; }
.tf-contact__quote-note a { display: inline-flex; align-items: center; gap: 5px; min-height: 28px; font-weight: 700; }
.tf-contact__quote-note svg { width: 18px; height: 18px; }

.tf-contact__next { padding-block: 24px; }
.tf-contact__next h2,
.tf-contact__tracking h2,
.tf-contact__faq h2,
.tf-contact__cta h2 { font-size: clamp(1.375rem, 1.1rem + .9vw, 1.875rem); }
.tf-contact__steps { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 40px; padding: 0; margin-block-start: 14px !important; list-style: none; }
.tf-contact__steps li { position: relative; display: flex; align-items: flex-start; gap: 20px; min-width: 0; padding: 14px; border: 1px solid var(--tf-line); border-radius: 3px; }
.tf-contact__step-number { flex: 0 0 auto; display: grid; place-items: center; width: 46px; height: 46px; border-radius: 50%; background: #d9f0fc; font-size: 1.375rem; font-weight: 750; }
.tf-contact__steps h3 { margin-block: 2px 3px; font-size: .875rem; }
.tf-contact__steps p { font-size: .875rem; line-height: 1.45; }
.tf-contact__step-arrow { position: absolute; top: 50%; right: -33px; transform: translateY(-50%); width: 20px; height: 20px; }
.tf-contact__tracking { padding-block: 24px; background: var(--tf-pale); }
.tf-contact__tracking-inner { display: flex; align-items: center; justify-content: space-between; gap: 24px; }
.tf-contact__tracking-inner > div { min-width: 0; }
.tf-contact__tracking p { margin-block-start: 4px; }
.tf-contact__tracking .tf-contact__button { flex: 0 0 auto; min-width: 200px; }

.tf-contact__faq { padding-block: 24px; }
.tf-contact__faq-list { display: grid; gap: 6px; margin-block-start: 12px; }
.tf-contact__faq-item { min-width: 0; border: 1px solid var(--tf-line); border-radius: 3px; }
.tf-contact__faq-item summary { display: flex; align-items: center; gap: 20px; min-height: 40px; padding: 8px 16px; list-style: none; cursor: pointer; font-size: .875rem; font-weight: 700; }
.tf-contact__faq-item summary::-webkit-details-marker { display: none; }
.tf-contact__faq-item summary::marker { content: ""; }
.tf-contact__faq-item summary > span { flex: 1; min-width: 0; }
.tf-contact__faq-chevron { width: 22px; height: 22px; }
.tf-contact__faq-toggle { width: 16px; height: 16px; transform: rotate(90deg); }
.tf-contact__faq-item[open] .tf-contact__faq-chevron { color: var(--tf-orange); transform: rotate(90deg); stroke-width: 3; }
.tf-contact__faq-item[open] .tf-contact__faq-toggle { transform: rotate(-90deg); }
.tf-contact__faq-item p { margin: -2px 52px 10px 58px; font-size: .875rem; line-height: 1.5; }

.tf-contact__cta { padding-block: 20px; background: var(--tf-navy); color: #fff; }
.tf-contact__cta-inner { display: flex; justify-content: space-between; align-items: center; gap: 24px; }
.tf-contact__cta-inner > div { min-width: 0; }
.tf-contact__cta p { margin-block-start: 4px; color: #dce7ef; }
.tf-contact__cta-actions { display: flex; flex: 0 0 auto; gap: 16px; }
.tf-contact__cta :focus-visible,
.tf-contact-footer :focus-visible { outline-color: #ffbd8d !important; }

.tf-contact-footer { padding-block: 20px 28px; color: #f2f7fc; background: var(--tf-navy); border-block-start: 1px solid #446177; }
.tf-contact-footer__grid { display: grid; grid-template-columns: 1.25fr .85fr 1.05fr 1.2fr; gap: 24px; }
.tf-contact-footer__grid > * { min-width: 0; }
.tf-contact-footer a { color: inherit; text-decoration: none; text-underline-offset: 3px; }
.tf-contact-footer a:hover { text-decoration: underline; }
.tf-contact-footer__logo { display: inline-flex; align-items: center; gap: 9px; font-size: 1.5rem; font-weight: 750; line-height: 1.2; }
.tf-contact-footer__logo svg { flex: 0 0 auto; color: var(--tf-orange); }
.tf-contact-footer__brand p { margin-block-start: 7px; font-size: .8125rem; }
.tf-contact-footer h2 { font-size: .8125rem; font-weight: 650; line-height: 1.5; }
.tf-contact-footer ul { padding: 0; list-style: none; }
.tf-contact-footer li a { display: inline-block; min-height: 24px; padding-block: 2px; font-size: .8125rem; }
.tf-contact-footer__email { display: flex; align-items: center; gap: 12px; min-height: 28px; font-size: .8125rem; }
.tf-contact-footer__email span { min-width: 0; overflow-wrap: anywhere; }
.tf-contact-footer__email svg { width: 18px; height: 18px; }
.tf-contact-footer__contact p { margin-block-start: 9px; font-size: .75rem; }

@media (max-width: 1199px) {
  .tf-contact__intro-grid { gap: 22px; }
  .tf-contact__form-card { padding: 20px; }
  .tf-contact__topic { padding: 9px 8px; gap: 7px; }
  .tf-contact__topic-grid { gap: 8px; }
  .tf-contact__benefits { gap: 18px; }
  .tf-contact__steps li { gap: 12px; }
  .tf-contact__cta-inner { align-items: flex-start; }
  .tf-contact__cta-actions { gap: 10px; }
  .tf-contact__cta .tf-contact__button { padding-inline: 16px; }
}

/* Compact desktop spacing follows the reference while preserving larger mobile inputs. */
@media (min-width: 900px) and (max-width: 1199px) {
  .tf-contact__intro { padding-block: 24px; }
  .tf-contact__lead { font-size: 1rem; line-height: 1.4; }
  .tf-contact__benefits { gap: 16px; margin-block: 16px 22px !important; }
  .tf-contact__benefits h3 { font-size: .9375rem; }
  .tf-contact__benefits p { font-size: .875rem; }
  .tf-contact__benefit-icon { width: 60px; height: 60px; }
  .tf-contact__email-card { grid-template-columns: 56px minmax(0, 1fr); gap: 12px; padding: 14px; }
  .tf-contact__email-icon { width: 56px; height: 56px; }
  .tf-contact__email-card a { font-size: .875rem; }
  .tf-contact__form-card > p { font-size: .8125rem; line-height: 1.4; }
  .tf-contact__topics { margin-block: 12px 14px; }
  .tf-contact__topic { min-height: 56px; padding: 9px; gap: 7px; }
  .tf-contact__topic input { width: 16px; height: 16px; }
  .tf-contact__topic strong { font-size: .6875rem; }
  .tf-contact__topic small { font-size: .625rem; }
  .tf-contact__fields-grid { gap: 12px 18px; }
  .tf-contact__field > label { margin-block-end: 4px; font-size: .75rem; }
  .tf-contact__field :where(input:not([type="checkbox"]), select, textarea) { min-height: 36px; padding: 7px 10px; font-size: .8125rem; }
  .tf-contact__field textarea { height: 80px; min-height: 80px; }
  .tf-contact__consent-row { min-height: 30px; }
  .tf-contact__consent-row label { padding-block: 5px; font-size: .75rem; }
  .tf-contact__form-card .tf-contact__quote-note { margin-block-start: 12px; padding-block-start: 10px; font-size: .75rem; }
  .tf-contact__next { padding-block: 20px; }
  .tf-contact__steps { margin-block-start: 12px !important; }
  .tf-contact__steps li { padding: 12px; }
  .tf-contact__step-number { width: 42px; height: 42px; }
  .tf-contact__steps h3,
  .tf-contact__steps p { font-size: .8125rem; }
  .tf-contact__tracking { padding-block: 20px; }
  .tf-contact__tracking p { font-size: .875rem; }
  .tf-contact__faq { padding-block: 20px; }
  .tf-contact__faq-list { margin-block-start: 10px; }
  .tf-contact__faq-item summary { min-height: 34px; padding-block: 5px; font-size: .8125rem; }
  .tf-contact__faq-item p { font-size: .8125rem; margin-block-end: 8px; }
  .tf-contact__cta { padding-block: 14px; }
  .tf-contact__cta h2 { font-size: 1.5rem; }
  .tf-contact__cta p { font-size: .875rem; }
  .tf-contact-footer { padding-block: 16px; }
  .tf-contact-footer h2,
  .tf-contact-footer li a,
  .tf-contact-footer__brand p,
  .tf-contact-footer__email { font-size: .75rem; }
  .tf-contact-footer li a { min-height: 20px; padding-block: 1px; }
}

@media (max-width: 899px) {
  .tf-contact__intro-grid { grid-template-columns: minmax(0, 1fr); gap: 28px; }
  .tf-contact__guidance h2 { max-width: none; }
  .tf-contact__lead { max-width: 65ch; }
  .tf-contact__benefits { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 22px; margin-block: 24px !important; }
  .tf-contact__benefits li { grid-template-columns: minmax(0, 1fr); gap: 8px; }
  .tf-contact__team-photo { max-height: 420px; object-position: center 42%; }
  .tf-contact__email-card { grid-template-columns: 56px minmax(0, 1fr); }
  .tf-contact__email-icon { width: 56px; height: 56px; }
  .tf-contact__form-card { padding: 24px; }
  .tf-contact__topic { min-height: 70px; padding: 12px; gap: 10px; }
  .tf-contact__topic strong { font-size: .875rem; }
  .tf-contact__topic small { font-size: .75rem; }
  .tf-contact__field :where(input:not([type="checkbox"]), select, textarea) { min-height: 46px; font-size: 1rem; }
  .tf-contact__field textarea { min-height: 120px; }
  .tf-contact__steps { gap: 26px; }
  .tf-contact__steps li { flex-direction: column; gap: 10px; }
  .tf-contact__step-arrow { right: -23px; width: 18px; }
  .tf-contact__tracking h2 { max-width: 28ch; }
  .tf-contact__cta-inner { flex-direction: column; gap: 16px; }
  .tf-contact-footer__grid { grid-template-columns: 1.2fr .8fr .8fr; }
  .tf-contact-footer__contact { grid-column: 1 / -1; display: flex; justify-content: space-between; align-items: center; gap: 20px; padding-block-start: 8px; border-block-start: 1px solid #446177; }
  .tf-contact-footer__contact p { margin: 0; }
}

@media (max-width: 599px) {
  .tf-contact__container { width: calc(100% - 40px); }
  .tf-contact__intro { padding-block: 28px; }
  .tf-contact__lead { font-size: 1rem; }
  .tf-contact__benefits { grid-template-columns: minmax(0, 1fr); gap: 20px; }
  .tf-contact__benefits li { grid-template-columns: 54px minmax(0, 1fr); gap: 14px; }
  .tf-contact__benefit-icon { width: 54px; height: 54px; }
  .tf-contact__benefit-icon svg { width: 32px; height: 32px; }
  .tf-contact__email-card { padding: 12px; gap: 12px; }
  .tf-contact__email-card a { font-size: .875rem; }
  .tf-contact__form-card { padding: 18px 16px; }
  .tf-contact__topic-grid { grid-template-columns: minmax(0, 1fr); }
  .tf-contact__topic { min-height: 60px; padding: 10px 12px; gap: 12px; }
  .tf-contact__fields-grid { grid-template-columns: minmax(0, 1fr); gap: 18px; }
  .tf-contact__field > label { font-size: .875rem; }
  .tf-contact__consent-row { align-items: flex-start; }
  .tf-contact__consent-row input { margin-block-start: 10px; }
  .tf-contact__consent-row label { font-size: .875rem; }
  .tf-contact__button { max-width: 100%; }
  .tf-contact__reset { width: 100%; }
  .tf-contact__next,
  .tf-contact__tracking,
  .tf-contact__faq { padding-block: 28px; }
  .tf-contact__steps { grid-template-columns: minmax(0, 1fr); gap: 24px; }
  .tf-contact__steps li { flex-direction: row; align-items: flex-start; gap: 16px; min-height: 92px; padding: 16px; }
  .tf-contact__step-arrow { top: auto; right: 50%; bottom: -23px; transform: translateX(50%) rotate(90deg); height: 18px; }
  .tf-contact__tracking-inner { flex-direction: column; align-items: stretch; gap: 16px; }
  .tf-contact__tracking h2 { max-width: none; }
  .tf-contact__faq-item summary { gap: 10px; min-height: 48px; padding-inline: 10px; }
  .tf-contact__faq-item p { margin: 0 18px 14px 42px; }
  .tf-contact__faq-toggle { width: 14px; height: 14px; }
  .tf-contact__cta { padding-block: 28px; }
  .tf-contact__cta-inner { align-items: stretch; }
  .tf-contact__cta-actions { flex-direction: column; gap: 12px; }
  .tf-contact-footer { padding-block: 26px; }
  .tf-contact-footer__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 24px; }
  .tf-contact-footer__brand { grid-column: 1 / -1; }
  .tf-contact-footer h2 { font-size: .9375rem; margin-block-end: 6px; }
  .tf-contact-footer li a { min-height: 36px; padding-block: 7px; font-size: .875rem; }
  .tf-contact-footer__contact { flex-direction: column; align-items: flex-start; gap: 8px; padding-block-start: 16px; }
  .tf-contact-footer__email { min-height: 36px; font-size: .875rem; }
}

@media (prefers-reduced-motion: reduce) {
  .tf-contact .tf-contact__button { transition: none; }
}

@media (forced-colors: active) {
  .tf-contact__topic:has(input:checked) { outline: 2px solid Highlight; outline-offset: -2px; }
  .tf-contact .tf-contact__button { border-color: ButtonText; }
}