/* ==========================================================================
   About page layout  (shared hero/components live in components.css)
   ========================================================================== */

/* ============================================================
   Hero — heading + two-paragraph story, image on the side
   ============================================================ */
.about-hero__copy {
  display: flex;
  flex-direction: column;
  gap: var(--space-lg);
  max-width: 36rem;
}

/* ============================================================
   Where we operate — city pills with a location pin
   ============================================================ */
.cities__grid .city-pill:not(.city-pill--ghost)::before {
  content: '';
  width: 0.875rem;
  height: 0.875rem;
  flex-shrink: 0;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%23142d5f'%3E%3Cpath d='M12 2C8 2 5 5 5 9c0 5 7 13 7 13s7-8 7-13c0-4-3-7-7-7zm0 9.5a2.5 2.5 0 110-5 2.5 2.5 0 010 5z'/%3E%3C/svg%3E");
  background-size: contain;
  background-repeat: no-repeat;
}