/* ════════════════════════════════════════════════════════════════════
   TOKENS (paleta de cores + famílias) — home 26/08
   ════════════════════════════════════════════════════════════════════ */
:root {
	--c-orange: #ff8200;
	--c-red:    #e15500;
	--c-dark:   #141d2d;
	--c-yellow: #ffdd00;
	--c-gray:   #71878e;
	--c-muted:  #a6b2b6;
	--c-white:  #fff;
	--ff-head:  'Raleway', sans-serif;
	--ff-body:  'Lato', sans-serif;
}

/* ── Helpers do design system (mockup) ── */
.fil-card-hover { transition: box-shadow .25s ease, transform .25s ease; }
.fil-card-hover:hover { box-shadow: 0 12px 30px rgba(20,29,45,0.16); transform: translateY(-3px); }
.fil-link:hover { color: var(--c-red) !important; }
h3.fil-link, h4.fil-link { color: var(--c-orange) !important; }
.hero-feature-title { color: var(--c-white) !important; }
.fil-nosb::-webkit-scrollbar { display: none; }
.fil-nosb { scrollbar-width: none; }

/* Faz botões laranja escurecerem no hover, como no mockup */
.fil-btn-orange:hover { background: var(--c-red) !important; }
.fil-btn-dark:hover   { background: #0c1320 !important; }

/* Carrosséis: slides empilhados */
.fil-slide { display: none; }
.fil-slide.is-active { display: block; }

/* Abas */
.fil-tab-panel { display: none; }
.fil-tab-panel.is-active { display: block; }

/* Corrige overflow horizontal */
body { overflow-x: hidden; }
img { max-width: 100%; }

/* ════════════════════════════════════════════════════════════════════
   UTILITÁRIOS — fonte e cor
   ════════════════════════════════════════════════════════════════════ */

/* Famílias */
.ff-head { font-family: var(--ff-head); }
.ff-body { font-family: var(--ff-body); }

/* Tamanhos de fonte (escala fixa) */
.fs-6  { font-size: 6px; }
.fs-10 { font-size: 10px; }
.fs-12 { font-size: 12px; }
.fs-14 { font-size: 14px; }
.fs-18 { font-size: 18px; }
.fs-22 { font-size: 22px; }
.fs-26 { font-size: 26px; }
.fs-28 { font-size: 28px; }
.fs-32 { font-size: 32px; }
.fs-44 { font-size: 44px; }
.fs-58 { font-size: 58px; }

/* Pesos */
.fw-300 { font-weight: 300; }
.fw-400 { font-weight: 400; }
.fw-700 { font-weight: 700; }
.fw-800 { font-weight: 800; }
.fw-900 { font-weight: 900; }

/* Cores de texto */
.c-white  { color: var(--c-white); }
.c-orange { color: var(--c-orange); }
.c-red    { color: var(--c-red); }
.c-dark   { color: var(--c-dark); }
.c-yellow { color: var(--c-yellow); }
.c-gray   { color: var(--c-gray); }
.c-muted  { color: var(--c-muted); }

/* ════════════════════════════════════════════════════════════════════
   COMPONENTES — estilos inline repetidos (home 26/08)
   ════════════════════════════════════════════════════════════════════ */

/* ── Largura máxima do container ── */
.fil-container    { max-width: 1200px; }
.fil-container-sm { max-width: 760px; }

/* ── Empilhamento vertical (coluna) ── */
.fil-vstack { display: flex; flex-direction: column; gap: 16px; }

/* ── Imagem que cobre o bloco pai (posicionado) ── */
.fil-cover { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }

/* ── Texto de data / meta ── */
.fil-meta { font-size: 12px; color: var(--c-muted); font-weight: 700; }

/* ── Linha de artigo (thumb + texto) ── */
.fil-article-link  { display: flex; gap: 12px; align-items: flex-start; text-decoration: none; }
.fil-article-title { font-family: var(--ff-head); font-weight: 600; font-size: 14px; line-height: 1.3; color: var(--c-orange); margin: 0 0 4px; }

/* ── Barra de busca ── */
.fil-search       { display: flex; border: 2px solid var(--c-orange); border-radius: 50px; overflow: hidden; background: #fff; }
.fil-search-input { flex: 1; border: none; outline: none; font-family: var(--ff-body); font-size: 14px; color: var(--c-dark); padding: 12px 24px; background: transparent; }
.fil-search-btn   { background: var(--c-orange); color: #fff; border: none; font-family: var(--ff-body); font-weight: 700; font-size: 14px; padding: 0 30px; cursor: pointer; display: inline-flex; align-items: center; gap: 8px; }

/* ── Campo de formulário (newsletter) ── */
.fil-input { flex: 1 1 180px; min-width: 0; border: none; border-radius: 6px; font-family: var(--ff-body); font-size: 14px; color: var(--c-dark); padding: 12px 16px; outline: none; }

/* ── Abas (Notícias / Corporativas) ── */
.fil-tab-btn { background: transparent; border: none; cursor: pointer; font-family: var(--ff-body); font-size: 14px; padding: 12px 4px; color: var(--c-gray); font-weight: 400; border-bottom: 3px solid transparent; }
.fil-tab-btn.is-active { color: var(--c-orange); font-weight: 700; border-bottom-color: var(--c-orange); }

/* ── Carrossel: setas e indicadores ── */
.fil-carousel-arrow { position: absolute; top: 50%; transform: translateY(-50%); width: 38px; height: 38px; border-radius: 50%; border: none; background: rgba(255,255,255,.85); color: var(--c-dark); cursor: pointer; z-index: 3; }
.fil-carousel-dots  { position: absolute; bottom: 12px; left: 50%; transform: translateX(-50%); display: flex; gap: 8px; z-index: 3; }

/* ── Botão redondo translúcido (setas das videoaulas) ── */
.fil-round-btn { width: 34px; height: 34px; border-radius: 50%; border: 1px solid rgba(255,255,255,.55); background: rgba(255,255,255,.15); color: #fff; cursor: pointer; }

/* ── Selo "Informe Parceiro Financiador" ── */
.fil-tag { display: inline-block; color: #fff; font-size: 12px; font-weight: 700; letter-spacing: .04em; padding: 4px 16px; border-radius: 50px; margin-bottom: 16px; }

/* ── Título de coluna do rodapé ── */
.fil-footer-head { font-family: var(--ff-head); font-weight: 700; font-size: 12px; letter-spacing: .14em; text-transform: uppercase; color: var(--c-orange); padding-bottom: 12px; margin-bottom: 16px; border-bottom: 1px solid rgba(255,255,255,.1); }

/* ════════════════════════════════════════════════════════════════════
   NAVEGAÇÃO (wp_nav_menu — localização 'menu_vs2027')
   Estiliza a saída nativa do WordPress (ul.fil-menu / li.menu-item /
   ul.sub-menu). Abertura do menu mobile é 100% CSS, sem JS.
   ════════════════════════════════════════════════════════════════════ */

/* ── Desktop: barra horizontal ── */
.fil-nav .fil-menu      { display: flex; align-items: center; gap: 4px; list-style: none; margin: 0; padding: 0; }
.fil-nav .fil-menu li   { position: relative; list-style: none !important; }
.fil-nav .fil-menu > li > a       { display: inline-flex; align-items: center; gap: 8px; font-family: var(--ff-body); font-size: 14px; font-weight: 700; color: var(--c-white) !important; text-decoration: none; padding: 12px 16px; border-radius: 4px; white-space: nowrap; }
.fil-nav .fil-menu > li > a:hover { background: rgba(255,255,255,.14); }

/* Seta: vem do 'link_after' em todos os itens; some nos que não têm filhos */
.fil-nav .fil-caret { font-size: 10px; opacity: .85; }
.fil-nav .fil-menu li:not(.menu-item-has-children) > a .fil-caret { display: none; }

/* ── Desktop: submenu (dropdown) ── */
.fil-nav .sub-menu { display: none; position: absolute; top: 100%; left: 0; min-width: 220px; list-style: none; margin: 0; padding: 8px 0; background: #fff; border-radius: 0 0 8px 8px; box-shadow: 0 12px 30px rgba(20,29,45,.18); overflow: hidden; z-index: 20; }
.fil-nav .fil-menu > li:hover > .sub-menu,
.fil-nav .fil-menu > li:focus-within > .sub-menu { display: block; }
.fil-nav .sub-menu a       { display: block; font-family: var(--ff-body); font-size: 14px; color: var(--c-dark); text-decoration: none; padding: 8px 20px; }
.fil-nav .sub-menu a:hover { color: var(--c-red); }

/* ── Hambúrguer: checkbox invisível, mas navegável por teclado ── */
.fil-nav-check   { position: absolute; width: 1px; height: 1px; opacity: 0; margin: 0; pointer-events: none; }
.fil-nav-burger  { color: var(--c-white); cursor: pointer; font-size: 22px; line-height: 1; padding: 8px; margin: 0; display: inline-flex; align-items: center; }
.fil-nav-check:focus-visible ~ div .fil-nav-burger { outline: 2px solid var(--c-white); outline-offset: 2px; }

/* Troca bars ↔ xmark conforme o estado */
.fil-nav-burger .fil-ico-close { display: none; }
.fil-nav-check:checked ~ div .fil-nav-burger .fil-ico-open  { display: none; }
.fil-nav-check:checked ~ div .fil-nav-burger .fil-ico-close { display: inline-flex; }

/* ── Mobile: painel que abre abaixo do cabeçalho ── */
.fil-nav-mobile { display: none; background: var(--c-red); padding: 8px 0 16px; }
.fil-nav-check:checked ~ .fil-nav-mobile { display: block; }
.fil-nav-mobile ul { list-style: none; margin: 0; padding: 0; }
.fil-nav-mobile a  { display: block; font-family: var(--ff-body); font-size: 14px; font-weight: 700; color: var(--c-white) !important; text-decoration: none; padding: 12px 8px; border-bottom: 1px solid rgba(255,255,255,.16); }
.fil-nav-mobile .sub-menu a { font-weight: 400; padding-left: 24px; }