:root{
  --ink:#15202b; --muted:#5d6b7a; --line:#dfe5ec; --bg:#fff; --soft:#f5f8fa;
  --navy:#123a63; --accent:#1a6ea8; --good:#1f7a4d; --warn:#b3541e;
  --wrap:960px;
}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{
  margin:0;background:var(--bg);color:var(--ink);
  font:16px/1.6 -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;
}
a{color:var(--accent)}
a:hover{color:var(--navy)}
main{max-width:var(--wrap);margin:0 auto;padding:24px 20px 56px}

/* header / footer */
header.site{border-bottom:1px solid var(--line);background:#fff}
.brand{
  display:inline-block;max-width:var(--wrap);margin:0 auto;padding:16px 20px;
  font-weight:700;font-size:19px;letter-spacing:-.01em;color:var(--navy);text-decoration:none
}
.brand span{color:var(--accent)}
footer.site{
  border-top:1px solid var(--line);background:var(--soft);
  padding:24px 20px;font-size:14px;color:var(--muted)
}
footer.site p{max-width:var(--wrap);margin:0 auto 8px}

/* type */
h1{font-size:28px;line-height:1.25;letter-spacing:-.02em;margin:.2em 0 .4em}
h2{font-size:20px;letter-spacing:-.01em;margin:1.8em 0 .6em}
.lede{font-size:17px;color:var(--muted);margin-top:0;max-width:60ch}
.muted{color:var(--muted)}
.fine{font-size:13px;color:var(--muted)}

/* breadcrumbs */
.crumbs{font-size:13px;color:var(--muted);margin-bottom:14px}
.crumbs i{font-style:normal;opacity:.5;margin:0 4px}

/* hero + cta */
.hero{padding:12px 0 4px}
.cta{margin-top:40px;padding:22px;background:var(--soft);border:1px solid var(--line);border-radius:8px}
.cta h2{margin-top:0}
.btn{
  display:inline-block;background:var(--navy);color:#fff;text-decoration:none;
  padding:11px 20px;border-radius:6px;font-weight:600
}
.btn:hover{background:var(--accent);color:#fff}

/* grids + cards */
.grid{list-style:none;padding:0;margin:0;display:grid;gap:2px;
  grid-template-columns:repeat(auto-fill,minmax(210px,1fr))}
.grid li{padding:9px 10px;border-bottom:1px solid var(--line);display:flex;
  justify-content:space-between;gap:10px;align-items:baseline}
.cards{list-style:none;padding:0;margin:0}
.cards li{padding:10px 0;border-bottom:1px solid var(--line);display:flex;
  justify-content:space-between;gap:12px;flex-wrap:wrap}

/* listing table */
table.listing{width:100%;border-collapse:collapse;margin:16px 0;font-size:15px}
table.listing th{
  text-align:left;font-size:12px;text-transform:uppercase;letter-spacing:.06em;
  color:var(--muted);border-bottom:2px solid var(--line);padding:8px 10px 8px 0;font-weight:600
}
table.listing td{padding:11px 10px 11px 0;border-bottom:1px solid var(--line);vertical-align:top}
table.listing tr:hover td{background:var(--soft)}
.tag{
  display:inline-block;margin-left:7px;font-size:11px;color:var(--warn);
  border:1px solid currentColor;border-radius:3px;padding:1px 5px;vertical-align:1px
}

/* profile */
.phead{display:flex;justify-content:space-between;align-items:flex-start;gap:16px;flex-wrap:wrap}
.phead h1{margin-top:0}
.where{color:var(--muted);margin:.2em 0 .5em}
.rating b{font-size:18px}
.badge{font-size:12px;font-weight:600;padding:4px 10px;border-radius:20px;white-space:nowrap}
.badge.unclaimed{background:#fdf2e6;color:var(--warn);border:1px solid #f0d5b8}

dl.facts{
  display:grid;grid-template-columns:120px 1fr;gap:0;margin:22px 0;
  border-top:1px solid var(--line);font-size:15px
}
dl.facts dt{padding:11px 0;color:var(--muted);border-bottom:1px solid var(--line)}
dl.facts dd{padding:11px 0;margin:0;border-bottom:1px solid var(--line);word-break:break-word}

/* health card */
.hcard{background:var(--soft);border:1px solid var(--line);border-radius:8px;padding:18px 20px;margin:28px 0}
.hcard h2{margin:0 0 12px;font-size:17px}
.bar{height:8px;background:#e3e9ef;border-radius:5px;overflow:hidden;margin-bottom:14px}
.bar span{display:block;height:100%;background:var(--accent)}
ul.gaps{margin:0 0 12px;padding-left:20px}
ul.gaps li{margin-bottom:4px;color:var(--warn)}

/* forms */
form.claim{margin:16px 0;max-width:640px}
form.claim label{display:block;margin-bottom:14px;font-size:14px;font-weight:600}
form.claim input,form.claim textarea{
  display:block;width:100%;margin-top:5px;padding:10px 12px;font:inherit;font-weight:400;
  border:1px solid var(--line);border-radius:6px;background:#fff
}
form.claim input:focus,form.claim textarea:focus{outline:2px solid var(--accent);outline-offset:-1px}
form.claim .row{display:grid;grid-template-columns:1fr 1fr;gap:14px}
form.claim button{
  background:var(--navy);color:#fff;border:0;padding:12px 24px;border-radius:6px;
  font:inherit;font-weight:600;cursor:pointer
}
form.claim button:hover{background:var(--accent)}
.hp{position:absolute;left:-9999px}

@media (max-width:620px){
  h1{font-size:23px}
  main{padding:18px 16px 40px}
  dl.facts{grid-template-columns:96px 1fr;font-size:14px}
  form.claim .row{grid-template-columns:1fr;gap:0}
  table.listing{font-size:14px}
}

.badge.reference{background:#eef2f6;color:var(--muted);border:1px solid var(--line)}
.tag.ref{color:var(--muted)}

a.site{display:block;font-size:12.5px;color:var(--muted);text-decoration:none;margin-top:2px}
a.site:hover{color:var(--accent);text-decoration:underline}

.actions{display:flex;flex-wrap:wrap;gap:10px;margin:14px 0 0}
.btn.call{background:var(--good)}
.btn.call:hover{background:#175f3c}
.btn.ghost{background:#fff;color:var(--navy);border:1px solid var(--line)}
.btn.ghost:hover{background:var(--soft);color:var(--navy)}
.btn.tiny{padding:7px 13px;font-size:14px;font-weight:600;white-space:nowrap;background:var(--soft);
  color:var(--navy);border:1px solid var(--line)}
.btn.tiny:hover{background:var(--navy);color:#fff;border-color:var(--navy)}
@media (max-width:620px){ .actions .btn{flex:1;text-align:center} }

.chip{display:inline-block;background:#eef4f9;color:var(--navy);border:1px solid #d6e3ee;
  border-radius:4px;padding:2px 8px;margin:0 5px 4px 0;font-size:13px;font-weight:600}
.sizes{display:block;font-size:12.5px;color:var(--navy);margin-top:3px;letter-spacing:.01em}
.srcnote{margin:-8px 0 22px}

.pricing{margin:28px 0}
table.ptable{width:100%;border-collapse:collapse;font-size:15px;margin-bottom:10px}
table.ptable th{text-align:left;font-size:12px;text-transform:uppercase;letter-spacing:.06em;
  color:var(--muted);border-bottom:2px solid var(--line);padding:8px 12px 8px 0;font-weight:600}
table.ptable td{padding:10px 12px 10px 0;border-bottom:1px solid var(--line)}
.pcell{font-weight:700;color:var(--navy)}
.from{font-weight:700;color:var(--navy);white-space:nowrap}

.based{display:block;font-size:12px;color:var(--good);font-weight:600;margin-top:2px}
.away{display:block;font-size:12px;color:var(--muted);margin-top:2px}

table.ptable.idx td:first-child{font-weight:600}
table.ptable.idx th:not(:first-child),table.ptable.idx td:not(:first-child){text-align:right}
ul.terms{margin:0 0 14px;padding-left:20px}
ul.terms li{margin-bottom:6px}

dl.faq{margin:14px 0 0}
dl.faq dt{font-weight:600;margin-top:16px}
dl.faq dd{margin:5px 0 0;color:var(--muted)}

.fnav{max-width:var(--wrap);margin:0 auto 10px;line-height:2}
.fnav a{margin-right:2px}

.grid.nearby li{font-size:14px}

ul.stats{padding-left:20px}
ul.stats li{margin-bottom:12px;line-height:1.65}
.two{display:grid;grid-template-columns:1fr 1fr;gap:28px}
.two h3{font-size:15px;margin:0 0 8px}
ol.rank{margin:0;padding-left:22px;font-size:15px}
ol.rank li{margin-bottom:6px}
p.cite{background:#fff;border:1px solid var(--line);border-radius:6px;padding:12px 14px;
  font-size:14px;font-family:ui-monospace,SFMono-Regular,Menlo,monospace;line-height:1.55}
dl.gloss dt{font-size:16px}
@media (max-width:620px){ .two{grid-template-columns:1fr;gap:18px} }

/* ---- header nav ---- */
.hwrap{max-width:var(--wrap);margin:0 auto;padding:0 20px;display:flex;
  align-items:center;justify-content:space-between;gap:16px;flex-wrap:wrap}
.hwrap .brand{padding:16px 0}
.hnav{display:flex;gap:18px;font-size:14.5px;font-weight:600}
.hnav a{color:var(--muted);text-decoration:none;padding:6px 0;border-bottom:2px solid transparent}
.hnav a:hover{color:var(--navy);border-bottom-color:var(--accent)}

/* ---- listing table becomes cards on a phone ----
   The phone number is the primary action in this category and a horizontally
   scrolled table hides it off-screen. Restack instead of scrolling. */
@media (max-width:680px){
  table.listing,table.listing tbody,table.listing tr,table.listing td{display:block;width:100%}
  table.listing thead{position:absolute;left:-9999px}
  table.listing tr{border:1px solid var(--line);border-radius:8px;padding:14px;margin-bottom:12px}
  table.listing tr:hover td{background:transparent}
  table.listing td{border:0;padding:0}
  table.listing td:first-child{font-size:16px;margin-bottom:10px}
  table.listing td[data-label]{display:inline-flex;align-items:baseline;gap:6px;
    margin-right:16px;font-size:14px;color:var(--muted)}
  table.listing td[data-label]::before{content:attr(data-label);font-size:11px;
    text-transform:uppercase;letter-spacing:.06em;color:var(--muted);opacity:.75}
  table.listing td.cell-call{margin-top:12px}
  table.listing td.cell-call .btn.tiny{display:block;text-align:center;padding:11px;
    font-size:15px;background:var(--navy);color:#fff;border-color:var(--navy)}
  .hnav{gap:14px;font-size:13.5px;width:100%;padding-bottom:10px}
  .hwrap .brand{padding:14px 0 4px}
}

/* index tables scroll rather than restack — they are genuinely tabular */
table.ptable{display:block;overflow-x:auto;white-space:nowrap}
@media (min-width:681px){ table.ptable{display:table;white-space:normal} }

.cards.guides li{display:block;padding:14px 0}
.cards.guides a{font-weight:600;font-size:16px}
.cards.guides .muted{display:block;margin-top:3px;font-size:14px}
hr.rule{border:0;border-top:1px solid var(--line);margin:32px 0 16px}

.byline{font-size:14px;color:var(--muted);margin:-6px 0 14px}
.cards.posts li{display:block;padding:16px 0}
.cards.posts a{font-weight:600;font-size:16.5px}
.cards.posts time{display:block;font-size:13px;color:var(--muted);margin-top:2px}
.cards.posts .muted{display:block;margin-top:5px;font-size:14px;line-height:1.55}
.pagi{display:flex;justify-content:space-between;gap:16px;font-size:14px;margin:16px 0}

.psize{display:block;font-size:11.5px;color:var(--muted);font-weight:500;margin-top:1px}

/* chart */
figure.chart{margin:18px 0 22px;padding:0}
figure.chart svg{display:block;width:100%;height:auto;overflow:visible}
figure.chart svg g:hover path{fill:var(--navy)}
figure.chart figcaption{font-size:13px;color:var(--muted);margin-top:10px;max-width:62ch}