body { background: #f7f3ea; color: #183633; }

.loc-hero {
  min-height: 390px;
  padding: 2.2rem 1.25rem 5.2rem;
  background:
    radial-gradient(circle at 80% 18%, rgba(216,120,74,.23), transparent 27%),
    linear-gradient(132deg, #102d29 0%, #183f3a 55%, #24564f 100%);
}

.loc-hero::before {
  opacity: .48;
  background-image:
    linear-gradient(rgba(255,255,255,.04) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255,255,255,.04) 1px, transparent 1px);
  background-size: 72px 72px;
  mask-image: linear-gradient(to right, transparent, #000 38%, #000);
}

.loc-hero::after { height: 34px; background: #f7f3ea; }
.loc-hero-inner { width: min(1220px, 100%); }
.loc-hero .breadcrumb { padding-top: 0; }
.loc-eyebrow { color: #ef8a59; font-weight: 900; }
.loc-h1 { max-width: 820px; margin: .15rem 0 .75rem; font-size: clamp(2.15rem,4.2vw,3.4rem); line-height: 1.03; letter-spacing: -.055em; }
.loc-lead { max-width: 720px; color: rgba(255,255,255,.78); font-size: 1.05rem; line-height: 1.75; }
.loc-stats { max-width: 720px; display: grid; grid-template-columns: repeat(3,1fr); gap: 0; margin-top: 1.65rem; padding-top: 1.3rem; }
.loc-stats > div { padding-right: 1.4rem; }
.loc-stats > div + div { padding-left: 1.4rem; border-left: 1px solid rgba(255,255,255,.14); }
.loc-stat-num { color: #fff; font-size: 1.55rem; }
.loc-stat-label { color: rgba(255,255,255,.62); }

.loc-wrap { max-width: 1220px; padding: 0 1.25rem 5rem; }

.loc-intro-band {
  position: relative;
  z-index: 3;
  display: grid;
  grid-template-columns: minmax(0,1fr) auto;
  gap: 1.5rem;
  align-items: center;
  margin-top: -30px;
  padding: 1rem 1.1rem;
  background: #fff;
  border: 1px solid #d5e1de;
  border-radius: 4px;
  box-shadow: 0 12px 28px rgba(24,63,58,.09);
}

.loc-intro-band strong { display: block; color: #183633; font-size: .9rem; }
.loc-intro-band p { margin: .15rem 0 0; color: #5f716d; font-size: .78rem; }
.loc-chips { margin: 0; gap: .4rem; }
.loc-chip { background: #f7f3ea; border-color: #d5e1de; border-radius: 4px; color: #24433f; font-size: .78rem; font-weight: 800; }
.loc-chip:hover { background: #d9e9e5; border-color: #2b7a73; color: #205f59; }

.loc-search {
  display: grid;
  grid-template-columns: minmax(0,1fr) auto;
  gap: 0;
  max-width: 760px;
  margin: 2rem 0 1rem;
  padding: 5px;
  background: #fff;
  border: 1px solid #b8cbc6;
  border-radius: 4px;
  box-shadow: 0 2px 8px rgba(24,63,58,.07);
}
.loc-search label { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0,0,0,0); }
.loc-search input { min-width: 0; height: 46px; padding: 0 1rem; border: 0; outline: 0; background: #fff; color: #183633; font: inherit; }
.loc-search input:focus { box-shadow: inset 0 0 0 2px #2b7a73; }
.loc-search button { min-height: 46px; padding: 0 1rem; border: 1px solid #2b7a73; border-radius: 4px; background: #2b7a73; color: #fff; font: inherit; font-size: .84rem; font-weight: 900; cursor: pointer; }
.loc-search button:hover { background: #205f59; }
.loc-search-status { min-height: 1.3em; margin: 0 0 1.4rem; color: #5f716d; font-size: .78rem; }
.loc-search-clear { margin: -.85rem 0 1.35rem; padding: 0; border: 0; background: transparent; color: #205f59; font: inherit; font-size: .78rem; font-weight: 900; cursor: pointer; }
.loc-search-clear:hover { color: #a94a27; text-decoration: underline; }

.loc-section-title { margin: 2.2rem 0 .45rem; color: #183633; font-size: clamp(1.5rem,2.5vw,2.05rem); line-height: 1.12; letter-spacing: -.04em; }
.loc-section-title .loc-title-icon { display: grid; place-items: center; width: 34px; height: 34px; background: #d9e9e5; color: #205f59; border-radius: 4px; font-size: .94rem; }
.loc-section-count { background: #d9e9e5; color: #205f59; font-weight: 800; }
.loc-section-intro { max-width: 760px; margin: 0 0 1.2rem; color: #405b57; line-height: 1.72; }

.loc-map-section { grid-template-columns: 370px minmax(0,1fr); gap: 0; margin: 1.3rem 0 2rem; border: 1px solid #d5e1de; border-radius: 4px; overflow: hidden; background: #fff; box-shadow: 0 12px 28px rgba(24,63,58,.08); }
.loc-map-panel { border: 0; border-right: 1px solid #d5e1de; border-radius: 0; }
.loc-map-panel-header { min-height: 58px; padding: .85rem 1rem; border-bottom-color: #d5e1de; color: #183633; }
.loc-map-panel-header span:first-child { text-transform: none; }
.loc-map-badge { min-width: 30px; background: #d9e9e5; color: #205f59; border-radius: 4px; }
.loc-map-list { max-height: 510px; }
.loc-map-item { min-height: 64px; padding: .7rem 1rem; border-bottom-color: #edf2f0; color: #24433f; }
.loc-map-item:hover,
.loc-map-item.active { background: #eef6f3; border-left-color: #2b7a73; }
.loc-map-item-name { color: #183633; font-weight: 800; }
#loc-map { height: 568px; border: 0; border-radius: 0; box-shadow: none; background: #dfeae6; }

.loc-prov-grid { grid-template-columns: repeat(5,minmax(0,1fr)); gap: .75rem; }
.loc-prov-card { min-height: 92px; padding: 1rem; border-color: #d5e1de; border-left: 3px solid #2b7a73; border-radius: 0 4px 4px 0; }
.loc-prov-card:hover { border-color: #d8784a; box-shadow: 0 8px 20px rgba(24,63,58,.08); }
.loc-prov-name { color: #183633; }
.loc-prov-count { color: #5f716d; }
.loc-prov-arrow { color: #2b7a73; }

.loc-muni-grid { grid-template-columns: repeat(4,minmax(0,1fr)); gap: .75rem; }
.loc-muni-card { min-height: 86px; padding: .85rem 1rem; border-color: #d5e1de; border-radius: 4px; }
.loc-muni-card:hover { border-color: #b8cbc6; box-shadow: 0 8px 20px rgba(24,63,58,.08); }
.loc-muni-icon { display: grid; place-items: center; width: 34px; height: 34px; background: #d9e9e5; color: #205f59; border-radius: 4px; font-size: .9rem; }
.loc-muni-name { color: #183633; }
.loc-muni-prov { color: #5f716d; }
.loc-muni-count { color: #205f59; }
.loc-map-item[hidden],
.loc-muni-card[hidden] { display: none; }

.loc-context-note { display: grid; grid-template-columns: minmax(0,1fr) auto; gap: 2rem; align-items: center; margin: 2.4rem 0 0; padding: 1.35rem 1.45rem; background: #183f3a; color: #fff; border-left: 5px solid #d8784a; border-radius: 4px; }
.loc-context-note h2 { margin: 0; color: #fff; font-size: 1.3rem; letter-spacing: -.025em; }
.loc-context-note p { margin: .35rem 0 0; color: rgba(255,255,255,.7); font-size: .86rem; line-height: 1.65; }
.loc-context-note a { display: inline-flex; padding: .7rem 1rem; background: #d8784a; color: #173b36; border-radius: 4px; font-size: .84rem; font-weight: 900; white-space: nowrap; }
.loc-context-note a:hover { background: #e68a5c; color: #102d29; text-decoration: none; }

.dc-ad-zone--after-h1 { margin: 2rem 0; max-width: none; }

@media (max-width: 1000px) {
  .loc-intro-band { grid-template-columns: 1fr; }
  .loc-map-section { grid-template-columns: 1fr; }
  .loc-map-panel { order: 2; border-right: 0; border-top: 1px solid #d5e1de; }
  #loc-map { order: 1; height: 390px; }
  .loc-map-list { max-height: 260px; }
  .loc-prov-grid { grid-template-columns: repeat(3,minmax(0,1fr)); }
  .loc-muni-grid { grid-template-columns: repeat(3,minmax(0,1fr)); }
}

@media (max-width: 720px) {
  .loc-hero { min-height: 0; padding: 1.8rem 1rem 4.6rem; }
  .loc-h1 { font-size: 2.25rem; }
  .loc-lead { font-size: .96rem; }
  .loc-stats { grid-template-columns: 1fr; gap: .8rem; }
  .loc-stats > div { padding: 0; }
  .loc-stats > div + div { padding: .8rem 0 0; border-left: 0; border-top: 1px solid rgba(255,255,255,.12); }
  .loc-intro-band { margin-top: -26px; }
  .loc-chips { display: grid; grid-template-columns: 1fr 1fr; }
  .loc-chip { justify-content: center; }
  .loc-search { grid-template-columns: 1fr; padding: 0; overflow: hidden; }
  .loc-search button { margin: 0 5px 5px; }
  .loc-prov-grid,
  .loc-muni-grid { grid-template-columns: 1fr 1fr; }
  .loc-context-note { grid-template-columns: 1fr; }
}

@media (max-width: 460px) {
  .loc-prov-grid,
  .loc-muni-grid { grid-template-columns: 1fr; }
}