/* css/tema.css — GERADO por ferramentas/gerar-tema.js. Não edite: edite ferramentas/tema.base.css e rode o gerador. */
/* =============================================================
   tema.base.css — PARTE ESCRITA À MÃO do css/tema.css.

   NÃO publique este arquivo: o que vai para o site é o css/tema.css,
   gerado por `node ferramentas/gerar-tema.js`, que junta este arquivo
   com as regras de modo escuro derivadas do style.css e das páginas.

   Todo o modo escuro vive sob html[data-theme="dark"]. Sem esse atributo
   nada aqui tem efeito, então o tema claro nunca é alterado.
   ============================================================= */

:root { color-scheme: light; }

/* ── Botão de tema ────────────────────────────────────── */
.tema-botao {
  position: relative; flex-shrink: 0;
  width: 44px; height: 44px; border-radius: 50%;
  display: grid; place-items: center; padding: 0;
  margin-right: -1rem;                       /* cola o botão ao CTA, sem estourar o espaçamento do cabeçalho */
  border: 1.5px solid rgba(90, 45, 145, .22);
  background: rgba(255, 255, 255, .72);
  color: #5A2D91; cursor: pointer; overflow: hidden;
  transition: transform .3s cubic-bezier(.22, 1, .36, 1), background-color .3s,
              border-color .3s, color .3s, box-shadow .3s;
  -webkit-tap-highlight-color: transparent;
}
.tema-botao:hover {
  transform: translateY(-2px) rotate(-10deg);
  border-color: #F06423; color: #F06423;
  box-shadow: 0 10px 22px rgba(90, 45, 145, .22);
}
.tema-botao:active { transform: scale(.86); }
.tema-botao:focus-visible { outline: 3px solid #F06423; outline-offset: 3px; }

/* um anel que se expande a cada clique */
.tema-botao::after {
  content: ''; position: absolute; inset: 0; border-radius: 50%;
  border: 2px solid #F06423; opacity: 0; pointer-events: none;
}
.tema-botao--gira::after { animation: tema-anel .65s cubic-bezier(.22, 1, .36, 1); }
@keyframes tema-anel {
  from { transform: scale(.55); opacity: .9; }
  to   { transform: scale(1.5); opacity: 0; }
}

/* lua e sol empilhados: um gira para fora enquanto o outro gira para dentro */
.tema-botao__icone {
  position: absolute; inset: 0; display: grid; place-items: center;
  transition: transform .7s cubic-bezier(.22, 1, .36, 1), opacity .4s;
}
.tema-botao__icone svg { display: block; }
.tema-botao__lua { opacity: 1; transform: rotate(0) scale(1); }
.tema-botao__sol { opacity: 0; transform: rotate(-140deg) scale(.3); }
html[data-theme="dark"] .tema-botao__lua { opacity: 0; transform: rotate(140deg) scale(.3); }
html[data-theme="dark"] .tema-botao__sol { opacity: 1; transform: rotate(0) scale(1); }

/* no celular, empurra o botão e o hambúrguer juntos para a borda direita */
@media (max-width: 768px) { .tema-botao { margin-left: auto; margin-right: .25rem; width: 42px; height: 42px; } }

/* ── Troca animada: círculo que cresce a partir do botão ─ */
/* círculo da cor do novo tema que cresce a partir do botão na troca */
.tema-ink {
  position: fixed; z-index: 2147483000;
  border-radius: 50%; transform: translate(-50%, -50%);
  pointer-events: none; will-change: width, height, opacity;
}

@media (prefers-reduced-motion: reduce) {
  .tema-botao, .tema-botao__icone { transition: none; }
  .tema-botao--gira::after { animation: none; }
}

/* ── Logo: caixa de tamanho fixo nos dois temas, para a marca não "pular" ─
   A colorida (240×120) e a escura (4 laranja) têm proporções diferentes;
   a caixa fixa + object-fit mantêm a posição idêntica ao trocar. */
.nav__logo img { width: 136px; height: 68px; object-fit: contain; object-position: left center; }
.nav__logo-escuro { display: none; }
html[data-theme="dark"] .nav__logo img { display: none; }
html[data-theme="dark"] .nav__logo img.nav__logo-escuro { display: block; }

/* ── Paleta escura ────────────────────────────────────── */
html[data-theme="dark"] {
  color-scheme: dark;
  --t-bg:        #120a20;   /* fundo da página */
  --t-bg-soft:   #160d29;   /* seções alternadas */
  --t-surface:   #22173f;   /* cartões */
  --t-surface-2: #2a1d4c;   /* realces e hover */
  --t-chip:      #33265c;   /* caixas de ícone */
  --t-line:      rgba(255, 255, 255, .11);
  --t-text:      #f3eefb;
  --t-text-2:    #c4b9da;
  --t-text-3:    #9a8fb4;
  --t-accent:    #b99cf2;   /* roxo legível sobre fundo escuro */

  /* o style.css pinta quase tudo por variável: trocar o valor basta */
  --gray-50:  var(--t-bg-soft);
  --gray-100: var(--t-surface-2);
  --gray-200: var(--t-line);
  --gray-400: var(--t-text-3);
  --gray-600: var(--t-text-2);
  --gray-800: #e9e2f6;
  --dark:     var(--t-text);
  --shadow-sm: 0 1px 3px rgba(0, 0, 0, .35);
  --shadow:    0 4px 16px rgba(0, 0, 0, .38);
  --shadow-lg: 0 12px 40px rgba(0, 0, 0, .45);
  --shadow-xl: 0 24px 64px rgba(0, 0, 0, .5);
}

html[data-theme="dark"] body { background: var(--t-bg); }

/* cabeçalho */
html[data-theme="dark"] .header {
  background: rgba(18, 10, 32, .86);
  border-bottom-color: var(--t-line);
}
html[data-theme="dark"] .header.scrolled,
html[data-theme="dark"] .header.encolhido { box-shadow: 0 8px 30px rgba(0, 0, 0, .5); }
html[data-theme="dark"] .nav__link { color: var(--t-text); }
html[data-theme="dark"] .nav__link:hover { color: var(--t-accent); }

/* botão do tema, no escuro */
html[data-theme="dark"] .tema-botao {
  background: rgba(255, 255, 255, .07);
  border-color: rgba(255, 255, 255, .2);
  color: #ffb27a;
}
html[data-theme="dark"] .tema-botao:hover { border-color: #F06423; box-shadow: 0 10px 24px rgba(240, 100, 35, .25); }

/* menu aberto no celular */
@media (max-width: 768px) {
  html[data-theme="dark"] .nav__menu { background: var(--t-bg-soft); }
}

/* rodapé e botão flutuante de contato */
html[data-theme="dark"] .footer { background: #0a0514; border-top: 1px solid var(--t-line); }
html[data-theme="dark"] .whatsapp-float__label { background: #0a0514; }

/* formulários */
html[data-theme="dark"] input,
html[data-theme="dark"] select,
html[data-theme="dark"] textarea { color: var(--t-text); border-color: var(--t-line); }
html[data-theme="dark"] ::placeholder { color: var(--t-text-3); opacity: 1; }

/* tabelas, divisórias e citações herdam as linhas do tema */
html[data-theme="dark"] hr { border-color: var(--t-line); }

/* imagens claras (capturas de tela) perdem um pouco de brilho para não ofuscar */
html[data-theme="dark"] img:not([src*="logo"]):not([src*="LOGO"]):not([src*="icon"]):not([src*="favicon"]) { filter: brightness(.92); }

/* ── Ajustes por componente: cores fixas que as páginas definem sem variável ── */

/* selos de seção e de cartão (fundo pêssego fixo) */
html[data-theme="dark"] .section__tag,
html[data-theme="dark"] .solucao-card__tag { background: rgba(240, 100, 35, .16); color: #ff9d66; }

/* tons de verde (AtendeF4cil, FAQ, GameF4cil) */
html[data-theme="dark"] .af-feature__icon,
html[data-theme="dark"] .af-connect-card__badge--qr,
html[data-theme="dark"] .faq-nav__item--active a,
html[data-theme="dark"] .faq-callout--green,
html[data-theme="dark"] .faq-compare__card--free,
html[data-theme="dark"] .gf-why-item__check { background: rgba(22, 163, 74, .16); }
html[data-theme="dark"] .faq-item[open] summary { background: var(--t-surface-2); }
html[data-theme="dark"] .faq-compare__label,
html[data-theme="dark"] .faq-nav__item--active a { color: #4ade80; }

html[data-theme="dark"] .af-plan__cta { background: rgba(22, 163, 74, .16); color: #4ade80; border-color: rgba(74, 222, 128, .3); }
html[data-theme="dark"] .af-plan__cta:hover,
html[data-theme="dark"] .af-plan--featured .af-plan__cta { background: #16a34a; color: #fff; border-color: #16a34a; }
html[data-theme="dark"] .af-plan--featured .af-plan__cta:hover { background: #15803d; border-color: #15803d; }

/* tons de azul */
html[data-theme="dark"] .af-connect-card__badge--meta,
html[data-theme="dark"] .ef-feature-card__icon,
html[data-theme="dark"] .faq-callout--info { background: rgba(59, 130, 246, .16); }
html[data-theme="dark"] .af-connect-card__badge--meta,
html[data-theme="dark"] .ef-modulo__num { color: #7db3fa; }

/* alerta (âmbar) e aviso (vermelho) */
html[data-theme="dark"] .faq-callout--warn { background: rgba(245, 158, 11, .14); }
html[data-theme="dark"] .faq-compare__card--paid { background: rgba(239, 68, 68, .13); }

/* etiquetas coloridas do FAQ */
html[data-theme="dark"] .tag-marketing { color: #fbbf24; }
html[data-theme="dark"] .tag-utilidade { color: #93c5fd; }
html[data-theme="dark"] .tag-autenticacao { color: #c4b5fd; }

/* links com a cor escrita direto no HTML (atributo style) */
html[data-theme="dark"] [style*="color:var(--purple)"],
html[data-theme="dark"] [style*="color: var(--purple)"] { color: var(--t-accent) !important; }

/* "ilhas claras": blocos que ficam brancos de propósito sobre fundo colorido.
   Dentro deles os cinzas voltam ao valor do tema claro, para o texto continuar escuro. */
html[data-theme="dark"] .sp-hero__search,
html[data-theme="dark"] .pf-prepago__cta {
  --gray-50: #F8F8FC; --gray-100: #F0EEF6; --gray-200: #E2DFF0; --gray-400: #9896AD;
  --gray-600: #5A5870; --gray-800: #2A2840; --dark: #1A1830;
  color: #2A2840;                /* a cor do texto e herdada do body; a ilha precisa da propria */
}

/* avisos do FAQ: o texto colorido escuro vira o tom claro da mesma cor */
html[data-theme="dark"] .faq-callout--info,  html[data-theme="dark"] .faq-callout--info *  { color: #bcd2fb; }
html[data-theme="dark"] .faq-callout--warn,  html[data-theme="dark"] .faq-callout--warn *  { color: #fcd9a0; }
html[data-theme="dark"] .faq-callout--green, html[data-theme="dark"] .faq-callout--green * { color: #b4f0c8; }

/* ── Gerado automaticamente a partir do style.css e das páginas ── */

/* atendef4cil */
html[data-theme="dark"] .af-feature { background: var(--t-surface); }
html[data-theme="dark"] .af-segment { background: var(--t-surface); }
html[data-theme="dark"] .af-channel-card { background: var(--t-surface); }
html[data-theme="dark"] .af-plan { background: var(--t-surface); }

/* compactof4cil */
html[data-theme="dark"] .cf-module { background: var(--t-surface); }
html[data-theme="dark"] .cf-module__icon { background: var(--t-chip); color: var(--t-accent); }
html[data-theme="dark"] .cf-forwhom__item { background: var(--t-surface); }
html[data-theme="dark"] .cf-benefits__title em { color: var(--t-accent); }
html[data-theme="dark"] .cf-list li svg { color: var(--t-accent); }
html[data-theme="dark"] .cf-cta__title em { color: var(--t-accent); }

/* conhecealguem */
html[data-theme="dark"] .ca-step { background: var(--t-surface); }
html[data-theme="dark"] .ca-cat { background: var(--t-surface); }
html[data-theme="dark"] .ca-diff { background: var(--t-surface); }
html[data-theme="dark"] .ca-diff__icon { background: var(--t-chip); color: var(--t-accent); }

/* devirclinica */
html[data-theme="dark"] .dc-dicta__title em { color: var(--t-accent); }
html[data-theme="dark"] .dc-dicta__highlight { background: var(--t-surface); }
html[data-theme="dark"] .dc-flow__step:not(:last-child)::after { background: var(--t-chip); }
html[data-theme="dark"] .dc-module { background: var(--t-surface); }
html[data-theme="dark"] .dc-module__icon { background: var(--t-chip); color: var(--t-accent); }
html[data-theme="dark"] .dc-price-card { background: var(--t-surface); }
html[data-theme="dark"] .dc-price-card--featured { border-color: var(--t-accent); }
html[data-theme="dark"] .dc-price-card__patients { color: var(--t-accent); background: var(--t-chip); }
html[data-theme="dark"] .dc-price-card__features li::before { background: var(--t-chip); color: var(--t-accent); }
html[data-theme="dark"] .dc-ethics { border-left-color: var(--t-accent); }
html[data-theme="dark"] .dc-ethics__icon { background: var(--t-chip); color: var(--t-accent); }
html[data-theme="dark"] .dc-ethics__label { color: var(--t-accent); }

/* escolaf4cil */
html[data-theme="dark"] .ef-feature-card { background: var(--t-surface); }
html[data-theme="dark"] .ef-modulos { background: var(--t-surface); }

/* faq */
html[data-theme="dark"] .faq-item summary { background: var(--t-surface); }
html[data-theme="dark"] .faq-item__answer { background: var(--t-surface); }

/* gamef4cil */
html[data-theme="dark"] .gf-what__title em { color: var(--t-accent); }
html[data-theme="dark"] .gf-what__highlight { background: var(--t-chip); border-left-color: var(--t-accent); }
html[data-theme="dark"] .gf-element { background: var(--t-surface); }
html[data-theme="dark"] .gf-profile__body { background: var(--t-surface); }
html[data-theme="dark"] .gf-why-item { background: var(--t-surface); }
html[data-theme="dark"] .gf-mission { background: var(--t-surface); }

/* personatest */
html[data-theme="dark"] .pt-what__title em { color: var(--t-accent); }
html[data-theme="dark"] .pt-jung-box { background: var(--t-surface); border-left-color: var(--t-accent); }
html[data-theme="dark"] .pt-jung-box__name { color: var(--t-accent); }
html[data-theme="dark"] .pt-dimensao { background: var(--t-surface); }
html[data-theme="dark"] .pt-dimensao__label { color: var(--t-accent); }
html[data-theme="dark"] .pt-use { background: var(--t-surface); }
html[data-theme="dark"] .pt-use__icon { background: var(--t-chip); color: var(--t-accent); }
html[data-theme="dark"] .pt-step { background: var(--t-surface); }

/* polof4cil */
html[data-theme="dark"] .pf-module { background: var(--t-surface); }
html[data-theme="dark"] .pf-module__icon { background: var(--t-chip); color: var(--t-accent); }
html[data-theme="dark"] .pf-multipolo__title em { color: var(--t-accent); }
html[data-theme="dark"] .pf-diferencial { background: var(--t-surface); }
html[data-theme="dark"] .pf-diferencial__icon { background: var(--t-chip); color: var(--t-accent); }

/* pontof4cil */
html[data-theme="dark"] .pf-feature { background: var(--t-surface); }
html[data-theme="dark"] .pf-feature__icon { background: var(--t-chip); color: var(--t-accent); }
html[data-theme="dark"] .pf-tag { color: var(--t-accent); background: var(--t-chip); }
html[data-theme="dark"] .pf-showcase__title em { color: var(--t-accent); }
html[data-theme="dark"] .pf-checklist li svg { color: var(--t-accent); }
html[data-theme="dark"] .pf-compare__table tbody tr:nth-child(odd) { background: var(--t-surface); }
html[data-theme="dark"] .pf-compare__table tbody tr:hover { background: var(--t-chip); }

/* pontof4cil-prepago */
html[data-theme="dark"] .pp-sobre { background: var(--t-surface); }
html[data-theme="dark"] .pp-sobre__tag { color: var(--t-accent); }
html[data-theme="dark"] .pp-sobre__title span { color: var(--t-accent); }
html[data-theme="dark"] .pp-porque__card { background: var(--t-surface); }
html[data-theme="dark"] .pp-porque__icon { background: var(--t-chip); color: var(--t-accent); }
html[data-theme="dark"] .pp-como { background: var(--t-surface); }

/* privacy-policy */
html[data-theme="dark"] .pp-tabs-wrap { background: var(--t-surface); }
html[data-theme="dark"] .pp-tab:hover { color: var(--t-accent); }
html[data-theme="dark"] .pp-tab.active { color: var(--t-accent); border-bottom-color: var(--t-accent); }
html[data-theme="dark"] .pp-doc h2 { color: var(--t-accent); }
html[data-theme="dark"] .pp-doc a { color: var(--t-accent); }
html[data-theme="dark"] .pp-contact-box { border-left-color: var(--t-accent); }

/* saudepajeu */
html[data-theme="dark"] .sp-step { background: var(--t-surface); }
html[data-theme="dark"] .sp-spec { background: var(--t-surface); }
html[data-theme="dark"] .sp-diff { background: var(--t-surface); }

/* style.css */
html[data-theme="dark"] body { background: var(--t-bg); }
html[data-theme="dark"] .btn--outline { color: var(--t-accent); border-color: var(--t-accent); }
html[data-theme="dark"] .nav__link:hover { color: var(--t-accent); background: var(--t-chip); }
html[data-theme="dark"] .nav__dropdown { background: var(--t-surface); }
html[data-theme="dark"] .nav__dropdown-link:hover { background: var(--t-chip); }
html[data-theme="dark"] .dropdown-icon { background: var(--t-chip); color: var(--t-accent); }
html[data-theme="dark"] .nav__mega-label { color: var(--t-accent); }
html[data-theme="dark"] .diferencial { background: var(--t-surface); }
html[data-theme="dark"] .diferencial__icon { background: var(--t-chip); color: var(--t-accent); }
html[data-theme="dark"] .solucao-card { background: var(--t-surface); }
html[data-theme="dark"] .solucao-card__icon { background: var(--t-chip); color: var(--t-accent); }
html[data-theme="dark"] .solucao-card__link { color: var(--t-accent); }
html[data-theme="dark"] .solucao-card__link:hover { color: var(--t-accent); }
html[data-theme="dark"] .contato { background: var(--t-surface); }
html[data-theme="dark"] .contato__icon { background: var(--t-chip); color: var(--t-accent); }
html[data-theme="dark"] .contato__item a { color: var(--t-accent); }
html[data-theme="dark"] .form__group input,
html[data-theme="dark"] .form__group select,
html[data-theme="dark"] .form__group textarea { background: var(--t-surface); }
html[data-theme="dark"] .form__group input:focus,
html[data-theme="dark"] .form__group select:focus,
html[data-theme="dark"] .form__group textarea:focus { border-color: var(--t-accent); }

@media (max-width: 768px) {
  html[data-theme="dark"] nav { background: var(--t-surface); }
  html[data-theme="dark"] .faq-sidebar { background: var(--t-surface); }
}