/* legal.css — shared style for termos / privacidade / licenca */

:root{
  --bg: #0F172A;
  --surface: #1E293B;
  --surface-2: #172033;
  --primary: #DD0031;
  --primary-dark: #C3002F;
  --primary-soft: rgba(221,0,49,.12);
  --accent-text: #FF8DA1;
  --text: #F1F5F9;
  --muted: #94A3B8;
  --border: #334155;
  --border-soft: #243044;
  --r: 12px;
  --r-sm: 8px;
  --maxw: 880px;
  --font: "Aptos", "Inter", "Segoe UI", ui-sans-serif, system-ui, -apple-system, sans-serif;
  --mono: "IBM Plex Mono", "JetBrains Mono", "Cascadia Code", ui-monospace, SFMono-Regular, Menlo, monospace;
}

*{box-sizing:border-box}
html,body{margin:0;padding:0}
html{scroll-behavior:smooth}
body{
  background:var(--bg);color:var(--text);
  font-family:var(--font);font-weight:400;font-size:16px;line-height:1.75;
  -webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;
}
::selection{background:var(--primary);color:#fff}
a{color:var(--text);text-decoration:none}
a:hover{color:var(--accent-text)}
.mono{font-family:var(--mono)}

.wrap{max-width:var(--maxw);margin:0 auto;padding:0 28px}
.wrap-wide{max-width:1200px;margin:0 auto;padding:0 28px}

/* navbar */
.nav{
  position:sticky;top:0;z-index:50;
  background:rgba(15,23,42,.78);
  backdrop-filter:saturate(160%) blur(14px);
  -webkit-backdrop-filter:saturate(160%) blur(14px);
  border-bottom:1px solid var(--border-soft);
}
.nav-inner{display:flex;align-items:center;justify-content:space-between;height:68px}
.brand{display:flex;align-items:center;gap:10px;font-weight:700;font-size:16px;letter-spacing:-.01em}
.brand-mark{
  width:28px;height:28px;border-radius:7px;
  background:linear-gradient(135deg,var(--primary) 0%,var(--primary-dark) 100%);
  display:grid;place-items:center;color:#fff;font-family:var(--mono);font-weight:700;font-size:14px;
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.08);
}
.brand .kodem{color:var(--muted);font-weight:500;font-size:14px}
.btn-back{
  display:inline-flex;align-items:center;gap:8px;
  height:38px;padding:0 14px;border-radius:var(--r-sm);
  font-size:13px;font-weight:600;color:var(--text);
  border:1px solid var(--border);background:transparent;
  transition:border-color 200ms ease;
}
.btn-back:hover{border-color:var(--accent-text);color:#fff}

/* header */
.legal-header{padding:80px 0 48px;border-bottom:1px solid var(--border-soft);background:radial-gradient(700px 200px at 50% -10%, rgba(221,0,49,.05), transparent 60%)}
.legal-header .eyebrow{font-size:12px;font-weight:500;letter-spacing:.16em;text-transform:uppercase;color:var(--accent-text);margin:0 0 16px}
.legal-header h1{
  font-weight:700;color:var(--text);margin:0 0 16px;letter-spacing:-.02em;line-height:1.1;
  font-size:clamp(32px, 4vw, 44px);text-wrap:balance;
}
.legal-header .meta{font-family:var(--mono);font-size:13px;color:var(--muted);letter-spacing:.02em}
.legal-header .meta b{color:var(--text);font-weight:500}

/* article */
.legal-article{padding:48px 0 96px}
.legal-article h2{
  font-size:22px;font-weight:700;letter-spacing:-.01em;color:var(--text);
  margin:48px 0 14px;text-wrap:balance;
}
.legal-article h2 .n{
  display:inline-block;font-family:var(--mono);font-size:13px;color:var(--accent-text);
  font-weight:600;margin-right:10px;letter-spacing:.02em;
}
.legal-article h3{
  font-size:16px;font-weight:600;letter-spacing:-.005em;color:var(--text);
  margin:28px 0 10px;
}
.legal-article p,.legal-article li{color:#CBD5E1;font-size:15.5px;text-wrap:pretty}
.legal-article p{margin:0 0 14px}
.legal-article ul,.legal-article ol{padding-left:0;margin:0 0 18px}
.legal-article li{position:relative;list-style:none;padding-left:24px;margin-bottom:8px}
.legal-article ul li::before{
  content:"";position:absolute;left:0;top:11px;width:6px;height:6px;border-radius:50%;
  background:var(--primary);
}
.legal-article ol{counter-reset:i}
.legal-article ol li::before{
  counter-increment:i;content:counter(i,decimal-leading-zero);
  position:absolute;left:0;top:0;font-family:var(--mono);font-size:11px;color:var(--primary);
  font-weight:600;letter-spacing:.02em;
}
.legal-article strong,.legal-article b{color:var(--text);font-weight:600}
.legal-article code{
  font-family:var(--mono);font-size:13.5px;background:var(--surface-2);
  padding:1px 7px;border-radius:4px;border:1px solid var(--border-soft);
  color:#E2E8F0;
}
.legal-article a{color:var(--accent-text);font-weight:500;border-bottom:1px solid rgba(255,141,161,.45);transition:border-color 200ms,color 200ms}
.legal-article a:hover{border-bottom-color:var(--accent-text)}

.legal-article .callout{
  background:var(--surface);border:1px solid var(--border);border-left:3px solid var(--primary);
  border-radius:var(--r);padding:20px 24px;margin:24px 0;
}
.legal-article .callout p:last-child{margin-bottom:0}
.legal-article .callout .lbl{
  font-family:var(--mono);font-size:11px;color:var(--accent-text);
  text-transform:uppercase;letter-spacing:.14em;margin-bottom:8px;display:block;
}

.legal-toc{
  background:var(--surface);border:1px solid var(--border);border-radius:var(--r);
  padding:20px 24px;margin:24px 0 32px;
}
.legal-toc .lbl{font-family:var(--mono);font-size:11px;color:var(--muted);text-transform:uppercase;letter-spacing:.14em;margin-bottom:12px;display:block}
.legal-toc ol{padding:0;margin:0;counter-reset:tc}
.legal-toc li{list-style:none;padding-left:32px;margin-bottom:6px;position:relative}
.legal-toc li::before{
  counter-increment:tc;content:counter(tc,decimal-leading-zero);
  position:absolute;left:0;top:2px;font-family:var(--mono);font-size:11.5px;color:var(--accent-text);font-weight:600;
}
.legal-toc a{color:#CBD5E1;font-size:14.5px;border-bottom:0}
.legal-toc a:hover{color:var(--accent-text)}

/* footer */
footer{border-top:1px solid var(--border-soft);padding:40px 0 32px;background:rgba(30,41,59,.2);margin-top:32px}
.foot{display:flex;justify-content:space-between;align-items:center;gap:24px;flex-wrap:wrap;font-size:13px;color:var(--muted)}
.foot .links{display:flex;gap:18px;flex-wrap:wrap}
.foot .links a{color:var(--muted);font-size:13px}
.foot .links a:hover{color:var(--text)}
.foot .small{font-family:var(--mono);font-size:11.5px;letter-spacing:.02em}

@media (max-width:640px){
  .legal-header{padding:56px 0 36px}
  .legal-article{padding:36px 0 72px}
  .legal-article h2{margin-top:36px}
}
