/* S & K Medical Center: Privacy Policy and Terms of Service pages.
   Loaded after styles.css and uses its colours and fonts. */

.legal-page { display: flex; flex-direction: column; min-height: 100vh; background: var(--paper); }

.legal-head { border-bottom: 1px solid var(--line); background: var(--ivory); }
.legal-head__inner { display: flex; align-items: center; justify-content: space-between; gap: 16px; padding-top: 18px; padding-bottom: 18px; }
.legal-head__actions { display: flex; align-items: center; gap: 20px; }
.legal-head__back { font-weight: 600; font-size: .9rem; color: var(--ink); }
.legal-head__back:hover { color: var(--gold); }

.legal { flex: 1; padding: clamp(48px, 8vw, 110px) 0 clamp(64px, 9vw, 130px); }
.legal__wrap { max-width: 860px; }
.legal__title { margin-top: 22px; font-size: clamp(2.6rem, 6vw, 4.8rem); line-height: .98; color: var(--ink); }
.legal__body { margin-top: clamp(28px, 4vw, 48px); font-size: 1.02rem; line-height: 1.75; color: var(--text); }
.legal__body p + p, .legal__body p + ul, .legal__body ul + p { margin-top: 1.2em; }
.legal__body ul { margin: 0; padding: 0; list-style: none; display: grid; gap: 1em; }
.legal__body li { position: relative; padding-left: 26px; }
.legal__body li::before { content: ""; position: absolute; left: 0; top: .78em; width: 12px; height: 1px; background: var(--gold); }
.legal__body strong { font-weight: 700; color: var(--ink); }
.legal__body a { color: var(--ink); font-weight: 600; text-decoration: underline; text-decoration-color: var(--gold); text-underline-offset: 3px; }
.legal__body a:hover { color: var(--gold); }

.legal-foot { background: var(--ink); color: rgba(251, 248, 243, .6); font-size: .8rem; padding: 26px 0 22px; }
.legal-foot__row { display: flex; justify-content: space-between; flex-wrap: wrap; gap: 14px 22px; }
.legal-foot__links { display: flex; flex-wrap: wrap; gap: 22px; }
.legal-foot a:hover { color: var(--gold-2); }
.legal-foot__note { margin-top: 12px; font-size: .78rem; color: rgba(251, 248, 243, .45); }

@media (max-width: 560px) {
  .legal-head__back { display: none; }
}
