/* ONEVERSEC landing v4 (Home v3 · Editorial) — self-hosted. GENERATED by _src/build.py; do not edit by hand. Tokens + head styles + component responsive, extracted so the strict CSP (style-src 'self') never blocks a React-injected <style>. */

/* Geist + Geist Mono — the real .woff2 binaries shipped with the product (apps/console/static/fonts). */
@font-face{font-family:'Geist';src:url('/console/static/landing/assets/fonts/geist-400.woff2') format('woff2');font-weight:400;font-style:normal;font-display:swap}
@font-face{font-family:'Geist';src:url('/console/static/landing/assets/fonts/geist-500.woff2') format('woff2');font-weight:500;font-style:normal;font-display:swap}
@font-face{font-family:'Geist';src:url('/console/static/landing/assets/fonts/geist-600.woff2') format('woff2');font-weight:600;font-style:normal;font-display:swap}
@font-face{font-family:'Geist Mono';src:url('/console/static/landing/assets/fonts/geistmono-400.woff2') format('woff2');font-weight:400;font-style:normal;font-display:swap}
@font-face{font-family:'Geist Mono';src:url('/console/static/landing/assets/fonts/geistmono-500.woff2') format('woff2');font-weight:500;font-style:normal;font-display:swap}

/* ONEVERSEC colour ruler — verbatim from apps/console/static/css/tokens.css (+ --vdp/--verify from app.css :root).
   Blue is the ONLY identity colour. Everything else is functional: it communicates state, not brand.
   Severity and finding-status are DERIVED by code (SeverityDeriver, firewall SPEC-010) — colour only reflects the verdict.
   :root = light. [data-theme="dark"] = dark (the product default; base_public.html SSRs dark on <html>). */
:root {
  /* Surfaces & text */
  --bg: #f5f6f8; --surface: #ffffff; --surface-2: #f7f8fa; --surface-3: #eef0f3;
  --border: #e6e8ec; --border-2: #dcdfe4; --border-strong: #cfd3da;
  --text: #0d1117; --text-2: #3f4754; --text-3: #667085; --muted: #98a0ac;

  /* Accent — the brand */
  --accent: #2563eb; --accent-2: #1d4ed8; --accent-soft: #eef4ff; --accent-line: #c3d9fe; --accent-ink: #1e40af;

  /* Semantic */
  --danger: #b42318; --danger-soft: #fef3f2; --danger-line: #fda29b;
  --warn: #b54708; --warn-soft: #fffaeb; --warn-line: #fedf89;
  --info: #175cd3; --info-soft: #eff8ff; --info-line: #b2ddff;
  --success: #067647; --success-soft: #ecfdf3; --success-line: #a6f4c5;
  --verify: #7c3aed; --verify-soft: #f4effe; --verify-line: #ddd0fb; --verify-ink: #6d28d9;
  --vdp: #2563eb;          /* global blue, fixed — holds even on a route themed orange/purple */
  --signal-live: #00ff5e;  /* neon "live/on": provider connected + active. Same in both themes (signal, not theme). */

  /* Severity — CVSS 4.0 (SPEC-066/075) */
  --sev-critical: #b42318; --sev-critical-soft: #fef3f2; --sev-critical-line: #fda29b;
  --sev-high:     #c4320a; --sev-high-soft:     #fff4ed; --sev-high-line:     #f9b98a;
  --sev-medium:   #b54708; --sev-medium-soft:   #fffaeb; --sev-medium-line:   #fedf89;
  --sev-low:      #175cd3; --sev-low-soft:      #eff8ff; --sev-low-line:      #b2ddff;
  --sev-info:     #667085; --sev-info-soft:     #f7f8fa; --sev-info-line:     #dcdfe4;

  /* Finding status — orthogonal to severity (SPEC-084) */
  --st-exploited: #b42318; --st-exploited-soft: #fef3f2;
  --st-escalating: #2563eb; --st-escalating-soft: #eef4ff;
  --st-pending: #b54708; --st-pending-soft: #fffaeb;
  --st-filtered: #98a0ac; --st-filtered-soft: #f7f8fa;

  /* Terminal — the live hunt audit */
  --term-bg: #f6f8fa; --term-fg: #24292f; --term-green: #0a7d55;
  --term-warn: #b54708; --term-err: #b42318; --term-gutter: #4b5563; --term-muted: #667085;

  /* Charts — categorical, derived from the brand blue */
  --chart-1: #2563eb; --chart-2: #7c3aed; --chart-3: #0891b2; --chart-4: #059669;
  --chart-5: #d97706; --chart-6: #dc2626; --chart-7: #db2777; --chart-8: #64748b;
  --chart-grid: var(--border); --chart-axis: var(--text-3);
}

:root[data-theme="dark"] {
  --bg: #000000; --surface: #0b0e12; --surface-2: #141a22; --surface-3: #1d2631;
  --border: #11181f; --border-2: #11181f; --border-strong: #11181f;
  --text: #e8ebef; --text-2: #aab2bd; --text-3: #7b8593; --muted: #5c6673;
  --accent: #5c9bff; --accent-2: #78adff; --accent-soft: #0f1e33; --accent-line: #23406b; --accent-ink: #a9caff;
  --danger: #f97066; --danger-soft: #2a1512; --danger-line: #5c2a24;
  --warn: #fdb022; --warn-soft: #2a2010; --warn-line: #5a4418;
  --info: #53b1fd; --info-soft: #10233a; --info-line: #1a3a5c;
  --success: #47cd89; --success-soft: #0d2a1c; --success-line: #1f5c3d;
  --verify: #a78bfa; --verify-soft: #1a1330; --verify-line: #3b2d63; --verify-ink: #c4b5fd;
  --vdp: #5c9bff;
  --signal-live: #00ff5e;

  --sev-critical: #f97066; --sev-critical-soft: #2a1512; --sev-critical-line: #5c2a24;
  --sev-high:     #f79256; --sev-high-soft:     #2a1a10; --sev-high-line:     #5c3a1f;
  --sev-medium:   #fdb022; --sev-medium-soft:   #2a2010; --sev-medium-line:   #5a4418;
  --sev-low:      #53b1fd; --sev-low-soft:      #10233a; --sev-low-line:      #1a3a5c;
  --sev-info:     #7b8593; --sev-info-soft:     #191e24; --sev-info-line:     #2f3742;

  --st-exploited: #f97066; --st-exploited-soft: #2a1512;
  --st-escalating: #5c9bff; --st-escalating-soft: #0f1e33;
  --st-pending: #fdb022; --st-pending-soft: #2a2010;
  --st-filtered: #5c6673; --st-filtered-soft: #191e24;

  --term-bg: #05070a; --term-fg: #c9d1d9; --term-green: #34e39b;
  --term-warn: #fdb022; --term-err: #f97066; --term-gutter: #4b5563; --term-muted: #7b8593;

  --chart-1: #5c9bff; --chart-2: #a78bfa; --chart-3: #22d3ee; --chart-4: #34d399;
  --chart-5: #fbbf24; --chart-6: #f87171; --chart-7: #f472b6; --chart-8: #94a3b8;
  --chart-grid: var(--border); --chart-axis: var(--text-3);
}

/* Type ruler. Geist for everything human; Geist Mono for machine speech — commands, telemetry,
   IDs, CVSS vectors, eyebrows, badges, timestamps. Never introduce a size outside this ramp. */
:root {
  --font: 'Geist', -apple-system, ui-sans-serif, system-ui, 'Segoe UI', sans-serif;
  --font-mono: 'Geist Mono', 'IBM Plex Mono', ui-monospace, 'SFMono-Regular', monospace;

  --fs-2xs: 10.5px; --fs-xs: 12px; --fs-sm: 13px; --fs-base: 14px; --fs-md: 15px;
  --fs-lg: 18px; --fs-xl: 20px; --fs-2xl: 24px; --fs-3xl: 27px;

  --lh-tight: 1.25; /* @kind other */ --lh-normal: 1.55; /* @kind other */ --lh-relaxed: 1.62; /* @kind other */
  --fw-regular: 400; /* @kind font */ --fw-medium: 500; /* @kind font */ --fw-semibold: 600; /* @kind font */

  /* Marketing display sizes — fluid, only used on public surfaces */
  --fs-display: clamp(28px, 3.8vw, 42px); /* @kind font */
  --fs-h2: clamp(20px, 2.5vw, 27px); /* @kind font */
  --ls-display: -.03em; /* @kind font */ --ls-h2: -.02em; /* @kind font */ --ls-tight: -.015em; /* @kind font */
}

/* Spacing + radius. Use the token, never the raw px. */
:root {
  --sp-1: 4px; --sp-2: 8px; --sp-3: 12px; --sp-4: 16px; --sp-2h: 20px;
  --sp-5: 24px; --sp-6: 36px; --sp-7: 48px; --sp-8: 64px;

  --r-sm: 4px; --r: 6px; --r-md: 8px; --r-lg: 10px; --r-full: 999px;
  /* Marketing surfaces run softer than the console: cards 14–16px, panels 18px, the final CTA 20px. */
  --r-mkt: 14px; --r-mkt-lg: 16px; --r-mkt-xl: 18px; --r-mkt-2xl: 20px;

  --wrap: 1140px;          /* public page max-width (.lp-wrap) */
  --wrap-foot: 1080px;     /* footer inner */
  /* public section rhythm */ --section-y: 84px; /* @kind spacing */
}

/* Shadows, scrim, z-index. Console elevation is almost flat — borders do the work.
   Marketing adds one long, low-opacity glow drop under primary CTAs and product cards. */
:root {
  --sh-sm: 0 1px 2px rgba(16,24,40,.05);
  --sh: 0 1px 2px rgba(16,24,40,.06), 0 1px 3px rgba(16,24,40,.04);
  --sh-md: 0 2px 4px rgba(16,24,40,.06), 0 4px 12px rgba(16,24,40,.05);
  --sh-lg: 0 8px 24px rgba(16,24,40,.10), 0 2px 6px rgba(16,24,40,.06);
  --sh-btn: 0 1px 2px rgba(30,64,175,.24), inset 0 1px 0 rgba(255,255,255,.08);
  --sh-term: 0 30px 80px -34px rgba(0,0,0,.55);
  --scrim: rgba(6,9,12,.5);
  --z-appbar: 20; /* @kind other */ --z-nav: 30; /* @kind other */ --z-scrim: 55; /* @kind other */ --z-drawer: 60; /* @kind other */ --z-dialog: 70; /* @kind other */ --z-toast: 80; /* @kind other */
}
:root[data-theme="dark"] {
  --sh-sm: 0 1px 2px rgba(0,0,0,.3);
  --sh: 0 1px 2px rgba(0,0,0,.35), 0 1px 3px rgba(0,0,0,.3);
  --sh-md: 0 2px 4px rgba(0,0,0,.4), 0 6px 16px rgba(0,0,0,.35);
  --sh-lg: 0 12px 32px rgba(0,0,0,.5), 0 4px 10px rgba(0,0,0,.4);
  --sh-btn: 0 1px 2px rgba(0,0,0,.4), inset 0 1px 0 rgba(255,255,255,.06);
  --scrim: rgba(0,0,0,.6);
}

/* Motion is feedback, never decoration. Two easings only: the console's short ease-out and the
   marketing reveal's longer decelerate. Everything honours prefers-reduced-motion. */
:root {
  --dur-fast: 120ms; /* @kind other */ --dur: 160ms; /* @kind other */ --dur-slow: 220ms; /* @kind other */
  /* UI state change */ --ease: cubic-bezier(.22,.61,.36,1); /* @kind other */
  /* marketing enter/decelerate */ --lp-ease: cubic-bezier(.22,1,.36,1); /* @kind other */
  /* scroll reveal */ --lp-dur: .55s; /* @kind other */
  --glow: color-mix(in srgb, var(--accent) 55%, transparent);
}
@media (prefers-reduced-motion: reduce) {
  :root { --dur-fast: 0ms; /* @kind other */ --dur: 0ms; /* @kind other */ --dur-slow: 0ms; /* @kind other */ }
}

/* Product accents. The umbrella brand is blue; each product carries one accent used for its logo
   tint, card rule and link colour only — never for a whole surface. RAGE orange · FUSION purple ·
   GUARD amber. Values from landing.css (.lp --pc-*) and app.css (.nav .group .gdot). */
:root {
  --pc-rage: #f97316; --pc-fusion: #a855f7; --pc-guard: #f59e0b;
  --pc-rage-strong: #ff5024;
}
:root[data-theme="dark"] {
  --pc-rage: #ff5024; --pc-fusion: #c084fc; --pc-guard: #fbbf24;
}
/* Route-level product theming: setting data-product on a container repoints --accent so every
   descendant button, focus ring and badge follows the product colour with no per-component work. */
[data-product="eversec-rage"]   { --accent: var(--pc-rage);   --accent-2: #c2410c; --accent-soft: color-mix(in srgb, var(--pc-rage) 12%, var(--surface)); --accent-line: color-mix(in srgb, var(--pc-rage) 35%, var(--surface)); --accent-ink: var(--pc-rage); }
[data-product="eversec-fusion"] { --accent: var(--pc-fusion); --accent-2: #7c3aed; --accent-soft: color-mix(in srgb, var(--pc-fusion) 12%, var(--surface)); --accent-line: color-mix(in srgb, var(--pc-fusion) 32%, var(--surface)); --accent-ink: var(--pc-fusion); }
[data-product="eversec-ops"]  { --accent: var(--pc-guard);  --accent-2: #b45309; --accent-soft: color-mix(in srgb, var(--pc-guard) 12%, var(--surface)); --accent-line: color-mix(in srgb, var(--pc-guard) 35%, var(--surface)); --accent-ink: var(--pc-guard); }

/* Tema de rota: quando o produto é aplicado no próprio <html>, precisa vencer
   :root[data-theme="dark"] (0,2,0). Daí o seletor duplo. */
:root[data-theme="light"][data-product="eversec-rage"],   :root[data-theme="dark"][data-product="eversec-rage"]   { --accent: var(--pc-rage);   --accent-2: #c2410c; --accent-soft: color-mix(in srgb, var(--pc-rage) 14%, var(--surface)); --accent-line: color-mix(in srgb, var(--pc-rage) 38%, var(--surface)); --accent-ink: var(--pc-rage); }
:root[data-theme="light"][data-product="eversec-fusion"], :root[data-theme="dark"][data-product="eversec-fusion"] { --accent: var(--pc-fusion); --accent-2: #7c3aed; --accent-soft: color-mix(in srgb, var(--pc-fusion) 14%, var(--surface)); --accent-line: color-mix(in srgb, var(--pc-fusion) 35%, var(--surface)); --accent-ink: var(--pc-fusion); }
:root[data-theme="light"][data-product="eversec-ops"],  :root[data-theme="dark"][data-product="eversec-ops"]  { --accent: var(--pc-guard);  --accent-2: #b45309; --accent-soft: color-mix(in srgb, var(--pc-guard) 14%, var(--surface)); --accent-line: color-mix(in srgb, var(--pc-guard) 38%, var(--surface)); --accent-ink: var(--pc-guard); }

/* Minimal element defaults shared by every ONEVERSEC surface. No component styling lives here. */
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--bg);color:var(--text);font-family:var(--font);font-size:var(--fs-base);line-height:var(--lh-normal);-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}
h1,h2,h3,h4{margin:0;font-weight:var(--fw-semibold);letter-spacing:var(--ls-tight);line-height:var(--lh-tight);color:var(--text)}
p{margin:0}
a{color:var(--accent);text-decoration:none}
a:hover{color:var(--accent-2);text-decoration:underline}
:focus-visible{outline:2px solid var(--accent);outline-offset:2px;border-radius:3px}
code,kbd,pre,samp{font-family:var(--font-mono)}
::selection{background:var(--accent-soft);color:var(--accent-ink)}
.sr-only{position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}


/* -- index head styles -- */

:root{--ink:#06070a;--ink-2:#0a0c10;--ink-3:#0e1116;--hair:#161a21;--hair-2:#1e232b}
/* Acento = azul-marca FIXO (tokens/colors.css). A home NÃO repinta a página pelo produto em
   foco: cada produto carrega a própria cor só no respectivo card (var(--pc-*)), nunca no tema global. */
html{scroll-behavior:smooth;background:var(--ink)}
body{margin:0;background:var(--ink);overflow-x:clip}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}}
.mono{font-family:var(--font-mono)}
img{max-width:100%}

/* ── estrutura editorial ───────────────────────────────────────────────── */
.band{position:relative;padding:clamp(40px,5.5vw,72px) 0;min-width:0}
.band--tight{padding:clamp(28px,4vw,52px) 0}
.gut{max-width:1320px;margin:0 auto;padding:0 clamp(20px,4.5vw,64px);min-width:0}
.hair{height:1px;background:var(--hair);border:0;margin:0}

/* índice de seção na margem — marcador técnico, não navegação */
.idx{display:flex;align-items:baseline;gap:14px;margin-bottom:clamp(20px,3vw,34px)}
.idx-n{font-family:var(--font-mono);font-size:10.5px;letter-spacing:.2em;color:var(--accent)}
.idx-l{font-family:var(--font-mono);font-size:10.5px;letter-spacing:.2em;text-transform:uppercase;color:var(--text-3)}
.idx-r{flex:1;height:1px;background:var(--hair);transform:translateY(-3px)}
/* variante centralizada: "08. — RÓTULO", com filete curto de cada lado */
.idx--c{justify-content:center}
.idx--c .idx-r{display:none}
.idx--c::before,.idx--c::after{content:"";width:clamp(18px,4vw,44px);height:1px;background:var(--hair-2);align-self:center}

/* ── família de cards ─────────────────────────────────────────────────── */
/* célula de métrica: sem raio, filete de grade, ponto colorido no rótulo */
.c-stat{padding:clamp(18px,2.2vw,26px) clamp(14px,1.8vw,22px);border-right:1px solid var(--hair-2);border-bottom:1px solid var(--hair-2)}
.c-stat .lbl{display:flex;align-items:center;gap:8px;font-family:var(--font-mono);font-size:9.5px;letter-spacing:.18em;text-transform:uppercase;color:var(--text-3)}
.c-stat .lbl i{width:5px;height:5px;border-radius:50%;background:var(--accent);flex:none}
.c-stat .num{font-size:clamp(26px,3.2vw,40px);font-weight:600;letter-spacing:-.04em;line-height:1;margin-top:14px;color:var(--text)}

/* card de feature: mockup no topo, texto embaixo, borda que acende no hover */
.c-feat{background:var(--ink-2);border:1px solid var(--hair-2);border-radius:18px;overflow:hidden;display:flex;flex-direction:column;transition:border-color 240ms var(--ease),transform 240ms var(--lp-ease)}
.c-feat:hover{border-color:color-mix(in srgb,var(--accent) 40%,transparent);transform:translateY(-3px)}
.c-feat .vis{padding:clamp(18px,2.2vw,26px);background:linear-gradient(180deg,color-mix(in srgb,var(--accent) 7%,transparent),transparent 70%);border-bottom:1px solid var(--hair)}
.c-feat .txt{padding:clamp(18px,2.2vw,26px)}

/* card FAQ: barra de acento à esquerda, o aberto ganha anel */
.c-faq{border:1px solid var(--hair-2);border-radius:14px;background:var(--ink-2);overflow:hidden;position:relative;transition:border-color 240ms var(--ease),box-shadow 240ms var(--ease)}
.c-faq::before{content:"";position:absolute;left:0;top:0;bottom:0;width:2px;background:var(--accent);opacity:.28;transition:opacity 240ms var(--ease)}
.c-faq[data-on="1"]{border-color:color-mix(in srgb,var(--accent) 48%,transparent);box-shadow:0 0 0 1px color-mix(in srgb,var(--accent) 22%,transparent),0 18px 46px -28px var(--glow)}
.c-faq[data-on="1"]::before{opacity:1}

/* arcos concêntricos do hero */
.arcs{position:absolute;left:50%;top:-18%;width:min(1500px,150vw);aspect-ratio:1;transform:translateX(-50%);pointer-events:none;opacity:.5}
.arcs i{position:absolute;inset:0;margin:auto;border-radius:50%;border:1px solid color-mix(in srgb,var(--accent) 26%,transparent)}


/* tipografia display */
.d1{font-size:100px;line-height:.96;letter-spacing:-.038em;font-weight:600;margin:0;text-wrap:balance}
.d2{font-size:40px;line-height:1.06;letter-spacing:-.032em;font-weight:600;margin:0;text-wrap:balance}
.d3{font-size:40px;line-height:1.06;letter-spacing:-.032em;font-weight:600;margin:0}
.ghost{color:transparent;-webkit-text-stroke:1.5px var(--muted);text-stroke:1.5px var(--muted)}
.dim{color:var(--muted)}
.body{font-size:clamp(15px,1.15vw,16.5px);line-height:1.68;color:var(--text-2);margin:0}
.small{font-size:13.5px;line-height:1.6;color:var(--text-3);margin:0}

/* superfícies */
.srf{background:var(--ink-2);border:1px solid var(--hair-2);border-radius:16px}
.srf-2{background:var(--ink-3);border:1px solid var(--hair-2);border-radius:12px}
.bracket{position:relative}
.bracket::before,.bracket::after{content:"";position:absolute;width:12px;height:12px;border-color:var(--accent);opacity:.55}
.bracket::before{top:-1px;left:-1px;border-top:1px solid;border-left:1px solid}
.bracket::after{bottom:-1px;right:-1px;border-bottom:1px solid;border-right:1px solid}

/* continuidade: a composição sangra e dissolve na banda seguinte */
.bleed{position:relative;overflow:visible}
.fade-b{-webkit-mask-image:linear-gradient(180deg,#000 62%,transparent 100%);mask-image:linear-gradient(180deg,#000 62%,transparent 100%)}
.fade-r{-webkit-mask-image:linear-gradient(90deg,#000 66%,transparent 100%);mask-image:linear-gradient(90deg,#000 66%,transparent 100%)}

/* botões */
.b1{display:inline-flex;align-items:center;justify-content:center;gap:8px;height:42px;padding:0 22px;border-radius:6px;background:var(--accent);color:#06101f;font-size:14px;font-weight:600;text-decoration:none;border:1px solid transparent;transition:transform 140ms var(--ease),box-shadow 140ms var(--ease)}
.b1:hover{transform:translateY(-1px);box-shadow:0 12px 34px -12px var(--glow);color:#06101f;text-decoration:none}
.b2{display:inline-flex;align-items:center;justify-content:center;gap:8px;height:42px;padding:0 22px;border-radius:6px;background:transparent;color:var(--text);font-size:14px;font-weight:600;text-decoration:none;border:1px solid var(--hair-2);transition:background 140ms var(--ease),border-color 140ms var(--ease)}
.b2:hover{background:var(--ink-3);border-color:#2b323c;color:var(--text);text-decoration:none}
.b1:active,.b2:active{transform:scale(.97)}

/* reveal */
.rv{opacity:0;transform:translateY(20px);transition:opacity .7s var(--lp-ease),transform .7s var(--lp-ease)}
.rv.in{opacity:1;transform:none}
@media (prefers-reduced-motion:reduce){.rv{opacity:1;transform:none;transition:none}}

/* ── responsividade global: grades fluidas + três degraus ─────────────── */
/* desktop menor (1280–1024): reduz calhas e colunas de 4 → 2 */
@media (max-width:1280px){
  .gut{padding:0 clamp(18px,3.5vw,40px)}
  .band{padding:clamp(36px,5vw,64px) 0}
}
@media (max-width:1080px){
  .st-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important}
  .in-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important}
  .sh-g{grid-template-columns:repeat(2,minmax(0,1fr))!important}
  .sf-grid{grid-template-columns:repeat(3,minmax(0,1fr))!important;gap:12px}
}
/* tablet */
@media (max-width:900px){
  .sf-grid,.pr-grid,.pb-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important}
  .d1{font-size:clamp(28px,7vw,44px)}
  .d2{font-size:clamp(22px,5vw,32px)}
}
/* mobile: coluna única em tudo que ainda for múltiplo */
@media (max-width:680px){
  .st-grid,.in-grid,.sh-g,.sf-grid,.pr-grid,.pb-grid,.cmp-row,.hd-kpi{grid-template-columns:1fr!important}
  .c-stat{border-right:0!important;padding-left:0!important;padding-right:0!important}
  .band{padding:clamp(32px,8vw,52px) 0}
  .gut{padding:0 18px}
  .idx--c::before,.idx--c::after{width:14px}
  .c-feat{border-radius:14px}
}

a{color:var(--accent)}a:hover{color:var(--accent-2)}
*{min-width:0}


/* -- component responsive (extracted from <style> blocks) -- */
@media(max-width:820px){.cmp2{grid-template-columns:1fr!important}}
@media(max-width:860px){.nav-l{display:none!important}.nav-b{display:inline-flex!important}}
@media(max-width:560px){.cta{flex-direction:column}.cta>a{width:100%}}
@media(max-width:940px){.co-g,.mvv-g{grid-template-columns:1fr!important}}@media(max-width:680px){.val-g{grid-template-columns:1fr!important}}
@media(max-width:1080px){.pb-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important}.pb-grid>div{margin-top:0!important}}@media(max-width:940px){.pb-head{grid-template-columns:1fr!important}}@media(max-width:620px){.pb-grid{grid-template-columns:1fr!important}}
@media(max-width:980px){.cy-body{grid-template-columns:1fr!important}.cy-head{grid-template-columns:1fr!important}}
@media(max-width:700px){.fw-row{grid-template-columns:1fr!important}.fw-row>span:first-child{text-align:left!important}}
@media(max-width:940px){.sf-head{grid-template-columns:1fr!important}}@media(max-width:820px){.sf-grid{grid-template-columns:1fr!important}}
@media(max-width:820px){.pp-head{grid-template-columns:1fr!important}.pp-grid{grid-template-columns:1fr!important}}
@media(max-width:960px){.en-g{grid-template-columns:repeat(2,minmax(0,1fr))!important}.en-g>div:first-child{grid-column:span 2!important}}@media(max-width:620px){.en-g{grid-template-columns:1fr!important}.en-g>div:first-child{grid-column:span 1!important}}
@media(max-width:760px){.bt-g{grid-template-columns:1fr!important}}
@media(max-width:1100px){.rg-num{grid-template-columns:repeat(3,minmax(0,1fr))!important}.rg-num>div:nth-child(3n){border-right:0!important}.rg-num>div{padding-left:clamp(14px,1.8vw,22px)!important}.rg-num>div:nth-child(3n+1){padding-left:0!important}}@media(max-width:940px){.rg-head,.rg-deep,.rg-eh{grid-template-columns:1fr!important}.rg-head>div:last-child{border-left:0!important;padding-left:0!important}.sy-g{grid-template-columns:repeat(2,minmax(0,1fr))!important}.sy-g>div:nth-child(2n){border-right:0!important}.sy-g>div{padding-left:clamp(16px,2vw,26px)!important}.sy-g>div:nth-child(2n+1){padding-left:0!important}}@media(max-width:640px){.rg-num,.sy-g{grid-template-columns:1fr!important}.rg-num>div,.sy-g>div{border-right:0!important;padding-left:0!important}}
@media(max-width:900px){.plat-g{grid-template-columns:repeat(2,minmax(0,1fr))!important}}@media(max-width:560px){.plat-g{grid-template-columns:1fr!important}}
@media(max-width:700px){.ops-g{grid-template-columns:1fr!important}}
@media(max-width:700px){.fw-bar{display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr))!important}}
@media(max-width:820px){.sf-g,.hx-g{grid-template-columns:1fr!important}}
@media(max-width:860px){.wip-g{grid-template-columns:1fr!important}}
@media(max-width:860px){.ent-g{grid-template-columns:1fr!important}.ent-items{grid-template-columns:1fr!important}}
@media(max-width:1000px){.st-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important}}@media(max-width:940px){.st-head{grid-template-columns:1fr!important}.st-head>div:last-child{border-left:0!important;padding-left:0!important}}@media(max-width:620px){.st-grid{grid-template-columns:1fr!important}.st-proof{grid-template-columns:1fr!important}}
@media(max-width:940px){.in-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important}.in-head{grid-template-columns:1fr!important}}@media(max-width:620px){.in-grid{grid-template-columns:1fr!important}}
@media(max-width:900px){.df-g{grid-template-columns:1fr!important}}
@media(max-width:940px){.pr-grid{grid-template-columns:1fr!important;max-width:460px;margin-left:auto;margin-right:auto}}
@media(max-width:820px){.fo-g{grid-template-columns:1fr!important}}
@media(max-width:860px){.ca-g{grid-template-columns:1fr!important}}
@media(max-width:1000px){.ft-top{grid-template-columns:repeat(3,minmax(0,1fr))!important}.ft-top>div:first-child{grid-column:1/-1}}@media(max-width:900px){.ct-g{grid-template-columns:1fr!important}}@media(max-width:860px){.ft-inner{grid-template-columns:1fr!important;gap:28px!important}.ft-cols{grid-template-columns:repeat(2,minmax(0,1fr))!important}}@media(max-width:560px){.ft-bottom{flex-direction:column;gap:8px}}@media(max-width:620px){.ft-top{grid-template-columns:repeat(2,minmax(0,1fr))!important}}
@media(max-width:640px){.cp-head{grid-template-columns:1fr!important}}

/* -- tema light (o v4 fixa --ink dark inline; aqui vira theme-aware p/ o toggle funcionar; dark = exato) -- */
:root{--ink:#f4f6f9;--ink-2:#ffffff;--ink-3:#f1f3f6;--hair:#e6e8ec;--hair-2:#d7dbe1}
:root[data-theme="dark"]{--ink:#000000;--ink-2:#07080A;--ink-3:#07080A;--hair:#101317;--hair-2:#101317}
/* -- mobile: hero h1 (Never Miss a Vuln) bem maior -- */
@media(max-width:900px){.d1{font-size:clamp(46px,14vw,80px)!important}}
@media(max-width:560px){.d1{font-size:clamp(30px,11vw,64px)!important;overflow-wrap:anywhere}}
/* -- controles extras da nav (tema/idioma/console/avatar) na margem do v4 -- */
.nav-ctl{display:inline-flex;align-items:center;justify-content:center;width:40px;height:40px;border-radius:8px;border:1px solid var(--hair-2);background:transparent;color:var(--text-2);cursor:pointer;text-decoration:none;transition:background 160ms var(--ease),border-color 160ms var(--ease),color 160ms var(--ease);flex:none}
.nav-ctl:hover{background:var(--ink-3);color:var(--text);border-color:#2b323c}
.nav-ctl svg{width:19px;height:19px}
.theme-toggle .i-sun{display:none}
:root[data-theme="dark"] .theme-toggle .i-moon{display:none}
:root[data-theme="dark"] .theme-toggle .i-sun{display:block}
.lang-flag{width:auto;gap:7px;padding:0 11px;font-family:var(--font-mono);font-size:11px;letter-spacing:.04em;color:var(--text-3)}
.lang-flag svg{width:20px;height:14px;border-radius:2px}
.nav-av{width:34px;height:34px;border-radius:50%;overflow:hidden;border:1px solid var(--hair-2);padding:0}
.nav-av img{width:100%;height:100%;object-fit:cover;display:block}
/* botão Console: invertido por tema (dark = branco/escuro; light = escuro/branco) */
.nav-console-btn{display:inline-flex;align-items:center;height:38px;padding:0 16px;border-radius:8px;font-size:13.5px;font-weight:600;text-decoration:none;border:1px solid transparent;background:#0d1117;color:#fff;transition:opacity 160ms var(--ease)}
:root[data-theme="dark"] .nav-console-btn{background:#ffffff;color:#0a0c10}
.nav-console-btn:hover{opacity:.88}
@media(max-width:860px){nav .b1,nav .b2{display:none!important}}
/* mobile: Console fica visível e legível (não espremer); avatar sai (redundante, o botão já vai pra /console) */
@media(max-width:860px){.nav-av{display:none!important}.nav-console-btn{flex:none}}
@media(max-width:480px){.lang-flag span{display:none}.lang-flag{padding:0 9px}}

/* -- Suporte flutuante (mesmo widget do console; aqui com tokens v4 + tema light/dark) -- */
.support-wrap{position:fixed;right:22px;bottom:22px;z-index:55}
.support-fab{width:54px;height:54px;border-radius:50%;border:none;cursor:pointer;display:grid;place-items:center;background:var(--accent);color:#fff;box-shadow:0 8px 24px rgba(0,0,0,.28),0 2px 6px rgba(0,0,0,.18);transition:transform 140ms var(--ease),box-shadow 140ms var(--ease)}
.support-fab:hover{transform:translateY(-2px);box-shadow:0 12px 30px rgba(0,0,0,.34)}
.support-fab svg{width:24px;height:24px}
.support-fab .i-close{display:none}
.support-fab.is-open .i-open{display:none}
.support-fab.is-open .i-close{display:block}
.support-panel{position:absolute;right:0;bottom:66px;width:320px;max-width:calc(100vw - 44px);background:var(--ink-2);border:1px solid var(--hair);border-radius:14px;box-shadow:0 18px 50px rgba(0,0,0,.45);overflow:hidden;animation:sp-in 150ms var(--ease)}
@keyframes sp-in{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}
.sp-head{padding:15px 16px 12px;background:linear-gradient(135deg,var(--accent),color-mix(in srgb,var(--accent) 68%,#1e3a8a));color:#fff}
.sp-title{font-size:15px;font-weight:650}
.sp-sub{font-size:12px;opacity:.9;margin-top:2px}
.sp-body{padding:13px 14px 14px;display:flex;flex-direction:column;gap:9px}
.sp-chan{display:flex;align-items:center;gap:11px;padding:9px 11px;border:1px solid var(--hair-2);border-radius:9px;background:var(--ink-3);color:var(--text);text-decoration:none;transition:border-color 120ms,background 120ms}
.sp-chan:hover{border-color:var(--accent);background:var(--ink-2)}
.sp-chan-ico{width:34px;height:34px;border-radius:50%;display:grid;place-items:center;flex:none;background:color-mix(in srgb,var(--accent) 16%,transparent);color:var(--accent)}
.sp-chan-ico svg{width:18px;height:18px}
.sp-chan-ico.wa{background:rgba(37,211,102,.14);color:#25d366}
.sp-chan-txt{display:flex;flex-direction:column;line-height:1.25;min-width:0}
.sp-chan-txt b{font-size:13px;font-weight:600;color:var(--text)}
.sp-chan-txt small{font-size:11.5px;color:var(--text-3);font-family:var(--font-mono)}
.sp-field-lbl{font-size:11.5px;color:var(--text-3);font-weight:500;margin-top:3px}
.sp-textarea{width:100%;resize:vertical;min-height:62px;padding:9px 11px;font:inherit;font-size:13px;color:var(--text);background:var(--ink-3);border:1px solid var(--hair-2);border-radius:9px}
.sp-textarea:focus{outline:none;border-color:var(--accent);background:var(--ink-2)}
.sp-actions{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-top:2px}
.support-panel .btn{display:inline-flex;align-items:center;justify-content:center;font-size:12.5px;padding:8px 6px;border-radius:9px;border:1px solid var(--accent);background:var(--accent);color:#fff;cursor:pointer;font-weight:600;text-decoration:none}
.support-panel .btn.subtle{background:transparent;color:var(--text)}
.sp-btn-wa{border-color:rgba(37,211,102,.4)!important;color:#1fae55!important;background:transparent!important}
.sp-btn-wa:hover{background:rgba(37,211,102,.1)!important}
.sp-foot{font-size:11px;color:var(--text-3);text-align:center;margin-top:3px}
@media(max-width:640px){.support-wrap{right:16px;bottom:16px}.support-panel{width:300px}}