/* ═══ BOOKING ════════════════════════════════════════════════════
   Two steps in one panel: the intake, then the calendar — which
   lives inside the site rather than throwing anyone out to Calendly.
   ═════════════════════════════════════════════════════════════ */

.book{ position:fixed; inset:0; z-index:110; display:grid; }
.book[hidden]{ display:none; }

.book__scrim{
  position:absolute; inset:0;
  background:rgba(var(--scrim),.74);
  -webkit-backdrop-filter:blur(14px) saturate(.8);
          backdrop-filter:blur(14px) saturate(.8);
  opacity:0; transition:opacity .5s var(--ease);
}
.book.is-open .book__scrim{ opacity:1; }

.book__panel{
  position:relative;
  justify-self:center; align-self:center;
  width:min(980px, calc(100vw - clamp(16px,4vw,64px)));
  max-height:calc(100svh - clamp(16px,4vw,56px));
  overflow:auto; overscroll-behavior:contain;
  border-radius:var(--radius);
  background:var(--ground-lift);
  border:1px solid var(--rule);
  box-shadow:var(--glass-edge), 0 60px 140px -40px rgba(0,0,0,.6);
  padding:clamp(26px,3.4vw,54px);
  opacity:0; transform:translateY(46px) scale(.985);
  transition:opacity .55s var(--ease-out), transform .7s var(--ease-out);
}
.book.is-open .book__panel{ opacity:1; transform:none; }

.book__x{
  position:absolute; top:clamp(14px,1.6vw,22px); right:clamp(14px,1.6vw,22px);
  width:40px; height:40px; display:grid; place-items:center;
  border:1px solid var(--rule); border-radius:50%;
  color:var(--ice-soft);
  transition:color .35s var(--ease), border-color .35s var(--ease), rotate .5s var(--ease-out);
  z-index:2;
}
.book__x:hover{ color:var(--signal); border-color:var(--rule-hot); rotate:90deg; }
.book__x svg{ width:13px; }

/* ── steps ────────────────────────────────────────────────────── */
.book__step{ transition:opacity .45s var(--ease), transform .55s var(--ease-out); }
.book__step[hidden]{ display:none; }
.book__step.is-leaving{ opacity:0; transform:translateX(-26px); }
.book__step.is-entering{ opacity:0; transform:translateX(26px); }

.book__head{ display:grid; gap:clamp(12px,1.4vw,18px); margin-bottom:clamp(24px,3vw,38px); max-width:46ch; }
.book__head .title{ font-size:clamp(1.5rem,3.2vw,2.5rem); color:var(--ice); }
.book__head .lead{ font-size:var(--t-small); max-width:52ch; }
.book__head--row{
  display:flex; align-items:flex-end; justify-content:space-between;
  gap:20px; max-width:none; flex-wrap:wrap;
}

/* ── the form ─────────────────────────────────────────────────── */
.form{ display:grid; gap:clamp(16px,1.8vw,24px); }
.form__grid{ display:grid; gap:clamp(14px,1.6vw,20px); }
@media (min-width:680px){ .form__grid{ grid-template-columns:1fr 1fr; } }

.field{ display:grid; gap:9px; min-width:0; }
.field--wide{ grid-column:1 / -1; }
.field > span, .field legend{
  font-family:var(--f-mono); font-size:var(--t-micro); font-weight:300;
  letter-spacing:var(--track-mono); text-transform:uppercase;
  color:var(--ice-faint);
}
.field input, .field select{
  width:100%;
  background:rgba(var(--ice-rgb),.04);
  border:1px solid var(--rule);
  border-radius:var(--radius-sm);
  padding:14px 16px;
  color:var(--ice);
  font-size:var(--t-small);
  transition:border-color .3s var(--ease), background .3s var(--ease), box-shadow .3s var(--ease);
}
.field select{
  appearance:none;
  background-image:linear-gradient(45deg,transparent 50%,var(--ice-faint) 50%),
                   linear-gradient(135deg,var(--ice-faint) 50%,transparent 50%);
  background-position:calc(100% - 20px) 50%, calc(100% - 14px) 50%;
  background-size:6px 6px, 6px 6px;
  background-repeat:no-repeat;
  padding-right:42px;
}
.field select option{ background:var(--ground-lift); color:var(--ice); }
.field input::placeholder{ color:var(--ice-ghost); }
.field input:focus, .field select:focus{
  outline:none; border-color:var(--rule-hot);
  background:rgba(143,216,240,.06);
  box-shadow:0 0 0 3px rgba(143,216,240,.12);
}
.field.is-bad input, .field.is-bad select, .field.is-bad .choice{ border-color:#E4707C; }
.field__err{
  font-family:var(--f-mono); font-size:var(--t-micro); font-weight:300;
  letter-spacing:.12em; text-transform:uppercase; color:#E4707C;
  height:0; overflow:hidden; transition:height .25s var(--ease);
}
.field.is-bad .field__err{ height:1.4em; }

fieldset.field{ border:0; padding:0; margin:0; }
.choice{
  display:flex; gap:10px; flex-wrap:wrap;
  border:1px solid transparent; border-radius:var(--radius-sm);
}
.choice label{
  display:inline-flex; align-items:center; gap:10px;
  padding:13px 20px;
  border:1px solid var(--rule); border-radius:99px;
  font-size:var(--t-small); color:var(--ice-soft);
  cursor:pointer;
  transition:border-color .3s var(--ease), color .3s var(--ease), background .3s var(--ease);
}
.choice input{ appearance:none; width:13px; height:13px; border-radius:50%; border:1px solid var(--rule-lit); margin:0; }
.choice label:hover{ border-color:var(--rule-lit); color:var(--ice); }
.choice input:checked{ background:var(--signal); border-color:var(--signal); box-shadow:inset 0 0 0 3px var(--ground-lift); }
.choice label:has(input:checked){ border-color:var(--rule-hot); color:var(--ice); background:rgba(143,216,240,.07); }

.form__note{
  font-family:var(--f-mono); font-size:var(--t-micro); font-weight:300;
  letter-spacing:.13em; text-transform:uppercase; color:var(--ice-ghost);
}
.form__submit{ display:flex; align-items:center; gap:18px; flex-wrap:wrap; }

/* ── the calendar, inside the site ────────────────────────────── */
.book__cal{
  position:relative;
  border:1px solid var(--rule); border-radius:var(--radius-sm);
  overflow:hidden;
  background:rgba(var(--ice-rgb),.03);
  min-height:min(640px, 70svh);
}
.book__cal iframe{
  display:block; width:100%; height:min(680px, 74svh); border:0;
  opacity:0; transition:opacity .6s var(--ease);
}
.book__cal.is-ready iframe{ opacity:1; }
.book__calLoad{
  position:absolute; inset:0; display:grid; place-content:center; justify-items:center; gap:16px;
  font-family:var(--f-mono); font-size:var(--t-micro); font-weight:300;
  letter-spacing:var(--track-mono); text-transform:uppercase; color:var(--ice-ghost);
  transition:opacity .4s var(--ease);
}
.book__cal.is-ready .book__calLoad{ opacity:0; pointer-events:none; }
.book__calLoad i{
  width:34px; height:34px; border-radius:50%;
  border:1px solid var(--rule); border-top-color:var(--signal);
  animation:spin 1s linear infinite;
}
@keyframes spin{ to{ transform:rotate(360deg); } }
.book__fallback{
  margin-top:14px;
  font-family:var(--f-mono); font-size:var(--t-micro); font-weight:300;
  letter-spacing:.13em; text-transform:uppercase; color:var(--ice-ghost);
}
.book__fallback a{ color:var(--signal); }

@media (prefers-reduced-motion: reduce){
  .book__panel, .book__scrim, .book__step{ transition-duration:.01ms; }
  .book__calLoad i{ animation:none; }
}