/* Ponte entre a marcação do Elementor e o CSS da landing (black2026.css).
   Carregada só na página da Black 2026, depois do kit global do cliente.
   Faz duas coisas: neutraliza o que o Elementor impõe (espaçamentos, fontes e
   cores dos widgets) e cobre os pontos em que o widget acrescenta um invólucro
   que o HTML estático não tem. */

/* ---- containers: viram caixas neutras; o layout é das classes da landing ----
   Só variáveis. Declarar propriedades aqui faria a ponte vencer a landing. */
body.cvb-pagina .e-con,
body.cvb-pagina .e-con-inner {
  --padding-top: 0px; --padding-right: 0px; --padding-bottom: 0px; --padding-left: 0px;
  --margin-top: 0px; --margin-right: 0px; --margin-bottom: 0px; --margin-left: 0px;
  --gap: 0px; --row-gap: 0px; --column-gap: 0px;
  --widgets-spacing: 0px; --widgets-spacing-row: 0px; --widgets-spacing-column: 0px;
  --width: 100%; --content-width: 100%; --min-height: 0;
}
body.cvb-pagina .elementor-widget:not(:last-child) { margin-block-end: 0; }
body.cvb-pagina .elementor-widget-container { display: contents; }

/* ---- tipografia: o miolo do widget herda do invólucro, que leva a nossa classe ----
   Os títulos h1–h4 voltam para a Nippo (no estático isso vinha do seletor de
   elemento). :where() mantém estas regras abaixo das da landing (.tier h3…). */
body.cvb-pagina .elementor-heading-title,
body.cvb-pagina :where(.elementor-widget-text-editor) {
  font-family: inherit; font-size: inherit; font-weight: inherit; line-height: inherit;
  letter-spacing: inherit; text-transform: inherit; color: inherit; margin: 0;
}
body.cvb-pagina :where(h1, h2, h3, h4).elementor-heading-title {
  font-family: var(--f-display); font-weight: 600; line-height: 1.02;
  letter-spacing: .015em; text-transform: uppercase;
}
/* Onde a caixa de texto é grid (lede__body, manifesto__side) o gap já separa os
   parágrafos; nas demais, a margem faz o papel do gap do estático. */
body.cvb-pagina .news__text .elementor-widget-text-editor p + p,
body.cvb-pagina .gift__body .elementor-widget-text-editor p + p { margin-top: 18px; }

/* Títulos cujo conteúdo é uma linha de itens: no estático os spans eram filhos
   diretos da caixa flex; aqui há o h/p do widget no meio. */
body.cvb-pagina .hero__kicker .elementor-heading-title,
body.cvb-pagina .final__stat .elementor-heading-title,
body.cvb-pagina .win__badge .elementor-heading-title { display: contents; }

/* ---- imagens: o invólucro do widget toma o lugar do <img> do estático ---- */
body.cvb-pagina .elementor-widget-image { text-align: left; line-height: 0; }
body.cvb-pagina .hero__bg img,
body.cvb-pagina .final__bg img,
body.cvb-pagina .prof__img img,
body.cvb-pagina .win__img img { height: 100%; }
/* Brinde: as duas fotos preenchem a célula da grade (proporção 6/5 da caixa). */
body.cvb-pagina .gift__media > .elementor-widget { --cut: 14px; }
body.cvb-pagina .gift__media img { height: 100%; }
body.cvb-pagina .win__photo { height: 100%; }
body.cvb-pagina .mystery__bust img { height: 100%; width: auto; max-width: none; }
body.cvb-pagina .art__icon { width: 34%; opacity: .9; }
body.cvb-pagina .art__icon img { width: 100%; height: auto; }
body.cvb-pagina .signoff img { margin-inline: auto; }

/* ---- vídeo do Sistema de Times ---- */
body.cvb-pagina .art--video .elementor-widget-video,
body.cvb-pagina .art--video .elementor-wrapper { position: static; aspect-ratio: auto; }

/* ---- botões: o widget de botão veste a nossa .btn ----
   A classe fica no invólucro (é ele que leva o chanfro e o brilho); o link
   interno é esticado por cima dele para a área clicável ser o botão inteiro. */
body.cvb-pagina .elementor-widget-button { display: inline-flex; width: auto; max-width: 100%; }
body.cvb-pagina .elementor-widget-button .elementor-button-wrapper { display: contents; }
body.cvb-pagina .elementor-widget-button .elementor-button {
  font: inherit; letter-spacing: inherit; text-transform: inherit; color: inherit;
  background: none; padding: 0; border: 0; border-radius: 0; line-height: inherit; fill: currentColor;
  box-shadow: none;
}
body.cvb-pagina .elementor-widget-button .elementor-button:hover,
body.cvb-pagina .elementor-widget-button .elementor-button:focus { color: inherit; background: none; }
body.cvb-pagina .elementor-widget-button.btn .elementor-button::after,
body.cvb-pagina .elementor-widget-button.tier__alt .elementor-button::after { content: ""; position: absolute; inset: 0; }
body.cvb-pagina .elementor-widget-button.tier__alt { position: relative; }
body.cvb-pagina .tier--hot .elementor-widget-button.btn { display: flex; }
body.cvb-pagina .hero__cta { justify-items: center; }

/* Botão com o quadradinho da seta (no estático: <span class="btn__ic"><svg>). */
body.cvb-pagina .btn--icon .elementor-button-content-wrapper { display: inline-flex; align-items: center; gap: 16px; }
body.cvb-pagina .btn--icon .elementor-button-content-wrapper::after {
  content: ""; width: 32px; height: 32px; flex: none;
  background:
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23F4F1EF' stroke-width='2.2' stroke-linecap='square'%3E%3Cpath d='M5 12h13M13 6l6 6-6 6'/%3E%3C/svg%3E") center / 15px no-repeat,
    var(--black);
  clip-path: polygon(0 0, calc(100% - 7px) 0, 100% 7px, 100% 100%, 7px 100%, 0 calc(100% - 7px));
  transition: background-color .25s var(--ease);
}

/* ---- planos: os ícones ✓ / ✗ do estático eram <svg> dentro do item ---- */
body.cvb-pagina .tier li { display: block; position: relative; padding-left: 34px; }
body.cvb-pagina .tier li::before {
  content: ""; position: absolute; left: 0; top: 2px; width: 22px; height: 22px;
  background: var(--red-hot);
  -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='none' stroke='%23000' stroke-width='2.4' d='m5 12.5 4.5 4.5L19 7.5'/%3E%3C/svg%3E") center / contain no-repeat;
          mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='none' stroke='%23000' stroke-width='2.4' d='m5 12.5 4.5 4.5L19 7.5'/%3E%3C/svg%3E") center / contain no-repeat;
}
body.cvb-pagina .tier li.is-off::before {
  background: var(--dim);
  -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='none' stroke='%23000' stroke-width='2' d='m7 7 10 10M17 7 7 17'/%3E%3C/svg%3E");
          mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='none' stroke='%23000' stroke-width='2' d='m7 7 10 10M17 7 7 17'/%3E%3C/svg%3E");
}
body.cvb-pagina .tier__spacer { visibility: hidden; }
@media (max-width: 860px) { body.cvb-pagina .tier__spacer { display: none; } }

/* ---- brinde: o caminhãozinho do frete (no estático, um <svg>) ---- */
body.cvb-pagina .gift__note::before {
  content: ""; width: 18px; height: 18px; flex: none; background: var(--red-hot);
  -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.8' stroke-linejoin='round'%3E%3Cpath d='M2 6h12v10H2zM14 9h4l4 4v3h-8z'/%3E%3Ccircle cx='6' cy='18' r='1.8'/%3E%3Ccircle cx='18' cy='18' r='1.8'/%3E%3C/svg%3E") center / contain no-repeat;
          mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.8' stroke-linejoin='round'%3E%3Cpath d='M2 6h12v10H2zM14 9h4l4 4v3h-8z'/%3E%3Ccircle cx='6' cy='18' r='1.8'/%3E%3Ccircle cx='18' cy='18' r='1.8'/%3E%3C/svg%3E") center / contain no-repeat;
}

/* ---- seções: a borda entre seções do estático (.section + .section) ---- */
body.cvb-pagina .elementor > .e-con.section + .e-con.section { border-top: 1px solid var(--line); }

/* ---- carrossel: a caixa do Elementor é flex em coluna por padrão ---- */
body.cvb-pagina .team__track { --flex-direction: row; flex-direction: row; flex-wrap: nowrap; }

/* ---- larguras: a caixa do Elementor estica (--width: 100%) e o widget tem um
   max-width: 100% de especificidade alta (.elementor.elementor .e-con > …) ---- */
body.cvb-pagina .hero__cta,
body.cvb-pagina .signoff { --width: auto; }
body.cvb-pagina .elementor.elementor .e-con > .hero__sub { max-width: 44ch; }
body.cvb-pagina .elementor.elementor .e-con > .lede__body { max-width: 52ch; }

/* ---- hero: marcação do vídeo de abertura (o play é um SVG do plugin) ---- */
body.cvb-pagina .elementor-widget-image.hero__play { background: none; clip-path: none; }
body.cvb-pagina .hero__play img { width: 100%; height: 100%; }
body.cvb-pagina .hero__video, body.cvb-pagina .hero__copy { --width: auto; }

/* ---- tudo que você terá acesso: ícone do card como <img> ---- */
body.cvb-pagina .access__icon img { width: 100%; height: auto; }
body.cvb-pagina .access__item .elementor-widget-text-editor { color: var(--mute); }

/* ---- FAQ: o acordeão do Elementor veste o visual dos <details> do estático ---- */
body.cvb-pagina .faq__list .elementor-accordion { display: grid; gap: 8px; }
body.cvb-pagina .faq__list .elementor-accordion-item {
  border: 0; background: var(--card); box-shadow: inset 0 0 0 1px var(--line); padding-inline: 24px;
  transition: box-shadow .25s var(--ease);
}
body.cvb-pagina .faq__list .elementor-accordion-item:has(.elementor-active) { box-shadow: inset 0 0 0 1px var(--line-red); }
body.cvb-pagina .faq__list .elementor-tab-title {
  display: flex; justify-content: space-between; align-items: center; gap: 20px;
  padding: 20px 0; border: 0; background: none; cursor: pointer;
  font-family: var(--f-display); font-weight: 600; font-size: clamp(17px, 1.4vw, 20px);
  text-transform: uppercase; letter-spacing: .03em; line-height: 1.15; color: var(--white);
}
body.cvb-pagina .faq__list .elementor-tab-title a,
body.cvb-pagina .faq__list .elementor-tab-title a:hover { color: inherit; font: inherit; }
body.cvb-pagina .faq__list .elementor-accordion-icon { display: none; }
body.cvb-pagina .faq__list .elementor-tab-title::after { content: "+"; order: 2; flex: none; font-family: var(--f-mono); font-weight: 400; color: var(--red-hot); font-size: 24px; line-height: 1; }
body.cvb-pagina .faq__list .elementor-tab-title.elementor-active::after { content: "−"; }
body.cvb-pagina .faq__list .elementor-tab-content { border: 0; padding: 0 0 22px; color: var(--mute); max-width: 70ch; }
@media (max-width: 560px) { body.cvb-pagina .faq__list .elementor-accordion-item { padding-inline: 18px; } }
body.cvb-pagina .elementor.elementor .e-con > .faq__list { max-width: 860px; width: 100%; margin-inline: auto; }

/* No estático as margens do .lede e do .final__stat se fundem (fluxo de bloco);
   na caixa flex do Elementor elas somariam. */
body.cvb-pagina .lede + .final__stat { margin-top: 0; }

/* ---- cards de acesso: a tela do recurso é um widget de imagem ---- */
/* A tela abre ao lado do card e é mais larga que ele: tira o max-width: 100%
   que o Elementor impõe aos widgets dentro de caixas. */
body.cvb-pagina .elementor.elementor .e-con > .access__shot { max-width: none; }

/* ---- oferta (modelo do checkout) ---- */
body.cvb-pagina .elementor-widget-button.plan__cta { display: flex; width: 100%; }
body.cvb-pagina .plan__bonus-img img { width: 100%; height: auto; }
body.cvb-pagina .plan__list .elementor-widget-container,
body.cvb-pagina .plan__list ul { display: grid; gap: 12px; }
/* nome e preço lado a lado: as caixas não podem esticar a 100% */
body.cvb-pagina .plan__id, body.cvb-pagina .plan__price { --width: auto; }
/* a faixa "Mais vantajoso" vai de borda a borda do card (margens negativas) */
body.cvb-pagina .elementor.elementor .e-con > .plan__flag { width: auto; max-width: none; }
/* O hero é caixa flex do Elementor com quebra de linha: sem isto, a fileira de
   professores (bem mais larga que a tela) alargava o hero no celular. */
body.cvb-pagina .hero { --flex-wrap: nowrap; flex-wrap: nowrap; }
/* hero em duas colunas: o texto de apoio alinha à esquerda junto com o resto */
body.cvb-pagina .elementor.elementor .e-con > .hero__sub { margin-inline: 0; }
@media (max-width: 860px) { body.cvb-pagina .elementor.elementor .e-con > .hero__sub { margin-inline: auto; } }