#apply {
  margin-top: clamp(72px, 9vw, 120px);
  padding: clamp(12px, 3.4vw, 48px);
  display: flex;
  flex-wrap: wrap;
  gap: 24px;
  align-items: stretch;
  border-radius: var(--radius-sm);
}
.apply__main {
  flex: 3 1 560px;
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 24px;
}
.apply__intro {
  display: flex;
  flex-direction: column;
  gap: 16px;
  padding: clamp(8px, 1.6vw, 16px) clamp(4px, 1.6vw, 16px) 0;
}
.apply__intro h2 {
  margin: 0;
  font: 600 clamp(36px, 4.4vw, 56px) / 1 var(--font-sans);
  letter-spacing: var(--ls-display);
}
.apply__intro p {
  margin: 0;
  max-width: 480px;
  font: 400 var(--fs-load) / var(--lh-body) var(--font-sans);
  text-wrap: pretty;
}
.apply__card {
  flex: 1;
  padding: clamp(24px, 3.4vw, 40px);
  border-radius: var(--radius-sm);
  background: var(--sb-white);
}

/* ---- form ---- */
#lead-form {
  display: flex;
  flex-direction: column;
  gap: 24px;
}
#lead-form[hidden] {
  display: none;
}
.form__grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 240px), 1fr));
  gap: 20px 24px;
}
.field {
  display: flex;
  flex-direction: column;
  gap: 8px;
  min-width: 0;
  border: 0;
  margin: 0;
  padding: 0;
}
.field__label {
  padding: 0;
  font: var(--type-body-strong);
}
.field__error {
  font: 400 14px / 1.3 var(--font-sans);
  color: var(--sb-marker-red);
}
.field__error:empty {
  display: none;
}

.input {
  width: 100%;
  height: var(--control-h);
  padding: 10px 14px;
  border: 0;
  border-radius: var(--radius-sm);
  outline: none;
  background: var(--surface-input);
  box-shadow: var(--ring-input);
  font: var(--type-body);
  color: var(--text-primary);
}
.input::placeholder {
  color: var(--text-placeholder);
}
.input:focus-visible {
  box-shadow: var(--ring-brand);
}
textarea.input {
  height: 120px;
  resize: none;
}
.is-invalid .input {
  box-shadow: var(--ring-error);
}

.select {
  position: relative;
  display: block;
}
.select select {
  padding-right: 40px;
  appearance: none;
  -webkit-appearance: none;
  cursor: pointer;
}
.select select:invalid {
  color: var(--text-placeholder); /* placeholder option selected */
}
.select::after {
  content: "";
  position: absolute;
  right: 14px;
  top: 14px;
  width: 16px;
  height: 16px;
  background: url(../assets/icons/chevron-left.svg) center / contain no-repeat;
  transform: rotate(-90deg);
  pointer-events: none;
}

/* area choice: radio inputs styled as pills */
.pills {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(120px, 1fr));
  gap: 8px;
}
.pill {
  position: relative;
  display: block;
}
.pill input {
  position: absolute;
  inset: 0;
  margin: 0;
  opacity: 0;
  cursor: pointer;
}
.pill span {
  display: flex;
  align-items: center;
  justify-content: center;
  height: var(--control-h);
  border-radius: var(--radius-pill);
  box-shadow: var(--ring-tabs);
  font: var(--type-body);
  white-space: nowrap;
  transition: background var(--dur-fast), color var(--dur-fast);
}
.pill input:checked + span {
  background: var(--sb-blue);
  color: var(--sb-white);
  box-shadow: var(--ring-brand);
}
.pill input:focus-visible + span {
  outline: 2px solid var(--sb-blue);
  outline-offset: 2px;
}
.is-invalid .pill span {
  box-shadow: var(--ring-error);
}

.form__footer {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 20px;
}
.consent {
  flex: 1 1 280px;
  display: flex;
  flex-direction: column;
  gap: 6px;
}
.consent label {
  display: flex;
  align-items: flex-start;
  gap: 12px;
  cursor: pointer;
  font: var(--type-body);
}
.consent input {
  width: 20px;
  height: 20px;
  margin: 2px 0 0;
  flex-shrink: 0;
  accent-color: var(--sb-blue);
  cursor: pointer;
}
.consent a {
  color: inherit;
  text-decoration: underline;
  text-underline-offset: 3px;
}
.consent .field__error {
  padding-left: 32px;
}
.form__status {
  margin: 0;
  font: 400 14px / 1.3 var(--font-sans);
  color: var(--text-muted);
}
.form__status.is-error {
  color: var(--sb-marker-red);
}
.form__status:empty {
  display: none;
}
#lead-form button[disabled] {
  opacity: 0.6;
  cursor: default;
}

.form__done {
  min-height: 320px;
  display: flex;
  flex-direction: column;
  justify-content: center;
  gap: 16px;
  outline: none;
}
.form__done[hidden] {
  display: none;
}
.form__done .circle-arrow {
  width: 56px;
  height: 56px;
}
.form__done strong {
  font: 600 32px / 1.1 var(--font-sans);
  letter-spacing: var(--ls-tight);
}
.form__done span {
  font: 400 var(--fs-load) / var(--lh-body) var(--font-sans);
}

/* ---- side card ---- */
.apply__side {
  flex: 2 1 300px;
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 8px;
  padding: 8px;
  border-radius: var(--radius-sm);
  background: var(--sb-white);
}
.apply__photo {
  flex: 1;
  min-height: 240px;
  border-radius: var(--radius-sm);
  background: var(--surface-placeholder) url(../assets/images/view-from-office.jpg) center 45% / cover no-repeat;
}
.apply__contacts {
  display: flex;
  flex-direction: column;
  gap: 20px;
  padding: 24px 20px 20px;
}
.apply__contacts h3 {
  margin: 0;
  font: var(--type-h3);
  letter-spacing: var(--ls-tight);
}
.contact-list {
  display: flex;
  flex-direction: column;
  gap: 14px;
  margin: 0;
  padding: 0;
  list-style: none;
}
.contact-list li {
  display: flex;
  align-items: center;
  gap: 14px;
  font: var(--type-body);
}
.contact-list a {
  color: var(--text-primary);
}
.contact-list a:hover {
  color: var(--sb-blue);
}
.contact-list .contact-list__phone {
  font: 600 var(--fs-lead) / 1.2 var(--font-sans);
  white-space: nowrap;
}