/* FalaCidadão — identidade visual (ver PLANO_FALACIDADAO.md, seção 5) */
:root {
  --fc-primaria: #0B5563;
  --fc-primaria-2: #0E7C86;
  --fc-primaria-clara: #E3F1F2;
  --fc-acento: #F5A524;
  --fc-acento-escuro: #8A5200;
  --fc-fundo: #F6F9FA;
  --fc-superficie: #FFFFFF;
  --fc-texto: #1B2A30;
  --fc-suave: #5B6B73;
  --fc-borda: #DCE6E8;
  --fc-sucesso: #15803D;
  --fc-alerta: #B45309;
  --fc-erro: #B91C1C;
  --fc-raio: 16px;
  --fc-sombra: 0 2px 14px rgba(11, 85, 99, .08);
  --fc-foco: 0 0 0 3px rgba(245, 165, 36, .55), 0 0 0 1px #8A5200;
  --fc-dur: 220ms;
}

* { box-sizing: border-box; }
[hidden] { display: none !important; }   /* vence .d-flex etc. do Bootstrap */
html { -webkit-text-size-adjust: 100%; }
body { margin: 0; background: var(--fc-fundo); color: var(--fc-texto);
       font: 400 16px/1.55 Poppins, "Segoe UI", system-ui, sans-serif; min-height: 100vh;
       display: flex; flex-direction: column; }
main { flex: 1; }
a { color: var(--fc-primaria-2); }
:focus-visible { outline: none; box-shadow: var(--fc-foco) !important; border-radius: 6px; }
.visually-hidden-focusable:not(:focus) { position: absolute !important; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); }
.skip { position: absolute; left: 12px; top: 8px; z-index: 100; background: #fff; padding: 8px 14px; border-radius: 8px; }

/* ── Cabeçalho: FalaCidadão | Valença ─────────────────────────── */
.fc-topo { background: var(--fc-superficie); border-bottom: 1px solid var(--fc-borda); position: sticky; top: 0; z-index: 30; }
.fc-topo .fc-barra { max-width: 1100px; margin: 0 auto; padding: 10px 16px; display: flex; align-items: center; gap: 12px; }
.fc-marca { display: flex; align-items: center; gap: 12px; text-decoration: none; min-width: 0; }
.fc-marca img.fc-logo { height: 42px; width: auto; }
.fc-marca .fc-div { width: 1px; height: 30px; background: #B8C6CA; }
.fc-marca img.fc-valenca { height: 36px; width: auto; }
.fc-nav { margin-left: auto; display: flex; align-items: center; gap: 6px; }
.fc-nav a, .fc-nav button { font-size: .9rem; font-weight: 600; color: var(--fc-primaria); text-decoration: none;
                            padding: 8px 12px; border-radius: 10px; background: none; border: 0; }
.fc-nav a:hover, .fc-nav button:hover { background: var(--fc-primaria-clara); }
@media (max-width: 575.98px) {
  .fc-marca img.fc-logo { height: 34px; }
  .fc-marca img.fc-valenca { height: 28px; }
  .fc-marca .fc-div { height: 24px; }
  .fc-nav .fc-nav-texto { display: none; }
  /* com o botão "Trocar ambiente" os atalhos Gestão/Campo já estão no menu dele: no celular
     ficam só nele, senão os ícones invadiam as logos */
  .fc-nav-com-troca .fc-nav-atalho { display: none; }
  .fc-nav { gap: 2px; flex: none; }
  .fc-nav a, .fc-nav button { padding: 8px 9px; }
  .fc-marca { flex: 1 1 auto; overflow: hidden; }
}
@media (max-width: 399.98px) {
  .fc-topo .fc-barra { padding: 10px 12px; gap: 8px; }
  .fc-marca { gap: 8px; }
  .fc-marca img.fc-logo { height: 28px; }
  .fc-marca img.fc-valenca { height: 23px; }
  .fc-marca .fc-div { height: 22px; }
}
@media (max-width: 329.98px) {
  .fc-marca .fc-div, .fc-marca img.fc-valenca { display: none; }
}

.fc-wrap { max-width: 1100px; margin: 0 auto; padding: 20px 16px 40px; }
.fc-estreito { max-width: 560px; margin: 0 auto; }
.fc-rodape { text-align: center; font-size: .8rem; color: var(--fc-suave); padding: 24px 16px 32px; }
.fc-rodape a { color: var(--fc-suave); }

/* ── Tipografia e blocos ─────────────────────────────────────── */
h1, h2, h3 { color: var(--fc-primaria); font-weight: 800; letter-spacing: -.01em; }
.h4, .h5, .h6 { font-weight: 700; color: var(--fc-primaria); }
.fc-titulo { font-size: clamp(1.4rem, 4.5vw, 1.9rem); margin: 0 0 4px; }
.fc-sub { color: var(--fc-suave); margin: 0 0 20px; }
.fc-cartao { background: var(--fc-superficie); border-radius: var(--fc-raio); box-shadow: var(--fc-sombra); padding: 20px; }
.fc-cartao + .fc-cartao { margin-top: 16px; }
.fc-rotulo { font-size: .78rem; font-weight: 700; color: var(--fc-suave); text-transform: uppercase; letter-spacing: .04em; }

/* ── Botões ──────────────────────────────────────────────────── */
.fc-btn { display: inline-flex; align-items: center; justify-content: center; gap: 8px; min-height: 48px;
          padding: 10px 20px; border-radius: 12px; border: 0; font: 700 1rem Poppins, sans-serif;
          text-decoration: none; cursor: pointer; transition: transform 120ms, background var(--fc-dur); }
.fc-btn:active { transform: scale(.98); }
.fc-btn-primario { background: var(--fc-primaria); color: #fff; }
.fc-btn-primario:hover { background: #084652; color: #fff; }
.fc-btn-acento { background: var(--fc-acento); color: #3A2600; }
.fc-btn-acento:hover { background: #E8971A; color: #3A2600; }
.fc-btn-contorno { background: #fff; color: var(--fc-primaria); box-shadow: inset 0 0 0 2px var(--fc-primaria); }
.fc-btn-contorno:hover { background: var(--fc-primaria-clara); color: var(--fc-primaria); }
.fc-btn-leve { background: none; color: var(--fc-primaria); }
.fc-btn[disabled] { opacity: .55; cursor: not-allowed; }
.fc-btn-bloco { width: 100%; }

/* Botão grande "Registrar solicitação" */
.fc-cta { display: flex; align-items: center; gap: 16px; width: 100%; padding: 20px 22px; border-radius: 20px;
          background: linear-gradient(135deg, var(--fc-acento), #F7B94A); color: #3A2600; text-decoration: none;
          box-shadow: 0 8px 24px rgba(245, 165, 36, .35); transition: transform var(--fc-dur); }
.fc-cta:hover { color: #3A2600; transform: translateY(-2px); }
.fc-cta .fc-cta-icone { width: 54px; height: 54px; border-radius: 16px; background: rgba(255,255,255,.55);
                        display: grid; place-items: center; font-size: 1.8rem; flex: none; }
.fc-cta strong { display: block; font-size: 1.2rem; font-weight: 800; }
.fc-cta span { font-size: .88rem; }

/* ── Formulários ─────────────────────────────────────────────── */
.form-control, .form-select { border-radius: 12px; border-color: #C9D6D9; }
.form-control:focus, .form-select:focus { border-color: var(--fc-primaria-2); box-shadow: var(--fc-foco); }
.form-label { font-weight: 600; font-size: .92rem; }
.fc-erro { color: var(--fc-erro); font-size: .85rem; margin-top: 4px; }
.fc-ajuda { color: var(--fc-suave); font-size: .82rem; margin-top: 4px; }
.form-check-input:checked { background-color: var(--fc-primaria); border-color: var(--fc-primaria); }

/* ── Wizard ──────────────────────────────────────────────────── */
.fc-wizard { position: relative; }
.fc-progresso { display: flex; align-items: center; gap: 12px; margin-bottom: 18px; }
.fc-progresso .fc-trilho { flex: 1; height: 8px; border-radius: 99px; background: var(--fc-borda); overflow: hidden; }
.fc-progresso .fc-trilho i { display: block; height: 100%; width: 0; border-radius: 99px;
                             background: linear-gradient(90deg, var(--fc-primaria-2), var(--fc-acento));
                             transition: width 300ms ease; }
.fc-progresso .fc-passo-n { font-size: .82rem; font-weight: 700; color: var(--fc-suave); white-space: nowrap; }
.fc-etapa { display: none; }
.fc-etapa.ativa { display: block; animation: fc-entra var(--fc-dur) ease both; }
.fc-etapa.ativa.volta { animation-name: fc-entra-volta; }
.fc-etapa h2 { font-size: clamp(1.25rem, 4vw, 1.6rem); margin: 0 0 6px; }
@keyframes fc-entra { from { opacity: 0; transform: translateX(24px); } to { opacity: 1; transform: none; } }
@keyframes fc-entra-volta { from { opacity: 0; transform: translateX(-24px); } to { opacity: 1; transform: none; } }
.fc-acoes { position: sticky; bottom: 0; z-index: 10; display: flex; gap: 10px; padding: 14px 0 16px; margin-top: 18px;
            background: linear-gradient(to top, var(--fc-fundo) 75%, transparent); }
.fc-acoes .fc-btn { flex: 1; }
.fc-acoes .fc-btn-leve { flex: 0 0 auto; }

/* Cartões de categoria */
.fc-categorias { display: grid; grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); gap: 12px; }
.fc-cat { position: relative; display: flex; flex-direction: column; align-items: flex-start; gap: 6px; padding: 16px;
          border-radius: 16px; background: #fff; border: 2px solid var(--fc-borda); cursor: pointer; min-height: 116px;
          transition: border-color 150ms, box-shadow 150ms, transform 150ms; text-align: left; }
.fc-cat input { position: absolute; opacity: 0; pointer-events: none; }
.fc-cat .bi { font-size: 1.7rem; color: var(--fc-primaria-2); }
.fc-cat strong { font-size: .98rem; line-height: 1.25; color: var(--fc-texto); }
.fc-cat small { font-size: .74rem; color: var(--fc-suave); line-height: 1.3; }
.fc-cat:hover { border-color: #A9C4C8; }
.fc-cat:has(input:checked) { border-color: var(--fc-acento); box-shadow: 0 0 0 4px rgba(245,165,36,.18); animation: fc-pulsa 150ms ease; }
.fc-cat:has(input:focus-visible) { box-shadow: var(--fc-foco); }
@keyframes fc-pulsa { 50% { transform: scale(1.03); } }

/* Mapa */
.fc-mapa { height: 340px; border-radius: 16px; overflow: hidden; background: #E6EEF0; }
@media (max-width: 575.98px) { .fc-mapa { height: 300px; } }
.fc-gps { display: flex; align-items: center; gap: 8px; font-size: .85rem; padding: 8px 12px; border-radius: 10px;
          background: var(--fc-primaria-clara); color: var(--fc-primaria); margin: 10px 0; }
.fc-gps.ok { background: #E4F4EA; color: var(--fc-sucesso); }
.fc-gps.aviso { background: #FFF4E0; color: var(--fc-acento-escuro); }

/* Aviso de solicitação parecida (apoio) */
.fc-parecida { border: 2px solid var(--fc-acento); background: #FFF9EE; border-radius: 16px; padding: 16px; margin-top: 12px;
               animation: fc-entra var(--fc-dur) ease both; }

/* Mídias */
.fc-midias { display: grid; grid-template-columns: repeat(auto-fill, minmax(96px, 1fr)); gap: 10px; margin-top: 12px; }
.fc-midia { position: relative; aspect-ratio: 1; border-radius: 12px; overflow: hidden; background: #E6EEF0; animation: fc-surge 250ms ease both; }
.fc-midia img, .fc-midia video { width: 100%; height: 100%; object-fit: cover; display: block; }
.fc-midia button { position: absolute; top: 4px; right: 4px; width: 30px; height: 30px; border-radius: 50%; border: 0;
                   background: rgba(0,0,0,.6); color: #fff; line-height: 1; }
@keyframes fc-surge { from { opacity: 0; transform: scale(.85); } to { opacity: 1; transform: none; } }
.fc-envio { height: 8px; border-radius: 99px; background: var(--fc-borda); overflow: hidden; margin-top: 10px; display: none; }
.fc-envio i { display: block; height: 100%; width: 0; background: var(--fc-primaria-2); transition: width 150ms; }
.fc-botoes-midia { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }

/* Sugestões rápidas */
.fc-chips { display: flex; flex-wrap: wrap; gap: 8px; margin: 10px 0; }
.fc-chip { border: 1px solid #BFD3D6; background: #fff; color: var(--fc-primaria); border-radius: 99px;
           padding: 6px 12px; font-size: .82rem; font-weight: 600; cursor: pointer; }
.fc-chip:hover { background: var(--fc-primaria-clara); }

/* ── Situação ────────────────────────────────────────────────── */
.fc-sit { display: inline-flex; align-items: center; gap: 6px; font-size: .75rem; font-weight: 700; padding: 3px 10px;
          border-radius: 99px; white-space: nowrap; }
.fc-sit::before { content: ""; width: 8px; height: 8px; border-radius: 50%; background: currentColor; }
.fc-sit-recebida { background: #EEF1F4; color: #475569; }
.fc-sit-triagem { background: #E3F1F2; color: #0B5563; }
.fc-sit-encaminhada { background: #E6EEFD; color: #1D4ED8; }
.fc-sit-execucao { background: #FFF1D6; color: #8A5200; }
.fc-sit-concluida { background: #E4F4EA; color: #15803D; }
.fc-sit-nao_procede, .fc-sit-duplicada { background: #F1F2F4; color: #5B6470; }
.fc-sit-vencida { background: #FDE8E8; color: #B91C1C; }

/* Lista de solicitações */
.fc-lista { list-style: none; margin: 0; padding: 0; }
.fc-item { display: flex; gap: 14px; align-items: center; padding: 14px 4px; border-bottom: 1px solid var(--fc-borda);
           text-decoration: none; color: inherit; }
.fc-item:last-child { border-bottom: 0; }
.fc-item:hover { background: #FAFCFC; }
.fc-item .fc-item-icone { width: 44px; height: 44px; border-radius: 12px; background: var(--fc-primaria-clara);
                          color: var(--fc-primaria-2); display: grid; place-items: center; font-size: 1.3rem; flex: none; }
.fc-item .fc-item-corpo { min-width: 0; flex: 1; }
.fc-item .fc-item-corpo strong { display: block; font-size: .95rem; }
.fc-item .fc-item-linha { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 10px; margin-top: 4px; }
.fc-item .fc-item-corpo small { display: block; color: var(--fc-suave); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.fc-prot { font: 700 .78rem ui-monospace, "Cascadia Mono", monospace; color: var(--fc-suave); }
.fc-vazio { text-align: center; padding: 28px 12px; color: var(--fc-suave); }
.fc-vazio .bi { font-size: 2.2rem; color: #9DB5B9; display: block; margin-bottom: 8px; }

/* Linha do tempo */
.fc-etapas { display: flex; gap: 0; margin: 8px 0 4px; }
.fc-etapas li { list-style: none; flex: 1; text-align: center; font-size: .72rem; font-weight: 600; color: var(--fc-suave); position: relative; padding-top: 30px; }
.fc-etapas li::before { content: ""; position: absolute; top: 6px; left: 50%; transform: translateX(-50%); width: 18px; height: 18px;
                        border-radius: 50%; background: #fff; border: 3px solid var(--fc-borda); z-index: 1; }
.fc-etapas li::after { content: ""; position: absolute; top: 13px; left: -50%; width: 100%; height: 4px; background: var(--fc-borda); }
.fc-etapas li:first-child::after { display: none; }
.fc-etapas li.feito { color: var(--fc-primaria); }
.fc-etapas li.feito::before { background: var(--fc-primaria-2); border-color: var(--fc-primaria-2); }
.fc-etapas li.feito::after { background: var(--fc-primaria-2); animation: fc-linha 300ms ease both; transform-origin: left; }
.fc-etapas li.atual::before { background: var(--fc-acento); border-color: var(--fc-acento); box-shadow: 0 0 0 5px rgba(245,165,36,.25); }
@keyframes fc-linha { from { transform: scaleX(0); } to { transform: scaleX(1); } }
.fc-historico { list-style: none; padding: 0; margin: 0; }
.fc-historico li { position: relative; padding: 0 0 18px 26px; }
.fc-historico li::before { content: ""; position: absolute; left: 6px; top: 8px; bottom: -8px; width: 2px; background: var(--fc-borda); }
.fc-historico li:last-child::before { display: none; }
.fc-historico li::after { content: ""; position: absolute; left: 0; top: 4px; width: 14px; height: 14px; border-radius: 50%;
                          background: #fff; border: 3px solid var(--fc-primaria-2); }
.fc-historico time { font-size: .76rem; color: var(--fc-suave); display: block; }

/* Sucesso (protocolo criado) */
.fc-sucesso { text-align: center; padding: 28px 16px; position: relative; overflow: hidden; }
.fc-sucesso .fc-check { width: 76px; height: 76px; border-radius: 50%; background: var(--fc-sucesso); color: #fff;
                        display: grid; place-items: center; font-size: 2.4rem; margin: 0 auto 12px; animation: fc-pop 450ms cubic-bezier(.2,1.6,.4,1) both; }
.fc-sucesso .fc-protocolo { font: 800 1.6rem ui-monospace, "Cascadia Mono", monospace; color: var(--fc-primaria); letter-spacing: .02em;
                            animation: fc-entra 500ms 200ms ease both; }
@keyframes fc-pop { from { transform: scale(0); } to { transform: scale(1); } }
.fc-confete { position: absolute; top: -10px; width: 8px; height: 14px; border-radius: 2px; opacity: 0; animation: fc-cai 900ms ease-in forwards; }
@keyframes fc-cai { 0% { opacity: 1; transform: translateY(0) rotate(0); } 100% { opacity: 0; transform: translateY(220px) rotate(300deg); } }

/* Indicadores da gestão */
.fc-ind { display: grid; grid-template-columns: repeat(auto-fit, minmax(140px, 1fr)); gap: 12px; margin-bottom: 16px; }
.fc-ind-4 { grid-template-columns: repeat(4, 1fr); }
@media (max-width: 767.98px) { .fc-ind-4 { grid-template-columns: repeat(2, 1fr); } }
.fc-ind a { background: #fff; border-radius: 14px; box-shadow: var(--fc-sombra); padding: 14px 16px; text-decoration: none; color: inherit; border-left: 5px solid var(--fc-primaria-2); }
.fc-ind a strong { display: block; font-size: 1.7rem; font-weight: 800; line-height: 1.1; color: var(--fc-primaria); }
.fc-ind a span { font-size: .8rem; color: var(--fc-suave); font-weight: 600; }
.fc-ind a.alerta { border-left-color: var(--fc-erro); } .fc-ind a.alerta strong { color: var(--fc-erro); }
.fc-ind a.acento { border-left-color: var(--fc-acento); }
.fc-ind a.ok { border-left-color: var(--fc-sucesso); }
.fc-tabela { width: 100%; font-size: .88rem; }
.fc-tabela th { font-size: .74rem; text-transform: uppercase; letter-spacing: .04em; color: var(--fc-suave); font-weight: 700; padding: 8px; border-bottom: 2px solid var(--fc-borda); }
.fc-tabela td { padding: 10px 8px; border-bottom: 1px solid var(--fc-borda); vertical-align: middle; }
.fc-tabela tr:hover td { background: #FAFCFC; }
/* celular: cada linha da lista vira um cartão (protocolo e situação no topo, problema/local embaixo) */
@media (max-width: 767.98px) {
  .fc-tabela-cartoes thead { display: none; }
  .fc-tabela-cartoes, .fc-tabela-cartoes tbody { display: block; }
  .fc-tabela-cartoes tr { display: grid; grid-template-columns: 1fr auto; gap: 4px 10px; padding: 12px 4px;
                          border-bottom: 1px solid var(--fc-borda); }
  .fc-tabela-cartoes td { display: block; padding: 0; border: 0; min-width: 0; }
  .fc-tabela-cartoes .fc-cel-local { grid-column: 1 / -1; grid-row: 2; }
  .fc-tabela-cartoes .fc-cel-prazo { grid-column: 1 / -1; grid-row: 3; font-size: .8rem; color: var(--fc-suave); }
  .fc-tabela-cartoes .fc-cel-prazo::before { content: "Prazo: "; }
  .fc-tabela-cartoes .fc-cel-situacao { grid-column: 2; grid-row: 1; justify-self: end; }
}
/* botões do topo das páginas de gestão: em linha no desktop, 2 colunas iguais no celular */
.fc-acoes-topo { display: flex; flex-wrap: wrap; gap: 8px; }
@media (max-width: 575.98px) {
  .fc-acoes-topo { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); width: 100%; margin-left: 0 !important; }
  .fc-acoes-topo .fc-btn { width: 100%; justify-content: center; padding-left: 8px; padding-right: 8px; }
  .fc-acoes-topo .fc-btn:last-child:nth-child(odd) { grid-column: 1 / -1; }
}
.fc-paginacao { display: flex; flex-wrap: wrap; gap: 8px 12px; align-items: center; justify-content: space-between; padding: 10px 4px 4px; font-size: .85rem; }
.fc-paginacao .fc-pag-links { display: flex; gap: 6px; }
.fc-paginacao a, .fc-paginacao .atual { padding: 6px 12px; border-radius: 8px; border: 1px solid var(--fc-borda); text-decoration: none; font-weight: 600; }
.fc-paginacao .atual { background: var(--fc-primaria); color: #fff; border-color: var(--fc-primaria); }
.fc-paginacao select { width: auto; display: inline-block; padding: 4px 28px 4px 8px; font-size: .85rem; }
.fc-urgente { color: var(--fc-erro); font-weight: 800; font-size: .72rem; }

/* Página inicial */
.fc-heroi { background: linear-gradient(140deg, var(--fc-primaria) 0%, var(--fc-primaria-2) 100%); color: #fff; border-radius: 24px;
            padding: clamp(28px, 7vw, 52px); position: relative; overflow: hidden; }
.fc-heroi h1 { color: #fff; font-size: clamp(1.7rem, 6vw, 2.6rem); margin: 0 0 10px; }
.fc-heroi p { font-size: 1.05rem; opacity: .92; max-width: 560px; }
.fc-heroi::after { content: ""; position: absolute; right: -60px; bottom: -80px; width: 280px; height: 280px; border-radius: 50%;
                   background: radial-gradient(circle, rgba(245,165,36,.45), transparent 70%); }
.fc-passos { display: grid; grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); gap: 14px; margin-top: 18px; }
.fc-passos > div { background: #fff; border-radius: 16px; padding: 18px; box-shadow: var(--fc-sombra); }
.fc-passos .n { width: 34px; height: 34px; border-radius: 50%; background: var(--fc-acento); color: #3A2600; font-weight: 800; display: grid; place-items: center; margin-bottom: 8px; }

/* ── Página inicial animada ──────────────────────────────────── */
.fc-heroi-anim { display: grid; grid-template-columns: 1.15fr .85fr; gap: 28px; align-items: center; }
.fc-heroi-texto { position: relative; z-index: 1; }
@media (max-width: 767.98px) { .fc-heroi-anim { grid-template-columns: 1fr; } }
.fc-surge { animation: fc-sobe 600ms cubic-bezier(.2,.8,.2,1) both; animation-delay: calc(var(--d, 0) * 120ms + 80ms); }
@keyframes fc-sobe { from { opacity: 0; transform: translateY(18px); } to { opacity: 1; transform: none; } }
/* frases empilhadas na mesma célula: largura e altura são as da maior frase, nada pula na troca */
.fc-rotativo { display: inline-grid; color: var(--fc-acento); vertical-align: top; }
/* cada frase numa linha só (a letra encolhe para caber a mais longa, "uma calçada quebrada?", ~13,5em),
   assim ela fica colada em "Fale com a Prefeitura." sem linha vazia reservada */
.fc-rotativo { font-size: min(1em, calc((100vw - 96px) / 13.5)); }
.fc-rotativo > span { white-space: nowrap; }
.fc-rotativo > span { grid-area: 1 / 1; opacity: 0; transform: translateY(10px); transition: opacity 350ms, transform 350ms; }
.fc-rotativo > span.ativa { opacity: 1; transform: none; }
.fc-rotativo b { color: #fff; font-weight: inherit; }
.fc-btn-vazado { background: transparent; color: #fff; box-shadow: inset 0 0 0 2px rgba(255,255,255,.85); }
.fc-btn-vazado:hover { background: rgba(255,255,255,.12); color: #fff; }
.fc-btn-brilho { position: relative; overflow: hidden; }
.fc-btn-brilho::after { content: ""; position: absolute; top: 0; left: -60%; width: 40%; height: 100%;
                        background: linear-gradient(100deg, transparent, rgba(255,255,255,.55), transparent);
                        animation: fc-reflexo 3.2s ease-in-out 1.2s infinite; }
@keyframes fc-reflexo { 0%, 60% { left: -60%; } 100% { left: 130%; } }

/* Cena: mapa com pinos e avisos */
.fc-cena { position: relative; aspect-ratio: 320 / 260; max-width: 380px; width: 100%; justify-self: center; z-index: 1;
           animation: fc-sobe 700ms 250ms cubic-bezier(.2,.8,.2,1) both; }
.fc-cena-mapa { width: 100%; height: 100%; display: block; filter: drop-shadow(0 18px 30px rgba(0,0,0,.25)); }
.fc-cena-faixas { animation: fc-faixa 6s linear infinite; }
@keyframes fc-faixa { to { stroke-dashoffset: -180; } }
.fc-pino { position: absolute; left: var(--x); top: var(--y); width: 42px; height: 42px; margin: -42px 0 0 -21px;
           border-radius: 50% 50% 50% 0; transform: rotate(-45deg); background: var(--fc-acento); display: grid; place-items: center;
           box-shadow: 0 6px 14px rgba(0,0,0,.3); animation: fc-pino-cai 3.6s cubic-bezier(.3,1.5,.5,1) infinite;
           animation-delay: calc(var(--d) * 1.2s); opacity: 0; }
.fc-pino i { transform: rotate(45deg); color: #3A2600; font-size: 1.1rem; }
@keyframes fc-pino-cai {
  0% { opacity: 0; transform: translateY(-40px) rotate(-45deg); }
  12% { opacity: 1; transform: translateY(0) rotate(-45deg); }
  75% { opacity: 1; transform: translateY(0) rotate(-45deg); }
  100% { opacity: 0; transform: translateY(0) rotate(-45deg) scale(.6); }
}
.fc-pino::after { content: ""; position: absolute; inset: -8px; border-radius: 50%; border: 3px solid rgba(245,165,36,.7);
                  animation: fc-onda 3.6s ease-out infinite; animation-delay: calc(var(--d) * 1.2s + .3s); opacity: 0; }
@keyframes fc-onda { 0% { opacity: .9; transform: scale(.6); } 40%, 100% { opacity: 0; transform: scale(1.8); } }
.fc-cena-botao { position: absolute; left: 50%; bottom: -16px; transform: translateX(-50%); width: 88%; min-height: 50px;
                  display: flex; align-items: center; justify-content: center; gap: 10px; padding: 10px 16px; border-radius: 14px;
                  background: #fff; color: var(--fc-primaria); font-weight: 700; font-size: .92rem; text-decoration: none;
                  box-shadow: 0 10px 24px rgba(0,0,0,.22); transition: transform 150ms, box-shadow 150ms; }
.fc-cena-botao .bi-geo-alt-fill { color: var(--fc-acento-escuro); }
.fc-cena-botao .bi-arrow-right { transition: transform 150ms; }
.fc-cena-botao:hover, .fc-cena-botao:focus-visible { color: var(--fc-primaria); transform: translateX(-50%) translateY(-2px);
                  box-shadow: 0 14px 28px rgba(0,0,0,.28); }
.fc-cena-botao:hover .bi-arrow-right { transform: translateX(3px); }
.fc-avisos { position: absolute; left: 50%; bottom: -14px; transform: translateX(-50%); width: 88%; height: 46px; }
.fc-aviso { position: absolute; inset: 0; display: flex; align-items: center; gap: 8px; padding: 8px 12px; border-radius: 14px;
            background: #fff; color: var(--fc-texto); font-size: .8rem; font-weight: 600; box-shadow: 0 10px 24px rgba(0,0,0,.22);
            opacity: 0; transform: translateY(12px) scale(.96); transition: opacity 400ms, transform 400ms; white-space: nowrap; overflow: hidden; }
.fc-aviso.ativo { opacity: 1; transform: none; }
.fc-js .fc-aviso:first-child:not(.ativo) { transition-delay: 0ms; }
html:not(.fc-js) .fc-aviso:first-child { opacity: 1; transform: none; }
@media (max-width: 767.98px) { .fc-cena { max-width: 300px; margin-top: 8px; } }

/* Vitrine de categorias */
.fc-js .fc-revela { opacity: 0; transform: translateY(22px) scale(.97); }
.fc-js .fc-revela.visivel { opacity: 1; transform: none;
                            transition: opacity 500ms ease, transform 500ms cubic-bezier(.2,.8,.2,1), border-color 150ms, box-shadow 150ms;
                            transition-delay: calc(var(--i, 0) * 70ms), calc(var(--i, 0) * 70ms), 0ms, 0ms; }
.fc-cat-vitrine .fc-cat { text-decoration: none; color: inherit; cursor: pointer; overflow: hidden; }
.fc-cat-vitrine .fc-cat:hover, .fc-cat-vitrine .fc-cat:focus-visible { border-color: var(--fc-acento); box-shadow: 0 10px 24px rgba(11,85,99,.14); }
.fc-cat-vitrine .fc-cat.visivel:hover { transform: translateY(-4px); transition-delay: 0ms; }
.fc-cat-icone { position: relative; width: 48px; height: 48px; border-radius: 14px; background: var(--fc-primaria-clara);
                display: grid; place-items: center; transition: background 200ms; }
.fc-cat-icone .bi { font-size: 1.55rem; color: var(--fc-primaria-2); display: inline-block; }
.fc-cat:hover .fc-cat-icone, .fc-cat.anima .fc-cat-icone { background: #FFF1D6; }
/* "Pedir" e a seta na mesma linha de base visual */
.fc-cat-ir { display: inline-flex; align-items: center; gap: 6px; line-height: 1;
             margin-top: auto; font-size: .78rem; font-weight: 700; color: var(--fc-acento-escuro); opacity: 0; transform: translateX(-6px);
             transition: opacity 200ms, transform 200ms; }
.fc-cat .fc-cat-ir .bi { font-size: 1rem; color: inherit; }   /* a regra .fc-cat .bi (ícone da categoria) deixava a seta enorme */
.fc-cat:hover .fc-cat-ir, .fc-cat:focus-visible .fc-cat-ir { opacity: 1; transform: none; }
@media (hover: none) { .fc-cat-ir { opacity: 1; transform: none; } }

/* Microanimações por tipo (disparadas ao aparecer, no hover e no foco) */
.fc-cat.anima[data-anim="brilho"] .bi { animation: fc-brilho 1.1s ease; }
@keyframes fc-brilho { 0%, 100% { color: var(--fc-primaria-2); filter: none; }
  30%, 70% { color: var(--fc-acento); filter: drop-shadow(0 0 8px rgba(245,165,36,.9)); } 50% { filter: drop-shadow(0 0 2px rgba(245,165,36,.4)); } }
.fc-raios { position: absolute; inset: -6px; border-radius: 50%; opacity: 0;
            background: repeating-conic-gradient(rgba(245,165,36,.55) 0 8deg, transparent 8deg 30deg);
            -webkit-mask: radial-gradient(circle, transparent 42%, #000 44%, #000 60%, transparent 62%);
                    mask: radial-gradient(circle, transparent 42%, #000 44%, #000 60%, transparent 62%); }
.fc-cat.anima .fc-raios { animation: fc-raios 1.1s ease; }
@keyframes fc-raios { 0% { opacity: 0; transform: scale(.7) rotate(0); } 40% { opacity: 1; } 100% { opacity: 0; transform: scale(1.15) rotate(40deg); } }
.fc-cat.anima[data-anim="balanco"] .bi { animation: fc-balanco .9s ease; transform-origin: 50% 100%; }
@keyframes fc-balanco { 20% { transform: rotate(-14deg); } 40% { transform: rotate(10deg); } 60% { transform: rotate(-6deg); } 80% { transform: rotate(3deg); } }
.fc-cat.anima[data-anim="passo"] .bi { animation: fc-passo .9s ease; }
@keyframes fc-passo { 0% { transform: translateX(-8px); } 25% { transform: translateX(-3px) translateY(-4px); } 50% { transform: translateX(2px); }
  75% { transform: translateX(6px) translateY(-4px); } 100% { transform: none; } }
.fc-gota { position: absolute; top: 30px; width: 3px; height: 7px; border-radius: 3px; background: #3BA3D9; opacity: 0; }
.fc-gota:nth-of-type(1) { left: 16px; } .fc-gota:nth-of-type(2) { left: 23px; } .fc-gota:nth-of-type(3) { left: 30px; }
.fc-cat.anima .fc-gota { animation: fc-gota .8s ease-in 2; }
.fc-cat.anima .fc-gota:nth-of-type(2) { animation-delay: .2s; } .fc-cat.anima .fc-gota:nth-of-type(3) { animation-delay: .1s; }
@keyframes fc-gota { 0% { opacity: 0; transform: translateY(-4px); } 30% { opacity: 1; } 100% { opacity: 0; transform: translateY(12px); } }
.fc-cat.anima[data-anim="vento"] .bi { animation: fc-vento 1.2s ease; transform-origin: 50% 100%; }
@keyframes fc-vento { 25% { transform: rotate(8deg) skewX(-4deg); } 50% { transform: rotate(-5deg); } 75% { transform: rotate(3deg); } }
.fc-cat.anima[data-anim="gira"] .bi { animation: fc-gira .9s ease; transform-origin: 50% 0; }
@keyframes fc-gira { 25% { transform: rotate(12deg); } 50% { transform: rotate(-9deg); } 75% { transform: rotate(4deg); } }
.fc-cat.anima[data-anim="tampa"] .bi { animation: fc-tampa .7s ease; }
@keyframes fc-tampa { 20% { transform: translateY(-5px) rotate(-6deg); } 40% { transform: translateY(0) rotate(4deg); } 60% { transform: translateY(-2px); } }
.fc-cat.anima[data-anim="ferramenta"] .bi { animation: fc-ferramenta .9s ease; }
@keyframes fc-ferramenta { 30% { transform: rotate(-25deg) scale(1.08); } 60% { transform: rotate(15deg); } }
.fc-cat.anima[data-anim="pulo"] .bi { animation: fc-pulo .6s cubic-bezier(.3,1.6,.5,1); }
@keyframes fc-pulo { 40% { transform: translateY(-7px) scale(1.1); } }

/* Passos e convite final */
.fc-passos-anim > div { position: relative; }
.fc-passos-anim .n { transform: scale(0); }
.fc-passos-anim .visivel .n, html:not(.fc-js) .fc-passos-anim .n { transform: scale(1); transition: transform 450ms cubic-bezier(.3,1.6,.5,1);
                                                                  transition-delay: calc(var(--i) * 120ms + 200ms); }
.fc-convite { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 14px; padding: 20px 22px;
              border-radius: 20px; background: var(--fc-primaria-clara); color: var(--fc-primaria); }
.fc-convite strong { font-size: 1.05rem; }

/* Avaliação por estrelas (direita → esquerda para o hover acender as anteriores) */
.fc-estrelas { display: inline-flex; flex-direction: row-reverse; gap: 4px; }
.fc-estrelas input { position: absolute; opacity: 0; width: 1px; height: 1px; }
.fc-estrelas label { font-size: 2rem; color: #CBD5D8; cursor: pointer; transition: color 120ms, transform 120ms; }
.fc-estrelas label:hover, .fc-estrelas label:hover ~ label, .fc-estrelas input:checked ~ label { color: var(--fc-acento); }
.fc-estrelas label:hover { transform: scale(1.15); }
.fc-estrelas input:focus-visible + label { box-shadow: var(--fc-foco); border-radius: 6px; }

.fc-emergencia { display: flex; gap: 10px; align-items: flex-start; font-size: .84rem; background: #FDECEC; color: #7F1D1D;
                 border-radius: 12px; padding: 10px 14px; }

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation-duration: 1ms !important; animation-iteration-count: 1 !important; transition-duration: 1ms !important; }
  .fc-confete { display: none; }
  .fc-pino { opacity: 1; animation: none !important; }
  .fc-pino::after, .fc-btn-brilho::after { display: none; }
  .fc-js .fc-revela { opacity: 1; transform: none; }
  .fc-passos-anim .n { transform: none; }
  .fc-aviso:first-child { opacity: 1; transform: none; }
}

/* ── Tela de entrar ─────────────────────────────────────────── */
.fc-login { max-width: 440px; margin: 8px auto 0; }
.fc-login-cartao { background: var(--fc-superficie); border-radius: 20px; box-shadow: 0 10px 34px rgba(11,85,99,.12); overflow: hidden;
                   animation: fc-sobe 500ms cubic-bezier(.2,.8,.2,1) both; }
.fc-login-topo { display: flex; gap: 14px; align-items: center; padding: 22px 22px 20px; color: #fff;
                 background: linear-gradient(140deg, var(--fc-primaria) 0%, var(--fc-primaria-2) 100%); position: relative; overflow: hidden; }
.fc-login-topo::after { content: ""; position: absolute; right: -50px; top: -60px; width: 170px; height: 170px; border-radius: 50%;
                        background: radial-gradient(circle, rgba(245,165,36,.4), transparent 70%); }
.fc-login-topo img { flex: none; border-radius: 14px; background: #fff; padding: 6px; box-shadow: 0 6px 16px rgba(0,0,0,.18); position: relative; z-index: 1; }
.fc-login-topo h1 { color: #fff; font-size: 1.35rem; margin: 0; }
.fc-login-topo p { margin: 2px 0 0; font-size: .88rem; opacity: .9; }
.fc-login-topo > div { position: relative; z-index: 1; }
.fc-login-corpo { padding: 22px; }
.fc-login-corpo .form-label { font-weight: 600; font-size: .9rem; margin-bottom: 6px; }
.fc-login-campo { position: relative; }
.fc-login-campo > .bi { position: absolute; left: 14px; top: 50%; transform: translateY(-50%); color: var(--fc-suave); font-size: 1.05rem; pointer-events: none; }
.fc-login-campo .form-control { padding-left: 42px; min-height: 50px; border-radius: 12px; font-size: 1rem; }
.fc-login-campo .form-control:focus { border-color: var(--fc-primaria-2); box-shadow: 0 0 0 .2rem rgba(14,124,134,.15); }
.fc-login-campo input[type="password"], .fc-login-campo input[name="password"] { padding-right: 48px; }
.fc-login-olho { position: absolute; right: 4px; top: 50%; transform: translateY(-50%); width: 42px; height: 42px; border: 0; background: none;
                 border-radius: 10px; color: var(--fc-suave); font-size: 1.1rem; }
.fc-login-olho:hover { background: var(--fc-primaria-clara); color: var(--fc-primaria); }
.fc-login-ou { display: flex; align-items: center; gap: 12px; margin: 22px 0 14px; color: var(--fc-suave); font-size: .82rem; }
.fc-login-ou::before, .fc-login-ou::after { content: ""; flex: 1; height: 1px; background: var(--fc-borda); }
.fc-login-notas { list-style: none; padding: 0; margin: 18px 4px 0; justify-content: center; text-align: center; display: grid; gap: 8px; font-size: .82rem; color: var(--fc-suave); }
.fc-login-notas li { display: flex; gap: 8px; align-items: center; justify-content: center; }
.fc-login-notas .bi { color: var(--fc-primaria-2); margin-top: 1px; }