.lead-form {
  display: grid;
  gap: var(--space-4);
}

.form-fields {
  display: grid;
  gap: var(--space-3);
}

.form-field {
  display: grid;
  gap: var(--space-2);
}

.form-field label {
  color: var(--color-surface);
  font-size: 0.75rem;
  font-weight: 800;
  letter-spacing: 0.02em;
}

.form-field input,
.form-field select,
.form-field textarea {
  inline-size: 100%;
  min-block-size: 3rem;
  border: 1px solid rgb(255 255 255 / 28%);
  border-radius: var(--radius-sm);
  background: rgb(0 0 0 / 24%);
  color: var(--color-surface);
  padding: 0.75rem 0.875rem;
}

.form-field select {
  color-scheme: light;
}

.form-field select option {
  background: var(--color-surface);
  color: var(--color-text);
}

.form-field select option:checked {
  background: var(--color-brand-yellow);
  color: var(--color-brand-charcoal);
}

.form-field textarea {
  min-block-size: 5.5rem;
  resize: vertical;
}

.form-field input::placeholder,
.form-field textarea::placeholder {
  color: var(--color-brand-silver);
}

.form-field input:focus-visible,
.form-field select:focus-visible,
.form-field textarea:focus-visible {
  border-color: var(--color-brand-yellow);
}

.form-submit {
  inline-size: 100%;
}

.lead-form .form-submit {
  border-color: var(--color-brand-yellow);
  background: var(--color-brand-yellow);
  color: var(--color-brand-charcoal);
  box-shadow:
    inset 0 1px 0 rgb(255 255 255 / 35%),
    0 0.35rem 0 var(--color-brand-yellow-strong),
    0 0.8rem 1.5rem rgb(0 0 0 / 36%);
}

.lead-form .form-submit:hover,
.lead-form .form-submit:focus-visible {
  border-color: var(--color-surface);
  background: var(--color-surface);
  color: var(--color-brand-charcoal);
}

@media (width <= 40rem) and (height <= 44rem) {
  .form-fields,
  .lead-form {
    gap: var(--space-2);
  }

  .form-field {
    gap: 0.375rem;
  }

  .form-field input,
  .form-field select,
  .form-field textarea {
    min-block-size: 2.75rem;
    padding-block: 0.5rem;
  }

  .form-feedback {
    min-block-size: 0;
  }
}

.form-feedback {
  min-block-size: 1.5rem;
}