/* Hallmark · shape: Feature Stack (custom, institutional) · genre: modern-minimal · theme: custom (owner asked for a modern institutional look: navy and white, icon blocks, cards, a diagram) · job: try · draw: 7b1b79
 * hero: Stage (text beside the real terminal card) · nav: edge-aligned · footer: index columns · imagery: the product (real terminal output) and one SVG diagram of the real system · signature: the verdict card in the hero
 * axes: light/sans/navy · posture: committed (navy carries the hero and the close) · contrast: pass · fold: pass · v2.0.0 */
/* Hallmark · pre-emit critique: P4 H4 E4 S4 R3 V4 · weakest: R, cards and icons are the convention the owner asked for; kept one card style and one icon set */
:root {
  --space-3xs: 2px; --space-2xs: 4px; --space-xs: 8px; --space-sm: 12px; --space-md: 16px; --space-lg: 24px; --space-xl: 40px; --space-2xl: 64px; --space-3xl: 96px;
  --text-sm: 0.9375rem; --text-md: 1.0625rem; --text-lg: 1.25rem; --text-xl: 1.5rem; --text-section: clamp(1.9rem, 2.2vw + 1rem, 2.75rem); --text-display: clamp(2.4rem, 3.6vw + 1rem, 4rem); --text-lead: clamp(1.125rem, 0.4vw + 1rem, 1.375rem);
  --dur-short: 200ms; --ease-out: cubic-bezier(0.16, 1, 0.3, 1);
  --container: 1200px; --gutter: 32px;
  --color-navy: oklch(28% 0.075 255); --color-navy-2: oklch(22% 0.065 255); --color-navy-3: oklch(38% 0.085 255);
  --color-paper: oklch(99% 0.004 250); --color-paper-2: oklch(96.5% 0.008 250); --color-ink: oklch(20% 0.02 255); --color-ink-2: oklch(38% 0.02 255); --color-muted: oklch(52% 0.02 255);
  --color-rule: oklch(89% 0.01 250); --color-accent: oklch(66% 0.14 70); --color-accent-ink: oklch(18% 0.03 70); --color-green: oklch(55% 0.13 150); --color-red: oklch(55% 0.17 25); --color-on-navy: oklch(97% 0.005 250); --color-focus: oklch(62% 0.16 240);
  --font-display: "Inter Tight", "Inter", system-ui, sans-serif; --font-body: "Inter", system-ui, sans-serif; --font-mono: ui-monospace, "SF Mono", Menlo, Consolas, monospace;
  --radius: 12px; --radius-s: 8px; --shadow: 0 1px 2px oklch(20% 0.02 255 / 0.06), 0 8px 24px oklch(20% 0.02 255 / 0.06);
}
*, *::before, *::after { box-sizing: border-box; }
html, body { overflow-x: clip; }
html { scroll-padding-top: 80px; scroll-behavior: smooth; }
body { margin: 0; background: var(--color-paper); color: var(--color-ink-2); font-family: var(--font-body); font-size: var(--text-md); line-height: 1.6; -webkit-font-smoothing: antialiased; }
h1, h2, h3 { margin: 0; font-family: var(--font-display); font-weight: 700; color: var(--color-ink); line-height: 1.12; letter-spacing: -0.02em; overflow-wrap: break-word; min-width: 0; text-wrap: balance; }
h1 { font-size: var(--text-display); } h2 { font-size: var(--text-section); } h3 { font-size: var(--text-lg); line-height: 1.3; }
p { margin: 0; text-wrap: pretty; } p:not([class]) { max-width: 65ch; }
a { color: inherit; } :focus-visible { outline: 3px solid var(--color-focus); outline-offset: 2px; }
.container { width: 100%; max-width: var(--container); margin-inline: auto; padding-inline: var(--gutter); }
.lead { font-size: var(--text-lead); line-height: 1.5; max-width: 56ch; }
.skip { position: absolute; left: var(--space-md); top: -200px; z-index: 50; padding: var(--space-xs) var(--space-md); background: var(--color-navy); color: var(--color-on-navy); }
.skip:focus-visible { top: var(--space-md); }
.ico { width: 24px; height: 24px; flex-shrink: 0; stroke: currentColor; fill: none; stroke-width: 1.75; stroke-linecap: round; stroke-linejoin: round; }

.btn { display: inline-flex; align-items: center; gap: var(--space-xs); min-height: 48px; padding: 0 var(--space-lg); border: 1px solid var(--color-navy); border-radius: var(--radius-s); background: var(--color-navy); color: var(--color-on-navy); font-family: var(--font-display); font-weight: 600; font-size: var(--text-md); line-height: 1; white-space: nowrap; text-decoration: none; cursor: pointer; transition: background-color var(--dur-short) var(--ease-out), transform var(--dur-short) var(--ease-out); }
.btn:hover { background: var(--color-navy-3); } .btn:active { transform: translateY(1px); }
.btn:disabled { opacity: 0.55; cursor: not-allowed; }
.btn--light { background: var(--color-paper); color: var(--color-navy); border-color: var(--color-paper); } .btn--light:hover { background: var(--color-paper-2); }
.btn--ghost { background: transparent; color: var(--color-on-navy); border-color: oklch(97% 0.005 250 / 0.5); } .btn--ghost:hover { background: oklch(97% 0.005 250 / 0.1); }
@media (prefers-reduced-motion: reduce) { .btn, a, .seg [role="tab"] { transition: none; } html { scroll-behavior: auto; } }

.topbar { background: var(--color-navy-2); color: var(--color-on-navy); font-size: var(--text-sm); }
.topbar .container { display: flex; justify-content: space-between; gap: var(--space-lg); min-height: 36px; align-items: center; }
.nav { position: sticky; top: 0; z-index: 40; background: var(--color-paper); border-bottom: 1px solid var(--color-rule); }
.nav .container { display: flex; align-items: center; justify-content: space-between; min-height: 72px; gap: var(--space-lg); }
.brand { display: flex; align-items: center; gap: var(--space-sm); text-decoration: none; color: var(--color-ink); font-family: var(--font-display); font-weight: 700; font-size: var(--text-lg); }
.brand .mark { width: 36px; height: 36px; border-radius: var(--radius-s); background: var(--color-navy); color: var(--color-on-navy); display: grid; place-items: center; }
.nav ul { display: flex; gap: var(--space-lg); margin: 0; padding: 0; list-style: none; }
.nav li a { text-decoration: none; font-weight: 500; color: var(--color-ink-2); } .nav li a:hover { color: var(--color-navy); text-decoration: underline; }
@media (max-width: 56rem) { .nav ul { display: none; } }

.hero { background: linear-gradient(180deg, var(--color-navy-2), var(--color-navy)); color: var(--color-on-navy); padding-block: var(--space-3xl); }
.hero .container { display: grid; grid-template-columns: minmax(0, 6fr) minmax(0, 6fr); gap: var(--space-2xl); align-items: center; }
.hero h1, .hero .lead { color: var(--color-on-navy); } .hero .lead { opacity: 0.9; }
.hero .text { display: grid; gap: var(--space-lg); }
.hero .acts { display: flex; flex-wrap: wrap; gap: var(--space-sm); }
.card { background: var(--color-paper); color: var(--color-ink); border: 1px solid var(--color-rule); border-radius: var(--radius); box-shadow: var(--shadow); }
.terminal { margin: 0; padding: var(--space-lg); display: grid; gap: var(--space-md); }
.terminal .status { display: inline-flex; align-items: center; gap: var(--space-xs); font-family: var(--font-display); font-weight: 700; font-size: var(--text-xl); color: var(--color-green); }
.terminal pre { margin: 0; padding: var(--space-md); border-radius: var(--radius-s); background: var(--color-navy-2); color: var(--color-on-navy); font-family: var(--font-mono); font-size: 0.875rem; line-height: 1.55; white-space: pre-wrap; overflow-wrap: anywhere; }
.terminal small { color: var(--color-muted); font-size: var(--text-sm); }
@media (max-width: 56rem) { .hero .container { grid-template-columns: minmax(0, 1fr); } }

.section { padding-block: var(--space-3xl); }
.section--tint { background: var(--color-paper-2); }
.section--navy { background: var(--color-navy); color: var(--color-on-navy); }
.section--navy h2, .section--navy .lead, .section--navy p { color: var(--color-on-navy); }
.head { display: grid; gap: var(--space-sm); max-width: 60ch; margin-bottom: var(--space-2xl); }
.head.center { margin-inline: auto; text-align: center; }
.kicker { font-family: var(--font-display); font-weight: 600; color: var(--color-accent-ink); background: oklch(93% 0.06 80); border-radius: 999px; padding: var(--space-2xs) var(--space-sm); font-size: var(--text-sm); width: max-content; }
.head.center .kicker { margin-inline: auto; }

.grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); gap: var(--space-lg); }
.feature { padding: var(--space-lg); display: grid; gap: var(--space-sm); align-content: start; }
.feature .icon { width: 48px; height: 48px; border-radius: var(--radius-s); background: oklch(93% 0.03 255); color: var(--color-navy); display: grid; place-items: center; }
.feature p { max-width: none; }

.diagram { width: 100%; height: auto; display: block; }
.diagram text { font-family: var(--font-body); font-size: 15px; fill: var(--color-ink); }
.diagram .t2 { fill: var(--color-muted); font-size: 13px; }
.diagram .box { fill: var(--color-paper); stroke: var(--color-rule); stroke-width: 1.5; rx: 10; }
.diagram .box--navy { fill: var(--color-navy); stroke: var(--color-navy); }
.diagram .on { fill: var(--color-on-navy); } .diagram .on2 { fill: oklch(90% 0.01 250); font-size: 13px; }
.diagram .arrow { stroke: var(--color-navy-3); stroke-width: 2; fill: none; marker-end: url(#ah); }
.diagram .ah { fill: var(--color-navy-3); }

.seg { display: flex; flex-wrap: wrap; gap: var(--space-xs); margin-bottom: var(--space-lg); }
.seg [role="tab"] { min-height: 44px; padding: 0 var(--space-md); border: 1px solid var(--color-rule); border-radius: 999px; background: var(--color-paper); color: var(--color-ink-2); font-family: var(--font-display); font-weight: 600; font-size: var(--text-sm); cursor: pointer; transition: background-color var(--dur-short) var(--ease-out), color var(--dur-short) var(--ease-out); }
.seg [role="tab"]:hover { background: var(--color-paper-2); }
.seg [role="tab"][aria-selected="true"] { background: var(--color-navy); color: var(--color-on-navy); border-color: var(--color-navy); }
.seg [role="tab"]:disabled { opacity: 0.55; cursor: not-allowed; }
.panel[hidden] { display: none; }
html:not(.js) .panel[hidden] { display: grid !important; margin-top: var(--space-lg); }
.panel { display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); gap: var(--space-lg); align-items: stretch; }
.panel .explain { display: grid; gap: var(--space-sm); padding: var(--space-lg); align-content: start; }
.panel .explain .status { font-family: var(--font-display); font-weight: 700; font-size: var(--text-xl); color: var(--color-green); }
.panel .explain .status.bad { color: var(--color-red); }
.panel pre { margin: 0; padding: var(--space-lg); border-radius: var(--radius); background: var(--color-navy-2); color: var(--color-on-navy); font-family: var(--font-mono); font-size: 0.875rem; line-height: 1.55; white-space: pre-wrap; overflow-wrap: anywhere; }
@media (max-width: 56rem) { .panel { grid-template-columns: minmax(0, 1fr); } }

.today { display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); gap: var(--space-lg); align-items: stretch; }
.zap { margin: 0; padding: var(--space-lg); display: grid; gap: var(--space-xs); border-left: 6px solid var(--color-green); align-content: start; }
.zap b { font-family: var(--font-display); }
.zap p { max-width: none; }
.zap small { color: var(--color-muted); }
.compare { display: grid; gap: var(--space-md); }
.compare .card { padding: var(--space-lg); display: grid; gap: var(--space-xs); }
.compare .card.now { border-color: var(--color-accent); background: oklch(98% 0.02 80); }
.compare h3 { font-size: var(--text-md); color: var(--color-muted); font-weight: 600; }
.compare p { max-width: none; }
@media (max-width: 56rem) { .today { grid-template-columns: minmax(0, 1fr); } }

.limits { display: grid; grid-template-columns: repeat(auto-fit, minmax(300px, 1fr)); gap: var(--space-md); margin: 0; padding: 0; list-style: none; }
.limits li { display: flex; gap: var(--space-md); padding: var(--space-md) var(--space-lg); align-items: flex-start; }
.limits .ico { color: var(--color-red); margin-top: 2px; }
.limits b { display: block; font-family: var(--font-display); color: var(--color-ink); }

.sources { display: grid; grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); gap: var(--space-lg); }
.source { padding: var(--space-lg); display: grid; gap: var(--space-sm); align-content: start; }
.source .domain { font-family: var(--font-mono); font-size: var(--text-sm); color: var(--color-navy); background: oklch(93% 0.03 255); border-radius: 999px; padding: var(--space-2xs) var(--space-sm); width: max-content; }
.source ul { margin: 0; padding-left: 1.1em; }

.plan { width: 100%; border-collapse: collapse; overflow: hidden; border-radius: var(--radius); box-shadow: var(--shadow); background: var(--color-paper); }
.plan th, .plan td { text-align: left; padding: var(--space-md) var(--space-lg); border-bottom: 1px solid var(--color-rule); vertical-align: top; }
.plan thead th { background: var(--color-navy); color: var(--color-on-navy); font-family: var(--font-display); font-weight: 600; font-size: var(--text-sm); }
.plan tbody th { font-family: var(--font-display); font-weight: 700; color: var(--color-ink); white-space: nowrap; }
.plan tr:last-child td, .plan tr:last-child th { border-bottom: 0; }
@media (max-width: 40rem) { .plan thead { display: none; } .plan tr { display: grid; } .plan th, .plan td { border: 0; padding-block: var(--space-2xs); } .plan tr { border-bottom: 1px solid var(--color-rule); padding-block: var(--space-sm); } }

.cta .container { display: grid; grid-template-columns: minmax(0, 7fr) minmax(0, 5fr); gap: var(--space-2xl); align-items: center; }
.cta .acts { display: flex; flex-wrap: wrap; gap: var(--space-sm); margin-top: var(--space-lg); }
.tools { margin: 0; padding: 0; list-style: none; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--space-xs); }
.tools li { font-family: var(--font-mono); font-size: var(--text-sm); padding: var(--space-xs) var(--space-sm); border: 1px solid oklch(97% 0.005 250 / 0.25); border-radius: var(--radius-s); }
@media (max-width: 56rem) { .cta .container { grid-template-columns: minmax(0, 1fr); } }

.footer { background: var(--color-navy-2); color: oklch(88% 0.01 250); padding-block: var(--space-2xl) var(--space-lg); font-size: var(--text-sm); }
.footer .cols { display: grid; grid-template-columns: 2fr 1fr 1fr 1fr; gap: var(--space-xl); }
.footer h3 { color: var(--color-on-navy); font-size: var(--text-md); margin-bottom: var(--space-sm); }
.footer p { max-width: 48ch; }
.footer ul { margin: 0; padding: 0; list-style: none; display: grid; gap: var(--space-xs); }
.footer a { color: inherit; text-decoration: none; } .footer a:hover { text-decoration: underline; }
.footer .legal { margin-top: var(--space-xl); padding-top: var(--space-md); border-top: 1px solid oklch(97% 0.005 250 / 0.15); color: oklch(72% 0.01 250); max-width: none; }
@media (max-width: 56rem) { .footer .cols { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); } }

/* ===== Revisão 10/11/2026: sério e jurídico, com acabamento técnico ===== */
:root{
  --color-navy:#0f2238;--color-navy-2:#0a1828;--color-navy-3:#1d3a5c;--color-on-navy:#f3f1ea;
  --color-paper:#fbfaf6;--color-paper-2:#f3f1ea;--color-ink:#0d1b2a;--color-ink-2:#2b3440;--color-muted:#5e6670;
  --color-rule:#d9d5ca;--color-accent:#8a6a2f;--color-red:#8b1e1e;--color-green:#2f5d3a;
  --font-display:"Source Serif 4",Georgia,serif;--font-body:"IBM Plex Sans",system-ui,sans-serif;--font-mono:"IBM Plex Mono",ui-monospace,Menlo,monospace;
  --radius:0;--radius-s:0;--shadow:none}
body{counter-reset:secao;font-feature-settings:"tnum"}
h1,h2,h3{font-weight:600;letter-spacing:-.01em}
h1{font-weight:600;letter-spacing:-.015em}
.card{border-radius:0!important;box-shadow:none!important;border:1px solid var(--color-rule)}
.topbar{font-family:var(--font-mono);font-size:12px;letter-spacing:.04em;border-bottom:1px solid #ffffff1a}
.brand .mark{border-radius:0;background:none;border:1px solid var(--color-navy);color:var(--color-navy)}
.btn{border-radius:0;font-family:var(--font-body);font-weight:500;letter-spacing:.01em}
.hero{background:var(--color-navy-2) linear-gradient(#ffffff08 1px,transparent 1px) 0 0/100% 32px;border-bottom:3px double var(--color-accent)}
.hero h1{font-size:clamp(2.3rem,3.2vw + 1rem,3.6rem);line-height:1.1}
.hero .card.terminal{background:#0d1d30;border:1px solid #ffffff22;color:var(--color-on-navy)}
.hero .card.terminal *{color:inherit}
.terminal pre,.panel pre{background:#06111d!important;border:1px solid #ffffff14;font-family:var(--font-mono);font-size:13px}
.section{border-top:1px solid var(--color-rule)}
.section--tint{background:var(--color-paper-2)}
.kicker{counter-increment:secao;background:none!important;color:var(--color-accent)!important;padding:0!important;border-radius:0!important;font-family:var(--font-mono);font-size:12px;font-weight:500;letter-spacing:.14em;text-transform:uppercase}
.kicker::before{content:"§ " counter(secao) " · "}
.head h2{padding-bottom:var(--space-md);border-bottom:1px solid var(--color-rule)}
.head.center h2{border-bottom:0}
.feature .icon{background:none;border:1px solid var(--color-rule);border-radius:0;color:var(--color-navy)}
.feature{border-top:3px solid var(--color-navy)}
.status{font-family:var(--font-mono);font-size:12px;letter-spacing:.1em;text-transform:uppercase;border-radius:0!important}
.seg [role="tab"]{border-radius:0!important;font-family:var(--font-mono);font-size:13px}
.source .domain{border-radius:0;background:none;border:1px solid var(--color-rule);font-family:var(--font-mono)}
.plan thead th{font-family:var(--font-mono);font-weight:500;font-size:12px;letter-spacing:.08em;text-transform:uppercase}
.card.now{border-left:3px solid var(--color-accent)}
.card blockquote,.card p q{font-family:var(--font-display)}
.footer{border-top:3px double var(--color-accent);font-family:var(--font-body)}
.diagram rect{rx:0;ry:0}
