/* Open Locally, the calm look (Glenn, 30 Oct 2026): one style for the
   directory, city, category, jobs and guides pages, the same as the property
   pages. Sora headings, Inter text, thin lines, rounded cards, cream and deep
   green; no thick black borders or offset shadows (those stay on Tappl).
   Linked last on each page, so it wins over the page's own older styles. */
:root{
  --okbg:#fbfaf7; --okcream:#f6f2ea; --oktint:#e3efeb; --okline:rgba(20,32,30,.12);
  --okink:#16201d; --okbody:rgba(22,32,29,.80); --okmuted:rgba(22,32,29,.56);
  --okteal:#0f7d6f; --okdeep:#0e3b35;
}
body{font-family:'Inter',system-ui,-apple-system,sans-serif !important;background:var(--okbg) !important;color:var(--okink)}
h1,h2,h3,.biz-name,.card-title,.prop-headline{font-family:'Sora',system-ui,sans-serif !important;letter-spacing:-.02em !important;color:var(--okink)}
h1{font-weight:800 !important}

/* header and footer (same as the property pages) */
.ok-wrap{max-width:1180px;margin:0 auto;padding:0 32px}
.ok-nav{border-bottom:1px solid var(--okline);background:var(--okbg);position:sticky;top:0;z-index:30}
.ok-nav .ok-wrap{display:flex;align-items:center;justify-content:space-between;height:64px}
.ok-brand{display:flex;align-items:center;gap:10px;font-family:'Plus Jakarta Sans','Inter',sans-serif;font-weight:800;letter-spacing:-.03em;font-size:1.35rem;color:var(--okink);text-decoration:none}
.ok-brand img{width:24px;height:30px}
.ok-links a{font-size:.92rem;font-weight:500;margin-left:1.4rem;color:var(--okink);text-decoration:none;white-space:nowrap}
.ok-links a:hover,.ok-links a.on{color:var(--okteal)}
.ok-foot{text-align:left;background:var(--okdeep);color:rgba(255,255,255,.8);padding:36px 0 60px;font-size:.86rem;margin-top:60px}
.ok-foot .ok-brand{color:#fff;margin-bottom:10px}
.ok-foot a{color:#fff}
@media(max-width:760px){
  .ok-nav .ok-wrap{flex-wrap:wrap;height:auto;padding:10px 16px 0}
  .ok-links{width:100%;display:flex;overflow-x:auto;white-space:nowrap;scrollbar-width:none;padding:6px 0 10px;-webkit-overflow-scrolling:touch}
  .ok-links::-webkit-scrollbar{display:none}
  .ok-links a{margin:0 18px 0 0;font-size:14px}
  .ok-wrap{padding:0 16px}
}

/* dark page tops become light */
.page-header{background:var(--okbg) !important;color:var(--okink) !important;padding:56px 24px 24px !important}
.page-header::before,.page-header::after{display:none !important}
.page-header h1{color:var(--okink) !important;font-size:clamp(2.4rem,5vw,3.6rem) !important}
.page-header p{color:var(--okmuted) !important}
.page-header .eyebrow{color:var(--okink) !important}
.post-banner{background:var(--okcream) !important;border:0 !important;border-top:1px solid var(--okline) !important;border-bottom:1px solid var(--okline) !important}
.quick-pick{border:1px solid var(--okline) !important;box-shadow:none !important;background:#fff !important;border-radius:999px !important}
.quick-pick.active,.quick-pick:hover{background:var(--okdeep) !important;color:#fff !important;border-color:var(--okdeep) !important}
/* (a page top with a photo, .has-bg, or a sky, .sky, keeps its own look) */
.hero:not(.has-bg):not(.sky),.page-hero,.city-hero,.cat-hero{background:var(--okbg) !important;color:var(--okink) !important;border:0 !important}
.hero:not(.has-bg):not(.sky)::before,.hero:not(.has-bg):not(.sky)::after{display:none !important}
.hero:not(.has-bg) h1,.hero:not(.has-bg) p,.hero:not(.has-bg) .eyebrow{color:var(--okink) !important}
.hero:not(.has-bg) p{color:var(--okmuted) !important}
.hero h1 em{font-style:normal !important;color:var(--okteal) !important}
.eyebrow{font-family:'Inter',sans-serif !important;font-weight:600 !important;letter-spacing:.02em !important;text-transform:none !important;color:var(--okink) !important}
.eyebrow .dot{display:none !important}

/* businesses: cards, filters, region tree, chips */
.biz-card{background:#fff !important;border:1px solid var(--okline) !important;border-radius:22px !important;box-shadow:none !important}
.biz-card:hover{transform:translateY(-3px) !important;box-shadow:0 14px 36px rgba(14,59,53,.12) !important}
.biz-photo,.biz-photo-placeholder{border-right:0 !important}
.filters-bar{background:var(--okcream) !important;border:1px solid var(--okline) !important;border-radius:18px !important;box-shadow:none !important}
.filters-bar select,.search-wrap input,.filters select,.filters input{border:1px solid var(--okline) !important;border-radius:10px !important;background:#fff !important}
.clear-btn,.more-btn,.family-row button{border:1px solid var(--okline) !important;box-shadow:none !important;background:#fff !important;font-weight:600 !important}
.clear-btn:hover,.more-btn:hover,.family-row button:hover{background:var(--okdeep) !important;color:#fff !important;transform:none !important}
.dir-region{background:#fff !important;border:1px solid var(--okline) !important;border-radius:16px !important;box-shadow:none !important}
.dir-region summary{font-family:'Sora',sans-serif !important;font-weight:700 !important}
.dir-region summary::before{border:1px solid var(--okline) !important;border-radius:50% !important}
.dir-region[open] summary::before{background:var(--okdeep) !important;color:#fff !important}
.dir-towns li a{border:1px solid var(--okline) !important;background:#fff !important}
.dir-towns li a:hover{background:var(--okdeep) !important;color:#fff !important}
.results-count{font-family:'Inter',sans-serif !important;font-weight:600 !important;letter-spacing:.02em !important;text-transform:none !important;color:var(--okmuted) !important}

/* city and category pages, jobs, guides: cards and chips */
.card,.cat-card,.guide-card,.job-card,.deal-card,.listing-card{border:1px solid var(--okline) !important;border-radius:22px !important;box-shadow:none !important;background:#fff !important}
.card:hover,.cat-card:hover,.guide-card:hover,.job-card:hover,.listing-card:hover{box-shadow:0 14px 36px rgba(14,59,53,.12) !important}
.pill,.chip,.tag,.type-pill{border-radius:999px !important}