:root {
  --pin: #b8583f;
}
[data-theme="dark"] {
  --pin: #e08267;
}

.travel-wrap {
  padding: 8px 40px 64px;
}
.travel-wrap h1 {
  font-size: 2.1rem;
  font-weight: 600;
  margin: 0 0 6px;
}
.travel-count {
  color: var(--text-dim);
  margin: 0 0 24px;
}

#map {
  width: 100%;
  height: 62vh;
  min-height: 420px;
  border-radius: 12px;
  border: 1px solid var(--border);
}

/* dot markers */
.travel-dot {
  width: 12px;
  height: 12px;
  border-radius: 50%;
  background: var(--pin);
  border: 2px solid var(--bg);
  box-shadow: 0 0 0 1px var(--pin);
}

/* cluster bubbles */
.marker-cluster {
  background: color-mix(in srgb, var(--pin) 22%, transparent);
}
.marker-cluster div {
  background: var(--pin);
  color: #fff;
  font-family: 'EB Garamond', Georgia, serif;
  font-weight: 600;
  font-size: 13px;
}

.leaflet-popup-content-wrapper {
  background: var(--bg);
  color: var(--text);
  font-family: 'EB Garamond', Georgia, serif;
  border-radius: 8px;
}
.leaflet-popup-tip { background: var(--bg); }
.leaflet-container a.leaflet-popup-close-button { color: var(--text-dim); }

@media (max-width: 860px) {
  .travel-wrap { padding: 4px 24px 48px; }
  #map { height: 56vh; min-height: 340px; }
}