body.region-pages { zoom: 1; }
.region-pages .rd-navbar-wrap { width: 100%; }
.regions-page { padding: 44px 0 64px; color: #213d48; }
.regions-container { max-width: 1280px; }
.regions-heading { margin-bottom: 32px; max-width: 760px; }
.regions-kicker { display: inline-flex; align-items: center; gap: 10px; color: #397482; font-size: .8rem; font-weight: 700; text-transform: uppercase; letter-spacing: .09em; }
.regions-page h1 { font-size: clamp(2rem, 4vw, 3rem); line-height: 1.12; color: #154957; margin: 12px 0 18px; overflow-wrap: anywhere; }
.regions-heading p { font-size: 1.1rem; line-height: 1.65; }
.regions-layout { display: grid; grid-template-columns: minmax(0, 1.1fr) minmax(0, 1fr); gap: 28px; align-items: start; }
.regions-map-column { background: #fff; border: 1px solid #dce5e8; border-radius: 16px; padding: 18px; min-width: 0; }
.map-toolbar { display: flex; justify-content: space-between; align-items: center; gap: 12px; margin-bottom: 16px; font-size: .95rem; font-weight: 700; }
.map-toolbar button { border: 0; border-radius: 6px; color: #1b6374; background: #e6f2f4; padding: 8px 12px; min-height: 44px; font-size: .8rem; }
.regions-map { height: 580px; border-radius: 12px; background: #dfecef; isolation: isolate; z-index: 0; }
.map-loading { padding: 24px; }
.map-help, .map-status { font-size: .8rem; line-height: 1.6; margin: 14px 0 0; color: #536b74; }
.map-status { min-height: 26px; font-weight: 600; }
.regions-list-heading { display: flex; align-items: center; justify-content: space-between; gap: 16px; margin-bottom: 18px; }
.regions-list-heading h2 { font-size: 1.4rem; margin: 0; }
.regions-list-heading > span { font-size: .8rem; background: #dcecef; color: #1b6374; padding: 6px 10px; border-radius: 20px; white-space: nowrap; }
.region-search-label { display: block; font-size: .8rem; margin-bottom: 6px; }
.region-search { width: 100%; border-radius: 8px; border: 1px solid #bdcfd5; background: white; padding: 12px 14px; min-height: 48px; font-size: 1rem; margin-bottom: 18px; }
.regions-list { max-height: 650px; overflow-y: auto; padding-right: 6px; }
.region-card { border: 1px solid #dbe4e8; border-left: 5px solid var(--region-color); border-radius: 12px; padding: 18px; margin-bottom: 14px; background: white; }
.region-card.is-selected { outline: 3px solid var(--region-color); outline-offset: -3px; background: #f3f9fa; }
.region-card-heading { display: flex; gap: 12px; align-items: center; }
.region-dot { display: inline-block; width: 12px; height: 12px; border-radius: 50%; background: var(--region-color, #196b8b); flex: 0 0 12px; }
.region-card h3 { font-size: 1.15rem; color: #213d48; margin: 0; overflow-wrap: anywhere; }
.region-card p { font-size: .8rem; color: #5e737b; margin: 5px 0 0; }
.region-card-heading > div { flex: 1; min-width: 0; }
.region-card img { width: 42px; height: 42px; object-fit: contain; }
.region-card-actions { display: flex; align-items: center; justify-content: space-between; gap: 10px; flex-wrap: wrap; margin-top: 14px; }
.region-locate { min-height: 44px; padding: 8px 12px; border: 1px solid #b9ced4; border-radius: 6px; color: #286170; background: #f5f9fa; font-size: .8rem; }
.region-locate:disabled { color: #626f74; background: #f2f3f4; border-color: #e0e3e4; cursor: default; }
.region-info-link { display: inline-flex; align-items: center; gap: 8px; min-height: 44px; font-size: .85rem; font-weight: 700; color: #155b6c; }
.regions-page :focus-visible { outline: 3px solid #c07914; outline-offset: 3px; }
.regions-map .leaflet-control-attribution { font-size: 10px; }
.regions-map .leaflet-popup-content { line-height: 1.6; margin: 14px 18px; }
.regions-map .leaflet-popup-content a { display: block; margin-top: 12px; color: #155b6c; font-weight: 700; }
.regions-map .leaflet-interactive:focus { outline: 2px solid #173d53; }
.region-back { color: #376b79; font-size: .9rem; display: inline-block; margin-bottom: 24px; }
.region-hero { display: flex; align-items: center; gap: 24px; border-left: 5px solid var(--region-color); padding-left: 24px; }
.region-logo { width: 84px; height: 84px; object-fit: contain; }
.region-description { max-width: 860px; line-height: 1.8; margin: 24px 0; }
.region-section-links { display: flex; gap: 10px; flex-wrap: wrap; margin: 26px 0; }
.region-section-links a { border: 1px solid #bdd2d8; padding: 10px 14px; border-radius: 24px; color: #245e6d; font-size: .85rem; background: #fff; }
.region-detail-layout { display: grid; grid-template-columns: minmax(0, 2fr) minmax(0, 1fr); gap: 28px; }
.region-panel { padding: 28px; background: #fff; border: 1px solid #dce5e8; border-radius: 12px; margin-bottom: 24px; scroll-margin-top: 130px; min-width: 0; overflow-wrap: anywhere; }
.region-panel h2 { font-size: 1.5rem; color: #154957; margin-bottom: 20px; }
.region-panel h3 { font-size: 1.1rem; margin: 8px 0; }
.region-panel p, .region-panel li { font-size: .95rem; line-height: 1.7; }
.region-content-list article { padding: 16px 0; border-bottom: 1px solid #e6ecee; }
.region-content-list article:last-child { margin-bottom: 18px; }
.region-meta { font-size: .8rem; color: #60757e; }
.region-primary { display: inline-flex; min-height: 46px; align-items: center; padding: 10px 16px; margin-top: 16px; border-radius: 6px; background: #196b7c; color: #fff; font-weight: 600; font-size: .9rem; }
.region-primary:hover { background: #124958; color: white; }
.region-secondary { display: block; margin-top: 18px; color: #1b6475; }
.region-panel .region-subheading { margin-top: 28px; }
.region-other-list { list-style: none; padding: 0; }
.region-other-list li { display: flex; gap: 12px; align-items: center; margin-bottom: 16px; }
.region-photo { width: 100%; border-radius: 12px; }
@media (max-width: 991px) {
  .regions-layout, .region-detail-layout { grid-template-columns: minmax(0, 1fr); }
  .regions-list { max-height: none; overflow: visible; padding: 0; }
  .regions-map { height: 480px; }
}
@media (max-width: 480px) {
  .regions-page { padding: 28px 0 40px; }
  .regions-map-column { padding: 12px; }
  .regions-map { height: 430px; }
  .map-toolbar { font-size: .85rem; }
  .map-toolbar button { font-size: .75rem; padding: 6px 10px; }
  .region-hero { padding-left: 14px; gap: 12px; }
  .region-logo { width: 56px; height: 56px; }
  .region-panel { padding: 20px; }
  .region-card { padding: 16px; }
}