.start-page {
  min-height: 100vh;
  background:
    radial-gradient(circle at 12% 12%, rgba(0, 169, 239, .12), transparent 28%),
    linear-gradient(180deg, #f8fcff 0, #fff 45%);
}

.start-hero {
  position: relative;
  overflow: hidden;
  padding: 155px 0 86px;
  background:
    linear-gradient(rgba(96, 200, 245, .055) 1px, transparent 1px),
    linear-gradient(90deg, rgba(96, 200, 245, .055) 1px, transparent 1px),
    radial-gradient(circle at 18% 30%, rgba(0, 169, 239, .2), transparent 32%),
    linear-gradient(135deg, #020b25, #042872 58%, #075d97);
  background-size: 56px 56px, 56px 56px, auto, auto;
  color: #fff;
}

.start-hero::after {
  content: "";
  position: absolute;
  width: 520px;
  height: 520px;
  inset-inline-start: -170px;
  top: 25px;
  border: 1px solid rgba(126, 220, 255, .18);
  border-radius: 50%;
  box-shadow: 0 0 0 55px rgba(74, 192, 241, .025), 0 0 0 110px rgba(74, 192, 241, .018);
}

.start-hero-grid {
  position: relative;
  z-index: 1;
  display: grid;
  grid-template-columns: minmax(0, 1.2fr) minmax(300px, .8fr);
  align-items: center;
  gap: 70px;
}

.start-kicker {
  display: inline-flex;
  align-items: center;
  gap: 9px;
  margin-bottom: 18px;
  color: #75ddff;
  font-size: 11px;
  letter-spacing: .13em;
}

.start-kicker::before {
  content: "";
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: #62e6ff;
  box-shadow: 0 0 0 7px rgba(98, 230, 255, .1);
}

.start-hero h1 {
  max-width: 790px;
  margin: 0;
  font-size: clamp(44px, 6vw, 84px);
  line-height: 1.1;
}

.start-hero h1 span { color: #65d8ff; }

.start-hero p {
  max-width: 690px;
  margin: 24px 0 0;
  color: #cae4f3;
  font-size: 15px;
  line-height: 2.15;
}

.start-flow {
  display: grid;
  gap: 12px;
}

.start-flow article {
  display: grid;
  grid-template-columns: 44px 1fr;
  gap: 13px;
  padding: 17px;
  border: 1px solid rgba(154, 221, 250, .13);
  border-radius: 20px;
  background: rgba(255, 255, 255, .055);
  backdrop-filter: blur(12px);
}

.start-flow i {
  grid-row: span 2;
  display: grid;
  place-items: center;
  width: 44px;
  height: 44px;
  border-radius: 15px;
  background: rgba(86, 209, 255, .13);
  color: #82e4ff;
  font-style: normal;
  font-weight: 800;
}

.start-flow b { font-size: 13px; }
.start-flow span { color: #bcd5e5; font-size: 11px; line-height: 1.8; }

.start-form-section { padding: 88px 0 110px; }

.start-form-shell {
  display: grid;
  grid-template-columns: minmax(260px, .65fr) minmax(0, 1.35fr);
  overflow: hidden;
  border: 1px solid #dcecf5;
  border-radius: 34px;
  background: #fff;
  box-shadow: 0 30px 90px rgba(4, 40, 114, .12);
}

.start-form-side {
  position: relative;
  padding: 48px 38px;
  background:
    radial-gradient(circle at 0 100%, rgba(68, 205, 255, .24), transparent 34%),
    linear-gradient(155deg, #03143d, #052b67);
  color: #fff;
}

.start-form-side small { color: #68dcff; font-size: 10px; letter-spacing: .11em; }
.start-form-side h2 { margin: 17px 0 14px; font-size: clamp(26px, 3vw, 38px); line-height: 1.45; }
.start-form-side > p { color: #c4ddec; font-size: 12px; line-height: 2; }

.start-promises {
  display: grid;
  gap: 11px;
  margin-top: 30px;
}

.start-promises span {
  display: flex;
  align-items: center;
  gap: 9px;
  color: #d8eef8;
  font-size: 11px;
  line-height: 1.8;
}

.start-promises span::before {
  content: "✓";
  display: grid;
  place-items: center;
  flex: 0 0 23px;
  width: 23px;
  height: 23px;
  border-radius: 9px;
  background: rgba(92, 221, 255, .12);
  color: #71e3ff;
}

.start-lead-form {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 17px;
  padding: 48px 44px;
}

.start-field {
  display: flex;
  flex-direction: column;
  gap: 8px;
}

.start-field.full { grid-column: 1 / -1; }
.start-field label, .start-interest legend { color: #335674; font-size: 11px; font-weight: 700; }

.start-field input,
.start-field select,
.start-field textarea {
  width: 100%;
  padding: 14px 15px;
  border: 1px solid #d6e8f3;
  border-radius: 16px;
  outline: 0;
  background: #fbfdff;
  color: #061c3c;
  font: inherit;
  font-size: 13px;
  transition: border-color .2s, box-shadow .2s, transform .2s;
}

.start-field textarea { min-height: 120px; resize: vertical; }

.start-field input:focus,
.start-field select:focus,
.start-field textarea:focus {
  border-color: #49bfea;
  box-shadow: 0 0 0 4px rgba(0, 169, 239, .09);
  transform: translateY(-1px);
}

.start-interest {
  grid-column: 1 / -1;
  margin: 0;
  padding: 0;
  border: 0;
}

.start-interest-options {
  display: flex;
  flex-wrap: wrap;
  gap: 9px;
  margin-top: 10px;
}

.start-interest-option { position: relative; }
.start-interest-option input { position: absolute; opacity: 0; pointer-events: none; }
.start-interest-option span {
  display: inline-flex;
  padding: 10px 14px;
  border: 1px solid #d8eaf4;
  border-radius: 999px;
  background: #f9fcfe;
  color: #31546f;
  cursor: pointer;
  font-size: 11px;
  transition: .2s;
}

.start-interest-option input:focus-visible + span { outline: 3px solid rgba(0, 169, 239, .22); }
.start-interest-option input:checked + span { border-color: #159dcc; background: #e9f8ff; color: #075982; }

.start-submit {
  grid-column: 1 / -1;
  justify-self: start;
  min-width: 235px;
  padding: 14px 22px;
  border: 0;
  border-radius: 16px;
  background: linear-gradient(135deg, #098dcc, #042872);
  box-shadow: 0 14px 30px rgba(4, 40, 114, .2);
  color: #fff;
  cursor: pointer;
  font: inherit;
  font-size: 12px;
  font-weight: 800;
}

@media (max-width: 900px) {
  .start-hero-grid, .start-form-shell { grid-template-columns: 1fr; }
  .start-flow { grid-template-columns: repeat(3, 1fr); }
  .start-flow article { grid-template-columns: 1fr; }
  .start-flow i { grid-row: auto; }
}

@media (max-width: 620px) {
  .start-hero { padding: 125px 0 64px; }
  .start-hero-grid { gap: 40px; }
  .start-flow { grid-template-columns: 1fr; }
  .start-flow article { grid-template-columns: 44px 1fr; }
  .start-flow i { grid-row: span 2; }
  .start-form-section { padding: 55px 0 80px; }
  .start-form-shell { border-radius: 24px; }
  .start-form-side { padding: 35px 24px; }
  .start-lead-form { grid-template-columns: 1fr; padding: 34px 22px; }
  .start-field.full, .start-interest, .start-submit { grid-column: auto; }
  .start-submit { width: 100%; }
}

@media (prefers-reduced-motion: reduce) {
  .start-field input,
  .start-field select,
  .start-field textarea,
  .start-interest-option span { transition: none; }
}
