/* Location page: hero, world map, headquarters. Shared chrome lives in site.css. */

/* ---------- Map ---------- */
.map-section { position: relative; overflow: hidden; }
.map-section__stage { position: relative; max-width: 1600px; margin: 0 auto; padding: 56px var(--gutter) 0; }
.map-section__map svg { display: block; width: 100%; height: auto; background: var(--surface-dark); }
.map-section__map--mobile { display: none; }
.map-section__inner { position: relative; max-width: var(--container-max); margin: 0 auto; padding: 8px var(--gutter) 56px; }
.map-legend {
  display: flex; flex-wrap: wrap; justify-content: center; gap: 14px 36px;
  margin: 0; padding: 28px 0 0; list-style: none; border-top: 1px solid var(--border-dark-subtle);
}
.map-legend li { display: flex; align-items: center; gap: 10px; font: var(--type-body-sm); color: var(--text-inverse-secondary); }
.map-legend li.is-hq { color: var(--text-inverse); }
.map-legend__dot { width: 7px; height: 7px; border-radius: 999px; background: var(--orange-500); flex: none; }
.map-legend__dot--hq { background: var(--green-500); }
.map-legend__dot--world { background: var(--surface-dark); border: 1.5px solid rgba(255, 255, 255, .92); }
.map-section__note {
  margin: 22px auto 0; max-width: 82ch; text-align: center;
  font: var(--type-body-sm); color: var(--text-inverse-secondary); text-wrap: balance;
}
/* Node animations referenced by the inline map SVGs. */
@keyframes fastener-map-pulse { 0%, 100% { opacity: .35; } 50% { opacity: 1; } }
@keyframes fastener-map-ring { 0% { r: 6px; opacity: .8; } 100% { r: 16px; opacity: 0; } }
@keyframes fastener-map-ring-m { 0% { r: 16px; opacity: .8; } 100% { r: 42px; opacity: 0; } }
@media (prefers-reduced-motion: reduce) {
  .map-section__map circle { animation: none !important; }
}

/* ---------- Headquarters ---------- */
.hq { background: var(--light-gray); }
.hq__inner { max-width: var(--container-max); margin: 0 auto; padding: 80px var(--gutter); }
.hq__grid { display: grid; grid-template-columns: 1.1fr 1fr; gap: 64px; align-items: start; }
.hq__title {
  margin: 16px 0 0; font: var(--weight-semibold) var(--text-h1) / var(--leading-heading) var(--font-display);
  letter-spacing: var(--tracking-heading); max-width: 16ch; text-wrap: pretty;
}
.hq__detail { padding-top: 34px; }
.hq__address { display: flex; align-items: flex-start; gap: 14px; margin: 0; font-style: normal; }
.hq__node { width: 8px; height: 8px; border-radius: 999px; background: var(--green-500); flex: none; margin-top: 8px; }
.hq__name { margin: 0; font: var(--weight-semibold) var(--text-body-lg) / 1.5 var(--font-display); }
.hq__lines { margin: 6px 0 0; font: var(--type-body); color: var(--text-secondary); line-height: 1.6; }
.hq__note { margin: 22px 0 0; font: var(--type-body-sm); color: var(--text-tertiary); max-width: 44ch; }

/* ---------- Mobile ---------- */
@media (max-width: 820px) {
  .map-section__map--desktop { display: none; }
  .map-section__map--mobile { display: block; }
  .map-section__stage { padding: 12px 8px 0; }
  .map-section__inner { padding: 56px 20px; }
  .hq__inner { padding: 56px 20px; }
  .hq__grid { grid-template-columns: 1fr; gap: 32px; }
  .hq__detail { padding-top: 0; }
}
