*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:#FAF3E3;color:#262219;
  font-family:Verdana,"DejaVu Sans",Geneva,sans-serif;font-size:15px;line-height:1.55}
a{color:#262219;text-decoration:underline;text-underline-offset:2px}
a:hover{color:#8A5C06}
a:focus-visible{outline:2px solid #C8860D;outline-offset:2px}
img{max-width:100%;height:auto;display:block}
h1,h2,h3,h4{font-family:Arvo,Rockwell,"Roboto Slab",Georgia,serif;font-weight:700;
  line-height:1.25;margin:0}
p{margin:0 0 12px}
.shell{max-width:1140px;min-width:0;margin:0 auto;padding:0 16px}

/* ---- 1. slab wordmark band ---- */
.band{background:#FAF3E3;border-bottom:1px solid #D9CFB4;
  box-shadow:0 2px 0 #C8860D inset;}
.band-inner{min-height:96px;display:flex;align-items:center;justify-content:space-between;
  gap:16px;flex-wrap:wrap;padding:16px 0}
.wordmark{font-family:Arvo,Rockwell,"Roboto Slab",Georgia,serif;font-size:30px;
  line-height:1.1;margin:0;letter-spacing:-.01em}
.wordmark a{text-decoration:none}
.subline{font-size:13px;color:#5A5245;margin:4px 0 0}
.band-links{font-family:Arial,Helvetica,sans-serif;font-size:12px;
  text-transform:uppercase;letter-spacing:.08em}
.band-links a{margin-left:16px}
.doublerule{border-top:1px solid #C8860D;border-bottom:1px solid #D9CFB4;height:3px}

/* ---- layout ---- */
.grid{display:flex;gap:24px;align-items:flex-start;padding:24px 0 8px}
.rail{flex:0 0 240px;max-width:240px}
.body-col{flex:1 1 auto;min-width:0}
.grid-home{display:grid;grid-template-columns:240px minmax(0,1fr);column-gap:24px;
  padding:24px 0 8px;align-items:start}
.grid-home>.rail{grid-column:1;grid-row:1 / span 2;max-width:240px}
.grid-home>.top{grid-column:2;grid-row:1;min-width:0}
.grid-home>.rest{grid-column:2;grid-row:2;min-width:0}

/* ---- 3. area finder rail ---- */
.finder{background:#FFFCF4;border:1px solid #C8860D;padding:12px;margin:0 0 16px}
.finder h2,.finder h3{font-size:15px;margin:0 0 8px;
  border-bottom:1px solid #D9CFB4;padding-bottom:6px}
.finder ul{list-style:none;margin:0;padding:0}
.finder li{font-size:14px;padding:4px 0;border-bottom:1px dotted #D9CFB4}
.finder li:last-child{border-bottom:0}
.finder p{font-size:12px;color:#5A5245;margin:0}

/* ---- 2. featured place record ---- */
.record{background:#FFFFFF;border:1px solid #D9CFB4;padding:16px;display:flex;gap:16px;
  align-items:flex-start;flex-wrap:wrap}
.plate{flex:0 0 180px}
.plate img{border:1px solid #D9CFB4;width:180px;height:135px}
.plate figcaption{font-family:Arial,Helvetica,sans-serif;font-size:11px;color:#5A5245;
  margin-top:4px}
.record-main{flex:1 1 320px;min-width:0}
.record-main h2,.record-main h1{font-size:22px;margin:0}
.label{font-family:Arial,Helvetica,sans-serif;font-size:11px;text-transform:uppercase;
  letter-spacing:.09em;color:#5A5245;margin:4px 0 8px}
.editorial{font-family:Georgia,"Times New Roman",serif;font-style:italic;font-size:15px;
  margin:0 0 8px}
.facts{font-size:13px;color:#5A5245;margin:0;border-top:1px solid #D9CFB4;padding-top:8px}

/* ---- 4. neighbourhood bands + 5. dotted-leader rows ---- */
.bandhead{font-size:18px;color:#262219;background:#FFFCF4;
  border-top:3px solid #C8860D;border-bottom:1px solid #D9CFB4;
  padding:8px 12px;margin:24px 0 0}
.rows{list-style:none;margin:0;padding:0;background:#FFFFFF;
  border:1px solid #D9CFB4;border-top:0}
.rows li{padding:8px 12px;border-bottom:1px dotted #D9CFB4}
.rows li:last-child{border-bottom:0}
.row{display:flex;align-items:baseline;gap:6px}
.row .name{font-size:15px;font-weight:700;white-space:nowrap}
.row .leader{flex:1 1 auto;border-bottom:1px dotted #8A8172;
  transform:translateY(-3px);min-width:12px}
.row .val{font-size:13px;color:#5A5245;text-align:right}
.row-label{font-family:Arial,Helvetica,sans-serif;font-size:11px;text-transform:uppercase;
  letter-spacing:.09em;color:#5A5245;margin:2px 0 0}
.row-desc{font-size:13px;color:#262219;margin:4px 0 0;max-width:640px}

/* ---- 6. editorial place notes ---- */
.notes{margin:24px 0 0}
.note{background:#FFFFFF;border:1px solid #D9CFB4;border-left:4px solid #C8860D;
  padding:12px 16px;margin:0 0 12px}
.note h3{font-size:16px;margin:0}
.note .byline{font-family:Arial,Helvetica,sans-serif;font-size:11px;text-transform:uppercase;
  letter-spacing:.09em;color:#5A5245;margin:4px 0 8px}
.note p{font-family:Georgia,"Times New Roman",serif;font-style:italic;font-size:14px;
  margin:0 0 8px}
.note p:last-child{margin-bottom:0}

/* ---- 7. methodology and update note ---- */
.trademark{font-size:12px;color:#5A5245;border-top:1px solid #D9CFB4;
  margin:24px 0 0;padding:12px 0 0}
.trademark h2{font-size:15px;margin:0 0 6px}

/* ---- 8. area recap colophon ---- */
.colophon{border-top:3px double #C8860D;margin:24px 0 0;padding:16px 0 32px}
.colophon-cols{display:flex;gap:24px;flex-wrap:wrap}
.colophon-cols div{flex:1 1 220px;min-width:0}
.colophon h2{font-family:Arial,Helvetica,sans-serif;font-size:11px;text-transform:uppercase;
  letter-spacing:.09em;color:#5A5245;margin:0 0 6px;font-weight:700}
.colophon ul{list-style:none;margin:0;padding:0;font-size:13px;
  border-top:1px solid #D9CFB4}
.colophon li{padding:3px 0;border-bottom:1px solid #EDE3CC}
.closing{font-size:13px;color:#5A5245;margin:16px 0 0;border-top:1px solid #D9CFB4;
  padding-top:12px}

/* ---- detail routes ---- */
.crumb{font-family:Arial,Helvetica,sans-serif;font-size:11px;text-transform:uppercase;
  letter-spacing:.09em;color:#5A5245;margin:0 0 8px}
.page-title{font-size:26px;margin:0 0 2px}
.sheet{background:#FFFFFF;border:1px solid #D9CFB4;padding:16px}
.measure{max-width:640px}
.measure p,.sheet>p{font-size:15px}
.factstable{border-collapse:collapse;width:100%;max-width:520px;margin:0 0 16px;font-size:13px}
.factstable th,.factstable td{border:1px solid #D9CFB4;padding:6px 8px;text-align:left;
  background:#FFFCF4;color:#262219;vertical-align:top}
.factstable th{width:38%;font-family:Arial,Helvetica,sans-serif;font-size:11px;
  text-transform:uppercase;letter-spacing:.08em;color:#5A5245}
.detail-plate{float:none;margin:0 0 16px}
.detail-plate img{width:360px;max-width:100%;height:auto;border:1px solid #D9CFB4}
.detail-plate figcaption{font-family:Arial,Helvetica,sans-serif;font-size:11px;
  color:#5A5245;margin-top:4px}
.bio{border-top:1px solid #D9CFB4;padding-top:16px;margin-top:16px}
.bio h3{font-size:18px;margin:0}
.bio ul{margin:8px 0 0;padding-left:18px;font-size:14px;max-width:640px}
.bio p{max-width:640px}
.quote{max-width:660px}
.quote{border-left:3px solid #C8860D;margin:0 0 16px;padding:4px 0 4px 16px}
.quote p{font-family:Georgia,"Times New Roman",serif;font-style:italic;font-size:14px;margin:0 0 6px}
.quote cite{font-family:Arial,Helvetica,sans-serif;font-size:11px;text-transform:uppercase;
  letter-spacing:.09em;color:#5A5245;font-style:normal}
.related{border-top:1px solid #D9CFB4;margin-top:16px;padding-top:12px;font-size:13px}
.related a{margin-right:14px;display:inline-block}
.steps{font-size:15px;padding-left:20px;margin:0 0 12px}
.steps li{margin:0 0 6px}

@media (max-width:860px){
  .grid{display:block;padding:16px 0 8px}
  .grid-home{display:flex;flex-direction:column;padding:16px 0 8px}
  .grid-home>.rail{max-width:none;order:-1;margin:0 0 16px}
  .rail{max-width:none;margin:0 0 16px}
  .finder{border-width:1px}
  .finder-areas ul{display:flex;flex-wrap:wrap;gap:6px 10px}
  .finder-areas li{border-bottom:0;padding:0;font-size:14px}
  .band-inner{min-height:64px;padding:10px 0}
  .wordmark{font-size:22px}
  .record{display:block}
  .plate,.plate img{width:100%;flex:none}
  .plate img{height:auto}
  .plate{margin:0 0 12px}
  .row{display:block}
  .row .leader{display:none}
  .row .val{text-align:left;font-size:13px;display:block;margin-top:2px}
  .row .name{white-space:normal}
  .bandhead{margin-left:0;margin-right:0;padding-left:12px;padding-right:12px}
  .detail-plate img{width:100%}
}