body.booking{background:var(--ivory)}
.bk-head{background:var(--ink);position:sticky;top:0;z-index:40}
.bk-head .wrap{display:flex;justify-content:space-between;align-items:center;height:70px}
.bk-head .back{color:#d9d0c6;font-size:.76rem;letter-spacing:.2em;text-transform:uppercase}
.bk-head .back:hover{color:var(--gold)}
.bk-hero{background:var(--ink);color:#fff;padding:34px 0 64px}
.bk-hero h1{font-size:clamp(2.2rem,5vw,3.4rem);font-weight:400}
.stepper{display:flex;gap:6px;margin-top:26px;max-width:640px}
.stepper div{flex:1;font-size:.7rem;letter-spacing:.14em;text-transform:uppercase;color:#8a7f74;padding-top:10px;border-top:2px solid #3a342f}
.stepper div.on{color:var(--gold-2);border-color:var(--gold)}
.stepper div.done{color:#cfc5b9;border-color:var(--gold-deep)}
.bk{display:grid;grid-template-columns:1fr 340px;gap:30px;margin-top:-34px;padding-bottom:90px;align-items:start}
.panel{min-width:0;background:#fff;border-radius:18px;box-shadow:0 10px 40px rgba(40,30,20,.08);padding:34px}
.panel h2{font-size:2rem;margin:0 0 6px}
.panel .sub{color:var(--muted);font-size:.95rem;margin-bottom:24px}
.alert{border-radius:12px;padding:14px 16px;font-size:.92rem;margin-bottom:20px}
.alert.warn{background:#fbf2e2;color:#7a5a1e;border:1px solid #efdcb5}
.alert.err{background:#fbe9e7;color:#8a2f22;border:1px solid #f2c9c2}
.alert.info{background:#edf3ef;color:var(--sage-deep);border:1px solid #d3e1d7}

.cat-tabs{display:flex;gap:8px;overflow-x:auto;padding-bottom:6px;margin-bottom:16px;scrollbar-width:none}
.cat-tabs::-webkit-scrollbar{display:none}
.cat-tabs button{flex:none;padding:9px 16px;border:1px solid var(--line);border-radius:999px;font-size:.78rem;letter-spacing:.1em;text-transform:uppercase;color:var(--muted)}
.cat-tabs button.on{background:var(--ink);border-color:var(--ink);color:#fff}
.cat-tabs button i{font-style:normal;background:var(--gold);color:var(--ink);border-radius:999px;padding:0 6px;margin-left:6px;font-size:.7rem}
.svc{display:flex;align-items:center;gap:14px;padding:15px 4px;border-bottom:1px solid var(--line);cursor:pointer}
.svc:last-child{border-bottom:0}
.svc .tick{width:22px;height:22px;flex:none;border:1px solid #cbbfb1;border-radius:6px;display:grid;place-items:center;transition:.2s}
.svc.on .tick{background:var(--ink);border-color:var(--ink)}
.svc.on .tick:after{content:"";width:6px;height:11px;border:solid var(--gold-2);border-width:0 2px 2px 0;transform:rotate(45deg) translate(-1px,-1px)}
.svc .nm{flex:1}
.svc .nm small{display:block;color:var(--muted);font-size:.8rem}
.svc .pr{font-family:var(--serif);font-size:1.25rem;font-weight:600;color:var(--brown);white-space:nowrap}
.svc .pr.tbc{font-family:var(--sans);font-size:.78rem;color:var(--sage-deep);font-weight:400}
.qty{display:flex;align-items:center;gap:8px}
.qty button{width:28px;height:28px;border:1px solid var(--line);border-radius:50%}
.qty span{min-width:18px;text-align:center}

.pros{display:grid;grid-template-columns:repeat(auto-fill,minmax(190px,1fr));gap:12px}
.pro{border:1px solid var(--line);border-radius:14px;padding:18px;text-align:left;transition:.2s;display:flex;gap:12px;align-items:center}
.pro:hover{border-color:var(--gold)}
.pro.on{border-color:var(--ink);box-shadow:inset 0 0 0 1px var(--ink)}
.pro .av{width:46px;height:46px;border-radius:50%;background:var(--ink);color:var(--gold-2);display:grid;place-items:center;font-family:var(--serif);font-size:1.2rem;flex:none}
.pro .av.any{background:var(--sage);color:#fff}
.pro b{display:block;font-weight:500}
.pro small{color:var(--muted);font-size:.8rem}

.days{display:flex;gap:8px;overflow-x:auto;padding:4px 2px 12px;scroll-snap-type:x mandatory}
.day{flex:none;width:68px;border:1px solid var(--line);border-radius:14px;padding:10px 0;text-align:center;scroll-snap-align:start;transition:.2s}
.day small{display:block;font-size:.66rem;letter-spacing:.14em;text-transform:uppercase;color:var(--muted)}
.day b{display:block;font-family:var(--serif);font-size:1.6rem;font-weight:500;line-height:1.1}
.day.on{background:var(--ink);border-color:var(--ink);color:#fff}.day.on small{color:var(--gold-2)}
.day[disabled]{opacity:.35;cursor:not-allowed}
.month{font-size:.8rem;letter-spacing:.16em;text-transform:uppercase;color:var(--muted);margin:6px 0 10px}
.times{display:grid;grid-template-columns:repeat(auto-fill,minmax(88px,1fr));gap:8px;margin-top:20px}
.times button{border:1px solid var(--line);border-radius:10px;padding:11px 0;font-size:.95rem}
.times button:hover{border-color:var(--gold)}
.times button.on{background:var(--gold);border-color:var(--gold);color:var(--ink);font-weight:500}
.empty{color:var(--muted);font-size:.95rem;padding:22px 0}
.loader{display:inline-block;width:18px;height:18px;border:2px solid var(--line);border-top-color:var(--gold-deep);border-radius:50%;animation:spin .8s linear infinite;vertical-align:middle;margin-right:8px}
@keyframes spin{to{transform:rotate(360deg)}}

.form{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.form .full{grid-column:1/-1}
.form label{font-size:.74rem;letter-spacing:.14em;text-transform:uppercase;color:var(--muted);display:block;margin-bottom:6px}
.form input,.form textarea{width:100%;font:inherit;font-weight:400;border:1px solid var(--line);border-radius:10px;padding:13px 14px;background:var(--paper);color:var(--text)}
.form input:focus,.form textarea:focus{outline:none;border-color:var(--gold);background:#fff}
.policy{display:flex;gap:12px;align-items:flex-start;font-size:.9rem;color:var(--muted);background:var(--paper);border:1px solid var(--line);border-radius:12px;padding:14px 16px}
.policy input{width:18px;height:18px;margin-top:3px;accent-color:var(--ink)}
.policy b{color:var(--text);font-weight:500}

.nav-btns{display:flex;justify-content:space-between;gap:12px;margin-top:30px}

.summary{position:sticky;top:96px;background:var(--ink);color:#e9e1d7;border-radius:18px;padding:28px}
.summary h3{color:#fff;font-size:1.5rem;margin-bottom:14px}
.summary .ln{display:flex;justify-content:space-between;gap:12px;font-size:.92rem;padding:7px 0;border-bottom:1px solid var(--line-dark)}
.summary .ln span:last-child{color:var(--gold-2);white-space:nowrap}
.summary .meta{font-size:.86rem;color:var(--muted-dark);margin-top:14px;line-height:1.9}
.summary .meta b{color:#fff;font-weight:400}
.summary .tot{display:flex;justify-content:space-between;margin-top:16px;font-size:.95rem}
.summary .dep{display:flex;justify-content:space-between;align-items:baseline;margin-top:8px;padding-top:14px;border-top:1px solid var(--gold-deep)}
.summary .dep b{font-family:var(--serif);font-size:1.9rem;color:var(--gold-2);font-weight:500}
.summary .none{color:var(--muted-dark);font-size:.9rem}
.mobile-bar{display:none}
.test-banner{background:var(--sage-deep);color:#fff;text-align:center;font-size:.8rem;padding:7px 12px;letter-spacing:.04em}

@media(max-width:940px){
  .bk{grid-template-columns:1fr}
  .summary{display:none}
  .panel{padding:24px 18px}
  .mobile-bar{display:flex;position:fixed;inset:auto 0 0 0;z-index:45;background:var(--ink);color:#fff;padding:12px 18px;justify-content:space-between;align-items:center;gap:12px;box-shadow:0 -6px 20px rgba(0,0,0,.2)}
  .mobile-bar small{display:block;color:var(--muted-dark);font-size:.72rem;letter-spacing:.1em;text-transform:uppercase}
  .mobile-bar b{font-family:var(--serif);font-size:1.4rem;color:var(--gold-2);font-weight:500}
  .mobile-bar .btn{padding:12px 20px}
  .nav-btns{display:none}
  body.booking{padding-bottom:80px}
  .form{grid-template-columns:1fr}
}

/* confirmation */
.done-card{max-width:640px;margin:-34px auto 90px;background:#fff;border-radius:18px;box-shadow:0 10px 40px rgba(40,30,20,.08);padding:40px;text-align:center}
.done-card .seal{width:74px;height:74px;border-radius:50%;background:var(--ink);display:grid;place-items:center;margin:0 auto 18px}
.done-card .seal img{width:46px}
.done-card h2{font-size:2.3rem}
.done-card dl{text-align:left;margin:26px 0;border-top:1px solid var(--line)}
.done-card dl div{display:flex;justify-content:space-between;gap:16px;padding:12px 0;border-bottom:1px solid var(--line);font-size:.95rem}
.done-card dt{color:var(--muted)}
.done-card dd{text-align:right;font-weight:400}
.done-card .acts{display:flex;gap:10px;justify-content:center;flex-wrap:wrap}
@media(max-width:600px){.done-card{padding:28px 18px;margin-left:12px;margin-right:12px}}
@media(max-width:600px){
  .bk-head .brand b{font-size:1.05rem;letter-spacing:.24em}
  .bk-head .brand small{font-size:.5rem}
  .bk-head .brand img{width:34px;height:34px}
  .bk-head .back{font-size:0}.bk-head .back:before{content:"✕";font-size:1.1rem}
  .stepper div{font-size:.6rem;letter-spacing:.08em}
}