/* Páginas de Termos e Privacidade: mesmo visual do site, em formato de leitura. */
:root {
  --bg: #04211f; --card: rgba(6, 38, 35, .78); --line: rgba(255, 214, 120, .16); --line-hi: rgba(255, 196, 80, .55);
  --ink: #fff8ea; --muted: #bfd8cb; --dim: #8aa99b; --cyan: #ffd23f;
  --grad: linear-gradient(180deg, #fff27a, #ffd23f 38%, #ff9f1c 72%, #ff6a1a);
  --f-display: "Lilita One", "Arial Black", Impact, sans-serif;
  --f-body: "Nunito", "Segoe UI", system-ui, sans-serif;
  --f-num: "JetBrains Mono", ui-monospace, Consolas, monospace;
  color-scheme: dark;
}
* { box-sizing: border-box }
body { margin: 0; color: var(--ink); font-family: var(--f-body); font-size: 16px; line-height: 1.7;
  background: radial-gradient(900px 500px at 70% -10%, rgba(255, 159, 28, .14), transparent 60%),
              radial-gradient(800px 500px at 0 0, rgba(34, 195, 240, .10), transparent 60%), var(--bg) }
a { color: var(--cyan) }
header { position: sticky; top: 0; z-index: 5; backdrop-filter: blur(14px); background: rgba(4, 30, 28, .75); border-bottom: 1px solid var(--line) }
header .in { width: min(820px, 100% - 32px); margin: auto; height: 60px; display: flex; align-items: center; gap: 16px }
header a.brand { display: flex; gap: 10px; align-items: center; color: var(--ink); text-decoration: none; font-family: var(--f-display); font-size: 18px; white-space: nowrap }
header img { width: 36px; height: 36px }
header nav { margin-left: auto; display: flex; gap: 14px; font-size: 14px }
header nav a { color: var(--muted); text-decoration: none }
header nav a:hover, header nav a[aria-current] { color: var(--ink) }
main { width: min(820px, 100% - 32px); margin: 0 auto; padding: 48px 0 30px }
.kicker { font-family: var(--f-num); color: var(--cyan); font-size: 12px; letter-spacing: .2em; text-transform: uppercase }
h1 { font-family: var(--f-display); font-weight: 400; font-size: clamp(30px, 6vw, 48px); line-height: 1.1; margin: 8px 0 6px }
h1 span { background: var(--grad); -webkit-background-clip: text; background-clip: text; color: transparent }
.upd { color: var(--dim); font-size: 14px; margin: 0 0 26px }
.resumo { padding: 18px 20px; border-radius: 18px; background: var(--card); border: 1px solid var(--line-hi); margin-bottom: 30px }
.resumo > b { display: block; font-family: var(--f-display); font-size: 13px; letter-spacing: .06em; margin-bottom: 6px }
.resumo ul { margin: 0; padding-left: 20px; color: var(--muted) }
h2 { font-family: var(--f-display); font-weight: 400; font-size: 22px; margin: 34px 0 8px; scroll-margin-top: 80px }
h2 small { font-family: var(--f-num); color: var(--cyan); font-size: 13px; margin-right: 8px }
p, li { color: var(--muted) }
p b, li b { color: var(--ink) }
ul { padding-left: 22px }
.toc { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 10px }
.toc a { font-size: 13px; text-decoration: none; color: var(--muted); padding: 5px 10px; border: 1px solid var(--line); border-radius: 99px }
.toc a:hover { color: var(--ink); border-color: var(--line-hi) }
footer { width: min(820px, 100% - 32px); margin: 30px auto 0; padding: 22px 0 40px; border-top: 1px solid var(--line); color: var(--dim); font-size: 13px;
  display: flex; flex-wrap: wrap; gap: 10px 20px; justify-content: space-between }
footer a { color: var(--muted); text-decoration: none }
:focus-visible { outline: 2px solid var(--cyan); outline-offset: 3px }
