/* Booking landing page — hero, rebate callout, patient steps, download cards.
   The booking FORM moved to the portal (portal.conference.care/book, CC-1568); this page links
   to it, so all form/lookup/feedback styles are gone with it. */

/* Hero sits under the fixed header */
.bk-hero { padding-top: 128px; }

/* --- Notes --- */
.form-note { font-size: var(--text-sm); color: var(--color-ink-soft); text-align: center; margin-top: var(--space-xs); }

/* --- Rebate callout --- */
.rebate-callout {
  display: flex; align-items: center; gap: var(--space-s);
  padding: var(--space-s) var(--space-m); background: var(--brand-50);
  border: 1px solid var(--color-border-soft); border-radius: var(--radius-xl);
}
.rebate-amount {
  font-size: var(--text-3xl, 2.5rem); font-weight: var(--weight-extrabold);
  color: var(--color-primary); letter-spacing: -0.02em; flex: none;
}
.rebate-text { font-size: var(--text-sm); line-height: 1.5; color: var(--color-ink); }
.rebate-text a { color: var(--color-primary); }

/* --- Choosing-the-patient steps --- */
.step-list {
  list-style: none; counter-reset: step; margin: 0; padding: 0;
  display: flex; flex-direction: column; gap: var(--space-s);
}
.step-list > li {
  counter-increment: step; position: relative;
  /* left inset clears the 32px number badge (+ its --space-m offset) */
  padding: var(--space-m) var(--space-m) var(--space-m) calc(var(--space-m) * 2 + 32px);
  background: var(--color-surface); border: 1px solid var(--color-border-soft);
  border-radius: var(--radius-xl);
}
.step-list > li::before {
  content: counter(step);
  position: absolute; left: var(--space-m); top: var(--space-m);
  width: 32px; height: 32px;
  display: flex; align-items: center; justify-content: center;
  background: var(--color-primary); color: var(--brand-25);
  border-radius: var(--radius-full);
  font-size: var(--text-md); font-weight: var(--weight-bold);
}
.step-list > li h3 { font-size: var(--text-md); margin: var(--space-3xs) 0 var(--space-2xs); }
.step-list > li p { font-size: var(--text-md); color: var(--color-ink); margin: 0 0 var(--space-2xs); }
.step-list > li p:last-child { margin-bottom: 0; }

/* Condition chips inside step 1 */
.cond-chips {
  list-style: none; margin: 0 0 var(--space-xs); padding: 0;
  display: flex; flex-wrap: wrap; gap: var(--space-2xs);
}
.cond-chips li {
  padding: var(--space-3xs) var(--space-xs);
  background: var(--brand-50); border: 1px solid var(--color-border-soft);
  border-radius: var(--radius-full);
  font-size: var(--text-sm); font-weight: var(--weight-semibold); color: var(--color-secondary);
}

/* --- Download cards --- */
.dl-list { display: flex; flex-direction: column; gap: var(--space-s); }
.dl-card {
  display: flex; align-items: center; gap: var(--space-m);
  padding: var(--space-m); background: var(--color-surface);
  border: 1px solid var(--color-border-soft); border-radius: var(--radius-xl);
}
.dl-card .chip-ic { flex: none; }
.dl-card-body { flex: 1; }
.dl-card-body h3 { font-size: var(--text-md); margin: 0 0 var(--space-3xs); }
.dl-card-body p { font-size: var(--text-sm); color: var(--color-ink-soft); margin: 0; }
.dl-card.is-soon { opacity: .65; }
.dl-card.is-soon .btn { pointer-events: none; }

@media (max-width: 540px) {
  .dl-card { flex-direction: column; align-items: flex-start; }
  .step-list > li { padding-left: var(--space-m); padding-top: calc(var(--space-m) * 2 + 32px); }
  .cond-chips li { font-size: var(--text-2xs, 11px); }
}

/* --- Numbered cards (patient-consent trio) --- */
.num-card { position: relative; padding-top: var(--space-l, var(--space-m)); }
.card-num {
  position: absolute; top: calc(-1 * 16px); left: var(--space-m);
  width: 32px; height: 32px;
  display: flex; align-items: center; justify-content: center;
  background: var(--color-primary); color: var(--brand-25);
  border-radius: var(--radius-full);
  font-size: var(--text-md); font-weight: var(--weight-bold);
  box-shadow: var(--shadow-1, 0 1px 3px rgba(0,0,0,.15));
}

/* --- Consent ownership brackets (span 1-2 = GP, 3 = Conference.care) --- */
.consent-owners { margin-top: var(--space-s); row-gap: var(--space-2xs); }
.consent-owner {
  position: relative; margin: 0; padding-top: var(--space-2xs);
  border-top: 2px solid var(--color-primary);
  text-align: center;
  font-size: var(--text-sm); font-weight: var(--weight-semibold); color: var(--color-secondary);
}
.consent-owner::before, .consent-owner::after {
  content: ''; position: absolute; top: -7px; width: 2px; height: 9px;
  background: var(--color-primary);
}
.consent-owner::before { left: 0; }
.consent-owner::after { right: 0; }
@media (max-width: 760px) {
  .consent-owner { grid-column: auto !important; }
}

/* --- Contact modal form (compact, self-contained — the page form styles were removed) --- */
.ct-lede { font-size: var(--text-sm); color: var(--color-ink-soft); margin: 0 0 var(--space-s); }
.ct-form { display: flex; flex-direction: column; gap: var(--space-s); }
.ct-row { display: grid; grid-template-columns: 1fr 1fr; gap: var(--space-s); }
.ct-group { display: flex; flex-direction: column; gap: var(--space-3xs); }
.ct-group label { font-size: var(--text-sm); font-weight: var(--weight-bold); color: var(--color-secondary); }
.req { color: var(--color-primary); }
.req-note { font-size: var(--text-xs); font-weight: var(--weight-semibold); color: var(--color-ink-soft); }
.ct-group input, .ct-group textarea {
  font: inherit; font-size: var(--text-md); color: var(--color-ink);
  padding: var(--space-2xs) var(--space-xs);
  border: 1px solid var(--color-border); border-radius: var(--radius-lg);
  background: var(--color-surface);
}
.ct-group input:focus, .ct-group textarea:focus {
  outline: none; border-color: var(--color-primary);
  box-shadow: 0 0 0 3px oklch(from var(--color-primary) l c h / 0.15);
}
.ct-feedback { padding: var(--space-xs) var(--space-s); border-radius: var(--radius-lg); font-size: var(--text-sm); font-weight: var(--weight-semibold); }
.ct-feedback.is-ok { background: oklch(from var(--color-success) 95% 0.02 h); color: var(--color-success); border: 1px solid oklch(from var(--color-success) 85% 0.04 h); }
.ct-feedback.is-err { background: oklch(from var(--color-danger) 96% 0.02 h); color: var(--color-danger); border: 1px solid oklch(from var(--color-danger) 85% 0.05 h); }
@media (max-width: 540px) { .ct-row { grid-template-columns: 1fr; } }

/* --- Download buttons: btn-ghost is a dark-background style (white on translucent white) —
   on the white dl-cards it was literally invisible. Light-surface variant, scoped here. --- */
.dl-card .btn-ghost {
  color: var(--color-primary);
  background: var(--brand-50);
  border: 1.5px solid var(--color-primary);
  backdrop-filter: none;
}
.dl-card .btn-ghost:hover { background: var(--brand-25, var(--brand-50)); }