/* ================================================
   Mirror Overrides — Correções pontuais pro CSS
   gerado pelo Elementor + tema Twenty Twenty-One.
   Carregado em LandingLayout e BaseLayout.
   ================================================ */

/* ──────────────────────────────────────────────
   FIX faixa verde do tema Twenty Twenty-One
   Causa: body { background: var(--global--color-background) = #d1e4dd }
   Solução SELETIVA por classe wrapper aplicada no body.html processado
   pelo mirror-to-astro.mjs:
   - .mirror-dark-page  → body fundo dark
   - .mirror-light-page → body fundo branco
   ────────────────────────────────────────────── */
body:has(.mirror-dark-page) {
  background-color: #020202;
}
body:has(.mirror-light-page) {
  background-color: #ffffff;
}

/* Reset universal das vars verdes do tema (caso :has não suporte) */
:root {
  --global--color-green: #d1e4dd;
}

/* Elementor Kit força background-color:#FFFFFF em .elementor-kit-35 — neutraliza só em páginas dark */
.mirror-dark-page .elementor-kit-35,
.mirror-dark-page [data-elementor-type="wp-page"] {
  background-color: transparent;
}

/* Página dark: garante que first/last section não tem bg residual */
.mirror-dark-page [data-elementor-type="wp-page"] > .elementor-section:first-child,
.mirror-dark-page [data-elementor-type="wp-page"] > .elementor-section:last-child {
  background-color: transparent;
}

/* Páginas light: deixa o Elementor Kit funcionar (background branco original) */
.mirror-light-page [data-elementor-type="wp-page"] {
  background-color: transparent;
}

/* Sections com conteúdo dark identificado: cobre padding do .e-con-full
   para o body branco não vazar nas margens. Marcado por scripts/mark-dark-sections.mjs */
.mirror-light-page .e-con-full[data-mirror-section-bg="dark"] {
  background-color: #020202;
}

/* ──────────────────────────────────────────────
   FIX Footer regional invisível
   Causa: .wys-footer { opacity: 0; transform: translateY(20px) }
   + JS reveal (IntersectionObserver) que adicionaria .visible.
   Como removemos todos os <script> durante o mirror, a classe .visible
   nunca é adicionada → footer fica invisível.
   Solução: forçar estado revelado sempre.
   ────────────────────────────────────────────── */
.wys-footer,
.wys-footer-wrapper .wys-footer {
  opacity: 1 !important;
  transform: translateY(0) !important;
}

/* Mesmo padrão para reveals genéricos que dependeriam de JS toggle .visible */
[class*="reveal"]:not(.reveal-up),
.fade-up,
.fade-in {
  opacity: 1 !important;
  transform: none !important;
}

/* ──────────────────────────────────────────────
   Ícones gigantes em cards (Ecossistema etc)
   ────────────────────────────────────────────── */
.elementor-element[data-id*="ecosystem"] .elementor-icon-box-icon,
.elementor-icon-box-wrapper .elementor-icon-box-icon {
  max-width: 80px;
  max-height: 80px;
}

/* Garante que SVGs/imagens internas dos cards ficam contidas */
.elementor-icon-box-icon svg,
.elementor-icon-box-icon img {
  max-width: 100%;
  max-height: 100%;
  width: auto;
  height: auto;
}
