/* areas.css */
.areas-section { background:var(--cream); }
.pills { display:flex; gap:11px; flex-wrap:wrap; margin-top:40px; list-style:none; padding:0; }
.pill  { display:inline-flex; align-items:center; gap:8px; padding:11px 20px; background:#fff; border:1px solid var(--border-light); border-radius:40px; font-size:.82rem; font-weight:500; color:var(--charcoal); transition:all .2s; cursor:default; }
.pill:hover { background:var(--gold); border-color:var(--gold); transform:translateY(-2px); box-shadow:0 6px 16px rgba(245,166,35,.3); }
.pdot  { width:7px; height:7px; background:var(--gold); border-radius:50%; flex-shrink:0; }