/* Visual do design system SGT por cima das páginas próprias do site (Home .tx e Programa .ax).
   Só aparência: cores, fontes, botões e a cena de partículas. Textos, links e rastreio continuam iguais.
   Fonte de verdade das cores: tokens do SGT (app-comercial/public/sgt/sgt.css). */
html:root {
  --bk: #080C11; --bk2: #0B1016; --card: #0F151C; --line: #1F2935;
  --tx: #E8EEF4; --mu: #B4BFCB; --dim: #8794A2; --y: #4DD0FF; --ink: #0A0F14;
  --disp: "Inter Tight", Inter, ui-sans-serif, system-ui, sans-serif;
  --sans: Inter, ui-sans-serif, system-ui, -apple-system, "Segoe UI", sans-serif;
  --sgt-mono: "JetBrains Mono", ui-monospace, Menlo, monospace;
  --sgt-hl: #F2F5F8; --sgt-on-hl: #0A0F14; --sgt-dot: #1A2431; --sgt-line-strong: #34404F;
  color-scheme: dark;
}
html body { -webkit-font-smoothing: antialiased; }

/* Títulos: Inter Tight, caixa normal, apertado, como no SGT */
html body .elementor :is(.tx, .ax) :is(h1, h2, h3, h4) { text-transform: none !important; letter-spacing: -0.035em !important; font-weight: 600 !important; }
html body .elementor :is(.tx .tx-h1, .ax .ax-h1) { font-size: clamp(38px, 4.4vw, 64px) !important; line-height: 1.04 !important; font-weight: 500 !important; letter-spacing: -0.045em !important; }
html body .elementor :is(.tx .tx-h2, .ax .ax-h2) { font-size: clamp(30px, 3.6vw, 50px) !important; line-height: 1.06 !important; }
html body .elementor :is(.tx, .ax) :is(h3, h4) { letter-spacing: -0.02em !important; }
html body .elementor :is(.tx, .ax) :is(b, strong) { font-weight: 600; }
html body .elementor .ax em { font-style: normal; font-weight: 600; }

/* Eyebrow em mono, como o "(01) Acesso" do SGT */
html body :is(.tx-eye, .ax-eye) { font-family: var(--sgt-mono) !important; font-size: 12.5px !important; font-weight: 500 !important; letter-spacing: 0.08em !important; color: var(--dim) !important; }
html body :is(.tx-stripes, .ax-stripes) i { width: 6px; height: 13px; }

/* Números grandes em mono */
html body :is(.tx-stats, .ax-stats) b { font-family: var(--sgt-mono) !important; font-weight: 500 !important; letter-spacing: -0.04em; }

/* Botões: cápsula, destaque neutro (branco no escuro), caixa normal */
html body .elementor :is(.tx a.tx-btn, .ax a.ax-btn) {
  background: var(--sgt-hl) !important; color: var(--sgt-on-hl) !important;
  font-family: var(--sans) !important; font-weight: 600 !important; font-size: 17px !important;
  letter-spacing: 0 !important; text-transform: none !important;
  border-radius: 999px !important; padding: 18px 30px !important;
  box-shadow: 0 24px 48px -24px rgba(6, 40, 69, 0.9) !important;
}
html body .elementor :is(.tx a.tx-btn, .ax a.ax-btn):hover { background: #FFFFFF !important; transform: none !important; }
html body .elementor :is(.tx a.tx-btn, .ax a.ax-btn) svg { transition: transform .2s cubic-bezier(.4, 0, .2, 1); }
html body .elementor :is(.tx a.tx-btn, .ax a.ax-btn):hover svg { transform: translateX(3px); }
html body .elementor :is(.tx a.tx-btn.is-dark, .ax a.ax-btn.is-dark) { background: var(--bk) !important; color: var(--tx) !important; border: 1px solid var(--sgt-line-strong) !important; }
html body .elementor :is(.tx a.tx-topcta, .ax a.ax-topcta) {
  background: var(--sgt-hl) !important; color: var(--sgt-on-hl) !important;
  font-family: var(--sans) !important; font-weight: 600 !important; font-size: 14px !important;
  letter-spacing: 0 !important; text-transform: none !important; border-radius: 999px !important; padding: 11px 18px !important;
}
html body .elementor :is(.tx button.tx-more-btn, .ax button.ax-more-btn) {
  font-family: var(--sans) !important; text-transform: none !important; letter-spacing: 0 !important;
  border-radius: 999px !important; border: 1px solid var(--sgt-line-strong) !important;
}
html body :is(.tx-hero-tag, .ax-hero-tag) { font-family: var(--sgt-mono) !important; font-size: 12px !important; letter-spacing: 0.06em !important; }
html body .elementor :is(.tx .tx-foot h4, .ax .ax-foot h4) { font-family: var(--sgt-mono) !important; font-size: 11px !important; font-weight: 600 !important; letter-spacing: 0.12em !important; text-transform: uppercase !important; color: var(--dim) !important; }

/* Cartões: borda fina, sem brilho colorido */
html body :is(.tx-case, .ax-case, .tx-path, .ax-path) { border-radius: 18px; }
html body :is(.tx-hero-v, .ax-hero-v) .tx-vid { border-color: var(--sgt-line-strong) !important; box-shadow: 0 30px 80px rgba(0, 0, 0, .55) !important; }

/* Seções alternadas com a malha de pontos do SGT */
html body :is(.tx-alt, .ax-alt) { background-color: var(--bk2) !important; background-image: radial-gradient(circle, var(--sgt-dot) 1px, transparent 1.2px) !important; background-size: 24px 24px !important; }

/* Cena de partículas no topo (montada pelo site.js) */
html body :is(.tx-hero, .ax-hero) { background: #050A10 !important; isolation: isolate; }
html body :is(.tx-hero, .ax-hero) > :not(.sgt-particles) { position: relative; z-index: 1; }
.sgt-particles { position: absolute; inset: 0; z-index: 0; overflow: hidden; pointer-events: none; background: radial-gradient(circle, rgba(77, 208, 255, .16) 0 1px, transparent 1.4px) 0 0 / 22px 22px, #050A10; }
.sgt-particles-canvas { display: block; width: 100%; height: 100%; }
.sgt-particles.is-fallback .sgt-particles-canvas { display: none; }
.sgt-particles-veil { position: absolute; inset: 0; pointer-events: none;
  background: linear-gradient(90deg, rgba(5, 10, 16, .86) 0%, rgba(5, 10, 16, .55) 38%, rgba(5, 10, 16, .15) 70%, rgba(5, 10, 16, .35) 100%),
              linear-gradient(180deg, rgba(5, 10, 16, .55) 0%, rgba(5, 10, 16, 0) 22%, rgba(5, 10, 16, 0) 70%, rgba(5, 10, 16, .8) 100%); }

:focus-visible { outline: 2px solid #4DD0FF; outline-offset: 2px; }
@media (max-width: 760px) {
  html body .elementor :is(.tx a.tx-btn, .ax a.ax-btn) { font-size: 16px !important; padding: 16px 24px !important; }
}

/* Programa: a faixa amarela e os selos viram superfície escura do SGT (o azul fica só nos números) */
html body .ax-yband { --ink: #E8EEF4; background-color: var(--bk2) !important; background-image: radial-gradient(circle, var(--sgt-dot) 1px, transparent 1.2px) !important; background-size: 24px 24px !important; color: var(--tx) !important; border-block: 1px solid var(--line); }
html body .elementor .ax .ax-yband .ax-h2 { color: var(--tx) !important; }
html body .ax-yband b, html body .ax-yband strong { color: var(--y); }
html body .ax-tag { background: #0F151C !important; color: var(--tx) !important; border: 1px solid var(--sgt-line-strong) !important; border-radius: 14px !important; }
html body .ax-tag b { color: var(--y) !important; font-family: var(--sgt-mono) !important; font-weight: 500 !important; letter-spacing: -0.03em; }
html body .ax-pil li:hover { color: var(--sgt-on-hl) !important; background: var(--sgt-hl) !important; }
html body .ax-play, html body .tx-play { background: rgba(255, 255, 255, .94) !important; }