:root { color-scheme: light; font-family: Inter, system-ui, sans-serif; color: var(--text-primary); background: var(--surface-alt); }
* { box-sizing: border-box; }
body { margin: 0; line-height: 1.7; }
header, main, footer { padding: 1.5rem clamp(1.25rem, 5vw, 4rem); }
header { display: flex; align-items: center; flex-wrap: wrap; gap: 1rem; justify-content: space-between; border-bottom: 1px solid var(--gray-200); background: var(--surface); }
header .brand { display: inline-flex; align-items: center; gap: 1rem; }
header .brand img { width: 56px; height: auto; flex: none; }
img { max-width: 100%; display: block; }
header a { font-weight: 700; text-decoration: none; }
main { max-width: 64rem; padding-top: 3rem; min-height: 65vh; }
h1, h2 { font-family: 'Bebas Neue', sans-serif; font-weight: 400; text-transform: uppercase; letter-spacing: .06em; line-height: 1.1; }
h1 { font-size: clamp(2rem, 4vw, 3rem); margin: 0 0 1rem; }
h2 { font-size: 2rem; margin: 2rem 0 .75rem; }
a { color: var(--brand-blue-deeper); text-underline-offset: .2em; transition: color var(--duration-fast) var(--ease-smooth); }
a:hover { color: var(--brand-blue-dark); }
a:focus-visible { outline: 3px solid var(--brand-blue-deeper); outline-offset: 3px; }
.etapa { font-weight: 600; }
.nota { color: var(--text-secondary); }
footer { color: var(--white); background: var(--gray-900); }
::selection { background: var(--brand-green); color: var(--gray-900); }
.skip-link { position: absolute; top: -5rem; left: 1rem; background: var(--surface); padding: .75rem; }
.skip-link:focus { top: .5rem; }
@media (prefers-reduced-motion: reduce) { a { transition: none; } }
.login { max-width: 28rem; }
.campo { display: flex; flex-direction: column; gap: .4rem; margin: 1.25rem 0; }
label { font-weight: 600; }
input { font: inherit; color: var(--text-primary); background: var(--surface); border: 1px solid var(--gray-500); border-radius: var(--radius-sm); padding: .65rem .8rem; min-height: 44px; width: 100%; caret-color: var(--brand-blue-deeper); }
input:focus-visible, button:focus-visible { outline: 3px solid var(--brand-blue-deeper); outline-offset: 3px; }
button { font: inherit; font-weight: 600; color: var(--white); background: var(--brand-blue-deeper); border: 1px solid var(--brand-blue-deeper); padding: .65rem 1.5rem; border-radius: var(--radius-full); cursor: pointer; min-height: 44px; }
button:hover { background: var(--brand-blue-dark); }
.secundario { color: var(--brand-blue-deeper); background: var(--surface); }
.secundario:hover { color: var(--white); }
small { font-size: .875rem; color: var(--text-secondary); }
.erro, .field-validation-error { color: var(--status-error); }
.input-validation-error { border-color: var(--status-error); }
.validation-summary-valid { display: none; }
