/* ============================================================
   Documentos legais do produto Vinkofy.
   Autossuficiente: reaplica os tokens do DS vinkofy (o :root da
   landing vive inline no index.html, então aqui é redeclarado).
   ============================================================ */
@font-face{font-family:'Ibrand';src:url('../assets/brand/Ibrand.woff2') format('woff2'),url('../assets/brand/Ibrand.woff') format('woff');font-display:swap}

:root{
  --paper:#F3F1EC; --paper-2:#EAE6DF; --surface:#FFFFFF;
  --ink:#2D2A26; --ink-soft:#5F5850; --muted:#8A857D;
  --sage:#7E9887; --sage-deep:#4C7A5C; --bronze:#A88A6D; --bronze-deep:#7A5F45;
  --border:rgba(45,42,38,.10); --border-strong:rgba(45,42,38,.18);
  --shadow-1:0 1px 2px rgba(45,42,38,.05),0 10px 30px -12px rgba(45,42,38,.14);
  --font-head:'Instrument Sans',system-ui,-apple-system,'Segoe UI',sans-serif;
  --font-body:'Onest',system-ui,-apple-system,'Segoe UI',sans-serif;
  --font-mono:'JetBrains Mono',ui-monospace,'SF Mono',Menlo,monospace;
  --radius:22px; --radius-lg:30px;
  --ease-out:cubic-bezier(0.16,1,0.3,1);
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0;color:var(--ink-soft);font-family:var(--font-body);font-size:15px;line-height:1.8;
  -webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;
  background:
    radial-gradient(circle at 50% 0%,rgba(168,138,109,.07),transparent 26%),
    radial-gradient(circle at 10% 30%,rgba(126,152,135,.06),transparent 22%),
    linear-gradient(180deg,#F6F4F0 0%,var(--paper) 40%,#EFECE6 100%);
  background-attachment:fixed;
}
img{display:block;max-width:100%}
.wordmark{font-family:'Ibrand',var(--font-head),sans-serif;text-transform:lowercase;font-weight:400;letter-spacing:.01em}
.mono{font-family:var(--font-mono)}
a{color:var(--sage-deep);text-decoration:underline;text-underline-offset:3px}
a:hover{color:var(--bronze-deep)}
:focus-visible{outline:2px solid var(--bronze-deep);outline-offset:3px;border-radius:4px}

/* ---------- topo ---------- */
.legal-top{position:sticky;top:0;z-index:20;display:flex;align-items:center;justify-content:space-between;gap:14px;
  padding:14px clamp(18px,4vw,40px);
  background:rgba(243,241,236,.82);backdrop-filter:blur(16px) saturate(1.3);-webkit-backdrop-filter:blur(16px) saturate(1.3);
  border-bottom:1px solid var(--border)}
.legal-top .brand{display:flex;align-items:center;gap:12px;text-decoration:none}
.legal-top .brand img{height:30px;width:auto}
.legal-top .brand b{font-family:var(--font-mono);font-weight:500;font-size:.66rem;letter-spacing:.14em;text-transform:uppercase;color:var(--muted)}
.btn-back{font-family:var(--font-head);font-weight:600;font-size:.82rem;color:var(--ink);text-decoration:none;
  padding:9px 16px;border-radius:999px;border:1px solid var(--border-strong);background:var(--surface);
  transition:border-color .18s ease,color .18s ease,transform .18s ease}
.btn-back:hover{border-color:var(--bronze);color:var(--bronze-deep);transform:translateY(-1px)}

/* ---------- artigo ---------- */
.legal{max-width:760px;margin:0 auto;padding:clamp(30px,5vw,64px) clamp(18px,4vw,32px) 90px;position:relative;z-index:1}
.legal .eyebrow{font-family:var(--font-mono);font-size:.7rem;letter-spacing:.22em;text-transform:uppercase;color:var(--bronze-deep);
  display:inline-flex;align-items:center;gap:.7em;margin-bottom:16px}
.legal .eyebrow::before{content:"";width:26px;height:1px;background:var(--bronze)}
.legal h1{font-family:var(--font-head);font-size:clamp(2rem,4.4vw,3rem);font-weight:700;letter-spacing:-.02em;line-height:1.05;color:var(--ink);margin:0 0 .25em}
.legal .updated{font-family:var(--font-mono);font-size:.78rem;color:var(--bronze-deep);margin-bottom:8px}
.legal .lede{color:var(--ink);font-size:1.08rem;line-height:1.7;margin:18px 0 8px}
.legal h2{font-family:var(--font-head);font-size:1.4rem;font-weight:700;letter-spacing:-.01em;color:var(--ink);
  margin:2em 0 .5em;padding-top:.9em;border-top:1px solid var(--border)}
.legal h3{font-family:var(--font-head);font-size:1.08rem;font-weight:600;margin:1.5em 0 .3em;color:var(--sage-deep)}
.legal p{color:var(--ink-soft);line-height:1.8;margin:.6em 0}
.legal ul,.legal ol{margin:.6em 0 .6em 1.3em;color:var(--ink-soft);line-height:1.8}
.legal li{margin:.4em 0}
.legal strong{color:var(--ink)}
.legal .box{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);padding:18px 22px;margin:1.3em 0;box-shadow:var(--shadow-1)}
.legal .box p:first-child{margin-top:0}.legal .box p:last-child{margin-bottom:0}
.legal .todo{background:var(--sage-soft,rgba(126,152,135,.16));border:1px dashed var(--sage);color:var(--sage-deep);
  padding:1px 8px;border-radius:6px;font-family:var(--font-mono);font-size:.82em}

/* tabela de finalidade x base legal */
.legal table{width:100%;border-collapse:collapse;margin:1.1em 0;font-size:.92rem}
.legal th,.legal td{text-align:left;padding:11px 13px;border-bottom:1px solid var(--border);vertical-align:top;color:var(--ink-soft)}
.legal th{font-family:var(--font-mono);font-size:.62rem;letter-spacing:.12em;text-transform:uppercase;color:var(--muted);font-weight:500}
.legal thead th{border-bottom:1px solid var(--border-strong)}

/* rodapé do artigo */
.legal .foot{margin-top:3em;padding-top:1.4em;border-top:1px solid var(--border);color:var(--muted);font-size:.9rem;
  display:flex;flex-wrap:wrap;gap:8px 18px;justify-content:space-between}
.legal .foot a{color:var(--sage-deep)}