/* Booking pop-up, inline picker and "Get your agent plan" form (card 1·F).
   Self-contained: it is also loaded on the 7 kept Webflow pages, which don't have design.css.
   Look: HOME-PAGE-SHORT-PREVIEW.html (.picker, .pk-*, .plan) and the working session's booking stand-in. */
.bk{--bk-blue:#2D5FFF;--bk-blue-d:#1F49E0;--bk-ink:#0F1729;--bk-sub:#4A5568;--bk-line:#E3E8F0;--bk-pale:#EEF3FF;--bk-green:#0E9F6E;--bk-greenbg:#E8F7F0;
  font-family:Inter,system-ui,-apple-system,"Segoe UI",sans-serif;color:var(--bk-ink);text-align:left;line-height:1.4}
.bk *,.bk *::before,.bk *::after{box-sizing:border-box}
.bk p{margin:0;line-height:1.5}

/* the pop-up */
.bk-modal{border:0;border-radius:16px;padding:26px;width:480px;max-width:calc(100vw - 32px);max-height:calc(100dvh - 32px);overflow:auto;
  background:#fff;color:#0F1729;box-shadow:0 20px 50px rgba(13,27,62,.25);font-family:Inter,system-ui,-apple-system,"Segoe UI",sans-serif}
.bk-modal::backdrop{background:rgba(13,27,62,.55)}
.bk-close{position:absolute;right:10px;top:6px;margin:0}
.bk-close button{border:0;background:none;font-size:28px;line-height:1;cursor:pointer;color:#667085;padding:6px 8px;font-family:inherit}
.bk-close button:hover{color:#0F1729}
.bk-close button:focus:not(:focus-visible){outline:none}

/* the inline card (the home page's final call to action) */
.bk.picker{background:#fff;color:var(--bk-ink);border-radius:16px;padding:22px;box-shadow:0 20px 50px rgba(10,30,110,.35)}

.bk .bk-eyebrow{font-size:13px;font-weight:700;color:var(--bk-blue);text-transform:uppercase;letter-spacing:.06em;margin:0 0 10px}
.bk .bk-title{font-size:24px;line-height:1.2;letter-spacing:-.01em;margin:0 0 16px;color:var(--bk-ink)}
.bk .pk-head{display:flex;justify-content:space-between;align-items:baseline;gap:8px;margin-bottom:14px}
.bk .pk-head b{font-size:18px}
.bk .pk-head span{font-size:13px;color:var(--bk-sub)}
.bk .pk-days{display:grid;grid-template-columns:repeat(var(--n,4),1fr);gap:8px}
.bk .pk-days button,.bk .pk-times button{font:inherit;border:1.5px solid var(--bk-line);background:#fff;border-radius:10px;cursor:pointer;color:var(--bk-ink);margin:0;min-width:0}
.bk .pk-days button{padding:8px 0;font-size:13px;line-height:1.3}
.bk .pk-days button b{display:block;font-size:18px}
.bk .pk-times{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;margin:12px 0 6px}
.bk .pk-times button{padding:9px 0;font-size:14px;font-weight:600;white-space:nowrap}
.bk .pk-days button:hover,.bk .pk-times button:hover{border-color:var(--bk-blue)}
.bk .pk-days button.on,.bk .pk-times button.on{border-color:var(--bk-blue);background:var(--bk-pale);color:var(--bk-blue)}
.bk .bk-tz{font-size:12px;color:var(--bk-sub);margin:0 0 14px}
.bk .bk-status{font-size:14px;color:var(--bk-sub);padding:18px 0}
.bk .pk-note{font-size:13px;color:var(--bk-sub);margin:10px 0 0;text-align:center}

/* buttons: the design's .btn / .btn.big / .btn.ghost */
.bk .bk-btn{display:block;width:100%;text-align:center;background:var(--bk-blue);color:#fff;font-family:inherit;font-size:17px;font-weight:600;line-height:1.2;padding:16px 30px;border-radius:10px;border:0;cursor:pointer;text-decoration:none;margin:0}
.bk .bk-btn:hover{background:var(--bk-blue-d)}
.bk .bk-btn:disabled{opacity:.6;cursor:default}
.bk .bk-btn.bk-ghost{display:inline-block;width:auto;background:#fff;color:var(--bk-blue);border:1.5px solid var(--bk-blue);font-size:16px;padding:14px 22px;margin-top:16px}
.bk .bk-btn.bk-ghost:hover{background:var(--bk-pale)}
.bk .bk-link{color:var(--bk-blue);font-weight:600;text-decoration:none;cursor:pointer}

/* step 2 */
.bk .bk-picked{display:flex;justify-content:space-between;align-items:center;gap:12px;background:var(--bk-pale);border-radius:12px;padding:12px 16px;margin:0 0 14px;font-size:15px}
.bk .bk-change{font-size:13px;font-weight:600;color:var(--bk-blue);text-decoration:none;flex-shrink:0}
.bk label{display:block;font-size:14px;font-weight:600;color:var(--bk-ink);margin:0 0 12px}
.bk input,.bk textarea,.bk select{display:block;width:100%;margin:6px 0 0;padding:10px 12px;border:1px solid #CBD5E1;border-radius:8px;font:15px Inter,system-ui,sans-serif;color:var(--bk-ink);background:#fff;height:auto}
.bk input:focus,.bk textarea:focus,.bk select:focus{outline:0;border-color:var(--bk-blue);box-shadow:0 0 0 3px rgba(45,95,255,.15)}
.bk .bk-form .bk-btn{margin-top:4px}
.bk .bk-error{background:#FFDEDE;color:#991B1B;border-radius:8px;padding:10px 14px;font-size:14px;font-weight:500;margin:0 0 14px}
.bk .bk-error[hidden]{display:none}

/* done */
.bk .bk-done{text-align:center;padding:12px 0}
.bk .bk-check{display:flex;align-items:center;justify-content:center;width:56px;height:56px;border-radius:50%;background:var(--bk-greenbg);color:var(--bk-green);font-size:28px;margin:0 auto 14px}
.bk .bk-done h3{font-size:24px;margin:0 0 8px;color:var(--bk-ink)}
.bk .bk-done p{color:var(--bk-sub);margin:0 0 6px}
.bk .bk-done .bk-when{color:var(--bk-ink);font-weight:600}

/* the plan form (the design's .plan) */
.bk.bk-plan{background:#fff;border:1px solid var(--bk-line);border-radius:14px;padding:24px;color:var(--bk-ink)}
.bk.bk-plan h3{font-size:22px;margin:0 0 6px;color:var(--bk-ink)}
.bk.bk-plan form>p{color:var(--bk-sub);margin:0 0 14px}
.bk.bk-plan .bk-error{margin:4px 0 0}

@media (max-width:480px){
  .bk-modal{padding:22px 16px}
  .bk .pk-days{gap:6px}
  .bk .pk-times{grid-template-columns:repeat(3,1fr)}
  .bk .pk-days button b{font-size:16px}
}

/* the kept Webflow pages: their old booking buttons, now plain buttons that open this pop-up */
.bk-legacy-book:hover{background:#1A4AE6 !important}