/* ---------- online booking (Square) ---------- */
.book-online{
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  justify-content:space-between;
  gap:20px 32px;
  padding:28px 32px;
  margin:0 0 18px;
  border:1px solid var(--line-strong);
  border-radius:18px;
  background:rgba(255,255,255,.3);
}
.book-online__text{ flex:1 1 320px; }
.book-online__title{
  font-family:'Cormorant Garamond', Georgia, serif;
  font-weight:500;
  font-size:1.7rem;
  line-height:1.15;
  margin:0 0 .3em;
  color:var(--ink);
}
.book-online__text p{ margin:0; color:var(--ink-dim); font-size:.95rem; }
.book-online__btn{ flex-shrink:0; }
.book-online__or{
  text-align:center;
  margin:0 0 40px;
  font-size:.74rem;
  letter-spacing:.14em;
  text-transform:uppercase;
  color:var(--ink-dim);
}
@media (max-width:560px){
  .book-online{ padding:22px 20px; }
  .book-online__btn{ width:100%; justify-content:center; }
}

/* the window */
.sq-modal{
  width:min(560px, calc(100vw - 32px));
  height:min(820px, calc(100dvh - 48px));
  max-width:none;
  max-height:none;
  padding:0;
  border:0;
  border-radius:16px;
  overflow:hidden;
  background:#fff;
  box-shadow:var(--shadow);
}
.sq-modal[open]{ display:flex; flex-direction:column; }
.sq-modal::backdrop{ background:rgba(13,9,6,.55); backdrop-filter:blur(2px); }
.sq-modal__bar{
  display:flex;
  align-items:center;
  justify-content:space-between;
  padding:10px 10px 10px 22px;
  background:var(--cream);
  border-bottom:1px solid var(--line);
}
.sq-modal__title{
  font-family:'Inter', sans-serif;
  font-size:.74rem;
  font-weight:500;
  letter-spacing:.16em;
  text-transform:uppercase;
  color:var(--ink);
}
.sq-modal__close{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:40px; height:40px;
  border:0; border-radius:50%;
  background:transparent;
  color:var(--ink);
  cursor:pointer;
}
.sq-modal__close:hover{ background:rgba(0,0,0,.06); }
.sq-modal__frame{ flex:1; width:100%; border:0; }
html.sq-lock{ overflow:hidden; }

@media (max-width:560px){
  .sq-modal{ width:100vw; height:100dvh; border-radius:0; }
}

/* booking button under a page intro (extensions page) */
.page-intro-cta{ margin:28px 0 32px; }