/* Shell das páginas legais — MESMO header/footer/tokens da home (extrato do
   CSS inline do index.html; se a home mudar a identidade, atualizar aqui) +
   tipografia do conteúdo legal. */

/* ============ TOKENS (idênticos aos da home) ============ */
:root{
  --blue:#1699e2; --blue-deep:#2563eb; --purple:#7b42f6; --magenta:#ff007c; --amber:#ffb800;
  --grad:linear-gradient(135deg,#1699e2 0%,#7b42f6 50%,#ff007c 100%);
  --grad-soft:linear-gradient(90deg,#1699e2,#7b42f6,#ff007c);
  --bg:#050508; --bg-2:#0a0a10; --surface:#0e0e16; --surface-2:#13131d;
  --text:#f2f3f8; --muted:#9aa0b4; --subtle:#5d6377; --border:#1d1d2b; --border-hi:#2c2c40;
  --sans:'Inter',-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;
  --disp:'Archivo','Inter',-apple-system,sans-serif;
}

/* ============ BASE ============ */
*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth; overflow-x:clip}
body{
  margin:0; overflow-x:clip; font-family:var(--sans); color:var(--text); font-size:16px; line-height:1.65;
  background:
    radial-gradient(900px 560px at 82% -8%, rgba(123,66,246,.14), transparent 62%),
    radial-gradient(700px 480px at 8% 32%, rgba(22,153,226,.09), transparent 60%),
    var(--bg);
  -webkit-font-smoothing:antialiased; text-rendering:optimizeLegibility;
}
h1,h2,h3{margin:0; text-wrap:balance}
p{margin:0}
a{color:inherit}
.container{max-width:1180px; margin-inline:auto; padding-inline:24px}

.btn{display:inline-flex; align-items:center; justify-content:center; gap:10px; height:50px; padding:0 30px; white-space:nowrap;
  border-radius:10px; font:700 14px/1 var(--disp); font-stretch:108%; letter-spacing:.04em; text-decoration:none; cursor:pointer; border:none;
  transition:transform .2s cubic-bezier(.4,0,.2,1), box-shadow .2s, border-color .2s, color .2s}
.btn-grad{background:var(--grad); background-size:180% auto; color:#fff; box-shadow:0 10px 28px rgba(123,66,246,.32)}
.btn-grad:hover{transform:translateY(-2px); background-position:right center; box-shadow:0 14px 34px rgba(123,66,246,.45)}

/* ============ HEADER (idêntico ao da home) ============ */
.hdr{position:sticky; top:0; z-index:50; backdrop-filter:blur(16px); -webkit-backdrop-filter:blur(16px);
  background:rgba(5,5,8,.72); border-bottom:1px solid var(--border)}
.hdr-in{display:flex; align-items:center; gap:34px; height:72px}
.brand{display:inline-flex; align-items:center; gap:11px; text-decoration:none}
.brand .hex{width:30px; height:34px}
.brand .word{font-family:var(--disp); font-weight:800; font-stretch:105%; font-size:21px; letter-spacing:-.02em;
  background:linear-gradient(100deg,#1699e2,#3b82f6 70%,#7b42f6); -webkit-background-clip:text; background-clip:text; color:transparent}
.hdr nav{display:flex; gap:28px; margin-inline:auto}
.hdr nav a{font-size:13.5px; font-weight:600; color:var(--muted); text-decoration:none; transition:color .2s}
.hdr nav a:hover{color:var(--text)}
@media (max-width:860px){ .hdr nav{display:none} }
.hexmark{display:block}

/* ============ CONTEÚDO LEGAL ============ */
.legal{padding:72px 0 96px}
.legal-head{text-align:center; max-width:720px; margin:0 auto 56px}
.legal-head .eyebrow{display:inline-flex; align-items:center; gap:10px; font-family:var(--disp); font-size:11.5px; font-weight:700; font-stretch:115%; letter-spacing:.22em; text-transform:uppercase; color:var(--muted); margin-bottom:18px}
.legal-head .hexdot{width:11px; height:12px; background:var(--grad); clip-path:polygon(50% 0,100% 25%,100% 75%,50% 100%,0 75%,0 25%)}
.legal-head h1{font-family:var(--disp); font-weight:800; font-stretch:114%; font-size:clamp(2.1rem,4.6vw,3.2rem); line-height:1.04; letter-spacing:-.025em}
.legal-head .meta{margin-top:16px; font-size:13px; color:var(--subtle)}
.legal-box{max-width:880px; margin-inline:auto; border:1px solid var(--border); border-radius:16px; background:var(--surface); padding:clamp(24px,5vw,56px)}
.legal-box h2{font-family:var(--disp); font-weight:800; font-stretch:110%; font-size:1.35rem; letter-spacing:-.01em; color:var(--blue); margin:2.4rem 0 1rem}
.legal-box h2:first-child{margin-top:0}
.legal-box h3{font-family:var(--disp); font-weight:700; font-size:1.05rem; color:var(--text); margin:1.6rem 0 .7rem}
.legal-box p{margin-bottom:1.1rem; color:var(--muted)}
.legal-box ul,.legal-box ol{margin:0 0 1.3rem 1.4rem; padding:0; color:var(--muted)}
.legal-box li{margin-bottom:.6rem; line-height:1.6}
.legal-box strong{color:var(--text); font-weight:600}
.legal-box table{width:100%; border-collapse:collapse; margin:0 0 1.4rem; font-size:14.5px}
.legal-box th{font-family:var(--disp); font-size:11px; font-weight:700; letter-spacing:.14em; text-transform:uppercase; color:var(--subtle); text-align:left; padding:10px 14px; border-bottom:1px solid var(--border-hi)}
.legal-box td{padding:11px 14px; border-bottom:1px solid var(--border); color:var(--muted)}
.legal-note{margin-top:2.6rem; padding-top:1.6rem; border-top:1px solid var(--border); text-align:center; font-size:12.5px; color:var(--subtle)}
.legal-back{text-align:center; margin-top:44px}

/* ============ FOOTER (idêntico ao da home) ============ */
footer{border-top:1px solid var(--border); padding:56px 0 40px; background:var(--bg-2)}
.ft{display:grid; grid-template-columns:1.5fr 1fr 1fr; gap:40px}
@media (max-width:760px){ .ft{grid-template-columns:1fr} }
.ft-brand p{font-size:13px; color:var(--subtle); margin-top:14px; max-width:34ch}
.ft h4{font-family:var(--disp); font-size:11px; font-weight:700; font-stretch:112%; letter-spacing:.18em; text-transform:uppercase; color:var(--subtle); margin:0 0 14px}
.ft ul{list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:9px}
.ft a{font-size:13.5px; color:var(--muted); text-decoration:none}
.ft a:hover{color:var(--text)}
.ft li{font-size:13.5px; color:var(--muted)}
.ft-base{margin-top:44px; padding-top:22px; border-top:1px solid var(--border); display:flex; flex-wrap:wrap; gap:12px; justify-content:space-between; font-size:12px; color:var(--subtle)}

@media (prefers-reduced-motion: reduce){
  *,*::before,*::after{animation:none !important; transition:none !important}
  html{scroll-behavior:auto}
}
:focus-visible{outline:2px solid var(--purple); outline-offset:2px; border-radius:6px}