/* =========================================================
   Home (front page) — Elementor + html.kk-site-dark
   Sobrescreve CSS gerado (post-*.css) com fundos #fff / #f9fafa inline.
   Scope: body.home — não afecta outras páginas.
   ========================================================= */

/* Área principal alinhada ao fundo escuro (evita “faixa” entre header e hero) */
html.kk-site-dark body.home #main-content,
html.dark body.home #main-content,
html.kk-site-dark body.home .site-content,
html.dark body.home .site-content {
  background-color: var(--kk-bg) !important;
}

/* --- Hero: raiz + motion (post-7081) --- */
html.kk-site-dark body.home .elementor-element-41795bfd:not(.elementor-motion-effects-element-type-background),
html.dark body.home .elementor-element-41795bfd:not(.elementor-motion-effects-element-type-background),
html.kk-site-dark body.home .elementor-element-41795bfd > .elementor-motion-effects-container > .elementor-motion-effects-layer,
html.dark body.home .elementor-element-41795bfd > .elementor-motion-effects-container > .elementor-motion-effects-layer {
  background-color: var(--kk-bg) !important;
  background-image: none !important;
}

/* Fallback: classe .hero no container Elementor (mesmo bloco) */
html.kk-site-dark body.home .elementor-element.hero.e-con-full:not(.elementor-motion-effects-element-type-background),
html.dark body.home .elementor-element.hero.e-con-full:not(.elementor-motion-effects-element-type-background),
html.kk-site-dark body.home .elementor-element.hero.e-con-full > .elementor-motion-effects-container > .elementor-motion-effects-layer,
html.dark body.home .elementor-element.hero.e-con-full > .elementor-motion-effects-container > .elementor-motion-effects-layer {
  background-color: var(--kk-bg) !important;
  background-image: none !important;
}

/*
 * Colunas / e-con / wraps dentro do hero trazem cinzas (#d1d5db) ou #fff inline —
 * sem isto o “dark mode” fica só no header.
 */
html.kk-site-dark body.home .elementor-element-41795bfd .e-con,
html.dark body.home .elementor-element-41795bfd .e-con,
html.kk-site-dark body.home .elementor-element-41795bfd .e-con-inner,
html.dark body.home .elementor-element-41795bfd .e-con-inner,
html.kk-site-dark body.home .elementor-element-41795bfd .e-flex,
html.dark body.home .elementor-element-41795bfd .e-flex,
html.kk-site-dark body.home .elementor-element-41795bfd .elementor-widget-wrap,
html.dark body.home .elementor-element-41795bfd .elementor-widget-wrap,
html.kk-site-dark body.home .elementor-element-41795bfd .elementor-column,
html.dark body.home .elementor-element-41795bfd .elementor-column,
html.kk-site-dark body.home .elementor-element-41795bfd .elementor-column-wrap,
html.dark body.home .elementor-element-41795bfd .elementor-column-wrap,
html.kk-site-dark body.home .elementor-element-41795bfd .elementor-element-populated,
html.dark body.home .elementor-element-41795bfd .elementor-element-populated {
  background-color: transparent !important;
  background-image: none !important;
}

/* Tipografia no hero (texto ainda escuro no 2º print) */
html.kk-site-dark body.home .elementor-element-41795bfd .elementor-heading-title,
html.dark body.home .elementor-element-41795bfd .elementor-heading-title {
  color: var(--kk-fg) !important;
}

/* Destaques no título com cor inline (ex.: “Knox Kids” em ciano) */
html.kk-site-dark body.home .elementor-element-41795bfd .elementor-heading-title span[style],
html.dark body.home .elementor-element-41795bfd .elementor-heading-title span[style] {
  color: var(--kk-primary) !important;
}

html.kk-site-dark body.home .elementor-element-41795bfd .elementor-widget-text-editor,
html.dark body.home .elementor-element-41795bfd .elementor-widget-text-editor,
html.kk-site-dark body.home .elementor-element-41795bfd .elementor-widget-text-editor p,
html.dark body.home .elementor-element-41795bfd .elementor-widget-text-editor p {
  color: var(--kk-muted) !important;
}

html.kk-site-dark body.home .elementor-element-41795bfd .elementor-widget-icon-list .elementor-icon-list-text,
html.dark body.home .elementor-element-41795bfd .elementor-widget-icon-list .elementor-icon-list-text {
  color: var(--kk-muted) !important;
}


/* --- CTA “Benefícios” / cards: .elementor-cta__content (#FFFFFF no post-7881 etc.) --- */
html.kk-site-dark body.home .elementor-widget-call-to-action .elementor-cta__content,
html.dark body.home .elementor-widget-call-to-action .elementor-cta__content {
  background-color: var(--kk-card) !important;
  background-image: none !important;
  border-color: var(--kk-border) !important;
}

html.kk-site-dark body.home .elementor-widget-call-to-action .elementor-cta__title,
html.dark body.home .elementor-widget-call-to-action .elementor-cta__title {
  color: var(--kk-fg) !important;
}

html.kk-site-dark body.home .elementor-widget-call-to-action .elementor-cta__description,
html.kk-site-dark body.home .elementor-widget-call-to-action .elementor-cta__description p,
html.dark body.home .elementor-widget-call-to-action .elementor-cta__description,
html.dark body.home .elementor-widget-call-to-action .elementor-cta__description p {
  color: var(--kk-muted) !important;
}

/* Botão / link dentro do CTA (ex.: “Saiba mais”) */
html.kk-site-dark body.home .elementor-widget-call-to-action .elementor-cta__button,
html.dark body.home .elementor-widget-call-to-action .elementor-cta__button {
  color: var(--kk-primary) !important;
}

html.kk-site-dark body.home .elementor-widget-call-to-action .elementor-cta__bg-wrapper,
html.dark body.home .elementor-widget-call-to-action .elementor-cta__bg-wrapper {
  background-color: transparent !important;
}

/* --- Seções com overlay/animação via pseudo-elemento --- */
html.kk-site-dark body.home .elementor-element-41795bfd::before,
html.dark body.home .elementor-element-41795bfd::before,
html.kk-site-dark body.home .elementor-element-41795bfd::after,
html.dark body.home .elementor-element-41795bfd::after,
html.kk-site-dark body.home .elementor-element-5e4af1d3::before,
html.dark body.home .elementor-element-5e4af1d3::before,
html.kk-site-dark body.home .elementor-element-5e4af1d3::after,
html.dark body.home .elementor-element-5e4af1d3::after,
html.kk-site-dark body.home .elementor-element-6ec28812::before,
html.dark body.home .elementor-element-6ec28812::before,
html.kk-site-dark body.home .elementor-element-6ec28812::after,
html.dark body.home .elementor-element-6ec28812::after,
html.kk-site-dark body.home .elementor-element-488b8e92::before,
html.dark body.home .elementor-element-488b8e92::before,
html.kk-site-dark body.home .elementor-element-488b8e92::after,
html.dark body.home .elementor-element-488b8e92::after,
html.kk-site-dark body.home .elementor-element-7f9cc774::before,
html.dark body.home .elementor-element-7f9cc774::before,
html.kk-site-dark body.home .elementor-element-7f9cc774::after,
html.dark body.home .elementor-element-7f9cc774::after {
  background: transparent !important;
  background-color: transparent !important;
  background-image: none !important;
}

/* “Saiba mais” / coluna de texto: mesma especificidade que post-7081.css (overlay branco no ::before) */
html.kk-site-dark body.home .elementor-7081 .elementor-element.elementor-element-7f9cc774::before,
html.dark body.home .elementor-7081 .elementor-element.elementor-element-7f9cc774::before,
html.kk-site-dark body.home .elementor-7081 .elementor-element.elementor-element-7f9cc774::after,
html.dark body.home .elementor-7081 .elementor-element.elementor-element-7f9cc774::after,
html.kk-site-dark body.home .elementor-7081 .elementor-element.elementor-element-7f9cc774 > .elementor-background-video-container::before,
html.dark body.home .elementor-7081 .elementor-element.elementor-element-7f9cc774 > .elementor-background-video-container::before {
  background: transparent !important;
  background-color: transparent !important;
  background-image: none !important;
  --background-overlay: transparent !important;
  opacity: 0 !important;
}

/*
 * Garante que seções com e-con-boxed/e-con-inner não tragam branco/cinza
 * por CSS gerado do Elementor quando o modo escuro estiver activo.
 */
html.kk-site-dark body.home .elementor-element-5e4af1d3,
html.dark body.home .elementor-element-5e4af1d3,
html.kk-site-dark body.home .elementor-element-6ec28812,
html.dark body.home .elementor-element-6ec28812,
html.kk-site-dark body.home .elementor-element-488b8e92,
html.dark body.home .elementor-element-488b8e92,
html.kk-site-dark body.home .elementor-element-5e4af1d3 .e-con-inner,
html.dark body.home .elementor-element-5e4af1d3 .e-con-inner,
html.kk-site-dark body.home .elementor-element-6ec28812 .e-con-inner,
html.dark body.home .elementor-element-6ec28812 .e-con-inner,
html.kk-site-dark body.home .elementor-element-488b8e92 .e-con-inner,
html.dark body.home .elementor-element-488b8e92 .e-con-inner,
html.kk-site-dark body.home .elementor-element-7f9cc774,
html.dark body.home .elementor-element-7f9cc774,
html.kk-site-dark body.home .elementor-element-7f9cc774 .e-con-inner,
html.dark body.home .elementor-element-7f9cc774 .e-con-inner {
  background-color: transparent !important;
  background-image: none !important;
}

/* --- Como funciona: h2 e p no dark --- */
html.kk-site-dark body.home .elementor-element-6ec28812 h2,
html.dark body.home .elementor-element-6ec28812 h2 {
  color: var(--kk-fg) !important;
}

html.kk-site-dark body.home .elementor-element-6ec28812 p,
html.dark body.home .elementor-element-6ec28812 p {
  color: var(--kk-muted) !important;
}

/* --- Tipografia geral da home no dark (benefícios / formando / investimento) --- */
html.kk-site-dark body.home .elementor-widget-heading .elementor-heading-title,
html.dark body.home .elementor-widget-heading .elementor-heading-title {
  color: var(--kk-fg) !important;
}

html.kk-site-dark body.home .elementor-widget-text-editor,
html.kk-site-dark body.home .elementor-widget-text-editor p,
html.dark body.home .elementor-widget-text-editor,
html.dark body.home .elementor-widget-text-editor p {
  color: var(--kk-muted) !important;
}

/* Mantém destaques coloridos em headings com span inline (ex.: Knox Kids) */
html.kk-site-dark body.home .elementor-widget-heading .elementor-heading-title span[style],
html.dark body.home .elementor-widget-heading .elementor-heading-title span[style] {
  color: var(--kk-primary) !important;
}

/* --- Investimento: botão "fazer matrícula" legível no dark --- */
html.kk-site-dark body.home .elementor-widget-price-table .elementor-price-table__button,
html.dark body.home .elementor-widget-price-table .elementor-price-table__button {
  color: #ffffff !important;
  background: var(--kk-primary) !important;
  border-color: var(--kk-primary) !important;
  opacity: 1 !important;
}

html.kk-site-dark body.home .elementor-widget-price-table .elementor-price-table__button .elementor-button-text,
html.dark body.home .elementor-widget-price-table .elementor-price-table__button .elementor-button-text,
html.kk-site-dark body.home .elementor-widget-price-table .elementor-price-table__button .e-font-icon-svg,
html.dark body.home .elementor-widget-price-table .elementor-price-table__button .e-font-icon-svg {
  color: #ffffff !important;
  fill: #ffffff !important;
}

/* --- Saiba mais / Formando: container que ainda injeta fundo claro --- */
html.kk-site-dark body.home .elementor-element-11d8b9e2,
html.dark body.home .elementor-element-11d8b9e2,
html.kk-site-dark body.home .elementor-element-11d8b9e2 .e-con-inner,
html.dark body.home .elementor-element-11d8b9e2 .e-con-inner {
  background-color: var(--kk-bg) !important;
  background-image: none !important;
}

html.kk-site-dark body.home .elementor-element-11d8b9e2::before,
html.dark body.home .elementor-element-11d8b9e2::before,
html.kk-site-dark body.home .elementor-element-11d8b9e2::after,
html.dark body.home .elementor-element-11d8b9e2::after {
  background: transparent !important;
  background-image: none !important;
}

/* --- Header mobile da home: dropdown legível no dark --- */
@media (max-width: 1024px) {
  html.kk-site-dark body.home .elementor-nav-menu--dropdown,
  html.dark body.home .elementor-nav-menu--dropdown,
  html.kk-site-dark body.home .elementor-nav-menu--dropdown .sub-menu,
  html.dark body.home .elementor-nav-menu--dropdown .sub-menu {
    background: var(--kk-card) !important;
    border-color: var(--kk-border) !important;
  }

  html.kk-site-dark body.home .elementor-nav-menu--dropdown a,
  html.dark body.home .elementor-nav-menu--dropdown a,
  html.kk-site-dark body.home .elementor-nav-menu--dropdown .elementor-item,
  html.dark body.home .elementor-nav-menu--dropdown .elementor-item {
    color: var(--kk-fg) !important;
  }

  html.kk-site-dark body.home .elementor-nav-menu--dropdown .elementor-item-active,
  html.dark body.home .elementor-nav-menu--dropdown .elementor-item-active,
  html.kk-site-dark body.home .elementor-nav-menu--dropdown .elementor-item:hover,
  html.dark body.home .elementor-nav-menu--dropdown .elementor-item:hover {
    color: var(--kk-primary) !important;
    background: rgba(14, 162, 221, 0.12) !important;
  }

  html.kk-site-dark body.home .elementor-menu-toggle,
  html.dark body.home .elementor-menu-toggle {
    color: var(--kk-fg) !important;
  }
}