/* O design system original traz este reset (lib.js). Sem ele, largura e
   padding somam: um botao de width:318px com 26px de padding ocupa 374px e
   escapa do celular. Foi a causa medida do transbordo dos botoes. */
*,*::before,*::after{box-sizing:border-box}

:root{
  --azul:#006CC0;--azul-titulo:#0A4F8A;--azul-escuro:#0A3A66;--azul-profundo:#062A4D;--verde:#00483C;--verde-2:#00352C;--azul-link:#005AA0;--azul-claro:#EAF3FB;--verde-claro:#E8F0EE;--fundo:#FFFFFF;--fundo-2:#EEF4FA;--borda:#D6E2EE;--borda-forte:#AFC4D8;--borda-fina:#E8EFF6;--t-forte:#0B1F33;--t:#1A1A1A;--t-suave:#4A5450;--t-fraco:#6E7975;--t-inv:#FFFFFF;--t-inv-suave:#B9D3EC;--foco:#006CC0;--erro:#8A1F11;--erro-bg:#FBEEEC;--ok:#00483C;--ok-bg:#E8F0EE; --r-sm:2px;--r-md:4px;--r-lg:8px;--r-pill:999px;--sans:"Segoe UI",Inter,system-ui,-apple-system,"Helvetica Neue",Arial,sans-serif;--mono:Consolas,"SF Mono",Menlo,monospace;
  --sans:"Segoe UI",Inter,system-ui,-apple-system,"Helvetica Neue",Arial,sans-serif; --mono:Consolas,"SF Mono",Menlo,monospace;
  /* profundidade: sombras tingidas com o verde da marca, nunca cinza */
  --sombra-1:0 2px 4px rgba(6,42,77,.10),0 10px 26px rgba(6,42,77,.15),inset 0 1px 0 rgba(255,255,255,.7);
  --sombra-2:0 12px 26px rgba(6,42,77,.20),0 30px 64px rgba(6,42,77,.22),inset 0 1px 0 rgba(255,255,255,.8);
  --sombra-3:0 20px 44px rgba(6,42,77,.28),0 48px 100px rgba(6,42,77,.25);
  --brilho-azul:0 10px 28px rgba(0,108,192,.40),0 2px 6px rgba(0,60,120,.30);
  /* movimento: três tempos, uma curva */
  --t1:160ms; --t2:260ms; --t3:560ms; --curva:cubic-bezier(.2,.7,.2,1);
  --grad:linear-gradient(90deg,#0A4F8A 0%,#006CC0 55%,#2B8BD9 80%,#0E6B5A 100%);
  /* degradê metálico: só tons das duas cores da marca, com brilho e sombra de metal escovado */
  --grad-metal:linear-gradient(135deg,#062A4D 0%,#0A4F8A 20%,#006CC0 42%,#2B8BD9 58%,#0A6B8A 76%,#00483C 100%);
  --grad-metal-v:linear-gradient(180deg,#2B8BD9 0%,#006CC0 45%,#062A4D 100%);
  --ed-fundo:#e9ebed;--ed-painel:#fff;--ed-borda:#dcdfe3;--ed-txt:#2a2a2a;--ed-txt2:#8a8f98;--ed-sel:#006CC0;
}
body.escuro{ --azul:#5BA8E8;--azul-titulo:#8CC4F2;--azul-escuro:#0B1F33;--azul-profundo:#07182A;--verde:#5FBFA8;--verde-2:#0A1614;--azul-link:#7DBEF0;--azul-claro:#0E2436;--verde-claro:#0D2420;--fundo:#0A1210;--fundo-2:#101B18;--borda:#22332E;--borda-forte:#33473F;--borda-fina:#1A2724;--t-forte:#F2F7F5;--t:#DCE6E2;--t-suave:#9FB0AB;--t-fraco:#7A8A85;--t-inv:#0A1210;--t-inv-suave:#7A8A85;--foco:#5BA8E8;--erro:#F0A79C;--erro-bg:#2A100C;--ok:#5FBFA8;--ok-bg:#0D2420; --ed-fundo:#161a19;--ed-painel:#1f2624;--ed-borda:#2e3a37;--ed-txt:#e5eae8;--ed-txt2:#94a29e; }

.wrap{max-width:1120px;margin:0 auto;padding:0 60px}
.wrap-estreito{max-width:760px;margin:0 auto;padding:0 60px}

/* cabeçalho */
.cab{background:rgba(255,255,255,.92);backdrop-filter:blur(10px);border-bottom:1px solid var(--borda);position:relative;z-index:5;box-shadow:0 2px 12px rgba(6,42,77,.06);transition:box-shadow var(--t2) var(--curva),background var(--t2)}
.cab.sobre{background:#062A4D;border-bottom:1px solid rgba(255,255,255,.14)}
.cab .in{max-width:1120px;margin:0 auto;padding:0 60px;height:76px;display:flex;align-items:center;gap:34px}
.logo{display:flex;align-items:center;flex:none}
.lg{display:block;background-size:contain;background-repeat:no-repeat;background-position:left center;flex:none}
.menu{display:flex;gap:26px;align-items:center;font-size:15px;font-weight:500}
.menu a{color:var(--t-suave);text-decoration:none;padding:6px 0;border-bottom:2px solid transparent;white-space:nowrap;transition:color var(--t1),border-color var(--t2) var(--curva)}
.menu a:hover{color:var(--azul-titulo);border-bottom-color:var(--borda-forte)}
.menu a.on{color:var(--azul-titulo);border-bottom-color:var(--azul)}
.cab.sobre .menu a{color:rgba(255,255,255,.82)}
.cab.sobre .menu a.on{color:#fff;border-bottom-color:#fff}
.cab .acao{margin-left:auto;display:flex;align-items:center;gap:14px}

/* faixa escura com imagem */
.faixa{position:relative;background:var(--azul-escuro);color:#fff;overflow:hidden;box-shadow:0 26px 64px rgba(6,42,77,.32)}
.faixa .bg{position:absolute;inset:-4%;background-size:cover;background-position:center;opacity:.55;animation:deriva 28s var(--curva) infinite alternate;will-change:transform}
@keyframes deriva{from{transform:scale(1) translate3d(0,0,0)}to{transform:scale(1.07) translate3d(-1.6%,-1.2%,0)}}
.faixa .luz{position:absolute;inset:0;z-index:1;background:linear-gradient(112deg,transparent 42%,rgba(43,139,217,.18) 50%,transparent 58%);background-size:260% 100%;animation:varredura 16s linear infinite;pointer-events:none}
@keyframes varredura{from{background-position:130% 0}to{background-position:-130% 0}}
body.pdf .faixa .luz{animation:none;opacity:0}
.faixa::after{content:"";position:absolute;left:0;right:0;bottom:0;height:5px;background:var(--grad-metal);z-index:3;box-shadow:0 0 18px rgba(43,139,217,.6)}
.faixa .vel{position:absolute;inset:0;background:radial-gradient(62% 92% at 90% 18%,rgba(43,139,217,.62) 0%,rgba(0,108,192,.30) 38%,rgba(0,108,192,0) 66%),radial-gradient(46% 66% at 8% 100%,rgba(14,107,90,.42) 0%,rgba(14,107,90,0) 60%),linear-gradient(100deg,rgba(6,42,77,.97) 0%,rgba(6,42,77,.88) 40%,rgba(6,42,77,.42) 100%)}
.faixa .in{position:relative;z-index:2;max-width:1120px;margin:0 auto;padding:0 60px}
.faixa h1,.faixa h2,.faixa h1.d,.faixa h2.t{color:#fff}
.faixa p{color:rgba(255,255,255,.9)}

/* tipografia */
.eyebrow{font:700 13px/1.3 var(--sans);letter-spacing:.14em;text-transform:uppercase;color:var(--azul);margin:0 0 18px}
.faixa .eyebrow{color:#9CCBF5}
h1.d{font:700 52px/1.08 var(--sans);letter-spacing:-.022em;margin:0 0 22px;color:var(--azul-titulo);max-width:17ch}
.faixa h1.d{color:#fff;text-shadow:0 2px 18px rgba(0,0,0,.35)}
h2.t{font:700 34px/1.18 var(--sans);letter-spacing:-.018em;margin:0 0 18px;color:var(--azul-titulo);max-width:22ch;background:linear-gradient(90deg,#0A4F8A,#006CC0 70%,#0E6B5A);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}
.faixa h2.t{background:none;-webkit-text-fill-color:#fff}
h3.t{font:700 22px/1.3 var(--sans);letter-spacing:-.01em;margin:0 0 10px;color:var(--t-forte)}
h4.t{font:700 18px/1.35 var(--sans);margin:0 0 8px;color:var(--t-forte)}
p.lead{font-size:21px;line-height:1.5;color:var(--t-suave);margin:0 0 26px;max-width:62ch}
.faixa p.lead{color:rgba(255,255,255,.88)}
p.c{font-size:18px;line-height:1.55;margin:0 0 16px;max-width:68ch;color:var(--t)}
p.pe{font-size:16px;line-height:1.5;color:var(--t-suave);margin:0 0 12px}
.mini{font-size:14px;line-height:1.45;color:var(--t-fraco)}
a.link{color:var(--azul-link);text-decoration:underline;text-underline-offset:3px}

/* botões */
.bt{display:inline-flex;align-items:center;gap:9px;font:600 17px/1 var(--sans);padding:17px 26px;border-radius:var(--r-md);
  text-decoration:none;border:2px solid transparent;white-space:nowrap;cursor:pointer;position:relative;overflow:hidden;
  transition:transform var(--t1) var(--curva),box-shadow var(--t2) var(--curva),background var(--t2),border-color var(--t2),color var(--t2)}
.bt:hover{transform:translateY(-2px)}
.bt:active{transform:translateY(0) scale(.985);transition-duration:80ms}
.bt.p{background:var(--grad-metal);background-size:220% 100%;background-position:80% 0;color:#fff;border-color:transparent;box-shadow:var(--brilho-azul);text-shadow:0 1px 1px rgba(0,0,0,.18);transition:background-position var(--t3) var(--curva),transform var(--t1) var(--curva),box-shadow var(--t2) var(--curva)}
.bt.p::after{content:"";position:absolute;top:-20%;bottom:-20%;left:-70%;width:45%;background:linear-gradient(90deg,transparent,rgba(255,255,255,.42),transparent);transform:skewX(-22deg);transition:left var(--t3) var(--curva)}
.bt.p:hover::after{left:125%}
.bt.p:hover{background-position:0 0;box-shadow:0 16px 36px rgba(0,108,192,.48),0 3px 8px rgba(0,60,120,.35)}
.bt.s{background:transparent;color:var(--azul-titulo);border-color:var(--borda-forte)}
.bt.s:hover{border-color:var(--azul);background:var(--azul-claro);box-shadow:var(--sombra-1)}
.faixa .bt.s{color:#fff;border-color:rgba(255,255,255,.5)}
.bt.f{background:#fff;color:var(--azul-titulo);border-color:#fff;box-shadow:0 10px 26px rgba(0,0,0,.28)}
.bt.f:hover{box-shadow:0 16px 36px rgba(0,0,0,.34)}
.bt.pq{font-size:15px;padding:12px 18px}
.bt.foco{outline:3px solid var(--foco);outline-offset:3px}
.bt.des{opacity:.45}

/* seções */
.sec{padding:88px 0}
.sec.alt{background:linear-gradient(180deg,var(--fundo) 0%,#EEF4FA 14%,#F3F7FB 60%,#E4EEF9 100%);box-shadow:inset 0 1px 0 rgba(6,42,77,.06),inset 0 -1px 0 rgba(6,42,77,.06)}
.sec.compacta{padding:60px 0}
.sec-cab{max-width:70ch;margin:0 0 44px}
.sec-cab .barra-t{height:4px;width:0;background:var(--grad-metal);border-radius:2px;margin:-4px 0 20px;transition:width var(--t3) var(--curva) 180ms;box-shadow:0 2px 8px rgba(0,108,192,.35)}
.sec-cab.vis .barra-t,body.pdf .sec-cab .barra-t{width:72px}

/* prova / números */
.prova{border-top:1px solid var(--borda);border-bottom:1px solid var(--borda);background:linear-gradient(180deg,#fff,#EEF4FA);box-shadow:var(--sombra-1)}
.prova .in{max-width:1120px;margin:0 auto;padding:30px 60px;display:flex;gap:56px;flex-wrap:wrap}
.prova .n{font:700 34px/1 var(--sans);color:var(--azul-titulo);letter-spacing:-.02em;background:linear-gradient(90deg,#0A4F8A,#006CC0);-webkit-background-clip:text;background-clip:text;color:transparent}
.prova .r{font-size:14px;color:var(--t-suave);margin-top:6px;max-width:20ch;line-height:1.35}

/* cards */
.cards{display:grid;gap:22px}
.cards.c2{grid-template-columns:1fr 1fr}
.cards.c3{grid-template-columns:repeat(3,1fr)}
.cards.c4{grid-template-columns:repeat(4,1fr)}
.card{background:var(--fundo);border:1px solid var(--borda);border-radius:var(--r-lg);padding:28px;position:relative;box-shadow:var(--sombra-1);
  transition:transform var(--t2) var(--curva),box-shadow var(--t2) var(--curva),border-color var(--t2)}
.card:hover{transform:translateY(-8px);box-shadow:var(--sombra-2);border-color:rgba(0,108,192,.35)}
.card::after{content:"";position:absolute;inset:0;border-radius:inherit;background:linear-gradient(135deg,rgba(43,139,217,.10),rgba(255,255,255,0) 45%);opacity:0;transition:opacity var(--t2);pointer-events:none}
.card:hover::after{opacity:1}
.card.marcado::before{content:"";position:absolute;left:-1px;right:-1px;top:-1px;height:5px;background:var(--grad-metal);border-radius:8px 8px 0 0}
.card .num{font:700 13px/1 var(--mono);color:var(--azul);letter-spacing:.1em;margin-bottom:14px;display:block}
.card p{font-size:16px;line-height:1.55;color:var(--t-suave);margin:0}
.card h4{margin:0 0 10px}

/* tabela */
.tb{width:100%;border-collapse:separate;border-spacing:0;font-size:16px;border-radius:var(--r-lg);overflow:hidden;box-shadow:var(--sombra-1);border:1px solid var(--borda)}
.tb tbody tr{transition:background var(--t1)}
.tb tbody tr:hover td{background:var(--azul-claro)}
.tb th{background:var(--grad-metal);color:#fff;text-align:left;padding:14px 16px;font-weight:600;font-size:15px;text-shadow:0 1px 1px rgba(0,0,0,.2)}
.tb td{padding:14px 16px;border-bottom:1px solid var(--borda);vertical-align:top;line-height:1.45}
.tb tr:nth-child(even) td{background:var(--fundo-2)}
.tb td.rot{font-weight:600;color:var(--azul-titulo);width:20%}

/* passos */
.passos{display:flex;flex-direction:column;gap:0}
.passo{display:flex;gap:22px;padding:22px 0;border-bottom:1px solid var(--borda-fina)}
.passo:last-child{border-bottom:0}
.passo{transition:transform var(--t2) var(--curva)}
.passo:hover{transform:translateX(6px)}
.passo .b{width:38px;height:38px;flex:none;border-radius:var(--r-md);background:var(--grad);color:#fff;box-shadow:var(--sombra-1);
  display:flex;align-items:center;justify-content:center;font:700 17px/1 var(--sans)}
.passo .tx h4{margin:6px 0 6px}
.passo .tx p{font-size:16px;color:var(--t-suave);margin:0;line-height:1.5}

/* faq */
.faq{border-top:1px solid var(--borda)}
.faq .q{border-bottom:1px solid var(--borda);padding:22px 0}
.faq .q .p{font:600 18px/1.4 var(--sans);color:var(--azul-titulo);display:flex;justify-content:space-between;gap:20px}
.faq .q{transition:background var(--t2)}
.faq .q:hover{background:linear-gradient(90deg,var(--azul-claro),transparent 70%)}
.faq .q .p i{font-style:normal;color:var(--azul);font-size:22px;line-height:1;transition:transform var(--t2) var(--curva)}
.faq .q:hover .p i{transform:rotate(90deg)}
.faq .q .r{font-size:16px;color:var(--t-suave);line-height:1.55;margin:12px 0 0;max-width:78ch}

/* formulário */
.form{background:linear-gradient(180deg,#fff,#FAFCFB);border:1px solid var(--borda);border-radius:var(--r-lg);padding:34px;box-shadow:var(--sombra-2);position:relative}
.form::before{content:"";position:absolute;left:-1px;right:-1px;top:-1px;height:5px;background:var(--grad-metal);border-radius:8px 8px 0 0}
.etapa{font-size:13px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--azul);margin-bottom:6px}
.pbar{height:4px;background:var(--borda);border-radius:2px;margin:14px 0 26px;overflow:hidden}
.pbar i{display:block;height:100%;background:var(--azul)}
.campo{margin-bottom:20px}
.campo label{display:block;font:600 16px/1.4 var(--sans);color:var(--t-forte);margin-bottom:7px}
.campo .aj{font-size:14px;color:var(--t-fraco);margin:-3px 0 7px}
.campo .in{border:1px solid var(--borda-forte);border-radius:var(--r-md);padding:14px 15px;font-size:17px;color:var(--t-fraco);background:var(--fundo);min-height:52px;transition:border-color var(--t1),box-shadow var(--t2)}
.campo .in:hover{border-color:var(--azul)}
.campo .in.pre{color:var(--t)}
.campo .in.foco{border-color:var(--azul);outline:3px solid rgba(0,108,192,.28);outline-offset:1px}
.campo .in.err{border-color:var(--erro);background:var(--erro-bg)}
.campo .msg-err{font-size:14px;color:var(--erro);margin-top:6px;font-weight:600}
.opcs{display:grid;gap:10px}
.opc{border:1px solid var(--borda-forte);border-radius:var(--r-md);padding:15px 16px;font-size:16px;display:flex;align-items:center;gap:12px;color:var(--t);transition:border-color var(--t1),background var(--t2),transform var(--t1)}
.opc:hover{border-color:var(--azul);transform:translateX(3px)}
.opc .rd{width:19px;height:19px;border-radius:50%;border:2px solid var(--borda-forte);flex:none}
.opc.on{border-color:var(--azul);background:var(--azul-claro)}
.opc.on .rd{border-color:var(--azul);box-shadow:inset 0 0 0 4px var(--azul)}
.lgpd{font-size:14px;color:var(--t-fraco);line-height:1.5;margin-top:16px;display:flex;gap:10px}
.lgpd .cx{width:18px;height:18px;border:2px solid var(--borda-forte);border-radius:3px;flex:none;margin-top:2px}

/* rodapé */
.rod{background:var(--azul-profundo);color:#fff;position:relative;overflow:hidden}
.rod::before{content:"";position:absolute;left:0;right:0;top:0;height:5px;background:var(--grad-metal);z-index:3;box-shadow:0 0 18px rgba(43,139,217,.5)}
.rod a{transition:color var(--t1),transform var(--t1)}
.rod a:hover{color:#fff;transform:translateX(3px)}
.rod .bg{position:absolute;inset:0;background-size:cover;background-position:center;opacity:.3}
.rod .in{position:relative;z-index:2;max-width:1120px;margin:0 auto;padding:56px 60px 30px}
.rod h5{font:700 12px/1 var(--sans);letter-spacing:.13em;text-transform:uppercase;color:#9CCBF5;margin:0 0 16px}
.rod a,.rod p{color:rgba(255,255,255,.82);text-decoration:none;font-size:15px;line-height:1.9;margin:0;display:block}
.rod .cols{display:grid;grid-template-columns:1.4fr 1fr 1fr 1.2fr;gap:40px}
.rod .base{border-top:1px solid rgba(255,255,255,.16);margin-top:36px;padding-top:20px;display:flex;justify-content:space-between;gap:20px;font-size:13px;color:rgba(255,255,255,.6)}

/* diversos */
.dest{border-left:4px solid transparent;border-image:var(--grad) 1;background:linear-gradient(90deg,var(--fundo-2),var(--fundo));padding:22px 26px;box-shadow:var(--sombra-1)}
.dest p{margin:0;font-size:17px;line-height:1.55;color:var(--t)}
.selo{display:inline-flex;align-items:center;gap:8px;font-size:13px;font-weight:600;color:var(--azul-titulo);
  background:var(--azul-claro);border-radius:var(--r-pill);padding:7px 14px}
.wa{position:absolute;right:28px;bottom:28px;width:60px;height:60px;border-radius:50%;background:var(--grad-metal);padding:12px;
  display:flex;align-items:center;justify-content:center;box-shadow:var(--sombra-3);z-index:20;transition:transform var(--t2) var(--curva),box-shadow var(--t2)}
.wa:hover{transform:scale(1.08)}
.wa::after{content:"";position:absolute;inset:-6px;border-radius:50%;border:2px solid rgba(0,108,192,.45);animation:pulso 2.4s ease-out infinite}
@keyframes pulso{0%{transform:scale(.9);opacity:.9}100%{transform:scale(1.35);opacity:0}}
.cookie{position:absolute;left:0;right:0;bottom:0;background:var(--fundo);border-top:3px solid transparent;border-image:var(--grad-metal) 1;padding:22px 60px;z-index:25;
  display:flex;gap:26px;align-items:center;box-shadow:0 -6px 24px rgba(0,0,0,.1)}
.retrato{width:100%;aspect-ratio:4/5;border-radius:var(--r-lg);overflow:hidden;position:relative;box-shadow:var(--sombra-2);background-size:cover;background-position:center top;transition:transform var(--t3) var(--curva),box-shadow var(--t3)}
.retrato:hover{transform:translateY(-6px);box-shadow:var(--sombra-3)}
.retrato::after{content:"";position:absolute;left:0;right:0;bottom:0;height:34%;background:linear-gradient(180deg,rgba(6,42,77,0),rgba(6,42,77,.55))}
.retrato::before{content:"";position:absolute;left:0;right:0;top:0;height:5px;background:var(--grad-metal);z-index:2}
.marcador{border:1px dashed var(--borda-forte);border-radius:var(--r-md);background:var(--fundo-2);
  display:flex;align-items:center;justify-content:center;color:var(--t-fraco);font-size:13px;text-align:center;padding:14px}
.dgrm{background:var(--fundo);border:1px solid var(--borda);border-radius:var(--r-lg);padding:26px;box-shadow:var(--sombra-1)}
.sec [role="img"]{transition:transform var(--t3) var(--curva),box-shadow var(--t3) var(--curva);box-shadow:var(--sombra-1)}
.sec [role="img"]:hover{transform:scale(1.015);box-shadow:var(--sombra-2)}
.dgrm .leg{font-size:14px;color:var(--t-suave);margin-top:16px;line-height:1.5}

/* celular */
.cel .wrap,.cel .cab .in,.cel .faixa .in,.cel .prova .in,.cel .rod .in{padding-left:22px;padding-right:22px;max-width:100%}
.cel h1.d{font-size:33px;max-width:100%}
.cel h2.t{font-size:26px}
.cel p.lead{font-size:18px}
.cel p.c{font-size:17px}
.cel .cards.c2,.cel .cards.c3,.cel .cards.c4{grid-template-columns:1fr}
.cel .sec{padding:48px 0}
.cel .prova .in{flex-direction:column;gap:22px}
.cel .rod .cols{grid-template-columns:1fr;gap:26px}
.cel .cab .in{height:64px;gap:0}
.cel .bt{width:100%;justify-content:center}
.cel .tb{font-size:13px}.cel .tb th{font-size:12px;padding:10px 8px}.cel .tb td{padding:10px 8px}.cel .tb td.rot{width:24%}

/* revelação ao rolar */
.rv{opacity:0;transform:translateY(22px);transition:opacity var(--t3) var(--curva),transform var(--t3) var(--curva)}
.rv.vis{opacity:1;transform:none}
.cards .rv:nth-child(2){transition-delay:80ms}.cards .rv:nth-child(3){transition-delay:160ms}.cards .rv:nth-child(4){transition-delay:240ms}
.passos .rv:nth-child(2){transition-delay:60ms}.passos .rv:nth-child(3){transition-delay:120ms}.passos .rv:nth-child(4){transition-delay:180ms}.passos .rv:nth-child(5){transition-delay:240ms}.passos .rv:nth-child(6){transition-delay:300ms}
.dgrm svg .tr{stroke-dasharray:1;stroke-dashoffset:1;transition:stroke-dashoffset 1.4s var(--curva)}
.dgrm.vis svg .tr{stroke-dashoffset:0}
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation:none!important;transition:none!important}
  .rv{opacity:1;transform:none}.dgrm svg .tr{stroke-dashoffset:0}
}

/* ══════════════════════════════════════════════════════════════════════
   Ajustes do site publicado — o que o design system não tinha porque as
   pranchetas do Figma eram de largura fixa.
   ══════════════════════════════════════════════════════════════════════ */

html{scroll-behavior:smooth}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}}
body{background:var(--fundo);color:var(--t);font-family:var(--sans);font-size:18px;line-height:1.55;
  -webkit-font-smoothing:antialiased;overflow-x:hidden}
img{max-width:100%;height:auto}
a{color:var(--azul-link)}
:where(a,button,summary,input,textarea,select):focus-visible{outline:3px solid var(--foco);outline-offset:3px;border-radius:2px}

/* pular para o conteúdo */
.pular{position:absolute;left:-9999px;top:0;z-index:100;background:#fff;color:var(--azul-titulo);
  padding:12px 18px;border:2px solid var(--azul);border-radius:0 0 var(--r-md) 0;font-weight:600}
.pular:focus{left:0}

/* logo em arquivo */
.lg{display:block;background-size:contain;background-repeat:no-repeat;background-position:left center}
.lg.claro{background-image:url(../imagens/logo/aviahub-logo.png)}
.lg.escuro{background-image:url(../imagens/logo/aviahub-logo-branca.png)}
.lg.simb{background-image:url(../imagens/logo/aviahub-simbolo.png)}

/* cabeçalho fixo */
.cab{position:sticky;top:0}
.cab .in{gap:22px}
.cab .abrir{display:none;background:none;border:1px solid var(--borda);border-radius:var(--r-md);
  width:44px;height:44px;align-items:center;justify-content:center;cursor:pointer;margin-left:auto}
.cab .abrir span{display:block;width:20px;height:2px;background:var(--azul-titulo);position:relative}
.cab .abrir span::before,.cab .abrir span::after{content:"";position:absolute;left:0;width:20px;height:2px;background:inherit}
.cab .abrir span::before{top:-6px}.cab .abrir span::after{top:6px}
.cab.sobre .abrir{border-color:rgba(255,255,255,.4)}
.cab.sobre .abrir span,.cab.sobre .abrir span::before,.cab.sobre .abrir span::after{background:#fff}

/* trilha de navegação */
.trilha{background:var(--fundo-2);border-bottom:1px solid var(--borda);font-size:14px}
.trilha ol{max-width:1120px;margin:0 auto;padding:12px 60px;list-style:none;display:flex;flex-wrap:wrap;gap:8px;align-items:center}
.trilha li::after{content:"›";margin-left:8px;color:var(--t-fraco)}
.trilha li:last-child::after{content:""}
.trilha a{color:var(--azul-link);text-decoration:none}
.trilha a:hover{text-decoration:underline}
.trilha [aria-current]{color:var(--t-suave)}

/* texto corrido */
.texto p{font-size:18px;line-height:1.65;color:var(--t-suave);max-width:72ch}
.texto p strong{color:var(--t-forte)}
.texto ul{max-width:72ch;padding-left:22px;color:var(--t-suave)}
.texto li{margin-bottom:9px;line-height:1.6}
.texto h3{margin:34px 0 12px;font:600 22px/1.3 var(--sans);color:var(--azul-titulo)}
.texto h4{margin:26px 0 8px;font:600 19px/1.35 var(--sans);color:var(--t-forte)}
.rolar{overflow-x:auto;-webkit-overflow-scrolling:touch;margin:0 0 6px}

/* FAQ com <details> nativo — funciona sem JavaScript */
.faq details{border-bottom:1px solid var(--borda);padding:0}
.faq details summary{list-style:none;cursor:pointer;padding:22px 0;display:flex;gap:16px;align-items:flex-start;
  font:600 18px/1.4 var(--sans);color:var(--azul-titulo);transition:color var(--t1)}
.faq details summary::-webkit-details-marker{display:none}
.faq details summary:hover{color:var(--azul)}
.faq details summary i{font-style:normal;color:var(--azul);font-size:24px;line-height:1;margin-left:auto;
  transition:transform var(--t2) var(--curva)}
.faq details[open] summary i{transform:rotate(45deg)}
.faq details .r{padding:0 40px 24px 0;font-size:17px;line-height:1.6;color:var(--t-suave);max-width:80ch}
.faq h3{margin:0;font:inherit;color:inherit}

/* glossário */
.verbete{border-bottom:1px solid var(--borda);padding:20px 0}
.verbete h3{margin:0 0 6px;font:600 19px/1.3 var(--sans);color:var(--azul-titulo)}
.verbete p{margin:0;font-size:17px;line-height:1.6;color:var(--t-suave);max-width:80ch}
.verbete a{font-size:15px}

/* formulário */
.campo{margin-bottom:18px}
.campo label{display:block;font:600 15px/1.4 var(--sans);color:var(--t-forte);margin-bottom:6px}
.campo .dica{font-size:14px;color:var(--t-fraco);margin:0 0 6px}
.campo input,.campo textarea,.campo select{width:100%;font:400 17px/1.5 var(--sans);color:var(--t-forte);
  padding:13px 14px;border:1px solid var(--borda-forte);border-radius:var(--r-md);background:#fff;
  transition:border-color var(--t1),box-shadow var(--t2)}
.campo input:focus,.campo textarea:focus{border-color:var(--azul);box-shadow:0 0 0 3px rgba(0,108,192,.16);outline:none}
.campo textarea{min-height:120px;resize:vertical}
.campo .erro{color:var(--erro);font-size:14px;margin:6px 0 0;display:none}
.campo.invalido input,.campo.invalido textarea{border-color:var(--erro);background:var(--erro-bg)}
.campo.invalido .erro{display:block}
.aceite{display:flex;gap:11px;align-items:flex-start;font-size:15px;line-height:1.5;color:var(--t-suave);margin:6px 0 20px}
.aceite input{width:20px;height:20px;flex:none;margin-top:2px;accent-color:var(--azul)}
.etapas{display:flex;gap:8px;margin-bottom:22px;font-size:13px;color:var(--t-fraco);font-weight:600;letter-spacing:.04em}
.etapas span{display:flex;align-items:center;gap:7px}
.etapas b{width:24px;height:24px;border-radius:50%;display:grid;place-items:center;background:var(--borda);color:var(--t-suave);font-size:13px}
.etapas .on b{background:var(--grad);color:#fff}
.etapas .on{color:var(--azul-titulo)}
.passo-form[hidden]{display:none}
.form .acoes{display:flex;gap:12px;align-items:center;flex-wrap:wrap;margin-top:8px}

/* aviso de cookies */
.cookies{position:fixed;left:16px;right:16px;bottom:16px;z-index:80;background:#fff;border:1px solid var(--borda);
  border-radius:var(--r-lg);box-shadow:var(--sombra-2);padding:18px 20px;max-width:660px;margin:0 auto;
  display:flex;gap:16px;align-items:center;flex-wrap:wrap}
.cookies p{margin:0;font-size:15px;line-height:1.5;color:var(--t-suave);flex:1 1 280px}
.cookies[hidden]{display:none}

/* mapa estático da página de contato */
.mapa{display:block;border:1px solid var(--borda);border-radius:var(--r-lg);overflow:hidden;
  box-shadow:var(--sombra-1);transition:box-shadow var(--t2),transform var(--t2)}
.mapa:hover{box-shadow:var(--sombra-2);transform:translateY(-3px)}

/* diagramas dentro da página */
.dgrm{margin:26px 0}
.dgrm svg{width:100%;height:auto;display:block}

/* grade de duas colunas */
.duas{display:grid;grid-template-columns:1.15fr .85fr;gap:44px;align-items:start}
.duas.igual{grid-template-columns:1fr 1fr}

/* retratos */
.retratos{display:grid;grid-template-columns:1fr 1fr;gap:22px;max-width:1000px}
.retrato{background:#fff;border:1px solid var(--borda);border-radius:var(--r-lg);overflow:hidden;
  box-shadow:var(--sombra-1);transition:transform var(--t2) var(--curva),box-shadow var(--t2);
  display:grid;grid-template-columns:172px 1fr;align-items:start;
  aspect-ratio:auto;position:relative;padding-top:5px}
.retrato::after{display:none}
.retrato:hover{transform:translateY(-6px);box-shadow:var(--sombra-2)}
.retrato img{width:172px;height:215px;object-fit:cover;object-position:center 20%;display:block}
.retrato .tx{padding:18px 20px 20px}
.retrato h4{margin:0 0 3px}
.retrato .c{font-size:14px;color:var(--azul);font-weight:600;letter-spacing:.04em;text-transform:uppercase}
.retrato p{font-size:16px;color:var(--t-suave);line-height:1.55;margin:10px 0 12px}

/* dados formais */
.dados{background:var(--fundo-2);border:1px solid var(--borda);border-radius:var(--r-lg);padding:26px 28px}
.dados dl{margin:0;display:grid;grid-template-columns:auto 1fr;gap:10px 20px;font-size:16px}
.dados dt{font-weight:600;color:var(--azul-titulo)}
.dados dd{margin:0;color:var(--t-suave)}

/* ── celular ─────────────────────────────────────────────────────────── */
@media (max-width:1180px){
  .wrap,.wrap-estreito,.faixa .in,.cab .in,.prova .in,.rod .in,.trilha ol{padding-left:28px;padding-right:28px}
}
@media (max-width:900px){
  body{font-size:17px}
  .cab .in{height:64px}
  .cab .abrir{display:flex}
  .menu{position:fixed;inset:64px 0 auto 0;background:#fff;flex-direction:column;align-items:stretch;gap:0;
    padding:8px 28px 22px;border-bottom:1px solid var(--borda);box-shadow:var(--sombra-2);z-index:20}
  .menu[hidden]{display:none}
  .menu a{padding:14px 0;border-bottom:1px solid var(--borda-fina);font-size:17px}
  .cab.sobre .menu{background:#fff}
  .cab.sobre .menu a{color:var(--t-suave);border-bottom-color:var(--borda-fina)}
  .cab.sobre .menu a.on{color:var(--azul-titulo);border-bottom-color:var(--azul)}
  .cookies{padding:14px 16px;gap:10px;left:10px;right:10px;bottom:10px}
  .cookies p{font-size:14px;flex:1 1 100%}
  .cookies .bt{width:auto;flex:1}
  .cab .acao{display:none}
  .faixa .in{padding-top:52px;padding-bottom:52px}
  h1.d{font-size:34px!important;line-height:1.16!important}
  h2.t{font-size:27px!important;line-height:1.2!important}
  .sec{padding:56px 0}
  .cards.c2,.cards.c3,.cards.c4{grid-template-columns:1fr}
  .duas,.duas.igual{grid-template-columns:1fr;gap:30px}
  .retratos{grid-template-columns:1fr}
  .retrato{grid-template-columns:132px 1fr}
  .retrato img{width:132px;height:165px}
  .prova .in{flex-wrap:wrap;gap:26px 34px;padding:24px 28px}
  .prova .n{font-size:28px}
  .rod .cols{grid-template-columns:1fr 1fr!important;gap:28px}
  /* A tabela de comparacao vira lista: cada linha um bloco, com o rotulo da
     coluna antes do valor. Rolar tabela de lado no celular esconde metade. */
  .rolar{overflow:visible}
  .tb{font-size:15px;min-width:0;display:block}
  .tb thead{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%)}
  .tb tbody,.tb tr,.tb td,.tb th{display:block;width:auto}
  .tb tr{border:1px solid var(--borda);border-radius:var(--r-lg);margin:0 0 12px;padding:4px 0;background:var(--fundo)}
  .tb td,.tb th{border:0;padding:10px 14px}
  .tb td::before,.tb th[scope="row"]::before{content:attr(data-col);display:block;
    font:700 12px/1.3 var(--sans);letter-spacing:.08em;text-transform:uppercase;
    color:var(--azul);margin-bottom:4px}
  .tb tr:nth-child(even) td{background:transparent}
  .dados dl{grid-template-columns:1fr;gap:4px 0}
  .dados dd{margin-bottom:10px}
  .bt{width:100%;justify-content:center}
  .faixa .bts,.acoes{flex-direction:column;align-items:stretch}
}
@media (max-width:520px){
  .rod .cols{grid-template-columns:1fr!important}
  h1.d{font-size:29px!important}
  .faixa .in{padding-top:42px;padding-bottom:42px}
}

/* ── impressão ───────────────────────────────────────────────────────── */
@media print{
  .cab,.rod,.cookies,.wa,.pular,.trilha{display:none}
  .faixa{background:#fff;color:#000;box-shadow:none}
  .faixa .bg,.faixa .luz,.faixa .vel{display:none}
  .faixa h1,.faixa h2,.faixa p{color:#000}
  .sec{padding:18px 0;break-inside:avoid}
  a[href^="http"]::after{content:" (" attr(href) ")";font-size:11px;color:#555}
  body{font-size:12pt}
}

/* cabeçalho: caber sem estourar */
@media (max-width:1320px){ .menu{gap:18px;font-size:14.5px} .cab .acao .bt{font-size:14px;padding:11px 15px} }
@media (max-width:1120px){ .cab .acao{display:none} }

/* títulos de card, passo e retrato: nível h3 na semântica, aparência de h4 */
.ch{font:700 18px/1.35 var(--sans);margin:0 0 10px;color:var(--t-forte);letter-spacing:-.005em}
.passo .tx .ch{margin:6px 0}

/* o cabeçalho tem sete itens de menu: precisa de mais largura que o corpo */
.cab .in{max-width:1320px}
.menu{gap:21px;font-size:15px}
.cab .acao .bt{white-space:nowrap}
@media (max-width:1400px){ .menu{gap:17px;font-size:14.5px} }

@media (max-width:420px){ .retrato{grid-template-columns:1fr} .retrato img{width:100%;height:auto;aspect-ratio:4/3} }

/* ── entrada dos diagramas: traço que se desenha + formas que aparecem ── */
.dgrm svg .tr{stroke-dasharray:1;stroke-dashoffset:1;
  transition:stroke-dashoffset 1.05s var(--curva) calc(var(--i,0) * 26ms)}
.dgrm.vis svg .tr{stroke-dashoffset:0}
.dgrm svg .fd{opacity:0;transition:opacity .5s var(--curva) calc(var(--i,0) * 26ms)}
.dgrm.vis svg .fd{opacity:1}
@media (prefers-reduced-motion:reduce){
  .dgrm svg .tr{stroke-dashoffset:0}
  .dgrm svg .fd{opacity:1}
}

/* ── diagrama em duas colunas: nunca de ponta a ponta ── */
.wrap-largo{max-width:1320px;margin:0 auto;padding:0 60px}
.dupla{display:grid;grid-template-columns:minmax(0,1fr) 330px;gap:40px;align-items:center}
.dupla.invertida{grid-template-columns:330px minmax(0,1fr)}
.dupla.invertida .dgrm{order:2}
.dupla.invertida .dgrm-tx{order:1}
.dupla .dgrm{margin:0;min-width:0}
.dgrm-tx .eyebrow{margin:0 0 8px}
.dgrm-tx .ct{font:700 22px/1.28 var(--sans);letter-spacing:-.01em;margin:0 0 12px;color:var(--azul-titulo)}
.dgrm-tx .p-prova{font-size:17px;line-height:1.6;color:var(--t-suave);margin:0 0 14px}
.dgrm-tx .mini{margin:0;padding-top:14px;border-top:1px solid var(--borda);font-size:14px;line-height:1.5}
.dgrm-tx .mini b{color:var(--azul-titulo)}
@media (max-width:1180px){ .wrap-largo{padding-left:28px;padding-right:28px} }
@media (max-width:980px){
  .dupla,.dupla.invertida{grid-template-columns:1fr;gap:24px}
  .dupla.invertida .dgrm{order:0}
  /* Nada mais largo que a tela. O diagrama cabe inteiro; para ler os rotulos
     existe o botao "Ampliar", que abre em tela cheia. Forcar largura minima
     aqui so empurrava o desenho para fora do celular. */
  .dgrm{overflow:visible;position:relative}
  .dgrm svg{min-width:0;width:100%;height:auto}
}

/* ── banda "a IA é ativo da empresa" ────────────────────────────────── */
.ativo{position:relative;border-top:1px solid var(--borda);border-bottom:1px solid var(--borda);background:linear-gradient(180deg,#fff,var(--fundo-2));box-shadow:var(--sombra-1)}
.ativo::before{content:"";position:absolute;left:0;right:0;top:0;height:4px;background:var(--grad-metal)}
.ativo .in{max-width:1160px;margin:0 auto;padding:40px 60px 44px;display:grid;grid-template-columns:minmax(0,318px) minmax(0,1fr);gap:46px;align-items:start}
.ativo .eyebrow{margin-bottom:12px}
.ativo h2{font:700 30px/1.14 var(--sans);letter-spacing:-.022em;margin:0 0 14px;background:var(--grad-metal);-webkit-background-clip:text;background-clip:text;color:transparent}
.ativo .hd>p{margin:0;font-size:16.5px;line-height:1.55;color:var(--t);font-weight:400}
.ativo .it{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:28px}
.ativo .it h3{font:700 15px/1.32 var(--sans);color:var(--azul-titulo);margin:0 0 8px;padding-top:12px;border-top:2px solid var(--azul)}
.ativo .it>div:nth-child(2) h3{border-top-color:#2B8BD9}
.ativo .it>div:nth-child(3) h3{border-top-color:var(--verde)}
.ativo .it p{margin:0;font-size:14px;line-height:1.52;color:var(--t-suave)}
@media (max-width:1080px){ .ativo .in{grid-template-columns:1fr;gap:30px;padding:34px 40px 38px} .ativo h2{font-size:27px} }
@media (max-width:760px){ .ativo .it{grid-template-columns:1fr;gap:22px} .ativo .in{padding:30px 28px 34px} .ativo h2{font-size:24px} }
.retrato .areas{margin-top:10px;font-size:13.5px;line-height:1.5;color:var(--t-suave)}
.retrato .areas b{color:var(--azul-titulo)}
/* ── vantagens com fonte, e link para a página de perguntas ──────── */
.card.vant .fonte{margin-top:14px;padding-top:10px;border-top:1px solid var(--borda-fina);font-size:12.5px;line-height:1.45;color:var(--t-fraco)}
.card.vant .fonte a{color:var(--t-fraco)}
.card.vant .fonte a:hover{color:var(--azul-link)}
.faq-link{margin:26px 0 0;font-size:16px}
.faq-link a{font-weight:600}

/* ── botão flutuante de WhatsApp ────────────────────────────────────── */
.zap{position:fixed;right:22px;bottom:22px;z-index:70;display:inline-flex;align-items:center;gap:10px;
  padding:13px 20px 13px 16px;border-radius:var(--r-pill);color:#fff;text-decoration:none;font:700 15px/1 var(--sans);
  background:linear-gradient(135deg,#0A4F8A,#006CC0 55%,#0A6B8A);
  box-shadow:0 6px 18px rgba(6,42,77,.35),0 1px 0 rgba(255,255,255,.25) inset;
  transition:transform var(--t2) var(--curva),box-shadow var(--t2) var(--curva),bottom var(--t2) var(--curva);
  animation:zap-entra .6s var(--curva) .4s both}
.zap:hover{transform:translateY(-3px);box-shadow:0 12px 28px rgba(6,42,77,.4),0 1px 0 rgba(255,255,255,.25) inset;color:#fff}
.zap:focus-visible{outline:3px solid #fff;outline-offset:3px}
.zap svg{flex:none}
@keyframes zap-entra{from{opacity:0;transform:translateY(16px)}to{opacity:1;transform:none}}
.cookies:not([hidden])~.zap,body.cookies-aberto .zap{bottom:110px}
@media (max-width:760px){
  .zap{right:16px;bottom:16px;padding:0;width:56px;height:56px;justify-content:center}
  .zap span{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
  .zap svg{width:26px;height:26px}
  body.cookies-aberto .zap{bottom:150px}
}
@media (prefers-reduced-motion:reduce){.zap{animation:none}}
@media print{.zap{display:none}}
.rod .creditos{font-size:12.5px;color:rgba(255,255,255,.5);margin-top:6px}

.rod .base a{display:inline}
.rod .in{padding-bottom:84px}

/* ── faixa de logos de parceiros ─────────────────────────────────────── */

/* logos: sem borda, profundidade por sombra, giro horizontal no hover, clique abre o site */
.logos{list-style:none;margin:34px 0 0;padding:0;display:grid;grid-template-columns:repeat(8,minmax(0,1fr));gap:16px}
.logos li{perspective:1000px;height:126px}
.logos li.rv{transition-delay:calc(var(--i,0) * 60ms)}
.lg-cartao{display:block;height:100%;text-decoration:none;border-radius:14px;outline:0}
.lg-giro{position:relative;display:block;height:100%;transform-style:preserve-3d;
  transition:transform 760ms var(--curva),translate var(--t2) var(--curva)}
.lg-face{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;border-radius:14px;
  -webkit-backface-visibility:hidden;backface-visibility:hidden;overflow:hidden}
.lg-frente{padding:18px 16px;transform:rotateY(0deg);background:linear-gradient(158deg,#fff 0%,#FAFCFE 44%,#E9F1F9 100%);
  box-shadow:0 1px 2px rgba(6,42,77,.10),0 10px 20px rgba(6,42,77,.13),0 26px 44px rgba(6,42,77,.12),inset 0 1px 0 #fff,inset 0 -14px 26px rgba(6,42,77,.05);
  transition:box-shadow var(--t2) var(--curva)}
.lg-verso{transform:rotateY(180deg);flex-direction:column;gap:6px;padding:14px 9px;text-align:center;color:#fff;
  background:var(--grad-metal);box-shadow:0 2px 6px rgba(6,42,77,.18),0 16px 30px rgba(6,42,77,.24),0 34px 60px rgba(6,42,77,.2),inset 0 1px 0 rgba(255,255,255,.34)}
.lg-verso b{font-size:14.5px;font-weight:700;line-height:1.25;letter-spacing:.01em}
.lg-verso em{font-style:normal;font-size:10.5px;letter-spacing:.05em;white-space:nowrap;text-transform:uppercase;color:rgba(255,255,255,.82)}
.lg-verso::after{content:"";position:absolute;left:0;right:0;top:0;height:3px;background:linear-gradient(90deg,rgba(255,255,255,.7),rgba(255,255,255,0))}
.logos img{max-width:100%;max-height:76px;width:auto;height:auto;object-fit:contain;
  filter:drop-shadow(0 2px 3px rgba(6,42,77,.16));transition:transform var(--t2) var(--curva)}
.lg-seta{position:absolute;right:9px;top:6px;font-style:normal;font-size:13px;line-height:1;color:var(--azul);opacity:.4;transition:opacity var(--t2)}
.lg-seta::before{content:"\2197"}
.lg-cartao:hover .lg-seta{opacity:0}
.lg-cartao:hover .lg-giro,.lg-cartao:focus-visible .lg-giro{transform:rotateY(180deg);translate:0 -8px}
.lg-cartao:hover .lg-frente{box-shadow:0 2px 4px rgba(6,42,77,.14),0 18px 32px rgba(6,42,77,.2),0 40px 70px rgba(6,42,77,.18),inset 0 1px 0 #fff}
.lg-cartao:focus-visible{outline:3px solid var(--foco);outline-offset:5px}
@media (hover:none){.lg-cartao:hover .lg-giro{transform:none;translate:0 0}}
@media (prefers-reduced-motion:reduce){.lg-giro{transition:none}.lg-cartao:hover .lg-giro,.lg-cartao:focus-visible .lg-giro{transform:none;translate:0 -4px}}
@media (max-width:1240px){.logos{grid-template-columns:repeat(4,minmax(0,1fr));gap:20px}}
@media (max-width:760px){.logos{grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}.logos li{height:104px}.logos img{max-height:58px}.lg-verso b{font-size:13px}}
@media (max-width:420px){.logos{grid-template-columns:repeat(2,minmax(0,1fr))}.logos li:last-child:nth-child(odd){grid-column:span 2}}

/* ── por onde o dado passa: cena animada ── */
.fluxo{position:relative;margin-top:30px;display:grid;align-items:start;
  grid-template-columns:minmax(0,1fr) 372px;grid-template-rows:auto auto 1fr;
  grid-template-areas:"palco abas" "palco notas" "palco leg";column-gap:38px;row-gap:20px}
.fx-r{position:absolute;width:1px;height:1px;opacity:0;margin:0;pointer-events:none}
.fx-abas{grid-area:abas;display:grid;grid-template-columns:1fr;gap:12px;margin:0}
.fx-abas label{position:relative;display:block;cursor:pointer;padding:14px 18px 15px;border-radius:10px;overflow:hidden;
  background:linear-gradient(180deg,rgba(255,255,255,.86),rgba(255,255,255,.6));
  box-shadow:inset 0 0 0 1px var(--borda-fina),0 1px 2px rgba(6,42,77,.06);
  transition:box-shadow var(--t2) var(--curva),transform var(--t2) var(--curva),background var(--t2)}
.fx-abas label::after{content:"";position:absolute;left:0;right:0;bottom:0;height:3px;background:var(--grad-metal);transform:scaleX(0);transform-origin:left;transition:transform var(--t3) var(--curva)}
.fx-abas label b{display:block;font-size:16px;font-weight:700;color:var(--azul-titulo);line-height:1.3}
.fx-abas label span{display:block;font-size:13px;color:var(--t-fraco);margin-top:3px}
.fx-abas label:hover{transform:translateY(-2px);box-shadow:inset 0 0 0 1px var(--borda),var(--sombra-1)}
#fx-api:checked~.fx-abas label[for="fx-api"],#fx-nossa:checked~.fx-abas label[for="fx-nossa"]{background:#fff;box-shadow:inset 0 0 0 1px rgba(0,108,192,.34),var(--sombra-1);transform:translateY(-2px)}
#fx-api:checked~.fx-abas label[for="fx-api"]::after,#fx-nossa:checked~.fx-abas label[for="fx-nossa"]::after{transform:scaleX(1)}
#fx-api:focus-visible~.fx-abas label[for="fx-api"],#fx-nossa:focus-visible~.fx-abas label[for="fx-nossa"]{outline:3px solid var(--foco);outline-offset:3px}
.fx-palco{grid-area:palco;position:relative;border-radius:16px;padding:16px 18px;overflow:hidden;
  background:radial-gradient(120% 110% at 20% 0%,#fff 0%,#F6FAFD 46%,#E6EFF9 100%);box-shadow:var(--sombra-2)}
.fx-palco::before{content:"";position:absolute;inset:0;pointer-events:none;
  background-image:linear-gradient(rgba(10,79,138,.07) 1px,transparent 1px),linear-gradient(90deg,rgba(10,79,138,.07) 1px,transparent 1px);background-size:36px 36px;
  -webkit-mask-image:radial-gradient(78% 76% at 50% 42%,#000,transparent);mask-image:radial-gradient(78% 76% at 50% 42%,#000,transparent)}
.fx-svg{display:block;width:100%;height:auto;position:relative}
.fx-v{display:none}
.fx-rede{fill:rgba(0,108,192,.05);stroke:var(--azul);stroke-width:1.7;stroke-dasharray:7 7;opacity:.9;animation:fx-formiga 3.6s linear infinite}
@keyframes fx-formiga{to{stroke-dashoffset:-28}}
.fx-forn{fill:rgba(11,31,51,.05);stroke:var(--t-fraco);stroke-width:1.4;stroke-dasharray:4 6;opacity:.75}
.fx-rot{font:700 12.5px/1 var(--sans);letter-spacing:.13em;fill:var(--azul-titulo);opacity:.72}
.fx-rot-f{fill:var(--t-fraco);opacity:.9}
.fx-caixa{fill:#fff}
.fx-caixa-g{fill:#FCFDFF}
.fx-ic{fill:none;stroke:var(--azul);stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
.fx-ic-g{stroke:var(--verde);stroke-width:1.6}
.fx-tt{font:600 16px/1 var(--sans);fill:var(--t-forte)}
.fx-tg{font:700 19px/1 var(--sans);fill:var(--azul-titulo)}
.fx-ts{font:400 13.5px/1 var(--sans);fill:var(--t-suave)}
.fx-mini{font:600 12.5px/1 var(--sans);fill:var(--t-fraco)}
.fx-alerta{font:700 13px/1 var(--sans);fill:var(--erro)}
.fx-alerta-v{font-size:11.5px}
.fx-linha{fill:none;stroke:rgba(10,79,138,.2);stroke-width:2.6;stroke-linecap:round}
.fx-no{fill:var(--azul);stroke:#fff;stroke-width:2}
.fx-pulso{fill:none;stroke:var(--azul);stroke-width:3.6;stroke-linecap:round;stroke-dasharray:9 100;
  animation:fx-corre 2.9s linear infinite;filter:drop-shadow(0 0 5px rgba(0,108,192,.6))}
@keyframes fx-corre{from{stroke-dashoffset:0}to{stroke-dashoffset:-109}}
.fx-d1{animation-delay:.22s}
.fx-d2{animation-delay:.5s}
.fx-volta{stroke:var(--verde);opacity:.8;animation-name:fx-volta;animation-delay:1.5s;filter:drop-shadow(0 0 5px rgba(0,72,60,.45))}
@keyframes fx-volta{from{stroke-dashoffset:-109}to{stroke-dashoffset:0}}
.fx-anel{fill:none;stroke:var(--erro);stroke-width:2.4;transform-box:fill-box;transform-origin:center;animation:fx-anel 2.9s var(--curva) infinite}
@keyframes fx-anel{0%,72%{opacity:0;transform:scale(.5)}84%{opacity:1;transform:scale(1)}100%{opacity:0;transform:scale(2)}}
.fx-anel-ok{stroke:var(--verde);animation-duration:3.6s}
.fx-guia{fill:none;stroke:var(--erro);stroke-width:1.4;stroke-dasharray:3 5;opacity:.6}
.fx-admin{fill:none;stroke:var(--t-fraco);stroke-width:1.7;stroke-dasharray:5 6;opacity:.6}
.fx-admin-p{fill:none;stroke:var(--t-suave);stroke-width:2.8;stroke-linecap:round;stroke-dasharray:6 100;animation:fx-corre 3.6s linear infinite;opacity:.85}
.sA,.sB{transition:opacity var(--t3) var(--curva)}
.sB{opacity:0}
#fx-nossa:checked~.fx-palco .sA{opacity:0}
#fx-nossa:checked~.fx-palco .sB{opacity:1}
.fluxo.parado .fx-svg *{animation-play-state:paused}
.fx-notas{grid-area:notas;display:grid;margin:4px 0 0}
.fx-notas>p{grid-area:1/1;margin:0;font-size:16px;line-height:1.6;color:var(--t-suave);transition:opacity var(--t2) var(--curva)}
.fx-notas .nB{opacity:0;visibility:hidden}
#fx-nossa:checked~.fx-notas .nA{opacity:0;visibility:hidden}
#fx-nossa:checked~.fx-notas .nB{opacity:1;visibility:visible}
.fx-leg{grid-area:leg;display:flex;flex-direction:column;gap:10px;margin:0;font-size:13.5px;color:var(--t-fraco)}
.fx-leg span{display:inline-flex;align-items:center;gap:9px}
.fx-leg i{width:28px;border-top:3px solid var(--azul);border-radius:2px}
.fx-leg i.tr{border-top:2px dashed var(--t-fraco)}
@media (max-width:1020px){
  .fluxo{grid-template-columns:minmax(0,1fr);grid-template-rows:auto;grid-template-areas:"abas" "palco" "notas" "leg";row-gap:18px}
  .fx-abas{grid-template-columns:1fr 1fr}
  .fx-leg{flex-direction:row;flex-wrap:wrap;gap:24px}
}
@media (max-width:760px){
  .fx-h{display:none}.fx-v{display:block}
  .fx-abas{grid-template-columns:1fr;gap:10px}
  .fx-palco{padding:12px 10px}
  .fx-notas>p{font-size:15.5px}
  .fx-leg{flex-direction:column;gap:9px}
}
@media (prefers-reduced-motion:reduce){
  .fx-pulso,.fx-admin-p,.fx-anel,.fx-rede{animation:none}
  .fx-pulso,.fx-admin-p{stroke-dashoffset:-56}
  .fx-anel{opacity:.65}
}

/* ── ciclo: como a IA é construída, passo a passo ── */
.ciclo{position:relative;margin-top:30px;display:grid;grid-template-columns:minmax(0,1fr) 396px;column-gap:38px;row-gap:22px;align-items:stretch}
.ck-r{position:absolute;width:1px;height:1px;opacity:0;margin:0;pointer-events:none}
.ck-palco{position:relative;border-radius:16px;padding:12px 14px;overflow:hidden;display:flex;align-items:center;
  background:radial-gradient(120% 110% at 22% 0%,#fff 0%,#F6FAFD 46%,#E6EFF9 100%);box-shadow:var(--sombra-2)}
.ck-palco::before{content:"";position:absolute;inset:0;pointer-events:none;
  background-image:linear-gradient(rgba(10,79,138,.07) 1px,transparent 1px),linear-gradient(90deg,rgba(10,79,138,.07) 1px,transparent 1px);background-size:36px 36px;
  -webkit-mask-image:radial-gradient(80% 78% at 50% 46%,#000,transparent);mask-image:radial-gradient(80% 78% at 50% 46%,#000,transparent)}
.ck-svg{display:block;width:100%;height:auto;position:relative}
.ck-forma{fill:#fff;stroke:transparent;stroke-width:2.2;transition:stroke var(--t2) var(--curva)}
.ck-tampa{fill:none;stroke:var(--borda-forte);stroke-width:1.4}
.ck-ic{fill:none;stroke:var(--azul);stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.ck-ic .ch{fill:var(--azul);stroke:none}
.n6 .ck-ic{stroke:var(--verde)}
.ck-fonte{fill:rgba(0,108,192,.05);stroke:var(--azul);stroke-width:1.5;stroke-dasharray:6 7;opacity:.85}
.ck-rot{font:700 12.5px/1 var(--sans);letter-spacing:.13em;fill:var(--azul-titulo);opacity:.75}
.ck-t{font:600 14.5px/1 var(--sans);fill:var(--t-forte)}
.ck-ts{font:400 13px/1 var(--sans);fill:var(--t-suave)}
.ck-tp{font:500 13px/1 var(--sans);fill:var(--t-forte)}
.ck-nota{font:400 12.5px/1 var(--sans);fill:var(--t-fraco)}
.ck-ret{font-weight:600;fill:var(--verde)}
.ck-no{opacity:.46;transition:opacity var(--t3) var(--curva)}
.ck-seta{opacity:.34;transition:opacity var(--t3) var(--curva)}
.ck-seta .ln{fill:none;stroke:rgba(10,79,138,.5);stroke-width:2.4;stroke-linecap:round;stroke-linejoin:round}
.ck-seta.ar .ln{stroke:rgba(0,72,60,.55);stroke-width:3.4}
.ck-seta .p{fill:none;stroke:var(--azul);stroke-width:3.6;stroke-linecap:round;stroke-dasharray:11 100;
  animation:fx-corre 1.9s linear infinite;filter:drop-shadow(0 0 5px rgba(0,108,192,.55))}
.ck-seta.ar .p{stroke:var(--verde);animation-duration:2.6s;filter:drop-shadow(0 0 5px rgba(0,72,60,.45))}
#ck-1:checked~.ck-palco .n1,#ck-2:checked~.ck-palco .n2,#ck-3:checked~.ck-palco .n3,#ck-4:checked~.ck-palco .n4,#ck-5:checked~.ck-palco .n5,#ck-6:checked~.ck-palco .n6,#ck-7:checked~.ck-palco .n7{opacity:1}
#ck-2:checked~.ck-palco .a2,#ck-3:checked~.ck-palco .a3,#ck-4:checked~.ck-palco .a4,#ck-5:checked~.ck-palco .a5,#ck-6:checked~.ck-palco .a6,#ck-7:checked~.ck-palco .a7,#ck-7:checked~.ck-palco .ar{opacity:1}
#ck-1:checked~.ck-palco .n1 .ck-forma,#ck-2:checked~.ck-palco .n2 .ck-forma,#ck-3:checked~.ck-palco .n3 .ck-forma,#ck-4:checked~.ck-palco .n4 .ck-forma,#ck-5:checked~.ck-palco .n5 .ck-forma,#ck-6:checked~.ck-palco .n6 .ck-forma,#ck-7:checked~.ck-palco .n7 .ck-forma{stroke:var(--azul)}
#ck-7:checked~.ck-palco .n7 .ck-forma{stroke:var(--verde)}
.ciclo.parado .ck-svg *{animation-play-state:paused}
.ck-passos{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:6px}
.ck-passos label{position:relative;display:grid;grid-template-columns:28px 1fr;gap:1px 12px;padding:11px 14px 13px;border-radius:10px;cursor:pointer;overflow:hidden;
  opacity:.6;background:transparent;box-shadow:inset 0 0 0 1px transparent;
  transition:opacity var(--t2) var(--curva),background var(--t2),box-shadow var(--t2) var(--curva),transform var(--t2) var(--curva)}
.ck-passos label:hover{opacity:.9;background:rgba(255,255,255,.7);box-shadow:inset 0 0 0 1px var(--borda-fina)}
.ck-passos i{grid-row:1/3;font-style:normal;font-weight:700;font-size:12.5px;color:var(--azul);width:26px;height:26px;border-radius:50%;
  display:grid;place-items:center;background:var(--azul-claro);box-shadow:inset 0 0 0 1px rgba(0,108,192,.28);transition:background var(--t2),color var(--t2)}
.ck-passos b{font-size:15.5px;font-weight:700;color:var(--azul-titulo);line-height:1.3}
.ck-passos span{font-size:13.5px;line-height:1.45;color:var(--t-fraco)}
.ck-tempo{position:absolute;left:0;right:0;bottom:0;height:3px;background:var(--grad-metal);transform:scaleX(0);transform-origin:left}
#ck-1:checked~.ck-passos li:nth-child(1) label,#ck-2:checked~.ck-passos li:nth-child(2) label,#ck-3:checked~.ck-passos li:nth-child(3) label,#ck-4:checked~.ck-passos li:nth-child(4) label,#ck-5:checked~.ck-passos li:nth-child(5) label,#ck-6:checked~.ck-passos li:nth-child(6) label,#ck-7:checked~.ck-passos li:nth-child(7) label{opacity:1;background:#fff;box-shadow:inset 0 0 0 1px rgba(0,108,192,.3),var(--sombra-1);transform:translateX(2px)}
#ck-1:checked~.ck-passos li:nth-child(1) i,#ck-2:checked~.ck-passos li:nth-child(2) i,#ck-3:checked~.ck-passos li:nth-child(3) i,#ck-4:checked~.ck-passos li:nth-child(4) i,#ck-5:checked~.ck-passos li:nth-child(5) i,#ck-6:checked~.ck-passos li:nth-child(6) i,#ck-7:checked~.ck-passos li:nth-child(7) i{background:var(--grad-metal);color:#fff;box-shadow:0 3px 8px rgba(0,108,192,.35)}
#ck-1:checked~.ck-passos li:nth-child(1) .ck-tempo,#ck-2:checked~.ck-passos li:nth-child(2) .ck-tempo,#ck-3:checked~.ck-passos li:nth-child(3) .ck-tempo,#ck-4:checked~.ck-passos li:nth-child(4) .ck-tempo,#ck-5:checked~.ck-passos li:nth-child(5) .ck-tempo,#ck-6:checked~.ck-passos li:nth-child(6) .ck-tempo,#ck-7:checked~.ck-passos li:nth-child(7) .ck-tempo{animation:ck-tempo 4600ms linear forwards}
@keyframes ck-tempo{from{transform:scaleX(0)}to{transform:scaleX(1)}}
.ciclo.manual .ck-tempo,.ciclo.parado .ck-tempo{animation:none;transform:scaleX(0)}
.ck-r:focus-visible~.ck-passos label{outline:0}
#ck-1:focus-visible~.ck-passos li:nth-child(1) label,#ck-2:focus-visible~.ck-passos li:nth-child(2) label,#ck-3:focus-visible~.ck-passos li:nth-child(3) label,#ck-4:focus-visible~.ck-passos li:nth-child(4) label,#ck-5:focus-visible~.ck-passos li:nth-child(5) label,#ck-6:focus-visible~.ck-passos li:nth-child(6) label,#ck-7:focus-visible~.ck-passos li:nth-child(7) label{outline:3px solid var(--foco);outline-offset:2px}
.ck-dica{display:none}
@media (max-width:1020px){.ciclo{grid-template-columns:minmax(0,1fr)}}
@media (max-width:760px){
  .ck-dica{display:block;margin:8px 0 0;font-size:12.5px;color:var(--t-fraco);text-align:center;letter-spacing:.02em}
  .ck-palco{overflow:visible;padding:10px}
  .ck-svg{min-width:0;width:100%;height:auto}
  .ck-passos label{padding:10px 12px 12px}
  .ck-passos b{font-size:15px}
}
@media (prefers-reduced-motion:reduce){.ck-seta .p{animation:none;stroke-dashoffset:-56}.ck-tempo{animation:none!important}}

/* ── botões flutuantes: voltar e topo ── */
.flutua{position:fixed;right:22px;bottom:88px;z-index:70;display:flex;flex-direction:column;gap:10px}
.fbt{width:44px;height:44px;border-radius:50%;border:0;padding:0;cursor:pointer;display:grid;place-items:center;color:#fff;
  background:var(--grad-metal);background-size:210% 100%;background-position:70% 0;
  box-shadow:0 6px 16px rgba(6,42,77,.3),0 1px 3px rgba(6,42,77,.24),inset 0 1px 0 rgba(255,255,255,.3);
  transition:transform var(--t2) var(--curva),box-shadow var(--t2) var(--curva),background-position var(--t3) var(--curva)}
.fbt:hover{transform:translateY(-3px);background-position:0 0;box-shadow:0 12px 26px rgba(0,108,192,.42),0 2px 6px rgba(6,42,77,.3)}
.fbt:active{transform:translateY(0) scale(.94);transition-duration:80ms}
.fbt:focus-visible{outline:3px solid var(--foco);outline-offset:3px}
.cookies:not([hidden])~.flutua,body.cookies-aberto .flutua{bottom:176px}
@media (max-width:760px){.flutua{right:16px;bottom:84px;gap:8px}.fbt{width:40px;height:40px}
  .cookies:not([hidden])~.flutua,body.cookies-aberto .flutua{bottom:218px}}
@media print{.flutua{display:none}}

/* ── link animado para a página dedicada ── */
.link-tec{margin:20px 0 0}
.link-tec a{position:relative;display:inline-flex;align-items:center;gap:12px;padding:13px 24px;border-radius:var(--r-pill);
  text-decoration:none;font:600 16px/1 var(--sans);color:var(--azul-titulo);background:#fff;overflow:hidden;
  box-shadow:inset 0 0 0 1.5px rgba(0,108,192,.3),0 2px 6px rgba(6,42,77,.1);
  transition:color var(--t2),box-shadow var(--t2) var(--curva),transform var(--t2) var(--curva)}
.link-tec a::before{content:"";position:absolute;inset:0;background:var(--grad-metal);opacity:0;transition:opacity var(--t2) var(--curva)}
.link-tec a::after{content:"";position:absolute;top:-40%;bottom:-40%;left:-70%;width:42%;transform:skewX(-22deg);
  background:linear-gradient(90deg,transparent,rgba(0,108,192,.16),transparent);animation:tec-brilho 4.2s var(--curva) infinite}
@keyframes tec-brilho{0%{left:-70%}45%,100%{left:135%}}
.link-tec .tx,.link-tec .st{position:relative;z-index:1}
.link-tec .st{display:grid;place-items:center;transition:transform var(--t2) var(--curva)}
.link-tec a:hover{color:#fff;transform:translateY(-2px);box-shadow:0 14px 30px rgba(0,108,192,.4),inset 0 0 0 1.5px transparent}
.link-tec a:hover::before{opacity:1}
.link-tec a:hover .st{transform:translateX(5px)}
.link-tec a:focus-visible{outline:3px solid var(--foco);outline-offset:3px}
.sec.alt .link-tec a{background:rgba(255,255,255,.92)}
@media (prefers-reduced-motion:reduce){.link-tec a::after{animation:none;opacity:0}}

/* ── seção preta: contraste com o degradê metálico da marca ── */
.sec.preta{position:relative;overflow:hidden;color:#CFE0EE;
  background:radial-gradient(120% 130% at 14% -10%,#15263A 0%,#0B1420 46%,#04070B 100%)}
.sec.preta::before{content:"";position:absolute;left:0;right:0;top:0;height:3px;background:var(--grad-metal);box-shadow:0 0 26px rgba(43,139,217,.55)}
.sec.preta::after{content:"";position:absolute;inset:0;pointer-events:none;
  background-image:linear-gradient(rgba(140,196,242,.05) 1px,transparent 1px),linear-gradient(90deg,rgba(140,196,242,.05) 1px,transparent 1px);background-size:44px 44px;
  -webkit-mask-image:radial-gradient(70% 80% at 20% 0%,#000,transparent);mask-image:radial-gradient(70% 80% at 20% 0%,#000,transparent)}
.sec.preta>*{position:relative;z-index:1}
.sec.preta .eyebrow{color:#5FBFE8}
.sec.preta h2.t{background:linear-gradient(92deg,#EAF3FB 0%,#8CC4F2 42%,#2B8BD9 72%,#3FC2A3 100%);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}
.sec.preta .lead{color:#9DB3C6}
.sec.preta .sec-cab .barra-t{background:linear-gradient(90deg,#2B8BD9,#3FC2A3);box-shadow:0 2px 14px rgba(43,139,217,.5)}
.sec.preta .texto p{color:#A9BDCE}
.sec.preta .texto strong{color:#EAF3FB}
.sec.preta a{color:#8CC4F2}

/* ── números grandes: sem caixa, sem borda ── */
.numeros{display:grid;gap:38px 40px;margin-top:6px}
.numeros.c3{grid-template-columns:repeat(3,minmax(0,1fr))}
.numeros.c2{grid-template-columns:repeat(2,minmax(0,1fr))}
.numeros .nm{position:relative;padding-top:20px}
.numeros .nm::before{content:"";position:absolute;top:0;left:0;width:0;height:2px;border-radius:2px;background:var(--grad-metal);
  box-shadow:0 0 16px rgba(43,139,217,.65);transition:width 700ms var(--curva) calc(var(--i,0) * 150ms)}
.numeros .nm.vis::before{width:66px}
.numeros .v{display:flex;align-items:baseline;gap:9px;flex-wrap:wrap;font:700 clamp(38px,4.2vw,56px)/1 var(--sans);letter-spacing:-.03em;
  background:linear-gradient(96deg,#FFFFFF 0%,#BFE0F7 34%,#4FA9E8 68%,#3FC2A3 100%);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}
.numeros .v em{font:600 16px/1.2 var(--sans);font-style:normal;letter-spacing:0;-webkit-text-fill-color:#7FB7DE}
.numeros h3{font:700 17.5px/1.35 var(--sans);color:#EAF3FB;margin:14px 0 8px;letter-spacing:-.01em}
.numeros p{font-size:14.5px;line-height:1.6;color:#9AB0C2;margin:0;max-width:44ch}
.numeros .fonte{margin-top:12px;font-size:12.5px;color:#74899C}
.numeros .fonte a{color:#7FB7DE;text-decoration:underline;text-underline-offset:3px}
@media (max-width:900px){.numeros.c3,.numeros.c2{grid-template-columns:1fr;gap:30px}}

/* ── variante metálica da seção preta ── */
.sec.preta.metal{background:
  radial-gradient(90% 120% at 85% 0%,rgba(43,139,217,.34) 0%,rgba(10,79,138,.12) 38%,transparent 68%),
  linear-gradient(118deg,#04070B 0%,#0A1522 32%,#123152 56%,#0A1522 78%,#04070B 100%)}
.sec.preta.metal::after{-webkit-mask-image:radial-gradient(60% 70% at 78% 0%,#000,transparent);mask-image:radial-gradient(60% 70% at 78% 0%,#000,transparent)}

/* ── botão grande e animado ── */
.bt-grande{margin:30px 0 0}
.btg{position:relative;display:inline-flex;align-items:center;gap:14px;padding:19px 34px;border-radius:var(--r-pill);
  text-decoration:none;font:700 18px/1 var(--sans);letter-spacing:-.01em;color:#fff;overflow:hidden;
  background:var(--grad-metal);background-size:220% 100%;background-position:78% 0;
  box-shadow:0 10px 28px rgba(0,108,192,.42),0 2px 6px rgba(4,10,18,.5),inset 0 1px 0 rgba(255,255,255,.28);
  transition:transform var(--t2) var(--curva),box-shadow var(--t2) var(--curva),background-position 700ms var(--curva)}
.btg::before{content:"";position:absolute;top:-40%;bottom:-40%;left:-70%;width:38%;transform:skewX(-22deg);
  background:linear-gradient(90deg,transparent,rgba(255,255,255,.5),transparent);animation:btg-brilho 3.4s var(--curva) infinite}
@keyframes btg-brilho{0%{left:-70%}42%,100%{left:140%}}
.btg::after{content:"";position:absolute;inset:-3px;border-radius:inherit;pointer-events:none;
  box-shadow:0 0 0 2px rgba(120,200,255,.28);opacity:.7;animation:btg-pulso 2.8s var(--curva) infinite}
@keyframes btg-pulso{0%,100%{transform:scale(1);opacity:.55}50%{transform:scale(1.035);opacity:0}}
.btg .tx,.btg .st{position:relative;z-index:1}
.btg .st{display:grid;place-items:center;transition:transform var(--t2) var(--curva)}
.btg:hover{transform:translateY(-3px);background-position:0 0;box-shadow:0 18px 40px rgba(0,108,192,.55),0 3px 10px rgba(4,10,18,.6)}
.btg:hover .st{transform:translateX(6px)}
.btg:focus-visible{outline:3px solid #8CC4F2;outline-offset:4px}
@media (prefers-reduced-motion:reduce){.btg::before,.btg::after{animation:none;opacity:0}}
@media (max-width:600px){.btg{font-size:16px;padding:17px 24px;gap:10px}}

/* ── cena de agentes: traço técnico, sem ar de desenho infantil ── */
.ck-ic{stroke-width:1.7}
.ag-cerca{fill:rgba(140,196,242,.03);stroke:#5D7285;stroke-width:1.6;stroke-dasharray:22 7;opacity:.9}
.ag-farpa{fill:none;stroke:#5D7285;stroke-width:1.5;stroke-linecap:round;opacity:.85}

/* números sobre o preto: o contêiner .prova não pode trazer a caixa branca */
.numeros.prova{background:none;border:0;box-shadow:none;padding:0;margin-top:6px}
.sec.preta .faq-link a{color:#8CC4F2;font-weight:500;text-decoration:none;border-bottom:1px solid rgba(140,196,242,.35);padding-bottom:2px}
.sec.preta .faq-link a:hover{color:#EAF3FB;border-bottom-color:#8CC4F2}

/* ── seção com imagem de fundo ocupando o bloco inteiro (texto sobre a área clara) ── */
.sec.faixa-img{position:relative;overflow:hidden;background:#F2F7FC;isolation:isolate}
.sec.faixa-img .bg{position:absolute;inset:-2%;background-size:cover;background-position:right center;background-repeat:no-repeat;
  z-index:-2;animation:faixa-deriva 26s var(--curva) infinite alternate;will-change:transform}
@keyframes faixa-deriva{from{transform:scale(1.02) translate3d(0,0,0)}to{transform:scale(1.06) translate3d(-1.2%,-.8%,0)}}
.sec.faixa-img .vel{position:absolute;inset:0;z-index:-1;pointer-events:none;
  background:linear-gradient(96deg,rgba(255,255,255,.97) 0%,rgba(255,255,255,.93) 34%,rgba(255,255,255,.72) 48%,rgba(255,255,255,.12) 60%,rgba(255,255,255,0) 70%)}
.sec.faixa-img .in{position:relative;z-index:1}
.sec.faixa-img .texto,.sec.faixa-img .sec-cab{max-width:56ch}
.sec.faixa-img .texto p{color:var(--t)}
@media (max-width:900px){
  .sec.faixa-img{padding-top:0;background:#fff}
  .sec.faixa-img .bg{position:relative;inset:auto;z-index:0;width:100%;height:210px;margin:0 0 34px;
    background-position:72% center;animation:none;box-shadow:inset 0 -1px 0 rgba(6,42,77,.1)}
  .sec.faixa-img .vel{display:none}
  .sec.faixa-img .texto,.sec.faixa-img .sec-cab{max-width:none}
}
@media (prefers-reduced-motion:reduce){.sec.faixa-img .bg{animation:none}}
.rod .col-t{font:700 14px/1.3 var(--sans);color:#fff;margin:0 0 14px;letter-spacing:.02em}

/* ── busca da página de erro ─────────────────────────────────────── */
.bsc { margin: 0 0 1.25rem; }
.bsc label { display: block; font-size: .82rem; font-weight: 600; letter-spacing: .04em; text-transform: uppercase; color: var(--azul-titulo); margin-bottom: .4rem; }
.bsc input { width: 100%; max-width: 34rem; padding: .7rem .9rem; font: inherit; color: var(--texto); background: var(--fundo); border: 1px solid var(--borda-forte); border-radius: var(--curva); }
.bsc input:focus-visible { outline: 3px solid var(--foco); outline-offset: 2px; border-color: var(--azul); }
.bsc-n { margin: .5rem 0 0; font-size: .88rem; color: var(--texto-2); min-height: 1.2em; }
.bsc-lista { list-style: none; margin: 0; padding: 0; display: grid; gap: .1rem; grid-template-columns: repeat(auto-fill, minmax(17rem, 1fr)); }
.bsc-lista li { margin: 0; }
.bsc-lista a { display: block; padding: .5rem .7rem; border-radius: var(--curva); text-decoration: none; color: var(--azul-link); border: 1px solid transparent; }
.bsc-lista a:hover, .bsc-lista a:focus-visible { background: var(--fundo-2); border-color: var(--borda); text-decoration: underline; }
.bsc-lista li[hidden] { display: none; }

/* ── diagramas que rolam de lado ────────────────────────────────────────────
   Rolagem escondida e rolagem que ninguem usa: sombra na borda enquanto ha
   conteudo a direita, foco por teclado e dica visivel no celular. */
.rolavel{position:relative}
.rolavel::after{content:"";position:absolute;top:0;right:0;bottom:0;width:44px;pointer-events:none;
  background:linear-gradient(90deg,rgba(255,255,255,0),rgba(255,255,255,.92));
  opacity:1;transition:opacity var(--t2) var(--curva)}
.rolavel[data-fim]::after{opacity:0}
.rolavel:focus-visible{outline:3px solid var(--foco);outline-offset:3px}
.dica-rolagem{display:none;font-size:13px;color:var(--t-fraco);margin:8px 0 0;align-items:center;gap:6px}
.dica-rolagem::before{content:"94";font-size:15px;color:var(--azul)}
@media (max-width:980px){ .dica-rolagem{display:flex} }
@media print{ .rolavel::after{display:none} .dica-rolagem{display:none} }

/* O botao "Ampliar" e o visor de tela cheia foram removidos em 05/09/2026.
   Ele abria a si mesmo — o seletor pegava o icone do proprio botao, que vinha
   antes do desenho no HTML. Os diagramas continuam cabendo inteiros na tela
   pela versao de celular (.d-cel), que e outro desenho, nao o mesmo encolhido. */
.dgrm{position:relative}

/* ── as duas versoes do diagrama ───────────────────────────────────────────
   O desenho de celular nao e o de desktop encolhido: e outro desenho, empilhado,
   conforme a coluna "celular" da especificacao. Troca por media query, com
   display:none — que tira o escondido tambem da arvore de acessibilidade, para
   o leitor de tela nao ler a mesma descricao duas vezes. */
.dgrm .d-cel{display:none}
.dgrm .d-desk{display:block}

/* Ate 900px vale o desenho de celular. Medido: o de desktop (viewBox 1180) so
   passa de 12px de texto quando renderiza acima de 1010px, e o container do
   site nunca chega la em tela estreita. */
@media (max-width:900px){
  .dgrm .d-desk{display:none}
  .dgrm .d-cel{display:block}

  /* O diagrama sangra ate as bordas: com 26px de padding de cada lado sobravam
     264px para o desenho, e a escala caia para 0,73 (texto de 10,3px). Assim
     sobram ~350px, escala 0,97, texto de 13,6px. */
  /* 12px de padding deixavam o desenho em 294px (escala 0,817, texto de
     11,4px). Com 4px sobram 310px: escala 0,861, texto de 12,0px. */
  .dgrm{margin-left:-28px;margin-right:-28px;padding:14px 4px;border-radius:0;border-left:0;border-right:0}
  .dgrm .d-cel svg{width:100%;height:auto;display:block;max-width:460px;margin:0 auto}

  /* As cenas proprias (fluxo e ciclo) sofrem do mesmo estrangulamento: com o
     padding do quadro sobravam 298px. Sangram ate as bordas tambem. */
  .fx-palco,.ck-palco{margin-left:-28px;margin-right:-28px;padding:12px 4px;border-radius:0}
  .fx-palco svg,.ck-palco svg{width:100%;height:auto;display:block;max-width:460px;margin:0 auto}
}

/* O ciclo virou <figure> para receber o botao Ampliar; ele nao tinha nenhum
   caminho de leitura em celular, e o texto dele fica em 3,7px cabendo na tela. */
.dgrm-ck{position:relative;margin:0;border:1px solid var(--borda);border-radius:var(--r-lg)}

/* ── artigos ─────────────────────────────────────────────────────── */
.art-meta{border-left:3px solid var(--azul);padding:.1rem 0 .1rem 1rem;margin:0}
.art-meta p{margin:0}
.art-autor{font-weight:600;color:var(--azul-titulo)}
.art-data{font-size:.9rem;color:var(--t-suave);margin-top:.25rem !important}
.art-fontes{margin:0;padding-left:1.3rem;font-size:.94rem}
.art-fontes li{margin:0 0 .6rem;line-height:1.5}
.art-fontes a{color:var(--azul-link)}
.art-aviso{font-size:.92rem;color:var(--t-suave);border-left:3px solid var(--borda-forte);padding-left:1rem;margin:0}
blockquote{margin:1.2rem 0;padding:.2rem 0 .2rem 1.2rem;border-left:3px solid var(--azul)}
blockquote p{margin:0;font-size:1.02rem}
