:root {
  --booking-max-width: 72rem;
  --booking-content-width: 58rem;
  --booking-section-gap: clamp(1.75rem, 4vw, 3.25rem);
  --booking-card-radius: 1.25rem;
  --booking-control-gap: 1rem;
  --booking-sticky-offset: 0px;
  --booking-profile-size: 7rem;
  --booking-surface: #fffdf9;
  --booking-muted-surface: #f4efe7;
  --booking-ink: #294b3a;
  --booking-accent: #185a40;
  --booking-highlight: #b87559;
  --booking-border: rgba(61, 52, 45, 0.14);
  --booking-shadow: 0 1.125rem 3rem rgba(61, 52, 45, 0.09);
}

.system-content:has(.booking-shell) { background: var(--booking-muted-surface); }
.public-topbar { background: var(--booking-surface); position: sticky; top: 0; z-index: 20; }
.booking-shell { color: #3d342d; min-height: 50vh; }
.booking-shell__header { background: rgba(244, 239, 231, 0.97); border-bottom: 1px solid var(--booking-border); position: sticky; top: var(--booking-sticky-offset); z-index: 12; }
.booking-header__inner, .booking-progress__list, .booking-shell__main { margin-inline: auto; width: min(calc(100% - 2.5rem), var(--booking-max-width)); }
.booking-header__inner { padding-block: 1.35rem 1rem; }
.booking-header__eyebrow { color: var(--booking-highlight); font-size: .75rem; font-weight: 800; letter-spacing: .12em; margin: 0 0 .35rem; text-transform: uppercase; }
.booking-header__title { color: var(--booking-ink); font-size: clamp(1.65rem, 3.5vw, 2.65rem); line-height: 1.1; margin: 0; }
.booking-header__context { color: #685c52; margin: .45rem 0 0; max-width: 46rem; }
.booking-shell__main { display: grid; gap: var(--booking-section-gap); padding-block: clamp(2rem, 5vw, 4.5rem); }
.booking-shell__section { min-width: 0; }
.booking-intro { max-width: var(--booking-content-width); }
.booking-intro h2 { color: var(--booking-ink); margin-bottom: .65rem; }

.booking-progress { background: var(--booking-ink); color: #fff; }
.booking-progress__list { display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); list-style: none; margin-block: 0; padding-block: .9rem .8rem; }
.booking-progress__item { color: rgba(255,255,255,.58); min-width: 0; position: relative; text-align: center; }
.booking-progress__connector { background: rgba(255,255,255,.2); height: 1px; left: calc(-50% + 1.4rem); position: absolute; right: calc(50% + 1.4rem); top: .95rem; }
.booking-progress__item:first-child .booking-progress__connector { display: none; }
.booking-progress__item.is-complete .booking-progress__connector, .booking-progress__item.is-active .booking-progress__connector { background: rgba(255,255,255,.7); }
.booking-progress__marker { align-items: center; background: rgba(255,255,255,.1); border: 1px solid rgba(255,255,255,.22); border-radius: 50%; display: inline-flex; font-size: .8rem; font-weight: 800; height: 1.9rem; justify-content: center; position: relative; width: 1.9rem; z-index: 1; }
.booking-progress__label { display: block; font-size: .78rem; font-weight: 650; margin-top: .35rem; overflow-wrap: normal; }
.booking-progress__item.is-complete { color: rgba(255,255,255,.88); }
.booking-progress__item.is-complete .booking-progress__marker { background: rgba(255,255,255,.2); }
.booking-progress__item.is-active { color: #fff; }
.booking-progress__item.is-active .booking-progress__marker { background: var(--booking-highlight); border-color: var(--booking-highlight); box-shadow: 0 0 0 .2rem rgba(184,117,89,.25); }

.booking-card, .booking-product { background: var(--booking-surface); border: 1px solid var(--booking-border); border-radius: var(--booking-card-radius); box-shadow: var(--booking-shadow); padding: clamp(1.4rem, 4vw, 2.65rem); }
.booking-form, .booking-card { max-width: var(--booking-content-width); }
.booking-products { display: grid; gap: 1.5rem; grid-template-columns: repeat(auto-fit, minmax(min(100%, 20rem), 1fr)); }
.booking-product { display: flex; flex-direction: column; max-width: none; }
.booking-product-card { overflow: hidden; padding: 0; }
.booking-product-card__banner { background: #b87559; color: #fff; font-weight: 800; margin: 0; padding: .7rem 1rem; text-align: center; }
.booking-product-card__image { aspect-ratio: 16 / 9; display: block; object-fit: cover; width: 100%; }
.booking-product-card__body { display: flex; flex: 1; flex-direction: column; padding: clamp(1.4rem, 4vw, 2.25rem); }
.booking-product__header { color: var(--booking-highlight); font-size: .8rem; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; }
.booking-product__title { color: var(--booking-ink); }
.booking-product__meta { margin-top: auto; padding-top: 1rem; }
.booking-product .booking-actions { margin-top: 1rem; }

.booking-field-group { display: grid; gap: 1.35rem; grid-template-columns: repeat(2, minmax(0,1fr)); }
.booking-field--full { grid-column: 1 / -1; }
.booking-field { display: grid; gap: .45rem; }
.booking-field__label { color: var(--booking-ink); font-weight: 750; }
.booking-field__control { border: 1px solid var(--booking-border); border-radius: .7rem; margin: 0; min-height: 3rem; padding: .7rem .8rem; }
textarea.booking-field__control { min-height: 7rem; resize: vertical; }
.booking-field__help { color: #75695f; font-size: .88rem; }
.booking-field__error { margin-block: 1.25rem; }
.booking-contact__remember { align-items: flex-start; background: var(--booking-muted-surface); border-radius: .8rem; display: flex; gap: .75rem; margin-top: 1.5rem; padding: 1rem; }
.booking-contact__remember input { height: 1.15rem; margin-top: .25rem; width: 1.15rem; }
.booking-secondary-action { margin-top: 1rem; }

.booking-practitioner { display: grid; gap: 1.5rem; margin-bottom: 2rem; }
.booking-practitioner__profile { align-items: center; background: var(--booking-muted-surface); border: 1px solid var(--booking-border); border-radius: 1rem; display: grid; gap: 1.4rem; grid-template-columns: var(--booking-profile-size) 1fr; padding: 1.25rem; }
.booking-practitioner__media { height: var(--booking-profile-size); width: var(--booking-profile-size); }
.booking-practitioner__image, .booking-practitioner__image-fallback { aspect-ratio: 1; border-radius: 50%; height: 100%; width: 100%; }
.booking-practitioner__image { object-fit: cover; }
.booking-practitioner__image-fallback { align-items: center; background: #e8ddcb; display: flex; font-size: .78rem; justify-content: center; padding: .75rem; text-align: center; }
.booking-practitioner__name { color: var(--booking-ink); display: block; font-size: 1.15rem; }
.booking-practitioner__description { margin: .35rem 0 0; }
.booking-targets { grid-template-columns: 1fr; }
.booking-choice, .booking-question-option { align-items: flex-start; border: 1px solid var(--booking-border); border-radius: .8rem; cursor: pointer; display: flex; gap: .75rem; padding: .9rem 1rem; }
.booking-choice:has(input:checked), .booking-question-option:has(input:checked) { background: #f3f8f3; border-color: var(--booking-accent); }

.booking-scroll-target { scroll-margin-top: calc(var(--booking-sticky-offset) + 2rem); }
.booking-calendar { background: var(--booking-surface); border: 1px solid var(--booking-border); border-radius: var(--booking-card-radius); box-shadow: var(--booking-shadow); max-width: var(--booking-content-width); padding: clamp(1.2rem, 4vw, 2.25rem); }
.booking-calendar__header { align-items: center; display: grid; grid-template-columns: 3rem 1fr 3rem; margin-bottom: 1.25rem; text-align: center; }
.booking-calendar__title { color: var(--booking-ink); font-size: 1.35rem; margin: 0; }
.booking-calendar__nav { align-items: center; display: inline-flex; height: 2.6rem; justify-content: center; padding: 0; width: 2.6rem; }
.booking-calendar__weekdays, .booking-calendar__week { display: grid; gap: .4rem; grid-template-columns: repeat(7, minmax(0,1fr)); }
.booking-calendar__weekday { color: #75695f; font-size: .78rem; font-weight: 800; padding-block: .4rem; text-align: center; }
.booking-calendar__day { align-items: center; aspect-ratio: 1; background: #f5f0e9; border: 0; border-radius: .65rem; color: inherit; display: flex; justify-content: center; min-height: 2.6rem; text-decoration: none; width: 100%; }
.booking-calendar__day.is-available { background: #edf5ee; color: var(--booking-accent); cursor: pointer; font-weight: 700; }
.booking-calendar__day.is-selected { background: var(--booking-accent); color: #fff; }
.booking-calendar__day.is-disabled { opacity: .38; }
.booking-calendar__day.is-today { box-shadow: inset 0 0 0 2px var(--booking-highlight); }
.booking-calendar__day.is-outside-month { background: transparent; }
.booking-calendar form { margin: 0; }

.booking-times { margin-top: 0; }
.booking-times__grid { display: grid; gap: .75rem; grid-template-columns: repeat(auto-fit, minmax(5.5rem, 1fr)); margin-top: 1rem; }
.booking-time-option { border: 1px solid rgba(24,90,64,.3); border-radius: .7rem; color: var(--booking-accent); cursor: pointer; padding: .75rem; text-align: center; }
.booking-time-option input { margin-right: .35rem; }
.booking-time-option:has(input:checked) { background: var(--booking-accent); color: #fff; }
.booking-question-set { display: grid; gap: 1.5rem; margin-block: 0; }
.booking-question-block { border: 0; padding: 0; }
.booking-question-item { margin: 0; }
.booking-question-options { display: grid; gap: .75rem; }
.booking-question-option small { display: block; margin-top: .2rem; }
.booking-actions { align-items: center; border-top: 1px solid var(--booking-border); display: flex; gap: 1rem; justify-content: flex-end; margin-top: 2rem; padding-top: 1.5rem; }
.booking-actions__secondary { margin-right: auto; }
.booking-verification__code { max-width: 24rem; }
.booking-verification__code input { font-size: 1.4rem; font-weight: 750; letter-spacing: .2em; text-align: center; }
.booking-verification__secondary { display: flex; flex-wrap: wrap; gap: .75rem; margin-top: 1rem; }
.booking-review__header { border-bottom: 1px solid var(--booking-border); margin-bottom: 1.5rem; padding-bottom: 1.25rem; }
.booking-review__header h2 { color: var(--booking-ink); margin-bottom: .5rem; }
.booking-review__eyebrow { color: var(--booking-highlight); font-size: .78rem; font-weight: 800; letter-spacing: .1em; margin-bottom: .35rem; text-transform: uppercase; }
.booking-review__sections { display: grid; gap: 1.25rem; grid-template-columns: repeat(2, minmax(0, 1fr)); }
.booking-review__section { background: var(--booking-muted-surface); border-radius: .9rem; padding: 1.2rem; }
.booking-review__section h3 { color: var(--booking-ink); font-size: 1.05rem; margin-bottom: .9rem; }
.booking-review__details { display: grid; gap: .45rem 1rem; grid-template-columns: minmax(7rem, auto) 1fr; margin: 0; }
.booking-review__details dt { color: #75695f; font-weight: 650; }
.booking-review__details dd { margin: 0; }
.booking-review__price { color: var(--booking-accent); font-size: 1.3rem; font-weight: 800; margin: 0; }
.booking-summary__status { align-items: center; display: flex; flex-wrap: wrap; gap: .75rem; justify-content: space-between; }
.booking-summary__status h2 { margin: 0; }
.booking-summary__badge { border-radius: 999px; display: inline-flex; font-size: .82rem; font-weight: 750; padding: .4rem .75rem; }
.booking-summary__badge--confirmed { background: #dcefe2; color: #145c35; }
.booking-summary__badge--cancelled { background: #f8dddd; color: #842029; }
.booking-summary__badge--neutral { background: #e5e1db; color: #574f47; }
.booking-review__details :where(dt, dd), .booking-review__section { min-width: 0; overflow-wrap: anywhere; }
.booking-history { display: grid; gap: .75rem; list-style: none; margin: 0; padding: 0; }
.booking-history__item { border-inline-start: .2rem solid var(--booking-border); padding-inline-start: .9rem; }
.booking-history__item p { margin: .2rem 0 0; }
.booking-manage__notice { margin-top: 1.25rem; }
.booking-reschedule__cancel { margin-top: var(--booking-section-gap); }
.trajectory-public .booking-product { max-width: var(--booking-content-width); }
.trajectory-card { border-top: .35rem solid var(--booking-accent); min-width: 0; }
.trajectory-card--package { border-top-color: var(--booking-highlight); }
.trajectory-card--membership { border-top-color: #557a95; }
.trajectory-card--discount { border-top-color: #8b6b32; }
.trajectory-card__usage { background: var(--booking-muted-surface); border-radius: .75rem; margin-top: auto; padding: 1rem; }
.trajectory-portal__toolbar { align-items: center; display: flex; flex-wrap: wrap; gap: 1rem; justify-content: space-between; max-width: var(--booking-content-width); }
.trajectory-list { display: grid; gap: .75rem; }
.trajectory-list__item { align-items: center; border-bottom: 1px solid var(--booking-border); display: grid; gap: .35rem 1rem; grid-template-columns: minmax(10rem, 1fr) minmax(12rem, auto) auto; overflow-wrap: anywhere; padding-block: .8rem; }
.trajectory-list__item .booking-actions { border-top: 0; grid-column: 1 / -1; justify-content: flex-start; margin-top: .4rem; padding-top: 0; }
.trajectory-list__item:last-child { border-bottom: 0; }

.booking-shell :where(a, button, input, select, textarea):focus-visible { outline: 3px solid rgba(184,117,89,.45); outline-offset: 2px; }
@media (prefers-reduced-motion: reduce) { .booking-shell * { scroll-behavior: auto; transition-duration: .01ms; } }

@media (max-width: 48rem) {
  .public-footer { display: none; }
  .booking-verification__code input { box-sizing: border-box; margin-inline: auto; max-width: 85vw; width: 100%; }
  :root { --booking-profile-size: 5.25rem; }
  .booking-header__inner, .booking-progress__list, .booking-shell__main { width: min(calc(100% - 1.5rem), var(--booking-max-width)); }
  .booking-header__inner { padding-block: .9rem .7rem; }
  .booking-header__context { display: none; }
  .booking-progress__list { padding-block: .65rem; }
  .booking-progress__label { clip: rect(0 0 0 0); clip-path: inset(50%); height: 1px; overflow: hidden; position: absolute; white-space: nowrap; width: 1px; }
  .booking-progress__marker { height: 1.65rem; width: 1.65rem; }
  .booking-progress__connector { left: calc(-50% + 1.1rem); right: calc(50% + 1.1rem); top: .82rem; }
  .booking-field-group { grid-template-columns: 1fr; }
  .booking-field--full { grid-column: auto; }
  .booking-review__sections { grid-template-columns: 1fr; }
  .booking-review__details { grid-template-columns: 1fr; }
  .booking-review__details dd:not(:last-child) { margin-bottom: .55rem; }
  .booking-actions { align-items: stretch; flex-direction: column-reverse; }
  .booking-actions .btn { min-height: 3rem; width: 100%; }
  .booking-actions__secondary { margin-right: 0; }
  .booking-calendar { padding: 1rem .65rem; }
  .booking-calendar__weekdays, .booking-calendar__week { gap: .2rem; }
  .booking-calendar__day { border-radius: .45rem; font-size: .9rem; min-height: 2.25rem; }
  .booking-practitioner__profile { align-items: start; grid-template-columns: var(--booking-profile-size) 1fr; }
  .trajectory-list__item { align-items: start; grid-template-columns: 1fr; }
}