/* Funções do Fluv Hub (/funcoes e /funcoes/<slug>). Vem depois do blog.css e
   do ajuda.css: reaproveita o topo, os cards de área e as perguntas da Ajuda. */

.fn-termos{margin-top:10px;max-width:70ch;font-size:.86rem;color:var(--muted);}
.fn-canais{list-style:none;display:flex;flex-wrap:wrap;gap:6px;margin-top:12px;padding:0;}
.fn-canais li{
  padding:4px 10px;border:1px solid var(--line);border-radius:var(--r-pill);
  background:var(--surface);font-size:.8rem;font-weight:600;color:var(--ink-2);
}

.fn-corpo{padding-top:8px;padding-bottom:64px;max-width:860px;}
.fn-bloco{margin-top:40px;}
.fn-bloco h2,.fn-voce h2{font-size:1.3rem;color:var(--ink);margin-bottom:14px;line-height:1.25;}

.fn-check{list-style:none;padding:0;display:grid;gap:10px;}
.fn-check li{
  position:relative;padding:12px 14px 12px 44px;border:1px solid var(--line-soft);
  border-radius:var(--r);background:var(--surface);color:var(--ink-2);line-height:1.5;
}
.fn-check li::before{
  content:"\f00c";font-family:"Font Awesome 6 Free";font-weight:900;
  position:absolute;left:14px;top:12px;width:20px;height:20px;border-radius:50%;
  display:flex;align-items:center;justify-content:center;font-size:.7rem;
  background:var(--teal-soft);color:var(--teal);
}

.fn-voce{
  margin-top:28px;padding:16px 18px;border-left:4px solid var(--accent);
  border-radius:var(--r-sm);background:var(--accent-soft);
}
.fn-voce h2{font-size:1.05rem;margin-bottom:6px;}
.fn-voce p{color:var(--ink-2);line-height:1.55;}

.fn-comp{width:100%;border-collapse:separate;border-spacing:0;border:1px solid var(--line);border-radius:var(--r);overflow:hidden;background:var(--surface);}
.fn-comp th,.fn-comp td{padding:12px 14px;text-align:left;vertical-align:top;line-height:1.45;font-size:.95rem;}
.fn-comp thead th{background:var(--paper-2);color:var(--ink);font-size:.82rem;letter-spacing:.03em;text-transform:uppercase;}
.fn-comp tbody td{border-top:1px solid var(--line-soft);color:var(--body);}
.fn-comp tbody td + td{color:var(--ink);font-weight:600;}

.fn-pagina .aj-acoes{margin-top:32px;display:flex;flex-wrap:wrap;gap:10px;}

.fn-leia ul{list-style:none;padding:0;display:grid;gap:8px;}
.fn-leia li{color:var(--ink-2);}
.fn-leia a{color:var(--accent);text-underline-offset:3px;}
.fn-tag{
  display:inline-block;margin-right:6px;padding:2px 8px;border-radius:var(--r-pill);
  background:var(--paper-2);font-size:.72rem;font-weight:700;color:var(--muted);
  text-transform:uppercase;letter-spacing:.04em;
}

.fn-cards{list-style:none;padding:0;display:grid;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:14px;}
.fn-card{
  display:flex;flex-direction:column;gap:6px;height:100%;padding:16px;
  border:1px solid var(--line);border-radius:var(--r);background:var(--surface);
  text-decoration:none;transition:transform .15s ease,box-shadow .15s ease,border-color .15s ease;
}
.fn-card:hover{transform:translateY(-2px);box-shadow:var(--sh-2);border-color:#CBD3E8;}
.fn-card-area{font-size:.72rem;font-weight:700;letter-spacing:.05em;text-transform:uppercase;color:var(--muted);}
.fn-card-t{font-weight:700;color:var(--ink);line-height:1.3;}
.fn-card-d{font-size:.88rem;color:var(--body);line-height:1.45;}
.fn-todas{margin-top:16px;}
.fn-todas a{color:var(--accent);font-weight:600;}
.fn-atual{margin-top:40px;font-size:.82rem;color:var(--muted);}

@media (max-width:640px){
  .fn-comp thead{display:none;}
  .fn-comp,.fn-comp tbody,.fn-comp tr,.fn-comp td{display:block;width:100%;}
  .fn-comp tr + tr{border-top:1px solid var(--line);}
  .fn-comp tbody td{border-top:0;padding:10px 14px;}
  .fn-comp td::before{content:attr(data-rot);display:block;font-size:.72rem;font-weight:700;text-transform:uppercase;letter-spacing:.04em;color:var(--muted);margin-bottom:2px;}
}
@media (prefers-reduced-motion:reduce){.fn-card{transition:none;}}