/* Map */
.location-map { width: 100%; background-color: var(--color-neutral-300); }
.location-map__image--mobile { display: none; }

/* Address & Contact */
.location-summary { display: flex; flex-direction: row; align-items: flex-start; justify-content: space-between; gap: var(--space-40) var(--space-30); margin-bottom: 60px; padding-block: 50px; padding-inline: clamp(18px, 7vw, 124px); background-color: var(--color-surface-muted); }
.location-summary__item { display: flex; gap: 29px; }
.location .icon-location { display: block; flex-shrink: 0; width: 64px; height: 64px; color: var(--color-brand-accent); }
.location .icon-number { display: block; flex-shrink: 0; width: 50px; height: 50px; color: var(--color-brand-accent); }
.location-summary__body { flex: 1; min-width: 0; }
.location-summary__title { margin-bottom: 16px; color: var(--color-text-muted); font-size: var(--font-size-h1); font-weight: 700; line-height: var(--line-height-h1); }
.location-summary__text,
.location-summary__list { font-size: var(--font-size-h3); line-height: var(--line-height-h3); word-break: keep-all; color: var(--color-text-muted); }
.location-summary__list li { position: relative; padding-left: var(--space-30); }
.location-summary__list li::before { content: ''; display: block; position: absolute; top: var(--font-size-caption); left: var(--font-size-caption); width: 5px; height: 5px; border-radius: 3px; background-color: var(--color-text-muted); }

/* Link */
.location-links { display: flex; flex-direction: row; justify-content: center; align-items: center; gap: var(--space-16) var(--space-30); margin-bottom: 140px; }

/* Transportation */
.location-routes { display: flex; flex-direction: column; gap: 80px; margin-inline: clamp(18px, 7vw, 124px); }
.location-routes__item { display: flex; gap: 29px; }
.location-routes__icon { display: flex; flex-shrink: 0; align-items: center; justify-content: center; width: 100px; height: 100px; border-radius: 50px; color: var(--color-surface-default); background-color: var(--color-brand-primary); }
.location-routes__icon .icon-bus,
.location-routes__icon .icon-car,
.location-routes__icon .icon-parking { display: block; width: 50px; height: 50px; }
.location-routes__body { flex: 1; min-width: 0; }
.location-routes__title { margin-bottom: 16px; color: var(--color-text-muted); font-size: var(--font-size-h1); font-weight: 700; line-height: var(--line-height-h1); }
.location-routes__desc { display: flex; flex-direction: column; gap: var(--space-10); font-size: var(--font-size-h3); font-weight: 500; line-height: var(--line-height-h4); color: var(--color-text-muted); }
.location-routes__entry { position: relative; padding-left: var(--space-30); }
.location-routes__entry::before { content: ''; display: block; position: absolute; top: var(--font-size-body); left: var(--font-size-caption); width: 5px; height: 5px; border-radius: 3px; background-color: var(--color-brand-accent); }
.location-routes__item--parking .location-routes__entry::before { background-color: var(--color-text-muted); }
.location-routes__label { padding-right: 0.35rem; font-weight: 700; color: var(--color-brand-accent); }
.location-routes__desc--block .location-routes__label { display: block; margin-bottom: 2px; }

@media (max-width: 768px) {
  /* Map */
  .location-map__image--desktop { display: none; }
  .location-map__image--mobile { display: block; }

  /* Address & Contact */
  .location-summary { flex-direction: column; margin-bottom: 30px; padding-block: 30px; padding-inline: 18px; }
  .location-summary__item { gap: 15px; }

  /* Link */
  .location-links { flex-direction: column; margin-bottom: 60px; }

  /* Transportation */
  .location-routes { gap: 56px; margin-inline: 18px; }
  .location-routes__item { gap: 15px; }
  .location-routes__icon { width: 50px; height: 50px; }
  .location-routes__icon .icon-bus,
  .location-routes__icon .icon-car,
  .location-routes__icon .icon-parking { width: 25px; height: 25px; }
}
