:root{
  --paper:#FAFAF8;
  --panel:#FFFFFF;
  --tint:#F4F5F3;
  --ink:#161C22;
  --ink2:#414C56;
  --ink3:#727D87;
  --ink4:#9AA4AD;
  --rule:#DCDCD6;
  --rule2:#EAEAE4;
  --accent:#8C2F39;        /* oxblood: actions and emphasis only */
  --accent-d:#71252E;
  --accent-t:#F6EEEE;
  --flag:#B0741A;          /* concerns only */
  --sans:'Inter',system-ui,-apple-system,'Segoe UI',sans-serif;
  /* Headings only. Fraunces carries optical sizing, so it tightens as it
     grows instead of looking like body text that was scaled up. */
  --display:'Fraunces',Georgia,serif;
  --prose:'Source Serif 4',Georgia,serif;
  --wrap:1180px;
  --read:648px;
}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--paper);color:var(--ink);font-family:var(--sans);font-size:16.5px;line-height:1.6;-webkit-font-smoothing:antialiased;font-variant-numeric:tabular-nums}
a{color:var(--accent);text-decoration:none}
a:hover{text-decoration:underline;text-underline-offset:2px}
:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
h1,h2,h3,h4{margin:0;font-family:var(--display);font-weight:600;letter-spacing:-0.015em;font-optical-sizing:auto}
p{margin:0 0 1em}
ul{margin:0;padding:0;list-style:none}
img{max-width:100%;height:auto}

/* icons: one sprite, currentColor, no extra requests */
.ic{width:19px;height:19px;flex:0 0 19px;stroke:currentColor;fill:none;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round;display:inline-block;vertical-align:-3px}
.ic-lg{width:26px;height:26px;flex-basis:26px;stroke-width:1.4}
.ic-sm{width:15px;height:15px;flex-basis:15px;vertical-align:-2px}

/* prototype chrome */
.proto{position:sticky;top:0;z-index:90;background:#111721;color:#DCE0E4;border-bottom:1px solid #000}
.proto-in{max-width:var(--wrap);margin:0 auto;padding:8px 24px;display:flex;gap:5px;align-items:center;flex-wrap:wrap}
.proto-lab{font-size:11px;color:#7A858F;margin-right:10px}
.proto button{font:inherit;font-size:12.5px;background:transparent;border:1px solid transparent;color:#A7B1BA;padding:4px 10px;cursor:pointer;border-radius:2px}
.proto button:hover{color:#fff;border-color:#333C46}
.proto button[aria-current="true"]{background:#DCE0E4;color:#111721;border-color:#DCE0E4}

/* type */
.h-xl{font-size:clamp(34px,5vw,62px);line-height:1.02;font-weight:600;letter-spacing:-0.028em}
.h-lg{font-size:clamp(25px,3vw,36px);line-height:1.12;letter-spacing:-0.022em}
.lede{font-size:20.5px;line-height:1.52;color:var(--ink2);max-width:720px;font-weight:400;letter-spacing:-0.004em}
.small{font-size:13.5px;color:var(--ink3);line-height:1.5}
.tiny{font-size:12px;color:var(--ink3);letter-spacing:0.01em}
.wrap{max-width:var(--wrap);margin:0 auto;padding:0 24px}

/* masthead */
.mast{background:var(--panel);border-bottom:1px solid var(--rule)}
.mast-in{max-width:var(--wrap);margin:0 auto;padding:0 24px;display:flex;align-items:stretch}
.logo{display:flex;align-items:center;gap:10px;font-size:18px;font-weight:600;letter-spacing:-0.03em;color:var(--ink);padding:15px 0}
.logo .mk{width:19px;height:19px;flex:0 0 19px;display:block;overflow:visible}
.logo em{font-style:normal;font-size:11px;font-weight:400;color:var(--ink3);letter-spacing:0;align-self:flex-start;padding-top:3px}
.mast nav{margin-left:auto;display:flex}
.mast nav a{color:var(--ink2);font-size:14px;padding:0 15px;display:flex;align-items:center;gap:7px;border-left:1px solid var(--rule2)}
.mast nav a:hover{background:var(--tint);text-decoration:none;color:var(--ink)}
.mast nav a .ic{color:var(--ink4)}
.mast nav a:hover .ic{color:var(--accent)}

.crumbs{font-size:13px;color:var(--ink3);padding:16px 0 14px;display:flex;align-items:center;gap:7px;flex-wrap:wrap}
.crumbs a{color:var(--ink3)}
.crumbs i{font-style:normal;color:var(--ink4)}

/* provenance: shapes only, never icons */
.pv{display:inline-block;width:9px;height:9px;flex:0 0 9px;box-sizing:border-box}
.pv-v{background:var(--ink)}
.pv-c{border:1.5px solid var(--ink)}
.pv-d{background:linear-gradient(135deg,var(--ink) 0 50%,transparent 50% 100%);border:1.5px solid var(--ink)}
.pv-u{border:1.5px dotted var(--ink4)}
.legend{display:flex;gap:19px;flex-wrap:wrap;font-size:12.5px;color:var(--ink2);align-items:center;margin:0}
.legend .it{display:flex;align-items:center;gap:8px}

/* HERO with photography */
.hero{position:relative;background:#161C22;color:#EDEFF1;overflow:hidden}
.hero-img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:.34}
.hero-scrim{position:absolute;inset:0;background:linear-gradient(100deg,#12181E 8%,rgba(18,24,30,.86) 46%,rgba(18,24,30,.55) 100%)}
.hero-in{position:relative;max-width:var(--wrap);margin:0 auto;padding:74px 24px 66px;display:grid;grid-template-columns:1.1fr .9fr;gap:64px;align-items:end}
.hero-kick{display:flex;align-items:center;gap:9px;font-size:12.5px;color:#C9A9AD;margin-bottom:20px}
.hero-kick::before{content:"";width:34px;height:2px;background:var(--accent);flex:0 0 34px}
.hero h1{color:#F7F8F8;max-width:15ch}
.hero .lede{color:#B9C1C8;margin-top:20px}
.search{margin-top:30px;display:flex;background:#fff;border-radius:2px;overflow:hidden;max-width:540px;box-shadow:0 2px 12px rgba(0,0,0,.24)}
.search .fld{display:flex;align-items:center;gap:9px;padding:0 13px;flex:1;min-width:0}
.search .fld .ic{color:var(--ink4)}
.search .fld.city{flex:0 0 37%;border-left:1px solid var(--rule)}
.search input{flex:1;border:0;padding:14px 0;font:inherit;font-size:15px;background:transparent;min-width:0;color:var(--ink)}
.search input::placeholder{color:var(--ink3)}
.search button{border:0;background:var(--accent);color:#fff;font:inherit;font-size:14px;font-weight:600;padding:0 22px;cursor:pointer;display:flex;align-items:center;gap:8px}
.search button:hover{background:var(--accent-d)}
.hero-note{margin-top:15px;font-size:13px;color:#8E99A2;max-width:470px}

/* provenance ledger, hero right */
.ledger{background:rgba(255,255,255,.055);border:1px solid rgba(255,255,255,.16);border-radius:2px;backdrop-filter:blur(2px)}
.ledger-h{padding:14px 18px;border-bottom:1px solid rgba(255,255,255,.14);display:flex;align-items:center;gap:10px}
.ledger-h h2{font-size:14.5px;color:#F2F4F5}
.ledger-h .ic{color:#C9A9AD}
.ledger-h .ct{margin-left:auto;font-size:11.5px;color:#8E99A2}
.lr{padding:12px 18px;border-bottom:1px solid rgba(255,255,255,.09)}
.lr:last-child{border-bottom:0}
.lr-top{display:flex;align-items:baseline;gap:12px;margin-bottom:8px}
.lr-top .nm{font-size:13.5px;color:#E7EAEC;font-weight:600}
.lr-top .n{margin-left:auto;font-size:13px;color:#B9C1C8}
.lr .track{height:5px;background:rgba(255,255,255,.13);display:flex;overflow:hidden}
.lr .track i{display:block;height:100%}
.bv{background:#F0F2F3}
.bc{background:repeating-linear-gradient(90deg,#F0F2F3 0 2px,transparent 2px 4px)}
.bd{background:repeating-linear-gradient(45deg,#F0F2F3 0 3px,transparent 3px 6px)}
.bu{background:repeating-linear-gradient(90deg,#93A0A8 0 2px,transparent 2px 5px)}
.lr .desc{font-size:12px;color:#8E99A2;line-height:1.42;margin:7px 0 0}

/* stat strip */
.stats{background:var(--panel);border-bottom:1px solid var(--rule)}
.stats-in{max-width:var(--wrap);margin:0 auto;padding:0 24px;display:grid;grid-template-columns:repeat(4,1fr)}
.st{padding:22px 22px 24px;border-right:1px solid var(--rule2);display:flex;gap:14px;align-items:flex-start}
.st:first-child{padding-left:0}
.st:last-child{border-right:0}
.st .ic{color:var(--accent);margin-top:5px}
.st .v{font-size:27px;line-height:1;font-weight:600;letter-spacing:-0.035em}
.st .l{font-size:12.5px;color:var(--ink3);margin-top:8px;max-width:170px}

/* panels */
.panel{background:var(--panel);border:1px solid var(--rule);border-radius:2px;margin-bottom:16px}
.panel-h{display:flex;align-items:center;gap:11px;padding:15px 22px;border-bottom:1px solid var(--rule2)}
.panel-h .ic{color:var(--accent)}
.panel-h h2{font-size:16.5px}
.panel-h .small{margin-left:auto}
.panel-b{padding:22px}
.panel-b.flush{padding:0}
.panel-b.tight{padding:14px 22px}

/* trade cards with icons */
.trades{display:grid;grid-template-columns:repeat(3,1fr)}
.tcard{display:flex;align-items:center;gap:13px;padding:15px 20px;border-right:1px solid var(--rule2);border-bottom:1px solid var(--rule2);color:var(--ink)}
.tcard:nth-child(3n){border-right:0}
.tcard:hover{background:var(--tint);text-decoration:none}
.tcard .ic{color:var(--ink3)}
.tcard:hover .ic{color:var(--accent)}
.tcard .nm{font-size:14.5px;font-weight:600;letter-spacing:-0.01em}
.tcard .n{margin-left:auto;font-size:12px;color:var(--ink3)}
.tgrp{grid-column:1/-1;padding:13px 20px 11px;border-bottom:1px solid var(--rule);background:var(--tint);font-size:12px;color:var(--ink3);display:flex;align-items:center;gap:9px}
.tgrp .ic{color:var(--ink4)}

/* how it works, with icons */
.steps{display:grid;grid-template-columns:repeat(4,1fr)}
.stp{padding:22px;border-right:1px solid var(--rule2)}
.stp:last-child{border-right:0}
.stp .top{display:flex;align-items:center;gap:10px;margin-bottom:11px}
.stp .top .ic{color:var(--accent)}
.stp .top .n{font-size:11px;color:var(--ink4);margin-left:auto}
.stp h3{font-size:15.5px;margin-bottom:7px}
.stp p{font-size:13.5px;color:var(--ink2);margin:0;line-height:1.5}

/* updates */
.up{display:grid;grid-template-columns:1fr 250px 78px;gap:18px;padding:12px 22px;border-bottom:1px solid var(--rule2);align-items:center}
.up:last-child{border-bottom:0}
.up .nm{font-size:14.5px;font-weight:600}
.up .ch{font-size:13px;color:var(--ink2);display:flex;align-items:center;gap:9px}
.up .dt{font-size:11.5px;color:var(--ink3);text-align:right}

/* inner shell */
.shell{display:grid;grid-template-columns:1fr 296px;gap:38px;align-items:start;padding-bottom:8px}
.side{position:sticky;top:56px}
.phead{padding:6px 0 26px}
.phead .h-xl{max-width:900px}
.phead .lede{margin-top:15px}
.phead .meta{display:flex;gap:18px;flex-wrap:wrap;align-items:center;margin-top:18px;font-size:13px;color:var(--ink3)}
.phead .meta span{display:flex;align-items:center;gap:7px}
.phead .meta .ic{color:var(--ink4)}

/* the computed finding */
.finding{background:var(--panel);border:1px solid var(--rule);border-left:3px solid var(--accent);border-radius:2px;padding:22px 26px;margin-bottom:16px}
.finding .top{display:flex;align-items:center;gap:9px;font-size:12px;color:var(--accent);margin-bottom:11px}
.finding p{font-family:var(--prose);font-size:18.5px;line-height:1.52;margin:0;max-width:64ch}
.finding .src{display:block;margin-top:12px;font-size:11.5px;color:var(--ink3);font-family:var(--sans)}

/* fact rows */
.facts{border-top:1px solid var(--rule2)}
.f{display:grid;grid-template-columns:180px 1fr auto;gap:18px;padding:11px 22px 11px 36px;border-bottom:1px solid var(--rule2);align-items:baseline;position:relative}
.f:last-child{border-bottom:0}
.f::before{content:"";position:absolute;left:22px;top:14px;width:9px;height:9px;box-sizing:border-box}
.f.v::before{background:var(--ink)}
.f.c::before{border:1.5px solid var(--ink)}
.f.d::before{background:linear-gradient(135deg,var(--ink) 0 50%,transparent 50% 100%);border:1.5px solid var(--ink)}
.f.u::before{border:1.5px dotted var(--ink4)}
.f dt{font-size:13.5px;color:var(--ink3)}
.f dd{margin:0;font-size:15px}
.f .src{font-size:11px;color:var(--ink4);white-space:nowrap}
.f.u dd{color:var(--ink4);font-style:italic}

/* geo */
.geo{display:grid;grid-template-columns:repeat(4,1fr)}
/* A place with no page of its own is a span, not an anchor with nowhere to
   go, so the cell is styled by position rather than by being a link. */
.geo > *{display:flex;justify-content:space-between;gap:10px;padding:10px 18px;border-right:1px solid var(--rule2);border-bottom:1px solid var(--rule2);color:var(--ink);font-size:14px}
.geo > *:nth-child(4n){border-right:0}
.geo a:hover{background:var(--tint);text-decoration:none}
.geo > * .n{font-size:11.5px;color:var(--ink3)}
.geo .thin{color:var(--ink3)}

/* filters */
.filters{display:flex;gap:7px;flex-wrap:wrap;padding:15px 22px;border-bottom:1px solid var(--rule2)}
.chip{font:inherit;font-size:12.5px;border:1px solid var(--rule);background:#fff;color:var(--ink2);padding:5px 11px;cursor:pointer;border-radius:2px;display:flex;align-items:center;gap:7px}
.chip .n{font-size:11px;color:var(--ink3)}
.chip .ic{color:var(--ink4)}
.chip:hover{border-color:var(--ink3)}
.chip[aria-pressed="true"]{background:var(--ink);color:#fff;border-color:var(--ink)}
.chip[aria-pressed="true"] .n,.chip[aria-pressed="true"] .ic{color:#A7B1BA}
/* Search within one category, state or city page. Sits in the listing
   panel above the sortbar, so it reads as part of the list rather than
   as the site-wide search in the hero. */
.filter{display:flex;align-items:center;gap:10px;padding:10px 22px;border-bottom:1px solid var(--rule2)}
.filter .fld{display:flex;align-items:center;gap:9px;flex:1;min-width:0;background:var(--tint);border:1px solid var(--rule);padding:0 12px}
.filter .fld .ic{color:var(--ink4);flex:0 0 15px}
.filter input{flex:1;min-width:0;border:0;background:transparent;font:inherit;font-size:14px;padding:9px 0;color:var(--ink)}
.filter input::placeholder{color:var(--ink3)}
.filter .fld:focus-within{border-color:var(--ink3)}
.filter input:focus{outline:0}
.filter button{border:1px solid var(--ink);background:var(--ink);color:#fff;font:inherit;font-size:13px;font-weight:600;padding:9px 18px;cursor:pointer}
.filter button:hover{background:var(--accent);border-color:var(--accent)}
.filter .clear{font-size:13px;color:var(--ink3);white-space:nowrap}
.filter .clear:hover{color:var(--accent)}
@media(max-width:560px){.filter{flex-wrap:wrap}.filter .fld{flex:1 0 100%}}
.sortbar{display:flex;align-items:center;gap:14px;padding:12px 22px;border-bottom:1px solid var(--rule2);font-size:13px;color:var(--ink3)}
.sortbar .sorts{margin-left:auto;display:flex;gap:14px;align-items:center}
.sortbar .sorts button{font:inherit;font-size:13px;background:0;border:0;padding:0;color:var(--accent);cursor:pointer}
.sortbar .sorts button[aria-current="true"]{color:var(--ink);font-weight:600}

/* record card with photo */
/* One business on a list, read by somebody choosing who to call and by the
   owner looking at their own entry. It was three bordered rows stacked in a
   grid with a tall photo column that mostly held a monogram, which read as a
   table. One surface now, with space doing the dividing. */
.rec{background:var(--panel);border:1px solid var(--rule);border-radius:4px;margin-bottom:14px;
  padding:22px 24px 18px;transition:border-color .12s ease, box-shadow .12s ease}
.rec:hover{border-color:var(--ink4);box-shadow:0 1px 3px rgba(22,28,34,.06)}

.rec-top{display:flex;align-items:flex-start;gap:16px}
.rec-logo{flex:0 0 52px;width:52px;height:52px;border:1px solid var(--rule2);border-radius:3px;
  background:var(--tint);display:flex;align-items:center;justify-content:center;overflow:hidden}
.rec-logo img{width:100%;height:100%;object-fit:contain;padding:6px}
.rec-logo .lgm{font-family:var(--display);font-size:22px;font-weight:600;color:var(--ink3)}

.rec-id{min-width:0;flex:1}
.rec-id h3{font-size:21px;letter-spacing:-0.02em;line-height:1.2;margin-bottom:5px}
.rec-id h3 a{color:var(--ink)}
.rec-id h3 a:hover{color:var(--accent);text-decoration:none}
.rec-id .where{font-size:13.5px;color:var(--ink3);margin:0;display:flex;flex-wrap:wrap;gap:0 10px;align-items:baseline}
.rec-id .where span+span::before{content:"·";margin-right:10px;color:var(--ink4)}
.rec-id .where .chk{color:var(--ink4)}

.rec .cm{flex:0 0 auto;display:flex;flex-direction:column;align-items:flex-end;gap:5px;padding-top:3px}
.bars{display:flex;gap:3px}
.bars i{height:5px;width:12px;background:var(--rule);border-radius:1px}
.bars i.on{background:var(--ink)}

.rec .diff{font-size:15.5px;line-height:1.6;color:var(--ink2);margin:16px 0 0;max-width:72ch}

.attrs{display:flex;gap:8px;flex-wrap:wrap;margin-top:16px}
.attr{font-size:12.5px;padding:4px 10px;border:1px solid var(--rule2);border-radius:3px;
  color:var(--ink2);background:var(--tint);display:flex;align-items:center;gap:7px}

.rec-foot{display:flex;align-items:center;gap:16px;flex-wrap:wrap;
  margin-top:18px;padding-top:16px;border-top:1px solid var(--rule2)}
.rec-tags{display:flex;gap:7px;flex-wrap:wrap;flex:1;min-width:0}
.rec-tags .tg{font-size:12.5px;padding:3px 9px;border-radius:3px;background:var(--tint);color:var(--ink2)}
.rec-tags a.tg:hover{background:var(--accent-t);color:var(--accent-d);text-decoration:none}
.rec-tags .tg.dead{color:var(--ink4)}
.rec-act{display:flex;align-items:center;gap:14px;margin-left:auto}
.rec-act .quiet{font-size:13.5px;color:var(--ink3)}
.rec-act .quiet:hover{color:var(--accent)}

@media(max-width:640px){
  .rec{padding:18px 16px 16px}
  .rec-id h3{font-size:19px}
  .rec .cm{display:none}
  .rec-foot{flex-direction:column;align-items:stretch;gap:12px}
  .rec-act{margin-left:0}
  .rec-act .btn{flex:1;justify-content:center}
}
.pager{display:flex;gap:6px;align-items:center;padding:15px 22px;font-size:13.5px}
.pager a,.pager span.pg{padding:5px 11px;border:1px solid var(--rule);color:var(--ink2);font-size:12.5px}
.pager span.pg[aria-current]{background:var(--ink);color:#fff;border-color:var(--ink)}

/* profile */
/* The head of a listing. A visitor decides here whether to call, and the
   owner sees their own name first, so it carries weight rather than
   sitting flat against the breadcrumb. */
.pf-title{padding:10px 0 30px}
.pf-title .h-xl{max-width:900px;font-size:clamp(32px,4.2vw,52px);line-height:1.04}
.pf-ident{display:flex;gap:10px 18px;flex-wrap:wrap;align-items:center;margin-top:17px;font-size:14.5px;color:var(--ink2)}
.pf-ident span{display:flex;align-items:center;gap:8px}
.pf-ident .ic{color:var(--ink4)}
.standfirst{font-family:var(--prose);font-size:20.5px;line-height:1.6;color:var(--ink2);max-width:700px;margin-top:22px}
.pf-meta{display:flex;gap:18px;flex-wrap:wrap;align-items:center;margin-top:20px;padding-top:16px;border-top:1px solid var(--rule);font-size:12.5px;color:var(--ink3)}
.pf-meta span{display:flex;align-items:center;gap:7px}
.pf-meta .ic{color:var(--ink4)}
.pf-meta .site{margin-left:auto;color:var(--accent);font-weight:600;font-size:14px}

/* gallery */
.gal{display:grid;grid-template-columns:1.62fr 1fr;gap:8px;margin-bottom:11px}
.gal figure{margin:0;position:relative;overflow:hidden;background:var(--tint)}
.gal-lead img{width:100%;aspect-ratio:16/10;object-fit:cover;display:block}
.gal-side{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.gal-side img{width:100%;aspect-ratio:1/1;object-fit:cover;display:block}
.ph-mk{position:absolute;left:8px;bottom:8px;background:rgba(255,255,255,.95);padding:3px 9px;font-size:11px;display:flex;align-items:center;gap:7px;color:var(--ink);box-shadow:0 1px 3px rgba(0,0,0,.16)}
.gal-more{border:1px dashed var(--rule);background:var(--tint);cursor:pointer;font:inherit;font-size:13px;color:var(--ink2);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:7px;aspect-ratio:1/1;text-align:center;padding:8px}
.gal-more:hover{border-color:var(--accent);color:var(--accent)}
.gal-cap{display:flex;gap:20px;align-items:center;flex-wrap:wrap;padding:13px 22px;font-size:12.5px;color:var(--ink2)}
.gal-cap span{display:flex;align-items:center;gap:8px}
.gal-cap .act{margin-left:auto}

.prose{max-width:var(--read)}
.prose p{font-family:var(--prose);font-size:16.5px;line-height:1.64;margin:0 0 1.05em}
sup a{font-size:10px;padding-left:2px}

.sides{display:grid;grid-template-columns:1fr 1fr}
.sides>div{padding:18px 22px}
.sides>div:first-child{border-right:1px solid var(--rule2)}
.sides h4{font-size:13px;margin-bottom:12px;display:flex;align-items:center;gap:9px}
.sides li{padding:7px 0;font-size:14px;border-bottom:1px solid var(--rule2);color:var(--ink2)}
.sides li:last-child{border-bottom:0}

.th{display:grid;grid-template-columns:158px 1fr 52px;gap:16px;align-items:center;padding:10px 22px;border-bottom:1px solid var(--rule2)}
.th .nm{font-size:14px}
.th .track{height:7px;background:var(--rule2);display:flex}
.th .track i{height:100%;display:block}
.th .pos{background:var(--ink)}
.th .neg{background:var(--flag)}
.th .ct{font-size:11.5px;color:var(--ink3);text-align:right}
.th-key{display:flex;gap:18px;font-size:12px;color:var(--ink3);padding:13px 22px;flex-wrap:wrap;align-items:center}
.sw{width:16px;height:4px;display:inline-block;margin-right:6px;vertical-align:2px}

.peer{display:grid;grid-template-columns:1fr 98px 108px 66px;gap:14px;padding:10px 22px;border-bottom:1px solid var(--rule2);font-size:14px;align-items:baseline}
.peer:last-child{border-bottom:0}
.peer.hd{background:var(--tint);border-bottom-color:var(--rule)}
.peer.hd span{font-size:11.5px;color:var(--ink3)}
.peer .c{font-size:12.5px;color:var(--ink3)}
.peer .c.me{color:var(--ink);font-weight:600}

.asks li{padding:13px 22px 13px 48px;border-bottom:1px solid var(--rule2);font-size:15.5px;position:relative;font-family:var(--prose)}
.asks li:last-child{border-bottom:0}
.asks li .ic{position:absolute;left:22px;top:15px;color:var(--accent)}

details{border-bottom:1px solid var(--rule2)}
details:last-child{border-bottom:0}
summary{padding:14px 22px;cursor:pointer;font-size:14px;font-weight:600;display:flex;align-items:center;gap:10px;list-style:none}
summary::-webkit-details-marker{display:none}
summary .ic{color:var(--ink4)}
summary .small{font-weight:400}
summary::after{content:"+";margin-left:auto;color:var(--ink3)}
details[open] summary::after{content:"\2013"}
.dbody{padding:0 22px 20px}
.srcs li{display:grid;grid-template-columns:34px 1fr 92px;gap:14px;padding:9px 0;border-bottom:1px solid var(--rule2);font-size:13.5px;align-items:baseline}
.srcs .id{font-size:11px;color:var(--ink3)}
.srcs .dt{font-size:11px;color:var(--ink4);text-align:right}
.rev li{display:grid;grid-template-columns:96px 1fr;gap:16px;padding:9px 0;border-bottom:1px solid var(--rule2);font-size:13.5px;align-items:baseline}
.rev .dt{font-size:11.5px;color:var(--ink3)}

.correct{background:var(--accent-t);border:1px solid #E2CDCF;border-left:3px solid var(--accent);border-radius:2px;padding:20px 22px;margin-bottom:16px;max-width:var(--read)}
.correct h3{font-size:16.5px;margin-bottom:7px;display:flex;align-items:center;gap:9px}
.correct h3 .ic{color:var(--accent)}
.correct p{font-size:13.5px;color:var(--ink2);margin-bottom:15px}
.btns{display:flex;gap:9px;flex-wrap:wrap}
.btn{font:inherit;font-size:13px;padding:8px 14px;border:1px solid var(--ink);color:var(--ink);background:transparent;cursor:pointer;display:flex;align-items:center;gap:8px}
.btn.pri{background:var(--accent);color:#fff;border-color:var(--accent)}
.btn.pri:hover{background:var(--accent-d)}

/* sidebar */
.sbox{background:var(--panel);border:1px solid var(--rule);border-radius:2px;margin-bottom:16px}
.sbox-h{padding:13px 18px;border-bottom:1px solid var(--rule2);display:flex;align-items:center;gap:9px;font-size:13.5px;font-weight:600}
.sbox-h .ic{color:var(--accent)}
.sbox-b{padding:6px 18px 14px}
.sbox .f{grid-template-columns:1fr auto;padding:9px 0 9px 16px;font-size:14px}
.sbox .f::before{left:0;top:12px}
.sbox .f .src{display:none}
.sbox .f dt{font-size:13px}
.sbox .f dd{font-size:13.5px;text-align:right}
.slist a{display:flex;align-items:center;gap:9px;padding:7px 0;font-size:13.5px;color:var(--ink2);border-bottom:1px solid var(--rule2)}
.slist a:last-child{border-bottom:0}
.slist a:hover{color:var(--accent);text-decoration:none}
.slist a .ic{color:var(--ink4)}
.slist a .n{margin-left:auto;font-size:11.5px;color:var(--ink4)}

/* footer */
.foot{background:#161C22;color:#8B959D;margin-top:34px;padding:44px 0 54px;font-size:13px}
.foot-in{max-width:var(--wrap);margin:0 auto;padding:0 24px;display:grid;grid-template-columns:1.5fr 1fr 1fr 1fr;gap:40px}
.foot h4{font-size:11.5px;font-weight:600;color:#6B747C;margin-bottom:13px}
.foot li{padding:4px 0}
.foot a{color:#B2BBC2}
.foot .logo{color:#F2F4F5;padding:0;font-size:17px}
.foot .logo .mk{background:#F2F4F5}
.foot .logo em{color:#6B747C}
.foot .about{margin-top:12px;max-width:280px;line-height:1.55}

.page{display:none}
.page.on{display:block}
.page:not(.on){content-visibility:auto}

@media (max-width:1040px){
  .shell{grid-template-columns:1fr;gap:0}
  .side{position:static}
  .geo{grid-template-columns:repeat(3,1fr)}
  .geo > *:nth-child(4n){border-right:1px solid var(--rule2)}
  .geo > *:nth-child(3n){border-right:0}
}
@media (max-width:900px){
  .hero-in{grid-template-columns:1fr;gap:38px;padding:52px 24px 48px}
  .hero h1{max-width:100%}
  .stats-in,.steps,.trades{grid-template-columns:repeat(2,1fr)}
  .st{border-right:1px solid var(--rule2);padding-left:22px}
  .st:nth-child(2n){border-right:0}
  .tcard:nth-child(3n){border-right:1px solid var(--rule2)}
  .tcard:nth-child(2n){border-right:0}
  .stp{border-right:0;border-bottom:1px solid var(--rule2)}
  .up{grid-template-columns:1fr 74px}
  .up .ch{grid-column:1/-1}
  .foot-in{grid-template-columns:1fr 1fr}
  .sides{grid-template-columns:1fr}
  .sides>div:first-child{border-right:0;border-bottom:1px solid var(--rule2)}
}
@media (max-width:640px){
  .wrap,.mast-in,.foot-in,.proto-in,.hero-in,.stats-in{padding-left:16px;padding-right:16px}
  /* The nav was display:none here, inherited from a desktop mockup, with
     nothing put in its place: on a phone the site had no navigation at
     all. It becomes a second row under the logo, two by two, always
     visible. No disclosure to tap and no JavaScript, because this site
     has none and four links do not need any. */
  .mast-in{flex-wrap:wrap}
  .mast nav{display:grid;grid-template-columns:1fr 1fr;width:100%;margin-left:0;
    border-top:1px solid var(--rule2)}
  .mast nav a{border-left:0;border-right:1px solid var(--rule2);padding:13px 8px;
    font-size:13px;justify-content:center;text-align:center}
  .mast nav a:nth-child(2n){border-right:0}
  .mast nav a:nth-child(n+3){border-top:1px solid var(--rule2)}
  .rec{grid-template-columns:1fr}
  .rec-ph{border-right:0;border-bottom:1px solid var(--rule2)}
  .rec-ph img{aspect-ratio:16/9}
  .gal{grid-template-columns:1fr}
  .gal-side{grid-template-columns:repeat(4,1fr)}
  .gal-cap .act{margin-left:0;width:100%}
  .geo,.trades,.stats-in{grid-template-columns:1fr}
  .geo > *,.tcard,.st{border-right:0!important}
  .search{flex-wrap:wrap}
  .search .fld.city{flex:1 1 100%;border-left:0;border-top:1px solid var(--rule)}
  .f{grid-template-columns:1fr;gap:2px}
  .peer{grid-template-columns:1fr 64px 74px}
  .th{grid-template-columns:96px 1fr 42px}
  .panel-b{padding:16px}
}
@media (prefers-reduced-motion:reduce){*{transition:none!important;animation:none!important}}

/* business logo plates (from company site / GBP; monogram fallback) */
.lg-plate{display:inline-flex;align-items:center;justify-content:center;background:#fff;border:1px solid var(--rule);border-radius:10px;overflow:hidden;flex:none}
.lg-plate img{width:100%;height:100%;object-fit:contain;padding:12%}
.lgm{font-family:var(--sans);font-weight:700;color:var(--ink);letter-spacing:.02em}
.pf-head{display:grid;grid-template-columns:112px 1fr;gap:22px;align-items:start}
.pf-logo{margin:6px 0 0;width:112px}
.pf-logo .lg-plate{width:112px;height:112px;border-radius:12px}
.pf-logo .lgm{font-size:36px}
.pf-logo figcaption{font-size:11px;color:var(--ink3);margin-top:7px;line-height:1.4}
.rec-logo{width:27px;height:27px;border-radius:6px;margin-right:2px}
.rec-logo .lgm{font-size:12px}
/* media state preview control (spec-only) */
.mprev{display:flex;align-items:center;gap:8px;margin:14px 0 12px;font-size:12px;color:var(--ink3)}
.mprev button{font:600 12px var(--sans);color:var(--ink2);background:var(--panel);border:1px solid var(--rule);border-radius:16px;padding:5px 12px;cursor:pointer}
.mprev button[aria-current="true"]{background:var(--ink);border-color:var(--ink);color:#fff}
/* no-media identity band */
.gal-none{display:none;border:1px solid var(--rule);background:var(--panel);border-radius:12px;padding:18px 20px;grid-template-columns:84px 1fr auto;gap:18px;align-items:center}
.gal-none .lg-plate{width:84px;height:84px}
.gal-none .lgm{font-size:28px}
.gal-none h3{font:600 15px/1.3 var(--sans);margin:0 0 5px;display:flex;gap:8px;align-items:center;color:var(--ink)}
.gal-none p{font-size:13px;color:var(--ink3);max-width:66ch;margin:0}
body.no-media #profile .gal{display:none}
body.no-media #profile .gal-cap-panel{display:none}
body.no-media #profile .gal-none{display:grid}

.pf-desc{font:400 15.5px/1.65 var(--prose);color:var(--ink);max-width:72ch;margin:10px 0 2px}
.long-desc p{font:400 15px/1.75 var(--prose);color:var(--ink2);max-width:70ch;margin:0 0 14px}
.long-desc p:last-of-type{margin-bottom:0}
/* contact strip on profile */
.pf-contact{display:flex;align-items:center;gap:22px;flex-wrap:wrap;margin-top:14px;padding:13px 18px;background:var(--panel);border:1px solid var(--rule);border-radius:10px}
.pf-contact .ci{display:flex;align-items:center;gap:8px;font-size:14px;color:var(--ink)}
.pf-contact .ci .ic{color:var(--accent);width:15px;height:15px}
.pf-contact a.ci{font-weight:600;color:var(--ink);text-decoration:none}
.pf-contact a.ci:hover{color:var(--accent)}
.pf-contact .ci.tel{font-weight:700;font-size:15px}
.pf-contact .cta{margin-left:auto}
.pf-contact .src{font-size:10.5px;color:var(--ink4);vertical-align:super;margin-left:1px}
@media(max-width:760px){.pf-contact{gap:12px}.pf-contact .cta{margin-left:0;width:100%}.pf-contact .cta .btn{width:100%;justify-content:center}}
/* quote action on listing cards */
.rec-act{display:flex;align-items:center;gap:14px;padding:0 20px 16px;margin-top:-2px}
.rec-act .btn{padding:7px 14px;font-size:12.5px}
.rec-act .quiet{font-size:13px;font-weight:600}
/* listing tags (Birdeye-style lateral links) */
.rec-tags{display:flex;flex-wrap:wrap;gap:7px;align-items:center;padding:0 20px 14px}
.rec-tags .tg{display:inline-flex;align-items:center;gap:6px;font:600 11.5px/1 var(--sans);
  border:1px solid var(--rule);border-radius:14px;padding:6px 11px;background:var(--panel);color:var(--ink2);text-decoration:none}
a.tg:hover{border-color:var(--accent);color:var(--accent);background:var(--accent-t)}
.rec-tags .tg .ic{width:12px;height:12px;color:var(--ink4)}
a.tg .ic{color:var(--accent)}
.rec-tags .tg.dead{color:var(--ink4);border-style:dashed;cursor:default}
body.tags-off .rec-tags{display:none}
.tagnote{display:none;font:500 11.5px/1.5 var(--sans);color:var(--ink3);padding:0 20px 14px;margin-top:-6px}
body.show-tagnote .tagnote{display:block}
/* services list */
.svc-grid{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:1fr 1fr;gap:8px 26px}
.svc-grid li{display:flex;align-items:baseline;gap:9px;font-size:14px;color:var(--ink);padding:7px 0;border-bottom:1px solid var(--rule2)}
.svc-grid .em{margin-left:auto;font-size:11px;color:var(--ink3);white-space:nowrap}
.svc-grid.area .em{font-variant-numeric:tabular-nums;letter-spacing:.01em}
@media(max-width:680px){.svc-grid{grid-template-columns:1fr}}
/* city FAQ */
.cityfaq summary{font-size:14.5px}
.cityfaq .dbody p{font-size:14px;color:var(--ink2);max-width:72ch;margin:0}
.cityfaq .dbody p + p{margin-top:10px}

@media(max-width:640px){
  .pf-head{grid-template-columns:64px 1fr;gap:14px}
  .pf-logo{width:64px}.pf-logo .lg-plate{width:64px;height:64px}.pf-logo .lgm{font-size:22px}
  .gal-none{grid-template-columns:1fr}
}

/* ---- public forms ---------------------------------------------------- */
.fform{max-width:var(--read)}
.fform label{display:block;font-size:13px;font-weight:600;color:var(--ink);margin:16px 0 6px}
.fform label:first-of-type{margin-top:0}
.fform input,.fform textarea{width:100%;font:inherit;font-size:14.5px;color:var(--ink);background:var(--panel);
  border:1px solid var(--rule);border-radius:2px;padding:9px 11px}
.fform input:focus,.fform textarea:focus{outline:2px solid var(--accent);outline-offset:-1px;border-color:var(--accent)}
.fform textarea{resize:vertical;min-height:84px;font-family:var(--prose)}
.fform .hint{font-size:12.5px;color:var(--ink3);margin:6px 0 0;line-height:1.45}
.fform .btns{margin-top:22px}
/* The honeypot is not display:none: some robots skip what is hidden that way. */
.hp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
.sent{background:#EEF4EE;border:1px solid #CADBCA;border-left:3px solid #4B7A4B;border-radius:2px;
  padding:14px 18px;margin-bottom:16px;font-size:14px;max-width:var(--read)}

/* A logo standing in for a photograph we do not hold: contained on the
   tint rather than cropped to fill, and never marked with a provenance
   dot, because photos carry no marks. */
.rec-ph .logo-fit{width:100%;height:100%;aspect-ratio:3/4;object-fit:contain;padding:18px;background:var(--panel)}
.rec-ph .none .lg-plate{width:38px;height:38px;border-radius:8px}
.rec-ph .none .lgm{font-size:17px}

/* ---------------------------------------------------------------------------
   For the businesses we list.

   The rest of the home page talks to somebody looking for a plumber. This
   block talks to the plumber, and it is the only part of the site that has to
   persuade rather than inform, so it is given the width and the air that a
   panel does not get. Still no adjectives: the argument is the numbers and
   the fact that the record is theirs to improve.
   --------------------------------------------------------------------------- */
.owners{margin:52px 0 8px;padding:48px 44px;background:var(--ink);color:#EEF1F3;border-radius:3px;position:relative;overflow:hidden}
.owners::after{content:"";position:absolute;right:-70px;top:-70px;width:260px;height:260px;border:1px solid rgba(255,255,255,.07);border-radius:50%}
.owners-lead{max-width:680px;position:relative}
.owners .eyebrow{font-size:12px;letter-spacing:.14em;text-transform:uppercase;color:var(--accent-t);opacity:.72;margin:0 0 14px}
.owners .h-lg{color:#fff;margin-bottom:16px}
.owners .lede{color:#AEB8C1;max-width:640px;font-size:18px}

.owners-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:rgba(255,255,255,.1);
  margin:40px 0 36px;border:1px solid rgba(255,255,255,.1);position:relative}
.ocard{background:var(--ink);padding:26px 24px 28px}
.ocard .on{display:block;font-family:var(--display);font-size:30px;font-weight:600;color:#fff;
  letter-spacing:-0.02em;margin-bottom:10px;font-variant-numeric:tabular-nums}
.ocard h3{font-size:16px;color:#fff;margin:0 0 8px;letter-spacing:-0.01em}
.ocard p{font-size:14.5px;line-height:1.62;color:#99A4AE;margin:0}

.owners-act{display:flex;align-items:center;gap:14px;flex-wrap:wrap;position:relative}
.owners-act .btn{border-color:rgba(255,255,255,.28);color:#EEF1F3}
.owners-act .btn:hover{background:rgba(255,255,255,.08)}
.owners-act .btn.pri{background:var(--accent);border-color:var(--accent);color:#fff}
.owners-act .btn.pri:hover{background:var(--accent-d);border-color:var(--accent-d)}
.owners-act .small{color:#7E8A95}

@media(max-width:900px){
  .owners-grid{grid-template-columns:1fr}
}
@media(max-width:640px){
  .owners{padding:34px 20px;margin:36px 0 8px}
  .owners .lede{font-size:17px}
  .owners-act .btn{flex:1 1 100%;justify-content:center}
}

/* The owner's exit from a page a visitor came to read. Quiet enough that it
   never competes with the listings above it, clear enough that somebody who
   scrolled this far because they recognised their own name knows what to do. */
.ownstrip{display:flex;align-items:center;gap:28px;flex-wrap:wrap;
  margin:28px 0 10px;padding:26px 28px;border:1px solid var(--rule);border-radius:4px;
  background:var(--tint)}
.ownstrip h2{font-size:19px;letter-spacing:-0.015em;margin-bottom:6px}
.ownstrip p{font-size:14.5px;line-height:1.6;color:var(--ink2);margin:0;max-width:60ch}
.ownstrip-act{display:flex;gap:11px;margin-left:auto;flex-wrap:wrap}
.ownstrip-act .btn.pri{background:var(--ink);border-color:var(--ink);color:#fff}
.ownstrip-act .btn.pri:hover{background:var(--accent);border-color:var(--accent)}
.ownstrip-act .btn{background:var(--panel)}

@media(max-width:760px){
  .ownstrip{padding:22px 18px;gap:18px}
  .ownstrip-act{margin-left:0;width:100%}
  .ownstrip-act .btn{flex:1;justify-content:center}
}

/* What a page in this trade tells you. Rows of label, bar, share and source.
   The bar carries the number so the eye can run down the column and see the
   shape of a trade without reading a single figure; the figure is there for
   anyone who wants it. */
.cov-rows{border-top:1px solid var(--rule2)}
.cov-row{display:grid;grid-template-columns:200px 1fr 46px 150px;gap:16px;align-items:center;
  padding:11px 22px;border-bottom:1px solid var(--rule2)}
.cov-row:last-child{border-bottom:0}
.cov-label{display:flex;align-items:center;gap:9px;font-size:14.5px;color:var(--ink);min-width:0}
.cov-label .pv{flex:0 0 9px}
.cov-bar{height:7px;background:var(--rule2);border-radius:4px;overflow:hidden;min-width:0}
.cov-bar i{display:block;height:100%;background:var(--ink);border-radius:4px}
.cov-row:nth-child(n+6) .cov-bar i{background:var(--ink3)}
.cov-n{font-size:13.5px;color:var(--ink2);text-align:right;font-variant-numeric:tabular-nums}
.cov-src{font-size:12px;color:var(--ink4);text-align:right;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}

@media(max-width:760px){
  .cov-row{grid-template-columns:1fr 44px;gap:6px 12px;padding:13px 16px}
  .cov-label{grid-column:1;font-size:14px}
  .cov-n{grid-column:2;grid-row:1}
  .cov-bar{grid-column:1 / -1;grid-row:2}
  .cov-src{grid-column:1 / -1;grid-row:3;text-align:left}
}

/* Questions and answers. Plain text, always visible: an accordion would hide
   six two-line answers behind six clicks, which is tidier for the layout and
   worse for the reader. The question is set in the display face so the column
   can be skimmed for the one that matters. */
.qa-list{border-top:1px solid var(--rule2)}
.qa-item{padding:16px 22px;border-bottom:1px solid var(--rule2)}
.qa-item:last-child{border-bottom:0}
.qa-item h3{font-size:16px;line-height:1.35;letter-spacing:-0.01em;color:var(--ink)}
.qa-item p{margin:7px 0 0;max-width:var(--read);font-size:15px;line-height:1.62;color:var(--ink2)}

@media(max-width:760px){
  .qa-item{padding:15px 16px}
  .qa-item h3{font-size:15.5px}
  .qa-item p{font-size:14.5px}
}