/* Geographic guide and photo-style coaching example. */
.location-guide .map-coverage {
  padding: 7px 11px;
  border: 1px solid rgba(255,255,255,.2);
  border-radius: 20px;
  font-size: 11px;
  color: #e4ebf3;
  white-space: nowrap;
}
.location-guide .map-pin, .location-guide .map-pin.next { font: 600 11px var(--font-body); color: #e4ebf3; }
.location-guide .map-pin i:before { inset: 4px; background: #f5a623; box-shadow: none; }
.location-guide .map-pin.hub i:after { animation: none; }
.location-guide .map-pin.selected { color: #101a30; }
.location-guide .map-pin.selected i:before { background: #101a30; }
.location-guide .map-legend { flex-wrap: wrap; }
.location-guide .ro-note { line-height: 1.65; }
.location-guide .metrics article:not(.wide) span { max-width: 19ch; }
.coaching-photo-section {
  display: grid;
  grid-template-columns: .8fr 1.3fr;
  gap: clamp(28px,5vw,72px);
  align-items: center;
  background: #fbf8f0;
  color: #101a30;
}
#evidence.coaching-photo-section h2 {
  margin: 0 0 22px;
  font-size: clamp(32px,3.8vw,52px);
  line-height: 1.12;
}
.coaching-photo-copy > p {
  margin: 0 0 24px;
  max-width: 29ch;
  color: #596579;
  font-size: 17px;
  line-height: 1.65;
}
.coaching-photo { margin: 0; min-width: 0; }
.coaching-photo img {
  display: block;
  width: 100%;
  height: auto;
  border-radius: 18px;
}
.coaching-photo figcaption {
  margin-top: 10px;
  color: #657084;
  font-size: 11px;
  line-height: 1.6;
}
#demo .game-entry-grid { grid-template-columns: repeat(2,minmax(0,1fr)); }
.demo-full-link { color: #53617a; font-size: 12px; text-underline-offset: 3px; }
.demo-full-link:focus-visible { outline: 3px solid #b97804; outline-offset: 4px; }
.lang-bn .coaching-photo figcaption { font-size: 13px; }
@media (max-width: 760px) {
  .coaching-photo-section { grid-template-columns: 1fr; gap: 28px; }
  .coaching-photo-copy > p { max-width: 40ch; }
}
@media (max-width: 520px) {
  #demo .game-entry-grid { grid-template-columns: 1fr; }
  .coaching-photo img { border-radius: 13px; }
  .location-guide .map-coverage { font-size: 10px; padding: 6px 9px; }
}
