/* ════════════════════════════════════════════════════════════════════ DESIGN SYSTEM · CAMADA 2 — BASE ════════════════════════════════════════════════════════════════════ Reset, elementos HTML crus e utilidades de acessibilidade. Não conhece nenhum componente — só consome tokens (tokens.css). As páginas internas usam (ritmo de leitura maior). ════════════════════════════════════════════════════════════════════ */ *, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; } html { scroll-behavior: smooth; } @media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } * { transition: none !important; animation: none !important; } } body { font-family: var(--font-sans); background: var(--bg); color: var(--text); font-size: var(--fs-body); line-height: var(--lh-body); } body.doc { line-height: var(--lh-doc); } h1, h2, h3, h4 { letter-spacing: var(--ls-tight); line-height: 1.2; } h2 { font-size: var(--fs-h2); font-weight: 800; margin-bottom: 1.5rem; } a { color: var(--accent); text-decoration: underline; text-underline-offset: 3px; } a:hover { color: var(--accent-dark); } a:focus-visible, button:focus-visible { outline: 3px solid var(--accent); outline-offset: 3px; border-radius: 4px; } /* ── Acessibilidade · pular para o conteúdo ── */ .skip-link { position: absolute; left: -9999px; top: 0; z-index: var(--z-skip); background: var(--accent); color: var(--on-accent); padding: 0.8rem 1.4rem; font-weight: 700; text-decoration: none; border-radius: 0 0 var(--radius-sm) 0; } .skip-link:focus { left: 0; } /* ── Rodapé ── */ footer { text-align: center; padding: 2.5rem var(--pad-x); border-top: 1px solid var(--border); color: var(--muted); font-size: 0.9rem; } footer a { color: var(--muted); } footer .license { margin-top: 0.75rem; font-size: 0.78rem; max-width: 56ch; margin-left: auto; margin-right: auto; }