/* ===== Запись на приём ===== */
.booking { background: var(--brand); color: #fff; position: relative; overflow: hidden; }
.booking::before {
  content: ""; position: absolute; width: 520px; height: 520px; border-radius: 50%;
  left: -160px; bottom: -260px; background: radial-gradient(circle, rgba(255, 229, 154, .35), transparent 70%);
}
.booking__grid { position: relative; display: grid; grid-template-columns: minmax(0, 1fr) minmax(320px, 460px); gap: clamp(32px, 6vw, 96px); align-items: center; }
.booking__lead { margin-top: 20px; font-size: 18px; color: rgba(255, 255, 255, .82); max-width: 30em; }
.booking__points { margin-top: 28px; display: grid; gap: 12px; }
.booking__points li { display: flex; gap: 12px; align-items: center; font-weight: 500; }
.booking__points li::before {
  content: "✓"; width: 28px; height: 28px; flex: none; border-radius: 50%;
  display: grid; place-items: center; background: rgba(255, 255, 255, .16); font-size: 14px;
}

.form { background: #fff; color: var(--ink); border-radius: var(--r-xl); padding: clamp(24px, 3vw, 36px); box-shadow: 0 40px 80px -30px rgba(20, 16, 60, .6); display: grid; gap: 16px; }
.field { display: grid; gap: 6px; min-width: 0; }
.field label { font-size: 14px; font-weight: 600; }
.field .opt { font-weight: 400; color: var(--ink-3); }
.field input, .field select {
  width: 100%; min-width: 0; height: 54px; padding: 0 16px; border-radius: 14px; border: 1.5px solid var(--line);
  background: var(--brand-50); outline: none; transition: border-color .2s, background .2s;
}
.field select { padding-right: 40px; text-overflow: ellipsis; appearance: none; background-image: linear-gradient(45deg, transparent 50%, var(--ink-3) 50%), linear-gradient(135deg, var(--ink-3) 50%, transparent 50%); background-position: calc(100% - 22px) 24px, calc(100% - 16px) 24px; background-size: 6px 6px; background-repeat: no-repeat; }
.field input:focus, .field select:focus { border-color: var(--brand); background: #fff; }
.field.is-error input { border-color: var(--coral); background: #FFF3F2; }
.check { display: flex; gap: 12px; align-items: flex-start; font-size: 14px; line-height: 1.45; cursor: pointer; }
.check input { width: 20px; height: 20px; margin: 0; flex: none; accent-color: var(--brand); }
.check a { color: var(--brand); }
.check.is-error span { color: #D6453B; }
.form .btn--accent { background: var(--brand); color: #fff; margin-top: 4px; }
.form .btn--accent:hover { background: var(--brand-600); }
.form__status { font-size: 14px; min-height: 1.4em; }
.form__status.is-ok { color: #1E8E5A; font-weight: 600; }
.form__status.is-err { color: #D6453B; }

@media (max-width: 980px) { .booking__grid { grid-template-columns: minmax(0, 1fr); } }
