/*
Theme Name: Siscor 2026
Theme URI: https://siscor.com.br/
Author: Siscor
Description: Site institucional do Siscor (2026), feito a partir do protótipo aprovado. Só tema claro. As páginas ficam nos arquivos do tema (template-parts/paginas) e são editadas pelo Claude.
Version: 1.0.7
Requires at least: 6.5
Tested up to: 7.1
Requires PHP: 7.4
Text Domain: siscor
*/
/* Site do Siscor: fundo claro com rede animada, cartões de vidro, títulos marinho, faixas escuras de destaque. */
:root{
  --fundo:#F7FAFE; --fundo-2:#EDF5FC; --painel:#FFFFFF; --vidro:rgba(255,255,255,.82); --borda:#DCE7F3; --borda-forte:#C9D9EA;
  --titulo:#0E2A63; --texto:#1B3358; --suave:#566C8A; --fraco:#8DA0B8;
  --realce:#0090CE; --realce-2:#2E629D; --realce-claro:#E2F1FC; --realce-texto:#0B6EA8;
  --botao:#123C8C; --botao-2:#1E63C9; --sobre-botao:#FFFFFF;
  --ganha:#1C9A5E; --ganha-fundo:#E6F6EE; --perde:#DF4545; --perde-fundo:#FDECEC; --estrela:#F2B200;
  --erro:#C9302C; --ok:#1C7C4C; --ok-fundo:#E4F5EC;
  --aviso:#8F5600; --aviso-fundo:#FFF2D6; --aviso-borda:#E3A23B;
  --whats:#25D366; --sobre-whats:#FFFFFF;
  --rede:rgba(0,144,206,.28); --rede-ponto:#4BAEE3; --grade:rgba(46,98,157,.07); --brilho:rgba(0,144,206,.20);
  --sombra:0 1px 2px rgba(14,42,99,.06), 0 18px 40px -12px rgba(14,42,99,.18);
  --mostra-claro:block; --mostra-escuro:none;
  --faixa:#060B14; --faixa-2:#0A111C; --faixa-texto:#F3F6F9; --faixa-suave:#8B97A8; --faixa-fraco:#55606F; --faixa-borda:#18212C; --faixa-brilho:rgba(0,144,206,.40); --faixa-realce:#3AAAE8;
  --grad-1:#0090CE; --grad-2:#2E629D; --grad-3:#0D2A4E; --sobre-grad:#FFFFFF; --sobre-grad-fraco:rgba(255,255,255,.08); --sobre-grad-borda:rgba(255,255,255,.5); --sobre-grad-suave:rgba(255,255,255,.78); --sobre-grad-linha:rgba(255,255,255,.2);
  --verde-agua:#16A394;
  --f-texto:"Plus Jakarta Sans", "Segoe UI", system-ui, -apple-system, sans-serif;
  --f-faixa:"Geist", "Segoe UI", system-ui, sans-serif;
  --f-mono:"IBM Plex Mono", ui-monospace, Consolas, monospace;
  color-scheme:light;
}

*{box-sizing:border-box}
[hidden]{display:none !important}
html{scroll-padding-top:98px}
body{margin:0; background:var(--fundo); color:var(--texto); font:400 16px/1.6 var(--f-texto); -webkit-font-smoothing:antialiased; overflow-x:hidden}
img{max-width:100%}
a{color:var(--realce-texto)}
a:focus-visible, button:focus-visible, summary:focus-visible, select:focus-visible, input:focus-visible, textarea:focus-visible{outline:2px solid var(--realce); outline-offset:3px}
h1,h2,h3,p{margin:0}
.so-claro{display:var(--mostra-claro)}
.so-escuro{display:var(--mostra-escuro)}
.cx{max-width:1240px; margin-inline:auto; padding-inline:24px; position:relative}
.ic{width:20px; height:20px; flex:none; fill:none; stroke:currentColor; stroke-width:2; stroke-linecap:round; stroke-linejoin:round}
.rot{font:500 .72rem/1.2 var(--f-mono); letter-spacing:.16em; text-transform:uppercase; color:var(--realce-texto)}
.miudo{font-size:.84rem; color:var(--suave)}

/* ---------- cabeçalho ---------- */
.topo{position:sticky; top:env(safe-area-inset-top, 0px); z-index:50; background:var(--vidro); -webkit-backdrop-filter:blur(14px); backdrop-filter:blur(14px); border-bottom:1px solid var(--borda)}
.topo .cx{display:flex; align-items:center; gap:30px; height:80px}
.topo .logo img{height:52px; width:auto; display:block}
.topo nav{display:flex; gap:28px; margin-inline:auto}
.topo nav a{color:var(--texto); text-decoration:none; font-weight:600; font-size:.94rem; padding-block:6px; border-bottom:2px solid transparent}
.topo nav a:hover{color:var(--realce-texto)}
.topo nav a[aria-current="page"]{color:var(--realce-texto); border-bottom-color:var(--realce)}
.topo .dir{display:flex; align-items:center; gap:16px}
.entrar{color:var(--titulo); text-decoration:none; font-weight:600; font-size:.94rem; display:inline-flex; gap:6px; align-items:center}
.menu-botao{display:none; width:44px; height:44px; border-radius:10px; border:1px solid var(--borda); background:var(--painel); color:var(--titulo); cursor:pointer; align-items:center; justify-content:center}
@media (max-width: 1140px){
  .topo nav{display:none; position:absolute; left:0; right:0; top:100%; margin:0; flex-direction:column; gap:0; padding:8px 24px 16px; background:var(--painel); border-bottom:1px solid var(--borda); box-shadow:var(--sombra)}
  .topo nav.aberto{display:flex}
  .topo nav a{padding:13px 0; border-bottom:1px solid var(--borda)}
  .topo nav a[aria-current="page"]{border-bottom-color:var(--borda)}
  .topo .dir{margin-left:auto}
  .menu-botao{display:inline-flex}
}
@media (max-width: 520px){ .entrar span{display:none} .topo .logo img{height:36px} .topo .cx{gap:12px} .topo .dir{gap:10px} .topo .btn.peq{padding:0 12px} }
body.modo-landing .topo nav, body.modo-landing .menu-botao, body.modo-landing .topo .btn{display:none}
body.modo-landing .topo .dir{margin-left:auto}

/* ---------- botões ---------- */
.btn{display:inline-flex; align-items:center; justify-content:center; gap:12px; height:54px; padding:0 26px; border-radius:10px; font:800 .92rem/1 var(--f-texto); letter-spacing:.04em; text-transform:uppercase; text-decoration:none; cursor:pointer; border:1.5px solid transparent; transition:transform .15s, box-shadow .15s, background .15s, border-color .15s; white-space:nowrap}
.btn .ic{width:18px; height:18px; stroke-width:2.4}
.btn.prim{background:linear-gradient(135deg, var(--botao), var(--botao-2)); color:var(--sobre-botao); box-shadow:0 10px 24px -8px var(--brilho)}
.btn.prim:hover{transform:translateY(-1px); box-shadow:0 14px 30px -8px var(--brilho)}
.btn.sec{background:var(--painel); color:var(--titulo); border-color:var(--borda-forte)}
.btn.sec:hover{border-color:var(--realce)}
.btn.whats{background:var(--whats); color:var(--sobre-whats)}
.btn.peq{height:42px; padding:0 18px; font-size:.82rem}
.btn.largo{width:100%}
.whats-redondo{width:54px; height:54px; border-radius:50%; display:grid; place-items:center; background:var(--whats); color:var(--sobre-whats); text-decoration:none; box-shadow:0 10px 24px -10px rgba(37,211,102,.7); transition:transform .15s; flex:none}
.whats-redondo:hover{transform:translateY(-1px)}
.whats-redondo svg, .btn.whats svg.wa{width:24px; height:24px; fill:currentColor; stroke:none}
.acoes{display:flex; align-items:center; gap:14px; flex-wrap:wrap}
.link-seta{display:inline-flex; align-items:center; gap:8px; font-weight:700; color:var(--realce-texto); text-decoration:none}
.link-seta:hover{text-decoration:underline}
.link-seta .ic{width:17px; height:17px}
.selo{display:inline-flex; align-items:center; gap:6px; padding:6px 11px; border-radius:999px; font:800 .7rem/1 var(--f-texto); letter-spacing:.08em; text-transform:uppercase; background:var(--realce-claro); color:var(--realce-texto); border:1px solid var(--borda)}
.selo.forte{background:linear-gradient(135deg, var(--botao), var(--botao-2)); color:var(--sobre-botao); border-color:transparent}

/* ---------- fundo tecnológico ---------- */
.rede{position:absolute; inset:0; width:100%; height:100%; display:block; pointer-events:none}
.grade-fundo{position:absolute; inset:0; pointer-events:none; background-image:linear-gradient(var(--grade) 1px, transparent 1px), linear-gradient(90deg, var(--grade) 1px, transparent 1px); background-size:44px 44px; -webkit-mask-image:radial-gradient(ellipse 75% 70% at 70% 35%, #000 30%, transparent 75%); mask-image:radial-gradient(ellipse 75% 70% at 70% 35%, #000 30%, transparent 75%)}

/* ---------- seções genéricas ---------- */
.secao{position:relative; padding-block:clamp(64px, 9vw, 110px)}
.secao.alt{background:var(--fundo-2); border-block:1px solid var(--borda)}
.cab-secao{display:grid; gap:12px; max-width:760px; margin-bottom:clamp(30px, 4vw, 48px)}
.cab-secao.centro{margin-inline:auto; text-align:center; justify-items:center}
.cab-secao h2, .h2{font-size:clamp(1.8rem, 3.4vw, 2.6rem); font-weight:800; letter-spacing:-.025em; line-height:1.1; color:var(--titulo); text-wrap:balance}
.cab-secao p{color:var(--suave); font-size:1.04rem; max-width:62ch}

/* ---------- topo das páginas internas ---------- */
.pag-heroi{position:relative; overflow:hidden; background:radial-gradient(ellipse 60% 70% at 85% 20%, var(--realce-claro), transparent 70%), var(--fundo); border-bottom:1px solid var(--borda)}
.pag-heroi .cx{display:grid; grid-template-columns:minmax(0, 1fr) minmax(0, 1fr); gap:48px; align-items:center; padding-block:clamp(48px, 7vw, 92px)}
.pag-heroi.centro .cx{grid-template-columns:minmax(0, 1fr); justify-items:center; text-align:center}
.pag-heroi .texto{display:grid; gap:20px; align-content:start; position:relative; z-index:2}
.pag-heroi.centro .texto{justify-items:center; max-width:820px}
.pag-heroi h1{font-weight:800; font-size:clamp(2.2rem, 4.4vw, 3.4rem); line-height:1.06; letter-spacing:-.03em; color:var(--titulo); text-wrap:balance}
.pag-heroi .lead{font-size:clamp(1.02rem, 1.4vw, 1.14rem); line-height:1.65; color:var(--texto); max-width:56ch}
.pag-heroi .visual{position:relative; z-index:2; min-width:0}
@media (max-width: 1140px){ .pag-heroi .cx{grid-template-columns:minmax(0, 1fr)} }

/* ---------- chamada da Início ---------- */
.chamada{position:relative; overflow:hidden; background:radial-gradient(ellipse 60% 70% at 85% 20%, var(--realce-claro), transparent 70%), var(--fundo)}
.chamada .cx{display:grid; grid-template-columns:minmax(0, 1.02fr) minmax(0, 1fr); gap:48px; align-items:center; padding-block:clamp(48px, 7vw, 88px) clamp(56px, 8vw, 96px)}
.chamada-texto{display:grid; gap:22px; align-content:start; position:relative; z-index:2}
.chamada h1{font-weight:800; font-size:clamp(2.4rem, 4.4vw, 3.5rem); line-height:1.06; letter-spacing:-.03em; color:var(--titulo); text-wrap:balance}
.chamada .lead{font-size:clamp(1.02rem, 1.4vw, 1.14rem); line-height:1.65; color:var(--texto); max-width:52ch}
.vantagens{list-style:none; margin:2px 0 0; padding:0; display:grid; gap:12px}
.vantagens li{display:flex; gap:12px; align-items:center; font-weight:600; color:var(--texto)}
.vantagens .ck{width:24px; height:24px; border-radius:50%; display:grid; place-items:center; background:var(--botao); color:var(--sobre-botao); flex:none}
.vantagens .ck svg{width:13px; height:13px; stroke-width:3.2}
.pilula-novo{display:inline-flex; align-items:center; gap:12px; justify-self:start; padding:9px 18px 9px 9px; border-radius:999px; background:var(--realce-claro); border:1px solid var(--borda); color:var(--texto); text-decoration:none; font-size:.95rem}
.pilula-novo .estrela{width:28px; height:28px; border-radius:50%; display:grid; place-items:center; background:var(--botao); color:var(--sobre-botao); flex:none}
.pilula-novo .estrela svg{width:15px; height:15px; fill:currentColor; stroke:none}
.pilula-novo b{color:var(--titulo); font-weight:800}
.pilula-novo:hover{border-color:var(--realce)}
.garantia{display:flex; gap:8px; align-items:center; font-size:.84rem; color:var(--suave)}
.garantia svg{width:16px; height:16px}
@media (max-width: 1140px){ .chamada .cx{grid-template-columns:minmax(0, 1fr)} }
.composicao{position:relative; z-index:2; display:grid; grid-template-columns:repeat(12, minmax(0, 1fr)); gap:16px; align-items:start}
.cartao{background:var(--vidro); -webkit-backdrop-filter:blur(10px); backdrop-filter:blur(10px); border:1px solid var(--borda); border-radius:16px; box-shadow:var(--sombra); padding:18px; min-width:0}
.cartao h3{margin:0 0 12px; font-size:.95rem; font-weight:800; color:var(--titulo)}
.c-tabela{grid-column:1 / 8}
.c-tempo{grid-column:8 / 13; margin-top:34px}
.c-ganha{grid-column:1 / 7; margin-top:-6px}
.c-relat{grid-column:7 / 13; margin-top:-26px}
.c-amb{grid-column:1 / 13; margin-top:-4px; position:relative; padding-top:22px}
@media (prefers-reduced-motion: no-preference){
  .flutua{animation:flutua 7s ease-in-out infinite}
  .flutua.d1{animation-delay:-2s} .flutua.d2{animation-delay:-4s} .flutua.d3{animation-delay:-1s} .flutua.d4{animation-delay:-5s}
  @keyframes flutua{ 0%,100%{transform:translateY(0)} 50%{transform:translateY(-7px)} }
}
.tab{width:100%; border-collapse:separate; border-spacing:0; font-size:.8rem}
.tab th{font-weight:700; font-size:.72rem; color:var(--sobre-botao); padding:7px 6px; text-align:center}
.tab th.pa{background:var(--realce); border-radius:6px 0 0 0}
.tab th.pb{background:var(--verde-agua)}
.tab th.pc{background:var(--realce-2); border-radius:0 6px 0 0}
.tab td{padding:7px 6px; border-bottom:1px solid var(--borda); text-align:center; color:var(--texto)}
.tab td:first-child{text-align:left; display:flex; gap:7px; align-items:center; font-weight:600; white-space:nowrap}
.tab td:first-child .ic{width:15px; height:15px; color:var(--realce-texto)}
.tab tr:last-child td{border-bottom:0}
.sim{color:var(--ganha); font-weight:800}
.nao{color:var(--fraco)}
.estrelas{color:var(--estrela); letter-spacing:.02em; white-space:nowrap; font-size:.72rem}
.estrelas i{font-style:normal; color:var(--borda-forte)}
.c-tempo .topo-cartao{display:flex; gap:12px; align-items:center}
.relogio{width:46px; height:46px; border-radius:50%; display:grid; place-items:center; border:2px solid var(--realce); color:var(--realce); flex:none}
.relogio .ic{width:24px; height:24px}
.c-tempo h3{margin:0}
.c-tempo p{margin:10px 0 0; font-size:.8rem; color:var(--suave); line-height:1.4}
.subida{position:relative; display:flex; align-items:flex-end; gap:6px; height:78px; margin-top:12px}
.subida span{flex:1; border-radius:3px 3px 0 0; background:linear-gradient(to top, var(--realce-claro), var(--realce))}
.subida svg{position:absolute; inset:0; width:100%; height:100%; overflow:visible}
.subida svg path{fill:none; stroke:var(--botao-2); stroke-width:2.2; stroke-linecap:round; stroke-linejoin:round}
.gp{display:grid; grid-template-columns:1fr 1fr; gap:10px}
.gp > div{border-radius:10px; padding:10px; position:relative; min-width:0}
.gp .g{background:var(--ganha-fundo)} .gp .p{background:var(--perde-fundo)}
.gp b{display:flex; align-items:center; gap:6px; font-size:.82rem; margin-bottom:6px}
.gp .g b{color:var(--ganha)} .gp .p b{color:var(--perde)}
.gp b .bola{width:18px; height:18px; border-radius:50%; display:grid; place-items:center; color:var(--sobre-botao)}
.gp .g .bola{background:var(--ganha)} .gp .p .bola{background:var(--perde)}
.gp b .bola svg{width:11px; height:11px; stroke-width:3.4}
.gp ul{list-style:none; margin:0; padding:0; display:grid; gap:4px; font-size:.74rem; color:var(--texto)}
.gp li::before{content:"•"; margin-right:6px}
.gp .g li::before{color:var(--ganha)} .gp .p li::before{color:var(--perde)}
.gp .seta{position:absolute; right:10px; bottom:10px; width:22px; height:30px}
.gp .g .seta{color:var(--ganha)} .gp .p .seta{color:var(--perde)}
.gp .seta path{fill:none; stroke:currentColor; stroke-width:2.6; stroke-linecap:round; stroke-linejoin:round}
.relat{display:grid; grid-template-columns:86px 1fr; gap:14px; align-items:center}
.relat svg.rosca{width:86px; height:86px}
.relat .linhas{display:grid; gap:9px}
.relat .linhas i{display:block; height:6px; border-radius:3px; background:var(--borda)}
.relat .linhas i b{display:block; height:100%; border-radius:3px; background:var(--realce)}
.mini-barras{display:flex; align-items:flex-end; gap:5px; height:46px; margin-top:12px}
.mini-barras span{flex:1; border-radius:2px 2px 0 0; background:var(--realce-2)}
.mini-barras span:nth-child(odd){background:var(--realce)}
.fita{position:absolute; top:-12px; left:-6px; background:var(--botao); color:var(--sobre-botao); font:800 .72rem/1 var(--f-texto); letter-spacing:.08em; padding:7px 12px; border-radius:6px 6px 6px 0; box-shadow:0 6px 14px -6px var(--brilho)}
.amb{display:grid; grid-template-columns:auto minmax(0, 1.15fr) minmax(0, 1fr); gap:18px; align-items:center}
.amb .maleta{width:64px; height:64px; border-radius:50%; display:grid; place-items:center; background:linear-gradient(135deg, var(--botao), var(--botao-2)); color:var(--sobre-botao)}
.amb .maleta .ic{width:30px; height:30px}
.amb h3{margin:0 0 4px; font-size:1.02rem}
.amb p{font-size:.78rem; color:var(--suave); line-height:1.45}
.amb ul{list-style:none; margin:0; padding:0; display:grid; grid-template-columns:1fr 1fr; gap:10px 14px; font-size:.76rem; color:var(--texto)}
.amb li{display:flex; gap:8px; align-items:center; line-height:1.3}
.amb li .ic{width:22px; height:22px; color:var(--realce-texto); stroke-width:1.7}
@media (max-width: 1140px){ .composicao{max-width:720px; margin-inline:auto; width:100%} }
@media (max-width: 640px){
  .composicao{grid-template-columns:minmax(0, 1fr)}
  .c-tabela, .c-tempo, .c-ganha, .c-relat, .c-amb{grid-column:1 / -1; margin-top:0}
  .c-relat{display:none}
  .amb{grid-template-columns:auto minmax(0, 1fr)}
  .amb ul{grid-column:1 / -1}
}

/* ---------- logos (faixas e grade) ---------- */
.marquise{position:relative; overflow:hidden; -webkit-mask-image:linear-gradient(90deg, transparent, #000 10%, #000 90%, transparent); mask-image:linear-gradient(90deg, transparent, #000 10%, #000 90%, transparent)}
.trilho{display:flex; gap:18px; width:max-content; padding-block:10px}
.logo-cartao{display:grid; place-items:center; width:220px; height:104px; border-radius:16px; background:var(--painel); border:1px solid var(--borda); transition:border-color .2s, transform .2s, box-shadow .2s; flex:none}
.logo-cartao:hover{border-color:var(--realce); transform:translateY(-3px); box-shadow:var(--sombra)}
.logo-cartao img{max-width:150px; max-height:46px; width:auto; height:auto; object-fit:contain}
.marquise.menor .logo-cartao{width:200px; height:88px}
.marquise.menor .logo-cartao img{max-height:40px}
@media (prefers-reduced-motion: no-preference){
  .trilho{animation:rola 46s linear infinite}
  .marquise.inverte .trilho{animation-duration:38s; animation-direction:reverse}
  .marquise:hover .trilho{animation-play-state:paused}
  @keyframes rola{ to{transform:translateX(calc(-50% - 9px))} }
}
@media (prefers-reduced-motion: reduce){ .trilho{flex-wrap:wrap; width:auto; justify-content:center} .trilho .dup{display:none} }
.clientes-cab{display:flex; justify-content:space-between; align-items:flex-end; gap:20px; flex-wrap:wrap; margin-bottom:34px}
.clientes-cab p{color:var(--suave); max-width:44ch}

/* ---------- faixa escura (direção A) ---------- */
.estudos{position:relative; overflow:hidden; background:var(--faixa); color:var(--faixa-texto); font-family:var(--f-faixa); padding-block:clamp(80px, 11vw, 130px)}
.estudos::before{content:""; position:absolute; left:50%; top:-180px; width:1100px; max-width:140%; height:420px; transform:translateX(-50%); background:radial-gradient(closest-side, var(--faixa-brilho), transparent); filter:blur(30px); pointer-events:none}
.linhas-fundo{position:absolute; inset:0; pointer-events:none; background-image:linear-gradient(var(--faixa-borda) 1px, transparent 1px), linear-gradient(90deg, var(--faixa-borda) 1px, transparent 1px); background-size:64px 64px; opacity:.55; -webkit-mask-image:radial-gradient(ellipse 70% 60% at 50% 0%, #000 20%, transparent 75%); mask-image:radial-gradient(ellipse 70% 60% at 50% 0%, #000 20%, transparent 75%)}
.estudos .rot{color:var(--faixa-fraco); display:block; margin-bottom:22px}
.estudos .tese{position:relative; font-size:clamp(1.6rem, 3.4vw, 2.6rem); line-height:1.16; letter-spacing:-.03em; font-weight:520; max-width:30ch; color:var(--faixa-suave)}
.estudos .tese b{color:var(--faixa-texto); font-weight:520}
.tres{position:relative; display:grid; grid-template-columns:repeat(3, minmax(0, 1fr)); margin-top:64px; border-top:1px solid var(--faixa-borda)}
.tres > div{padding:30px 30px 10px 0; display:grid; gap:10px; align-content:start}
.tres > div + div{border-left:1px solid var(--faixa-borda); padding-left:30px}
.tres svg{width:100%; max-width:240px; height:150px; margin-bottom:12px}
.tres svg *{fill:none; stroke:var(--faixa-fraco); stroke-width:1}
.tres svg .r{stroke:var(--faixa-realce)}
.tres svg .p{fill:var(--faixa-fraco); stroke:none}
.tres svg .pr{fill:var(--faixa-realce); stroke:none}
.tres h3{font-size:1rem; font-weight:560}
.tres p{color:var(--faixa-suave); font-size:.94rem; max-width:34ch}
@media (prefers-reduced-motion: no-preference){ .tres svg .pulso{animation:pulso 2.6s ease-in-out infinite; transform-origin:130px 75px} @keyframes pulso{ 0%,100%{opacity:.4; transform:scale(.9)} 50%{opacity:1; transform:scale(1.15)} } }
@media (max-width: 760px){ .tres{grid-template-columns:minmax(0, 1fr)} .tres > div + div{border-left:0; padding-left:0; border-top:1px solid var(--faixa-borda)} }
.numeros-faixa{position:relative; display:grid; grid-template-columns:repeat(3, minmax(0, 1fr)); gap:0}
.numeros-faixa div{padding:8px 24px; border-left:1px solid var(--faixa-borda); display:grid; gap:6px}
.numeros-faixa div:first-child{border-left:0; padding-left:0}
.numeros-faixa b{font-size:clamp(2rem, 4vw, 3.1rem); font-weight:600; letter-spacing:-.03em; line-height:1}
.numeros-faixa span{font:400 .72rem/1.3 var(--f-mono); letter-spacing:.12em; text-transform:uppercase; color:var(--faixa-suave)}
@media (max-width: 760px){ .numeros-faixa{grid-template-columns:repeat(2, minmax(0, 1fr)); row-gap:28px} .numeros-faixa div:nth-child(3){border-left:0; padding-left:0} }

/* ---------- depoimentos ---------- */
.depos h2 span{display:block; color:var(--fraco)}
.grad{margin:0; border-radius:16px; padding:32px; display:flex; flex-direction:column; justify-content:space-between; gap:40px; min-height:380px; background:linear-gradient(140deg, var(--grad-1), var(--grad-2) 55%, var(--grad-3)); color:var(--sobre-grad); position:relative; overflow:hidden}
.grad::after{content:""; position:absolute; right:-120px; top:-120px; width:340px; height:340px; border-radius:50%; border:40px solid var(--sobre-grad-fraco); pointer-events:none}
.grad img.emp{height:34px; width:auto; align-self:flex-start; position:relative}
.grad blockquote{margin:0; font-size:clamp(1.06rem, 1.8vw, 1.36rem); line-height:1.5; font-weight:600; max-width:48ch; position:relative}
.grad figcaption{display:flex; gap:12px; align-items:center; font-size:.9rem; position:relative}
.grad figcaption img{width:44px; height:44px; border-radius:50%; border:2px solid var(--sobre-grad-borda)}
.avatar{width:44px; height:44px; border-radius:50%; display:grid; place-items:center; background:var(--realce-claro); color:var(--realce-texto); font:700 .9rem/1 var(--f-mono); flex:none}

/* ---------- cartões de recurso e passos ---------- */
.grade-3{display:grid; grid-template-columns:repeat(3, minmax(0, 1fr)); gap:18px}
.grade-2{display:grid; grid-template-columns:repeat(2, minmax(0, 1fr)); gap:18px}
.grade-4{display:grid; grid-template-columns:repeat(4, minmax(0, 1fr)); gap:18px}
@media (max-width: 960px){ .grade-3, .grade-4{grid-template-columns:repeat(2, minmax(0, 1fr))} }
@media (max-width: 640px){ .grade-3, .grade-2, .grade-4{grid-template-columns:minmax(0, 1fr)} }
.recurso{background:var(--painel); border:1px solid var(--borda); border-radius:16px; padding:26px; display:flex; flex-direction:column; gap:12px; min-width:0; transition:border-color .2s, transform .2s, box-shadow .2s}
.recurso:hover{border-color:var(--realce); transform:translateY(-3px); box-shadow:var(--sombra)}
.icone{width:50px; height:50px; border-radius:14px; display:grid; place-items:center; background:linear-gradient(135deg, var(--botao), var(--botao-2)); color:var(--sobre-botao); box-shadow:0 10px 20px -10px var(--brilho)}
.icone .ic{width:24px; height:24px}
.recurso h3{font-size:1.1rem; font-weight:800; color:var(--titulo); line-height:1.25}
.recurso p{color:var(--suave); font-size:.95rem}
.recurso ul{margin:0; padding:0; list-style:none; display:grid; gap:7px; color:var(--texto); font-size:.93rem}
.recurso li{display:grid; grid-template-columns:18px 1fr; gap:8px}
.recurso li::before{content:"✓"; color:var(--ganha); font-weight:800}
.passos{display:grid; grid-template-columns:repeat(3, minmax(0, 1fr)); gap:18px; counter-reset:p; list-style:none; margin:0; padding:0; position:relative}
.passos li{counter-increment:p; background:var(--painel); border:1px solid var(--borda); border-radius:16px; padding:26px; display:grid; gap:10px; align-content:start; position:relative}
.passos li::before{content:counter(p, decimal-leading-zero); font-size:3rem; font-weight:800; line-height:1; letter-spacing:-.03em; background:linear-gradient(135deg, var(--realce), var(--botao)); -webkit-background-clip:text; background-clip:text; color:transparent}
.passos h3{font-size:1.1rem; font-weight:800; color:var(--titulo)}
.passos p{color:var(--suave); font-size:.95rem}
@media (max-width: 860px){ .passos{grid-template-columns:minmax(0, 1fr)} }

/* ---------- telas do sistema ---------- */
.quadro-tela{position:relative; border-radius:16px; overflow:hidden; border:1px solid var(--borda-forte); box-shadow:0 30px 70px -24px rgba(14,42,99,.35); background:var(--painel); line-height:0}
.quadro-tela img{width:100%; height:auto}
.quadro-tela img.so-claro{display:var(--mostra-claro)}
.quadro-tela img.so-escuro{display:var(--mostra-escuro)}
.visual-tela{position:relative; padding:10px}
.visual-tela .flutuante{position:absolute; z-index:3; padding:12px 14px; display:flex; gap:10px; align-items:center; font-size:.82rem; font-weight:700; color:var(--titulo)}
.visual-tela .flutuante .bola{width:30px; height:30px; border-radius:50%; display:grid; place-items:center; color:var(--sobre-botao); flex:none}
.visual-tela .flutuante .bola .ic{width:16px; height:16px; stroke-width:2.6}
.visual-tela .f1{left:-14px; bottom:12%} .visual-tela .f1 .bola{background:var(--ganha)}
.visual-tela .f2{right:-10px; top:10%} .visual-tela .f2 .bola{background:linear-gradient(135deg, var(--botao), var(--botao-2))}
.visual-tela .f2 small, .visual-tela .f1 small{display:block; font-weight:500; color:var(--suave); font-size:.74rem}
@media (max-width: 640px){ .visual-tela .flutuante{display:none} }
.abas-botoes{display:flex; gap:8px; flex-wrap:wrap; margin-bottom:22px}
.abas-botoes button{font:700 .88rem/1 var(--f-texto); padding:11px 18px; border-radius:999px; border:1px solid var(--borda); background:var(--painel); color:var(--suave); cursor:pointer}
.abas-botoes button:hover{color:var(--titulo)}
.abas-botoes button[aria-selected="true"]{background:linear-gradient(135deg, var(--botao), var(--botao-2)); border-color:transparent; color:var(--sobre-botao)}

/* módulo em destaque */
.destaque-modulo{display:grid; grid-template-columns:minmax(0, .9fr) minmax(0, 1.2fr); gap:48px; align-items:center}
.destaque-modulo .texto{display:grid; gap:16px; align-content:start}
.lista-check{list-style:none; margin:0; padding:0; display:grid; gap:10px}
.lista-check li{display:flex; gap:12px; align-items:center; font-weight:600}
.lista-check .ck{width:24px; height:24px; border-radius:50%; display:grid; place-items:center; background:var(--ganha-fundo); color:var(--ganha); flex:none}
.lista-check .ck svg{width:13px; height:13px; stroke-width:3.2}
@media (max-width: 960px){ .destaque-modulo{grid-template-columns:minmax(0, 1fr)} }

/* vídeo */
.video{position:relative; display:grid; place-items:center; aspect-ratio:16/9; max-width:100%; border-radius:16px; overflow:hidden; text-decoration:none; color:var(--sobre-grad); background:linear-gradient(140deg, var(--grad-1), var(--grad-2) 55%, var(--grad-3)); box-shadow:var(--sombra)}
.video::after{content:""; position:absolute; right:-90px; bottom:-90px; width:300px; height:300px; border-radius:50%; border:36px solid var(--sobre-grad-fraco)}
.video .play{position:relative; z-index:1; width:84px; height:84px; border-radius:50%; display:grid; place-items:center; background:var(--sobre-grad); color:var(--grad-2); box-shadow:0 16px 40px -10px rgba(0,0,0,.4); transition:transform .2s}
.video:hover .play{transform:scale(1.06)}
.video .play svg{width:32px; height:32px; fill:currentColor; margin-left:4px}
.video .titulo{position:absolute; left:26px; top:22px; font-weight:800; font-size:clamp(1.3rem, 2.6vw, 1.9rem); line-height:1.1; max-width:14ch}
.video .cap{position:absolute; left:26px; bottom:20px; font:500 .74rem/1 var(--f-mono); letter-spacing:.12em; text-transform:uppercase; color:var(--sobre-grad-suave)}

/* perguntas */
.perguntas{display:grid; gap:12px; max-width:880px}
.perguntas details{background:var(--painel); border:1px solid var(--borda); border-radius:14px; padding:0 22px; transition:border-color .2s}
.perguntas details[open]{border-color:var(--realce)}
.perguntas summary{cursor:pointer; list-style:none; display:flex; justify-content:space-between; gap:16px; padding:19px 0; font-weight:700; color:var(--titulo)}
.perguntas summary::-webkit-details-marker{display:none}
.perguntas summary::after{content:"+"; font:600 1.4rem/1 var(--f-texto); color:var(--realce-texto)}
.perguntas details[open] summary::after{content:"−"}
.perguntas .resp{padding:0 0 20px; color:var(--suave); display:grid; gap:10px}

/* ---------- planos ---------- */
.planos{display:grid; grid-template-columns:repeat(3, minmax(0, 1fr)); gap:20px; align-items:start}
.plano{background:var(--painel); border:1px solid var(--borda); border-radius:18px; padding:30px; display:flex; flex-direction:column; gap:20px; position:relative; min-width:0; box-shadow:var(--sombra)}
.plano.destaque{border:2px solid transparent; background:linear-gradient(var(--painel), var(--painel)) padding-box, linear-gradient(135deg, var(--grad-1), var(--botao)) border-box; transform:translateY(-10px)}
.plano .selo{position:absolute; top:-13px; left:28px}
.plano h3{font-size:1.4rem; font-weight:800; color:var(--titulo)}
.creditos{display:flex; align-items:baseline; gap:10px}
.creditos b{font-size:3.4rem; font-weight:800; line-height:1; letter-spacing:-.03em; color:var(--titulo); font-variant-numeric:tabular-nums}
.creditos span{color:var(--suave); line-height:1.3}
.usuarios{font:500 .74rem/1 var(--f-mono); letter-spacing:.12em; text-transform:uppercase; color:var(--suave); padding-bottom:18px; border-bottom:1px solid var(--borda)}
.recursos{list-style:none; margin:0; padding:0; display:grid; gap:10px; font-size:.93rem}
.recursos li{display:grid; grid-template-columns:22px 1fr; gap:10px; align-items:start}
.recursos .ic{width:20px; height:20px; color:var(--ganha); stroke-width:2.6}
.recursos li.fora{color:var(--fraco)}
.recursos li.fora .ic{color:var(--borda-forte)}
.plano .btn{margin-top:auto}
@media (max-width: 960px){ .planos{grid-template-columns:minmax(0, 1fr); max-width:520px; margin-inline:auto} .plano.destaque{transform:none} }
.modulo-adicional{position:relative; overflow:hidden; display:grid; grid-template-columns:auto minmax(0, 1fr) auto; gap:24px; align-items:center; border-radius:18px; padding:30px; background:linear-gradient(140deg, var(--grad-1), var(--grad-2) 55%, var(--grad-3)); color:var(--sobre-grad)}
.modulo-adicional::after{content:""; position:absolute; right:-80px; top:-110px; width:280px; height:280px; border-radius:50%; border:34px solid var(--sobre-grad-fraco)}
.modulo-adicional .maleta{width:64px; height:64px; border-radius:50%; display:grid; place-items:center; background:var(--sobre-grad-fraco); border:1px solid var(--sobre-grad-borda)}
.modulo-adicional .maleta .ic{width:30px; height:30px}
.modulo-adicional h3{font-size:1.4rem; font-weight:800}
.modulo-adicional p{color:var(--sobre-grad-suave); margin-top:6px; max-width:60ch}
.modulo-adicional .btn{position:relative; z-index:1; background:var(--sobre-grad); color:var(--grad-2)}
@media (max-width: 760px){ .modulo-adicional{grid-template-columns:minmax(0, 1fr)} }
.tabela{overflow-x:auto; border:1px solid var(--borda); border-radius:16px; background:var(--painel)}
.tabela table{width:100%; min-width:640px; border-collapse:collapse; font-size:.95rem}
.tabela th, .tabela td{padding:14px 20px; border-bottom:1px solid var(--borda); text-align:center}
.tabela th:first-child, .tabela td:first-child{text-align:left}
.tabela thead th{font-weight:800; color:var(--titulo); background:var(--fundo-2)}
.tabela tr:last-child td{border-bottom:0}
.tabela .ic{width:20px; height:20px; vertical-align:-5px; stroke-width:2.6}
.tabela .mono{font-family:var(--f-mono); font-variant-numeric:tabular-nums}

/* ---------- números e sobre ---------- */
.estatisticas{display:grid; grid-template-columns:repeat(3, minmax(0, 1fr)); gap:14px; width:100%; max-width:640px; margin-inline:auto}
.estatistica{padding:20px; display:grid; gap:4px; text-align:left}
.estatistica b{font-size:clamp(1.5rem, 2.6vw, 2.1rem); font-weight:800; letter-spacing:-.03em; line-height:1; color:var(--titulo); white-space:nowrap}
.estatistica span{font-size:.86rem; color:var(--suave)}
@media (max-width: 760px){ .estatisticas{grid-template-columns:repeat(2, minmax(0, 1fr))} .estatisticas > :last-child:nth-child(odd){grid-column:1 / -1} }
.esfera{position:relative; aspect-ratio:1/1; max-width:440px; width:100%; margin-inline:auto; display:grid; place-items:center}
.esfera::before, .esfera::after{content:""; position:absolute; border-radius:50%; border:2px solid var(--borda-forte)}
.esfera::before{inset:4%}
.esfera::after{inset:18%; border-style:dashed; border-color:var(--realce)}
@media (prefers-reduced-motion: no-preference){ .esfera::after{animation:gira 40s linear infinite} @keyframes gira{ to{transform:rotate(360deg)} } }
.esfera img{width:46%; height:auto; position:relative; filter:drop-shadow(0 20px 40px var(--brilho))}
.esfera .ano{position:absolute; bottom:6%; left:50%; transform:translateX(-50%); padding:10px 18px; font-weight:800; font-size:1.05rem; color:var(--titulo); white-space:nowrap}

/* ---------- formulários e contato ---------- */
.form-cartao{background:var(--vidro); -webkit-backdrop-filter:blur(10px); backdrop-filter:blur(10px); border:1px solid var(--borda); border-radius:18px; padding:clamp(24px, 3vw, 34px); box-shadow:var(--sombra); display:grid; gap:18px; min-width:0}
.form-cartao h2{font-size:1.5rem; font-weight:800; color:var(--titulo)}
form{display:grid; gap:16px}
.campos-2{display:grid; grid-template-columns:repeat(2, minmax(0, 1fr)); gap:16px}
@media (max-width: 560px){ .campos-2{grid-template-columns:minmax(0, 1fr)} }
.campo{display:grid; gap:6px; min-width:0}
.campo label{font-weight:700; font-size:.88rem; color:var(--titulo)}
.campo label .opc{font-weight:500; color:var(--fraco)}
.campo input:not([type=checkbox]):not([type=file]), .campo select, .campo textarea{width:100%; min-height:50px; padding:12px 14px; border:1.5px solid var(--borda); border-radius:10px; background:var(--painel); color:var(--texto); font:500 1rem/1.4 var(--f-texto); transition:border-color .15s, box-shadow .15s}
.campo input:focus, .campo select:focus, .campo textarea:focus{outline:none; border-color:var(--realce); box-shadow:0 0 0 4px var(--realce-claro)}
.campo textarea{min-height:110px; resize:vertical}
.campo input[type=file]{font:500 .9rem var(--f-texto); color:var(--suave); padding:12px; border:1.5px dashed var(--borda-forte); border-radius:10px; background:var(--painel)}
.campo.invalido input, .campo.invalido select, .campo.invalido textarea{border-color:var(--erro)}
.msg-erro{font-size:.84rem; color:var(--erro); font-weight:600}
.aceite{display:grid; grid-template-columns:20px 1fr; gap:10px; align-items:start; font-size:.9rem; color:var(--suave); font-weight:500 !important}
.aceite input{width:18px; height:18px; margin-top:3px; accent-color:var(--botao)}
.sucesso{display:grid; gap:8px; padding:20px; border-radius:12px; background:var(--ok-fundo); color:var(--ok)}
.sucesso b{font-size:1.08rem}
.sucesso p{color:var(--texto)}
.canais{display:grid; gap:12px}
.canal{display:grid; grid-template-columns:48px 1fr; gap:14px; align-items:center; padding:16px; background:var(--painel); border:1px solid var(--borda); border-radius:14px}
.canal .icone{width:48px; height:48px; border-radius:12px; color:var(--sobre-botao)}
.canal .icone.verde{background:var(--whats); color:var(--sobre-whats)}
.canal b{display:block; color:var(--titulo); font-size:1rem}
.canal span{color:var(--suave); font-size:.88rem}
.caixa-info{padding:20px; border-radius:14px; background:var(--realce-claro); border:1px solid var(--borda); display:grid; gap:6px; color:var(--texto)}
.caixa-info b{color:var(--titulo)}
.duas-colunas{display:grid; grid-template-columns:minmax(0, 1fr) minmax(0, 1.05fr); gap:48px; align-items:start}
@media (max-width: 960px){ .duas-colunas{grid-template-columns:minmax(0, 1fr)} }

/* vagas */
.vagas{display:grid; gap:12px}
.vagas .vaga{background:var(--painel); border:1px solid var(--borda); border-radius:14px; padding:18px 22px; font-weight:800; color:var(--titulo)}
.vagas .vaga .area{font:500 .72rem/1.2 var(--f-mono); letter-spacing:.1em; text-transform:uppercase; color:var(--realce-texto); display:block; margin-bottom:4px}

/* texto longo */
.leitura{display:grid; grid-template-columns:240px minmax(0, 1fr); gap:56px; align-items:start}
.indice{position:sticky; top:104px; display:grid; gap:4px; padding:18px; border:1px solid var(--borda); border-radius:14px; background:var(--painel)}
.indice b{font:500 .7rem/1.2 var(--f-mono); letter-spacing:.14em; text-transform:uppercase; color:var(--fraco); margin-bottom:6px}
.indice a{color:var(--texto); text-decoration:none; font-size:.9rem; padding:6px 8px; border-radius:8px}
.indice a:hover{background:var(--realce-claro); color:var(--realce-texto)}
.texto-longo{display:grid; gap:16px; max-width:760px}
.texto-longo h2{font-size:1.4rem; font-weight:800; color:var(--titulo); margin-top:22px; scroll-margin-top:104px}
.texto-longo p, .texto-longo li{color:var(--texto)}
.texto-longo ul{margin:0; padding-left:20px; display:grid; gap:8px}
.texto-longo .bloco-info{padding:18px 20px; border-radius:14px; background:var(--fundo-2); border:1px solid var(--borda)}
@media (max-width: 900px){ .leitura{grid-template-columns:minmax(0, 1fr)} .indice{position:static} }

/* obrigado e 404 */
.centro-pagina{position:relative; z-index:2; max-width:680px; margin-inline:auto; display:grid; gap:20px; justify-items:center; text-align:center}
.selo-ok{width:84px; height:84px; border-radius:50%; display:grid; place-items:center; background:linear-gradient(135deg, var(--ganha), var(--verde-agua)); color:var(--sobre-botao); box-shadow:0 18px 40px -14px var(--ganha)}
.selo-ok .ic{width:40px; height:40px; stroke-width:2.8}
@media (prefers-reduced-motion: no-preference){ .selo-ok{animation:surge .6s cubic-bezier(.2,1.4,.4,1) both} @keyframes surge{ from{transform:scale(.4); opacity:0} } }
.proximos{list-style:none; margin:0; padding:0; display:grid; gap:12px; text-align:left; width:100%; counter-reset:p}
.proximos li{counter-increment:p; display:grid; grid-template-columns:40px 1fr; gap:14px; align-items:center; padding:16px 18px; border:1px solid var(--borda); border-radius:14px; background:var(--painel)}
.proximos li::before{content:counter(p); width:34px; height:34px; border-radius:50%; display:grid; place-items:center; background:linear-gradient(135deg, var(--botao), var(--botao-2)); color:var(--sobre-botao); font-weight:800}
.erro-404{font-size:clamp(6rem, 18vw, 11rem); font-weight:800; line-height:.9; letter-spacing:-.06em; background:linear-gradient(135deg, var(--realce), var(--botao)); -webkit-background-clip:text; background-clip:text; color:transparent}

/* ---------- chamada final e rodapé ---------- */
.final{position:relative; overflow:hidden; text-align:center; padding-block:clamp(80px, 11vw, 130px); background:radial-gradient(ellipse 50% 80% at 50% 100%, var(--realce-claro), transparent 70%), var(--fundo-2); border-top:1px solid var(--borda)}
.final h2{position:relative; margin:0 auto; font-size:clamp(2.1rem, 4.6vw, 3.6rem); font-weight:800; letter-spacing:-.03em; line-height:1.05; color:var(--titulo); max-width:18ch; text-wrap:balance}
.final p{position:relative; margin:16px auto 30px; color:var(--suave); max-width:46ch}
.final .acoes{justify-content:center; position:relative}
.rodape{background:var(--faixa); color:var(--faixa-texto); padding-block:56px 30px; font-size:.92rem}
.rodape a{color:var(--faixa-texto); text-decoration:none}
.rodape a:hover{color:var(--faixa-realce)}
.rodape .colunas{display:grid; grid-template-columns:1.4fr 1fr 1fr 1.4fr; gap:36px}
.rodape h4{margin:0 0 14px; font:500 .72rem/1.2 var(--f-mono); letter-spacing:.14em; text-transform:uppercase; color:var(--faixa-suave)}
.rodape ul{list-style:none; margin:0; padding:0; display:grid; gap:9px}
.rodape .marca img{height:48px; width:auto}
.rodape .marca p{margin:14px 0 0; color:var(--faixa-suave); max-width:30ch}
.redes{display:flex; gap:10px; margin-top:18px}
.redes a{width:40px; height:40px; border-radius:10px; border:1px solid var(--faixa-borda); display:grid; place-items:center}
.redes a:hover{border-color:var(--faixa-realce)}
.base{margin-top:42px; padding-top:20px; border-top:1px solid var(--faixa-borda); display:flex; justify-content:space-between; gap:12px 24px; flex-wrap:wrap; font:400 .78rem/1.5 var(--f-mono); color:var(--faixa-suave)}
.base nav{display:flex; gap:18px; flex-wrap:wrap}
.base button{background:none; border:0; padding:0; font:inherit; color:var(--faixa-texto); cursor:pointer}
.base button:hover, .base a:hover{color:var(--faixa-realce)}
@media (max-width: 900px){ .rodape .colunas{grid-template-columns:repeat(2, minmax(0, 1fr))} }
@media (max-width: 520px){ .rodape .colunas{grid-template-columns:minmax(0, 1fr)} }
body.modo-landing .rodape .colunas{display:none}
body.modo-landing .rodape{padding-top:24px}
body.modo-landing .base{margin-top:0; border-top:0}

/* ---------- aviso de cookies ---------- */
.cookies{position:fixed; left:16px; bottom:calc(16px + env(safe-area-inset-bottom, 0px)); z-index:60; width:min(470px, calc(100vw - 32px)); display:grid; gap:14px; font-size:.92rem; padding:20px}
.cookies b{color:var(--titulo); font-size:1rem}
.cookies p{color:var(--suave)}
.cookies .acoes{gap:8px}
.cookies .opcoes{display:grid; gap:10px; padding:12px; border:1px solid var(--borda); border-radius:10px; background:var(--fundo-2)}
.cookies .opcoes label{display:grid; grid-template-columns:20px 1fr; gap:10px; align-items:start; color:var(--texto)}
.cookies .opcoes input{width:18px; height:18px; accent-color:var(--botao); margin-top:2px}
/* no celular o aviso ocupa a largura toda: fica acima do botão do chat da duotalk */
@media (max-width: 600px){ .cookies{bottom:calc(92px + env(safe-area-inset-bottom, 0px))} }


@media (prefers-reduced-motion: reduce){ *{transition:none !important; scroll-behavior:auto !important} }

/* ---------- menu: efeito tecnológico suave no hover (pílula de vidro, feixe que abre do centro e um reflexo que passa pelo texto) ---------- */
:root{--brilho-texto:#3DBDF2}
.topo nav{gap:4px}
.topo nav a, .topo .entrar{position:relative; padding:9px 14px; border-radius:10px; border-bottom:0; white-space:nowrap; transition:color .45s ease}
.topo nav a::before, .topo .entrar::before{content:""; position:absolute; inset:0; z-index:-1; border-radius:inherit; background:var(--realce-claro); box-shadow:inset 0 0 0 1px var(--borda); opacity:0; transform:scale(.96); transition:opacity .45s ease, transform .45s ease, box-shadow .45s ease}
.topo nav a::after, .topo .entrar::after{content:""; position:absolute; left:50%; right:50%; bottom:4px; height:1.5px; border-radius:2px; background:linear-gradient(90deg, transparent, var(--realce), transparent); opacity:0; transition:left .55s cubic-bezier(.22,.8,.3,1), right .55s cubic-bezier(.22,.8,.3,1), opacity .45s ease}
.topo nav a:hover, .topo nav a:focus-visible, .topo .entrar:hover, .topo .entrar:focus-visible{color:var(--realce-texto)}
.topo nav a:hover::before, .topo nav a:focus-visible::before, .topo .entrar:hover::before, .topo .entrar:focus-visible::before{opacity:.75; transform:scale(1); box-shadow:inset 0 0 0 1px var(--borda), 0 4px 16px -8px var(--brilho)}
.topo nav a:hover::after, .topo nav a:focus-visible::after, .topo .entrar:hover::after, .topo .entrar:focus-visible::after,
.topo nav a[aria-current="page"]::after{left:16px; right:16px; opacity:1}
.topo nav a[aria-current="page"]{color:var(--realce-texto)}
.topo .entrar .ic{transition:transform .45s ease}
.topo .entrar:hover .ic{transform:translateX(2px)}
@media (prefers-reduced-motion: no-preference){
  .topo nav a:hover, .topo .entrar:hover span{background:linear-gradient(100deg, var(--realce-texto) 0%, var(--realce-texto) 42%, var(--brilho-texto) 50%, var(--realce-texto) 58%, var(--realce-texto) 100%); background-size:240% 100%; background-position:0 0; -webkit-background-clip:text; background-clip:text; color:transparent; animation:reflexo 1.2s ease}
  @keyframes reflexo{ from{background-position:100% 0} to{background-position:0 0} }
}
@media (max-width: 1140px){
  .topo nav{gap:0}
  .topo nav a{padding:13px 4px; border-radius:0; border-bottom:1px solid var(--borda)}
  .topo nav a::before{display:none}
  .topo nav a:hover::after, .topo nav a[aria-current="page"]::after{left:4px; right:auto; width:64px}
  .topo nav a::after{bottom:-1px}
}
@media (max-width: 520px){ .topo .entrar{padding:9px 8px} }
/* ---------- botões: o mesmo efeito suave do menu (reflexo que passa uma vez, feixe que abre do centro, anel de brilho leve) ---------- */
.btn{--reflexo:rgba(255,255,255,.42); position:relative; overflow:hidden; isolation:isolate; transition:transform .45s ease, box-shadow .45s ease, background .45s ease, border-color .45s ease, color .45s ease}
.btn.sec{--reflexo:var(--realce-claro)}
.modulo-adicional .btn{--reflexo:rgba(0,144,206,.18)}
.btn::before{content:""; position:absolute; top:0; bottom:0; left:-60%; width:45%; z-index:1; pointer-events:none; background:linear-gradient(100deg, transparent, var(--reflexo), transparent); transform:skewX(-18deg); opacity:0}
.btn.prim:hover, .btn.prim:focus-visible{transform:translateY(-1px); box-shadow:0 12px 28px -10px var(--brilho), 0 0 0 4px var(--realce-claro)}
.btn.sec:hover, .btn.sec:focus-visible{border-color:var(--realce); color:var(--realce-texto); box-shadow:0 8px 22px -12px var(--brilho), 0 0 0 4px var(--realce-claro)}
.btn.whats:hover, .btn.whats:focus-visible{transform:translateY(-1px); box-shadow:0 10px 24px -10px rgba(37,211,102,.7), 0 0 0 4px rgba(37,211,102,.18)}
.modulo-adicional .btn:hover{transform:translateY(-1px); box-shadow:0 10px 26px -10px rgba(0,0,0,.35), 0 0 0 4px var(--sobre-grad-fraco)}
.btn .ic{transition:transform .45s ease}
.btn:hover .ic{transform:translateX(3px)}
.whats-redondo{transition:transform .45s ease, box-shadow .45s ease}
.whats-redondo:hover, .whats-redondo:focus-visible{transform:translateY(-1px); box-shadow:0 10px 24px -10px rgba(37,211,102,.7), 0 0 0 5px rgba(37,211,102,.18)}
@media (prefers-reduced-motion: no-preference){
  .btn:hover::before, .btn:focus-visible::before{animation:reflexo-botao 1.1s ease}
  @keyframes reflexo-botao{ from{left:-60%; opacity:1} to{left:125%; opacity:1} }
}
/* ---------- cartões: o mesmo efeito dos botões (reflexo que passa uma vez e anel de brilho leve, sem risco embaixo) ---------- */
:root{--reflexo-cartao:rgba(0,144,206,.10)}
:where(.cartao, .recurso, .plano, .logo-cartao, .lat, .depo, .canal, .lider, .grad, .modulo-adicional, .video, .passos li, .proximos li){position:relative}
.grad, .modulo-adicional, .video{--reflexo-cartao:rgba(255,255,255,.16)}
.cartao, .recurso, .plano, .logo-cartao, .lat, .depo, .canal, .lider, .grad, .modulo-adicional, .video, .passos li, .proximos li{transition:border-color .45s ease, box-shadow .45s ease, transform .45s ease}
.cartao:not(.cookies):not(.chat-nota)::before, .recurso::before, .plano::before, .logo-cartao::before, .lat::before, .depo::before, .canal::before, .lider::before, .grad::before, .modulo-adicional::before, .video::before, .passos li::after, .proximos li::after{content:""; position:absolute; inset:0; border-radius:inherit; pointer-events:none; background:linear-gradient(105deg, transparent 38%, var(--reflexo-cartao) 50%, transparent 62%) no-repeat; background-size:250% 100%; background-position:100% 0; opacity:0}
.cartao:not(.cookies):not(.chat-nota):hover, .recurso:hover, .plano:hover, .logo-cartao:hover, .lat:hover, .depo:hover, .canal:hover, .lider:hover, .passos li:hover, .proximos li:hover{border-color:var(--realce); box-shadow:0 0 0 4px var(--realce-claro), var(--sombra)}
.grad:hover, .modulo-adicional:hover, .video:hover{box-shadow:0 0 0 4px var(--realce-claro), var(--sombra)}
@media (prefers-reduced-motion: no-preference){
  .cartao:not(.cookies):not(.chat-nota):hover::before, .recurso:hover::before, .plano:hover::before, .logo-cartao:hover::before, .lat:hover::before, .depo:hover::before, .canal:hover::before, .lider:hover::before, .grad:hover::before, .modulo-adicional:hover::before, .video:hover::before, .passos li:hover::after, .proximos li:hover::after{animation:reflexo-cartao 1.3s ease}
  @keyframes reflexo-cartao{ from{background-position:100% 0; opacity:1} to{background-position:0 0; opacity:1} }
}
.topo .logo{flex:none}
/* ---------- quadros da chamada: parados e com o conteúdo cabendo ---------- */
.composicao .cartao{padding:16px}
.tab{table-layout:fixed}
.tab th, .tab td{padding:7px 4px}
.tab th{font-size:.66rem}
.tab th:first-child, .tab td:first-child{width:42%}
.tab td:first-child{display:table-cell; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; font-size:.76rem}
.tab td:first-child .ic{display:inline-block; vertical-align:-3px; margin-right:6px}
.estrelas{font-size:.6rem; letter-spacing:0}
.relogio{width:40px; height:40px}
.relogio .ic{width:21px; height:21px}
.gp ul{padding-right:16px}
.gp .seta{width:16px; height:24px; right:8px; bottom:8px}
.amb{grid-template-columns:auto minmax(0, 1fr)}
.amb ul{grid-column:1 / -1; grid-template-columns:repeat(2, minmax(0, 1fr)); padding-top:12px; border-top:1px solid var(--borda)}
/* ---------- quadros da chamada: grade alinhada, nada encavalado ---------- */
.composicao{align-items:stretch}
.c-tabela, .c-ganha{grid-column:1 / 8; margin-top:0}
.c-tempo, .c-relat{grid-column:8 / 13; margin-top:0}
.c-amb{grid-column:1 / 13; margin-top:0; padding-top:16px}
.c-tempo, .c-relat, .c-ganha{display:flex; flex-direction:column}
.c-tempo p{margin-bottom:12px}
.c-tempo .subida, .c-relat .mini-barras{margin-top:auto}
.c-relat .relat{margin-bottom:12px}
.c-ganha .gp{flex:1}
.fita{position:static; display:inline-block; margin:0 0 12px; border-radius:6px; box-shadow:none}
@media (max-width: 640px){ .c-tabela, .c-tempo, .c-ganha, .c-relat, .c-amb{grid-column:1 / -1} }
/* ---------- ajustes da Home (05/10): selo do NOVO em destaque e colunas centralizadas ---------- */
.pilula-novo.destaque{position:relative; padding:10px 20px 10px 10px; gap:14px; border:1.5px solid transparent; background:linear-gradient(var(--painel), var(--painel)) padding-box, linear-gradient(110deg, var(--realce), var(--botao-2), var(--verde-agua), var(--realce)) border-box; background-size:100% 100%, 300% 100%; background-position:0 0, 0 0; box-shadow:0 10px 26px -12px var(--brilho), 0 0 0 4px var(--realce-claro); font-size:1rem}
.pilula-novo.destaque .estrela{width:32px; height:32px; position:relative; background:linear-gradient(135deg, var(--botao), var(--botao-2))}
.pilula-novo.destaque .estrela::after{content:""; position:absolute; inset:-5px; border-radius:50%; border:2px solid var(--realce); opacity:0}
.pilula-novo.destaque b{color:var(--realce-texto); letter-spacing:.04em}
.pilula-novo.destaque .ir{display:inline-flex; align-items:center; gap:6px; padding-left:14px; border-left:1px solid var(--borda); font-weight:700; font-size:.9rem; color:var(--realce-texto); white-space:nowrap}
.pilula-novo.destaque .ir .ic{width:16px; height:16px; transition:transform .45s ease}
.pilula-novo.destaque:hover .ir .ic{transform:translateX(3px)}
@media (prefers-reduced-motion: no-preference){
  .pilula-novo.destaque{animation:borda-gira 6s linear infinite}
  .pilula-novo.destaque .estrela::after{animation:pulsa-selo 2.4s ease-out infinite}
  @keyframes borda-gira{ to{background-position:0 0, 300% 0} }
  @keyframes pulsa-selo{ 0%{transform:scale(.85); opacity:.8} 100%{transform:scale(1.5); opacity:0} }
}
@media (max-width: 520px){ .pilula-novo.destaque .ir{display:none} }
.tres > div{padding:30px 26px 10px; justify-items:center; text-align:center}
.tres > div + div{padding-left:26px}
.tres svg{margin-inline:auto}
.tres p{margin-inline:auto}

/* clientes ainda sem o arquivo do logo: o nome escrito, até chegar o logo oficial */
.logo-cartao .logo-texto{font:800 1.3rem/1 var(--f-texto); letter-spacing:-.02em; color:var(--titulo)}
.formula{display:flex; flex-wrap:wrap; gap:8px; align-items:center; padding:12px 14px; border-radius:10px; background:var(--realce-claro); color:var(--titulo); font-weight:700}
.formula span{padding:5px 10px; border-radius:6px; background:var(--painel); border:1px solid var(--borda); font-weight:600}
.formula b{color:var(--realce-texto)}

/* a WTW é toda em caixa-baixa e muito pesada: um pouco menor, para pesar igual às outras */
.logo-cartao.logo-wtw img{transform:scale(.8)}
/* a Seguros Unimed tem o texto dentro da moldura: um pouco maior, para não ficar menor que as outras */
.logo-cartao.logo-unimed img{transform:scale(1.2)}

/* liderança (Sobre): foto 4:5 à esquerda, cargo e nome à direita */
.lideres{display:grid; grid-template-columns:repeat(2, minmax(0, 1fr)); gap:18px}
.lider{display:grid; grid-template-columns:180px 1fr; gap:26px; align-items:center; margin:0; padding:18px; background:var(--painel); border:1px solid var(--borda); border-radius:18px; box-shadow:var(--sombra)}
.lider img{display:block; width:180px; height:225px; object-fit:cover; border-radius:12px; background:var(--fundo-2)}
.lider figcaption{display:grid; gap:10px}
.lider b{font-size:clamp(1.3rem, 2.2vw, 1.6rem); font-weight:800; letter-spacing:-.02em; line-height:1.15; color:var(--titulo)}
.lider .linkedin{display:inline-flex; align-items:center; gap:8px; justify-self:start; margin-top:4px; padding:8px 14px 8px 11px; border-radius:999px; border:1px solid var(--borda); background:var(--fundo-2); color:var(--titulo); font-weight:700; font-size:.86rem; text-decoration:none; transition:border-color .25s, color .25s, box-shadow .25s}
.lider .linkedin .ic{width:18px; height:18px}
.lider .linkedin:hover{border-color:var(--realce); color:var(--realce-texto); box-shadow:0 0 0 3px var(--realce-claro)}
@media (max-width: 860px){ .lideres{grid-template-columns:1fr} }
@media (max-width: 480px){ .lider{grid-template-columns:120px 1fr; gap:18px; padding:14px} .lider img{width:120px; height:150px} }
/* vídeo: o botão vira o player do YouTube no mesmo lugar */
button.video{width:100%; border:0; padding:0; font:inherit; cursor:pointer; text-align:left}
.video.tocando{background:#000; cursor:default}
.video.tocando::after{display:none}
.video iframe{position:absolute; inset:0; width:100%; height:100%; border:0}
/* depoimentos: palco com a fala em destaque e a lista de pessoas ao lado */
.depo-palco{display:grid; grid-template-columns:minmax(0, 1.7fr) minmax(0, 1fr); gap:18px; align-items:stretch}
.palco{position:relative; overflow:hidden; border-radius:20px; padding:clamp(26px, 4vw, 44px); display:flex; flex-direction:column; gap:26px; color:var(--sobre-grad); background:linear-gradient(140deg, var(--grad-1), var(--grad-2) 55%, var(--grad-3)); box-shadow:var(--sombra)}
.palco::after{content:""; position:absolute; right:-130px; bottom:-130px; width:360px; height:360px; border-radius:50%; border:44px solid var(--sobre-grad-fraco); pointer-events:none}
.palco .aspas{position:absolute; right:28px; top:-30px; font:800 13rem/1 var(--f-texto); color:var(--sobre-grad-fraco); pointer-events:none; user-select:none}
.falas{position:relative; z-index:1; flex:1; display:grid}
.fala{grid-area:1 / 1; margin:0; display:flex; flex-direction:column; justify-content:space-between; gap:28px; opacity:0; visibility:hidden; transform:translateY(10px); transition:opacity .5s ease, transform .5s ease, visibility .5s}
.fala.ativa{opacity:1; visibility:visible; transform:none}
.fala .emp{display:block; height:32px; width:auto; align-self:flex-start}
.fala blockquote{margin:0; font-size:clamp(1.1rem, 1.85vw, 1.4rem); line-height:1.5; font-weight:600; max-width:52ch; text-wrap:pretty}
.fala figcaption{display:flex; align-items:center; gap:14px; font-size:.92rem; color:var(--sobre-grad-suave)}
.fala figcaption img{width:56px; height:56px; border-radius:50%; object-fit:cover; border:2px solid var(--sobre-grad-borda)}
.fala figcaption b{display:block; color:var(--sobre-grad); font-size:1.02rem}
.palco-nav{position:relative; z-index:1; display:flex; align-items:center; gap:10px; padding-top:18px; border-top:1px solid var(--sobre-grad-linha)}
.palco-nav .contador{margin-right:auto; font:500 .78rem/1 var(--f-mono); letter-spacing:.14em; color:var(--sobre-grad-suave)}
.palco-nav .seta{width:42px; height:42px; border-radius:50%; display:grid; place-items:center; padding:0; border:1px solid var(--sobre-grad-borda); background:transparent; color:var(--sobre-grad); cursor:pointer; transition:background .25s, color .25s}
.palco-nav .seta:hover{background:var(--sobre-grad); color:var(--grad-2)}
.palco-nav .seta .ic{width:18px; height:18px}
.palco-nav .seta[data-passo="-1"] .ic{transform:rotate(180deg)}
.pessoas{position:relative; display:flex; flex-direction:column; gap:10px; min-width:0}
.pessoa{position:relative; overflow:hidden; display:grid; grid-template-columns:44px minmax(0, 1fr) auto; align-items:center; gap:12px; width:100%; padding:12px 14px; text-align:left; font:inherit; color:var(--texto); background:var(--painel); border:1px solid var(--borda); border-radius:14px; cursor:pointer; transition:border-color .25s, box-shadow .25s, transform .25s}
.pessoa:hover{border-color:var(--borda-forte); transform:translateX(-2px)}
.pessoa[aria-selected="true"]{border-color:var(--realce); box-shadow:0 0 0 4px var(--realce-claro)}
.pessoa .foto{width:44px; height:44px; border-radius:50%; object-fit:cover}
.pessoa b{display:block; color:var(--titulo); font-size:.95rem; line-height:1.25; white-space:nowrap; overflow:hidden; text-overflow:ellipsis}
.pessoa small{display:block; color:var(--suave); font-size:.82rem}
.pessoa .emp{height:22px; width:auto; max-width:92px; object-fit:contain}
.pessoa .barra{position:absolute; left:0; bottom:0; height:3px; width:0; background:linear-gradient(90deg, var(--grad-1), var(--grad-2))}
.pessoa[aria-selected="true"] .barra{width:100%}
.pessoas-nota{margin-top:auto; padding:16px 4px 0; color:var(--suave); font-size:.92rem}
.pessoas-nota b{color:var(--titulo); font-size:1.15rem}
@media (prefers-reduced-motion: no-preference){
  .depo-palco.rodando .pessoa[aria-selected="true"] .barra{animation:depo-barra 9s linear forwards}
  .depo-palco:hover .barra, .depo-palco:has(:focus-visible) .barra{animation-play-state:paused}
  @keyframes depo-barra{ from{width:0} to{width:100%} }
}
@media (max-width: 960px){
  .depo-palco{grid-template-columns:minmax(0, 1fr)}
  .pessoas{flex-direction:row; overflow-x:auto; scroll-snap-type:x mandatory; padding:4px 4px 8px}
  .pessoa{flex:0 0 240px; scroll-snap-align:start}
  .pessoa:hover{transform:none}
  .pessoa .emp, .pessoas-nota{display:none}
}

/* ---------- só do tema WordPress ---------- */
/* aviso de erro no envio, campo-isca dos formulários e botão enquanto envia */
.form-aviso{margin:0; padding:12px 14px; border-radius:10px; background:var(--perde-fundo); color:var(--erro); font-size:.9rem; font-weight:600}
.campo-oculto{position:absolute !important; left:-10000px; top:auto; width:1px; height:1px; overflow:hidden}
.btn.enviando{opacity:.7; pointer-events:none}
/* barra do WordPress para quem está logado */
body.admin-bar .topo{top:32px}
@media (max-width: 782px){ body.admin-bar .topo{top:46px} }
/* texto só para leitores de tela (padrão do WordPress) */
.screen-reader-text{border:0; clip:rect(1px, 1px, 1px, 1px); clip-path:inset(50%); height:1px; margin:-1px; overflow:hidden; padding:0; position:absolute; width:1px; word-wrap:normal !important}
/* páginas criadas no painel, fora das páginas do tema */
.conteudo-generico{max-width:780px; display:grid; gap:16px}
.conteudo-generico h1{font-size:clamp(2rem, 4vw, 2.8rem); font-weight:800; letter-spacing:-.025em; line-height:1.1; color:var(--titulo)}
.conteudo-generico p, .conteudo-generico li{color:var(--texto)}