
:root{--b-orange:#ff4c00;--b-pink:#e64b7a;--b-ink:#2b2929;--b-muted:#746d6d;--b-line:#ded8d6;--b-soft:#faf7f5}
.booking-page{background:#fff;color:var(--b-ink)}
.booking-container{width:min(980px,calc(100% - 30px));margin:auto}
.booking-top{background:var(--b-orange);color:#fff;padding:14px 0}
.booking-top-inner{display:flex;align-items:center;justify-content:space-between;gap:20px}
.booking-top a{font-weight:800}.booking-top-inner>div{display:flex;flex-direction:column;text-align:right}
.booking-main{padding:34px 0 70px}.booking-intro{max-width:760px}.booking-kicker{font-size:12px;letter-spacing:.15em;font-weight:900;color:var(--b-pink)}
.booking-intro h1{font-size:clamp(42px,6vw,62px);margin:8px 0 10px;font-weight:500}.booking-intro p,.muted{color:var(--b-muted)}
.booking-progress{display:grid;grid-template-columns:repeat(4,1fr);margin-top:26px;background:var(--b-soft);border:1px solid var(--b-line);border-radius:16px;overflow:hidden}
.booking-progress span{padding:14px;text-align:center;font-size:13px;font-weight:800;color:#918888}
.booking-progress span.active{background:#fff;color:var(--b-pink)}
.booking-step{display:none;padding-top:28px}.booking-step.active{display:block}.booking-step h2{font-size:34px;margin:0 0 18px}
.service-list{padding:0 16px 14px}.service-choice{width:100%;display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:12px;padding:14px;margin:8px 0;border:1px solid #eee;border-radius:14px;background:#fff;text-align:left;cursor:pointer;box-shadow:0 5px 16px rgba(0,0,0,.035)}
.service-choice:hover,.service-choice.selected{border-color:var(--b-pink);background:#fff9fb}.radio-dot{width:24px;height:24px;border:1px solid #bbb;border-radius:50%}.service-choice.selected .radio-dot{border:7px solid #2eaf48}
.service-copy b,.service-copy small,.service-meta>*{display:block}.service-copy small{color:var(--b-muted);margin-top:3px}.service-meta{text-align:right}.service-meta strong{font-size:20px}.service-meta em{font-style:normal;color:var(--b-muted);font-size:12px}
.staff-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}.staff-choice{padding:18px;border:1px solid var(--b-line);border-radius:14px;background:#fff;font-size:17px;font-weight:800;cursor:pointer}.staff-choice:hover,.staff-choice.selected{background:var(--b-pink);border-color:var(--b-pink);color:#fff}
.selection-summary{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-bottom:18px}.selection-summary>div{background:#f5f5f5;border-radius:12px;padding:14px}.selection-summary span,.selection-summary b{display:block}.selection-summary span{font-size:12px;color:var(--b-muted)}
.date-time-layout{display:grid;grid-template-columns:.8fr 1.2fr;gap:24px}.booking-label{display:block;font-weight:800;margin-bottom:7px}.booking-input{width:100%;padding:14px;border:1px solid var(--b-line);border-radius:11px;font:inherit}
.slot-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:10px}.slot-choice{padding:12px 8px;border:1px solid var(--b-line);border-radius:10px;background:#fff;font-weight:800;cursor:pointer}.slot-choice:hover,.slot-choice.selected{background:var(--b-orange);border-color:var(--b-orange);color:#fff}
.customer-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px}.customer-grid label{font-weight:800}.customer-grid input,.customer-grid textarea{width:100%;margin-top:6px;padding:14px;border:1px solid var(--b-line);border-radius:10px;font:inherit}.customer-grid textarea{min-height:130px}.customer-grid .wide{grid-column:1/-1}
.final-summary{margin-top:16px;padding:16px;background:#fff7fa;border:1px solid #f0d7df;border-radius:14px}
.booking-nav{display:flex;justify-content:space-between;gap:12px;margin-top:22px}.booking-btn{border:1px solid var(--b-line);border-radius:11px;padding:13px 20px;background:#fff;font-weight:800;cursor:pointer}.booking-btn.primary{background:var(--b-pink);color:#fff;border-color:var(--b-pink)}
@media(max-width:760px){.date-time-layout,.customer-grid{grid-template-columns:1fr}.customer-grid .wide{grid-column:auto}.staff-grid{grid-template-columns:1fr 1fr}.slot-grid{grid-template-columns:repeat(3,1fr)}}
@media(max-width:520px){.booking-progress span{font-size:0}.booking-progress span::first-letter{font-size:13px}.service-choice{grid-template-columns:auto 1fr}.service-meta{grid-column:2;text-align:left;display:flex;gap:8px;align-items:center}.staff-grid{grid-template-columns:1fr}.slot-grid{grid-template-columns:repeat(2,1fr)}}
