/* SDE Digital — "SDE na palma da mão". Identidade da Secretaria de Desenvolvimento Econômico de Valença:
   azul, verde, amarelo e laranja, formas arredondadas sobrepostas e o céu de Valença ao entardecer. */
:root {
  --azul: #1E6FD9; --azul-esc: #123E8C; --marinho: #0B2558; --verde: #2BAA4A; --verde-esc: #1E7A3A;
  --amarelo: #F7B500; --laranja: #F2552C; --roxo: #7A3EB1; --ceu: #EEF5FF; --fundo: #F6F9FD;
  --texto: #13213A; --suave: #5A6B85; --borda: #DCE6F2; --branco: #fff;
  --raio: 20px; --raio-p: 14px; --sombra: 0 10px 30px rgba(18, 62, 140, .10); --sombra-g: 0 24px 60px rgba(11, 37, 88, .18);
  --altura-campo: 54px;
}
* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body.sde { margin: 0; font-family: Nunito, system-ui, -apple-system, "Segoe UI", sans-serif; color: var(--texto);
           background: var(--fundo); font-size: 16px; line-height: 1.5; -webkit-font-smoothing: antialiased; }
.sde a:not([class]) { color: var(--azul); }
.sde h1, .sde h2, .sde h3, .sde h4 { font-weight: 900; letter-spacing: -.01em; color: var(--marinho); }
.sr-only { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); }
.wrap { max-width: 1180px; margin: 0 auto; padding: 0 20px; }
.wrap-estreito { max-width: 760px; margin: 0 auto; padding: 0 16px; }

/* ── topo ─────────────────────────────────────────────────────────────── */
.topo { position: sticky; top: 0; z-index: 50; background: rgba(255,255,255,.88); backdrop-filter: saturate(1.4) blur(14px);
        border-bottom: 1px solid rgba(220,230,242,.8); }
.topo-faixa { height: 4px; background: linear-gradient(90deg, var(--azul) 0 25%, var(--verde) 25% 50%, var(--amarelo) 50% 75%, var(--laranja) 75%); }
.topo .wrap { display: flex; align-items: center; gap: 14px; min-height: 68px; }
.marca { display: flex; align-items: center; gap: 12px; text-decoration: none; color: inherit; }
.marca .div { width: 2px; height: 38px; background: #C9D6EA; border-radius: 2px; flex: none; }
/* SDE e Prefeitura com a mesma altura: começam e terminam juntas */
.marca .pref { height: 54px; width: auto; display: block; }
.marca .sde-mini svg { height: 54px; width: auto; display: block; }
.topo-acoes { margin-left: auto; display: flex; align-items: center; gap: 8px; }
.btn-topo { display: inline-flex; align-items: center; gap: 8px; border-radius: 12px; padding: 9px 14px; font-weight: 800;
            font-size: .88rem; text-decoration: none; border: 1.5px solid var(--borda); color: var(--marinho); background: #fff; }
.btn-topo.cheio { background: var(--azul); border-color: var(--azul); color: #fff; }
.avatar { width: 40px; height: 40px; border-radius: 50%; display: grid; place-items: center; font-weight: 900; color: #fff;
          background: linear-gradient(135deg, var(--azul), var(--verde)); text-decoration: none; }
@media (max-width: 760px) {
  .topo-acoes .so-desk { display: none; }
  .topo .wrap { min-height: 62px; gap: 8px; padding: 0 12px; }
  .marca { gap: 8px; }
  .marca .sde-mini svg { height: 42px; }
  .marca .div { height: 30px; }
  .marca .pref { height: 42px; }
  .topo-acoes { gap: 6px; }
  .topo-acoes .amb-botao { padding: 7px; }
  .avatar { width: 38px; height: 38px; }
}
@media (max-width: 370px) { .marca .pref, .marca .sde-mini svg { height: 36px; } }

/* barra inferior (celular): cara de aplicativo */
.app-nav { display: none; }
@media (max-width: 760px) {
  body.sde { padding-bottom: 78px; }
  .app-nav { display: grid; grid-template-columns: repeat(5, 1fr); position: fixed; left: 10px; right: 10px; bottom: 10px; z-index: 60;
             background: rgba(255,255,255,.96); backdrop-filter: blur(12px); border: 1px solid var(--borda); border-radius: 22px;
             box-shadow: var(--sombra-g); padding: 6px; }
  .app-nav a { display: flex; flex-direction: column; align-items: center; gap: 2px; padding: 6px 2px; border-radius: 14px;
               text-decoration: none; color: var(--suave); font-size: .66rem; font-weight: 800; }
  .app-nav a i { font-size: 1.25rem; }
  .app-nav a.ativo { color: var(--azul); background: var(--ceu); }
}

/* ── mensagens ───────────────────────────────────────────────────────── */
.msgs { position: fixed; top: 84px; right: 16px; z-index: 80; display: grid; gap: 10px; max-width: min(420px, calc(100% - 32px)); }
.msg { display: flex; gap: 10px; align-items: flex-start; padding: 14px 16px; border-radius: 16px; background: #fff; box-shadow: var(--sombra-g);
       border-left: 5px solid var(--azul); font-weight: 700; font-size: .92rem; animation: entra-dir .4s ease both; }
.msg.success { border-color: var(--verde); } .msg.error { border-color: var(--laranja); } .msg.warning { border-color: var(--amarelo); }
.msg button { margin-left: auto; border: 0; background: none; font-size: 1.1rem; color: var(--suave); }
@keyframes entra-dir { from { opacity: 0; transform: translateX(30px); } to { opacity: 1; transform: none; } }

/* ── herói ───────────────────────────────────────────────────────────── */
.heroi { position: relative; overflow: hidden; color: #fff; isolation: isolate; }
.heroi::before { content: ""; position: absolute; inset: 0; z-index: -2;
                 background: url("../img/valenca-por-do-sol.jpg") center 60%/cover no-repeat; transform: scale(1.05);
                 animation: respira 22s ease-in-out infinite alternate; }
.heroi::after { content: ""; position: absolute; inset: 0; z-index: -1;
                background: linear-gradient(180deg, rgba(11,37,88,.66) 0%, rgba(18,62,140,.38) 45%, rgba(11,37,88,.9) 100%); }
@keyframes respira { to { transform: scale(1.14) translateY(-12px); } }
.heroi .wrap { padding-top: 54px; padding-bottom: 120px; display: grid; grid-template-columns: 1.1fr .9fr; gap: 40px; align-items: center; }
.sobretitulo { margin: 0 0 14px; text-transform: uppercase; letter-spacing: .2em; font-weight: 900; font-size: .8rem;
               color: var(--amarelo); text-shadow: 0 1px 8px rgba(0,0,0,.35); }
.heroi h1 { color: #fff; font-size: clamp(2rem, 4.8vw, 3.4rem); line-height: 1.05; margin: 0 0 14px; text-shadow: 0 2px 20px rgba(0,0,0,.25); }
/* "na palma da mão" é o desenho à mão oficial (marcas/na-palma-da-mao.svg), não uma fonte: encosta no título, começa
   e termina junto com a linha mais longa dele (--largura-titulo, medida no inicio.html) e aparece sendo escrito da
   esquerda para a direita. Branco na capa; a cor vem do CSS (currentColor). */
.heroi h1 .script { display: block; width: var(--largura-titulo, min(100%, 9.4em)); color: #fff; margin: .04em 0 0 0;
                    position: relative; z-index: 1; filter: drop-shadow(0 3px 10px rgba(0,0,0,.35));
                    clip-path: inset(-10% 100% -10% -2%); animation: escreve 2.4s .5s cubic-bezier(.45,.05,.35,1) forwards; }
.heroi h1 .script svg { display: block; width: 100%; height: auto; }
@keyframes escreve { to { clip-path: inset(-10% -2% -10% -2%); } }
.heroi p.lead { font-size: 1.12rem; color: rgba(255,255,255,.9); max-width: 560px; margin: 0 0 24px; }
.busca { display: flex; background: #fff; border-radius: 18px; padding: 6px; box-shadow: var(--sombra-g); max-width: 560px; }
.busca input { flex: 1; border: 0; outline: 0; font: inherit; font-size: 1.02rem; padding: 0 14px; color: var(--texto); min-width: 0; }
.busca button { border: 0; background: var(--azul); color: #fff; width: 52px; height: 48px; border-radius: 14px; font-size: 1.2rem; }
.pilulas { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 16px; }
.pilula { display: inline-flex; align-items: center; gap: 6px; padding: 7px 12px; border-radius: 99px; background: rgba(255,255,255,.14);
          border: 1px solid rgba(255,255,255,.28); color: #fff; font-weight: 800; font-size: .82rem; text-decoration: none; backdrop-filter: blur(6px); }
.pilula:hover { background: rgba(255,255,255,.26); color: #fff; }
.forma { position: absolute; border-radius: 999px; z-index: -1; opacity: .9; filter: saturate(1.1); }
.forma.f1 { width: 280px; height: 120px; background: var(--verde); left: -110px; top: 30px; transform: rotate(-35deg); }
.forma.f2 { width: 240px; height: 110px; background: var(--amarelo); right: -90px; top: 60px; transform: rotate(-30deg); }
.forma.f3 { width: 340px; height: 140px; background: var(--azul); right: -120px; bottom: -40px; transform: rotate(-20deg); mix-blend-mode: multiply; }
.onda { position: absolute; left: 0; right: 0; bottom: -1px; height: 70px; z-index: 0; }
@media (max-width: 900px) { .heroi .wrap { grid-template-columns: minmax(0, 1fr); padding-top: 34px; padding-bottom: 100px; } }

/* ── seções ──────────────────────────────────────────────────────────── */
.secao { padding: 54px 0; position: relative; }
.secao-cab { display: flex; align-items: end; gap: 16px; margin-bottom: 26px; flex-wrap: wrap; }
.secao-cab h2 { margin: 0; font-size: clamp(1.5rem, 3vw, 2.1rem); }
.secao-cab p { margin: 4px 0 0; color: var(--suave); }
.secao-cab .mais { margin-left: auto; font-weight: 800; text-decoration: none; }
.sobe { position: relative; margin-top: -84px; z-index: 2; }
.revela { opacity: 0; transform: translateY(24px); transition: opacity .6s ease, transform .6s ease; }
.revela.visivel { opacity: 1; transform: none; }

/* cartões de serviço */
.grade-servicos { display: grid; grid-template-columns: repeat(3, 1fr); gap: 18px; }
@media (max-width: 960px) { .grade-servicos { grid-template-columns: repeat(2, 1fr); } }
/* celular: quadrantes 2×3 logo abaixo do subtítulo (ícone + nome; o resumo fica na página do serviço) */
@media (max-width: 560px) {
  .grade-servicos { grid-template-columns: 1fr 1fr; gap: 12px; }
  .grade-servicos .cartao-servico { padding: 16px 14px; gap: 10px; border-radius: 20px; min-height: 128px; }
  .grade-servicos .cartao-servico p.longo, .grade-servicos .cartao-servico .ir { display: none; }
  .grade-servicos .cartao-servico p.curto { display: block; font-size: .8rem; line-height: 1.3; margin-top: -4px; }
  .grade-servicos .cartao-servico h3 { font-size: .98rem; line-height: 1.22; margin: 0; }
  .grade-servicos .cartao-servico .icone { width: 46px; height: 46px; font-size: 1.35rem; border-radius: 14px; }
  .grade-servicos .cartao-servico::after { width: 90px; height: 90px; right: -30px; top: -30px; }
  .heroi .wrap { padding-bottom: 64px; }
  .sobe { margin-top: -44px; }
}
.cartao-servico { position: relative; display: flex; flex-direction: column; gap: 10px; padding: 22px; border-radius: 24px; background: #fff;
                  box-shadow: var(--sombra); text-decoration: none; color: inherit; overflow: hidden; transition: transform .25s, box-shadow .25s;
                  border: 1px solid rgba(220,230,242,.7); }
.cartao-servico::after { content: ""; position: absolute; right: -40px; top: -40px; width: 130px; height: 130px; border-radius: 50%;
                         background: var(--cor); opacity: .12; transition: transform .4s; }
.cartao-servico:hover { transform: translateY(-6px); box-shadow: var(--sombra-g); color: inherit; }
.cartao-servico:hover::after { transform: scale(1.5); }
.cartao-servico .icone { width: 56px; height: 56px; border-radius: 18px; display: grid; place-items: center; font-size: 1.6rem;
                         color: #fff; background: var(--cor); box-shadow: 0 8px 18px color-mix(in srgb, var(--cor) 40%, transparent); }
.cartao-servico h3 { margin: 4px 0 0; font-size: 1.18rem; }
.cartao-servico p { margin: 0; color: var(--suave); font-size: .94rem; }
.cartao-servico p.curto { display: none; }
.cartao-servico .ir { margin-top: auto; font-weight: 900; color: var(--cor); display: inline-flex; align-items: center; gap: 6px; }

/* Evento Legal em destaque */
.faixa-evento { position: relative; border-radius: 34px; overflow: hidden; background: linear-gradient(135deg, #fff 0%, var(--ceu) 100%);
                box-shadow: var(--sombra); padding: 34px; display: grid; grid-template-columns: minmax(0, .9fr) minmax(0, 1.1fr); gap: 30px; align-items: center; }
.faixa-evento > * { min-width: 0; }
.faixa-evento .marca-ev svg { width: 100%; max-width: 420px; height: auto; }
@media (max-width: 900px) { .faixa-evento { grid-template-columns: minmax(0, 1fr); padding: 22px; } }
.dias-faixa { display: flex; gap: 8px; overflow-x: auto; padding: 4px 2px 10px; scroll-snap-type: x mandatory; }
.dia { flex: 0 0 62px; scroll-snap-align: start; border-radius: 18px; background: #fff; border: 1px solid var(--borda); text-align: center;
       padding: 8px 4px; position: relative; }
.dia b { display: block; font-size: 1.35rem; color: var(--marinho); line-height: 1.1; }
.dia small { color: var(--suave); font-weight: 800; text-transform: uppercase; font-size: .66rem; }
.dia.tem::after { content: ""; position: absolute; left: 50%; bottom: 6px; width: 8px; height: 8px; margin-left: -4px; border-radius: 50%; background: var(--laranja); }
.dia.hoje { background: var(--azul); border-color: var(--azul); } .dia.hoje b, .dia.hoje small { color: #fff; }
.cartoes-evento { display: grid; grid-template-columns: repeat(auto-fill, minmax(230px, 1fr)); gap: 16px; }
.evento-card { display: flex; flex-direction: column; border-radius: 22px; overflow: hidden; background: #fff; box-shadow: var(--sombra);
               text-decoration: none; color: inherit; transition: transform .25s; }
.evento-card:hover { transform: translateY(-5px); color: inherit; }
.evento-card .capa { aspect-ratio: 4/3; background: linear-gradient(135deg, var(--azul), var(--verde)); display: grid; place-items: center;
                     color: #fff; font-size: 2.6rem; position: relative; }
.evento-card .capa img { width: 100%; height: 100%; object-fit: cover; }
.evento-card .data-chip { position: absolute; left: 12px; top: 12px; background: #fff; color: var(--marinho); border-radius: 14px; padding: 4px 10px;
                          text-align: center; font-weight: 900; line-height: 1.1; box-shadow: var(--sombra); }
.evento-card .data-chip small { display: block; font-size: .64rem; color: var(--laranja); text-transform: uppercase; }
.evento-card .corpo { padding: 14px 16px 16px; }
.evento-card h4 { margin: 0 0 4px; font-size: 1.02rem; }
.evento-card p { margin: 0; color: var(--suave); font-size: .85rem; }
.selo-mini { display: inline-flex; align-items: center; gap: 5px; font-size: .7rem; font-weight: 900; color: var(--verde-esc);
             background: #E7F7EC; border-radius: 99px; padding: 3px 9px; margin-top: 8px; }

/* como funciona */
.passos-como { display: grid; grid-template-columns: repeat(4, 1fr); gap: 16px; counter-reset: p; }
@media (max-width: 860px) { .passos-como { grid-template-columns: repeat(2, 1fr); } }
.passo-como { background: #fff; border-radius: 22px; padding: 20px; box-shadow: var(--sombra); position: relative; }
.passo-como::before { counter-increment: p; content: counter(p); position: absolute; right: 16px; top: 8px; font-weight: 900; font-size: 2.6rem;
                      color: var(--ceu); }
.passo-como i { font-size: 1.6rem; color: var(--azul); }
.passo-como h4 { margin: 10px 0 4px; font-size: 1.02rem; }
.passo-como p { margin: 0; color: var(--suave); font-size: .9rem; }

.aviso-implantacao { display: flex; gap: 12px; align-items: center; background: #FFF8E1; border: 1px solid #FBE2A0; border-radius: 18px;
                     padding: 14px 18px; color: #6B4B00; font-weight: 700; font-size: .92rem; }
.aviso-implantacao i { font-size: 1.4rem; color: #C98A00; }

/* ── rodapé ──────────────────────────────────────────────────────────── */
.rodape { background: var(--marinho); color: rgba(255,255,255,.82); padding: 44px 0 26px; margin-top: 40px; position: relative; overflow: hidden; }
.rodape::before { content: ""; position: absolute; left: 0; right: 0; top: 0; height: 6px;
                  background: linear-gradient(90deg, var(--azul) 0 25%, var(--verde) 25% 50%, var(--amarelo) 50% 75%, var(--laranja) 75%); }
.rodape .grade { display: grid; grid-template-columns: 1.2fr 1fr 1fr; gap: 26px; }
@media (max-width: 760px) { .rodape .grade { grid-template-columns: 1fr; } }
.rodape h5 { color: #fff; font-weight: 900; margin: 0 0 10px; }
.sde .rodape a { color: #fff; }
/* rodapé: marca da SDE em branco, sem caixa, alinhada à esquerda */
.rodape .logo-branco { display: block; padding: 0; background: none; }
.rodape .logo-branco svg { height: 78px; width: auto; display: block; margin: 0; filter: brightness(0) invert(1); }
.rodape .credito { border-top: 1px solid rgba(255,255,255,.12); margin-top: 26px; padding-top: 16px; font-size: .82rem; display: flex; flex-wrap: wrap; gap: 8px; justify-content: space-between; }

/* ── botões e campos ─────────────────────────────────────────────────── */
.btn { display: inline-flex; align-items: center; justify-content: center; gap: 8px; min-height: 50px; padding: 0 22px; border-radius: 16px;
       font: inherit; font-weight: 900; border: 0; cursor: pointer; text-decoration: none; transition: transform .15s, box-shadow .15s, background .15s; }
.btn:hover { transform: translateY(-2px); }
.btn:disabled { opacity: .6; transform: none; cursor: wait; }
.btn-azul { background: var(--azul); color: #fff; box-shadow: 0 10px 24px rgba(30,111,217,.32); } .btn-azul:hover { color: #fff; background: #175fc0; }
.btn-verde { background: var(--verde); color: #fff; box-shadow: 0 10px 24px rgba(43,170,74,.3); } .btn-verde:hover { color: #fff; background: #23943F; }
.btn-amarelo { background: var(--amarelo); color: var(--marinho); } .btn-amarelo:hover { color: var(--marinho); background: var(--amarelo); }
.btn-laranja { background: var(--laranja); color: #fff; } .btn-laranja:hover { color: #fff; background: var(--laranja); }
.btn-leve { background: #fff; color: var(--marinho); border: 1.5px solid var(--borda); } .btn-leve:hover { color: var(--marinho); background: #fff; border-color: var(--azul); }
.btn-branco { background: #fff; color: var(--marinho); } .btn-branco:hover { color: var(--marinho); background: #fff; }
.btn-bloco { width: 100%; }
.btn-p { min-height: 40px; padding: 0 14px; border-radius: 12px; font-size: .88rem; }

.campo { margin-bottom: 16px; }
.campo > label, .rotulo { display: block; font-weight: 800; font-size: .9rem; color: var(--marinho); margin-bottom: 7px; }
.campo .opc { font-weight: 600; color: var(--suave); }
.entrada, .sde select.entrada, .sde textarea.entrada { width: 100%; height: var(--altura-campo); border-radius: var(--raio-p); border: 1.5px solid var(--borda);
            background: #fff; padding: 0 16px; font: inherit; font-size: 1rem; color: var(--texto); transition: border-color .15s, box-shadow .15s; }
textarea.entrada { height: auto; min-height: 110px; padding: 14px 16px; resize: vertical; }
.entrada:focus { outline: 0; border-color: var(--azul); box-shadow: 0 0 0 4px rgba(30,111,217,.14); }
.entrada.erro { border-color: var(--laranja); }
.ajuda { font-size: .8rem; color: var(--suave); margin-top: 5px; }
.msg-erro { font-size: .82rem; color: #C2391A; font-weight: 800; margin-top: 5px; }

/* ── assistente (wizard) ─────────────────────────────────────────────── */
.wizard-topo { background: linear-gradient(135deg, var(--marinho), var(--azul-esc) 60%, var(--azul)); color: #fff; position: relative; overflow: hidden; }
.wizard-topo .wrap-estreito { padding-top: 26px; padding-bottom: 70px; }
.wizard-topo h1 { color: #fff; font-size: 1.6rem; margin: 6px 0 2px; }
.wizard-topo p { margin: 0; color: rgba(255,255,255,.8); }
.wizard-topo .voltar { color: rgba(255,255,255,.85); text-decoration: none; font-weight: 800; font-size: .9rem; }
.wizard-topo .forma.f1 { top: auto; bottom: -50px; left: auto; right: -60px; width: 220px; height: 90px; }
.wizard-topo .forma.f2 { top: -30px; right: 140px; width: 140px; height: 60px; }
.progresso { display: flex; gap: 6px; margin-top: 18px; }
.progresso span { flex: 1; height: 6px; border-radius: 99px; background: rgba(255,255,255,.22); overflow: hidden; position: relative; }
.progresso span::after { content: ""; position: absolute; inset: 0; background: var(--amarelo); transform: scaleX(0); transform-origin: left; transition: transform .4s ease; }
.progresso span.feito::after, .progresso span.atual::after { transform: scaleX(1); }
.progresso span.atual::after { background: #fff; }
.wizard { margin-top: -50px; position: relative; z-index: 2; }
.etapa-card { background: #fff; border-radius: 26px; box-shadow: var(--sombra-g); padding: 26px; }
@media (max-width: 560px) { .etapa-card { padding: 20px 16px; border-radius: 22px; } }
.etapa { display: none; }
.etapa.ativa { display: block; animation: etapa-entra .35s ease both; }
.etapa.ativa.volta { animation-name: etapa-volta; }
@keyframes etapa-entra { from { opacity: 0; transform: translateX(28px); } to { opacity: 1; transform: none; } }
@keyframes etapa-volta { from { opacity: 0; transform: translateX(-28px); } to { opacity: 1; transform: none; } }
.etapa-cab { display: flex; gap: 14px; align-items: center; margin-bottom: 18px; }
.etapa-cab .ic { width: 52px; height: 52px; border-radius: 16px; display: grid; place-items: center; font-size: 1.5rem; color: #fff;
                 background: var(--cor, var(--azul)); flex: none; }
.etapa-cab h2 { margin: 0; font-size: 1.3rem; }
.etapa-cab p { margin: 2px 0 0; color: var(--suave); font-size: .92rem; }
.etapa-num { font-size: .75rem; font-weight: 900; color: var(--suave); text-transform: uppercase; letter-spacing: .06em; }
.grade-campos { display: grid; grid-template-columns: repeat(12, 1fr); gap: 0 14px; }
.grade-campos > .campo { grid-column: span 12; }
.grade-campos > .campo.c6 { grid-column: span 6; }
@media (max-width: 560px) { .grade-campos > .campo.c6 { grid-column: span 12; } }
.opcoes { display: grid; grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); gap: 10px; }
.opcao { position: relative; }
.opcao input { position: absolute; opacity: 0; inset: 0; pointer-events: none; }
.opcao label { display: flex; flex-direction: column; align-items: flex-start; gap: 8px; min-height: 86px; padding: 14px; border-radius: 18px;
               border: 2px solid var(--borda); background: #fff; cursor: pointer; font-weight: 800; font-size: .92rem; color: var(--marinho);
               transition: border-color .15s, background .15s, transform .15s; }
.opcao label i { font-size: 1.5rem; color: var(--azul); }
.opcao input:checked + label { border-color: var(--azul); background: var(--ceu); transform: translateY(-2px); box-shadow: 0 8px 20px rgba(30,111,217,.15); }
.opcao input:checked + label::after { content: "✓"; position: absolute; right: 12px; top: 10px; width: 24px; height: 24px; border-radius: 50%;
                                      background: var(--azul); color: #fff; font-size: .8rem; display: grid; place-items: center; }
.opcao input:focus-visible + label { outline: 3px solid rgba(30,111,217,.4); outline-offset: 2px; }
.opcoes.simnao { grid-template-columns: 1fr 1fr; }
.opcoes.simnao label { min-height: 54px; flex-direction: row; align-items: center; justify-content: center; }
.envio { position: relative; border: 2px dashed var(--borda); border-radius: 18px; padding: 16px; display: flex; gap: 14px; align-items: center;
         background: #FBFDFF; transition: border-color .15s, background .15s; }
.envio:hover, .envio.arrastando { border-color: var(--azul); background: var(--ceu); }
.envio input { position: absolute; inset: 0; opacity: 0; cursor: pointer; }
.envio .ic { width: 48px; height: 48px; border-radius: 14px; background: var(--ceu); color: var(--azul); display: grid; place-items: center; font-size: 1.4rem; flex: none; }
.envio.ok { border-style: solid; border-color: var(--verde); background: #F1FBF4; } .envio.ok .ic { background: var(--verde); color: #fff; }
.envio .nome { font-weight: 800; color: var(--marinho); } .envio .info { font-size: .8rem; color: var(--suave); }
.envio img.previa { width: 54px; height: 54px; border-radius: 12px; object-fit: cover; }
.aceite { display: flex; gap: 12px; align-items: flex-start; padding: 14px 16px; border-radius: 16px; border: 1.5px solid var(--borda); background: #FBFDFF; cursor: pointer; }
.aceite input { width: 22px; height: 22px; margin-top: 2px; accent-color: var(--azul); flex: none; }
.aceite span { font-size: .9rem; font-weight: 700; color: var(--texto); }
.mapa-campo { height: 260px; border-radius: 18px; overflow: hidden; border: 1.5px solid var(--borda); margin-top: 10px; }
.mapa-status { font-size: .82rem; color: var(--suave); margin-top: 6px; font-weight: 700; }
.acoes-wizard { display: flex; gap: 10px; margin-top: 22px; }
.acoes-wizard .btn { flex: 1; }
@media (max-width: 560px) {
  .acoes-wizard { position: sticky; bottom: 86px; background: linear-gradient(180deg, rgba(255,255,255,0), #fff 30%); padding-top: 18px; margin-bottom: -8px; }
}
.taxa-viva { display: flex; align-items: center; gap: 12px; padding: 14px 16px; border-radius: 18px; background: linear-gradient(135deg, #FFF8E1, #FFFDF4);
             border: 1px solid #FBE2A0; margin-top: 14px; }
.taxa-viva i { font-size: 1.5rem; color: #C98A00; }
.taxa-viva strong { font-size: 1.35rem; color: var(--marinho); display: block; line-height: 1.1; }
.taxa-viva small { color: #6B4B00; font-weight: 700; }
.equip { display: grid; gap: 8px; }
.equip-linha { display: flex; align-items: center; gap: 12px; padding: 10px 12px; border-radius: 16px; border: 1.5px solid var(--borda); background: #fff; }
.equip-linha .d { flex: 1; min-width: 0; } .equip-linha .d b { display: block; font-size: .92rem; color: var(--marinho); }
.equip-linha .d small { color: var(--suave); }
.qtd { display: flex; align-items: center; gap: 6px; }
.qtd button { width: 38px; height: 38px; border-radius: 12px; border: 1.5px solid var(--borda); background: #fff; font-size: 1.2rem; font-weight: 900; color: var(--azul); }
.qtd input { width: 46px; height: 38px; border-radius: 10px; border: 1.5px solid var(--borda); text-align: center; font: inherit; font-weight: 900; }
.revisao { display: grid; gap: 8px; margin-bottom: 18px; }
.revisao div { padding: 10px 14px; border-radius: 14px; background: var(--fundo); }
.revisao dt { font-size: .72rem; font-weight: 900; color: var(--suave); text-transform: uppercase; letter-spacing: .04em; }
.revisao dd { margin: 0; font-weight: 800; color: var(--marinho); white-space: pre-line; }

/* ── acompanhamento ──────────────────────────────────────────────────── */
.linha-passos { display: flex; align-items: flex-start; margin: 6px 0 4px; }
.linha-passos .p { flex: 1; text-align: center; position: relative; font-size: .72rem; font-weight: 800; color: rgba(255,255,255,.7); }
.linha-passos .p .b { width: 42px; height: 42px; border-radius: 50%; margin: 0 auto 6px; display: grid; place-items: center; font-size: 1.1rem;
                      background: rgba(255,255,255,.16); color: #fff; position: relative; z-index: 1; transition: transform .3s; }
.linha-passos .p:not(:last-child)::after { content: ""; position: absolute; top: 20px; left: 50%; width: 100%; height: 3px; background: rgba(255,255,255,.18); }
.linha-passos .p.feito .b { background: var(--verde); } .linha-passos .p.feito::after { background: var(--verde) !important; }
.linha-passos .p.atual .b { background: var(--amarelo); color: var(--marinho); transform: scale(1.12); box-shadow: 0 0 0 6px rgba(247,181,0,.25); animation: pulsa 2s infinite; }
.linha-passos .p.atual, .linha-passos .p.feito { color: #fff; }
@keyframes pulsa { 50% { box-shadow: 0 0 0 12px rgba(247,181,0,0); } }
.cartao { background: #fff; border-radius: 24px; box-shadow: var(--sombra); padding: 22px; margin-bottom: 16px; }
.cartao h3 { font-size: 1.1rem; margin: 0 0 12px; display: flex; align-items: center; gap: 8px; }
.cartao h3 i { color: var(--azul); }
.situacao { display: inline-flex; align-items: center; gap: 6px; padding: 5px 12px; border-radius: 99px; font-weight: 900; font-size: .78rem;
            background: var(--ceu); color: var(--azul-esc); white-space: nowrap; }
.situacao.enviada { background: #EAF2FF; color: #1E4FA8; } .situacao.analise, .situacao.pareceres { background: #FFF4D6; color: #8A5A00; }
.situacao.correcao { background: #FFE9E1; color: #A3361A; } .situacao.taxa, .situacao.pagamento { background: #F3E8FF; color: #6A2BA0; }
.situacao.paga { background: #E1F6F9; color: #0B6A77; } .situacao.emitida { background: #E5F7EA; color: #1E7A3A; }
.situacao.indeferida, .situacao.cancelada { background: #F1F3F6; color: #5A6B85; }
.pix { display: grid; grid-template-columns: 200px 1fr; gap: 20px; align-items: center; }
@media (max-width: 560px) { .pix { grid-template-columns: 1fr; text-align: center; } .pix img { margin: 0 auto; } }
.pix img { width: 200px; height: 200px; border-radius: 18px; border: 1px solid var(--borda); padding: 8px; background: #fff; }
.pix .valor { font-size: 2rem; font-weight: 900; color: var(--marinho); line-height: 1; }
.copia { display: flex; gap: 8px; margin-top: 10px; }
.copia input { flex: 1; min-width: 0; height: 46px; border-radius: 12px; border: 1.5px solid var(--borda); padding: 0 12px; font-family: ui-monospace, monospace; font-size: .78rem; color: var(--suave); }
.historico { list-style: none; padding: 0; margin: 0; }
.historico li { position: relative; padding: 0 0 16px 26px; }
.historico li::before { content: ""; position: absolute; left: 6px; top: 6px; width: 12px; height: 12px; border-radius: 50%; background: var(--azul); box-shadow: 0 0 0 4px var(--ceu); }
.historico li::after { content: ""; position: absolute; left: 11px; top: 20px; bottom: 0; width: 2px; background: var(--borda); }
.historico li:last-child::after { display: none; }
.historico small { color: var(--suave); font-weight: 700; }
.doc-baixar { display: flex; align-items: center; gap: 14px; padding: 14px; border-radius: 18px; border: 1.5px solid var(--borda); text-decoration: none; color: inherit; margin-bottom: 10px; transition: border-color .15s, transform .15s; }
.doc-baixar:hover { border-color: var(--azul); transform: translateY(-2px); color: inherit; }
.doc-baixar .ic { width: 50px; height: 50px; border-radius: 14px; display: grid; place-items: center; font-size: 1.5rem; color: #fff; flex: none; }
.doc-baixar b { display: block; color: var(--marinho); } .doc-baixar small { color: var(--suave); }
.celebra { text-align: center; padding: 26px 16px; }
.celebra .selo-svg { max-width: 280px; margin: 0 auto 10px; }
.confete { position: fixed; top: -12px; width: 10px; height: 16px; z-index: 90; border-radius: 3px; animation: cai 3s linear forwards; }
@keyframes cai { to { transform: translateY(105vh) rotate(720deg); opacity: .6; } }

/* listas e tabelas da gestão */
.kpis { display: grid; grid-template-columns: repeat(auto-fit, minmax(160px, 1fr)); gap: 12px; }
.kpi { background: #fff; border-radius: 20px; padding: 16px 18px; box-shadow: var(--sombra); position: relative; overflow: hidden; text-decoration: none; color: inherit; }
.kpi::before { content: ""; position: absolute; left: 0; top: 0; bottom: 0; width: 5px; background: var(--cor, var(--azul)); }
.kpi strong { display: block; font-size: 1.9rem; font-weight: 900; color: var(--marinho); line-height: 1.05; }
.kpi span { font-weight: 800; font-size: .86rem; } .kpi small { display: block; color: var(--suave); font-size: .74rem; }
.kpi i { position: absolute; right: 14px; top: 12px; font-size: 1.3rem; color: var(--cor, var(--azul)); opacity: .9; }
.tabela { width: 100%; border-collapse: collapse; font-size: .9rem; }
.tabela th { text-align: left; font-size: .72rem; text-transform: uppercase; letter-spacing: .05em; color: var(--suave); padding: 10px; border-bottom: 1px solid var(--borda); }
.tabela td { padding: 12px 10px; border-bottom: 1px solid #EEF3F9; vertical-align: middle; }
.tabela tr:hover td { background: #FAFCFF; }
.chip-serv { display: inline-flex; align-items: center; gap: 6px; font-weight: 800; font-size: .82rem; color: var(--cor); }
.filtros { display: flex; gap: 6px; flex-wrap: wrap; }
.filtros a { padding: 8px 14px; border-radius: 99px; border: 1.5px solid var(--borda); background: #fff; text-decoration: none; font-weight: 800; font-size: .84rem; color: var(--marinho); }
.filtros a.ativo { background: var(--marinho); border-color: var(--marinho); color: #fff; }
@media (max-width: 760px) {
  .tabela thead { display: none; } .tabela tr { display: block; padding: 10px 4px; border-bottom: 1px solid var(--borda); }
  .tabela td { display: block; border: 0; padding: 3px 6px; }
}
.calendario { width: 100%; border-collapse: separate; border-spacing: 6px; table-layout: fixed; }
.calendario th { font-size: .72rem; color: var(--suave); text-transform: uppercase; font-weight: 900; }
.calendario td { background: #fff; border-radius: 14px; height: 92px; vertical-align: top; padding: 6px; border: 1px solid #EEF3F9; position: relative; }
.calendario td.fora { opacity: .4; } .calendario td.hoje { border: 2px solid var(--azul); }
.calendario td .n { font-weight: 900; color: var(--marinho); font-size: .9rem; }
.calendario td a.ev { display: block; margin-top: 3px; padding: 2px 6px; border-radius: 8px; font-size: .7rem; font-weight: 800; background: var(--ceu); color: var(--azul-esc);
                      text-decoration: none; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
@media (max-width: 760px) { .calendario td { height: 58px; } .calendario td a.ev { font-size: 0; height: 6px; padding: 0; background: var(--laranja); } }
.leaflet-container { font-family: inherit; }
@media (prefers-reduced-motion: reduce) { *, *::before, *::after { animation: none !important; transition: none !important; } .revela { opacity: 1; transform: none; }
  .heroi h1 .script { clip-path: none; } }
@media print { .topo, .app-nav, .rodape, .msgs, .nao-imprimir { display: none !important; } body.sde { background: #fff; padding: 0; } }

/* ── gestão (equipe da SDE) ──────────────────────────────────────────── */
.gestao-topo { background: linear-gradient(135deg, var(--marinho), var(--azul-esc)); color: #fff; padding: 22px 0 64px; position: relative; overflow: hidden; }
.gestao-topo::after { content: ""; position: absolute; right: -80px; top: -60px; width: 300px; height: 120px; border-radius: 99px; background: var(--verde); opacity: .5; transform: rotate(-30deg); }
.gestao-topo h1 { color: #fff; margin: 2px 0 0; font-size: 1.6rem; }
.gestao-abas { display: flex; flex-wrap: wrap; gap: 6px; position: relative; z-index: 1; }
.sde .gestao-abas a { color: rgba(255,255,255,.85); text-decoration: none; font-weight: 800; font-size: .86rem; padding: 8px 12px; border-radius: 12px; background: rgba(255,255,255,.08); }
.sde .gestao-abas a:hover { background: rgba(255,255,255,.16); color: #fff; }
.sde .gestao-abas a.ativo { background: #fff; color: var(--marinho); }
.gestao-corpo { margin-top: -44px; position: relative; z-index: 2; }
.bloco { background: #fff; border-radius: 22px; box-shadow: var(--sombra); padding: 18px; margin-bottom: 16px; }
.bloco h3 { font-size: 1.02rem; margin: 0 0 12px; display: flex; align-items: center; gap: 8px; }
.bloco h3 i { color: var(--azul); }
.grade-gestao { display: grid; grid-template-columns: minmax(0, 1fr) 360px; gap: 16px; align-items: start; }
@media (max-width: 1060px) { .grade-gestao { grid-template-columns: 1fr; } }
.acao-chave { border: 2px solid var(--azul); }
.acao-chave.verde { border-color: var(--verde); }
.orgaos-lista { display: grid; gap: 6px; }
.orgaos-lista label { display: flex; gap: 10px; align-items: center; padding: 9px 12px; border-radius: 12px; border: 1.5px solid var(--borda); font-weight: 700; font-size: .9rem; cursor: pointer; }
.orgaos-lista label.sugerido { border-color: #FBE2A0; background: #FFFBEF; }
.orgaos-lista input { width: 18px; height: 18px; accent-color: var(--azul); }
.anexos-grade { display: grid; grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); gap: 10px; }
.anexo { border: 1.5px solid var(--borda); border-radius: 14px; overflow: hidden; text-decoration: none; color: inherit; display: block; }
.anexo .th { height: 96px; background: var(--ceu); display: grid; place-items: center; font-size: 2rem; color: var(--azul); }
.anexo .th img { width: 100%; height: 100%; object-fit: cover; }
.anexo span { display: block; padding: 6px 9px; font-size: .76rem; font-weight: 800; color: var(--marinho); }
.mini-mapa { height: 320px; border-radius: 18px; overflow: hidden; }
@media (max-width: 560px) {
  .cartoes-evento { grid-template-columns: none; grid-auto-flow: column; grid-auto-columns: 78%; overflow-x: auto;
                    scroll-snap-type: x mandatory; padding-bottom: 8px; }
  .cartoes-evento > * { scroll-snap-align: start; }
}

/* login e cadastro do SIGAL abertos a partir do SDE (sigal-conta.css) com as cores da SDE */
body.sde { --sigal-primary: var(--azul-esc); --sigal-primary2: var(--azul); --sigal-accent: var(--amarelo); --sc-foco: rgba(30,111,217,.16); --sc-borda: var(--borda); }
body.sde .sc-topo h1 { color: #fff; }
body.sde .sc-wrap { padding-top: 26px; padding-bottom: 30px; }
/* entrada do SDE: "você já tem conta?" */
.porta { display: grid; gap: 12px; }
.porta a { display: flex; align-items: center; gap: 16px; padding: 18px; border-radius: 22px; border: 2px solid var(--borda); background: #fff;
           text-decoration: none; color: var(--marinho); transition: border-color .15s, transform .15s, box-shadow .15s; }
.porta a:hover, .porta a:focus-visible { border-color: var(--azul); transform: translateY(-2px); box-shadow: var(--sombra); color: var(--marinho); }
.porta .ic { width: 56px; height: 56px; border-radius: 18px; display: grid; place-items: center; font-size: 1.6rem; color: #fff; flex: none; }
.porta b { display: block; font-size: 1.12rem; } .porta small { color: var(--suave); font-weight: 700; }
.porta .seta { margin-left: auto; color: var(--suave); font-size: 1.2rem; }
.ou { display: flex; align-items: center; gap: 12px; color: var(--suave); font-weight: 800; font-size: .82rem; margin: 18px 0 12px; }
.ou::before, .ou::after { content: ""; flex: 1; height: 1px; background: var(--borda); }

/* sem rolagem lateral no celular (as formas decorativas passam da borda); clip não quebra o topo fixo */
html, body.sde { overflow-x: clip; max-width: 100%; }
/* faixa de dias da tela inicial: tocar mostra os eventos do dia ali mesmo */
button.dia { font: inherit; cursor: pointer; }
.dia.sel { border-color: var(--laranja); box-shadow: 0 0 0 3px rgba(242,85,44,.25); }
.linha-evento { display: flex; gap: 14px; align-items: center; padding: 14px; background: #fff; border-radius: 20px; box-shadow: var(--sombra);
                text-decoration: none; color: inherit; margin-bottom: 10px; }
.linha-evento img { width: 64px; height: 64px; border-radius: 14px; object-fit: cover; flex: none; }

/* CrediBahia: topo claro com a marca do programa (nítida e, ao fundo, em marca d'água) */
.wizard-topo.topo-credi { background: linear-gradient(160deg, #FFFFFF 0%, #EEF3FC 100%); color: var(--marinho); }
.topo-credi::after { content: ""; position: absolute; right: -6%; bottom: 8px; width: 78%; height: 120px; pointer-events: none;
                     background: url("../img/credibahia.png") no-repeat right bottom / contain; opacity: .09; }
.topo-credi .wrap-estreito { position: relative; z-index: 1; }
.topo-credi .credi-logo { display: block; height: 44px; width: auto; margin: 16px 0 6px; }
.topo-credi h1, .topo-credi .voltar, .topo-credi .etapa-num { color: var(--marinho) !important; }
.topo-credi p { color: var(--suave); }
.topo-credi .progresso span { background: #D7E0F0; }
.topo-credi .progresso span.atual::after { background: #1E4FA8; }

/* convite de instalação (PWA): cartão branco minimalista logo acima do menu do aplicativo */
.pwa { position: fixed; left: 10px; right: 10px; bottom: 90px; z-index: 61; display: flex; align-items: center; gap: 12px;
       padding: 10px 10px 10px 12px; background: #fff; border: 1px solid var(--borda); border-radius: 18px; box-shadow: var(--sombra-g); }
.pwa[hidden] { display: none; }
.pwa.aberto { animation: pwa-sobe .35s ease both; }
@keyframes pwa-sobe { from { opacity: 0; transform: translateY(14px); } to { opacity: 1; transform: none; } }
.pwa img { width: 44px; height: 44px; border-radius: 12px; flex: none; border: 1px solid var(--borda); }
.pwa-txt { flex: 1; min-width: 0; line-height: 1.2; }
.pwa-txt b { display: block; color: var(--marinho); font-size: .92rem; }
.pwa-txt small { color: var(--suave); font-weight: 700; font-size: .74rem; }
.pwa .btn { min-height: 38px; flex: none; }
.pwa-x { border: 0; background: none; color: var(--suave); font-size: 1.4rem; line-height: 1; padding: 0 4px; flex: none; }
@media (min-width: 761px) { .pwa { display: none !important; } }

/* celular: bloco Evento Legal sem rolagem interna (x ou y), medido para caber exatamente na largura */
@media (max-width: 560px) {
  .faixa-evento { padding: 18px 16px; gap: 18px; }
  .dias-faixa { display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); gap: 6px; overflow: visible; padding: 0 0 4px;
                scroll-snap-type: none; }
  .dia { flex: none; min-width: 0; padding: 7px 0 9px; border-radius: 12px; }
  .dia b { font-size: 1.05rem; } .dia small { font-size: .56rem; letter-spacing: 0; }
  .dia.tem::after { bottom: 3px; width: 6px; height: 6px; margin-left: -3px; }
  .cartoes-evento { display: grid; grid-auto-flow: row; grid-auto-columns: auto; grid-template-columns: minmax(0, 1fr);
                    overflow: visible; gap: 10px; padding: 0; scroll-snap-type: none; }
  .evento-card { flex-direction: row; align-items: stretch; border-radius: 18px; }
  .evento-card .capa { width: 96px; flex: none; aspect-ratio: auto; min-height: 104px; font-size: 1.7rem; }
  .evento-card .data-chip { left: 8px; top: 8px; padding: 3px 8px; font-size: .95rem; border-radius: 10px; }
  .evento-card .corpo { padding: 10px 12px; min-width: 0; flex: 1; }
  .evento-card h4 { font-size: .96rem; line-height: 1.25; }
  .evento-card p { font-size: .78rem; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
  .selo-mini { margin-top: 4px; }
}
.dias-faixa { scrollbar-width: none; } .dias-faixa::-webkit-scrollbar { display: none; }

/* capa automática (evento sem cartaz): cor e ícone da categoria, com as formas da identidade da SDE */
.evento-card .capa.auto { overflow: hidden; }
.evento-card .capa.auto::before, .evento-card .capa.auto::after { content: ""; position: absolute; border-radius: 999px; opacity: .35; }
.evento-card .capa.auto::before { width: 70%; height: 34%; right: -18%; top: 8%; background: #fff; transform: rotate(-30deg); }
.evento-card .capa.auto::after { width: 60%; height: 30%; left: -16%; bottom: 6%; background: var(--amarelo); transform: rotate(-25deg); opacity: .55; }
.evento-card .capa.auto i { position: relative; z-index: 1; font-size: 2.6rem; text-shadow: 0 4px 14px rgba(0,0,0,.25); }
.capa.cat-show { background: linear-gradient(135deg, #7A3EB1, #1E6FD9); }
.capa.cat-cultural { background: linear-gradient(135deg, #F2552C, #F7B500); }
.capa.cat-feira { background: linear-gradient(135deg, #0E7C86, #2BAA4A); }
.capa.cat-esportivo { background: linear-gradient(135deg, #2BAA4A, #1E6FD9); }
.capa.cat-religioso { background: linear-gradient(135deg, #123E8C, #6AA6F0); }
.capa.cat-bloco { background: linear-gradient(135deg, #E83E8C, #F2552C); }
.capa.cat-parque { background: linear-gradient(135deg, #F7B500, #2BAA4A); }
.capa.cat-outro { background: linear-gradient(135deg, #1E6FD9, #2BAA4A); }
@media (max-width: 560px) { .evento-card .capa.auto i { font-size: 1.9rem; } }

/* cartões de escolha (tipo de evento etc.): todos com a mesma altura, ícone alinhado */
.opcoes { grid-auto-rows: 1fr; }
.opcao, .opcao label { height: 100%; }
.opcao label i { line-height: 1; height: 1.5rem; }
/* agenda CrediBahia (equipe): calendário e lista do dia lado a lado no computador, um abaixo do outro no celular */
.grade-agenda { grid-template-columns: minmax(0, 1fr) 420px; }
@media (max-width: 1060px) { .grade-agenda { grid-template-columns: minmax(0, 1fr); } }
@media (max-width: 560px) {
  .grade-agenda .calendario { border-spacing: 3px; }
  .grade-agenda .calendario td { height: 52px !important; padding: 4px; border-radius: 10px; }
  .grade-agenda .calendario td .n { font-size: .8rem; }
  .grade-agenda .calendario th { font-size: .6rem; }
  .grade-agenda form.d-flex > div { flex: 1 1 45%; }
  .grade-agenda form.d-flex .btn { flex: 1 1 100%; }
}

/* equipamento da tabela do DAM: nome e preço lado a lado; no celular o preço vai para baixo do nome */
.opcao label.opcao-taxa { min-height: 0; flex-direction: row; align-items: center; justify-content: space-between; gap: 6px 12px; }
.opcao-taxa span { min-width: 0; }
.opcao-taxa small { color: var(--suave); font-weight: 800; text-align: right; }
@media (max-width: 560px) {
  .opcao label.opcao-taxa { flex-direction: column; align-items: flex-start; padding-right: 44px; }
  .opcao-taxa small { text-align: left; }
}
.equip, .equip > * { min-width: 0; max-width: 100%; }

/* capa automática: ícone do tema no canto inferior direito, longe da data */
.evento-card .capa.auto i { position: absolute; right: 12px; bottom: 10px; z-index: 1; font-size: 2.4rem; line-height: 1; }
.evento-card .data-chip { z-index: 2; }
.data-chip .a-confirmar { display: block; font-size: .56rem; font-weight: 800; color: var(--suave); text-transform: uppercase;
                          letter-spacing: .02em; line-height: 1.1; margin-top: 1px; white-space: nowrap; }
@media (max-width: 560px) {
  .evento-card .capa.auto i { right: 8px; bottom: 8px; font-size: 1.6rem; }
  .evento-card .data-chip .a-confirmar { font-size: .5rem; }
}

/* conferência do DAM (gestão) e recebedor do PIX (requerente) */
.conferencia-dam { list-style: none; padding: 0; margin: 0 0 14px; display: grid; gap: 6px; }
.conferencia-dam li { display: flex; gap: 8px; align-items: flex-start; font-size: .9rem; line-height: 1.35;
                      padding: 8px 10px; border-radius: 12px; background: #F1FBF4; color: #14532D; }
.conferencia-dam li i { flex: none; margin-top: 1px; }
.conferencia-dam li.ok i { color: var(--verde); }
.conferencia-dam li.alerta { background: #FFF8E1; color: #6B4E00; }
.conferencia-dam li.alerta i { color: #D89B00; }
.conferencia-dam li.erro { background: #FDECEC; color: #7F1D1D; }
.conferencia-dam li.erro i { color: #DC2626; }
.recebedor-pix { display: flex; gap: 8px; align-items: flex-start; margin: 10px 0 0; padding: 10px 12px; border-radius: 14px;
                 background: #EEF5FF; color: #1E3A6B; font-size: .92rem; line-height: 1.4; }
.recebedor-pix i { color: var(--azul); font-size: 1.1rem; flex: none; }

/* servidor SDE (robô de emissão do DAM) */
.situacao.r-aprovacao { background: #FFF4D6; color: #8A5A00; } .situacao.r-pendente { background: #EAF2FF; color: #1E4FA8; }
.situacao.r-executando { background: #E1F6F9; color: #0B6A77; } .situacao.r-concluida { background: #E5F7EA; color: #1E7A3A; }
.situacao.r-revisao { background: #FFE9E1; color: #A3361A; } .situacao.r-cancelada { background: #F1F3F6; color: #5A6B85; }
.filtros-robo { display: flex; flex-wrap: wrap; gap: 6px; }
.filtros-robo a { padding: 6px 12px; border-radius: 99px; background: #F1F5FB; color: var(--marinho); font-weight: 800; font-size: .85rem; text-decoration: none; }
.filtros-robo a.ativo { background: var(--azul); color: #fff; }
.robo-passos { list-style: none; padding: 0; margin: 0; font-family: Consolas, monospace; font-size: .82rem; color: var(--suave);
               max-height: 220px; overflow: auto; }
.robo-tela { max-width: 100%; border-radius: 12px; border: 1px solid var(--borda); }
.tributo-linha { display: grid; grid-template-columns: minmax(0, 1.2fr) minmax(0, 1.6fr) minmax(0, .8fr); gap: 8px; margin-bottom: 8px; }
@media (max-width: 560px) { .tributo-linha { grid-template-columns: minmax(0, 1fr); } }
.robo-status { padding: 12px 14px; border-radius: 16px; background: #F4F8FE; border: 1.5px solid #DCE7F7; }