.branch-locator{ max-width: 100%; margin: 1rem auto; }
#branch-hero-wrap{ position: relative; margin-bottom: 1rem; }
#branch-hero-map{ width: 100%; height: 70vh; max-height: 800px; min-height: 420px; border: 1px solid #e5e7eb; border-radius: .5rem; overflow: hidden; }
.branch-hero-hint{ position: absolute; top: .5rem; left: .5rem; background: rgba(255,255,255,.85); padding: .3rem .5rem; border-radius: .375rem; font-size: .9rem; }
.leaflet-container .branch-hero-label{ background: rgba(255,255,255,.85); border: none; box-shadow: none; font-weight: 600; color: #111; }
.branch-filters{ display: grid; grid-template-columns: 1fr 1fr 1fr 1fr auto auto; gap: .5rem; margin-bottom: 1rem; }
.branch-filters select, .branch-filters input{ padding: .5rem; }
.branch-button{ padding: .5rem 1rem; cursor: pointer; height: 40px;  }
#branch-results{ display: grid; grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); gap: .75rem; }
.branch-card{ border: 1px solid #e5e7eb; border-radius: .5rem; padding: .75rem; background: #ececec; }
.branch-name{ font-weight: 600; margin-bottom: .25rem; }
.branch-meta{ color: #1a1a1a; font-size: .9rem; margin-bottom: .25rem; }
.branch-address a{ margin-left: .25rem; font-size: .9rem; color: #1a1a1a; }
.branch-empty{ color: #6b7280; }
.branch-pager{ display: flex; gap: .5rem; align-items: center; justify-content: center; margin-top: 1rem; }
.branch-pager button{ padding: .4rem .7rem; }
#branch-map{ height: 380px; border: 1px solid #e5e7eb; border-radius: .5rem; margin-bottom: 1rem; }
@media (max-width: 640px){
  .branch-filters{ grid-template-columns: 1fr; }
  #branch-hero-map{ height: 56vh; }
}