:root{
  --ink:#15282e; --soft:#5a6f74; --line:#e3e9e8; --bg:#f7f9f8;
  --sea:#0b6e6e; --sea-dark:#07514f; --sea-tint:#e5f1ef;
  --sun:#f4a72c; --ok:#1f7a43; --ok-tint:#e6f3ea;
  --warn-tint:#f7ecd9; --red:#c0392b;
  --serif:'Fraunces',serif;
}
.hero{background:linear-gradient(160deg,#0b6e6e,#0d5a66);padding:70px 0 90px}
  .hero h1{font-family:var(--serif);color:#fff;font-size:34px;margin-bottom:6px}
  .hero p{color:#bfe0dc;font-size:14.5px;margin-bottom:26px}
  .panel{background:#fff;border-radius:16px;padding:14px;box-shadow:0 14px 40px rgba(6,50,52,.30)}
  .prow{display:grid;grid-template-columns:2.2fr 1.2fr 1.2fr 1.6fr auto;gap:10px}
  @media(max-width:860px){.prow{grid-template-columns:1fr 1fr}}
  .pf{position:relative;padding:8px 12px;border:1px solid var(--line);border-radius:10px}
  .pf:focus-within{border-color:var(--sea);outline:2px solid var(--sea-tint)}
  .pf label{display:block;font-size:10px;font-weight:700;text-transform:uppercase;letter-spacing:.06em;color:var(--soft)}
  .pf input,.pf select{border:none;outline:none;width:100%;font-family:inherit;font-size:14px;font-weight:600;background:none;padding:2px 0}
  .searchbtn{background:var(--sun);border:none;border-radius:10px;font-weight:800;font-size:14px;padding:0 30px;cursor:pointer;color:#3a2a05}
  .searchbtn:hover{filter:brightness(1.05)}

  .ac{position:absolute;left:0;right:0;top:calc(100% + 6px);background:#fff;border:1px solid var(--line);border-radius:10px;box-shadow:0 10px 26px rgba(21,40,46,.14);z-index:30;overflow:hidden;display:none}
  .ac.open{display:block}
  .ac .grp{font-size:10px;text-transform:uppercase;letter-spacing:.06em;color:var(--soft);padding:8px 13px 3px;font-weight:700}
  .ac .it{padding:8px 13px;cursor:pointer;display:flex;gap:9px;align-items:center;font-size:13.5px}
  .ac .it:hover{background:var(--sea-tint)}
  .ac .it small{color:var(--soft);margin-left:auto}

  .gpop{position:absolute;right:0;top:calc(100% + 6px);width:330px;background:#fff;border:1px solid var(--line);border-radius:12px;box-shadow:0 10px 26px rgba(21,40,46,.16);z-index:30;padding:16px;display:none}
  .gpop.open{display:block}
  .groom{border:1px solid var(--line);border-radius:9px;padding:11px 13px;margin-bottom:10px}
  .groom h5{font-size:12.5px;margin-bottom:8px;display:flex}
  .groom h5 button{margin-left:auto;border:none;background:none;color:var(--red);font-size:11.5px;cursor:pointer;text-decoration:underline}
  .stp{display:flex;align-items:center;justify-content:space-between;padding:4px 0;font-size:13px}
  .stp .ctl{display:flex;align-items:center;gap:10px}
  .stp button{width:26px;height:26px;border-radius:7px;border:1px solid #cfd6df;background:#fff;font-size:15px;cursor:pointer;font-weight:700;color:var(--sea-dark)}
  .stp button:disabled{opacity:.35;cursor:default}
  .ages{display:flex;gap:6px;flex-wrap:wrap;margin-top:6px}
  .ages select{border:1px solid #cfd6df;border-radius:7px;padding:4px 7px;font-size:12px;font-family:inherit}
  .addroom{width:100%;border:1px dashed #b9c8c5;background:none;border-radius:9px;padding:9px;font-weight:700;color:var(--sea-dark);cursor:pointer;font-size:13px}
  .occwarn{margin-top:10px;font-size:12px;border-radius:8px;padding:9px 12px;display:none}
  .occwarn.warn{display:block;background:var(--warn-tint);color:#7c4a03}
  .occwarn.ok{display:block;background:var(--ok-tint);color:var(--ok)}
  .occwarn button{border:none;background:var(--sea);color:#fff;border-radius:6px;padding:4px 10px;font-size:11.5px;font-weight:700;cursor:pointer;margin-top:6px}
  .gdone{width:100%;background:var(--sea);color:#fff;border:none;border-radius:9px;padding:10px;font-weight:700;cursor:pointer;margin-top:4px;font-family:inherit}

  .quick{display:flex;gap:10px;margin-top:18px;flex-wrap:wrap}
  .quick a{background:rgba(255,255,255,.14);color:#fff;text-decoration:none;font-size:12.5px;font-weight:600;border-radius:20px;padding:7px 15px}
  .quick a:hover{background:rgba(255,255,255,.24)}