/* ============================================================
   EVERYTHING MONTERREY — Hotels directory
   Extends home.css tokens. Live-filterable Google Places data.
   ============================================================ */

.h-head{padding:clamp(2.4rem,5vw,4.2rem) var(--pad) clamp(1.4rem,3vw,2rem);border-bottom:1px solid var(--line)}
.h-head .kick{font-family:var(--mono);font-size:.72rem;letter-spacing:.16em;text-transform:uppercase;color:var(--muted)}
.h-head h1{font-size:clamp(2.1rem,5.5vw,3.8rem);line-height:1;margin:1rem 0 0;font-weight:720;letter-spacing:-.035em;color:var(--ink);text-wrap:balance}
.h-head h1 .n{color:var(--accent)}
.h-head .sub{font-size:clamp(1.02rem,2vw,1.2rem);line-height:1.45;color:var(--ink-soft);margin:1.1rem 0 0;max-width:44rem;text-wrap:pretty}

/* filter bar */
.hbar{position:sticky;top:0;z-index:50;background:rgba(244,241,234,.93);backdrop-filter:saturate(180%) blur(10px);
  -webkit-backdrop-filter:saturate(180%) blur(10px);border-bottom:1px solid var(--line);padding:.75rem var(--pad);
  display:flex;align-items:center;gap:.8rem;flex-wrap:wrap}
.hbar .field{flex:1 1 16rem;display:flex;align-items:center;gap:.6rem;border:1px solid var(--line-2);background:var(--paper);padding:.55rem .85rem}
.hbar .field:focus-within{border-color:var(--accent)}
.hbar .field svg{flex:none;width:14px;height:14px;stroke:var(--muted)}
.hbar input{flex:1;border:0;background:transparent;font-family:var(--mono);font-size:.84rem;color:var(--ink)}
.hbar input:focus{outline:none}
.hbar input::placeholder{color:var(--faint)}
.hbar select{font-family:var(--mono);font-size:.74rem;letter-spacing:.03em;text-transform:uppercase;color:var(--ink);
  background:var(--paper);border:1px solid var(--line-2);padding:.55rem .7rem;cursor:pointer}
.hbar .count{font-family:var(--mono);font-size:.72rem;letter-spacing:.06em;text-transform:uppercase;color:var(--muted);white-space:nowrap}
.hbar .count b{color:var(--accent);font-variant-numeric:tabular-nums}
.hchips{display:flex;gap:.4rem;flex-wrap:wrap;width:100%}
.hchip{font-family:var(--mono);font-size:.68rem;letter-spacing:.05em;text-transform:uppercase;padding:.45rem .7rem;
  border:1px solid var(--line-2);color:var(--muted);background:transparent;cursor:pointer;transition:.15s}
.hchip:hover{color:var(--ink)}
.hchip.on{background:var(--ink);color:var(--paper);border-color:var(--ink)}

/* grid */
.hgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(290px,1fr));gap:1px;background:var(--line);
  border:1px solid var(--line);margin:0}
.hcard{background:var(--paper);display:flex;flex-direction:column;min-width:0}
.hcard[hidden]{display:none}
.hcard .ph{aspect-ratio:3/2;overflow:hidden;background:var(--desk);position:relative}
.hcard .ph img{width:100%;height:100%;object-fit:cover;transition:transform .5s ease}
.hcard:hover .ph img{transform:scale(1.04)}
.hcard .ph.none{display:flex;align-items:center;justify-content:center}
.hcard .ph.none span{font-family:var(--mono);font-size:.7rem;letter-spacing:.1em;text-transform:uppercase;color:var(--faint)}
.hcard .ph .rank{position:absolute;top:0;left:0;font-family:var(--mono);font-size:.64rem;letter-spacing:.06em;
  color:#fff;background:rgba(23,21,15,.62);padding:.3rem .5rem}
.hcard .hb{padding:.95rem 1rem 1.1rem;display:flex;flex-direction:column;gap:.5rem;flex:1}
.hcard .hname{font-size:1.04rem;font-weight:640;letter-spacing:-.01em;color:var(--ink);line-height:1.25}
.hcard .hmeta{display:flex;align-items:center;gap:.7rem;flex-wrap:wrap;font-family:var(--mono);font-size:.74rem}
.hcard .stars{color:var(--accent);font-weight:700}
.hcard .stars .rv{color:var(--muted);font-weight:400}
.hcard .price{color:var(--ink);letter-spacing:.05em}
.hcard .badge{font-family:var(--mono);font-size:.64rem;letter-spacing:.08em;text-transform:uppercase;color:var(--accent-ink);
  border:1px solid var(--line-2);padding:.1rem .4rem}
.hcard .haddr{font-size:.82rem;color:var(--muted);line-height:1.4;flex:1}
.hcard .hlinks{display:flex;gap:1rem;font-family:var(--mono);font-size:.7rem;letter-spacing:.04em;text-transform:uppercase;margin-top:.2rem}
.hcard .hlinks a{color:var(--accent-ink);display:inline-flex;gap:.3rem;align-items:center}
.hcard .hlinks a:hover{color:var(--accent)}

.hnone{display:none;padding:3rem var(--pad);text-align:center;font-family:var(--mono);font-size:.84rem;color:var(--muted)}
.hnone.show{display:block}

.hsource{padding:1.4rem var(--pad);border-top:1px solid var(--line);font-family:var(--mono);font-size:.7rem;
  letter-spacing:.03em;color:var(--muted);line-height:1.6}

/* featured local stays (directory guides) */
.featstays{padding:clamp(2rem,4vw,3.2rem) var(--pad);border-bottom:1px solid var(--line)}
.featstays .cap{font-family:var(--mono);font-size:.72rem;letter-spacing:.16em;text-transform:uppercase;color:var(--accent)}
.featstays h2{font-size:clamp(1.5rem,3.2vw,2.2rem);font-weight:680;letter-spacing:-.025em;color:var(--ink);margin:.5rem 0 .4rem;text-wrap:balance}
.featstays p{color:var(--muted);margin:0 0 1.4rem;max-width:46rem}
.staygrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:1px;background:var(--line);border:1px solid var(--line)}
.staycard{background:var(--paper);display:flex;flex-direction:column;text-decoration:none;transition:background .2s}
.staycard:hover{background:#FBF9F4}
.staycard .ph{aspect-ratio:3/2;overflow:hidden;background:var(--desk)}
.staycard .ph img{width:100%;height:100%;object-fit:cover;transition:transform .5s ease}
.staycard:hover .ph img{transform:scale(1.04)}
.staycard .sb{padding:.85rem 1rem 1rem;display:flex;flex-direction:column;gap:.35rem;flex:1}
.staycard .sname{font-size:1rem;font-weight:640;color:var(--ink);letter-spacing:-.01em;line-height:1.2}
.staycard .smeta{font-family:var(--mono);font-size:.7rem;color:var(--muted);display:flex;gap:.6rem;flex-wrap:wrap}
.staycard .smeta .sr{color:var(--accent);font-weight:700}
.staycard .sgo{margin-top:auto;font-family:var(--mono);font-size:.68rem;letter-spacing:.06em;text-transform:uppercase;color:var(--accent-ink)}
.hcard .guidelink{font-family:var(--mono);font-size:.66rem;letter-spacing:.05em;text-transform:uppercase;color:var(--accent-ink);display:inline-flex;gap:.3rem;align-items:center}

.staycard .steaser{font-size:.83rem;line-height:1.42;color:var(--muted);margin:.15rem 0 .25rem;
  display:-webkit-box;-webkit-line-clamp:3;line-clamp:3;-webkit-box-orient:vertical;overflow:hidden;text-wrap:pretty}

/* full-directory header */
.dir-head{padding:clamp(2rem,4vw,3rem) var(--pad);border-bottom:1px solid var(--line)}
.dir-head h2{font-size:clamp(1.5rem,3.2vw,2.2rem);font-weight:680;letter-spacing:-.025em;color:var(--ink);margin:.5rem 0 .35rem}
.dir-head p{color:var(--muted);margin:0;max-width:48rem;line-height:1.5}
.dir-head p b{color:var(--ink)}
.featstays button.more{background:none;border:0;cursor:pointer;font:inherit;padding:0}
