body { background: var(--sand-cool); }
  .booking-shell { max-width: 1200px; margin: 0 auto; padding: 40px 32px 120px; }
  .booking-layout { display: grid; grid-template-columns: 220px 1fr 340px; gap: 40px; align-items: start; }
  @media (max-width: 1100px) { .booking-layout { grid-template-columns: 1fr; } .stepper, .summary { display: none; } }

  /* Stepper */
  .stepper { position: sticky; top: 100px; align-self: start; }
  .stepper h5 { font-family: var(--font-mono); font-size: 11px; letter-spacing: 0.15em; text-transform: uppercase; color: var(--muted); margin: 0 0 24px; }
  .stepper .step { display: flex; align-items: flex-start; gap: 12px; padding: 8px 0; cursor: pointer; }
  .stepper .step .n { flex-shrink: 0; width: 28px; height: 28px; border-radius: 50%; background: var(--sand-warm); color: var(--muted); display: flex; align-items: center; justify-content: center; font-family: var(--font-mono); font-size: 12px; }
  .stepper .step.done .n { background: var(--forest); color: var(--sand); }
  .stepper .step.done .n::before { content: '✓'; }
  .stepper .step.done .n > span { display: none; }
  .stepper .step.active .n { background: var(--gold); color: var(--white); }
  .stepper .step .label { font-size: 13px; padding-top: 4px; color: var(--muted); }
  .stepper .step.active .label { color: var(--forest-deep); font-weight: 600; }
  .stepper .step.done .label { color: var(--forest-deep); }
  .stepper .connect { width: 2px; height: 16px; background: var(--line); margin-left: 13px; }
  .stepper .step.done + .connect { background: var(--forest); }

  /* Main step content */
  .step-panel {
    background: var(--white); border: 1px solid var(--line); border-radius: var(--r-4);
    padding: 40px;
    display: none;
  }
  .step-panel.active { display: block; }
  .step-panel h2 { font-size: 36px; margin-bottom: 8px; }
  .step-panel .step-lede { color: var(--muted); font-size: 15px; margin-bottom: 32px; max-width: 60ch; }
  .step-num { font-family: var(--font-mono); font-size: 11px; color: var(--gold); letter-spacing: 0.1em; text-transform: uppercase; margin-bottom: 12px; display: block; }

  .step-actions { display: flex; justify-content: space-between; align-items: center; margin-top: 40px; padding-top: 24px; border-top: 1px solid var(--line); }

  /* Option cards */
  .option-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 16px; }
  @media (max-width: 700px) { .option-grid { grid-template-columns: 1fr; } }
  .option-card {
    padding: 24px;
    border: 1px solid var(--line);
    border-radius: var(--r-3);
    cursor: pointer;
    transition: all .15s;
    display: flex; gap: 16px; align-items: flex-start;
  }
  .option-card:hover { border-color: var(--gold-soft); background: var(--sand-cool); }
  .option-card.selected { border-color: var(--forest); background: var(--sand-cool); }
  .option-card .radio { flex-shrink: 0; width: 20px; height: 20px; border-radius: 50%; border: 2px solid var(--line); position: relative; }
  .option-card.selected .radio { border-color: var(--forest); }
  .option-card.selected .radio::after { content: ''; position: absolute; inset: 4px; background: var(--forest); border-radius: 50%; }
  .option-card h4 { font-size: 18px; margin: 0 0 4px; }
  .option-card .m { font-size: 13px; color: var(--muted); }
  .option-card .price-tag { margin-top: 8px; font-family: var(--font-display); color: var(--forest); font-size: 18px; }

  /* Duration cards */
  .duration-cards { display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; }
  @media (max-width: 700px) { .duration-cards { grid-template-columns: 1fr; } }
  .dur-card { padding: 32px; border: 1px solid var(--line); border-radius: var(--r-3); text-align: center; cursor: pointer; transition: all .15s; }
  .dur-card:hover { border-color: var(--gold-soft); }
  .dur-card.selected { border-color: var(--forest); background: var(--forest); color: var(--sand); }
  .dur-card .time { font-family: var(--font-display); font-size: 56px; line-height: 1; }
  .dur-card.selected .time { color: var(--sand); }
  .dur-card .time small { font-family: var(--font-mono); font-size: 12px; letter-spacing: 0.1em; text-transform: uppercase; }
  .dur-card .p { margin-top: 12px; font-family: var(--font-display); font-size: 22px; color: var(--forest); }
  .dur-card.selected .p { color: var(--gold-soft); }
  .dur-card .rec { font-size: 12px; color: var(--muted); margin-top: 8px; }

  /* Therapist selection */
  .therapist-select-list { display: grid; grid-template-columns: repeat(2, 1fr); gap: 12px; margin-top: 12px; }
  @media (max-width: 700px) { .therapist-select-list { grid-template-columns: 1fr; } }
  .t-select { display: flex; gap: 12px; align-items: center; padding: 12px; border: 1px solid var(--line); border-radius: var(--r-3); cursor: pointer; }
  .t-select:hover { border-color: var(--gold-soft); }
  .t-select.selected { border-color: var(--forest); background: var(--sand-cool); }
  .t-select .ph { width: 56px; height: 56px; border-radius: 50%; flex-shrink: 0; }
  .t-select h5 { font-size: 15px; margin: 0 0 2px; }
  .t-select .m { font-size: 12px; color: var(--muted); }

  /* Date & time */
  .cal-container { display: grid; grid-template-columns: 1fr 1fr; gap: 24px; }
  @media (max-width: 700px) { .cal-container { grid-template-columns: 1fr; } }
  .cal-box, .slots-box { padding: 20px; border: 1px solid var(--line); border-radius: var(--r-3); }
  .cal-h { display: flex; justify-content: space-between; align-items: center; margin-bottom: 16px; }
  .cal-h h5 { font-size: 15px; margin: 0; }
  .cal-grid-b { display: grid; grid-template-columns: repeat(7, 1fr); gap: 4px; text-align: center; }
  .cal-grid-b .h { font-family: var(--font-mono); font-size: 10px; color: var(--muted); padding: 6px 0; }
  .cal-grid-b .d { padding: 10px 0; font-size: 14px; border-radius: var(--r-2); cursor: pointer; }
  .cal-grid-b .d:hover { background: var(--sand-warm); }
  .cal-grid-b .d.selected { background: var(--forest); color: var(--sand); }
  .cal-grid-b .d.disabled { color: var(--muted-2); text-decoration: line-through; cursor: not-allowed; }
  .time-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 8px; }
  .time-slot { padding: 12px 8px; text-align: center; border: 1px solid var(--line); border-radius: var(--r-2); font-family: var(--font-mono); font-size: 13px; cursor: pointer; }
  .time-slot.selected { background: var(--forest); color: var(--sand); border-color: var(--forest); }
  .time-slot.busy { opacity: 0.3; text-decoration: line-through; }

  /* Summary panel */
  .summary { position: sticky; top: 100px; align-self: start; background: var(--white); border: 1px solid var(--line); border-radius: var(--r-4); padding: 28px; }
  .summary h5 { font-family: var(--font-mono); font-size: 11px; letter-spacing: 0.15em; text-transform: uppercase; color: var(--muted); margin: 0 0 20px; }
  .summary .item { display: flex; justify-content: space-between; padding: 10px 0; font-size: 14px; border-bottom: 1px dashed var(--line-soft); }
  .summary .item .k { color: var(--muted); }
  .summary .total { display: flex; justify-content: space-between; padding-top: 16px; margin-top: 12px; border-top: 1px solid var(--line); align-items: baseline; }
  .summary .total .k { font-family: var(--font-mono); font-size: 12px; letter-spacing: 0.1em; text-transform: uppercase; color: var(--muted); }
  .summary .total .v { font-family: var(--font-display); font-size: 32px; color: var(--forest); }
  .summary .discount { color: var(--gold); }

  /* Location fields */
  .map-preview { aspect-ratio: 16/9; margin-top: 12px; border-radius: var(--r-3); }

  /* Payment options */
  .payment-cards { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; margin-bottom: 24px; }
  @media (max-width: 700px) { .payment-cards { grid-template-columns: 1fr; } }

  /* Confirmation */
  .confirmation { text-align: center; padding: 40px 0; }
  .confirmation .check { width: 80px; height: 80px; border-radius: 50%; background: var(--forest); color: var(--sand); display: flex; align-items: center; justify-content: center; margin: 0 auto 24px; font-size: 40px; }
  .confirmation h2 { font-size: 48px; margin-bottom: 12px; }
  .booking-ref { display: inline-block; padding: 8px 16px; background: var(--sand-warm); border-radius: var(--r-3); font-family: var(--font-mono); letter-spacing: 0.05em; margin-top: 12px; }
  .confirm-details { text-align: left; max-width: 500px; margin: 40px auto; padding: 32px; border: 1px solid var(--line); border-radius: var(--r-4); background: var(--sand-cool); }
  .confirm-details .row { display: flex; justify-content: space-between; padding: 10px 0; border-bottom: 1px solid var(--line); font-size: 14px; }
  .confirm-details .row:last-child { border-bottom: 0; }
  .confirm-details .k { color: var(--muted); }

  .timeline-mini { display: flex; align-items: center; gap: 8px; margin-top: 32px; justify-content: center; }
  .timeline-mini .step-mini { display: flex; align-items: center; gap: 8px; font-size: 12px; }
  .timeline-mini .dot { width: 10px; height: 10px; }

  /* Guest banner */
  .guest-banner { background: var(--forest); color: var(--sand); padding: 20px 24px; border-radius: var(--r-3); margin-bottom: 24px; display: flex; justify-content: space-between; align-items: center; }
  .guest-banner .m { font-size: 13px; opacity: 0.85; }