body.booking-page { min-height: 100vh; background: radial-gradient(circle at 78% 0%, rgba(246, 164, 156, .20), transparent 22%), var(--pearl); }
.booking-header { width: min(1260px, calc(100vw - 80px)); min-height: 108px; display: flex; align-items: center; justify-content: space-between; gap: 24px; margin: auto; }
.booking-back { border-bottom: 1px solid var(--gold); padding-bottom: 5px; color: var(--gold); font-size: 11px; font-weight: 700; letter-spacing: .09em; text-transform: uppercase; transition: color .2s ease, border-color .2s ease; }.booking-back:hover, .booking-back:focus-visible { border-color: var(--rose); color: var(--rose); }
.booking-shell { width: min(1260px, calc(100vw - 80px)); display: grid; grid-template-columns: minmax(330px, .76fr) minmax(0, 1.24fr); margin: 0 auto 108px; border: 1px solid rgba(140, 95, 44, .38); box-shadow: 0 28px 80px rgba(37, 25, 31, .14); }

.booking-aside { position: relative; overflow: hidden; padding: clamp(42px, 5vw, 68px); background: radial-gradient(circle at 16% 17%, rgba(217, 103, 95, .42), transparent 25%), radial-gradient(circle at 87% 93%, rgba(246, 164, 156, .18), transparent 33%), linear-gradient(148deg, var(--wine), var(--ink)); color: var(--pearl); }.booking-aside::before { position: absolute; width: 410px; height: 410px; right: -255px; top: 29%; border: 1px solid rgba(246, 164, 156, .24); border-radius: 50%; content: ''; }.booking-aside::after { position: absolute; width: 215px; height: 215px; right: -112px; top: calc(29% + 98px); border: 1px solid rgba(246, 164, 156, .16); border-radius: 50%; content: ''; }.booking-aside > * { position: relative; z-index: 1; }.booking-aside h1 { max-width: 395px; margin-bottom: 28px; color: var(--pearl); font-size: clamp(61px, 6.2vw, 98px); }.booking-aside h1 em { color: var(--neon); }.booking-aside .eyebrow { color: var(--neon); }.booking-intro { max-width: 332px; margin-bottom: 26px; color: rgba(255, 250, 248, .86); font-size: 17px; line-height: 1.62; }
.booking-credentials { display: flex; flex-wrap: wrap; gap: 8px; max-width: 335px; margin: 0; padding: 0; list-style: none; }.booking-credentials li { border: 1px solid rgba(246, 164, 156, .47); padding: 7px 9px; color: var(--neon); font-size: 9px; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; }
.booking-progress { display: grid; gap: 13px; margin: 54px 0 44px; padding: 0; list-style: none; color: rgba(255, 250, 248, .43); font-size: 10px; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; }.booking-progress li { display: flex; gap: 13px; align-items: center; transition: color .25s ease, opacity .25s ease; }.booking-progress li span { font-weight: 500; }.booking-progress li.is-current { color: var(--pearl); }.booking-progress li.is-complete { color: var(--neon); }.booking-progress li.is-complete::after { width: 5px; height: 5px; margin-left: 2px; border-radius: 50%; background: var(--neon); content: ''; }
.booking-assurance { max-width: 310px; margin-bottom: 0; border-top: 1px solid rgba(246, 164, 156, .44); padding-top: 17px; color: rgba(255, 250, 248, .72); font-size: 12px; line-height: 1.55; }

.booking-card { min-width: 0; padding: clamp(31px, 4vw, 56px); background: linear-gradient(135deg, #fffdfc, var(--blush)); }.booking-card-heading { display: flex; align-items: flex-end; justify-content: space-between; gap: 24px; padding-bottom: 27px; border-bottom: 1px solid var(--line); }.booking-card-heading h2 { margin-bottom: 0; font-size: clamp(49px, 5vw, 74px); }.booking-card-heading .eyebrow { margin-bottom: 8px; }.booking-live-marker { display: flex; align-items: center; gap: 8px; flex: 0 0 auto; margin: 0 0 8px; color: var(--gold); font-size: 9px; font-weight: 700; letter-spacing: .11em; text-transform: uppercase; white-space: nowrap; }.booking-live-marker span { width: 7px; height: 7px; border-radius: 50%; background: var(--rose); box-shadow: 0 0 0 4px rgba(217, 103, 95, .14); }
.appointment-summary { display: grid; grid-template-columns: repeat(3, 1fr); margin: 25px 0 0; border: 1px solid rgba(140, 95, 44, .36); background: rgba(255, 250, 248, .62); }.summary-item { min-width: 0; padding: 14px 15px; border-right: 1px solid rgba(140, 95, 44, .24); }.summary-item:last-child { border-right: 0; }.summary-item > span { display: block; margin-bottom: 6px; color: var(--gold); font-size: 9px; font-weight: 700; letter-spacing: .105em; text-transform: uppercase; }.summary-item strong { display: block; overflow: hidden; color: rgba(122, 66, 73, .66); font-family: var(--accent); font-size: 18px; font-weight: 400; line-height: 1.08; text-overflow: ellipsis; white-space: nowrap; }.summary-item.is-filled strong { color: var(--mulberry); }
.booking-type-switch { display: flex; gap: 8px; padding: 26px 0 20px; border-bottom: 1px solid var(--line); }.type-filter { min-height: 38px; border: 1px solid var(--gold); background: transparent; padding: 7px 13px; color: var(--gold); font-size: 10px; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; cursor: pointer; transition: background .2s ease, color .2s ease, border-color .2s ease; }.type-filter:hover, .type-filter:focus-visible { border-color: var(--rose); color: var(--rose); }.type-filter.is-selected { border-color: var(--rose); background: var(--rose); color: var(--pearl); }
.service-list { display: grid; gap: 10px; padding: 22px 0 8px; }.service-option { position: relative; display: grid; grid-template-columns: 1fr auto; gap: 16px; width: 100%; overflow: hidden; border: 1px solid rgba(140, 95, 44, .42); background: rgba(255, 250, 248, .48); padding: 18px; color: var(--mulberry); text-align: left; cursor: pointer; transition: transform .24s var(--ease), box-shadow .24s ease, background .24s ease, color .24s ease, border-color .24s ease; }.service-option::before { position: absolute; width: 3px; inset: 0 auto 0 0; background: var(--neon); content: ''; transform: scaleY(0); transform-origin: bottom; transition: transform .24s var(--ease); }.service-option:hover, .service-option:focus-visible { border-color: var(--rose); background: var(--pearl); box-shadow: 0 10px 26px rgba(122, 66, 73, .10); transform: translateY(-2px); }.service-option:hover::before, .service-option:focus-visible::before, .service-option.is-selected::before { transform: scaleY(1); }.service-option.is-selected { border-color: var(--ink); background: var(--ink); color: var(--pearl); box-shadow: 0 13px 30px rgba(37, 25, 31, .19); }.service-type { display: block; margin-bottom: 8px; color: var(--gold); font-size: 9px; font-weight: 700; letter-spacing: .11em; text-transform: uppercase; }.service-option.is-selected .service-type { color: var(--neon); }.service-option h3 { margin: 0 0 7px; font-family: var(--accent); font-size: 27px; font-weight: 400; line-height: 1.05; }.service-option p { max-width: 390px; margin: 0; font-size: 13px; line-height: 1.45; }.service-meta { display: flex; align-items: flex-end; flex-direction: column; justify-content: space-between; gap: 14px; color: var(--gold); font-size: 10px; font-weight: 700; letter-spacing: .08em; text-align: right; text-transform: uppercase; }.service-meta strong { color: var(--rose); font-size: 15px; }.service-option.is-selected .service-meta { color: rgba(255, 250, 248, .72); }.service-option.is-selected .service-meta strong { color: var(--neon); }

.booking-step { padding: 36px 0 10px; }.step-label { margin-bottom: 10px; color: var(--gold); font-size: 10px; font-weight: 700; letter-spacing: .14em; text-transform: uppercase; }.booking-step h3, .booking-form h3 { margin-bottom: 22px; font-family: var(--serif); font-size: 45px; font-weight: 400; letter-spacing: -.04em; line-height: .95; }.booking-step h3 em, .booking-form h3 em { color: var(--rose); font-family: var(--accent); font-weight: 400; }
.date-list { display: grid; grid-template-columns: repeat(7, 1fr); gap: 7px; }.date-option { min-height: 73px; border: 1px solid rgba(140, 95, 44, .68); background: var(--pearl); color: var(--mulberry); cursor: pointer; transition: transform .2s var(--ease), background .2s ease, color .2s ease, border-color .2s ease; }.date-option:hover, .date-option:focus-visible { border-color: var(--rose); transform: translateY(-2px); }.date-option span { display: block; font-size: 9px; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; }.date-option strong { display: block; margin-top: 4px; color: var(--rose); font-family: var(--serif); font-size: 23px; font-weight: 400; }.date-option.is-selected { border-color: var(--ink); background: var(--ink); color: var(--pearl); }.date-option.is-selected strong { color: var(--neon); }
.availability-note { margin-bottom: 16px; color: var(--gold); font-size: 13px; }.time-list { display: grid; grid-template-columns: repeat(3, 1fr); gap: 8px; }.time-option { display: flex; align-items: flex-start; justify-content: space-between; flex-direction: column; min-height: 66px; border: 1px solid rgba(140, 95, 44, .68); background: var(--pearl); padding: 11px 12px; color: var(--mulberry); text-align: left; cursor: pointer; transition: transform .2s var(--ease), background .2s ease, color .2s ease, border-color .2s ease; }.time-option:hover, .time-option:focus-visible { border-color: var(--rose); transform: translateY(-2px); }.time-option strong { font-family: var(--accent); font-size: 23px; font-weight: 400; line-height: 1; }.time-option span { color: var(--gold); font-size: 9px; font-weight: 700; letter-spacing: .09em; text-transform: uppercase; }.time-option.is-selected { border-color: var(--ink); background: var(--ink); color: var(--pearl); }.time-option.is-selected span { color: var(--neon); }
.booking-form { margin-top: 37px; border-top: 1px solid var(--line); padding-top: 36px; }.form-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 15px; }.form-grid label:last-child { grid-column: 1 / -1; }.form-grid label { display: grid; gap: 7px; color: var(--gold); font-size: 10px; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; }.form-grid label span { font-size: 9px; font-weight: 500; }.form-grid input, .form-grid textarea { width: 100%; border: 1px solid rgba(140, 95, 44, .55); border-radius: 0; background: var(--pearl); padding: 12px; color: var(--mulberry); font: 15px var(--sans); letter-spacing: 0; text-transform: none; }.form-grid input:focus, .form-grid textarea:focus { outline: 2px solid rgba(217, 103, 95, .5); outline-offset: 1px; }.terms-check { display: flex; gap: 10px; align-items: flex-start; margin: 22px 0 14px; font-size: 12px; line-height: 1.45; }.terms-check input { margin-top: 3px; accent-color: var(--rose); }.deposit-disclosure { display: flex; align-items: center; justify-content: space-between; gap: 14px; border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); margin: 0 0 20px; padding: 13px 0; color: var(--gold); font-size: 11px; line-height: 1.4; }.deposit-disclosure strong { flex: 0 0 auto; color: var(--mulberry); font-family: var(--accent); font-size: 22px; font-weight: 400; }.deposit-disclosure span { text-align: right; }.form-status { min-height: 20px; margin: 13px 0 0; color: var(--rose); font-size: 13px; }.booking-confirmation { border: 1px solid var(--gold); background: var(--pearl); margin-top: 32px; padding: 30px; }.booking-confirmation h3 { margin-bottom: 13px; font-family: var(--serif); font-size: 45px; font-weight: 400; line-height: .95; }.booking-confirmation p { margin-bottom: 0; }.booking-confirmation span { display: block; margin-top: 14px; color: var(--gold); font-size: 11px; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; }.booking-loading { margin: 8px 0 20px; color: var(--gold); }
button:focus-visible, a:focus-visible { outline: 2px solid var(--rose); outline-offset: 3px; }

@media (max-width: 900px) { .booking-header, .booking-shell { width: min(100% - 48px, 760px); }.booking-shell { grid-template-columns: 1fr; }.booking-aside { padding: 38px 32px; }.booking-aside h1 { max-width: 600px; font-size: 73px; }.booking-intro { max-width: 530px; }.booking-progress { display: flex; gap: 26px; margin: 30px 0 0; }.booking-assurance { display: none; } }
@media (max-width: 620px) { .booking-header { width: min(100% - 38px, 540px); min-height: 82px; }.booking-header .brand-logo { width: 130px; }.booking-back { font-size: 9px; }.booking-shell { width: min(100% - 38px, 540px); margin-bottom: 52px; }.booking-aside { padding: 32px 21px; }.booking-aside h1 { font-size: 59px; }.booking-credentials { gap: 6px; }.booking-credentials li { padding: 6px 7px; font-size: 8px; }.booking-progress { gap: 14px; font-size: 9px; }.booking-card { padding: 28px 18px; }.booking-card-heading { display: block; }.booking-card-heading h2 { margin-top: 8px; font-size: 57px; }.booking-live-marker { margin-top: 17px; }.appointment-summary { grid-template-columns: 1fr; }.summary-item { border-right: 0; border-bottom: 1px solid rgba(140, 95, 44, .24); padding: 12px 13px; }.summary-item:last-child { border-bottom: 0; }.booking-type-switch { padding-top: 22px; }.service-option { grid-template-columns: 1fr; }.service-meta { align-items: flex-start; flex-direction: row; }.date-list { grid-template-columns: repeat(4, 1fr); }.date-option:nth-child(n+9) { display: none; }.time-list { grid-template-columns: repeat(2, 1fr); }.form-grid { grid-template-columns: 1fr; }.form-grid label:last-child { grid-column: auto; }.deposit-disclosure { align-items: flex-start; flex-direction: column; }.deposit-disclosure span { text-align: left; } }