/* Book a walkthrough. Builds on site.css. */
.bk-page{position:relative;min-height:100svh;padding:132px 0 96px;isolation:isolate}
.bk-page::before{content:"";position:fixed;inset:0;z-index:-1;background:url(/img/bokeh-1920.webp) center/cover;opacity:.38}
.bk-page::after{content:"";position:fixed;inset:0;z-index:-1;background:radial-gradient(70% 60% at 30% 0%,rgba(4,7,10,.25),var(--bg) 78%)}
.bk-grid{display:grid;grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr);gap:clamp(32px,5vw,80px);align-items:start}
.bk-intro{position:sticky;top:110px;display:grid;gap:22px}
.bk-intro h1{font-family:var(--display);font-weight:400;font-size:clamp(34px,3.8vw,56px);line-height:1.04;letter-spacing:-.03em}
.host{display:grid;grid-template-columns:56px 1fr;gap:14px;align-items:center;padding:16px 18px}
.host img{width:56px;height:56px;border-radius:14px;object-fit:cover}
.host b{display:block;font-weight:500}
.host span{font-size:13.5px;color:var(--muted)}
.facts{display:grid;gap:10px;font-size:15.5px;color:var(--ink-2)}
.facts li{display:grid;grid-template-columns:22px 1fr;gap:10px;align-items:center}
.facts li::before{content:"";width:7px;height:7px;border-radius:50%;background:rgba(var(--glow),.9);box-shadow:0 0 10px rgba(var(--glow),.7);justify-self:center}
.bk-intro .aside{font-size:14.5px;color:var(--muted)}
.bk-intro .aside a{color:var(--ink)}

.panel{padding:clamp(20px,3vw,32px);min-height:520px}
.step-head{display:flex;justify-content:space-between;align-items:baseline;gap:12px;margin-bottom:18px}
.step-head h2{font-family:var(--display);font-weight:400;font-size:24px;letter-spacing:-.01em}
.step-head .mono{color:var(--dim)}

/* calendar */
.cal-month{display:flex;justify-content:space-between;align-items:center;margin-bottom:12px;font-family:var(--display);font-size:18px}
.cal{display:grid;grid-template-columns:repeat(7,1fr);gap:6px}
.cal .dow{font-family:var(--mono);font-size:10.5px;letter-spacing:.06em;text-transform:uppercase;color:var(--dim);text-align:center;padding-bottom:6px}
.day{aspect-ratio:1;border-radius:12px;border:1px solid transparent;background:none;color:var(--dim);font-size:15px;display:grid;place-items:center;position:relative}
.day.open{cursor:pointer;color:var(--ink);background:rgba(255,255,255,.04);border-color:var(--line)}
.day.open::after{content:"";position:absolute;bottom:7px;width:4px;height:4px;border-radius:50%;background:rgba(var(--glow),.9);box-shadow:0 0 6px rgba(var(--glow),.8)}
.day.open:hover{border-color:rgba(var(--glow),.5)}
.day.sel{background:var(--warm);color:#16130d;border-color:var(--warm)}
.day.sel::after{background:#16130d;box-shadow:none}
.day.today{outline:1px dashed var(--line-2);outline-offset:-4px}
.day.blank{visibility:hidden}
@media (max-width:560px){.cal{gap:4px}.day{font-size:13.5px;border-radius:9px;padding-bottom:6px}.day.open::after{bottom:4px;width:3px;height:3px}}

.times-wrap{margin-top:24px;padding-top:20px;border-top:1px solid var(--line)}
.times-wrap h3{font-size:16px;font-weight:500;margin-bottom:12px}
.times{display:grid;grid-template-columns:repeat(auto-fill,minmax(112px,1fr));gap:8px}
.time{padding:11px 10px;border-radius:10px;border:1px solid var(--line-2);background:rgba(255,255,255,.03);color:var(--ink);font-size:14.5px;cursor:pointer;transition:border-color .15s,background .15s}
.time:hover{border-color:rgba(var(--glow),.6);background:rgba(var(--glow),.06)}
.time small{display:block;font-size:11px;color:var(--dim);margin-top:2px}
.tz{margin-top:14px;font-size:13px;color:var(--dim)}

/* details */
.picked{display:flex;justify-content:space-between;align-items:center;gap:12px;padding:14px 16px;border-radius:var(--r-sm);background:rgba(var(--glow),.07);border:1px solid rgba(var(--glow),.25);margin-bottom:18px}
.picked b{font-weight:500;display:block}
.picked span{font-size:13.5px;color:var(--muted)}
.linkish{background:none;border:0;color:var(--ink);text-decoration:underline;text-underline-offset:4px;cursor:pointer;font-size:14px;padding:4px}
.bk-form{display:grid;gap:14px}
.two{display:grid;grid-template-columns:1fr 1fr;gap:14px}
@media (max-width:560px){.two{grid-template-columns:1fr}}
.how{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.how label{display:flex;align-items:center;gap:10px;padding:12px 14px;border-radius:var(--r-sm);border:1px solid var(--line-2);background:rgba(0,0,0,.2);cursor:pointer;font-size:15px}
.how input{accent-color:#f4e6cc;width:auto;flex:none;margin:0;padding:0}
.how label:has(input:checked){border-color:rgba(var(--glow),.7);background:rgba(var(--glow),.07)}
.bk-err{color:var(--leak);font-size:14px;min-height:1.2em}
.fine{font-size:12.5px;color:var(--dim)}

/* done */
.done-box{display:grid;gap:16px;justify-items:start;padding:12px 0}
.done-box .ring{width:56px;height:56px;border-radius:50%;display:grid;place-items:center;border:1px solid rgba(var(--glow),.8);box-shadow:0 0 0 8px rgba(var(--glow),.06),0 0 30px rgba(var(--glow),.35)}
.done-box h2{font-family:var(--display);font-weight:400;font-size:clamp(28px,3vw,38px);letter-spacing:-.02em;line-height:1.1}
.done-box p{color:var(--ink-2);max-width:34em}
.loading{color:var(--muted);font-size:15px;padding:40px 0;text-align:center}
@media (max-width:900px){.bk-grid{grid-template-columns:1fr}.bk-intro{position:static}.panel{min-height:0}}