/* Arcos quick form (assets/book.js, build/src/book-template.html). A full-screen sheet on a
   phone, a 560px dialog from 760px up, inline on /book. Glass rows and wells; the dialog's
   glass and the step springs are late (motion.css). */
html.bk-open,html:has(dialog.bk-dlg[open]){overflow:hidden}
.bk [hidden]{display:none!important}

/* ---------- the dialog ---------- */
.bk-dlg{padding:0;border:0;margin:auto;width:560px;max-width:calc(100vw - 32px);max-height:min(860px,calc(100vh - 48px));
  max-height:min(860px,calc(100dvh - 48px));border-radius:20px;background:var(--bone);color:var(--ink);box-shadow:var(--sh-lg);overflow:hidden}
.bk-dlg[open]{display:flex}
.bk-dlg::backdrop{background:rgba(6,9,16,.64)}
.bk-dlg:has(.is-cal){height:min(860px,calc(100vh - 48px));height:min(860px,calc(100dvh - 48px))}
.bk-sheet{display:flex;flex-direction:column;flex:1 1 auto;width:100%;min-height:0}
@media (max-width:759px){
  .bk-dlg{width:100%;max-width:none;height:100%;height:100dvh;max-height:none;margin:0;border-radius:0;box-shadow:none}
  .bk-dlg:has(.is-cal){height:100%;height:100dvh}
}

.bk-top{flex:none;display:flex;align-items:center;justify-content:space-between;gap:1rem;min-height:58px;padding:.4rem .45rem .4rem 1.4rem}
.bk-count{font-size:.92rem;font-weight:600;color:var(--grey);letter-spacing:-.005em}
.bk-x{flex:none;display:grid;place-items:center;width:46px;height:46px;border-radius:12px;color:var(--ink);transition:background-color .15s var(--ease)}
.bk-x:hover{background:var(--bone-2)}
.bk-bar{flex:none;height:3px;background:rgba(15,18,22,.1);border-radius:3px;overflow:hidden}
.bk-bar i{display:block;height:100%;border-radius:inherit;background:linear-gradient(90deg,#6CA0FF,#1358E0 60%);transform:scaleX(.25);transform-origin:left;transition:transform .9s var(--spring-soft)}

.bk-form{display:flex;flex-direction:column;flex:1 1 auto;min-height:0}
.bk-body{flex:1 1 auto;min-height:0;padding:1.5rem 1.4rem 1.7rem;overflow-y:auto;overscroll-behavior:contain;-webkit-overflow-scrolling:touch}
/* the step and the pane heading take focus only so a screen reader starts there; no ring on plain text */
.bk-step:focus,.bk-step:focus-visible,.bk-h:focus,.bk-h:focus-visible{outline:none;box-shadow:none}
.bk-nav{flex:none;display:flex;gap:.6rem;padding:.75rem 1.4rem calc(.75rem + env(safe-area-inset-bottom));border-top:1px solid var(--line)}
.bk-nav .btn{min-height:52px}
.bk-nav .btn:hover{transform:none}
.bk-next{flex:1 1 auto}
.bk-back.btn-ghost{flex:none;padding-inline:1.35rem;border-color:transparent;background:linear-gradient(180deg,#fff,rgba(255,255,255,.7));
  box-shadow:inset 0 1px 0 #fff,inset 0 0 0 1px rgba(15,18,22,.12),0 10px 24px -14px rgba(15,18,22,.45)}
.bk-next:disabled{opacity:.6;cursor:default}

/* ---------- questions ---------- */
.bk-q{min-width:0;margin:0 0 1.7rem;padding:0;border:0}
.bk-q:last-child{margin-bottom:0}
.bk-l{display:block;float:none;width:100%;margin:0 0 .75rem;padding:0;font-size:1.05rem;font-weight:600;line-height:1.4;letter-spacing:-.012em;color:var(--ink)}
.bk-hint{display:block;margin-top:.2rem;font-size:.9rem;font-weight:400;line-height:1.45;color:var(--grey)}
.bk-opts{display:grid;gap:.5rem}
.bk-o{position:relative;display:flex;align-items:center;gap:.75rem;min-height:54px;padding:.7rem 1rem;border:1.5px solid rgba(15,18,22,.1);border-radius:16px;
  background:linear-gradient(180deg,#fff,rgba(255,255,255,.72));box-shadow:inset 0 1px 0 #fff,0 1px 2px rgba(15,18,22,.05);
  font-size:1rem;line-height:1.35;cursor:pointer;transition:border-color .15s var(--ease),box-shadow .3s var(--ease),transform .5s var(--spring-gel)}
.bk-o:hover{border-color:rgba(15,18,22,.3)}
.bk-o:active{transform:scale(.985);transition-duration:.15s,.3s,var(--t-tap)}
/* the real input covers its whole row, so the tap target is the row */
.bk-o input{position:absolute;inset:0;width:100%;height:100%;margin:0;opacity:0;cursor:pointer}
.bk-dot{position:relative;flex:none;width:20px;height:20px;border:2px solid rgba(15,18,22,.34);border-radius:50%;transition:border-color .15s var(--ease)}
.bk-box .bk-dot{border-radius:6px}
.bk-dot::after{content:"";position:absolute;inset:3px;border-radius:50%;background:var(--blue);transform:scale(0);transition:transform .5s var(--spring-gel)}
.bk-box .bk-dot::after{border-radius:2px}
.bk-o input:checked~.bk-dot{border-color:var(--blue)}
.bk-o input:checked~.bk-dot::after{transform:scale(1)}
.bk-o:has(input:checked){border-color:var(--blue);background:linear-gradient(180deg,#F5F9FF,#E6EEFD);box-shadow:inset 0 1px 0 #fff,0 0 0 3px rgba(19,88,224,.1),0 12px 26px -16px rgba(19,88,224,.55)}
.bk-o input:focus-visible~.bk-dot{outline:3px solid var(--blue);outline-offset:3px}

.bk-fields{display:grid;gap:1rem}
.bk-fl{display:block;margin-bottom:.4rem;font-size:.95rem;font-weight:600}
.bk-fl .bk-hint{display:inline;margin:0 0 0 .35rem;font-size:.88rem}
.bk-in{display:block;width:100%;min-height:54px;padding:.85rem 1rem;border:1.5px solid rgba(15,18,22,.12);border-radius:14px;color:var(--ink);
  background:linear-gradient(180deg,rgba(255,255,255,.96),#fff);box-shadow:inset 0 1px 3px rgba(15,18,22,.07);
  font:inherit;font-size:1rem;line-height:1.35;transition:border-color .15s var(--ease),box-shadow .15s var(--ease)}
textarea.bk-in{min-height:108px;line-height:1.5;resize:vertical}
select.bk-in{appearance:none;-webkit-appearance:none;padding-right:2.7rem;cursor:pointer;background-repeat:no-repeat;background-position:right 1rem center;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='9' fill='none'%3E%3Cpath d='M1 1l6 6 6-6' stroke='%235C6068' stroke-width='2' stroke-linecap='round'/%3E%3C/svg%3E")}
.bk-in::placeholder{color:rgba(15,18,22,.42)}
.bk-in:focus{outline:none;border-color:var(--blue);box-shadow:inset 0 1px 3px rgba(15,18,22,.05),0 0 0 3px rgba(19,88,224,.2)}
.bk-in[aria-invalid="true"]{border-color:#B3261E}
.bk-err{margin-top:.55rem;font-size:.93rem;font-weight:500;color:#B3261E}
.bk-consent{margin-top:1.5rem;font-size:.87rem;line-height:1.55;color:var(--grey)}
.bk-fine{margin-top:.8rem;font-size:.9rem;line-height:1.5;color:var(--grey)}
.bk-fine a[href^="tel:"]{white-space:nowrap}
.bk-fine a,.bk-lede a{color:var(--blue-deep);text-decoration:underline;text-underline-offset:3px;text-decoration-thickness:1px}
.bk-hp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}

/* ---------- after the form: the calendar, or not yet ---------- */
.bk-h{font-size:clamp(1.55rem,4.8vw,2rem);letter-spacing:-.042em;line-height:1.08;outline:none}
.bk-h3{margin:1.7rem 0 0;font-size:1.18rem;letter-spacing:-.028em}
.bk-lede{margin-top:.75rem;line-height:1.6;color:#2A2F38}
.bk-steps{margin-top:1.1rem;border-top:1px solid var(--line)}
.bk-steps li{padding:.95rem 0;border-bottom:1px solid var(--line)}
.bk-steps b{display:block;font-weight:600;line-height:1.4}
.bk-steps p{margin-top:.3rem;font-size:.97rem;line-height:1.55;color:var(--grey)}
.bk-res[data-bk-pane="book"]{display:flex;flex-direction:column;padding-bottom:1rem}
/* no frame of our own: the widget draws its own box, and a box around it would nest one card in another */
.bk-cal{flex:1 1 auto;min-height:0;margin:1rem -.2rem 0;overflow:hidden;border-radius:14px;background:#fff}
.bk-frame{display:block;width:100%;height:100%;min-height:540px;border:0}
.bk-res[data-bk-pane="book"] .bk-fine{flex:none}

/* ---------- inline, on /book ---------- */
.bk--inline{max-width:640px;border-top:1px solid var(--line)}
/* on /book: a card of milk glass */
.js .pg--book .book-inline{padding:.35rem clamp(1.1rem,3vw,1.8rem) .5rem;border-top:0;border-radius:28px;
  background:linear-gradient(180deg,rgba(255,255,255,.84),rgba(255,255,255,.6));
  box-shadow:inset 0 1.5px 0 #fff,inset 0 -1px 0 rgba(15,18,22,.05),inset 0 0 0 1px rgba(255,255,255,.7),0 1px 2px rgba(15,18,22,.06),0 34px 70px -40px rgba(15,18,22,.45)}
.bk--inline .bk-top{min-height:48px;padding-inline:0}
.bk--inline .bk-x{display:none}
.bk--inline .bk-body{padding-inline:0;overflow:visible}
.bk--inline .bk-nav{padding-inline:0;padding-bottom:.75rem}
.bk--inline .bk-cal{flex:none}
.bk--inline .bk-frame{height:860px}
@media (min-width:760px){.bk--inline .bk-frame{height:740px}}

@media (prefers-reduced-motion:reduce){.bk-bar i,.bk-o,.bk-dot,.bk-dot::after,.bk-in{transition:none}.bk-o:active{transform:none}}

/* until book.js has drawn the form, hold its step-1 height so the fallback list swapping for it moves nothing below (CLS) */
.js .book-inline:not(.bk){min-height:678px}
@media (min-width:760px){.js .book-inline:not(.bk){min-height:620px}}
