.areas-grid,.local-grid{display:grid;gap:36px;align-items:center}
@media(min-width:960px){.areas-grid,.local-grid{grid-template-columns:1fr 1fr;gap:56px}}
.city-chips{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:10px}
.chip{display:inline-flex;align-items:center;gap:8px;min-height:46px;padding:10px 18px;border-radius:999px;background:var(--sky-50);color:var(--navy);font-weight:700;text-decoration:none;border:1px solid transparent;transition:background .2s,border-color .2s,transform .2s}
.band-white .chip{background:var(--sky-50)}
.band-cream .chip{background:#fff;border-color:#f1e3d8}
.chip .icon{color:var(--blue)}
a.chip:hover{border-color:var(--blue);color:var(--blue);transform:translateY(-2px)}
.chip-home{background:var(--navy)!important;color:#fff}
.chip-home .icon{color:#7fc6ee}
.more-cities{margin-top:18px;font-size:15px;color:var(--muted)}
.more-cities summary{display:inline-flex;align-items:center;gap:6px;cursor:pointer;font-weight:700;color:var(--blue);list-style:none;min-height:44px}
.more-cities summary::-webkit-details-marker{display:none}
.more-cities[open] summary .icon{transform:rotate(180deg)}
.more-cities p{margin:6px 0 0;line-height:1.9}
.area-map{margin:0}
.area-map svg{width:100%;height:auto;filter:drop-shadow(0 18px 40px rgba(18,50,79,.12))}
.am-link{stroke:#a9d4ee;stroke-width:1.6;stroke-dasharray:4 5}
.am-link.hi{stroke:var(--coral);stroke-width:2.6;stroke-dasharray:none}
.am-city circle{fill:#fff;stroke:var(--blue);stroke-width:3}
.am-city text{font:700 13px var(--font-body);fill:var(--navy);paint-order:stroke;stroke:#f2f8fc;stroke-width:4px}
.am-city.hi circle{fill:var(--coral);stroke:#fff}
.am-city.hi text{font-size:15px}
.area-map figcaption{margin-top:12px;font-size:14px;color:var(--muted);text-align:center}
@media(max-width:600px){.am-city text{font-size:18px}.am-city.hi text{font-size:19px}}
/* ===== Areas: living map ===== */
section.areas-sec .area-map svg{filter:drop-shadow(0 22px 44px rgba(18,50,79,.14))}
.am-link{transition:stroke .3s,stroke-width .3s}
.am-city circle{transform-box:fill-box;transform-origin:center;transition:fill .3s,stroke .3s,transform .35s cubic-bezier(.34,1.56,.64,1)}
.am-city.hi circle{transform:scale(1.6)}
.am-city text{transition:fill .3s}
.am-city.hi text{fill:var(--blue)}
.am-city{cursor:pointer}
.chip{transition:background .25s,border-color .25s,transform .25s,box-shadow .25s,color .25s}
.chip .icon{transition:transform .35s cubic-bezier(.34,1.56,.64,1)}
.chip:hover .icon,.chip.is-hi .icon{transform:translateY(-3px) scale(1.15)}
.chip.is-hi{border-color:var(--coral);box-shadow:0 8px 20px rgba(227,160,138,.3);transform:translateY(-2px)}
@media(prefers-reduced-motion:no-preference){.am-link{animation:am-flow 1.4s linear infinite}.city-chips li{animation:chip-in .6s cubic-bezier(.22,1,.36,1) both}.city-chips li:nth-child(2){animation-delay:.05s}.city-chips li:nth-child(3){animation-delay:.1s}.city-chips li:nth-child(4){animation-delay:.15s}.city-chips li:nth-child(5){animation-delay:.2s}.city-chips li:nth-child(6){animation-delay:.25s}.city-chips li:nth-child(7){animation-delay:.3s}.city-chips li:nth-child(8){animation-delay:.35s}.city-chips li:nth-child(9){animation-delay:.4s}}
/* ===== Real map ===== */
.area-map .am2{width:100%;height:auto;display:block;border-radius:22px;filter:drop-shadow(0 22px 44px rgba(18,50,79,.16))}
.am2 .am-link{stroke:#4a9fd3;stroke-width:2.6;stroke-dasharray:7 9;opacity:.75}
.am2 .am-link.hi{stroke:#E3A08A;stroke-width:4.5;stroke-dasharray:none;opacity:1}
.am2 .am-city circle{fill:#fff;stroke:var(--blue);stroke-width:5}
.am2 .am-city text{font:700 25px var(--font-body);fill:var(--navy);paint-order:stroke;stroke:#f5f9fc;stroke-width:8px;stroke-linejoin:round}
.am2 .am-city.hi circle{fill:#E3A08A;stroke:#fff}
.am2 .am-city.hi text{fill:#B4533A;font-size:27px}
.city-chips .chip.is-hi,.city-chips .chip:hover{background:linear-gradient(180deg,#EDB4A1,var(--blush));border-color:transparent;color:var(--navy);box-shadow:0 10px 24px rgba(227,160,138,.4)}
.city-chips .chip.is-hi .icon,.city-chips .chip:hover .icon{color:var(--navy)}
@media(max-width:700px){.am2 .am-city text{font-size:36px;stroke-width:10px}.am2 .am-city.hi text{font-size:38px}.am2 .am-city circle{r:12}}
.am2 .am-link{opacity:.4!important;stroke-width:2!important}
@keyframes am-flow{to{stroke-dashoffset:-32}}
@keyframes chip-in{from{opacity:0;transform:translateY(14px) scale(.96)}to{opacity:1;transform:none}}