:root { --ink: #333; --blue: #2da9df; --red: #de272d; --line: #33333329; }
* { box-sizing: border-box; }
body { margin: 0; font: 16px/1.5 Arial, Helvetica, sans-serif; color: var(--ink); background: #fff; }
.trafo-marca { display: flex; align-items: center; gap: 20px; border-bottom: 1px solid var(--line); padding: 4px clamp(16px, 5vw, 60px); }
.trafo-marca img { width: 145px; max-width: 52%; height: auto; }
.trafo-marca span { border-left: 1px solid var(--line); padding-left: 20px; }
main { max-width: 1120px; margin: auto; padding: 24px clamp(16px, 5vw, 48px) 48px; }
a { color: inherit; text-underline-offset: .2em; }
:focus-visible { outline: 3px solid var(--blue); outline-offset: 3px; }
.heading { display: flex; align-items: center; justify-content: space-between; gap: 12px; flex-wrap: wrap; margin: 12px 0 22px; }
h1 { font-size: clamp(32px, 5vw, 48px); font-weight: 500; letter-spacing: -.04em; margin: 0; }
h2 { font-size: 22px; font-weight: 500; margin: 0 0 12px; }
p, dl, dd { margin: 0; }
section { margin-bottom: 28px; }
.button, button { background: var(--red); color: #fff; border: 0; padding: 10px 16px; font: inherit; text-decoration: none; }
form { margin-bottom: 20px; }
form[role="search"] div { display: flex; gap: 8px; margin-top: 6px; }
input { width: min(100%, 390px); min-width: 0; font: inherit; border: 1px solid #777; padding: 8px; }
dl { display: grid; grid-template-columns: repeat(auto-fit, minmax(180px, 1fr)); gap: 15px; border-top: 3px solid var(--blue); padding: 12px 0; }
dt, small { color: #555; font-size: .875rem; }
small { display: block; font-weight: 400; }
.wide { grid-column: 1 / -1; }
.table-wrap { min-width: 0; }
table { width: 100%; border-collapse: collapse; text-align: left; border-top: 3px solid var(--blue); }
th, td { overflow-wrap: anywhere; padding: 12px; border-bottom: 1px solid var(--line); vertical-align: top; }
thead { background: #33333308; }
.tag { display: inline-block; padding: 2px 7px; margin: 0 4px 4px 0; background: #2da9df24; font-size: .875rem; }
.tag.muted { background: #33333310; }
.mobile-label { display: none; }
.autenticacao { max-width: 520px; overflow-wrap: anywhere; }
.autenticacao h1 { margin-bottom: 12px; }
.autenticacao p { margin-bottom: 12px; }
.autenticacao form { margin-top: 16px; }
.autenticacao form div { margin-bottom: 12px; }
.autenticacao label { display: block; margin-bottom: 4px; }
.autenticacao input:not([type="checkbox"]):not([type="radio"]) { width: 100%; }
.autenticacao input[type="checkbox"], .autenticacao input[type="radio"] { width: auto; }
.autenticacao button, .autenticacao .btn-link { display: inline-block; margin: 4px 4px 0 0; }
.autenticacao .btn-secondary { background: var(--ink); }
.autenticacao button:disabled { display: none; }
.autenticacao img, .autenticacao svg { max-width: 100%; height: auto; }
@media (max-width: 640px) {
  table, tbody, tbody tr, tbody th, tbody td { display: block; }
  thead { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); }
  tbody tr { border-bottom: 1px solid var(--line); padding: 12px 0; }
  tbody th, tbody td { border: 0; padding: 3px 0; }
  .mobile-label { display: block; color: #555; font-size: .875rem; }
}