/* Daniel Santos · proposta da Genesis Innovation. Fontes locais (SIL OFL): Inter (texto e títulos) e
   JetBrains Mono (código). Identidade de engenharia de dados: azul-marinho quase preto, com os acentos de
   tecnologia do banner dele (azul Azure, laranja Databricks, amarelo Python, verde) e as três camadas do
   medalhão (bronze, prata, ouro). Cores só pelas variáveis do :root (o site.test.mjs mede o contraste).
   Dois temas: o escuro é o :root; o claro (fundo branco, texto azul-marinho, acentos escurecidos para passar
   AA no branco) vale com o sistema claro ou com o botão (tema.js grava <html data-tema>). Os dois blocos do
   claro têm de ser iguais (o teste compara). */
@font-face{font-family:"Inter";src:url("fontes/inter.woff2") format("woff2");font-weight:100 900;font-style:normal;font-display:swap}
@font-face{font-family:"JetBrains Mono";src:url("fontes/jetbrains-mono.woff2") format("woff2");font-weight:100 800;font-style:normal;font-display:swap}

:root {
  --fundo: #050913;
  --superficie: #0b1222;
  --superficie-2: #111a2e;
  --texto: #eef2ff;
  --suave: #9eabc6;
  --linha: #1e2943;
  --azure: #4ea8ff;
  --databricks: #ff6a4d;
  --python: #ffd43b;
  --verde: #3ee6a1;
  --roxo: #b49bff;
  --bronze: #e09a62;
  --prata: #cfd8e3;
  --ouro: #f6c64a;
  --acento: #4ea8ff;
  --acento-contraste: #04101f;
  --tk-c: #8390ab;
  --tk-s: #8ee6b0;
  --tk-k: #7cc4ff;
  --tk-n: #ffab70;
  --tk-p: #c9b3ff;
  --tk-f: #ffd43b;
  --ok: #4ade80;
  --erro: #ff8f8f;
  --cv-fundo: #f4f6fb;
  --cv-texto: #121826;
  --cv-suave: #4a5468;
  --cv-acento: #0b5bb5;
  --faixa: #4ea8ff;
  --faixa-texto: #04101f;
  --comp-texto: #eef2ff;
  --comp-texto-suave: #9eabc6;
  --comp-borda: #1e2943;
  --comp-acento: #4ea8ff;
  --comp-foco: #4ea8ff;
  --comp-fundo: transparent;
  --tinta: #ffffff;
  --poco: #070c18;
  --poco-2: #0d1528;
  --poco-sel: #10264a;
  --aresta: #2a3858;
  --fato-grande: #0f2142;
  --grad-1: #7cc4ff;
  --grad-2: #6f7dff;
  --spark: #ff9a3d;
  --aws: #ffb547;
  --powerbi: #f2c811;
  --barra-fim: #2a62a8;
  --barra-quente-fim: #a33b26;
  --cv-linha: #c3c9d6;
  --cv-linha-2: #d3d8e2;
  --heroi-aresta: #7896d238;
  --heroi-rotulo: #c8d4ebbf;
  --heroi-foto: .22;
  --foto-base: saturate(.7) brightness(.55);
  --base-lado: transparent;
  color-scheme: dark;
  --raio: 24px;
  --mono: "JetBrains Mono", ui-monospace, SFMono-Regular, Menlo, monospace;
  --sans: "Inter", system-ui, -apple-system, sans-serif;
  --mola: cubic-bezier(.16,1,.3,1);
}

/* tema claro: pelo sistema (sem escolha salva) ou pelo botão */
@media (prefers-color-scheme: light) {
:root:not([data-tema="escuro"]) {
  --fundo: #ffffff;
  --superficie: #f5f7fb;
  --superficie-2: #edf1f8;
  --texto: #0b1733;
  --suave: #4a5671;
  --linha: #d8dfeb;
  --azure: #0060c7;
  --databricks: #b93a0a;
  --python: #7f5d00;
  --verde: #047857;
  --roxo: #6a3fd4;
  --bronze: #9a4f1c;
  --prata: #536176;
  --ouro: #856000;
  --acento: #0060c7;
  --acento-contraste: #ffffff;
  --tk-c: #5d6880;
  --tk-s: #0f6b3a;
  --tk-k: #0550ae;
  --tk-n: #a1420b;
  --tk-p: #6f42c1;
  --tk-f: #735000;
  --ok: #13773a;
  --erro: #c42b2b;
  --faixa: #0b1733;
  --faixa-texto: #ffffff;
  --comp-texto: #0b1733;
  --comp-texto-suave: #4a5671;
  --comp-borda: #d8dfeb;
  --comp-acento: #0060c7;
  --comp-foco: #0060c7;
  --tinta: #0b1733;
  --poco: #ffffff;
  --poco-2: #e9eff8;
  --poco-sel: #dbe9fd;
  --aresta: #b4c0d4;
  --fato-grande: #dbe9fd;
  --grad-1: #0b6bd6;
  --grad-2: #4f46e5;
  --spark: #e8730f;
  --aws: #d98a00;
  --powerbi: #c9a400;
  --barra-fim: #003f8a;
  --barra-quente-fim: #7c2d12;
  --heroi-aresta: #0b173333;
  --heroi-rotulo: #4a5671;
  --heroi-foto: .1;
  --foto-base: saturate(.8) brightness(1.1);
  --base-lado: color-mix(in srgb,var(--fundo) 82%,transparent);
  color-scheme: light;
}
}
:root[data-tema="claro"] {
  --fundo: #ffffff;
  --superficie: #f5f7fb;
  --superficie-2: #edf1f8;
  --texto: #0b1733;
  --suave: #4a5671;
  --linha: #d8dfeb;
  --azure: #0060c7;
  --databricks: #b93a0a;
  --python: #7f5d00;
  --verde: #047857;
  --roxo: #6a3fd4;
  --bronze: #9a4f1c;
  --prata: #536176;
  --ouro: #856000;
  --acento: #0060c7;
  --acento-contraste: #ffffff;
  --tk-c: #5d6880;
  --tk-s: #0f6b3a;
  --tk-k: #0550ae;
  --tk-n: #a1420b;
  --tk-p: #6f42c1;
  --tk-f: #735000;
  --ok: #13773a;
  --erro: #c42b2b;
  --faixa: #0b1733;
  --faixa-texto: #ffffff;
  --comp-texto: #0b1733;
  --comp-texto-suave: #4a5671;
  --comp-borda: #d8dfeb;
  --comp-acento: #0060c7;
  --comp-foco: #0060c7;
  --tinta: #0b1733;
  --poco: #ffffff;
  --poco-2: #e9eff8;
  --poco-sel: #dbe9fd;
  --aresta: #b4c0d4;
  --fato-grande: #dbe9fd;
  --grad-1: #0b6bd6;
  --grad-2: #4f46e5;
  --spark: #e8730f;
  --aws: #d98a00;
  --powerbi: #c9a400;
  --barra-fim: #003f8a;
  --barra-quente-fim: #7c2d12;
  --heroi-aresta: #0b173333;
  --heroi-rotulo: #4a5671;
  --heroi-foto: .1;
  --foto-base: saturate(.8) brightness(1.1);
  --base-lado: color-mix(in srgb,var(--fundo) 82%,transparent);
  color-scheme: light;
}

*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
@media (prefers-reduced-motion:no-preference){html{scroll-behavior:smooth}}
body{margin:0;background:var(--fundo);color:var(--texto);font:400 17px/1.6 var(--sans);overflow-x:hidden;-webkit-font-smoothing:antialiased}
img{display:block;max-width:100%;height:auto}
a{color:inherit;text-underline-offset:3px}
h1,h2,h3{margin:0;letter-spacing:-.035em;line-height:1.04;font-weight:800}
ul,ol{margin:0;padding:0;list-style:none}
p{margin:0}
button{font:inherit;color:inherit}
/* sem ligaduras da JetBrains Mono: "<>" e "->" aparecem como digitados */
*{font-variant-ligatures:none!important;font-feature-settings:"liga" 0,"calt" 0!important}
:focus-visible{outline:3px solid var(--azure);outline-offset:3px;border-radius:6px}
.so-leitor{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
.ic{width:1.2em;height:1.2em;flex:none}

.proposta{background:var(--faixa);color:var(--faixa-texto);font-size:.8rem;font-weight:600;text-align:center;padding:8px 16px}
.proposta a{color:var(--faixa-texto)}
.pular{position:absolute;left:12px;top:-60px;background:var(--acento);color:var(--acento-contraste);padding:10px 14px;border-radius:10px;z-index:40;font-weight:700}
.pular:focus{top:12px}

/* ---- topo (vidro) ---- */
.topo{position:sticky;top:0;z-index:30;display:flex;align-items:center;gap:20px;padding:12px max(16px,4vw);
  background:color-mix(in srgb,var(--fundo) 72%,transparent);backdrop-filter:saturate(180%) blur(18px);-webkit-backdrop-filter:saturate(180%) blur(18px);
  border-bottom:1px solid color-mix(in srgb,var(--tinta) 6%,transparent)}
.marca{display:flex;align-items:center;gap:10px;text-decoration:none;font-weight:700;letter-spacing:-.02em}
.marca-ds{display:inline-flex;flex-direction:column;justify-content:center;gap:3px;width:30px;height:30px;padding:6px;border-radius:8px;background:var(--superficie-2);
  border:1px solid color-mix(in srgb,var(--tinta) 10%,transparent)}
.marca-ds i{display:block;height:4px;border-radius:2px;background:var(--bronze)}
.marca-ds i+i{background:var(--prata);width:85%}
.marca-ds i+i+i{background:var(--ouro);width:70%}
.topo nav{margin-left:auto}
.topo nav ul{display:flex;gap:4px}
.topo nav a{display:block;padding:8px 12px;border-radius:999px;color:var(--suave);text-decoration:none;font-size:.9rem;transition:color .2s,background-color .2s}
.topo nav a:hover{color:var(--texto);background:color-mix(in srgb,var(--tinta) 6%,transparent)}
.topo nav a[aria-current="page"]{color:var(--acento-contraste);background:var(--acento)}
.topo-cta{display:grid;place-items:center;width:38px;height:38px;border-radius:999px;background:color-mix(in srgb,var(--tinta) 8%,transparent);color:var(--texto)}
.tema-botao{--tema-cor:var(--texto);--tema-borda:color-mix(in srgb,var(--tinta) 16%,transparent);--tema-fundo:color-mix(in srgb,var(--tinta) 6%,transparent);--tema-foco:var(--azure)}
@media (max-width:820px){.topo nav{display:none}.topo .tema-botao{margin-left:auto}}

/* ---- herói ---- */
.heroi{position:relative;isolation:isolate;overflow:hidden;min-height:min(94vh,920px);display:grid;align-items:end;padding:96px max(16px,5vw) 96px}
.heroi-foto{position:absolute;inset:-6% 0 0;z-index:-4;opacity:var(--heroi-foto)}
.heroi-foto img{width:100%;height:100%;object-fit:cover;filter:saturate(1.2) hue-rotate(-8deg)}
.heroi-canvas{position:absolute;inset:0;z-index:-2;width:100%;height:100%;display:block}
.heroi-veu{position:absolute;inset:0;z-index:-3;
  background:radial-gradient(ellipse 70% 60% at 78% 40%,color-mix(in srgb,var(--azure) 18%,transparent),transparent 70%),
             radial-gradient(ellipse 50% 50% at 95% 90%,color-mix(in srgb,var(--databricks) 16%,transparent),transparent 70%),
             linear-gradient(90deg,var(--fundo) 0%,color-mix(in srgb,var(--fundo) 86%,transparent) 38%,color-mix(in srgb,var(--fundo) 35%,transparent) 100%)}
.heroi::after{content:"";position:absolute;inset:auto 0 0;height:200px;z-index:-1;background:linear-gradient(transparent,var(--fundo));pointer-events:none}
.heroi-conteudo{position:relative;max-width:1280px;width:100%;margin:0 auto}
.heroi-olho{font:600 .9rem/1 var(--mono);letter-spacing:.22em;color:var(--azure);margin-bottom:18px}
.heroi h1{font-size:clamp(3.3rem,9vw,7.6rem);letter-spacing:-.06em;line-height:.92;display:flex;flex-wrap:wrap;align-items:flex-end;gap:0 .22em}
.h1-a{color:var(--texto)}
.h1-b{background:linear-gradient(100deg,var(--grad-1) 0%,var(--azure) 35%,var(--grad-2) 70%,var(--roxo));-webkit-background-clip:text;background-clip:text;color:transparent;padding-bottom:.06em}
.selo-verificado{display:inline-flex;align-self:flex-start;margin-top:.25em;color:var(--azure);font-size:clamp(1.1rem,2.2vw,1.8rem)}
.heroi-cargo{margin-top:22px;font-size:clamp(1.25rem,2.6vw,2rem);font-weight:650;letter-spacing:-.02em}
.heroi-sep{color:var(--linha);margin:0 .2em}
.heroi-az{color:var(--databricks)}
.heroi-chips{display:flex;flex-wrap:wrap;gap:8px;margin:22px 0 14px;max-width:760px}
.heroi-chips li{padding:6px 12px;border-radius:999px;background:color-mix(in srgb,var(--tinta) 5%,transparent);border:1px solid color-mix(in srgb,var(--tinta) 12%,transparent);color:var(--texto);font:500 .86rem/1.3 var(--mono)}
.heroi-meta{color:var(--suave);font-size:1.02rem;margin-bottom:30px}
.acoes{display:flex;flex-wrap:wrap;gap:12px}
.btn{display:inline-flex;align-items:center;gap:10px;min-height:50px;padding:12px 24px;border-radius:999px;font-weight:700;text-decoration:none;border:0;cursor:pointer;
  transition:transform .3s var(--mola),box-shadow .3s,background-color .2s}
.btn-primario{background:var(--acento);color:var(--acento-contraste);box-shadow:0 12px 44px -12px color-mix(in srgb,var(--azure) 75%,transparent)}
.btn-primario:hover{transform:translateY(-2px);box-shadow:0 18px 56px -12px color-mix(in srgb,var(--azure) 90%,transparent)}
.btn-vidro{background:color-mix(in srgb,var(--tinta) 8%,transparent);border:1px solid color-mix(in srgb,var(--tinta) 16%,transparent);color:var(--texto)}
.btn-vidro:hover{background:color-mix(in srgb,var(--tinta) 14%,transparent)}
.btn-ic{display:inline-flex}
.heroi-camadas{position:absolute;right:max(16px,5vw);top:110px;display:flex;flex-direction:column;gap:10px;font:700 .72rem/1 var(--mono);letter-spacing:.2em;text-transform:uppercase}
.heroi-camadas li{padding:9px 14px;border-radius:999px;background:color-mix(in srgb,var(--fundo) 65%,transparent);border:1px solid currentColor;backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px)}
.c-bronze{color:var(--bronze)}.c-silver{color:var(--prata)}.c-gold{color:var(--ouro)}
.heroi-rolar{position:absolute;left:50%;bottom:26px;width:24px;height:38px;margin-left:-12px;border-radius:12px;border:2px solid color-mix(in srgb,var(--tinta) 30%,transparent)}
.heroi-rolar span{position:absolute;left:50%;top:7px;width:4px;height:8px;margin-left:-2px;border-radius:2px;background:var(--azure)}
@media (max-width:760px){.heroi{align-items:end;padding-top:300px;padding-bottom:64px}.heroi-camadas,.heroi-rolar{display:none}}

/* ---- esteira (as cores dos chips do banner dele) ---- */
.esteira{display:flex;overflow:hidden;border-block:1px solid var(--linha);padding:18px 0;background:var(--fundo)}
.esteira-trilho{display:flex;flex:none;min-width:100%;justify-content:space-around}
.esteira-trilho li{display:flex;align-items:center;gap:12px;padding:0 30px;font:700 clamp(1.05rem,2vw,1.45rem)/1 var(--mono);letter-spacing:-.02em;white-space:nowrap;color:var(--texto)}
.esteira-trilho li::before{content:"";width:10px;height:10px;border-radius:50%;background:currentColor;box-shadow:0 0 14px currentColor}
.chip-azure::before{color:var(--azure)}.chip-databricks::before{color:var(--databricks)}.chip-spark::before{color:var(--spark)}.chip-python::before{color:var(--python)}
.chip-sql::before{color:var(--verde)}.chip-aws::before{color:var(--aws)}.chip-powerbi::before{color:var(--powerbi)}.chip-gcp::before{color:var(--roxo)}
@media (prefers-reduced-motion:reduce){.esteira{flex-wrap:wrap}.esteira-trilho[aria-hidden]{display:none}.esteira-trilho{flex:1 1 100%;min-width:0;flex-wrap:wrap;justify-content:center;gap:14px 0}.esteira-trilho li{padding:0 16px}}

/* ---- seções ---- */
.secao{padding:clamp(84px,11vw,150px) max(16px,5vw)}
.secao>*{max-width:1200px;margin-left:auto;margin-right:auto}
.cabeca{margin-bottom:clamp(36px,5vw,64px);text-align:center}
.olho{font:600 .82rem/1 var(--mono);text-transform:uppercase;letter-spacing:.16em;color:var(--azure);margin-bottom:16px}
.cabeca h2{font-size:clamp(2.3rem,6vw,5rem)}
.grad{background:linear-gradient(95deg,var(--azure),var(--roxo) 45%,var(--databricks));-webkit-background-clip:text;background-clip:text;color:transparent}
.lead{max-width:660px;margin:20px auto 0;font-size:clamp(1.05rem,1.6vw,1.25rem);color:var(--suave)}
.rotulo{font:600 .78rem/1 var(--mono);text-transform:uppercase;letter-spacing:.12em;color:var(--suave);margin-bottom:16px}
.vidro{background:linear-gradient(180deg,color-mix(in srgb,var(--tinta) 5%,transparent),color-mix(in srgb,var(--tinta) 2%,transparent));border:1px solid color-mix(in srgb,var(--tinta) 8%,transparent)}

/* sobre */
.fatos{display:grid;grid-template-columns:1.4fr 1fr 1fr 1fr;gap:14px;margin-bottom:16px}
.fato{display:flex;flex-direction:column;justify-content:flex-end;gap:8px;min-height:190px;padding:26px;border-radius:var(--raio);
  background:linear-gradient(180deg,var(--superficie-2),var(--superficie));border:1px solid color-mix(in srgb,var(--tinta) 7%,transparent)}
.fato span{color:var(--suave);font-weight:500}
.fato b{font-size:clamp(1.4rem,2.4vw,2rem);letter-spacing:-.03em;line-height:1.1}
.fato-grande{background:radial-gradient(circle at 20% 0%,color-mix(in srgb,var(--azure) 35%,transparent),transparent 60%),linear-gradient(180deg,var(--fato-grande),var(--superficie))}
.fato-grande b{font-size:clamp(1.8rem,3.4vw,2.8rem);color:var(--texto)}
.fato-rotulo{font:600 .75rem/1 var(--mono);text-transform:uppercase;letter-spacing:.14em}
.pilares{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}
.pilar{display:flex;flex-direction:column;gap:14px;padding:26px;border-radius:var(--raio);background:var(--superficie);border:1px solid color-mix(in srgb,var(--tinta) 7%,transparent)}
.pilar b{font-size:1.25rem;letter-spacing:-.02em;line-height:1.25}
.pilar a{margin-top:auto;display:inline-flex;align-items:center;gap:6px;color:var(--azure);font-weight:600;text-decoration:none}
.pilar-ic{display:grid;place-items:center;width:46px;height:46px;border-radius:14px;background:color-mix(in srgb,var(--azure) 12%,transparent);color:var(--azure);font-size:1.3rem}
.pilar:nth-child(2) .pilar-ic{background:color-mix(in srgb,var(--verde) 12%,transparent);color:var(--verde)}
.pilar:nth-child(3) .pilar-ic{background:color-mix(in srgb,var(--python) 12%,transparent);color:var(--python)}
@media (max-width:900px){.fatos{grid-template-columns:1fr 1fr}.fato-grande{grid-column:1/-1}.pilares{grid-template-columns:1fr}}

/* ---- demos ---- */
.secao-demos{background:radial-gradient(ellipse 80% 40% at 50% 0%,color-mix(in srgb,var(--azure) 8%,transparent),transparent 70%)}
.aviso{max-width:780px;margin:-24px auto 40px;padding:12px 18px;border-radius:14px;border:1px dashed color-mix(in srgb,var(--azure) 45%,transparent);color:var(--suave);font-size:.9rem;text-align:center}
#demos .abas-lista,#abas-ferramentas .abas-lista{justify-content:center;border:0;gap:6px;flex-wrap:wrap;margin-bottom:36px}
#demos .aba,#abas-ferramentas .aba{border:1px solid var(--linha);border-radius:999px;padding:10px 18px;margin:0;font-weight:600}
#demos .aba[aria-selected="true"],#abas-ferramentas .aba[aria-selected="true"]{background:var(--acento);color:var(--acento-contraste);border-color:var(--acento)}
.demo-intro{text-align:center;margin-bottom:26px}
.demo-intro h3{font-size:clamp(1.6rem,3vw,2.4rem);margin-bottom:8px}
.demo-intro p{color:var(--suave);max-width:680px;margin:0 auto}
.demo-palco{min-width:0;padding:clamp(18px,3vw,34px);border-radius:28px;background:linear-gradient(180deg,var(--superficie-2),var(--superficie));
  border:1px solid color-mix(in srgb,var(--tinta) 7%,transparent);box-shadow:0 50px 120px -60px color-mix(in srgb,var(--azure) 35%,transparent)}
.demo-codigo{margin:16px 0 0;min-width:0;border-radius:20px;background:var(--poco);border:1px solid var(--linha);overflow:hidden}
.demo-codigo figcaption{display:flex;align-items:center;gap:7px;padding:12px 16px;border-bottom:1px solid color-mix(in srgb,var(--tinta) 7%,transparent);background:color-mix(in srgb,var(--tinta) 3%,transparent)}
.demo-codigo pre{margin:0;padding:18px 20px;overflow:auto;font:500 .8rem/1.7 var(--mono);color:var(--texto);max-height:380px}
.demo-codigo code{font:inherit}
.ponto{width:11px;height:11px;border-radius:50%;background:#ff5f57}
.ponto+.ponto{background:#febc2e}
.ponto+.ponto+.ponto{background:#28c840}
.editor-aba{margin-left:10px;font:500 .78rem/1.3 var(--mono);color:var(--suave)}
.tk-c{color:var(--tk-c);font-style:italic}.tk-s{color:var(--tk-s)}.tk-k{color:var(--tk-k)}.tk-n{color:var(--tk-n)}.tk-p{color:var(--tk-p)}.tk-f{color:var(--tk-f)}
.sem-js{color:var(--suave);font-size:.9rem;margin-bottom:12px}
.demo-palco:has(.demo-viva) .sem-js{display:none}
.demo-sub{color:var(--suave);font:600 .76rem/1.3 var(--mono);text-transform:uppercase;letter-spacing:.1em;margin-bottom:12px}
.demo-nota{margin-top:18px;color:var(--suave);font-size:.84rem}
.demo-tag{font:600 .8rem/1 var(--mono);padding:7px 12px;border-radius:999px;background:color-mix(in srgb,var(--azure) 14%,transparent);color:var(--azure)}
.botao,.botao-fantasma,.opcao{cursor:pointer;min-height:44px;padding:10px 18px;border-radius:999px;font-weight:600;transition:transform .2s var(--mola),background-color .2s,border-color .2s,color .2s}
.botao{background:var(--acento);color:var(--acento-contraste);border:0}
.botao:disabled{opacity:.4;cursor:not-allowed}
.botao-fantasma,.opcao{background:transparent;border:1px solid color-mix(in srgb,var(--tinta) 20%,transparent);color:var(--texto)}
.botao-fantasma:hover,.opcao:hover{border-color:var(--azure)}
.opcao[aria-pressed="true"]{background:var(--acento);color:var(--acento-contraste);border-color:var(--acento)}
.botao:active,.opcao:active,.botao-fantasma:active{transform:scale(.97)}
.acoes-demo{display:flex;flex-wrap:wrap;gap:8px;align-items:center;margin:14px 0}
.controle{display:flex;flex-direction:column;gap:8px;font-size:.9rem;color:var(--suave)}
.controle span{display:flex;justify-content:space-between;gap:12px}
.controle output{font:700 .9rem/1 var(--mono);color:var(--texto)}
.controle input[type=range]{width:100%;accent-color:var(--azure);min-height:28px}
.chips-cmd{display:flex;flex-wrap:wrap;gap:8px}
.chip-cmd{cursor:pointer;padding:8px 14px;border-radius:999px;border:1px solid var(--linha);background:color-mix(in srgb,var(--tinta) 3%,transparent);color:var(--texto);font:500 .82rem/1.3 var(--mono)}
.chip-cmd:hover{border-color:var(--azure)}
.alavancas{display:grid;gap:8px}
.alavanca{display:flex;align-items:center;gap:12px;width:100%;cursor:pointer;text-align:left;min-height:48px;padding:10px 14px;border-radius:14px;border:1px solid var(--linha);background:color-mix(in srgb,var(--tinta) 2%,transparent);color:var(--texto);font-weight:500;font-size:.92rem}
.alavanca-chave{position:relative;flex:none;width:38px;height:22px;border-radius:999px;background:var(--linha);transition:background-color .25s}
.alavanca-chave::after{content:"";position:absolute;left:3px;top:3px;width:16px;height:16px;border-radius:50%;background:var(--suave);transition:transform .25s var(--mola),background-color .25s}
.alavanca[aria-pressed="true"]{border-color:color-mix(in srgb,var(--azure) 60%,transparent);background:color-mix(in srgb,var(--azure) 8%,transparent)}
.alavanca[aria-pressed="true"] .alavanca-chave{background:var(--acento)}
.alavanca[aria-pressed="true"] .alavanca-chave::after{transform:translateX(16px);background:var(--acento-contraste)}

/* resultado de SQL (playground, wiki, ferramentas, quiz) */
.resultado-rolagem{overflow:auto;max-height:420px;border-radius:14px;border:1px solid var(--linha);background:var(--poco)}
.resultado{width:100%;border-collapse:collapse;font:500 .84rem/1.45 var(--mono)}
.resultado th,.resultado td{padding:8px 12px;border-bottom:1px solid var(--linha);text-align:left;white-space:nowrap}
.resultado th{position:sticky;top:0;background:var(--poco-2);color:var(--azure);font-weight:700}
.resultado td.num{color:var(--tk-n);font-variant-numeric:tabular-nums}
.resultado td.nulo{color:var(--tk-c);font-style:italic}
.resultado tr:last-child td{border-bottom:0}
.resultado-info{margin-top:8px;color:var(--suave);font:500 .8rem/1.4 var(--mono)}
.resultado-erro{margin-top:8px;color:var(--erro);font:600 .86rem/1.5 var(--mono);white-space:pre-wrap;overflow-wrap:anywhere}

/* medalhão */
.md-controles{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:18px;align-items:end;margin-bottom:22px}
.md-fluxo{position:relative;margin-bottom:12px}
.md-canvas{position:absolute;inset:0;width:100%;height:100%;pointer-events:none}
.md-colunas{position:relative;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:clamp(10px,3vw,40px)}
.md-col{display:flex;flex-direction:column;gap:6px;padding:18px 16px;border-radius:18px;background:color-mix(in srgb,var(--fundo) 78%,transparent);border:1px solid var(--linha);min-width:0}
.md-nome{font:700 .78rem/1 var(--mono);text-transform:uppercase;letter-spacing:.14em}
.md-col b{font-size:clamp(1.8rem,4vw,3rem);letter-spacing:-.04em;line-height:1}
.md-sub{color:var(--suave);font-size:.8rem}
.md-fonte .md-nome{color:var(--azure)}.md-bronze .md-nome{color:var(--bronze)}.md-silver .md-nome{color:var(--prata)}.md-gold .md-nome{color:var(--ouro)}
.md-bronze{border-color:color-mix(in srgb,var(--bronze) 45%,transparent)}.md-silver{border-color:color-mix(in srgb,var(--prata) 40%,transparent)}.md-gold{border-color:color-mix(in srgb,var(--ouro) 50%,transparent);box-shadow:0 0 40px -18px var(--ouro)}
.md-quarentena-linha{color:var(--suave);font-size:.9rem;margin-bottom:20px}
.md-quarentena-linha b{color:var(--erro)}
.md-detalhes{display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);gap:20px}
.md-regras ul{display:grid;gap:6px}
.md-regras li{display:flex;justify-content:space-between;gap:10px;padding:9px 12px;border-radius:10px;background:color-mix(in srgb,var(--tinta) 3%,transparent);font-size:.88rem}
.md-regras li b{font-family:var(--mono)}
.md-regras li[data-ok="true"] b{color:var(--ok)}
.md-regras li[data-ok="false"] b{color:var(--erro)}
.md-amostra-abas{display:flex;flex-wrap:wrap;gap:6px;margin-bottom:10px}
.md-amostra-abas .opcao{min-height:36px;padding:6px 14px;font-size:.82rem}
@media (max-width:760px){.md-controles,.md-detalhes{grid-template-columns:minmax(0,1fr)}.md-colunas{grid-template-columns:repeat(2,minmax(0,1fr))}}

/* spark */
.sp-grade{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,.85fr);gap:24px}
.sp-bloco{min-width:0}
.sp-controles{display:grid;grid-template-columns:1fr 1fr;gap:14px 18px;margin-bottom:18px}
.sp-barras{display:flex;align-items:flex-end;gap:4px;height:170px;padding:10px;border-radius:14px;background:var(--poco);border:1px solid var(--linha)}
.sp-barra{flex:1;min-width:3px;border-radius:5px 5px 2px 2px;background:linear-gradient(180deg,var(--azure),var(--barra-fim));height:calc(var(--h,0) * 1%);transition:height .6s var(--mola),background .4s}
.sp-barra[data-quente="true"]{background:linear-gradient(180deg,var(--databricks),var(--barra-quente-fim))}
.sp-placar{display:flex;flex-wrap:wrap;gap:8px 18px;margin-top:12px;color:var(--suave);font-size:.86rem}
.sp-placar b{color:var(--texto);font-family:var(--mono)}
.sp-join{display:flex;gap:6px;flex-wrap:wrap;margin-bottom:14px}
.sp-join-vis{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;margin:16px 0 4px}
.sp-exec{position:relative;height:76px;border-radius:12px;border:1px solid var(--linha);background:var(--poco);overflow:hidden}
.sp-exec::before{content:"executor";position:absolute;left:8px;top:6px;font:600 .62rem/1 var(--mono);color:var(--suave);text-transform:uppercase;letter-spacing:.1em}
.sp-exec i{position:absolute;left:8px;right:8px;bottom:8px;height:calc(var(--g) * 1%);border-radius:6px;background:color-mix(in srgb,var(--azure) 35%,transparent)}
.sp-exec em{position:absolute;right:8px;top:6px;width:16px;height:16px;border-radius:4px;background:var(--python);display:var(--p,block)}
.sp-aviso{margin-top:10px;color:var(--tk-n);font-size:.86rem;min-height:1.2em}
@media (max-width:860px){.sp-grade{grid-template-columns:minmax(0,1fr)}}

/* playground */
.pg-grade{display:grid;grid-template-columns:minmax(0,1fr) 250px;gap:20px;margin-bottom:16px}
.pg-editor{min-width:0}
.pg-editor .chips-cmd{margin-bottom:12px}
.pg-editor textarea{width:100%;font:500 .9rem/1.65 var(--mono);color:var(--texto);background:var(--poco);border:1px solid var(--linha);border-radius:14px;padding:14px 16px;resize:vertical}
.pg-editor textarea:focus{outline:none;border-color:var(--azure);box-shadow:0 0 0 4px color-mix(in srgb,var(--azure) 18%,transparent)}
.pg-tempo{margin-left:auto;font:500 .78rem/1 var(--mono);color:var(--suave)}
.pg-esquema{padding:14px;border-radius:14px;background:color-mix(in srgb,var(--tinta) 2%,transparent);border:1px solid var(--linha);font-size:.8rem}
.pg-esquema ul{display:grid;gap:8px;margin-bottom:14px}
.pg-esquema li{display:flex;flex-direction:column;gap:2px}
.pg-esquema b{font-family:var(--mono);color:var(--verde)}
.pg-esquema span{color:var(--suave);font-family:var(--mono);overflow-wrap:anywhere}
@media (max-width:860px){.pg-grade{grid-template-columns:minmax(0,1fr)}}

/* custo */
.cu-grade{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);gap:24px}
.cu-controles{display:grid;gap:16px;align-content:start}
.cu-numeros{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;margin-bottom:14px}
.cu-numeros li{padding:14px;border-radius:14px;background:var(--poco);border:1px solid var(--linha);display:flex;flex-direction:column;gap:4px;min-width:0}
.cu-numeros span{color:var(--suave);font-size:.8rem}
.cu-numeros b{font:700 clamp(1.1rem,2.4vw,1.5rem)/1.1 var(--mono);letter-spacing:-.02em}
.cu-grafico{width:100%;height:auto;border-radius:14px;background:var(--poco);border:1px solid var(--linha)}
.cu-grafico .eixo{stroke:var(--linha);stroke-width:1}
.cu-grafico .curva{fill:none;stroke:var(--azure);stroke-width:2.5}
.cu-grafico .area{fill:color-mix(in srgb,var(--azure) 12%,transparent)}
.cu-grafico .melhor{fill:var(--verde)}
.cu-grafico .atual{fill:var(--databricks)}
.cu-grafico text{fill:var(--suave);font:500 9px var(--mono)}
.cu-melhor{margin-top:10px;color:var(--suave);font-size:.88rem}
.cu-melhor b{color:var(--verde)}
@media (max-width:860px){.cu-grade{grid-template-columns:minmax(0,1fr)}}

/* linhagem */
.li-grupos{display:flex;flex-wrap:wrap;gap:8px;align-items:center;margin-bottom:16px}
.li-grupos .demo-sub{margin:0 6px 0 0}
.li-mapa{overflow-x:auto;border-radius:16px;background:var(--poco);border:1px solid var(--linha);padding:10px}
.li-mapa svg{display:block;width:100%;min-width:640px;height:auto}
.li-mapa.li-vertical svg{min-width:0;max-width:420px;margin:0 auto}
.li-aresta{fill:none;stroke:var(--aresta);stroke-width:2}
.li-aresta[data-luz="true"]{stroke:var(--azure);stroke-width:3}
.li-no{cursor:pointer}
.li-no rect{fill:var(--poco-2);stroke:var(--linha);stroke-width:1.5;transition:fill .2s,stroke .2s,opacity .2s}
.li-no text{fill:var(--texto);font:600 12px var(--mono)}
.li-no .li-camada{font:700 9px var(--mono);letter-spacing:.12em;text-transform:uppercase}
.li-no[data-camada="bronze"] .li-camada{fill:var(--bronze)}.li-no[data-camada="silver"] .li-camada{fill:var(--prata)}
.li-no[data-camada="gold"] .li-camada{fill:var(--ouro)}.li-no[data-camada="painel"] .li-camada{fill:var(--verde)}
.li-no[data-luz="sel"] rect{stroke:var(--azure);stroke-width:3;fill:var(--poco-sel)}
.li-no[data-luz="sim"] rect{stroke:var(--azure)}
.li-no[data-pode="false"] rect{opacity:.45;stroke-dasharray:4 4}
.li-no[data-pode="false"] text{fill:var(--suave)}
.li-no:focus-visible{outline:none}
.li-no:focus-visible rect{stroke:var(--python);stroke-width:3}
.li-status{margin:14px 0 10px;color:var(--suave);font-size:.92rem;min-height:1.4em}
.li-grants{margin:0;padding:14px 16px;border-radius:14px;background:var(--poco);border:1px solid var(--linha);font:500 .8rem/1.7 var(--mono);color:var(--tk-s);white-space:pre-wrap;overflow-wrap:anywhere}

/* CI/CD */
.ci-topo{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:12px;margin-bottom:16px}
.ci-commit{font:500 .9rem/1.4 var(--mono);color:var(--texto)}
.ci-hash{color:var(--python);margin-right:8px}
.ci-quebras{grid-template-columns:repeat(3,minmax(0,1fr));margin-bottom:20px}
.ci-etapas{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:10px;counter-reset:e}
.ci-etapa{position:relative;display:flex;flex-direction:column;gap:6px;padding:14px;border-radius:14px;background:var(--poco);border:1px solid var(--linha);font-size:.86rem;min-width:0}
.ci-etapa b{font-size:.92rem}
.ci-etapa span{font:600 .74rem/1 var(--mono);color:var(--suave);text-transform:uppercase;letter-spacing:.08em}
.ci-etapa[data-estado="rodando"]{border-color:var(--azure)}
.ci-etapa[data-estado="rodando"] span{color:var(--azure)}
.ci-etapa[data-estado="ok"]{border-color:color-mix(in srgb,var(--ok) 60%,transparent)}
.ci-etapa[data-estado="ok"] span{color:var(--ok)}
.ci-etapa[data-estado="falhou"]{border-color:var(--erro);background:color-mix(in srgb,var(--erro) 6%,transparent)}
.ci-etapa[data-estado="falhou"] span{color:var(--erro)}
.ci-etapa[data-estado="pulada"]{opacity:.5}
.ci-log{margin-top:16px;padding:14px 16px;border-radius:14px;background:var(--poco);border:1px solid var(--linha);font:500 .8rem/1.7 var(--mono);color:var(--suave);min-height:110px}
.ci-log li{overflow-wrap:anywhere}
.ci-log li[data-tipo="ok"]{color:var(--ok)}
.ci-log li[data-tipo="erro"]{color:var(--erro)}
@media (max-width:860px){.ci-etapas{grid-template-columns:1fr 1fr}.ci-quebras{grid-template-columns:1fr}}

/* ---- trajetória ---- */
#trajetoria{--carrossel-item:min(86%,400px)}
.exp{height:100%;display:flex;flex-direction:column;gap:8px;padding:28px;border-radius:var(--raio);background:linear-gradient(180deg,var(--superficie-2),var(--superficie));
  border:1px solid color-mix(in srgb,var(--tinta) 7%,transparent);position:relative;overflow:hidden}
.exp::before{content:"";position:absolute;inset:0 0 auto;height:4px;background:linear-gradient(90deg,var(--azure),var(--roxo))}
.carrossel-trilho li:nth-child(2) .exp::before{background:linear-gradient(90deg,var(--databricks),var(--python))}
.carrossel-trilho li:nth-child(3) .exp::before{background:linear-gradient(90deg,var(--verde),var(--azure))}
.carrossel-trilho li:nth-child(4) .exp::before{background:linear-gradient(90deg,var(--python),var(--bronze))}
.carrossel-trilho li:nth-child(5) .exp::before{background:linear-gradient(90deg,var(--prata),var(--roxo))}
.exp-periodo{font:600 .8rem/1 var(--mono);color:var(--azure)}
.exp h3{font-size:1.5rem;letter-spacing:-.025em}
.exp-empresa{font-size:1.05rem}
.exp-empresa span{color:var(--suave);font-size:.9rem}
.nota-corte{margin-top:14px;font-size:.9rem;text-align:center}
.nota-corte a{color:var(--azure);font-weight:600}

/* ---- skills ---- */
.skills-grade{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}
.skill{display:flex;flex-direction:column;gap:6px;padding:22px;border-radius:20px;background:var(--superficie);border:1px solid color-mix(in srgb,var(--tinta) 7%,transparent)}
.skill .ic{font-size:1.5rem;color:var(--azure);margin-bottom:6px}
.skill:nth-child(3n+2) .ic{color:var(--databricks)}
.skill:nth-child(3n) .ic{color:var(--verde)}
.skill b{font-size:1.12rem;letter-spacing:-.01em}
@media (max-width:900px){.skills-grade{grid-template-columns:1fr 1fr}}
@media (max-width:520px){.skills-grade{grid-template-columns:1fr}}

/* ---- base ---- */
.base{position:relative;isolation:isolate;min-height:68vh;display:grid;align-items:end;padding:120px max(16px,5vw) 72px;overflow:hidden}
.base-foto{position:absolute;inset:0;z-index:-2}
.base-foto img{width:100%;height:100%;object-fit:cover;filter:var(--foto-base)}
.base::before{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(90deg,var(--base-lado),transparent 75%),linear-gradient(180deg,var(--fundo),color-mix(in srgb,var(--fundo) 20%,transparent) 40%,color-mix(in srgb,var(--fundo) 90%,transparent))}
.base-texto{max-width:1200px;margin:0 auto;width:100%}
.base h2{font-size:clamp(2.6rem,7vw,6rem);letter-spacing:-.05em}
.base p{font-size:1.2rem;color:var(--texto);margin-top:10px}

/* ---- mais ---- */
.mais-grade{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px}
.mais-cartao{position:relative;display:flex;flex-direction:column;gap:8px;height:100%;min-height:220px;padding:26px;border-radius:var(--raio);text-decoration:none;
  background:linear-gradient(180deg,var(--superficie-2),var(--superficie));border:1px solid color-mix(in srgb,var(--tinta) 7%,transparent);overflow:hidden;transition:border-color .2s}
.mais-cartao:hover{border-color:color-mix(in srgb,var(--azure) 60%,transparent)}
.mais-glifo{font:800 2.2rem/1 var(--mono);color:var(--azure);margin-bottom:auto}
.mais-grade li:nth-child(2) .mais-glifo{color:var(--databricks)}
.mais-grade li:nth-child(3) .mais-glifo{color:var(--verde)}
.mais-grade li:nth-child(4) .mais-glifo{color:var(--python)}
.mais-cartao b{font-size:1.3rem;letter-spacing:-.02em}
.mais-cartao span{color:var(--suave);font-size:.92rem}
.mais-seta{position:absolute;right:22px;top:24px;color:var(--suave)}
@media (max-width:980px){.mais-grade{grid-template-columns:1fr 1fr}}
@media (max-width:520px){.mais-grade{grid-template-columns:1fr}}

/* ---- contato ---- */
.contato{padding:0 max(16px,5vw) clamp(84px,10vw,140px)}
.contato-caixa{max-width:1200px;margin:0 auto;padding:clamp(40px,7vw,96px) clamp(22px,5vw,72px);border-radius:36px;text-align:center;position:relative;overflow:hidden;
  background:radial-gradient(ellipse at 0% 0%,color-mix(in srgb,var(--azure) 35%,transparent),transparent 55%),radial-gradient(ellipse at 100% 100%,color-mix(in srgb,var(--databricks) 30%,transparent),transparent 55%),var(--superficie);
  border:1px solid color-mix(in srgb,var(--tinta) 8%,transparent)}
.contato-code{font:500 clamp(.72rem,1.4vw,.92rem)/1.5 var(--mono);color:var(--tk-s);margin-bottom:18px;overflow-wrap:anywhere}
.contato h2{font-size:clamp(2.4rem,6vw,4.6rem);margin-bottom:12px}
.contato p{color:var(--suave)}
.contato-acoes{margin-top:30px}
.btn-gigante{min-height:62px;padding:16px 30px;font-size:1.1rem;background:var(--acento);color:var(--acento-contraste);box-shadow:0 20px 60px -18px color-mix(in srgb,var(--azure) 85%,transparent)}
.btn-gigante:hover{transform:translateY(-3px)}
.btn-seta{display:inline-flex}

/* ---- rodapé ---- */
.rodape{padding:48px max(16px,5vw) 56px;border-top:1px solid var(--linha);color:var(--suave);font-size:.84rem;display:grid;gap:10px;justify-items:center;text-align:center}
.rodape a{color:var(--texto)}
.rodape-marca{display:flex;align-items:center;gap:10px;color:var(--texto);font-weight:700;font-size:1rem}
.rodape-creditos ul{display:flex;flex-wrap:wrap;justify-content:center;gap:4px 16px}
.rodape-titulo{font:600 .74rem/1 var(--mono);text-transform:uppercase;letter-spacing:.12em;margin-bottom:8px}

/* ---- movimento (só para quem aceita) ---- */
@media (prefers-reduced-motion:no-preference){
  .esteira-trilho{animation:esteira 40s linear infinite}
  .esteira:hover .esteira-trilho{animation-play-state:paused}
  .heroi-rolar span{animation:rolar 1.8s var(--mola) infinite}
  .heroi-camadas li{animation:pulsa 3.6s ease-in-out infinite}
  .heroi-camadas li:nth-child(2){animation-delay:1.2s}
  .heroi-camadas li:nth-child(3){animation-delay:2.4s}
  .ci-etapa[data-estado="rodando"]{animation:pulsa-borda 1s ease-in-out infinite}
  .md-col[data-pulso]{animation:pulsa-col .7s var(--mola)}
}
@keyframes esteira{to{transform:translateX(-100%)}}
@keyframes rolar{0%{transform:translateY(0);opacity:1}70%{transform:translateY(14px);opacity:0}100%{opacity:0}}
@keyframes pulsa{0%,100%{box-shadow:0 0 0 0 transparent}50%{box-shadow:0 0 22px -2px currentColor}}
@keyframes pulsa-borda{50%{box-shadow:0 0 0 4px color-mix(in srgb,var(--azure) 25%,transparent)}}
@keyframes pulsa-col{40%{transform:scale(1.04)}}
