/* TFC sign-up landing - clean one-screen fluid CSS
   Replace the existing signup_landing CSS with this whole file, then clear Drupal cache. */

.tfc-signup--premium,
.tfc-signup--premium.webform-submission-form {
  --blue: #0758ff;
  --blue-2: #1558e8;
  --ink: #071126;
  --muted: #536176;
  --line: rgba(148, 163, 184, .32);
  --panel: rgba(255,255,255,.94);

  --page-w: min(100vw, 820px);
  --gutter: clamp(14px, 4vw, 26px);
  --logo: clamp(28px, min(7.8vw, 4.6dvh), 44px);
  --h1: clamp(34px, min(9.8vw, 7dvh), 68px);
  --sub: clamp(12px, min(3.35vw, 2.25dvh), 18px);
  --cta-h: clamp(48px, 7dvh, 64px);
  --benefit-icon: clamp(34px, min(8.4vw, 5.6dvh), 50px);

  width: min(100%, 820px) !important;
  height: 100vh !important;
  height: 100dvh !important;
  min-height: 0 !important;
  margin: 0 auto !important;
  padding: 0 !important;
  overflow: hidden !important;
  color: var(--ink) !important;
  font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif !important;
  background:
    radial-gradient(circle at 0% 55%, rgba(37,99,235,.30), transparent 38%),
    radial-gradient(circle at 100% 58%, rgba(96,165,250,.20), transparent 36%),
    linear-gradient(180deg, #fff 0%, #f8fbff 55%, #fff 100%) !important;
  box-sizing: border-box !important;
}

.tfc-signup--premium *,
.tfc-signup--premium *::before,
.tfc-signup--premium *::after {
  box-sizing: border-box !important;
}

.tfc-signup--premium .webform-progress,
.tfc-signup--premium .webform-progress-tracker,
.tfc-signup--premium .tfc-pill,
.tfc-signup--premium .tfc-sub,
.tfc-signup--premium .tfc-cards,
.tfc-signup--premium .tfc-trust,
.tfc-signup--premium .tfc-trust-title,
.tfc-signup--premium .tfc-mini-benefits,
.tfc-signup--premium .tfc-feature-row,
.tfc-signup--premium .tfc-proof,
.tfc-signup--premium .tfc-cta-note {
  display: none !important;
}

/* One-screen structure */
.tfc-signup--premium .tfc-wrap {
  width: 100% !important;
  max-width: var(--page-w) !important;
  height: calc(100dvh - var(--cta-h) - clamp(18px, 3dvh, 34px) - env(safe-area-inset-bottom)) !important;
  min-height: 0 !important;
  margin: 0 auto !important;
  padding: 0 !important;
  display: grid !important;
  grid-template-rows: auto auto auto auto minmax(0, 1fr) auto !important;
  align-items: start !important;
  justify-items: center !important;
  text-align: center !important;
  overflow: hidden !important;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  position: relative !important;
}

/* Header */
.tfc-signup--premium .tfc-logo-row {
  width: 100% !important;
  margin: 0 !important;
  padding: clamp(5px, 1dvh, 11px) var(--gutter) clamp(4px, .7dvh, 8px) !important;
  display: flex !important;
  align-items: center !important;
  justify-content: flex-start !important;
  gap: clamp(8px, 2vw, 13px) !important;
}

.tfc-signup--premium .tfc-wordmark {
  color: var(--blue-2) !important;
  font-size: var(--logo) !important;
  line-height: .84 !important;
  font-weight: 950 !important;
  font-style: italic !important;
  letter-spacing: -.11em !important;
  transform: skew(-8deg) !important;
}

.tfc-signup--premium .tfc-logo-divider {
  display: block !important;
  width: 1px !important;
  height: calc(var(--logo) * .75) !important;
  background: rgba(148,163,184,.45) !important;
}

.tfc-signup--premium .tfc-logo-text {
  text-align: left !important;
}

.tfc-signup--premium .tfc-logo-text strong {
  display: block !important;
  color: var(--ink) !important;
  font-size: clamp(11px, min(3vw, 2dvh), 17px) !important;
  line-height: .98 !important;
  font-weight: 950 !important;
  letter-spacing: .16em !important;
}

.tfc-signup--premium .tfc-logo-text span {
  display: block !important;
  margin-top: clamp(2px, .45dvh, 5px) !important;
  color: var(--blue-2) !important;
  font-size: clamp(7px, min(1.9vw, 1.25dvh), 10px) !important;
  line-height: 1 !important;
  font-weight: 950 !important;
  letter-spacing: .18em !important;
}

.tfc-signup--premium .tfc-login {
  position: absolute !important;
  top: clamp(8px, 1.3dvh, 14px) !important;
  right: var(--gutter) !important;
  z-index: 6 !important;
  color: #64748b !important;
  font-size: clamp(12px, min(3.1vw, 1.9dvh), 14px) !important;
  line-height: 1 !important;
  font-weight: 800 !important;
  text-decoration: none !important;
}

.tfc-signup--premium .tfc-login strong {
  color: var(--blue-2) !important;
  font-weight: 950 !important;
}

/* Hero text */
.tfc-signup--premium .tfc-ai-pill {
  width: fit-content !important;
  max-width: calc(100% - 32px) !important;
  margin: 0 auto clamp(5px, .8dvh, 9px) !important;
  padding: clamp(5px, .75dvh, 8px) clamp(13px, 3.6vw, 18px) !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 7px !important;
  border: 1px solid rgba(21,88,232,.18) !important;
  border-radius: 999px !important;
  background: rgba(255,255,255,.82) !important;
  box-shadow: 0 10px 24px rgba(37,99,235,.10) !important;
  color: var(--blue-2) !important;
  font-size: clamp(10px, min(2.7vw, 1.55dvh), 13px) !important;
  line-height: 1 !important;
  font-weight: 950 !important;
  letter-spacing: .045em !important;
}

.tfc-signup--premium .tfc-ai-pill svg {
  width: 15px !important;
  height: 15px !important;
  fill: none !important;
  stroke: currentColor !important;
  stroke-width: 2 !important;
  stroke-linecap: round !important;
  stroke-linejoin: round !important;
}

.tfc-signup--premium .tfc-wrap h1 {
  width: min(100%, 640px) !important;
  margin: 0 auto !important;
  padding: 0 var(--gutter) !important;
  color: var(--ink) !important;
  font-size: var(--h1) !important;
  line-height: .90 !important;
  letter-spacing: -.055em !important;
  font-weight: 950 !important;
}

.tfc-signup--premium .tfc-wrap h1 span {
  display: block !important;
  color: transparent !important;
  background: linear-gradient(90deg, var(--blue) 0%, #1d4ed8 62%, #2563eb 100%) !important;
  -webkit-background-clip: text !important;
  background-clip: text !important;
}

.tfc-signup--premium .tfc-subline {
  width: min(100%, 640px) !important;
  margin: clamp(5px, .9dvh, 9px) auto clamp(4px, .75dvh, 8px) !important;
  padding: 0 var(--gutter) !important;
  color: var(--muted) !important;
  font-size: var(--sub) !important;
  line-height: 1.16 !important;
  font-weight: 800 !important;
}

/* Phone area: fluid centre, not pinned to top */
.tfc-signup--premium .tfc-phone-stage {
  position: relative !important;
  width: 100% !important;
  min-height: 0 !important;
  height: 100% !important;
  margin: 0 !important;
  padding: 0 var(--gutter) !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  overflow: hidden !important;
}

.tfc-signup--premium .tfc-phone-stage::before {
  content: "" !important;
  position: absolute !important;
  inset: 0 !important;
  background:
    radial-gradient(circle at 12% 56%, rgba(37,99,235,.36), transparent 44%),
    radial-gradient(circle at 88% 58%, rgba(96,165,250,.26), transparent 44%) !important;
  filter: blur(18px) !important;
  z-index: 0 !important;
  pointer-events: none !important;
}

.tfc-signup--premium .tfc-phone-stage::after {
  content: "" !important;
  position: absolute !important;
  left: 0 !important;
  right: 0 !important;
  bottom: 0 !important;
  height: clamp(55px, 12dvh, 110px) !important;
  z-index: 2 !important;
  pointer-events: none !important;
  background: linear-gradient(180deg, rgba(247,251,255,0) 0%, rgba(247,251,255,.80) 66%, #f7fbff 100%) !important;
}

.tfc-signup--premium .tfc-phone-img {
  position: relative !important;
  z-index: 1 !important;
  width: min(88vw, 680px) !important;
  height: auto !important;
  max-width: 100% !important;
  max-height: min(100%, 48dvh) !important;
  object-fit: contain !important;
  object-position: center center !important;
  display: block !important;
  filter: drop-shadow(0 24px 30px rgba(15,23,42,.14)) !important;
}

/* Benefit panel - close to phones, but part of same fluid grid */
.tfc-signup--premium .tfc-benefit-panel {
  position: relative !important;
  z-index: 4 !important;
  width: min(calc(100% - 28px), 760px) !important;
  margin: calc(-1 * clamp(12px, 2.6dvh, 28px)) auto clamp(6px, 1.1dvh, 10px) !important;
  padding: clamp(10px, 1.85dvh, 18px) clamp(8px, 2.4vw, 18px) !important;
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  align-items: stretch !important;
  border: 1px solid rgba(219,226,239,.92) !important;
  border-radius: 24px !important;
  background: var(--panel) !important;
  box-shadow: 0 18px 42px rgba(15,23,42,.09) !important;
  backdrop-filter: blur(14px) !important;
  -webkit-backdrop-filter: blur(14px) !important;
}

.tfc-signup--premium .tfc-benefit-card {
  position: relative !important;
  min-width: 0 !important;
  padding: 0 clamp(5px, 1.8vw, 14px) !important;
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  justify-content: flex-start !important;
  text-align: center !important;
}

.tfc-signup--premium .tfc-benefit-card:not(:last-child)::after {
  content: "" !important;
  position: absolute !important;
  top: 6px !important;
  right: 0 !important;
  width: 1px !important;
  height: calc(100% - 12px) !important;
  background: var(--line) !important;
}

.tfc-signup--premium .tfc-benefit-icon {
  width: var(--benefit-icon) !important;
  height: var(--benefit-icon) !important;
  margin-bottom: clamp(6px, 1dvh, 10px) !important;
  display: grid !important;
  place-items: center !important;
  border-radius: 999px !important;
  background: linear-gradient(135deg, var(--blue), var(--blue-2)) !important;
  color: #fff !important;
  box-shadow: 0 12px 28px rgba(37,99,235,.22) !important;
}

.tfc-signup--premium .tfc-benefit-icon svg {
  width: 56% !important;
  height: 56% !important;
  display: block !important;
  fill: none !important;
  stroke: currentColor !important;
  stroke-width: 2.2 !important;
  stroke-linecap: round !important;
  stroke-linejoin: round !important;
}

.tfc-signup--premium .tfc-benefit-card strong {
  display: block !important;
  color: var(--ink) !important;
  font-size: clamp(10px, min(2.9vw, 1.95dvh), 17px) !important;
  line-height: 1.04 !important;
  font-weight: 950 !important;
  letter-spacing: .055em !important;
  text-transform: uppercase !important;
}

.tfc-signup--premium .tfc-benefit-card small {
  display: block !important;
  margin-top: clamp(4px, .65dvh, 8px) !important;
  color: #64748b !important;
  font-size: clamp(8.5px, min(2.35vw, 1.45dvh), 13px) !important;
  line-height: 1.18 !important;
  font-weight: 750 !important;
}

/* CTA */
.tfc-signup--premium .form-actions,
.tfc-signup--premium .webform-actions {
  position: relative !important;
  z-index: 5 !important;
  width: min(calc(100% - 28px), 680px) !important;
  margin: 0 auto clamp(6px, 1dvh, 10px) !important;
  padding: clamp(7px, 1.05dvh, 10px) clamp(8px, 2.4vw, 12px) !important;
  display: block !important;
  border: 1px solid rgba(219,226,239,.92) !important;
  border-radius: 22px !important;
  background: var(--panel) !important;
  box-shadow: 0 16px 36px rgba(15,23,42,.08) !important;
  backdrop-filter: blur(12px) !important;
  -webkit-backdrop-filter: blur(12px) !important;
}

.tfc-signup--premium .form-actions::before,
.tfc-signup--premium .form-actions::after,
.tfc-signup--premium .webform-actions::before,
.tfc-signup--premium .webform-actions::after {
  display: none !important;
  content: none !important;
}

.tfc-signup--premium .button,
.tfc-signup--premium input[type="submit"] {
  display: block !important;
  width: 100% !important;
  min-height: clamp(46px, 6.3dvh, 60px) !important;
  margin: 0 !important;
  border: 0 !important;
  border-radius: 999px !important;
  font-size: clamp(17px, min(4.55vw, 2.85dvh), 24px) !important;
  line-height: 1.1 !important;
  font-weight: 950 !important;
  text-align: center !important;
  appearance: none !important;
  -webkit-appearance: none !important;
}

.tfc-signup--premium .webform-button--next,
.tfc-signup--premium .webform-button--submit,
.tfc-signup--premium input[data-drupal-selector*="edit-wizard-next"],
.tfc-signup--premium input[data-drupal-selector*="edit-submit"] {
  padding: 0 22px !important;
  background: linear-gradient(100deg, var(--blue) 0%, var(--blue-2) 52%, #0047ff 100%) !important;
  color: #fff !important;
  box-shadow: 0 16px 34px rgba(37,99,235,.30) !important;
}

.tfc-signup--premium .webform-button--previous,
.tfc-signup--premium input[data-drupal-selector*="edit-wizard-prev"] {
  min-height: 52px !important;
  margin-top: 10px !important;
  background: #e8eef8 !important;
  color: #334155 !important;
  box-shadow: none !important;
}

/* Email step */
.tfc-signup--premium .tfc-email-wrap {
  width: min(calc(100% - 32px), 520px) !important;
  margin: 0 auto !important;
  padding: 4px 0 0 !important;
  text-align: center !important;
}

.tfc-signup--premium .tfc-logo-row--center {
  width: 100% !important;
  justify-content: center !important;
  flex-direction: column !important;
  gap: 3px !important;
  margin: 0 auto 16px !important;
}

.tfc-signup--premium .tfc-logo-row--center .tfc-logo-divider {
  display: none !important;
}

.tfc-signup--premium .tfc-step-row {
  display: grid !important;
  grid-template-columns: repeat(3, 1fr) !important;
  gap: 12px !important;
  max-width: 360px !important;
  margin: 4px auto 24px !important;
}

.tfc-signup--premium .tfc-step-row div {
  position: relative !important;
  color: #9aa5b5 !important;
  font-size: 10px !important;
  font-weight: 750 !important;
}

.tfc-signup--premium .tfc-step-row div:not(:last-child)::after {
  content: "" !important;
  position: absolute !important;
  top: 13px !important;
  left: calc(50% + 20px) !important;
  width: calc(100% - 28px) !important;
  border-top: 1px dashed #cbd5e1 !important;
}

.tfc-signup--premium .tfc-step-row span {
  width: 26px !important;
  height: 26px !important;
  margin: 0 auto 7px !important;
  display: grid !important;
  place-items: center !important;
  border-radius: 999px !important;
  background: #fff !important;
  border: 1px solid #d6dfec !important;
  color: #9aa5b5 !important;
  font-size: 12px !important;
  font-weight: 950 !important;
}

.tfc-signup--premium .tfc-step-row .is-active span {
  background: var(--blue-2) !important;
  border-color: var(--blue-2) !important;
  color: #fff !important;
  box-shadow: 0 10px 22px rgba(21,88,232,.28) !important;
}

.tfc-signup--premium .tfc-step-row strong { display: block !important; font-weight: 750 !important; }
.tfc-signup--premium .tfc-step-row .is-active strong { color: var(--blue-2) !important; }

.tfc-signup--premium .tfc-email-wrap h2 {
  margin: 0 !important;
  color: var(--ink) !important;
  font-size: clamp(32px, 8.2vw, 44px) !important;
  line-height: 1.04 !important;
  letter-spacing: -.06em !important;
  font-weight: 950 !important;
}

.tfc-signup--premium .tfc-email-wrap p {
  margin: 10px auto 0 !important;
  max-width: 360px !important;
  color: #4d5b73 !important;
  font-size: 14.5px !important;
  line-height: 1.5 !important;
  font-weight: 650 !important;
}

.tfc-signup--premium .tfc-field {
  width: min(calc(100% - 32px), 520px) !important;
  margin: 24px auto 0 !important;
}

.tfc-signup--premium .tfc-field label {
  display: block !important;
  margin-bottom: 9px !important;
  color: var(--ink) !important;
  font-size: 14px !important;
  font-weight: 950 !important;
}

.tfc-signup--premium .tfc-field input {
  display: block !important;
  width: 100% !important;
  min-height: 58px !important;
  border-radius: 14px !important;
  border: 1px solid rgba(203,213,225,.95) !important;
  background: #fff !important;
  padding: 0 18px !important;
  color: var(--ink) !important;
  font-size: 16px !important;
  font-weight: 700 !important;
}

.tfc-signup--premium .tfc-field input:focus {
  outline: none !important;
  border-color: var(--blue-2) !important;
  box-shadow: 0 0 0 4px rgba(21,88,232,.12) !important;
}

.tfc-signup--premium .tfc-privacy-box {
  width: min(calc(100% - 32px), 520px) !important;
  margin: 16px auto 0 !important;
  padding: 16px !important;
  display: flex !important;
  gap: 14px !important;
  align-items: flex-start !important;
  border-radius: 18px !important;
  background: #f3f7ff !important;
  border: 1px solid rgba(203,213,225,.9) !important;
}

.tfc-signup--premium .tfc-privacy-icon {
  flex: 0 0 30px !important;
  width: 30px !important;
  height: 30px !important;
  display: grid !important;
  place-items: center !important;
  color: var(--blue-2) !important;
}

.tfc-signup--premium .tfc-privacy-icon svg,
.tfc-signup--premium .tfc-trust-icon svg,
.tfc-signup--premium .tfc-icon svg {
  width: 24px !important;
  height: 24px !important;
  fill: none !important;
  stroke: currentColor !important;
  stroke-width: 1.8 !important;
  stroke-linecap: round !important;
  stroke-linejoin: round !important;
}

.tfc-signup--premium .tfc-privacy-box strong {
  display: block !important;
  color: var(--ink) !important;
  font-size: 14px !important;
  font-weight: 950 !important;
}

.tfc-signup--premium .tfc-privacy-box p {
  margin: 6px 0 0 !important;
  color: #59687f !important;
  font-size: 12.5px !important;
  line-height: 1.45 !important;
  font-weight: 650 !important;
  text-align: left !important;
}

.tfc-signup--premium .tfc-privacy-box a {
  color: var(--blue-2) !important;
  font-weight: 900 !important;
}