.legal-page {
  width: min(980px, calc(100% - 48px));
  padding-block: clamp(38px, 7vw, 78px) 96px;
}

.legal-page-header {
  padding: clamp(28px, 5vw, 52px);
  border: 1px solid #e8deed;
  border-radius: 24px;
  background: linear-gradient(135deg, #fff 0%, #fbf7fd 100%);
  box-shadow: 0 18px 48px rgb(55 26 75 / 7%);
}

.legal-page-header h1 {
  margin: 8px 0 12px;
  color: #32134e;
  font-size: clamp(2rem, 5vw, 3.25rem);
  line-height: 1.15;
}

.legal-page-intro { max-width: 720px; color: #62566c; line-height: 1.8; }

.legal-page-toc {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin-block: 22px;
  padding: 18px;
  border: 1px solid #e8deed;
  border-radius: 18px;
  background: #fff;
}

.legal-page-toc strong { flex-basis: 100%; color: #44205e; }
.legal-page-toc a { padding: 8px 12px; border-radius: 999px; background: #f7f1fa; color: #45205d; font-size: .9rem; text-decoration: none; }
.legal-page-toc a:hover, .legal-page-toc a:focus-visible { background: #4e236b; color: #fff; }

.legal-page-sections { display: grid; gap: 14px; }
.legal-section { scroll-margin-top: 96px; padding: clamp(20px, 4vw, 30px); border: 1px solid #e8deed; border-radius: 18px; background: #fff; }
.legal-section h2 { margin: 0 0 12px; color: #44205e; font-size: 1.2rem; }
.legal-section p, .legal-section li { color: #51485a; line-height: 1.8; }
.legal-section p { margin: 0; }
.legal-section ul { margin: 0; padding-left: 1.35rem; }
.legal-section li + li { margin-top: 9px; }
.legal-section a { color: #542471; font-weight: 650; text-underline-offset: 3px; }
.legal-section code { padding: 2px 6px; border-radius: 5px; background: #f5f0f7; color: #45205d; overflow-wrap: anywhere; }

.external-map-notice { display: grid; min-height: 100%; place-content: center; justify-items: center; gap: 16px; padding: 28px; text-align: center; }
.external-map-notice p { max-width: 440px; color: #5c5364; line-height: 1.7; }
.contact-map-card:has(iframe) .external-map-notice { display: none; }
.contact-map-card iframe { width: 100%; height: 100%; min-height: 320px; border: 0; }

@media (max-width: 640px) {
  .legal-page { width: calc(100% - 32px); padding-block: 28px 72px; }
  .legal-page-header { border-radius: 18px; }
  .legal-page-toc { gap: 8px; padding: 14px; }
  .legal-page-toc a { font-size: .82rem; }
  .legal-section { border-radius: 14px; }
}