/* ============================================================
   Tema da plataforma (app.oficinadaaprovacao.com.br) aplicado ao site.
   Carregado por ÚLTIMO em cada página (exceto as do ETEC).
   Espelha o layout logado da plataforma:
   - assets/scss/layout.scss  (topo amarelo 60px, atalhos em pílula, menu branco)
   - shared/admin-ui.css      (blocos com borda, títulos de seção, selos, pílulas)
   - assets/scss/app.scss     (hierarquia de texto --of-*, Cabin Condensed)
   ============================================================ */

@import url("https://fonts.googleapis.com/css2?family=Cabin+Condensed:wght@400;500;600;700&display=swap");

:root {
  /* Tema "oficina" (layout.scss) */
  --of-tema: #eea800;
  --of-tema-rgb: 238, 168, 0;
  --of-tema-hover: #d69700;
  --of-tema-texto: #8a5d00;

  /* Superfícies (layout.scss / admin-ui.css) */
  --of-fundo: #f4f6f9;
  --of-superficie: #ffffff;
  --of-superficie-2: #f4f7fa;
  --of-hover: #f1f4f8;
  --of-borda: #e3e8ee;
  --of-borda-forte: #c3ced7;
  --of-sombra: 0 8px 24px rgba(16, 24, 40, 0.12);
  --of-sombra-topo: 0 1px 0 rgba(0, 0, 0, 0.06), 0 2px 8px rgba(0, 0, 0, 0.08);

  /* Texto (app.scss) */
  --of-texto-titulo: #1d2b36;
  --of-texto-rotulo: #34495a;
  --of-texto: #4a5d6b;
  --of-texto-suave: #627582;
  --of-placeholder: #8a9aa5;

  /* Selos (admin-ui.css) */
  --of-alerta: #a85d00;
  --of-alerta-fundo: #fff1d6;
  --of-ok: #087a54;
  --of-ok-fundo: #dcf6ea;
  --of-erro: #c62828;
  --of-erro-fundo: #fde7e7;
  --of-info: #1a66d2;
  --of-info-fundo: #e6f0fe;

  --of-fonte: "Cabin Condensed", "Segoe UI", system-ui, sans-serif;
  --of-raio: 8px;
  --of-raio-btn: 6px;
  --of-topo-altura: 60px;

  /* Sistema oa-* do site (style.css) */
  --oa-yellow: var(--of-tema);
  --oa-black: var(--of-texto-titulo);
  --oa-white: #ffffff;
  --oa-text: var(--of-texto-titulo);
  --oa-muted: var(--of-texto);
  --oa-bg: var(--of-fundo);
  --oa-success: var(--of-ok);
  --oa-danger: var(--of-erro);
  --oa-radius: var(--of-raio);
  --oa-shadow: var(--of-sombra);
  --oa-shadow-soft: none;
  --sessao-estrategica-amarelo: var(--of-tema);
  --sessao-estrategica-preto: var(--of-texto-titulo);
}

/* ============================================================
   Base
   ============================================================ */

html {
  background: var(--of-fundo);
}

body {
  font-family: var(--of-fonte) !important;
  color: var(--of-texto);
  background: var(--of-fundo) !important;
  margin-top: 0 !important;
  padding-top: var(--of-topo-altura);
}

body :is(h1, h2, h3, h4, h5, h6, p, li, a, span, strong, b, em, small, label,
  button, input, select, textarea, td, th, dt, dd, blockquote, figcaption, div, summary) {
  font-family: var(--of-fonte) !important;
}

body .fa,
body [class^="fa-"],
body [class*=" fa-"] {
  font-family: FontAwesome !important;
}

body :is(h1, h2, h3, h4, h5, h6) {
  color: var(--of-texto-titulo);
  letter-spacing: 0;
}

/* ============================================================
   Topo — cópia do .topbar da plataforma (layout.scss)
   ============================================================ */

.of-topbar {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  z-index: 1030;
  height: var(--of-topo-altura);
  background: var(--of-tema);
  box-shadow: var(--of-sombra-topo);
}

.of-topbar__inner {
  display: flex;
  align-items: center;
  gap: 12px;
  height: 100%;
  max-width: 1280px;
  margin: 0 auto;
  padding: 0 12px;
}

.of-topbar__brand {
  display: flex;
  align-items: center;
  gap: 8px;
  flex-shrink: 0;
  text-decoration: none;
}

.of-topbar__brand img {
  display: block;
}

.of-topbar__nav {
  display: flex;
  align-items: center;
  margin-left: auto;
  min-width: 0;
}

.of-topbar__links {
  display: flex;
  align-items: center;
  gap: 4px;
}

/* .lt-atalho */
.of-atalho {
  display: inline-flex;
  align-items: center;
  height: 36px;
  padding: 0 12px;
  border-radius: 18px;
  color: rgba(255, 255, 255, 0.92) !important;
  font-size: 15px;
  font-weight: 600;
  white-space: nowrap;
  text-decoration: none !important;
  transition: background 0.15s, color 0.15s;
}

.of-atalho:hover,
.of-atalho:focus-visible {
  background: rgba(255, 255, 255, 0.14);
  color: #fff !important;
  outline: none;
}

.of-atalho.ativo {
  background: rgba(255, 255, 255, 0.95);
  color: var(--of-tema-texto) !important;
}

/* .lt-perfil-btn: "Entrar" */
.of-atalho--entrar {
  margin-left: 6px;
  background: rgba(255, 255, 255, 0.14);
}

.of-atalho--entrar:hover {
  background: rgba(255, 255, 255, 0.24);
}

/* .lt-menu-btn */
.of-topbar__menu-btn {
  display: none;
  align-items: center;
  justify-content: center;
  width: 40px;
  height: 40px;
  border: 0;
  border-radius: 50%;
  background: transparent;
  cursor: pointer;
  transition: background 0.15s;
}

.of-topbar__menu-btn:hover,
.of-topbar__menu-btn:focus-visible {
  background: rgba(255, 255, 255, 0.16);
  outline: none;
}

.of-topbar__menu-btn span {
  display: block;
  width: 20px;
  height: 2px;
  margin: 4px auto;
  border-radius: 1px;
  background: #fff;
}

@media (max-width: 1023px) {
  .of-topbar__menu-btn {
    display: inline-flex;
    flex-direction: column;
  }

  /* .lt-menu: painel branco suspenso */
  .of-topbar__links {
    display: none;
    position: fixed;
    top: calc(var(--of-topo-altura) + 6px);
    left: 8px;
    right: 8px;
    flex-direction: column;
    align-items: stretch;
    gap: 2px;
    padding: 6px;
    border: 1px solid var(--of-borda);
    border-radius: 12px;
    background: var(--of-superficie);
    box-shadow: var(--of-sombra);
  }

  .of-topbar__links.is-open {
    display: flex;
  }

  /* .lt-menu-item */
  .of-atalho,
  .of-atalho--entrar {
    height: 42px;
    margin: 0;
    padding: 0 12px;
    border-radius: 8px;
    background: transparent;
    color: var(--of-texto-rotulo) !important;
    font-size: 15px;
  }

  .of-atalho:hover,
  .of-atalho:focus-visible {
    background: var(--of-hover);
    color: var(--of-texto-titulo) !important;
  }

  .of-atalho.ativo {
    background: rgba(var(--of-tema-rgb), 0.14);
    color: var(--of-tema-texto) !important;
  }

  .of-atalho--entrar {
    margin-top: 4px;
    border-top: 1px solid var(--of-borda);
    border-radius: 0 0 8px 8px;
    color: var(--of-tema-texto) !important;
  }
}

@media (max-width: 420px) {
  .of-topbar__brand img + img {
    height: 26px;
    width: auto;
  }
}

/* ============================================================
   Botões — .btn-themecolor e .ma-pill da plataforma
   ============================================================ */

body .oa-btn,
.of-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  min-height: 42px;
  padding: 9px 18px;
  border: 1px solid transparent;
  border-radius: var(--of-raio-btn);
  font-size: 15px;
  font-weight: 600;
  letter-spacing: 0.02em;
  text-transform: uppercase;
  text-decoration: none;
  box-shadow: none !important;
  transition: background 0.15s, border-color 0.15s, color 0.15s;
}

body .oa-btn:hover {
  transform: none;
}

body .oa-btn--primary,
body .oa-btn--primary:visited,
.of-btn--tema {
  background: var(--of-tema) !important;
  border-color: var(--of-tema) !important;
  color: var(--of-texto-titulo) !important;
}

body .oa-btn--primary:hover,
body .oa-btn--primary:focus,
.of-btn--tema:hover {
  background: var(--of-tema-hover) !important;
  border-color: var(--of-tema-hover) !important;
  color: var(--of-texto-titulo) !important;
}

body .oa-btn--ghost,
body .oa-btn--ghost:visited {
  background: var(--of-superficie) !important;
  border-color: var(--of-borda-forte) !important;
  color: var(--of-texto-titulo) !important;
}

body .oa-btn--ghost:hover,
body .oa-btn--ghost:focus {
  background: var(--of-hover) !important;
  border-color: var(--of-texto-suave) !important;
}

body .oa-btn:focus-visible {
  outline: none;
  box-shadow: 0 0 0 3px rgba(var(--of-tema-rgb), 0.35) !important;
}

/* ============================================================
   Páginas no padrão oa-* (home, mentorias, preparações, dúvidas)
   ============================================================ */

/* O topo antigo some: o novo fica fixo no lugar */
body .oa-header {
  display: none;
}

body.oa-page,
body.oa-page .oa-main,
body.oa-page .oa-product-main {
  background: var(--of-fundo);
}

body.oa-page .oa-main {
  padding-top: 0;
}

body.oa-page p,
body.oa-page li,
body.oa-page small {
  color: var(--of-texto);
}

/* Todas as faixas viram fundo da plataforma, sem gradiente escuro */
body.oa-page :is(
  .oa-home-hero, .oa-hero--institutional, .oa-home-section, .oa-home-section--muted, .oa-section--light,
  .oa-product-hero, .oa-product-section, .oa-product-section--muted, .oa-product-section--light,
  .oa-product-section--dark, .oa-product-section--decision, .oa-product-section--proof,
  .oa-product-section--trust, .oa-mentorias-hero, .oa-mentorias-section, .oa-mentorias-section--muted,
  .oa-mentorias-cta, .oa-preparacoes-hero, .oa-preparacoes-section, .oa-preparacoes-section--muted,
  .oa-preparacoes-cta, .oa-faq-hero, .oa-faq-section, .oa-faq-section--muted, .oa-faq-cta,
  .oa-cta-final, .oa-home-cta-band, .oa-results-cta) {
  background: transparent !important;
  color: var(--of-texto);
  border: 0;
  box-shadow: none !important;
}

body.oa-page :is(.oa-product-hero, .oa-mentorias-hero, .oa-preparacoes-hero, .oa-faq-hero)::before,
body.oa-page :is(.oa-product-hero, .oa-mentorias-hero, .oa-preparacoes-hero, .oa-faq-hero)::after {
  display: none;
}

body.oa-page :is(.oa-product-section, .oa-home-section, .oa-mentorias-section, .oa-preparacoes-section,
  .oa-faq-section, .oa-section--light) {
  padding: 28px 0;
}

/* Cabeçalho da página: um bloco branco, como os cards da plataforma */
body.oa-page :is(.oa-product-hero, .oa-mentorias-hero, .oa-preparacoes-hero, .oa-faq-hero, .oa-home-hero) {
  padding: 24px 0 8px !important;
}

body.oa-page :is(.oa-product-hero, .oa-mentorias-hero, .oa-preparacoes-hero, .oa-faq-hero, .oa-home-hero) > .oa-container {
  background: var(--of-superficie);
  border: 1px solid var(--of-borda);
  border-radius: var(--of-raio);
  padding: 28px;
}

body.oa-page :is(.oa-mentorias-cta, .oa-preparacoes-cta, .oa-faq-cta, .oa-cta-final, .oa-home-cta-band, .oa-results-cta, .oa-product-section--decision, .oa-product-section--dark) > .oa-container {
  background: var(--of-superficie);
  border: 1px solid var(--of-borda);
  border-top: 3px solid var(--of-tema);
  border-radius: var(--of-raio);
  padding: 28px;
}

/* Títulos */
body.oa-page .oa-eyebrow,
body.oa-page .oa-product-panel__label,
body.oa-page :is(.oa-mentorias-hero-card-label, .oa-preparacoes-hero-card-label, .oa-product-hero-card-label, .oa-mentorias-form-eyebrow) {
  margin-bottom: 6px;
  color: var(--of-texto-suave) !important;
  font-size: 12px;
  font-weight: 600;
  letter-spacing: 0.05em;
  text-transform: uppercase;
}

body.oa-page .oa-hero-title,
body.oa-page .oa-product-hero .oa-hero-title,
body.oa-page .oa-product-hero__copy .oa-hero-title {
  color: var(--of-texto-titulo) !important;
  font-size: clamp(28px, 4vw, 38px);
  font-weight: 600;
  line-height: 1.15;
  letter-spacing: 0;
  text-transform: none;
}

body.oa-page .oa-hero-sub,
body.oa-page .oa-product-hero .oa-hero-sub,
body.oa-page .oa-product-hero-meta,
body.oa-page .oa-mentorias-hero-meta {
  color: var(--of-texto) !important;
  font-size: 17px;
  font-weight: 400;
}

body.oa-page .oa-section-title,
body.oa-page :is(.oa-mentorias-results-title, .oa-faq-title, .oa-mentorias-form-title) {
  color: var(--of-texto-titulo) !important;
  font-size: clamp(22px, 2.6vw, 28px);
  font-weight: 600;
  line-height: 1.2;
  letter-spacing: 0;
}

body.oa-page :is(.oa-section-intro, .oa-mentorias-section-sub, .oa-faq-section-sub, .oa-preparacoes-intro-text, .oa-product-text) {
  color: var(--of-texto) !important;
  font-size: 16px;
}

body.oa-page :is(.oa-product-section--decision, .oa-product-section--dark, .oa-mentorias-cta) :is(h2, h3, p, li, .oa-eyebrow, .oa-section-title) {
  color: var(--of-texto-titulo);
}

body.oa-page :is(.oa-product-section--decision, .oa-product-section--dark, .oa-mentorias-cta) :is(p, li) {
  color: var(--of-texto) !important;
}

/* Cartões: .ma-bloco */
body.oa-page :is(
  .oa-product-card, .oa-product-feature, .oa-product-approval, .oa-mentorias-card, .oa-home-card,
  .oa-card--minimal, .oa-card--highlight, .oa-result-card, .oa-diff-card, .oa-solution-card,
  .oa-panel-card, .oa-mentorias-compare-card, .oa-mentorias-pillar-card, .oa-mentorias-results-card,
  .oa-preparacoes-card, .oa-faq-item, .oa-faq-category) {
  background: var(--of-superficie) !important;
  border: 1px solid var(--of-borda) !important;
  border-radius: var(--of-raio) !important;
  box-shadow: none !important;
  color: var(--of-texto);
  transition: border-color 0.15s, box-shadow 0.15s;
}

body.oa-page :is(.oa-product-card, .oa-mentorias-card, .oa-preparacoes-card, .oa-home-card, .oa-product-approval):hover {
  border-color: var(--of-borda-forte) !important;
  box-shadow: 0 2px 8px rgba(16, 24, 40, 0.06) !important;
  transform: none;
}

body.oa-page :is(.oa-product-card, .oa-product-feature, .oa-card--minimal, .oa-home-card, .oa-diff-card, .oa-solution-card) {
  padding: 18px 20px;
}

body.oa-page :is(.oa-product-card, .oa-product-feature, .oa-product-approval, .oa-home-card, .oa-card--minimal,
  .oa-diff-card, .oa-solution-card, .oa-mentorias-card, .oa-preparacoes-card) h3,
body.oa-page .oa-card-title {
  color: var(--of-texto-titulo) !important;
  font-size: 17px;
  font-weight: 600;
}

body.oa-page :is(.oa-product-card, .oa-product-feature, .oa-product-approval) p {
  color: var(--of-texto) !important;
  font-size: 15px;
}

/* Destaques: fio amarelo no topo, como o .lstick da plataforma */
body.oa-page :is(.oa-card--highlight, .oa-diff-card--featured) {
  border-top: 3px solid var(--of-tema) !important;
}

/* Imagens dos cards seguem o raio do bloco */
body.oa-page :is(.oa-mentorias-card-image, .oa-preparacoes-card-image) img,
body.oa-page .oa-product-approvals img,
body.oa-page .oa-product-plan__media img {
  border-radius: 6px;
  border: 0;
}

/* Painéis dentro do cabeçalho: .ma-metrica */
body.oa-page :is(.oa-product-panel, .oa-hero-panel, .oa-product-hero-card, .oa-mentorias-hero-card, .oa-preparacoes-hero-card) {
  background: var(--of-superficie-2) !important;
  border: 1px solid var(--of-borda) !important;
  border-radius: var(--of-raio) !important;
  box-shadow: none !important;
  backdrop-filter: none;
  color: var(--of-texto);
}

body.oa-page :is(.oa-product-panel, .oa-hero-panel, .oa-product-hero-card, .oa-mentorias-hero-card, .oa-preparacoes-hero-card) :is(h2, h3, h4, .oa-mentorias-hero-card-title, .oa-preparacoes-hero-card-title, .oa-product-hero-card-title) {
  color: var(--of-texto-titulo) !important;
}

body.oa-page :is(.oa-product-panel, .oa-hero-panel, .oa-product-hero-card, .oa-mentorias-hero-card, .oa-preparacoes-hero-card) :is(p, li, .oa-mentorias-hero-card-text, .oa-preparacoes-hero-card-text) {
  color: var(--of-texto) !important;
}

/* Listas: linhas da .ma-tabela */
body.oa-page .oa-product-list {
  gap: 0;
  overflow: hidden;
  border: 1px solid var(--of-borda);
  border-radius: var(--of-raio);
  background: var(--of-superficie);
}

body.oa-page .oa-product-list__item,
body.oa-page .oa-product-list li {
  position: relative;
  margin: 0;
  padding: 11px 16px 11px 40px;
  border: 0;
  border-radius: 0;
  border-top: 1px solid var(--of-borda);
  background: transparent !important;
  color: var(--of-texto-rotulo) !important;
  font-size: 15px;
}

body.oa-page .oa-product-list > :first-child {
  border-top: 0;
}

body.oa-page .oa-product-list__item::before,
body.oa-page .oa-product-list li::before {
  content: "";
  position: absolute;
  left: 16px;
  top: 50%;
  width: 14px;
  height: 14px;
  margin-top: -7px;
  border-radius: 50%;
  background: var(--of-ok-fundo) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12'%3E%3Cpath d='M3 6.2l2 2 4-4.4' fill='none' stroke='%23087a54' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center / 10px no-repeat;
}

/* Selos: .ma-selo */
body.oa-page :is(.oa-product-tag, .oa-diff-badge, .oa-rfb-banner__badge) {
  display: inline-flex;
  width: fit-content;
  padding: 3px 8px !important;
  border-radius: 4px !important;
  background: var(--of-alerta-fundo) !important;
  color: var(--of-alerta) !important;
  font-size: 11px !important;
  font-weight: 600 !important;
  letter-spacing: 0.04em !important;
  text-transform: uppercase;
}

/* Planos */
body.oa-page .oa-product-plan {
  background: var(--of-superficie) !important;
  border: 1px solid var(--of-borda) !important;
  border-radius: var(--of-raio) !important;
  box-shadow: none !important;
  color: var(--of-texto) !important;
}

body.oa-page .oa-product-plan--highlight {
  border: 2px solid var(--of-tema) !important;
  box-shadow: 0 0 0 4px rgba(var(--of-tema-rgb), 0.12) !important;
}

body.oa-page .oa-product-plan :is(h2, h3, h4, strong) {
  color: var(--of-texto-titulo) !important;
}

body.oa-page .oa-product-plan__header h3 span,
body.oa-page .oa-product-plan__note,
body.oa-page .oa-product-plan__list,
body.oa-page .oa-product-plan__list li,
body.oa-page .oa-product-plan p {
  color: var(--of-texto) !important;
}

body.oa-page .oa-product-plan__list li {
  padding-left: 0;
}

/* FAQ */
body.oa-page .oa-product-faq details {
  border: 1px solid var(--of-borda);
  border-radius: var(--of-raio);
  background: var(--of-superficie);
  box-shadow: none;
}

body.oa-page .oa-product-faq summary,
body.oa-page .oa-faq-trigger {
  color: var(--of-texto-titulo) !important;
  font-weight: 600;
  background: transparent;
}

body.oa-page .oa-faq-trigger:hover {
  background: var(--of-hover);
}

body.oa-page :is(.oa-faq-panel, .oa-product-faq) p {
  color: var(--of-texto) !important;
}

body.oa-page .oa-faq-icon {
  color: var(--of-texto-suave);
}

/* Campos: .ma-busca / .form-control */
body.oa-page :is(.oa-faq-search-input, .oa-mentorias-form-control),
.form-control {
  border: 1px solid var(--of-borda-forte) !important;
  border-radius: var(--of-raio-btn) !important;
  background: var(--of-superficie);
  color: var(--of-texto-titulo);
  box-shadow: none;
}

body.oa-page :is(.oa-faq-search-input, .oa-mentorias-form-control):focus,
.form-control:focus {
  outline: none;
  border-color: var(--of-tema) !important;
  box-shadow: 0 0 0 3px rgba(var(--of-tema-rgb), 0.18) !important;
}

::placeholder {
  color: var(--of-placeholder) !important;
}

body.oa-page .oa-mentorias-form-dialog {
  border: 1px solid var(--of-borda);
  border-radius: 12px;
  box-shadow: var(--of-sombra);
}

/* Banner da Receita Federal (home): bloco branco com a foto à direita */
body.oa-page .oa-rfb-banner {
  max-width: 1232px;
  min-height: 0;
  margin: 24px auto 0;
  border: 1px solid var(--of-borda);
  border-radius: var(--of-raio);
  background: var(--of-superficie);
  color: var(--of-texto);
}

body.oa-page .oa-rfb-banner::before {
  background: linear-gradient(90deg, #fff 0%, #fff 48%, rgba(255, 255, 255, 0.85) 60%, rgba(255, 255, 255, 0) 78%);
}

body.oa-page .oa-rfb-banner__bg {
  left: auto;
  right: 0;
  width: 55%;
  opacity: 1;
}

body.oa-page .oa-rfb-banner__inner {
  padding: 32px 28px;
}

body.oa-page .oa-rfb-banner .oa-rfb-banner__title {
  color: var(--of-texto-titulo);
  font-weight: 600;
}

body.oa-page .oa-rfb-banner .oa-rfb-banner__text,
body.oa-page .oa-rfb-banner .oa-rfb-banner__list li {
  color: var(--of-texto);
}

body.oa-page .oa-rfb-banner__list li::before {
  background: var(--of-tema);
}

body.oa-page .oa-rfb-banner__price {
  color: var(--of-texto-suave);
}

@media (max-width: 767px) {
  body.oa-page .oa-rfb-banner {
    margin: 12px 12px 0;
  }

  body.oa-page .oa-rfb-banner__bg {
    display: none;
  }

  body.oa-page .oa-rfb-banner::before {
    display: none;
  }

  body.oa-page :is(.oa-product-hero, .oa-mentorias-hero, .oa-preparacoes-hero, .oa-faq-hero, .oa-home-hero) > .oa-container,
  body.oa-page :is(.oa-mentorias-cta, .oa-preparacoes-cta, .oa-faq-cta, .oa-cta-final, .oa-home-cta-band, .oa-results-cta, .oa-product-section--decision, .oa-product-section--dark) > .oa-container {
    padding: 20px 16px;
  }
}

/* CTA fixo no rodapé: barra branca da plataforma */
body .oa-sticky-cta {
  background: var(--of-superficie) !important;
  border-top: 1px solid var(--of-borda);
  box-shadow: 0 -2px 12px rgba(16, 24, 40, 0.08) !important;
}

body .oa-sticky-cta__text {
  color: var(--of-texto-titulo) !important;
}

/* Rodapé */
body .oa-footer {
  margin-top: 32px;
  padding: 32px 0 24px;
  background: var(--of-superficie) !important;
  border-top: 1px solid var(--of-borda);
  color: var(--of-texto);
}

body .oa-footer h3 {
  margin-bottom: 8px;
  color: var(--of-texto-suave) !important;
  font-size: 12px;
  font-weight: 600;
  letter-spacing: 0.05em;
  text-transform: uppercase;
}

body .oa-footer a {
  color: var(--of-texto-rotulo) !important;
}

body .oa-footer a:hover {
  color: var(--of-tema-texto) !important;
}

body .oa-footer .footer-copyright,
body .oa-footer small {
  color: var(--of-texto-suave) !important;
  border-color: var(--of-borda) !important;
}

/* ============================================================
   Páginas legadas (tema Bootstrap antigo) — <body class="of-legado">
   Fundos de foto e faixas pretas viram o fundo da plataforma;
   caixas viram blocos brancos; abas viram o controle segmentado (.ma-segmentos).
   ============================================================ */

body.of-legado :is(.main-header, .bg-image-1, .bg-image-2, .parallax, .bg-cinza, .bg-white, .bg-preto2, section, #footer) {
  background: transparent !important;
  background-image: none !important;
  box-shadow: none !important;
}

body.of-legado .main-header {
  min-height: 0 !important;
}

body.of-legado #nav-padding {
  display: none;
}

body.of-legado section,
body.of-legado .section {
  padding-top: 32px !important;
  padding-bottom: 32px !important;
}

/* Texto claro herdado das faixas escuras vira a hierarquia da plataforma */
body.of-legado main :is(.text-white, [style*="color: #fff"], [style*="color:#fff"], [style*="color: white"]),
body.of-legado :is(section, .main-header, .modal) .text-white,
body.of-legado :is(section, .main-header) [style*="color: #fff"],
body.of-legado :is(section, .main-header) [style*="color:#fff"],
body.of-legado :is(section, .main-header) [style*="color: white"] {
  color: var(--of-texto-titulo) !important;
}

body.of-legado :is(h1, h2, h3, h4, h5, h6) {
  color: var(--of-texto-titulo);
  font-weight: 600;
}

body.of-legado :is(p, li, td, label, .mentorias-texto, .texto-depoimento, .campanha-descricao, .sessao-estrategica-paragrafo) {
  color: var(--of-texto);
}

body.of-legado .section-titulo {
  margin-bottom: 24px;
}

body.of-legado .section-titulo > h1 {
  color: var(--of-texto-titulo) !important;
  font-size: clamp(26px, 3.2vw, 34px);
  font-weight: 600;
}

body.of-legado .section-titulo > :is(h4, p) {
  color: var(--of-texto) !important;
  font-size: 17px;
  font-weight: 400;
}

/* Amarelo como texto: usa o tom escuro do tema (legível sobre branco) */
body.of-legado :is(.text-oficina, .text-warning, .nome-aprovado),
body.of-legado [style*="color: #ffb606"],
body.of-legado [style*="color:#ffb606"],
body.of-legado [style*="color: #ffc500"],
body.of-legado [style*="color: rgb(255, 187, 1)"] {
  color: var(--of-tema-texto) !important;
}

body.of-legado .text-success {
  color: var(--of-ok) !important;
}

body.of-legado .text-danger {
  color: var(--of-erro) !important;
}

/* Abas: controle segmentado */
body.of-legado .tabbable-line > .nav-tabs {
  display: inline-flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 2px;
  padding: 3px;
  border-radius: 8px;
  background: #e9eef3;
}

body.of-legado .tabbable-line > .nav-tabs > li {
  margin: 0;
}

body.of-legado .tabbable-line > .nav-tabs > li > a {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 4px;
  padding: 8px 14px !important;
  border-radius: 6px !important;
  background: transparent !important;
  color: var(--of-texto-rotulo) !important;
  font-size: 14px !important;
  font-weight: 600 !important;
}

body.of-legado .tabbable-line > .nav-tabs > li:hover > a {
  background: transparent !important;
  color: var(--of-texto-titulo) !important;
}

body.of-legado .tabbable-line > .nav-tabs > li.active > a,
body.of-legado .tabbable-line > .nav-tabs > li.active:not(.ebook) > a {
  background: var(--of-superficie) !important;
  color: var(--of-tema-texto) !important;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.12);
}

body.of-legado .tabbable-line > .nav-tabs > li.ebook {
  border-right: 0;
}

body.of-legado .tab-content {
  text-align: left;
}

/* Caixas e cartões: .ma-bloco */
body.of-legado :is(.exibicao-produto-2, .exibicao-produto-3, .mentorias-card, .card-diferencial, .campanha-card,
  .item-aprovado, .item-aprovado-depoimento, .questao-card, .card) {
  background: var(--of-superficie) !important;
  border: 1px solid var(--of-borda) !important;
  border-radius: var(--of-raio) !important;
  box-shadow: none !important;
  color: var(--of-texto);
}

body.of-legado :is(.campanha-card, .exibicao-produto-3)::before,
body.of-legado :is(.campanha-card, .exibicao-produto-3)::after {
  display: none !important;
}

body.of-legado .exibicao-produto-1 {
  overflow: hidden;
  border: 1px solid var(--of-borda) !important;
  border-radius: 6px !important;
  background: var(--of-superficie);
}

body.of-legado :is(.exibicao-produto-2-footer, .produto-footer, .exibicao-produto-1-footer) {
  background: var(--of-superficie-2) !important;
  color: var(--of-texto-titulo) !important;
  border-top: 1px solid var(--of-borda);
  border-radius: 0 0 6px 6px !important;
}

body.of-legado .borda::before {
  background: var(--of-borda);
}

body.of-legado img {
  border-radius: 6px;
}

body.of-legado .of-topbar img {
  border-radius: 0;
}

/* Blocos de texto inline com fundo cinza/preto */
body.of-legado [style*="background-color: #f"],
body.of-legado [style*="background: #f"] {
  background: var(--of-superficie) !important;
  border: 1px solid var(--of-borda);
}

/* Botões: .btn-themecolor */
body.of-legado :is(.btn-submit, .btn-send, .bnt, .btn-success, .btn-warning, .btn-primary, .mentorias-btn-principal, .btn-submit-light, .btn-submit-brilho) {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  min-height: 40px;
  padding: 8px 18px !important;
  border: 1px solid var(--of-tema) !important;
  border-radius: var(--of-raio-btn) !important;
  background: var(--of-tema) !important;
  color: var(--of-texto-titulo) !important;
  font-size: 15px !important;
  font-weight: 600 !important;
  text-transform: uppercase;
  box-shadow: none !important;
  animation: none !important;
}

body.of-legado :is(.btn-submit, .btn-send, .bnt, .btn-success, .btn-warning, .btn-primary, .mentorias-btn-principal, .btn-submit-light, .btn-submit-brilho):hover {
  background: var(--of-tema-hover) !important;
  border-color: var(--of-tema-hover) !important;
}

body.of-legado .mentorias-btn-secundario {
  border: 1px solid var(--of-borda-forte) !important;
  border-radius: var(--of-raio-btn) !important;
  background: var(--of-superficie) !important;
  color: var(--of-texto-titulo) !important;
}

/* Modais de vídeo/depoimento: painel branco */
body.of-legado .modal-content,
body.of-legado .modal-content.bg-preto {
  background: var(--of-superficie) !important;
  border: 1px solid var(--of-borda);
  border-radius: 12px;
  box-shadow: var(--of-sombra) !important;
}

body.of-legado .modal-content .close {
  color: var(--of-texto-titulo) !important;
  opacity: 0.6;
}

/* Swiper */
body.of-legado :is(.swiper-button-prev, .swiper-button-next) {
  color: var(--of-tema-texto) !important;
}

body.of-legado .swiper-pagination-bullet-active {
  background: var(--of-tema) !important;
}

/* Ícones SVG amarelos continuam com a cor do tema */
body.of-legado .svg-oficina {
  filter: none;
}

/* Rodapé */
body.of-legado #footer,
body.of-legado footer {
  margin-top: 32px;
  padding: 20px 0 !important;
  background: var(--of-superficie) !important;
  border-top: 1px solid var(--of-borda);
}

body.of-legado .footer-copyright {
  color: var(--of-texto-suave) !important;
}

/* Botão flutuante do WhatsApp mantém o círculo verde original */
body.of-legado .right-side-toggle.btn-success {
  width: 60px;
  min-height: 60px;
  height: 60px;
  padding: 0 !important;
  border-radius: 50% !important;
  border-color: #25d366 !important;
  background: #25d366 !important;
}

body.of-legado .right-side-toggle .fa-whatsapp {
  color: #fff !important;
}

/* Depoimentos e textos que eram brancos sobre foto */
body.of-legado .item-aprovado-depoimento .texto-depoimento,
body.of-legado :is(.bg-image-1, .bg-image-2) :is(p, li, h4, span):not(.btn *) {
  color: var(--of-texto) !important;
}

/* Formulário de inscrição em caixa amarela translúcida: bloco branco */
body.of-legado [style*="background-color:rgba(255,198,0"] {
  background: var(--of-superficie) !important;
  border: 1px solid var(--of-borda);
  border-top: 3px solid var(--of-tema);
  border-radius: var(--of-raio);
}

body.of-legado .botao-inscricao {
  border: 1px solid var(--of-tema) !important;
  border-radius: var(--of-raio-btn) !important;
  background: var(--of-tema) !important;
  color: var(--of-texto-titulo) !important;
  font-weight: 600;
}

body.of-legado .botao-inscricao span {
  color: var(--of-texto-titulo) !important;
  font-size: 17px !important;
}

/* Página de links: cada item é um bloco branco da plataforma */
body.of-legado .link-lista {
  margin-bottom: 8px;
  border: 1px solid var(--of-borda) !important;
  border-radius: var(--of-raio) !important;
  background: var(--of-superficie) !important;
}

body.of-legado .link-lista:hover {
  border-color: var(--of-borda-forte) !important;
}

body.of-legado .link-lista.active {
  border: 1px solid var(--of-tema) !important;
  border-radius: var(--of-raio) !important;
}

body.of-legado .link-lista-titulo,
body.of-legado .link-lista-titulo span {
  color: var(--of-texto-titulo) !important;
  font-size: 17px;
  font-weight: 600;
}

body.of-legado .link-lista span.drop::before,
body.of-legado .link-lista:not(.active):hover span.drop::before,
body.of-legado .link-lista.active span.drop::before {
  background-color: var(--of-texto-suave) !important;
}

body.of-legado .bg-color {
  background: transparent !important;
}

/* Passos numerados ("Como você começa") */
.of-passos {
  margin: 0;
  padding: 0;
  list-style: none;
  counter-reset: of-passo;
}

body.oa-page .of-passos > li {
  position: relative;
  padding-top: 54px;
  counter-increment: of-passo;
}

body.oa-page .of-passos > li::before {
  content: counter(of-passo);
  position: absolute;
  top: 18px;
  left: 20px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 26px;
  height: 26px;
  border-radius: 50%;
  background: rgba(var(--of-tema-rgb), 0.16);
  color: var(--of-tema-texto);
  font-size: 13px;
  font-weight: 700;
}

/* Cards de serviço clicáveis (home) */
body.oa-page a.of-servico,
body.oa-page a.of-servico:hover {
  display: flex;
  flex-direction: column;
  text-decoration: none !important;
}

body.oa-page a.of-servico p {
  flex: 1;
}

body.oa-page .of-servico__link {
  color: var(--of-tema-texto) !important;
  font-size: 14px;
  font-weight: 600;
}

body.oa-page a.of-servico:hover .of-servico__link {
  text-decoration: underline;
}

/* ============================================================
   v2 — A plataforma, atualizada
   Referência: telas redesenhadas do app (aluno/metasemanal: cartões
   de 12px com sombra leve, ícones em círculo, números grandes, anel).
   Sobrepõe as regras anteriores das páginas oa-*.
   ============================================================ */

:root {
  --of-raio-card: 12px;
  --of-sombra-card: 0 1px 3px rgba(16, 24, 40, 0.06);
  --of-sombra-card-hover: 0 10px 28px rgba(16, 24, 40, 0.10);
}

/* ---------- Tipografia ---------- */
body.oa-page {
  font-size: 17px;
  line-height: 1.55;
}

body.oa-page .oa-hero-title,
body.oa-page .oa-product-hero .oa-hero-title,
body.oa-page .oa-product-hero__copy .oa-hero-title {
  font-size: clamp(34px, 5vw, 54px) !important;
  font-weight: 700 !important;
  line-height: 1.06 !important;
  letter-spacing: -0.01em !important;
}

body.oa-page .oa-hero-sub,
body.oa-page .oa-product-hero .oa-hero-sub {
  max-width: 560px;
  font-size: 19px !important;
  line-height: 1.5;
}

body.oa-page .oa-section-title,
body.oa-page :is(.oa-mentorias-results-title, .oa-faq-title) {
  max-width: 760px;
  font-size: clamp(26px, 3.2vw, 36px) !important;
  font-weight: 700 !important;
  line-height: 1.15 !important;
  letter-spacing: -0.005em !important;
}

body.oa-page .oa-section-intro {
  gap: 10px;
  margin-bottom: 36px;
}

body.oa-page .oa-section-intro > p:not(.oa-eyebrow),
body.oa-page :is(.oa-mentorias-section-sub, .oa-faq-section-sub) {
  max-width: 680px;
  font-size: 18px !important;
}

/* Rótulo da seção: selo do tema, como os selos da plataforma */
body.oa-page .oa-eyebrow {
  display: inline-flex;
  align-self: flex-start;
  align-items: center;
  width: fit-content;
  margin: 0 0 4px;
  padding: 4px 10px;
  border-radius: 999px;
  background: rgba(var(--of-tema-rgb), 0.14);
  color: var(--of-tema-texto) !important;
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 0.06em;
}

/* ---------- Faixas: largura total, alternando branco e cinza ---------- */
body.oa-page .oa-main > section,
body.oa-page .oa-product-main > section {
  padding: 72px 0 !important;
}

body.oa-page .oa-main > section:nth-of-type(even),
body.oa-page .oa-product-main > section:nth-of-type(even) {
  background: var(--of-superficie) !important;
}

@media (max-width: 767px) {
  body.oa-page .oa-main > section,
  body.oa-page .oa-product-main > section {
    padding: 48px 0 !important;
  }
}

/* ---------- Hero ---------- */
body.oa-page :is(.oa-product-hero, .oa-mentorias-hero, .oa-preparacoes-hero, .oa-faq-hero, .oa-home-hero) {
  position: relative;
  padding: 64px 0 72px !important;
  background:
    radial-gradient(720px 360px at 88% -10%, rgba(var(--of-tema-rgb), 0.18), transparent 65%),
    radial-gradient(520px 300px at -5% 110%, rgba(var(--of-tema-rgb), 0.08), transparent 60%),
    var(--of-superficie) !important;
  border-bottom: 1px solid var(--of-borda) !important;
}

body.oa-page :is(.oa-product-hero, .oa-mentorias-hero, .oa-preparacoes-hero, .oa-faq-hero, .oa-home-hero) > .oa-container {
  background: transparent !important;
  border: 0 !important;
  border-radius: 0 !important;
  padding: 0 20px !important;
}

body.oa-page .oa-hero-grid {
  align-items: center;
  gap: 48px;
}

body.oa-page .oa-hero-copy {
  gap: 18px;
}

body.oa-page .oa-hero-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  margin-top: 6px;
}

body.oa-page .oa-hero-actions .oa-btn {
  min-height: 50px;
  padding: 12px 24px;
  font-size: 16px;
}

.of-hero-nota {
  display: flex;
  align-items: center;
  gap: 6px;
  margin: 0;
  color: var(--of-texto-suave) !important;
  font-size: 14px;
}

.of-hero-nota .mdi {
  color: var(--of-tema-texto);
  font-size: 18px;
}

/* Painel lateral do hero: cartão de destaque */
body.oa-page :is(.oa-product-panel, .oa-hero-panel > .oa-panel-card, .oa-mentorias-hero-card, .oa-preparacoes-hero-card, .oa-product-hero-card) {
  padding: 24px !important;
  border-radius: 16px !important;
  background: var(--of-superficie) !important;
  box-shadow: var(--of-sombra-card-hover) !important;
}

body.oa-page .oa-product-panel .oa-list,
body.oa-page .oa-hero-panel .oa-list {
  display: grid;
  gap: 12px;
  margin: 8px 0 0;
  padding: 0;
  list-style: none;
}

body.oa-page .oa-product-panel .oa-list li,
body.oa-page .oa-hero-panel .oa-list li {
  position: relative;
  padding-left: 30px;
  color: var(--of-texto-rotulo) !important;
  font-size: 16px;
}

body.oa-page .oa-product-panel .oa-list li::before,
body.oa-page .oa-hero-panel .oa-list li::before {
  content: "\F012C";
  position: absolute;
  left: 0;
  top: 1px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 20px;
  height: 20px;
  border-radius: 50%;
  background: var(--of-ok-fundo);
  color: var(--of-ok);
  font: normal 13px/1 "Material Design Icons";
}

/* ---------- Ícones em círculo (.ms-card-icone) ---------- */
.of-icone {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  width: 44px;
  height: 44px;
  margin-bottom: 14px;
  border-radius: 50%;
  background: rgba(var(--of-tema-rgb), 0.14);
  color: var(--of-tema-texto);
  font-size: 22px;
  line-height: 1;
}

/* ---------- Cartões ---------- */
body.oa-page :is(
  .oa-product-card, .oa-product-feature, .oa-product-approval, .oa-mentorias-card, .oa-home-card,
  .oa-card--minimal, .oa-card--highlight, .oa-result-card, .oa-diff-card, .oa-solution-card,
  .oa-mentorias-compare-card, .oa-mentorias-pillar-card, .oa-mentorias-results-card, .oa-preparacoes-card) {
  border-radius: var(--of-raio-card) !important;
  box-shadow: var(--of-sombra-card) !important;
  transition: transform 0.18s ease, box-shadow 0.18s ease, border-color 0.18s ease;
}

body.oa-page :is(.oa-product-card, .oa-product-feature, .oa-home-card, .oa-diff-card, .oa-card--minimal) {
  padding: 24px !important;
}

body.oa-page :is(.oa-product-card, .oa-product-feature, .oa-mentorias-card, .oa-preparacoes-card, .oa-home-card, .oa-product-approval, .oa-diff-card):hover {
  transform: translateY(-2px);
  border-color: var(--of-borda) !important;
  box-shadow: var(--of-sombra-card-hover) !important;
}

body.oa-page :is(.oa-product-card, .oa-product-feature, .oa-home-card, .oa-diff-card, .oa-mentorias-card, .oa-preparacoes-card) h3,
body.oa-page .oa-card-title {
  margin: 0 0 6px;
  font-size: 19px !important;
  font-weight: 700 !important;
  line-height: 1.25;
}

body.oa-page :is(.oa-product-card, .oa-product-feature, .oa-home-card, .oa-diff-card) p {
  margin: 0;
  font-size: 16px !important;
  line-height: 1.5;
}

/* Ilustrações antigas dos cards da home saem: o ícone em círculo assume o papel */
body.oa-page .oa-home-card.oa-card--minimal .oa-icon-wrapper {
  display: none;
}

/* Grades com respiro */
body.oa-page :is(.oa-product-grid, .oa-home-grid, .oa-mentorias-grid) {
  gap: 20px !important;
}

/* ---------- Passos numerados ---------- */
body.oa-page .of-passos > li {
  padding-top: 24px !important;
}

body.oa-page .of-passos > li::before {
  position: static;
  display: inline-flex;
  margin-bottom: 14px;
  width: 44px;
  height: 44px;
  background: var(--of-tema);
  color: var(--of-texto-titulo);
  font-size: 18px;
}

@media (min-width: 1024px) {
  body.oa-page .of-passos {
    position: relative;
  }

  body.oa-page .of-passos::before {
    content: "";
    position: absolute;
    top: 46px;
    left: 12%;
    right: 12%;
    height: 2px;
    background: repeating-linear-gradient(90deg, rgba(var(--of-tema-rgb), 0.5) 0 8px, transparent 8px 16px);
    z-index: 0;
  }

  body.oa-page .of-passos > li {
    z-index: 1;
  }
}

/* ---------- Lista de benefícios: grade de itens com check ---------- */
body.oa-page .oa-product-list {
  display: grid !important;
  grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
  gap: 12px !important;
  overflow: visible;
  border: 0;
  background: transparent;
}

body.oa-page .oa-product-list__item,
body.oa-page .oa-product-list li {
  display: flex;
  align-items: center;
  min-height: 56px;
  padding: 14px 16px 14px 52px !important;
  border: 1px solid var(--of-borda) !important;
  border-radius: var(--of-raio-card) !important;
  background: var(--of-superficie) !important;
  box-shadow: var(--of-sombra-card);
  color: var(--of-texto-titulo) !important;
  font-size: 16px !important;
  font-weight: 600;
}

body.oa-page .oa-product-list__item::before,
body.oa-page .oa-product-list li::before {
  left: 16px !important;
  width: 24px !important;
  height: 24px !important;
  margin-top: -12px !important;
  background-size: 13px !important;
}

/* ---------- Depoimentos ---------- */
body.oa-page .oa-product-approval {
  display: flex;
  flex-direction: column;
  padding: 0 !important;
  overflow: hidden;
}

body.oa-page .oa-product-approval img {
  width: 100%;
  aspect-ratio: 16 / 9;
  object-fit: cover;
  border-radius: 0 !important;
}

body.oa-page .oa-product-approval h3 {
  margin: 18px 22px 4px !important;
  font-size: 18px !important;
}

body.oa-page .oa-product-approval p {
  position: relative;
  margin: 0 22px 22px !important;
  padding-left: 26px;
  font-style: italic;
}

body.oa-page .oa-product-approval p::before {
  content: "\F0757";
  position: absolute;
  left: 0;
  top: 0;
  color: var(--of-tema);
  font: normal 20px/1 "Material Design Icons";
}

/* ---------- Planos: tabela de preços ---------- */
body.oa-page #planos .oa-product-grid {
  align-items: stretch;
  max-width: 920px;
}

body.oa-page .oa-product-plan {
  position: relative;
  display: flex !important;
  flex-direction: column;
  gap: 18px;
  padding: 32px 28px !important;
  border-radius: 16px !important;
  box-shadow: var(--of-sombra-card) !important;
}

body.oa-page .oa-product-plan--highlight {
  box-shadow: 0 0 0 4px rgba(var(--of-tema-rgb), 0.15), var(--of-sombra-card-hover) !important;
}

body.oa-page .oa-product-plan--highlight::before {
  content: "Mais vantajoso";
  position: absolute;
  top: -13px;
  left: 28px;
  padding: 4px 12px;
  border-radius: 999px;
  background: var(--of-tema);
  color: var(--of-texto-titulo);
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}

body.oa-page .oa-product-plan__media {
  display: none;
}

body.oa-page .oa-product-plan__header h3 {
  margin: 10px 0 4px !important;
  font-size: 40px !important;
  font-weight: 700 !important;
  line-height: 1.05;
  letter-spacing: -0.01em;
}

body.oa-page .oa-product-plan__header h3 span {
  font-size: 18px !important;
  font-weight: 600;
  color: var(--of-texto-suave) !important;
}

body.oa-page .oa-product-plan__list {
  flex: 1;
  display: grid;
  align-content: start;
  gap: 10px;
  padding: 18px 0 0 !important;
  border-top: 1px solid var(--of-borda);
}

body.oa-page .oa-product-plan__list li {
  position: relative;
  padding-left: 28px !important;
  font-size: 15px !important;
}

body.oa-page .oa-product-plan__list li::before {
  content: "\F012C";
  position: absolute;
  left: 0;
  top: 1px;
  color: var(--of-ok);
  font: normal 18px/1 "Material Design Icons";
}

body.oa-page .oa-product-plan .oa-btn {
  width: 100%;
  min-height: 52px;
  font-size: 16px;
}

/* ---------- FAQ ---------- */
body.oa-page .oa-product-faq {
  display: grid;
  gap: 10px;
  max-width: 860px;
}

body.oa-page .oa-product-faq details {
  margin: 0 !important;
  padding: 0 !important;
  border-radius: var(--of-raio-card) !important;
  box-shadow: var(--of-sombra-card) !important;
  overflow: hidden;
}

body.oa-page .oa-product-faq summary {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  padding: 18px 20px;
  font-size: 17px;
}

body.oa-page .oa-product-faq summary:hover {
  background: var(--of-hover);
}

body.oa-page .oa-product-faq summary::after {
  content: "\F0140" !important;
  float: none !important;
  flex-shrink: 0;
  color: var(--of-texto-suave);
  font: normal 22px/1 "Material Design Icons" !important;
  transition: transform 0.2s;
}

body.oa-page .oa-product-faq details[open] summary::after {
  content: "\F0140" !important;
  transform: rotate(180deg);
}

body.oa-page .oa-product-faq details p {
  margin: 0 !important;
  padding: 0 20px 20px;
  font-size: 16px !important;
}

/* ---------- CTA final: faixa amarela (cor do topo da plataforma) ---------- */
body.oa-page :is(#cta-final, .oa-cta-final, .oa-mentorias-cta, .oa-preparacoes-cta, .oa-faq-cta, .oa-home-cta-band) {
  background:
    radial-gradient(600px 300px at 90% 0%, rgba(255, 255, 255, 0.25), transparent 60%),
    var(--of-tema) !important;
  border: 0 !important;
}

body.oa-page :is(#cta-final, .oa-cta-final, .oa-mentorias-cta, .oa-preparacoes-cta, .oa-faq-cta, .oa-home-cta-band) > .oa-container {
  background: transparent !important;
  border: 0 !important;
  padding: 0 20px !important;
}

body.oa-page :is(#cta-final, .oa-cta-final, .oa-mentorias-cta, .oa-preparacoes-cta, .oa-faq-cta, .oa-home-cta-band) :is(h2, h3, .oa-section-title) {
  color: var(--of-texto-titulo) !important;
}

body.oa-page :is(#cta-final, .oa-cta-final, .oa-mentorias-cta, .oa-preparacoes-cta, .oa-faq-cta, .oa-home-cta-band) p:not(.oa-eyebrow) {
  color: #3d3200 !important;
}

body.oa-page :is(#cta-final, .oa-cta-final, .oa-mentorias-cta, .oa-preparacoes-cta, .oa-faq-cta, .oa-home-cta-band) .oa-eyebrow {
  background: rgba(255, 255, 255, 0.55);
  color: var(--of-texto-titulo) !important;
}

body.oa-page :is(#cta-final, .oa-cta-final, .oa-mentorias-cta, .oa-preparacoes-cta, .oa-faq-cta, .oa-home-cta-band) .oa-btn--primary {
  background: var(--of-texto-titulo) !important;
  border-color: var(--of-texto-titulo) !important;
  color: #fff !important;
}

body.oa-page :is(#cta-final, .oa-cta-final, .oa-mentorias-cta, .oa-preparacoes-cta, .oa-faq-cta, .oa-home-cta-band) .oa-btn--primary:hover {
  background: #000 !important;
}

body.oa-page :is(#cta-final, .oa-cta-final, .oa-mentorias-cta, .oa-preparacoes-cta, .oa-faq-cta, .oa-home-cta-band) .oa-btn--ghost {
  background: transparent !important;
  border-color: var(--of-texto-titulo) !important;
  color: var(--of-texto-titulo) !important;
}

/* ---------- Home: prévia da tela do aluno ---------- */
.of-previa {
  margin: 0;
  border: 1px solid var(--of-borda);
  border-radius: 16px;
  background: var(--of-superficie);
  box-shadow: 0 24px 60px rgba(16, 24, 40, 0.14);
  overflow: hidden;
}

.of-previa__topo {
  display: flex;
  align-items: center;
  gap: 12px;
  height: 44px;
  padding: 0 16px;
  background: var(--of-tema);
  color: #fff;
  font-size: 15px;
  font-weight: 700;
}

.of-previa__pontos {
  display: inline-flex;
  gap: 5px;
}

.of-previa__pontos i {
  width: 9px;
  height: 9px;
  border-radius: 50%;
  background: rgba(255, 255, 255, 0.55);
}

.of-previa__corpo {
  display: grid;
  gap: 14px;
  padding: 18px;
  background: var(--of-fundo);
}

.of-previa__meta {
  display: flex;
  align-items: center;
  gap: 16px;
  padding: 16px;
  border: 1px solid var(--of-borda);
  border-radius: 12px;
  background: var(--of-superficie);
}

.of-previa small {
  display: block;
  color: var(--of-texto) !important;
  font-size: 13px;
  font-weight: 600;
}

.of-previa strong {
  display: block;
  color: var(--of-texto-titulo);
  font-size: 26px;
  line-height: 1.15;
}

.of-previa strong span {
  color: var(--of-texto-suave);
  font-size: 15px;
}

.of-previa__sub {
  font-size: 12.5px;
  font-weight: 600;
}

.of-previa__sub.ok {
  color: var(--of-ok);
}

.of-anel {
  width: 64px;
  height: 64px;
  flex-shrink: 0;
  transform: rotate(-90deg);
}

.of-anel circle {
  fill: none;
  stroke-width: 7;
}

.of-anel__trilha {
  stroke: #e9eef3;
}

.of-anel__valor {
  stroke: var(--of-ok);
  stroke-linecap: round;
}

.of-previa__stats {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 10px;
}

.of-previa__stats > div {
  padding: 12px;
  border: 1px solid var(--of-borda);
  border-radius: 12px;
  background: var(--of-superficie);
}

.of-previa__stats .of-icone {
  width: 32px;
  height: 32px;
  margin-bottom: 8px;
  font-size: 17px;
}

.of-previa__stats strong {
  font-size: 20px;
}

.of-previa__lista {
  display: grid;
  gap: 6px;
  margin: 0;
  padding: 10px 12px;
  border: 1px solid var(--of-borda);
  border-radius: 12px;
  background: var(--of-superficie);
  list-style: none;
}

.of-previa__lista li {
  display: flex;
  align-items: center;
  gap: 8px;
  color: var(--of-texto-rotulo) !important;
  font-size: 14px;
}

.of-previa__lista .mdi {
  color: var(--of-borda-forte);
  font-size: 18px;
}

.of-previa__lista li.feito {
  color: var(--of-texto-suave) !important;
  text-decoration: line-through;
}

.of-previa__lista li.feito .mdi {
  color: var(--of-ok);
}

.of-previa figcaption {
  padding: 8px 16px;
  border-top: 1px solid var(--of-borda);
  color: var(--of-texto-suave);
  font-size: 12px;
  text-align: center;
}

/* Faixa "Como funciona" logo abaixo do hero */
body.oa-page .of-faixa-passos {
  padding: 0 !important;
  background: transparent !important;
}

.of-passos-linha {
  position: relative;
  z-index: 2;
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 20px;
  margin: -36px 0 0;
  padding: 0;
  list-style: none;
}

.of-passos-linha li {
  display: flex;
  gap: 14px;
  padding: 20px;
  border: 1px solid var(--of-borda);
  border-radius: var(--of-raio-card);
  background: var(--of-superficie);
  box-shadow: var(--of-sombra-card-hover);
}

.of-passos-linha .of-icone {
  margin: 0;
}

.of-passos-linha strong {
  display: block;
  margin-bottom: 2px;
  color: var(--of-texto-titulo);
  font-size: 18px;
}

.of-passos-linha p {
  margin: 0;
  font-size: 15px !important;
}

@media (max-width: 900px) {
  .of-passos-linha {
    grid-template-columns: 1fr;
    margin-top: 24px;
  }
}

@media (max-width: 480px) {
  .of-previa__stats {
    gap: 6px;
  }

  .of-previa__stats > div {
    padding: 8px;
  }

  .of-previa__stats strong {
    font-size: 16px;
  }
}

/* ---------- Banner Receita Federal na home ---------- */
body.oa-page .oa-rfb-banner {
  max-width: none;
  margin: 0 auto;
  border: 0;
  border-bottom: 1px solid var(--of-borda);
  border-radius: 0;
}

body.oa-page .oa-rfb-banner .oa-rfb-banner__title {
  font-size: clamp(26px, 3.4vw, 38px) !important;
  font-weight: 700 !important;
}

/* ---------- Rodapé ---------- */
body .oa-footer {
  margin-top: 0;
  padding: 48px 0 24px;
}

body .oa-footer .oa-footer-grid {
  gap: 32px;
}

body .oa-footer .footer-copyright {
  margin-top: 32px;
  padding-top: 20px;
  border-top: 1px solid var(--of-borda);
  text-align: left;
}

/* ---------- v2: ajustes de layout ---------- */

/* Faixas de largura total (o .oa-main antigo tinha respiro lateral) */
body.oa-page .oa-main,
body.oa-page .oa-product-main {
  padding: 0 !important;
}

/* O contêiner do painel do hero não é um cartão; só o conteúdo dele */
body.oa-page .oa-hero-panel,
body.oa-page .oa-product-hero__panel {
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

/* Cards de método da home: leitura alinhada à esquerda */
body.oa-page :is(.oa-card--minimal, .oa-home-card, .oa-diff-card) {
  text-align: left !important;
}

body.oa-page :is(.oa-card--minimal, .oa-home-card, .oa-diff-card) > * {
  margin-left: 0 !important;
  margin-right: 0 !important;
}

/* CTA final: centralizado, título forte */
body.oa-page :is(#cta-final, .oa-cta-final, .oa-mentorias-cta, .oa-preparacoes-cta, .oa-faq-cta, .oa-home-cta-band) {
  text-align: center;
}

body.oa-page :is(#cta-final, .oa-cta-final, .oa-mentorias-cta, .oa-preparacoes-cta, .oa-faq-cta, .oa-home-cta-band) .oa-container > * {
  margin-left: auto;
  margin-right: auto;
}

body.oa-page :is(#cta-final, .oa-cta-final, .oa-mentorias-cta, .oa-preparacoes-cta, .oa-faq-cta, .oa-home-cta-band) :is(h2, .oa-section-title) {
  max-width: 760px;
  margin: 0 auto 12px !important;
  font-size: clamp(28px, 3.6vw, 42px) !important;
  font-weight: 700 !important;
  line-height: 1.12 !important;
}

body.oa-page :is(#cta-final, .oa-cta-final, .oa-mentorias-cta, .oa-preparacoes-cta, .oa-faq-cta, .oa-home-cta-band) :is(.oa-product-cta-final, .oa-section-intro) {
  align-items: center;
  gap: 12px;
}

body.oa-page :is(#cta-final, .oa-cta-final, .oa-mentorias-cta, .oa-preparacoes-cta, .oa-faq-cta, .oa-home-cta-band) .oa-eyebrow {
  align-self: center;
}

body.oa-page :is(#cta-final, .oa-cta-final, .oa-mentorias-cta, .oa-preparacoes-cta, .oa-faq-cta, .oa-home-cta-band) p:not(.oa-eyebrow) {
  max-width: 620px;
  margin: 0 auto;
  font-size: 18px !important;
}

body.oa-page :is(#cta-final, .oa-cta-final, .oa-mentorias-cta, .oa-preparacoes-cta, .oa-faq-cta, .oa-home-cta-band) :is(.oa-hero-actions, .oa-mentorias-cta-actions) {
  justify-content: center;
  margin-top: 16px;
}

body.oa-page :is(#cta-final, .oa-cta-final, .oa-mentorias-cta, .oa-preparacoes-cta, .oa-faq-cta, .oa-home-cta-band) .oa-btn {
  min-height: 52px;
  padding: 12px 26px;
}

/* FAQ: título à esquerda, perguntas à direita */
@media (min-width: 1024px) {
  body.oa-page #faq > .oa-container {
    display: grid;
    grid-template-columns: minmax(260px, 1fr) 1.7fr;
    gap: 56px;
    align-items: start;
  }

  body.oa-page #faq .oa-section-intro {
    position: sticky;
    top: 92px;
    margin: 0;
  }

  body.oa-page #faq .oa-product-faq {
    max-width: none;
  }
}

/* Rodapé alinhado ao contêiner */
body .oa-footer > .oa-container,
body .oa-footer .oa-footer-grid {
  padding-left: 20px !important;
  padding-right: 20px !important;
}

/* ---------- v2: reset e planos ---------- */
html body {
  margin: 0 !important;
}

body.oa-page *,
body.oa-page *::before,
body.oa-page *::after {
  box-sizing: border-box;
}

/* Seções de decisão (planos) e escuras deixam de ser caixa: os cartões fazem o papel */
body.oa-page :is(.oa-product-section--decision, .oa-product-section--dark):not(#cta-final) > .oa-container {
  padding: 0 20px !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
}

/* Planos centralizados na faixa */
body.oa-page #planos .oa-section-intro {
  align-items: center;
  text-align: center;
}

body.oa-page #planos .oa-section-intro .oa-eyebrow {
  align-self: center;
}

body.oa-page #planos .oa-section-title {
  margin: 0 auto;
}

body.oa-page #planos .oa-product-grid {
  margin: 0 auto;
}

/* Faixa de passos colada ao hero */
body.oa-page .oa-main > section.of-faixa-passos {
  padding: 0 0 8px !important;
  background: transparent !important;
}

/* ---------- v2: páginas legadas no mesmo padrão ---------- */
body.of-legado {
  font-size: 17px;
  line-height: 1.55;
}

body.of-legado *,
body.of-legado *::before,
body.of-legado *::after {
  box-sizing: border-box;
}

body.of-legado section,
body.of-legado .section {
  padding-top: 56px !important;
  padding-bottom: 56px !important;
}

body.of-legado section:nth-of-type(even) {
  background: var(--of-superficie) !important;
}

body.of-legado .section-titulo > h1,
body.of-legado .section-titulo > h2 {
  font-size: clamp(28px, 3.6vw, 40px) !important;
  font-weight: 700 !important;
  line-height: 1.12;
  letter-spacing: -0.005em;
}


body.of-legado :is(.exibicao-produto-2, .exibicao-produto-3, .mentorias-card, .card-diferencial, .campanha-card,
  .item-aprovado, .item-aprovado-depoimento, .questao-card, .card, .link-lista) {
  border-radius: var(--of-raio-card) !important;
  box-shadow: var(--of-sombra-card) !important;
}

body.of-legado :is(.exibicao-produto-2, .card-diferencial, .mentorias-card, .campanha-card) {
  padding: 28px !important;
}

body.of-legado :is(.mentorias-card, .card-diferencial, .item-aprovado):hover {
  box-shadow: var(--of-sombra-card-hover) !important;
}

body.of-legado .exibicao-produto-1 {
  border-radius: var(--of-raio-card) !important;
  box-shadow: var(--of-sombra-card);
}

body.of-legado h2 strong,
body.of-legado h2 {
  font-weight: 700;
}

body.of-legado .tabbable-line > .nav-tabs {
  padding: 4px;
  border-radius: 12px;
}

body.of-legado .tabbable-line > .nav-tabs > li > a {
  border-radius: 9px !important;
}

body.of-legado :is(.btn-submit, .btn-send, .bnt, .btn-success, .btn-warning, .btn-primary, .mentorias-btn-principal, .btn-submit-light, .btn-submit-brilho, .botao-inscricao) {
  min-height: 48px;
  padding: 10px 22px !important;
}

body.of-legado .form-control {
  min-height: 46px;
  padding: 10px 14px;
  border-radius: 8px !important;
  font-size: 16px;
}

body.of-legado .form .form-group label,
body.of-legado label {
  color: var(--of-texto-rotulo);
  font-weight: 600;
}

/* O topo não depende do box-sizing de cada página */
.of-topbar,
.of-topbar *,
.of-topbar *::before,
.of-topbar *::after {
  box-sizing: border-box;
}

.of-topbar__brand img:first-child {
  width: 28px !important;
  height: 32px !important;
}

.of-topbar__brand img + img {
  width: auto !important;
  height: 30px !important;
  max-width: 140px;
}

.of-topbar__inner {
  min-width: 0;
  max-width: 100%;
}

/* Nenhuma página rola na horizontal (ex.: faixas de texto rolante das landings) */
html,
body {
  overflow-x: clip;
}

/* ---------- v2: página de Dúvidas ---------- */
body.oa-page .oa-faq-category {
  margin: 40px 0 14px !important;
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  color: var(--of-texto-titulo) !important;
  font-size: 22px !important;
  font-weight: 700 !important;
}

body.oa-page .oa-faq-category:first-of-type {
  margin-top: 0 !important;
}

body.oa-page .oa-faq-accordion {
  display: grid;
  gap: 10px;
  max-width: 900px;
}

body.oa-page .oa-faq-item {
  margin: 0 !important;
  overflow: hidden;
  box-shadow: var(--of-sombra-card) !important;
}

body.oa-page .oa-faq-item:hover {
  transform: none;
}

body.oa-page .oa-faq-trigger {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  width: 100%;
  padding: 18px 20px !important;
  border: 0;
  text-align: left;
  font-size: 17px !important;
  cursor: pointer;
}

body.oa-page .oa-faq-panel {
  padding: 0 20px !important;
  color: var(--of-texto) !important;
  font-size: 16px;
  line-height: 1.6;
}

body.oa-page .oa-faq-search-input {
  min-height: 48px;
  padding: 12px 16px !important;
  font-size: 16px;
}

body.oa-page .oa-faq-trigger[aria-expanded="true"] + .oa-faq-panel {
  padding-bottom: 20px !important;
}

body.oa-page .oa-faq-item {
  padding: 0 !important;
}

body.oa-page .oa-faq-panel {
  margin: 0 !important;
}

/* ---------- v3: preço em destaque pela parcela ---------- */
body.oa-page .of-preco-parc {
  display: block;
  margin-bottom: 2px;
  color: var(--of-texto-suave) !important;
  font-size: 17px !important;
  font-weight: 600 !important;
  letter-spacing: 0;
}

body.oa-page .oa-product-plan__note {
  color: var(--of-texto-suave) !important;
  font-size: 14px !important;
}

body.oa-page .oa-product-plan--highlight[data-selo]::before {
  content: attr(data-selo);
}

/* Linha de preço e garantia abaixo dos botões do hero */
.of-hero-nota {
  flex-wrap: wrap;
  gap: 8px 18px !important;
}

.of-hero-nota__item {
  display: inline-flex;
  align-items: center;
  gap: 6px;
}

.of-hero-nota__item:first-child {
  color: var(--of-texto-titulo);
  font-weight: 600;
}

/* Preço de entrada nos cards de oferta */
body.oa-page .of-card-preco,
body.oa-page .of-servico__preco {
  display: block;
  margin: 12px 0 14px !important;
  color: var(--of-texto-titulo) !important;
  font-size: 20px !important;
  font-weight: 700;
  line-height: 1.2;
}

body.oa-page .of-card-preco span {
  display: block;
  color: var(--of-texto-suave);
  font-size: 13px;
  font-weight: 600;
}

body.oa-page .of-servico__preco {
  margin: 14px 0 10px !important;
  font-size: 17px !important;
}

/* Cards de mentoria e preparação: botão sempre no rodapé do card */
body.oa-page :is(.oa-mentorias-card, .oa-preparacoes-card) {
  display: flex !important;
  flex-direction: column;
}

body.oa-page :is(.oa-mentorias-card, .oa-preparacoes-card) > p:not(.of-card-preco) {
  flex: 1;
}

body.oa-page :is(.oa-mentorias-card, .oa-preparacoes-card) > .oa-btn {
  width: 100%;
}

body.oa-page .of-prep-card {
  padding: 24px !important;
}

/* Topo alinhado ao conteúdo (mesma largura e respiro do .oa-container) */
.of-topbar__inner {
  max-width: 1280px;
  padding: 0 20px !important;
}


/* ============================================================
   Tema escuro — valores da plataforma
   (assets/scss/dark.scss, layout.scss .oficinadark, shared/admin-ui.css)
   Ativado por html.of-escuro (js/tema.js), só nas páginas que carregam tema.js.
   ============================================================ */

/* Botão lua/sol no topo (.lt-icone) */
.of-tema-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  width: 38px;
  height: 38px;
  margin-right: 4px;
  border: 0;
  border-radius: 50%;
  background: transparent;
  color: #fff;
  font-size: 20px;
  cursor: pointer;
  order: 2;
  transition: background 0.15s;
}

.of-tema-btn:hover,
.of-tema-btn:focus-visible {
  background: rgba(255, 255, 255, 0.16);
  outline: none;
}

.of-topbar__links {
  order: 1;
}

.of-topbar__menu-btn {
  order: 3;
}

@media (min-width: 1024px) {
  .of-tema-btn {
    margin: 0 0 0 6px;
  }
}

html.of-escuro {
  color-scheme: dark;
  --of-tema-texto: #ffc94d;
  --of-fundo: #07090b;
  --of-superficie: #0f1215;
  --of-superficie-2: #161a1f;
  --of-hover: #1a1f25;
  --of-borda: rgba(255, 255, 255, 0.08);
  --of-borda-forte: rgba(255, 255, 255, 0.18);
  --of-sombra: 0 8px 24px rgba(0, 0, 0, 0.45);
  --of-sombra-topo: 0 1px 0 rgba(255, 255, 255, 0.04), 0 2px 8px rgba(0, 0, 0, 0.4);
  --of-sombra-card: 0 1px 3px rgba(0, 0, 0, 0.4);
  --of-sombra-card-hover: 0 10px 28px rgba(0, 0, 0, 0.5);

  --of-texto-titulo: #f2f5f7;
  --of-texto-rotulo: #d3dbe1;
  --of-texto: #b3bcc5;
  --of-texto-suave: #85919c;
  --of-placeholder: #616d78;

  --of-alerta: #ffc163;
  --of-alerta-fundo: rgba(255, 178, 43, 0.16);
  --of-ok: #52dcae;
  --of-ok-fundo: rgba(6, 215, 156, 0.16);
  --of-erro: #ff8a87;
  --of-erro-fundo: rgba(239, 83, 80, 0.2);

  background: var(--of-fundo);
}

/* Topo: tom do .oficinadark */
html.of-escuro .of-topbar {
  background: #be8600;
}

html.of-escuro .of-atalho.ativo {
  background: rgba(0, 0, 0, 0.28);
  color: #fff !important;
}

@media (max-width: 1023px) {
  html.of-escuro .of-atalho.ativo {
    background: rgba(var(--of-tema-rgb), 0.16);
    color: var(--of-tema-texto) !important;
  }
}

/* Selos e ícones em círculo ganham contraste no escuro */
html.of-escuro body.oa-page .oa-eyebrow,
html.of-escuro .of-icone {
  background: rgba(var(--of-tema-rgb), 0.16);
}

/* Botões claros */
html.of-escuro body .oa-btn--ghost,
html.of-escuro body .oa-btn--ghost:visited {
  background: transparent !important;
  color: var(--of-texto-titulo) !important;
}

html.of-escuro body .oa-btn--primary,
html.of-escuro body .oa-btn--primary:visited {
  color: #1d2b36 !important;
}

/* Hero: brilho do tema mais discreto */
html.of-escuro body.oa-page :is(.oa-product-hero, .oa-mentorias-hero, .oa-preparacoes-hero, .oa-faq-hero, .oa-home-hero) {
  background:
    radial-gradient(720px 360px at 88% -10%, rgba(var(--of-tema-rgb), 0.12), transparent 65%),
    var(--of-superficie) !important;
}

/* Banner da Receita Federal: degradê sobre a foto passa a ser escuro */
html.of-escuro body.oa-page .oa-rfb-banner::before {
  background: linear-gradient(90deg, #0f1215 0%, #0f1215 48%, rgba(15, 18, 21, 0.85) 60%, rgba(15, 18, 21, 0) 78%);
}

/* CTA final: faixa no tom do topo escuro */
html.of-escuro body.oa-page :is(#cta-final, .oa-cta-final, .oa-mentorias-cta, .oa-preparacoes-cta, .oa-faq-cta, .oa-home-cta-band) {
  background: #be8600 !important;
}

html.of-escuro body.oa-page :is(#cta-final, .oa-cta-final, .oa-mentorias-cta, .oa-preparacoes-cta, .oa-faq-cta, .oa-home-cta-band) :is(h2, h3, .oa-section-title) {
  color: #fff !important;
}

html.of-escuro body.oa-page :is(#cta-final, .oa-cta-final, .oa-mentorias-cta, .oa-preparacoes-cta, .oa-faq-cta, .oa-home-cta-band) p:not(.oa-eyebrow) {
  color: rgba(255, 255, 255, 0.85) !important;
}

html.of-escuro body.oa-page :is(#cta-final, .oa-cta-final, .oa-mentorias-cta, .oa-preparacoes-cta, .oa-faq-cta, .oa-home-cta-band) .oa-btn--primary {
  background: #0f1215 !important;
  border-color: #0f1215 !important;
  color: #fff !important;
}

html.of-escuro body.oa-page :is(#cta-final, .oa-cta-final, .oa-mentorias-cta, .oa-preparacoes-cta, .oa-faq-cta, .oa-home-cta-band) .oa-btn--ghost {
  border-color: #fff !important;
  color: #fff !important;
}

/* Prévia da tela do aluno */
html.of-escuro .of-anel__trilha {
  stroke: rgba(255, 255, 255, 0.1);
}

html.of-escuro .of-previa__topo {
  background: #be8600;
}

/* Imagens de capa claras não estouram no escuro */
html.of-escuro body.oa-page :is(.oa-mentorias-card-image, .oa-preparacoes-card-image) {
  filter: brightness(0.9);
}

/* Planos: selo e destaque */
html.of-escuro body.oa-page .oa-product-plan--highlight {
  box-shadow: 0 0 0 4px rgba(var(--of-tema-rgb), 0.2), var(--of-sombra-card-hover) !important;
}

/* Campos */
html.of-escuro body.oa-page :is(.oa-faq-search-input, .oa-mentorias-form-control),
html.of-escuro .form-control {
  background: #14181c !important;
  color: var(--of-texto-titulo) !important;
}

/* Rodapé e barra fixa */
html.of-escuro body .oa-footer,
html.of-escuro body .oa-sticky-cta {
  background: var(--of-superficie) !important;
}

/* Logos: a versão do topo já é branca; a do formulário de mentorias usa a clara */
html.of-escuro body.oa-page .oa-mentorias-form-dialog {
  background: var(--of-superficie) !important;
  color: var(--of-texto) !important;
}

/* Ilustrações de traço escuro: inverte a luminosidade e preserva o tom */
html.of-escuro body.oa-page .oa-icon-wrapper img,
html.of-escuro body.oa-page .oa-card-icon {
  filter: invert(1) hue-rotate(180deg) brightness(1.1);
}

body.oa-page .oa-diff-card .oa-card-title,
body.oa-page .oa-diff-card .oa-diff-badge {
  text-align: left !important;
  align-self: flex-start;
}

body.oa-page .oa-diff-card {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
}

body.oa-page .oa-diff-card .oa-diff-badge {
  margin-bottom: 8px;
}

body.oa-page .oa-diff-card {
  justify-content: flex-start !important;
  gap: 0 !important;
}

body.oa-page .oa-diff-card .oa-card-title {
  margin: 0 0 6px !important;
}

body.oa-page .oa-diff-card p {
  margin: 0 !important;
}

/* ---------- Página de cursos ---------- */
body.oa-page .of-cursos {
  align-items: stretch;
}

body.oa-page .of-curso {
  display: flex !important;
  flex-direction: column;
  padding: 0 !important;
  overflow: hidden;
}

body.oa-page .of-curso__capa {
  display: block;
  width: 100%;
  aspect-ratio: 3 / 2;
  object-fit: cover;
  border-bottom: 1px solid var(--of-borda);
}

body.oa-page .of-curso__corpo {
  display: flex;
  flex: 1;
  flex-direction: column;
  padding: 20px 22px 22px;
}

body.oa-page .of-curso__corpo > p:not(.of-curso__tag):not(.of-card-preco) {
  flex: 1;
  margin: 0 !important;
  font-size: 15.5px !important;
}

body.oa-page .of-curso__tag {
  display: inline-flex;
  width: fit-content;
  margin: 0 0 10px !important;
  padding: 3px 8px;
  border-radius: 4px;
  background: var(--of-alerta-fundo);
  color: var(--of-alerta) !important;
  font-size: 11px !important;
  font-weight: 700;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}

body.oa-page .of-curso h3 {
  margin: 0 0 8px !important;
  font-size: 19px !important;
  line-height: 1.25;
}

body.oa-page .of-curso .of-card-preco {
  margin: 18px 0 14px !important;
  font-size: 26px !important;
}

body.oa-page .of-curso .of-card-preco small {
  display: block;
  margin-top: 2px;
  color: var(--of-texto-suave);
  font-size: 13px;
  font-weight: 600;
}

body.oa-page .of-curso .oa-btn {
  width: 100%;
}

/* Assinatura de discursivas: texto escuro sobre amarelo e marca do hero nos dois temas */
body:has(.offer-card) .brand {
  color: var(--of-texto-titulo);
}

body:has(.offer-card) .promo :is(h2, p, p b, .promo-big, .promo-big small),
body:has(.offer-card) .bar .disc,
body:has(.offer-card) .btn,
body:has(.offer-card) .who-item .check {
  color: #1d2b36 !important;
}

body:has(.offer-card) .pill {
  color: var(--of-texto);
}

/* ---------- Página do curso gratuito (Receita Federal) ---------- */
.of-capa-curso {
  display: block;
  overflow: hidden;
  border-radius: 16px;
  box-shadow: 0 24px 60px rgba(16, 24, 40, 0.18);
  transition: transform 0.2s;
}

.of-capa-curso:hover {
  transform: translateY(-2px);
}

.of-capa-curso img {
  display: block;
  width: 100%;
  height: auto;
}

.of-professor {
  display: grid;
  grid-template-columns: minmax(200px, 300px) 1fr;
  gap: 40px;
  align-items: center;
}

.of-professor__foto {
  width: 100%;
  aspect-ratio: 1;
  object-fit: cover;
  object-position: top;
  border-radius: 16px;
  background: var(--of-superficie-2);
}

.of-professor .oa-section-title {
  margin: 6px 0 4px !important;
}

.of-professor > div > p:not(.oa-eyebrow) {
  margin: 0 0 18px;
  font-size: 18px;
}

.of-inscricao {
  display: grid;
  grid-template-columns: 1fr minmax(320px, 460px);
  gap: 48px;
  align-items: start;
}

.of-inscricao__passos {
  display: grid;
  gap: 18px;
  margin: 24px 0 0;
  padding: 0;
  list-style: none;
}

.of-inscricao__passos li {
  display: flex;
  gap: 14px;
}

.of-inscricao__passos .of-icone {
  margin: 0;
}

.of-inscricao__passos strong {
  display: block;
  color: var(--of-texto-titulo);
  font-size: 18px;
}

.of-inscricao__passos p {
  margin: 2px 0 0;
  font-size: 16px !important;
}

body.oa-page .of-inscricao__card {
  padding: 28px !important;
  border-top: 3px solid var(--of-tema) !important;
}

body.oa-page .of-inscricao__card:hover {
  transform: none;
}

.of-inscricao__card h3 {
  margin: 0 0 18px !important;
  font-size: 22px !important;
}

.of-inscricao__card .form-group {
  margin-bottom: 14px;
}

.of-inscricao__card label {
  display: block;
  margin-bottom: 6px;
  color: var(--of-texto-rotulo);
  font-size: 15px;
  font-weight: 600;
}

.of-inscricao__card .form-control {
  width: 100%;
  min-height: 46px;
  padding: 10px 14px;
  font-size: 16px;
}

.of-inscricao__card .of-check {
  display: flex;
  align-items: center;
  gap: 10px;
}

.of-inscricao__card .of-check label {
  margin: 0;
  font-weight: 400;
  color: var(--of-texto);
}

.of-inscricao__card .of-check input {
  width: 18px;
  height: 18px;
  accent-color: var(--of-tema);
  flex-shrink: 0;
}

.of-inscricao__botao {
  width: 100%;
  min-height: 52px !important;
  margin-top: 6px;
  font-size: 16px !important;
}

@media (max-width: 900px) {
  .of-professor,
  .of-inscricao {
    grid-template-columns: 1fr;
    gap: 28px;
  }

  .of-professor__foto {
    max-width: 260px;
  }
}

/* Âncoras internas não ficam escondidas atrás do topo fixo */
section[id],
[id="pagina-receita-form"] {
  scroll-margin-top: 76px;
}

/* ============================================================
   WhatsApp — botão flutuante único e botões internos
   ============================================================ */
.of-whats {
  position: fixed;
  right: 20px;
  bottom: 20px;
  z-index: 1020;
  display: inline-flex;
  align-items: center;
  gap: 10px;
  height: 56px;
  padding: 0 22px 0 16px;
  border-radius: 999px;
  background: #25d366;
  color: #fff !important;
  font-family: var(--of-fonte);
  font-size: 16px;
  font-weight: 700;
  text-decoration: none !important;
  box-shadow: 0 10px 24px rgba(16, 24, 40, 0.22);
  transition: transform 0.18s ease, background 0.18s ease, box-shadow 0.18s ease;
}

.of-whats:hover,
.of-whats:focus-visible {
  background: #1ebe5b;
  color: #fff !important;
  transform: translateY(-2px);
  box-shadow: 0 14px 30px rgba(16, 24, 40, 0.28);
  outline: none;
}

.of-whats:focus-visible {
  box-shadow: 0 0 0 3px #fff, 0 0 0 6px #25d366;
}

.of-whats .mdi {
  font-size: 28px;
  line-height: 1;
}

.of-whats__texto {
  color: #fff !important;
  white-space: nowrap;
}

/* Celular: só o ícone, para não cobrir o conteúdo */
@media (max-width: 767px) {
  .of-whats {
    right: 16px;
    bottom: 16px;
    width: 56px;
    padding: 0;
    justify-content: center;
  }

  .of-whats__texto {
    position: absolute;
    width: 1px;
    height: 1px;
    overflow: hidden;
    clip: rect(0 0 0 0);
  }

  /* acima da barra fixa de CTA quando ela aparece */
  body:has(.oa-sticky-cta.is-visible) .of-whats {
    bottom: 84px;
  }
}

html.of-escuro .of-whats {
  box-shadow: 0 10px 24px rgba(0, 0, 0, 0.5);
}

/* Botões de WhatsApp dentro das páginas: ícone verde à esquerda */
body .oa-btn[href*="api.whatsapp.com"] .mdi-whatsapp {
  margin-right: 2px;
  color: #1ebe5b;
  font-size: 20px;
  line-height: 1;
}

/* Na faixa amarela do CTA final, o ícone acompanha o texto */
body.oa-page :is(#cta-final, .oa-cta-final, .oa-mentorias-cta, .oa-preparacoes-cta, .oa-faq-cta, .oa-home-cta-band) .oa-btn[href*="api.whatsapp.com"] .mdi-whatsapp {
  color: inherit;
}