/* Booking bar */
.bookbar{position:relative; z-index:2; margin-top:28px; background:var(--white); color:var(--text); border-radius:14px; box-shadow:0 18px 40px rgba(8,40,42,.28); padding:18px; display:grid; grid-template-columns:repeat(4,minmax(0,1fr)) auto; gap:14px; align-items:end}
.f{display:flex; flex-direction:column; gap:6px; min-width:0}
.f label{font-size:12px; font-weight:600; letter-spacing:.08em; text-transform:uppercase; color:var(--muted)}
.f input,.f select,.f textarea{font:16px var(--body); color:var(--text); background:var(--paper); border:1px solid var(--line); border-radius:8px; padding:12px; width:100%; min-width:0}
.f textarea{resize:vertical; min-height:90px}
.f input[type=radio],.f input[type=checkbox]{width:auto; padding:0; flex:none; min-width:auto; background:none}
.f input:focus,.f select:focus,.f textarea:focus{outline:2px solid var(--teal); outline-offset:0; border-color:var(--teal)}
.f .hint{font-size:12.5px; color:var(--muted)}
.f.invalid input,.f.invalid select{border-color:var(--err); background:#FBF0EE}
.f .err{font-size:12.5px; color:var(--err); display:none}
.f.invalid .err{display:block}
@media (max-width:900px){.bookbar{grid-template-columns:1fr 1fr} .bookbar .btn{grid-column:1/-1}}
@media (max-width:440px){.bookbar{grid-template-columns:1fr}}

