.booking-shell { --booking-bg:#fffefa; --booking-ink:#202326; --booking-muted:#55524d; --booking-line:#aaa59a; --booking-accent:#514637; --booking-padding:24px; max-width:900px; margin:0 auto; padding:clamp(24px,5vw,64px) var(--booking-padding); color:var(--booking-ink); background:var(--booking-bg); font-size:18px; line-height:1.6; border-radius:28px; }
.booking-shell [hidden] { display:none!important; }
/* Reserve the real first-step layout while handlers load. Controls stay inert. */
html[data-booking-script] .booking-shell:not([data-booking-ready]) { position:relative; }
html[data-booking-script] .booking-shell:not([data-booking-ready]) > .booking-form[hidden] { display:block!important; visibility:hidden; }
html[data-booking-script] .booking-shell:not([data-booking-ready]) > [data-booking-fallback] { position:absolute; inset-inline:var(--booking-padding); margin:0; }
.booking-shell .booking-page-title { color:var(--booking-ink); font-family:inherit; font-size:clamp(32px,5vw,48px); line-height:1.12; letter-spacing:-.04em; margin:0 0 24px; }
.booking-shell h2 { color:var(--booking-ink); font-family:inherit; font-size:clamp(28px,4vw,44px); line-height:1.15; letter-spacing:-.035em; margin:28px 0 16px; }
.booking-shell p { font-size:18px; line-height:1.6; color:var(--booking-muted); }
.booking-progress { position:sticky; top:var(--booking-status-top,100px); z-index:5; margin:0 0 12px; padding:8px 0; font-weight:650; background:var(--booking-bg); border-bottom:1px solid var(--booking-line); }
@media(max-width:1190px) and (max-height:360px) { .booking-progress { padding-block:0; } }
.booking-track { display:flex; padding:0; list-style:none; gap:12px; margin:0 0 32px; }
.booking-track li { flex:1; padding-top:12px; border-top:3px solid var(--booking-line); font-size:18px; }
.booking-track li[aria-current] { color:var(--booking-accent); border-color:var(--booking-accent); font-weight:700; }
.booking-disclosure { margin:0 0 24px; padding:16px 20px; border:1px solid var(--booking-line); border-left:4px solid var(--booking-accent); border-radius:14px; }
.booking-shell .booking-disclosure p { margin:0; color:var(--booking-ink); }
.booking-disclosure-links { display:flex; flex-wrap:wrap; gap:8px 16px; margin-top:8px; }
.booking-disclosure-links a,.booking-shell [data-booking-directions] { display:inline-flex; align-items:center; min-height:48px; color:var(--booking-ink); font-weight:650; text-underline-offset:4px; }
.booking-disclosure-links a:focus-visible,.booking-shell [data-booking-directions]:focus-visible { outline:3px solid var(--booking-accent); outline-offset:3px; }
.booking-shell [data-booking-directions] { margin-left:8px; }
.booking-shell fieldset { border:0; padding:0; margin:24px 0; min-width:0; }
.booking-shell legend { font-weight:650; margin-bottom:12px; }
.booking-devices { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:16px; }
.booking-device { position:relative; display:block; }
.booking-device strong { max-width:100%; overflow-wrap:anywhere; }
.booking-device input { position:absolute; top:18px; right:18px; width:20px; height:20px; accent-color:var(--booking-accent); }
.booking-device > span { min-height:164px; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:14px; padding:28px 16px 18px; border:1px solid var(--booking-line); border-radius:18px; cursor:pointer; text-align:center; transition:box-shadow 180ms,transform 180ms; }
.booking-device input:checked + span { border-color:var(--booking-accent); box-shadow:inset 0 0 0 2px var(--booking-accent); }
.booking-device input:focus-visible + span { outline:3px solid var(--booking-accent); outline-offset:4px; }
.booking-methods { display:flex; flex-wrap:wrap; gap:12px; }
.booking-methods label { display:flex; align-items:center; gap:10px; padding:14px 18px; min-height:56px; border:1px solid var(--booking-line); border-radius:12px; cursor:pointer; }
.booking-methods input { width:22px; height:22px; accent-color:var(--booking-accent); }
.booking-fields { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:24px; }
.booking-fields label { display:flex; flex-direction:column; gap:8px; color:var(--booking-ink); font-size:18px; }
.booking-wide { grid-column:1/-1; }
.booking-fields input,.booking-fields textarea { box-sizing:border-box; width:100%; min-width:0; min-height:56px; padding:14px 16px; border:1px solid var(--booking-line); border-radius:12px; background:var(--booking-bg); color:var(--booking-ink); font:inherit; }
.booking-fields textarea { resize:vertical; }
.booking-fields input:focus-visible,.booking-fields textarea:focus-visible { outline:3px solid var(--booking-accent); outline-offset:3px; }
.booking-actions { display:flex; gap:14px; flex-wrap:wrap; align-items:center; margin-top:28px; }
.booking-primary,.booking-secondary { display:inline-flex; justify-content:center; align-items:center; box-sizing:border-box; min-height:56px; padding:12px 24px; font:inherit; font-weight:650; border-radius:999px; text-decoration:none; cursor:pointer; border:1px solid var(--booking-line); }
.booking-primary { background:var(--booking-accent); color:#fff; border-color:var(--booking-accent); }
.booking-secondary { background:var(--booking-bg); color:var(--booking-ink); }
.booking-primary:focus-visible,.booking-secondary:focus-visible { outline:3px solid var(--booking-accent); outline-offset:4px; }
.booking-primary:disabled { cursor:wait; opacity:.7; }
.booking-shell .booking-error { color:#a32020; border-left:3px solid currentColor; padding-left:16px; }
.booking-result dl { display:grid; grid-template-columns:auto minmax(0,1fr); gap:12px 24px; }
.booking-result dt { font-weight:650; }
.booking-result dd { margin:0; overflow-wrap:anywhere; white-space:pre-wrap; }
.booking-shell .booking-preferred-time { font-size:clamp(22px,4vw,30px); font-weight:650; color:var(--booking-ink); }
.booking-sr-only { position:absolute; width:1px; height:1px; overflow:hidden; clip-path:inset(50%); }
@media (hover:hover) { .booking-device:hover > span { transform:translateY(-2px); box-shadow:0 8px 20px #20232612; } }
@media (prefers-color-scheme:dark) { .booking-shell { --booking-bg:#1f2124; --booking-ink:#f6f6f4; --booking-muted:#d0c9bc; --booking-line:#817b70; --booking-accent:#ebd9b4; } .booking-primary { color:#202326; } .booking-shell .booking-error { color:#ffb4af; } }
@media(max-width:600px) { .booking-shell { --booking-padding:18px; padding:28px var(--booking-padding); border-radius:20px; } .booking-devices { grid-template-columns:repeat(auto-fit,minmax(min(100%,max(7em,calc(50% - 6px))),1fr)); gap:12px; } .booking-device > span { min-height:156px; padding:28px 8px 16px; } .booking-device strong { font-size:18px; } .booking-fields { grid-template-columns:1fr; } .booking-actions > * { flex:1 1 auto; } .booking-track { gap:8px; } .booking-track li { font-size:18px; } .booking-result dl { grid-template-columns:1fr; gap:4px; } .booking-result dd { margin-bottom:14px; } }
@media(prefers-reduced-motion:reduce) { .booking-shell * { transition:none!important; animation:none!important; transform:none!important; } }

.booking-shell [tabindex="-1"] { scroll-margin-top:120px; }
.booking-shell input[aria-invalid="true"],.booking-shell textarea[aria-invalid="true"] { border:2px solid #a32020; }
.booking-methods label:focus-within { outline:3px solid var(--booking-accent); outline-offset:3px; }
@media(prefers-color-scheme:dark) { .booking-shell input[aria-invalid="true"],.booking-shell textarea[aria-invalid="true"] { border-color:#ffb4af; } }

.booking-device input { z-index: 1; }

.booking-photo { margin-block: 24px; }
.booking-photo label { display: block; font-weight: 650; }
.booking-photo input { width: 100%; max-width: 100%; min-height: 56px; padding: 12px; font: inherit; }
.booking-photo img { display: block; width: 240px; max-width: 100%; height: 180px; object-fit: contain; margin-block: 16px; border-radius: 12px; }
.booking-photo [hidden] { display: none; }

@media(max-width:1190px) and (max-height:360px) {
 .booking-shell fieldset.booking-devices { grid-template-columns:minmax(0,1fr); }
 .booking-device > span { min-height:72px; flex-direction:row; justify-content:flex-start; gap:12px; padding:8px 40px 8px 12px; text-align:left; }
 .booking-device > span svg { width:48px; height:38.4px; flex-shrink:0; }
 .booking-device input { top:50%; right:12px; margin-top:-10px; }
 .booking-fields label { gap:2px; }
 .booking-fields input { padding-block:12px; }
 .booking-fields textarea { height:56px; padding-block:12px; }
}
