*, *::before, *::after { box-sizing: border-box; }
html { scroll-behavior: smooth; -webkit-text-size-adjust: 100%; }
body { margin: 0; background: #F7F6F2; color: #232B45; }
img { max-width: 100%; height: auto; }
a { color: #232B45; }
a:hover { color: #8A6F3E; }
a:focus-visible, button:focus-visible, summary:focus-visible { outline: 2px solid #C2A878; outline-offset: 3px; }
input, select, textarea, button { font: inherit; color: #232B45; }
input:focus, select:focus, textarea:focus { outline: 2px solid #C2A878; outline-offset: 1px; }
summary { cursor: pointer; }
button:hover { filter: brightness(1.15); }
[hidden] { display: none !important; }

/* Headings shrink on small screens */
@media (max-width: 640px) {
  h1 { font-size: 42px !important; }
  h2 { font-size: 34px !important; }
  header nav { gap: 6px 18px !important; font-size: 14px !important; }
  header a[aria-label="True Record Inventories home"] img { height: 36px !important; }
  form { padding: 28px 20px !important; }
  figure { padding: 18px !important; }
  #areas .map-crop { min-height: 440px !important; }
  .town-list { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; }
  figure > div { grid-template-columns: 34px 1fr 58px 50px !important; gap: 4px 8px !important; font-size: 12px !important; }
}

/* Areas covered: town list beside the map */
.areas-grid { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.15fr); gap: 40px 56px; align-items: stretch; }
.town-list { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 14px 18px; }
@media (max-width: 900px) {
  .areas-grid { grid-template-columns: minmax(0, 1fr); }
  .town-list { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}