/*
 * TECHTOPIA — VERIFIED TWO-STEP PURCHASE PATH
 * Canonical screen-plane owner for the publisher form.
 * CMM: informed choice, not manufactured urgency or implicit consent.
 * DF-DP-001: three planes, one action signal, focal type, zero X scrolling.
 */
.lead-capture-section {
  position: relative;
  isolation: isolate;
  background:     radial-gradient(ellipse at 22% 18%, rgba(41, 117, 233, 0.2), transparent 43%),     linear-gradient(155deg, #07142b, #0e2242 54%, #060f22);
  border-block: 1px solid rgba(160, 210, 255, 0.15);
}
.lead-capture-section::before {
  content: "";
  position: absolute;
  inset: 0;
  opacity: 0.15;
  pointer-events: none;
  background-image:     linear-gradient(rgba(150, 200, 255, 0.13) 1px, transparent 1px),     linear-gradient(90deg, rgba(150, 200, 255, 0.13) 1px, transparent 1px);
  background-size: 42px 42px;
  mask-image: linear-gradient(180deg, transparent, #000 22%, #000 70%, transparent);
}
.lead-capture-layout {
  position: relative;
  z-index: 1;
  display: grid;
  grid-template-columns: minmax(0, 0.8fr) minmax(0, 1fr);
  gap: clamp(38px, 6vw, 96px);
  align-items: start;
}
.lead-capture-intro, .lead-capture-card {
  min-inline-size: 0;
  max-inline-size: 100%;
}
.lead-capture-intro > p {
  color: #d7e6f7;
  max-inline-size: 55ch;
  font-size: 1.075rem;
  line-height: 1.75;
  margin-block: 27px 33px;
}
.journey-steps {
  list-style: none;
  padding: 0;
  margin: 0;
  display: grid;
  gap: 12px;
}
.journey-step {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  align-items: start;
  gap: 18px;
  padding: 23px;
  border: 1px solid var(--c-outline);
  border-radius: 12px;
  background: rgba(10, 26, 49, 0.7);
}
.journey-step--current {
  border-color: rgba(255, 207, 50, 0.6);
  background: rgba(255, 207, 50, 0.045);
}
.journey-step--complete {
  border-color: rgba(104, 219, 172, 0.55);
}
.journey-step__number {
  color: var(--c-yellow);
  font-family: var(--font-mono);
  font-weight: 700;
  font-size: 0.84rem;
  letter-spacing: 0.09em;
  padding-top: 3px;
}
.journey-step strong {
  display: block;
  color: #fff;
  font-size: 1.025rem;
  margin-block-end: 10px;
  line-height: 1.45;
}
.journey-step small {
  display: block;
  color: #b8cde5;
  font-size: 0.86rem;
  line-height: 1.75;
}
.lead-capture-privacy {
  display: flex;
  align-items: start;
  gap: 13px;
  color: #a9c0d7;
  margin-block-start: 25px;
}
.lead-capture-privacy > span {
  color: var(--c-cyan);
  flex: 0 0 auto;
  margin-block-start: 3px;
}
.lead-capture-privacy p {
  font-size: 0.82rem;
  line-height: 1.8;
  margin: 0;
}
.lead-capture-card {
  border: 1px solid rgba(154, 204, 253, 0.3);
  border-radius: 18px;
  overflow: clip;
  background: #f8fafc;
  color: #0b203c;
  box-shadow: 0 30px 90px rgba(0, 0, 0, 0.45);
}
.lead-capture-card__top {
  display: flex;
  align-items: center;
  gap: 11px;
  flex-wrap: wrap;
  padding: 16px clamp(18px, 2.5vw, 34px);
  background: #0d1c37;
  color: #e3effe;
  font-family: var(--font-mono);
  letter-spacing: 0.1em;
  font-size: 0.62rem;
  line-height: 1.6;
}
.lead-capture-card__top > span:last-child {
  margin-inline-start: auto;
  color: #a8c0d5;
}
.lead-capture-card__body {
  padding: clamp(16px, 3.3vw, 36px);
}
.lead-capture-card__heading h3 {
  margin: 8px 0 10px;
  font-family: var(--font-display);
  font-size: clamp(2rem, 3.5vw, 3.35rem);
  line-height: 0.99;
  text-transform: uppercase;
  color: #071935;
}
.lead-capture-card__heading > p:last-child {
  color: #465776;
  font-size: 0.93rem;
  line-height: 1.65;
  max-inline-size: 60ch;
  margin-block-end: 14px;
}
.lead-capture-card__heading .eyebrow {
  color: #2a527f;
  font-weight: 750;
  font-size: 0.71rem;
}
.lead-gate-state {
  color: #12345a;
  background: #edf4fc;
  border: 1px solid #cedfeb;
  border-left: 4px solid #a77900;
  border-radius: 5px;
  padding: 13px 15px;
  font-size: 0.82rem;
  line-height: 1.6;
  margin-block: 17px;
}
#lead-iframe {
  display: block;
  inline-size: 100%;
  max-inline-size: 100%;
  min-block-size: 560px;
  border: 0;
  border-radius: 8px;
  background: #fff;
}
.lead-form-actions {
  display: grid;
  gap: 13px;
  margin-block-start: 18px;
}
.lead-form-actions > a {
  color: #114b78;
  text-decoration: underline;
  font-size: 0.82rem;
  text-align: center;
  overflow-wrap: anywhere;
}
.lead-form-actions .button {
  color: #091227;
}
.lead-form-footnote {
  color: #59667c;
  font-size: 0.76rem;
  line-height: 1.65;
  margin: 17px 0 0;
}
.lead-next {
  border: 1px solid #67a98c;
  background: #ecfff4;
  border-radius: 9px;
  padding: 20px;
  margin-block-start: 20px;
  color: #153d2a;
}
.lead-next[hidden] {
  display: none !important;
}
.lead-next p {
  color: #23553c;
  margin-block: 6px 16px;
}
body[data-lead-gate="form_verified"] .lead-gate-state, body[data-lead-gate="redirecting"] .lead-gate-state {
  background: #e1ffef;
  border-left-color: #167347;
}
@media (max-width: 960px) {
  .lead-capture-layout {
    grid-template-columns: minmax(0, 1fr);
    gap: 40px;
  }
  .lead-capture-intro {
    max-inline-size: 760px;
  }
}
@media (max-width: 480px) {
  .lead-capture-card__body {
    padding-inline: 16px;
  }
  .lead-capture-card__top {
    font-size: 0.56rem;
  }
  .journey-step {
    padding: 17px;
    gap: 13px;
  }
  #lead-iframe {
    min-block-size: 580px;
  }
}
/* The embedding origin owns the inside of this iframe. If its inner layout
 * violates responsive constraints, change the Driftless Forms canonical
 * renderer rather than hiding the embedded overflow on this parent page. */