/* Shared styles for the city and listing pages (built by tools/build_pages.py) */
:root{--ground:#F8F8F6;--ink:#22292A;--teal:#1E5E63;--teal-light:#3A7F85;--teal-pale:#CFE3E1;--teal-dark:#174650;--terracotta:#A9553A;--secondary:#3F4849;--muted:#636B69;--hairline:#E6DDCF;--sand:#F0EAE0;--white:#fff;}
*{box-sizing:border-box}
body{margin:0;background:var(--ground);color:var(--ink);font:16px/1.6 'Inter',system-ui,-apple-system,sans-serif;}
img{max-width:100%;display:block}
a{color:var(--teal)}
h1,h2,h3{font-family:'Bricolage Grotesque','Inter',system-ui,sans-serif;letter-spacing:-0.02em;line-height:1.15;text-wrap:balance;margin:0}
h1{font-size:clamp(1.7rem,4vw,2.4rem);margin:0.4rem 0 1rem;color:var(--ink)}
h2{font-size:1.3rem;margin-bottom:0.75rem}
.wrap{max-width:1120px;margin:0 auto;padding-inline:20px}
.top{position:sticky;top:0;z-index:20;background:rgba(255,255,255,0.97);border-bottom:1px solid var(--hairline)}
.top-in{display:flex;align-items:center;gap:1rem;justify-content:space-between;flex-wrap:wrap;padding-block:10px}
.brand{display:flex;align-items:center;gap:8px;font-family:'Bricolage Grotesque',sans-serif;font-weight:700;color:var(--ink);text-decoration:none;font-size:1.05rem}
.brand img{border-radius:0;height:30px;width:auto}
.links{display:flex;gap:4px;flex-wrap:wrap}
.links a{text-decoration:none;color:var(--secondary);font-size:0.85rem;font-weight:500;padding:6px 12px;border-radius:999px}
.links a[aria-current]{background:var(--teal);color:#fff;font-weight:600}
.crumbs{font-size:0.82rem;color:var(--muted);margin:1.25rem 0 0}
.crumbs a{color:var(--muted)}
.lead{max-width:65ch;color:var(--secondary);margin:0 0 0.9rem}
.kicker{font-size:0.72rem;font-weight:600;letter-spacing:0.12em;text-transform:uppercase;color:var(--terracotta);margin:0}
.note,.small{font-size:0.8rem;color:var(--muted)}
.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:20px;margin:1.75rem 0 0.75rem}
.card{background:#fff;border-radius:16px;overflow:hidden;text-decoration:none;color:var(--ink);border:1px solid var(--hairline);transition:transform .2s,box-shadow .2s}
.card:hover{transform:translateY(-3px);box-shadow:0 10px 24px rgba(0,0,0,0.08)}
.card img{width:100%;aspect-ratio:4/3;object-fit:cover}
.card-b{padding:14px 16px 16px}
.card h3{font-size:1.1rem;margin:4px 0 8px}
.month{color:var(--terracotta);font-weight:600;margin:0;font-variant-numeric:tabular-nums}
.night{color:var(--secondary);font-size:0.9rem;margin:0}
.block{margin:2.5rem 0 0}
.area-map{position:relative;z-index:0;height:340px;border-radius:16px;overflow:hidden;border:1px solid var(--hairline);background:#e9e6df}
/* listing page */
.hero-grid{position:relative;display:grid;gap:6px;border-radius:16px;overflow:hidden;margin-top:1rem;grid-template-columns:2fr 1fr 1fr;grid-template-rows:200px 200px}
.hero-grid img{width:100%;height:100%;object-fit:cover}
.hero-grid img:first-child{grid-row:span 2}
.hero-grid.n1{grid-template-columns:1fr;grid-template-rows:420px}
.hero-grid.n2,.hero-grid.n3,.hero-grid.n4{grid-template-columns:2fr 1fr}
.hero-grid.n4 img:nth-child(4){display:none}
.all{position:absolute;right:14px;bottom:14px;background:#fff;color:var(--ink);text-decoration:none;font-size:0.85rem;font-weight:600;padding:8px 14px;border-radius:10px;box-shadow:0 2px 8px rgba(0,0,0,0.15)}
.cols{display:grid;grid-template-columns:minmax(0,1fr) 340px;gap:48px;margin-top:1.75rem}
.rating a{color:var(--ink);font-weight:500}
.facts{display:grid;grid-template-columns:repeat(auto-fill,minmax(120px,1fr));gap:14px;margin:1.25rem 0;padding:1rem 0;border-block:1px solid var(--hairline)}
.facts strong{display:block;font-size:0.98rem}
.facts span{font-size:0.8rem;color:var(--muted)}
.highlight{background:#FEF3C7;border:1px solid #F6D860;color:#7A5C00;border-radius:10px;padding:10px 14px;font-weight:600;font-size:0.9rem}
blockquote{margin:1rem 0 0;border-left:3px solid var(--terracotta);padding:8px 14px;color:var(--secondary);font-style:italic;background:var(--sand);border-radius:0 8px 8px 0}
.amen{columns:2;column-gap:2rem;padding:0;margin:0;list-style:none}
.amen li{padding:4px 0 4px 22px;position:relative;break-inside:avoid}
.amen li::before{content:'✓';position:absolute;left:0;color:var(--terracotta);font-weight:700}
.photos{display:grid;grid-template-columns:repeat(2,1fr);gap:8px}
.photos img{width:100%;aspect-ratio:4/3;object-fit:cover;border-radius:10px}
.book-card{position:sticky;top:84px;background:#fff;border:1px solid var(--hairline);border-radius:16px;padding:22px;box-shadow:0 6px 20px rgba(0,0,0,0.06)}
.price{margin:0;font-size:1rem}.price strong{font-size:1.5rem}
.btn{display:block;text-align:center;background:var(--terracotta);color:#fff;text-decoration:none;font-weight:600;padding:13px 18px;border-radius:999px;margin:14px 0 10px}
.btn:hover{background:#8F4630}
.mbar{display:none}
.foot{margin-top:4rem;background:var(--ink);color:rgba(255,255,255,0.7);font-size:0.83rem;padding-block:1.6rem}
.foot strong{color:#fff}.foot a{color:rgba(255,255,255,0.85)}
@media(max-width:820px){
  .cols{grid-template-columns:1fr;gap:0}
  .book{display:none}
  .hero-grid,.hero-grid.n2,.hero-grid.n3,.hero-grid.n4,.hero-grid.n5{grid-template-columns:1fr;grid-template-rows:280px;margin-inline:-20px;border-radius:0}
  .hero-grid img:not(:first-child){display:none}
  .amen{columns:1}
  .mbar{display:flex;position:fixed;left:0;right:0;bottom:0;z-index:30;align-items:center;justify-content:space-between;gap:12px;background:#fff;border-top:1px solid var(--hairline);padding:10px 20px calc(10px + env(safe-area-inset-bottom,0px))}
  .mbar span{font-size:0.8rem;color:var(--terracotta);font-weight:600}
  .mbar .btn{margin:0;padding:11px 26px}
  .foot{padding-bottom:6rem}
  .links{flex-wrap:nowrap;overflow-x:auto;width:100%;scrollbar-width:none}
  .links::-webkit-scrollbar{display:none}
  .links a{padding:5px 10px;white-space:nowrap}
}
.policies{display:grid;gap:14px;margin:0}
.policies dt{font-weight:600}
.policies dd{margin:2px 0 0;color:var(--secondary);font-size:0.92rem;max-width:65ch}
