/* Legal pages: privacy, accessibility, terms. */
:root {
  --ground: #F7F2EC; --sand: #EFE0CD; --gold: #B39B75; --gold-ink: #7A6345; --ink: #2B2A28;
  --margin: clamp(20px, 4vw, 56px);
}
* { box-sizing: border-box; }
body { margin: 0; background: var(--ground); color: var(--ink); font: 400 18px/1.75 "Heebo", system-ui, sans-serif; }
a { color: inherit; text-underline-offset: 3px; }
a:focus-visible, button:focus-visible { outline: 2px solid var(--gold-ink); outline-offset: 3px; }
.skip { position: absolute; inset-inline-start: 16px; top: -100px; background: var(--ink); color: var(--ground); padding: 12px 18px; text-decoration: none; }
.skip:focus { top: 16px; }

.bar { display: flex; justify-content: space-between; align-items: center; gap: 16px; padding: 24px var(--margin); }
.bar__brand { font: 500 22px/1 "Cinzel", Georgia, serif; letter-spacing: .2em; text-decoration: none; }
.bar__back { display: inline-flex; align-items: center; min-height: 44px; font-size: 16px; }

main { width: min(100% - 2 * var(--margin), 820px); margin: 56px auto 120px; }
.label { display: block; font: 400 16px/1 "Cinzel", Georgia, serif; letter-spacing: .32em; color: var(--gold-ink); margin-bottom: 18px; }
h1 { font-weight: 300; font-size: clamp(38px, 5vw, 64px); line-height: 1.05; margin: 0 0 16px; letter-spacing: -.01em; }
.updated { font-size: 15px; margin: 0 0 48px; }
h2 { font: 400 26px/1.3 "Heebo", system-ui, sans-serif; margin: 56px 0 12px; }
h3 { font: 500 19px/1.4 "Heebo", system-ui, sans-serif; margin: 28px 0 8px; }
p, li { margin: 0 0 12px; }
ul { padding-inline-start: 22px; margin: 0 0 12px; }
table { width: 100%; border-collapse: collapse; font-size: 16px; margin: 12px 0 24px; }
th, td { text-align: start; padding: 12px 10px; border-bottom: 1px solid #E2D7C8; vertical-align: top; }
th { font-weight: 500; border-bottom: 1.5px solid var(--gold); }
.box { background: var(--sand); padding: 24px 28px; margin: 24px 0; }
.box p:last-child { margin: 0; }
/* Details the client still has to supply. Remove the highlight before launch. */
.fill { background: #F3E3A6; padding: 0 4px; }

footer { background: var(--ink); color: var(--ground); padding: 40px var(--margin); font-size: 15px; display: flex; flex-wrap: wrap; gap: 6px 14px; }
footer a { display: inline-flex; align-items: center; min-height: 44px; }
@media (max-width: 600px) { body { font-size: 17px; } table { font-size: 15px; } }
