.legal-width { width: min(760px, calc(100% - 40px)); margin-inline: auto; padding-block: 48px 64px; }
.legal-home { min-height: 48px; display: inline-flex; align-items: center; padding-block: 8px; font-size: 16px; }
.legal-page .brand { min-width: 0; }
.legal-page .brand img { flex-shrink: 0; }
.legal-page .brand span { overflow-wrap: anywhere; }
.legal-intro .eyebrow { margin-bottom: 12px; }
.legal-intro h1 { font-size: clamp(44px, 8vw, 66px); line-height: 1.08; letter-spacing: -.025em; }
.legal-intro > p:not(.eyebrow) { margin-top: 16px; }
.legal-intro .legal-date { font-size: 15px; color: #526956; }
.legal-nav { display: flex; flex-wrap: wrap; gap: 4px 24px; padding-block: 14px; margin-block: 28px 36px; border-block: 1px solid rgb(0 45 42 / 20%); }
.legal-nav a { min-height: 44px; display: inline-flex; align-items: center; font-size: 16px; }
.legal-nav [aria-current="page"] { font-weight: 600; }
.legal-copy { font-size: 18px; line-height: 1.65; overflow-wrap: anywhere; }
.legal-copy section + section { margin-top: 34px; }
.legal-copy h2 { font-size: 30px; line-height: 1.2; margin-bottom: 12px; letter-spacing: -.01em; }
.legal-copy p + p, .legal-copy ul + p { margin-top: 14px; }
.legal-copy ul { margin: 0; padding-inline-start: 22px; }
.legal-copy li + li { margin-top: 10px; }
.draft-notice { padding: 16px; margin-bottom: 28px; border: 1px solid #84672e; border-radius: 12px; background: #efdfbd; font-size: 16px; }
.legal-page .site-footer { flex-wrap: wrap; }
.legal-page .footer-nav { flex-wrap: wrap; }
@media (max-width: 430px) {
  .legal-page .site-header { gap: 12px; padding-block: 16px; }
  .legal-page .brand { font-size: 26px; gap: 8px; }
  .legal-page .brand img { width: 25px; }
  .legal-page .page-width { width: calc(100% - 40px); }
  .legal-width { padding-block: 32px 48px; }
}

/* Tables (Privacy: lawful bases and retention). */
.legal-table { overflow-x: auto; margin-block: 14px; }
.legal-copy table { width: 100%; border-collapse: collapse; font-size: 16px; line-height: 1.5; }
.legal-copy th, .legal-copy td { text-align: start; vertical-align: top; padding-block: 10px; padding-inline-end: 14px; border-bottom: 1px solid rgb(0 45 42 / 16%); }
.legal-copy th { font-weight: 600; }
.legal-language { margin-top: 12px; font-size: 16px; }

/* Urdu pages: Nastaliq needs taller lines. The face is the app's Jameel Noori Nastaleeq, cut to the glyphs these pages draw
   (scripts/design/web-urdu-face.py). The sizes below were set for Noto Nastaliq, which draws a word as wide at 1.42 times fewer pixels,
   so size-adjust scales Jameel (the app's URDU_FACE_FACTOR); Latin names, digits and the spaces stay the site's sans at the page's size
   (Jameel makes every space a 5-unit blank, which would close the gap beside a Latin name). Its one weight covers them all, so no
   browser draws a false bold. */
@font-face { font-family: "Jameel Noori"; src: url("/assets/fonts/JameelNooriNastaleeq-Web.woff2") format("woff2"); font-weight: 100 900; font-display: swap; size-adjust: 142%; unicode-range: U+0600-06FF, U+0750-077F, U+08A0-08FF, U+FB50-FDFF, U+FE70-FEFF, U+200C-200F; }
html[lang="ur"] body, [lang="ur"] { font-family: "Jameel Noori", "Source Sans 3", sans-serif; }
html[lang="ur"] .legal-intro h1, html[lang="ur"] .legal-copy h2 { font-family: "Jameel Noori", serif; letter-spacing: 0; }
html[lang="ur"] .legal-intro h1 { font-size: clamp(34px, 7vw, 48px); line-height: 1.9; }
html[lang="ur"] .legal-intro > p:not(.eyebrow) { line-height: 2.1; }
html[lang="ur"] .legal-copy { font-size: 17px; line-height: 2.25; }
html[lang="ur"] .legal-copy h2 { font-size: 24px; line-height: 2; }
html[lang="ur"] .legal-copy table { line-height: 2.1; font-size: 15px; }
html[lang="ur"] .legal-nav a, html[lang="ur"] .legal-language { line-height: 2; }
[lang="en"] { font-family: "Source Sans 3", sans-serif; }
.brand[lang="en"], .footer-brand[lang="en"], .eyebrow[lang="en"] { font-family: inherit; }
/* No one-word last lines in headings and summaries; deep Nastaliq tails need underline room. */
.legal-intro h1, .legal-intro > p:not(.legal-date) { text-wrap: balance; }
.legal-copy p, .legal-copy li { text-wrap: pretty; }
html[lang="ur"] a { text-underline-offset: .5em; text-decoration-skip-ink: auto; }