.locations-map {
  display: grid;
  grid-template-columns: minmax(250px, .8fr) minmax(0, 1.35fr);
  align-items: center;
  gap: 24px;
  margin: 0 0 64px;
  padding: 48px 24px 30px 48px;
  border-block: 1px solid #3b4b69;
  background: radial-gradient(ellipse at 75% 38%, #13223b 0, transparent 62%);
}
.locations-map-copy > .eyebrow { color: #a8cce5; font-size: .75rem; }
.locations-map-copy h3 { margin-top: 18px; font-size: clamp(1.55rem, 2.5vw, 2.4rem); line-height: 1.7; letter-spacing: .05em; }
.locations-map-total { display: flex; align-items: baseline; gap: 15px; margin: 24px 0 0; line-height: 1.1; }
.locations-map-total strong { font: 500 clamp(4.3rem, 6.5vw, 6rem)/1 var(--en); letter-spacing: -.055em; color: #effaff; }
.locations-map-total > span { font-size: .875rem; color: #c4d4e8; line-height: 1.8; }
.locations-map-total small { display: block; font: 400 .75rem/1.6 var(--en); letter-spacing: .15em; }
.locations-map-areas { margin-top: 21px; color: #d4e6f3; font-size: .9375rem; }
.locations-map-areas > span { display: inline-block; margin-right: 16px; }
.locations-map-dot { display: inline-block; width: 8px; height: 8px; margin-right: 8px; border-radius: 50%; background: #9cdbef; }
.locations-map-brands { display: grid; margin-top: 25px; }
.locations-map-brands a { display: flex; align-items: center; gap: 12px; padding: 15px 0; border-top: 1px solid #3d4e6b; font-size: .9375rem; color: #e5f0ff; }
.locations-map-brands a:last-child { border-bottom: 1px solid #3d4e6b; }
.locations-map-brands a:hover { color: #aedfff; border-color: #8eb8d3; }
.locations-map-brands .map-brand-count { margin-left: auto; color: #c2d6ec; white-space: nowrap; font-size: .75rem; }
.locations-map-brands b { font: 500 1.25rem var(--en); color: #f0f7ff; padding-right: 5px; }
.locations-map-brands .map-link-arrow { margin-left: 12px; }
.locations-map-next { margin-top: 28px; padding-left: 15px; border-left: 2px solid #c3a776; }
.locations-map-next .map-next-label { color: #dcc49c; font-size: .8125rem; }
.locations-map-next > p + p { margin-top: 5px; color: #e7d8bd; font-size: 1rem; letter-spacing: .06em; }
.locations-map-next small { display: block; margin-top: 7px; color: #aebed5; font-size: .75rem; line-height: 1.9; }
.locations-map-figure { margin: 0; min-width: 0; }
.locations-map-figure picture, .locations-map-figure img { display: block; width: 100%; height: auto; }
.locations-film { position: relative; padding-bottom: 58px; }
.locations-film video { display: block; width: 100%; height: auto; aspect-ratio: 1; object-fit: contain; background: #0a1122; }
.locations-film .locations-film-toggle { position: absolute; right: 0; bottom: 8px; top: auto; left: auto; min-height: 44px; padding: 8px 14px; display: inline-flex; align-items: center; gap: 10px; border: 1px solid #617591; background: #101b30; color: #ecf7ff; border-radius: 999px; cursor: pointer; font-size: .875rem; }
.locations-film .locations-film-toggle[hidden] { display: none; }
.locations-map-figure figcaption { display: flex; flex-wrap: wrap; justify-content: center; gap: 8px 24px; margin: 4px 0 20px; font-size: .8125rem; color: #c7d9ed; }
.locations-map-figure figcaption > span { display: inline-flex; align-items: center; gap: 9px; }
.map-key { display: inline-block; width: 13px; height: 13px; background: #9cdbef; border: 1px solid #caeefb; }
.map-key--planned { border-color: #d9bd8c; background: repeating-linear-gradient(125deg, #65563f 0 3px, #cbb184 3px 5px); }
.map-key--reuse { width: 10px; height: 10px; border-radius: 50%; border-color: #a0ebff; background: #a0ebff; }
.map-key--beauty { width: 10px; height: 10px; transform: rotate(45deg); border-color: #ffb6cd; background: #ffb6cd; }
.map-key--future { border-color: #ff9ba2; background: #ed6375; border-radius: 2px; }
.locations-map-note { grid-column: 1 / -1; margin: 5px 0 0; color: #96a9c4; font-size: .75rem; line-height: 1.8; }
.locations-map-note a { text-decoration: underline; text-underline-offset: 3px; }
#reuse-stores, #bupura-stores { scroll-margin-top: 80px; }
@media (max-width: 1100px) {
  .locations-map { grid-template-columns: minmax(240px, .8fr) minmax(0, 1.15fr); padding: 34px 0; gap: 24px; }
}
@media (max-width: 740px) {
  #reuse-stores, #bupura-stores { scroll-margin-top: 0; }
  .locations-map { grid-template-columns: minmax(0, 1fr); gap: 8px; padding: 28px 0 23px; margin-bottom: 42px; }
  .locations-map-copy { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: start; column-gap: 16px; }
  .locations-map-copy > .eyebrow { grid-column: 1 / -1; }
  .locations-map-copy h3 { margin-top: 15px; font-size: clamp(1.3rem, 5vw, 1.85rem); }
  .locations-map-total { align-self: center; margin: 15px 0 0; flex-direction: column; gap: 5px; }
  .locations-map-total strong { font-size: 3.8rem; }
  .locations-map-total > span { font-size: .75rem; }
  .locations-map-total small { display: none; }
  .locations-map-areas { grid-column: 1 / -1; margin-top: 15px; font-size: .875rem; }
  .locations-map-areas > span { margin-right: 14px; }
  .locations-map-brands { grid-column: 1 / -1; margin-top: 22px; }
  .locations-map-next { grid-column: 1 / -1; margin-top: 23px; }
  .locations-map-figure { margin-top: 8px; }
  .locations-map-figure figcaption { margin-bottom: 12px; }
  .locations-map-note { margin-top: 5px; }
}