/* "Work with me": heading, optional VSL, form beside the booking calendar. */
.work main { max-width: 1200px; margin: 0 auto; padding: 0 var(--gutter) 72px; }
.work-head { max-width: 760px; padding: clamp(28px, 5vw, 64px) 0 32px; }
.work-head h1 { font-size: clamp(34px, 4.6vw, 54px); margin: 16px 0 16px; }
.work-lede { font-size: 18px; color: var(--muted); margin: 0; }
.work-vsl { margin-bottom: 32px; }
.work-vsl iframe { width: 100%; aspect-ratio: 16 / 9; border: 0; border-radius: var(--radius-lg); box-shadow: var(--shadow); }

.work-grid { display: grid; grid-template-columns: minmax(280px, 380px) 1fr; gap: 24px; align-items: start; }
.work-grid h2 { font-size: 19px; display: flex; align-items: center; gap: 10px; margin-bottom: 18px; }
.work-grid h2 span { font: 600 11px/1 var(--head); letter-spacing: .12em; color: var(--sage); }
.work-form, .work-book { background: var(--surface); border: 1px solid var(--line); border-radius: var(--radius-lg); padding: 26px; }
.work-form label { display: block; font: 500 13px/1.3 var(--head); color: var(--muted); margin-bottom: 16px; }
.work-form input { display: block; width: 100%; margin-top: 6px; padding: 12px 14px; border: 1.5px solid var(--line);
  border-radius: 10px; background: var(--bg); font-size: 15.5px; color: var(--ink); transition: border-color .2s, background .2s; }
.work-form input:focus { outline: none; border-color: var(--teal); background: #fff; }
.work-form .btn { width: 100%; }
.work-error { min-height: 20px; color: var(--red); font-size: 14px; margin: 0 0 8px; }
.work-done { margin: 0; padding: 14px; border-radius: 10px; background: var(--green-bg); color: var(--teal); font-weight: 500; }

.work-frame { min-height: 520px; border-radius: 10px; overflow: hidden; background: var(--bg); }
.work-frame iframe { display: block; width: 100%; height: 640px; border: 0; }
.work-frame p { margin: 0; height: 520px; display: grid; place-items: center; text-align: center; padding: 24px; color: var(--muted);
  border: 1.5px dashed var(--sand); border-radius: 10px; }
.work-book.is-locked h2 { opacity: .55; }

@media (max-width: 860px) { .work-grid { grid-template-columns: 1fr; } .work-frame p { height: 220px; } .work-frame { min-height: 0; } }