/* ============================================================
   Cadence — homepage booking (Frank's Calendly + the lead form)
   Desktop (>980px): calendar card beside the form (option A).
   Phones/tablets: tabs switch between the two (option B), but only
   once js/cadence-book.js adds .is-tabbed. Without JS both stack,
   so the form is never stranded behind a dead tab.
   ============================================================ */
.bk-split{margin-top:26px}

.bk-card{background:var(--cream-50);border:1px solid var(--border-gold);border-radius:var(--radius-xl);
  padding:22px 18px 8px;box-shadow:0 18px 50px rgba(0,0,0,.45);overflow:hidden}
.bk-card-head{padding:0 6px 10px;color:var(--ink-900)}
.bk-card-head .bk-eyebrow{font:600 11px/1 var(--font-mono);letter-spacing:.16em;text-transform:uppercase;color:var(--gold-700)}
.bk-card-head h3{font-family:var(--font-display);font-size:clamp(1.3rem,2.2vw,1.65rem);margin:10px 0 6px;color:var(--ink-900)}
.bk-card-head p{margin:0;color:var(--ink-500);font-size:15px}
.bk-card .calendly-inline-widget{min-width:0;height:700px}

/* Shown without JS, or when Calendly fails to load (.bk-failed). */
.bk-fallback{margin-top:14px;color:var(--text-muted);font-size:14px}
.bk-fallback a{color:var(--accent);text-decoration:underline}
html.js .bk-split:not(.bk-failed) .bk-fallback{display:none}

.bk-tabs{display:none}
.bk-tab{appearance:none;-webkit-appearance:none;border:0;cursor:pointer;border-radius:var(--radius-pill);
  padding:12px 22px;font:600 15px/1.2 var(--font-sans);background:transparent;color:var(--text-body)}
.bk-tab.is-on{background:var(--accent);color:var(--ink-900)}
.bk-tab:focus-visible{outline:2px solid var(--accent);outline-offset:2px}

.bk-t-mob{display:none}

@media(min-width:981px){
  .bk-split{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,1fr);gap:28px;align-items:start}
}

@media(max-width:980px){
  .bk-t-desk{display:none}
  .bk-t-mob{display:inline}
  .bk-pane-call{max-width:980px}
  .bk-pane-form{max-width:640px}
  .bk-split:not(.is-tabbed) .bk-pane-form{margin-top:28px}
  .bk-split.is-tabbed .bk-tabs{display:inline-flex;gap:6px;padding:6px;border-radius:var(--radius-pill);
    background:var(--surface-raised);border:1px solid var(--border-strong);margin-bottom:22px}
  .bk-split.is-tabbed[data-active="call"] .bk-pane-form,
  .bk-split.is-tabbed[data-active="form"] .bk-pane-call{display:none}
}

@media(max-width:560px){
  .bk-split.is-tabbed .bk-tabs{display:flex;width:100%}
  .bk-tab{flex:1 1 0;padding:12px 10px;font-size:14px}
  .bk-card{padding:18px 8px 4px}
  .bk-card-head{padding:0 8px 10px}
}