/* Design system do produto — identidade COGNITRIA (navy #0D1B2A + laranja #FF7A00). Tokens consumidos por base.html; brand.css traz os --cg-* das telas novas. */ :root{ --p:#0D1B2A; --pl:#16324F; --pd:#0D1B2A; --a:#FF7A00; --al:#FFA24D; --a-ink:#0D1B2A; /* --a-ink = texto legivel SOBRE o acento (auto-contraste) */ --ink:#0D1B2A; --ink2:#3D4B63; --ink3:#6B7280; --bg:#F2F4F7; --card:#FFFFFF; --line:#E3E7ED; --ok:#0A7F5C; --warn:#9A5B00; --err:#B3261E; --grad:#0D1B2A; --topbar-bg:#0D1B2A; --topbar-ink:#FFFFFF; /* topbar = navy nos dois temas (identidade) */ } /* ---- TEMA ESCURO (tríade preservada: navy vira superfície, "humano" vira texto claro, laranja e cinza continuam; cores com significado mantidas, só mais claras p/ contraste no escuro). Ativado por data-theme="dark" no . ---- */ :root[data-theme="dark"]{ --p:#22344C; --pl:#2C4160; --pd:#0A1119; --a:#FF8C1A; --al:#FFA24D; --a-ink:#0D1B2A; --ink:#E8EDF4; --ink2:#B7C2D2; --ink3:#8B98AB; --bg:#0B1017; --card:#141D29; --line:#293748; --ok:#3FBF8F; --warn:#E0A83A; --err:#F0776C; --grad:#0A1119; --topbar-bg:#0A1119; --topbar-ink:#FFFFFF; } *{box-sizing:border-box} body{margin:0;font-family:'Inter',system-ui,-apple-system,"Segoe UI",Roboto,sans-serif; color:var(--ink);background:var(--bg);line-height:1.55} /* form controls seguem o tema (em claro = branco/navy como antes; em escuro flipam) */ input,textarea,select{font-family:inherit;background:var(--card);color:var(--ink);border-color:var(--line)} input::placeholder,textarea::placeholder{color:var(--ink3)} /* dropdown nativo (option) legivel no escuro */ option{background:var(--card);color:var(--ink)} /* links de navegacao sem classe: laranja escuro (AA no claro; clareia no escuro pelo token). Links com classe definem a propria cor e continuam mandando */ a{color:var(--cg-laranja-escuro)} h1,h2,h3,.logo{font-family:'Poppins','Inter',sans-serif} .topbar{padding:14px 20px;background:var(--topbar-bg);color:var(--topbar-ink)} .logo{font-weight:700;letter-spacing:.04em} .container{max-width:920px;margin:0 auto;padding:32px 20px} .hero h1{font-size:2rem;margin:.2em 0;color:var(--ink)} .tagline{font-size:1.1rem;color:var(--ink2)} .callout{margin-top:24px;padding:16px 18px;background:var(--card); border:1px solid var(--line);border-left:4px solid var(--a);border-radius:12px} .footer{padding:24px 20px;color:var(--ink2);border-top:1px solid var(--line)} @media (max-width:640px){.container{padding:20px 16px}.hero h1{font-size:1.6rem}}