/* ============================================================ Arbflow — design system (base: cafezall "portal"), multi-site. Estrutura, tipografia e espaçamento do cafezall; as DUAS cores de marca (--acc-dark estrutural + --acc acento/CTA) vêm da Settings de cada site (injetadas no ). Nada de café aqui. Tipografia: Manrope (sans) + Zilla Slab (display/logo). ============================================================ */ :root { /* --- marca (sobrescritas por site via wp_head) --- */ --acc: #2f7fb8; /* acento / CTA primário */ --acc-deep: color-mix(in srgb, var(--acc) 84%, #000); /* estados pressed/hover — derivado */ --acc-dark: #1f2933; /* tinta estrutural: réguas, avatar, CTA inline, links */ --acc-text: var(--acc); /* acento p/ rótulos pequenos */ --btn2: var(--acc); /* botão secundário (borda + texto) — independente do header */ --hd-bg: #1f2933; /* fundo do cabeçalho */ --hd-text: #ffffff; /* cor da letra do cabeçalho */ --ft-bg: #1f2933; /* fundo do rodapé */ --ft-text: #ffffff; /* cor da letra do rodapé */ /* --- neutros (fixos) --- */ --ink: #1b1b1b; --text: #33332f; --muted: #767676; --faint: #9a9a9a; --line: #ededed; --bg: #ffffff; --box: #f5f6f8; /* caixas (resumo/autor) — neutro claro */ --box-line: #e7eaed; --pill: #f1f3f5; --wrapw: 1100px; --readw: 680px; --gutter: clamp(18px, 4vw, 24px); /* respiro lateral mínimo dos wrappers */ --h1-scale: 1; /* multiplicador do tamanho do H1 (Settings → Arbflow) */ /* Tipografia da marca: Inter no corpo, Montserrat nos títulos e no logo. --slab mantém o nome por compatibilidade, mas hoje é a fonte de display. */ --sans: "Inter", system-ui, -apple-system, "Segoe UI", Roboto, Helvetica, Arial, sans-serif; --slab: "Montserrat", system-ui, -apple-system, "Segoe UI", Roboto, Helvetica, Arial, sans-serif; } /* Títulos em Montserrat (manual da marca: headline SemiBold). */ h1, h2, h3, .cz-lp h1, .cz-lp-sec h2, .cz-lp-close h2, .cz-article-body > h2, .cz-section-head h2, .arbflow-feed-item h2 { font-family: var(--slab); } /* ---------- Base ---------- */ .arbflow { color: var(--text); background: var(--bg); font-family: var(--sans); font-size: 16px; line-height: 1.6; -webkit-font-smoothing: antialiased; } .arbflow h1, .arbflow h2, .arbflow h3, .arbflow h4 { font-family: var(--slab); /* Montserrat — manual da marca */ color: var(--ink); font-weight: 700; line-height: 1.15; letter-spacing: -0.01em; margin: 0; } .cz-wrap { width: min(var(--wrapw), calc(100% - 40px)); margin-inline: auto; } /* selo de editoria / kicker */ .cz-cat { display: inline-block; font-size: 0.72rem; font-weight: 700; letter-spacing: 0.04em; color: var(--acc-text); text-transform: uppercase; text-decoration: none; } /* ---------- Corpo editorial espaçado (guides / conteúdo) ---------- */ .cz-article-body { max-width: calc(var(--readw) + 2 * var(--gutter)); box-sizing: border-box; padding: 4px var(--gutter) 0; margin-inline: auto; } /* H1 do post de FUNIL: vem dentro do conteudo (nao do template), entao nao era alcancado por .cz-post-title e ficava no default do navegador (2em fixo), ignorando o h1_scale das Settings. Mesma formula do titulo editorial. */ .cz-article-body > h1 { font-size: calc(clamp(1.75rem, 4.4vw, 2.1rem) * var(--h1-scale)); line-height: 1.15; color: var(--ink); margin: 0 0 20px; } /* Texto justificado (pedido do cliente). A hifenizacao e obrigatoria junto: sem ela, justificar numa coluna estreita de mobile abre rios de espaco entre as palavras. O lang="es" do faz o navegador hifenizar em espanhol. text-wrap:pretty evita linha orfa com uma palavra so. */ .cz-article-body > p, .cz-article-body > ul li, .cz-article-body > ol li, .cz-lp-sec p, .cz-resumo p { text-align: justify; text-justify: inter-word; hyphens: auto; -webkit-hyphens: auto; text-wrap: pretty; } .cz-article-body > p { font-size: 1.06rem; line-height: 1.78; color: var(--text); margin: 16px 0 0; } .cz-article-body > h2 { font-size: clamp(1.3rem, 3vw, 1.45rem); margin: 30px 0 0; line-height: 1.2; } .cz-article-body > h3 { font-size: 1.18rem; margin: 24px 0 0; } .cz-article-body > ul, .cz-article-body > ol { font-size: 1.04rem; line-height: 1.75; margin: 14px 0 0; padding-left: 1.3rem; } .cz-article-body li { margin: 6px 0 0; } .cz-article-body img { max-width: 100%; height: auto; border-radius: 12px; } /* Tabelas de conteúdo: rolagem horizontal própria — tabela larga NUNCA expande a viewport (5+ colunas num celular de 360px estouravam o layout; o resto da página ficava com faixa branca). */ .cz-article-body table, .cz-lp table { display: block; width: 100%; max-width: 100%; overflow-x: auto; -webkit-overflow-scrolling: touch; border-collapse: collapse; margin: 24px 0 4px; font-size: 0.96rem; line-height: 1.5; } .cz-article-body th, .cz-article-body td { border: 1px solid var(--line); padding: 10px 12px; text-align: left; vertical-align: top; } .cz-article-body thead th { background: var(--box); font-weight: 800; color: var(--ink); } .cz-article-body tbody tr:nth-child(even) { background: #fafafa; } .cz-article-body a:not(.cz-lp-btn):not(.cz-lp-inline-cta) { color: var(--acc-dark); text-decoration: underline; text-decoration-color: var(--acc); text-underline-offset: 2px; } .cz-article-body a:not(.cz-lp-btn):not(.cz-lp-inline-cta):hover { color: var(--acc-text); } /* botões e cards nunca sublinham — padrão do site */ .cz-lp-btn, .cz-exit, .cz-lp-inline-cta, .cz-cross a, .cz-navcards a, .cz-altcards a, .cz-side-item, .cz-feed-item, .cz-card, .cz-menu a, .cz-legal-links a, .cz-pill { text-decoration: none !important; } /* título de post/arquivo (single, busca, archive) */ .cz-post-title { font-size: calc(clamp(1.75rem, 4.4vw, 2.1rem) * var(--h1-scale)); line-height: 1.15; color: var(--ink); margin: 0 0 20px; } .entry-content > p { font-size: 1.06rem; line-height: 1.78; margin: 16px 0 0; } /* listagem simples (fallback) */ .arbflow-feed-item { padding: 20px 0; border-bottom: 1px solid var(--line); } .arbflow-feed-item h2 { font-size: 1.25rem; margin: 0; } .arbflow-feed-item h2 a { color: var(--ink); text-decoration: none; } .arbflow-feed-item h2 a:hover { color: var(--acc-text); } .arbflow-feed-ex { margin: 8px 0 0; color: var(--muted); font-size: 0.98rem; line-height: 1.6; } /* ============================================================ Home / portal de notícias — imagens destacadas nas listagens (nunca dentro do post). Também usado em "posts recomendados". ============================================================ */ .cz-home { padding: 24px 0 8px; } .cz-ph { background: var(--box); } /* LCP: adia a renderização das seções abaixo da dobra na home */ .cz-home-page .cz-section, .cz-home-page .cz-pills-wrap { content-visibility: auto; contain-intrinsic-size: auto 420px; } .cz-featured { display: grid; grid-template-columns: 1.6fr 1fr; gap: 26px; } .cz-featured--solo { grid-template-columns: 1fr; } .cz-featured--solo .cz-feat-media, .cz-featured--solo .cz-feat-media img { height: 340px; } .cz-feat-media, .cz-feat-media img { width: 100%; height: 300px; object-fit: cover; border-radius: 14px; display: block; } .cz-feat-cat { margin-top: 14px; } .cz-feat-title { margin: 7px 0 0; font-size: clamp(1.5rem, 5vw, 1.9rem); line-height: 1.12; color: var(--ink); } .cz-feat-title a { color: inherit; text-decoration: none; } .cz-feat-dek { margin: 8px 0 0; font-size: 1rem; line-height: 1.55; color: #5e5e5e; } .cz-meta-line { margin-top: 10px; font-size: 0.8rem; font-weight: 600; color: var(--faint); } .cz-feat-side { display: flex; flex-direction: column; gap: 16px; } .cz-side-item { display: flex; gap: 13px; text-decoration: none; } .cz-side-item + .cz-side-item { border-top: 1px solid var(--line); padding-top: 14px; } .cz-side-thumb, .cz-side-thumb img { width: 100px; height: 74px; flex: none; object-fit: cover; border-radius: 10px; } .cz-side-title { margin: 4px 0 0; font-size: 0.95rem; line-height: 1.22; font-weight: 700; color: var(--ink); } .cz-section { padding: 26px 0 4px; } .cz-section-head { display: flex; align-items: center; justify-content: space-between; border-bottom: 2px solid var(--acc-dark); padding-bottom: 8px; margin-bottom: 18px; } .cz-section-head h2 { font-size: 1.15rem; font-weight: 800; color: var(--ink); margin: 0; } .cz-section-more { font-size: 0.8rem; font-weight: 700; color: var(--acc-text); text-decoration: none; } .cz-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 230px), 1fr)); gap: 20px 20px; } .cz-archive-grid { margin-top: 24px; } .cz-archive-desc { margin: 8px 0 0; color: var(--muted); font-size: 1rem; line-height: 1.6; max-width: var(--readw); } .cz-card { text-decoration: none; display: block; } .cz-card-media, .cz-card-media img { width: 100%; height: 160px; object-fit: cover; border-radius: 12px; display: block; } .cz-card .cz-cat { margin-top: 11px; } .cz-card-title { margin: 3px 0 0; font-size: 1rem; line-height: 1.24; font-weight: 700; color: var(--ink); } .cz-card-meta { margin-top: 6px; font-size: 0.78rem; font-weight: 600; color: var(--faint); } .cz-feed { margin: 0; } .cz-feed-item { display: flex; gap: 14px; padding: 15px 0; border-bottom: 1px solid var(--line); text-decoration: none; } .cz-feed-item:last-child { border-bottom: none; } .cz-feed-thumb, .cz-feed-thumb img { width: 104px; height: 78px; flex: none; object-fit: cover; border-radius: 10px; } .cz-feed-title { margin: 3px 0 0; font-size: 0.98rem; line-height: 1.25; font-weight: 700; color: var(--ink); } .cz-feed-meta { margin-top: 5px; font-size: 0.74rem; font-weight: 600; color: var(--faint); } .cz-pills-wrap { padding: 22px 0 28px; } .cz-pills-label { font-size: 0.82rem; font-weight: 700; color: var(--ink); margin-bottom: 10px; } @media (max-width: 880px) { .cz-featured { grid-template-columns: 1fr; gap: 18px; } .cz-feat-media, .cz-feat-media img { height: 220px; } .cz-feat-title { font-size: 1.5rem; } } /* parágrafo lead (abre a guia antes do 1º anúncio) */ /* subtítulo (dek) — espaçamento e estilo padrão, vence .cz-article-body > p */ .cz-lead, .cz-article-body .cz-lead { margin: 16px 0 0; font-size: 1rem; line-height: 1.6; color: var(--muted); } /* cross-CTA para guias irmãs do cluster */ .cz-cross { margin: 30px 0 0; padding: 16px 18px; background: var(--box); border: 1px solid var(--box-line); border-left: 3px solid var(--acc); border-radius: 12px; } .cz-cross-label { display: block; font-size: 0.74rem; font-weight: 800; letter-spacing: 0.05em; text-transform: uppercase; color: var(--acc-text); margin-bottom: 6px; } .cz-cross ul { list-style: none; margin: 0; padding: 0; } .cz-cross li { margin: 8px 0 0; } .cz-cross a { display: inline-flex; align-items: center; gap: 8px; font-weight: 700; font-size: 1rem; line-height: 1.3; color: var(--acc-dark); text-decoration: none; } .cz-cross a svg { width: 18px; height: 18px; flex: none; color: var(--acc); } /* ============================================================ Componentes de guia/funil (padronização de páginas legadas): passos, figuras, checklist, boxes, cards de navegação e cross-sell. Usam os tokens da marca (--acc / --acc-dark). ============================================================ */ /* passos numerados (círculo + linha vertical) */ .cz-steps { counter-reset: s; list-style: none; padding-left: 0; margin: 16px 0; } .cz-steps > li { counter-increment: s; position: relative; padding: 0 0 16px 46px; margin: 0; line-height: 1.6; } .cz-steps > li::before { content: counter(s); position: absolute; left: 0; top: 0; width: 30px; height: 30px; border-radius: 50%; background: var(--acc-dark); color: #fff; font-weight: 700; font-size: 0.95rem; display: flex; align-items: center; justify-content: center; } .cz-steps > li:not(:last-child)::after { content: ""; position: absolute; left: 14px; top: 34px; bottom: 2px; width: 2px; background: var(--line); } .cz-steps > li b, .cz-steps > li strong { color: var(--acc-dark); } /* passo visual (título numerado + figura) */ .cz-vstep { margin: 26px 0; } .cz-vstep h3 { font-size: 1.06rem; font-weight: 800; color: var(--ink); margin: 0 0 8px; display: flex; align-items: center; gap: 9px; } .cz-vstep h3 .n { flex: none; width: 28px; height: 28px; border-radius: 50%; background: var(--acc-dark); color: #fff; font-size: 0.9rem; display: inline-flex; align-items: center; justify-content: center; } .cz-fig { margin: 12px 0 4px; border: 1px solid var(--line); border-radius: 12px; overflow: hidden; } .cz-fig svg, .cz-fig img { display: block; width: 100%; height: auto; } .cz-figcap { font-size: 0.76rem; color: var(--muted); text-align: center; padding: 7px 10px; background: var(--box); border-top: 1px solid var(--line); margin: 0; } /* checklist com ícone */ .cz-check { list-style: none; padding: 0; margin: 16px 0; } .cz-check li { display: flex; gap: 12px; align-items: flex-start; padding: 11px 14px; border: 1px solid var(--line); border-radius: 10px; margin: 8px 0; background: var(--box); } .cz-check .ic { flex: none; font-size: 1.25rem; line-height: 1.4; } .cz-check b, .cz-check strong { color: var(--acc-dark); } /* box suave (destaque neutro) e aviso (amber) */ .cz-box { background: var(--box); border: 1px solid var(--box-line); border-left: 4px solid var(--acc); border-radius: 10px; padding: 14px 18px; margin: 18px 0; font-size: 0.98rem; } .cz-warn { background: #fff8ec; border: 1px solid #e7c66b; border-radius: 10px; padding: 12px 16px; margin: 18px 0; font-size: 0.95rem; } /* link oficial inline */ .cz-ext { color: var(--acc); font-weight: 600; text-decoration: underline; text-underline-offset: 2px; text-decoration-thickness: 1.5px; } /* cards de navegação (guias irmãs / relacionados internos) */ .cz-navcards { margin: 28px 0 0; } .cz-navcards-t { font-size: 1.1rem; font-weight: 800; color: var(--ink); margin: 0 0 10px; } .cz-navcards a { position: relative; display: block; text-decoration: none; border: 1.5px solid var(--line); border-radius: 12px; padding: 12px 42px 12px 14px; margin: 8px 0; color: var(--text); } .cz-navcards .ntx { display: block; } .cz-navcards .nt { display: block; font-weight: 700; color: var(--acc); font-size: 0.98rem; line-height: 1.25; } .cz-navcards .ns { display: block; color: var(--muted); font-size: 0.82rem; line-height: 1.3; margin-top: 1px; } .cz-navcards .nch { position: absolute; right: 14px; top: 50%; transform: translateY(-50%); color: var(--acc); font-size: 1.25rem; font-weight: 700; line-height: 1; } /* cross-sell cards com ícone colorido (LP .alt) */ .cz-altcards { margin: 32px 0 8px; } .cz-altcards-t { font-size: 1.12rem; font-weight: 800; color: var(--ink); margin: 0 0 4px; } .cz-altcards-s { font-size: 0.92rem; color: var(--muted); margin: 0 0 12px; } .cz-altcards a { display: flex; align-items: center; gap: 13px; text-decoration: none; border: 1.5px solid var(--line); border-radius: 14px; padding: 14px 16px; margin: 10px 0; color: var(--ink); } .cz-altcards .ic { flex: none; width: 40px; height: 40px; border-radius: 11px; display: flex; align-items: center; justify-content: center; font-size: 1.25rem; color: #fff; font-weight: 700; background: var(--acc); } .cz-altcards .ic.i-sacar { background: #2fa37a; } .cz-altcards .ic.i-imprimir { background: #6d5bd0; } .cz-altcards .ic.i-consultar { background: var(--acc); } .cz-altcards .tx { flex: 1; min-width: 0; } .cz-altcards .alt-t { display: block; font-weight: 700; color: var(--ink); } .cz-altcards .alt-s { display: block; color: var(--muted); font-size: 0.9rem; margin-top: 1px; } /* variante preenchida (hub em destaque): botões com fundo colorido */ .cz-altcards.is-solid a { background: var(--acc); border-color: transparent; color: #fff; box-shadow: 0 8px 20px -10px color-mix(in srgb, var(--acc) 60%, transparent); } .cz-altcards.is-solid a:has(.i-imprimir) { background: #6d5bd0; box-shadow: 0 8px 20px -10px rgba(109,91,208,.6); } .cz-altcards.is-solid a:has(.i-sacar) { background: #2fa37a; box-shadow: 0 8px 20px -10px rgba(47,163,122,.6); } .cz-altcards.is-solid .ic { background: rgba(255,255,255,.22) !important; color: #fff; } .cz-altcards.is-solid .alt-t { color: #fff; } .cz-altcards.is-solid .alt-s { color: rgba(255,255,255,.85); } .cz-altcards.is-solid .nch { color: #fff; } /* caixa de resumo / destaque */ .cz-resumo { background: var(--box); border: 1px solid var(--box-line); border-radius: 12px; padding: 18px 20px; margin: 24px 0 0; } .cz-resumo-label { font-size: 0.72rem; font-weight: 800; letter-spacing: 0.04em; color: var(--acc-text); text-transform: uppercase; } .cz-resumo p { margin: 8px 0 0; font-size: 1.02rem; line-height: 1.7; color: var(--text); } /* botão de saída p/ link externo oficial (na guia) — destaque */ .cz-exit-box { margin: 26px 0 0; } .cz-exit-label { display: block; font-size: 0.78rem; font-weight: 700; letter-spacing: 0.04em; text-transform: uppercase; color: var(--acc-text); margin-bottom: 8px; } .cz-exit { display: flex; align-items: center; justify-content: center; gap: 10px; width: 100%; box-sizing: border-box; background: var(--acc); color: #fff !important; font-weight: 800; font-size: 1.06rem; line-height: 1.2; padding: 16px 20px; border-radius: 14px; text-decoration: none !important; text-align: center; box-shadow: 0 12px 26px -12px color-mix(in srgb, var(--acc) 65%, transparent); touch-action: manipulation; } .cz-exit svg { width: 20px; height: 20px; flex: none; } .cz-exit-note { margin: 8px 0 0; font-size: 0.8rem; color: var(--faint); } /* pílulas de tema */ .cz-pills { display: flex; flex-wrap: wrap; gap: 9px; } .cz-pill { font-size: 0.84rem; font-weight: 600; background: var(--pill); color: var(--text); border-radius: 20px; padding: 8px 16px; text-decoration: none; } .cz-pill:hover, .cz-pill--all { background: var(--acc-dark); color: #fff; } /* ---------- Componentes editoriais ---------- */ .arbflow-legal, .cafezall-summary-box, .cafezall-start-here, .cafezall-internal-links, .cafezall-author-box { background: var(--box); border: 1px solid var(--box-line); border-radius: 12px; padding: 18px 20px; margin: 22px 0; } .cafezall-summary-box strong, .cafezall-start-here strong, .cafezall-internal-links strong, .cafezall-author-box strong { display: block; margin-bottom: 8px; font-weight: 800; color: var(--ink); } .cafezall-summary-box a, .cafezall-start-here a, .cafezall-internal-links a { color: var(--acc-dark); text-decoration: underline; text-decoration-color: var(--acc); } /* card de autor (avatar + nome + bio) — fim do conteúdo */ .cafezall-author-box { display: flex; gap: 15px; align-items: center; } .cafezall-author-box .av { flex: none; width: 56px; height: 56px; border-radius: 50%; background: var(--acc-dark); color: #fff; display: flex; align-items: center; justify-content: center; font-weight: 800; font-size: 1.15rem; overflow: hidden; } .cafezall-author-box .av img { width: 100%; height: 100%; object-fit: cover; border-radius: 50%; } .cafezall-author-box .role { font-size: 0.72rem; font-weight: 700; letter-spacing: 0.05em; text-transform: uppercase; color: var(--acc-text); } .cafezall-author-box strong { margin: 0 0 2px; } .cafezall-author-box p { margin: 3px 0 0; font-size: 0.9rem; color: var(--muted); line-height: 1.5; } /* FAQ */ .cafezall-faq { border: 1px solid var(--line); border-radius: 12px; padding: 2px 18px; margin: 14px 0; } .cafezall-faq details { border-bottom: 1px solid var(--line); padding: 14px 0; } .cafezall-faq details:last-child { border-bottom: none; } .cafezall-faq summary { cursor: pointer; font-weight: 700; color: var(--ink); list-style: none; } .cafezall-faq summary::-webkit-details-marker { display: none; } .cafezall-faq p { margin: 10px 0 0; color: var(--muted); font-size: 0.96rem; line-height: 1.6; } /* disclaimer impresso por arbflow_legal() */ .arbflow-legal { font-size: 0.86rem; color: var(--muted); line-height: 1.55; } .arbflow-legal a { color: var(--acc-text); } /* ============================================================ Funil (LP / chooser) — herdado do cafezall .cz-lp ============================================================ */ .cz-lp { max-width: calc(600px + 2 * var(--gutter)); box-sizing: border-box; padding-inline: var(--gutter); margin-inline: auto; } .cz-lp a { text-decoration: none !important; } .cz-lp-hero { padding-top: 6px; } .cz-lp-hero h1, .cz-lp > h1:first-child { margin: 0; font-size: calc(clamp(1.5rem, 5.4vw, 2rem) * var(--h1-scale)); line-height: 1.16; color: var(--ink); } .cz-lp-dek { margin: 18px 0 0; font-size: 1.08rem; line-height: 1.5; color: #5b5f56; } /* listas no corpo do funil + benefícios com check */ .cz-lp-sec ul, .cz-lp-sec ol { margin: 12px 0 0; padding-left: 1.25rem; } .cz-lp-sec li { margin: 6px 0 0; font-size: 1.02rem; line-height: 1.65; } .cz-lp-benefits { list-style: none; margin: 18px 0 0; padding: 0; } .cz-lp-benefits li { position: relative; padding-left: 28px; margin: 10px 0 0; font-size: 1.02rem; line-height: 1.5; color: var(--text); } .cz-lp-benefits li::before { content: "✓"; position: absolute; left: 0; top: 0; color: var(--acc); font-weight: 800; } .cz-lp-ctas { display: flex; flex-direction: column; gap: 12px; margin: 34px 0 0; } .cz-lp-btn { display: flex; align-items: center; gap: 12px; background: #fff; border: 1.5px solid var(--btn2); border-radius: 14px; padding: 15px 16px; color: var(--btn2) !important; } .cz-lp-btn:hover { background: var(--box); } .cz-lp-btn--primary { background: var(--acc); border-color: var(--acc); color: #fff !important; } .cz-lp-btn--primary:hover { background: var(--acc-deep); } .cz-lp-btn__ic { flex: none; width: 40px; height: 40px; border-radius: 50%; display: flex; align-items: center; justify-content: center; background: var(--box); color: var(--btn2); } .cz-lp-btn--primary .cz-lp-btn__ic { background: rgba(255, 255, 255, 0.22); color: #fff; } .cz-lp-btn__ic svg { width: 22px; height: 22px; } .cz-lp-btn__tx { flex: 1; font-weight: 700; font-size: 1rem; line-height: 1.2; } .cz-lp-btn__ch { flex: none; width: 22px; height: 22px; } .cz-lp-more { margin: 16px 0 0; text-align: center; font-size: 0.86rem; color: var(--faint); } .cz-lp-sec { margin: 38px 0 0; } .cz-lp-sec h2 { font-size: clamp(1.25rem, 4.4vw, 1.5rem); line-height: 1.2; color: var(--ink); margin: 0; } .cz-lp-sec p { font-size: 1.05rem; line-height: 1.72; color: var(--text); margin: 12px 0 0; } .cz-lp-inline-cta { display: inline-flex; align-items: center; gap: 8px; margin-top: 16px; background: var(--acc-dark); color: #fff !important; border-radius: 100px; padding: 11px 20px; font-weight: 700; font-size: 0.98rem; text-decoration: none; } .cz-lp-inline-cta:hover { background: #000; } .cz-lp-inline-cta svg { width: 18px; height: 18px; flex: none; } .cz-lp-close { margin-top: 34px; padding-top: 22px; border-top: 2px solid var(--acc-dark); } .cz-lp-close h2 { font-size: 1.2rem; color: var(--ink); margin: 0 0 4px; } /* ---------- Conteúdo entre header e footer ---------- */ .arbflow-main { padding: 8px 0 44px; } /* (Removido o fix do plugin Safelayout Cute Preloader: herdado do projeto MX, o plugin nao existe neste site.) */ .cz-skip { position: absolute; left: -9999px; top: 0; z-index: 100; background: #fff; color: var(--acc-dark); font-weight: 700; padding: 10px 16px; border-radius: 8px; } .cz-skip:focus { left: 8px; top: 8px; } /* ---------- Header (curto: logo esq · menu+busca dir) ---------- */ .cz-header { position: relative; background: var(--hd-bg); border-bottom: 1px solid color-mix(in srgb, var(--hd-text) 14%, transparent); } .cz-header-inner { display: flex; align-items: center; gap: 16px; min-height: 44px; } .cz-logo { display: inline-flex; align-items: center; font-family: var(--slab); font-weight: 700; font-size: 1.05rem; color: var(--hd-text); text-decoration: none; line-height: 1; } .cz-logo img { display: block; height: auto; max-height: 26px; width: auto; } .cz-burger { display: none; margin-left: auto; width: 40px; height: 40px; background: none; border: 0; cursor: pointer; flex-direction: column; align-items: center; justify-content: center; gap: 4px; } .cz-burger span { display: block; width: 20px; height: 2px; background: var(--hd-text); border-radius: 2px; transition: transform .2s, opacity .2s; } .cz-header.is-open .cz-burger span:nth-child(1) { transform: translateY(6px) rotate(45deg); } .cz-header.is-open .cz-burger span:nth-child(2) { opacity: 0; } .cz-header.is-open .cz-burger span:nth-child(3) { transform: translateY(-6px) rotate(-45deg); } .cz-nav-wrap { display: flex; align-items: center; gap: 18px; margin-left: auto; } .cz-menu { display: flex; gap: 20px; margin: 0; padding: 0; list-style: none; } .cz-menu a { color: var(--hd-text); font-weight: 700; font-size: 0.9rem; text-decoration: none; -webkit-tap-highlight-color: transparent; } /* sem estado colado no toque (mobile): hover/focus/active não mudam a cor */ .cz-menu a:hover, .cz-menu a:focus, .cz-menu a:active { color: var(--hd-text); } .cz-menu .current-menu-item > a, .cz-menu .current-menu-item > a:hover { color: var(--acc); } .cz-burger, .cz-subtoggle, .cz-search button { -webkit-tap-highlight-color: transparent; } /* mata o fundo/estado colado que o tema-pai aplica a