/*
 * Ajustes da pgv do Claude que NÃO passam pelo SASS.
 *
 * 🔴 Por que este arquivo existe, e por que não se corrige no SASS.
 *
 * A fonte da página é `sass/sass/pages/_pg-vendas-claude-2.scss`, e o bundle
 * servido é `sass/css/pg-vendas-claude-2/style.css`. O `package.json` do SASS
 * **não tem** um `build:pg-vendas-claude-2`, e reconstruir com o `sass` puro
 * NÃO reproduz o arquivo commitado: medido em 21/08/2026, o rebuild sai 606
 * bytes menor e perde `-moz-appearance`, `-webkit-text-decoration` e o
 * `background-color: transparent` que virou `rgba(0,0,0,0)`. Ou seja, o CSS em
 * produção passou por um autoprefixer que não está no comando do repositório —
 * então um rebuild aqui **tiraria prefixo de navegador do arquivo inteiro**
 * para corrigir três linhas.
 *
 * Enquanto o pipeline não for reproduzível, correção pontual entra por aqui, e
 * é o mesmo desenho que a pgv do Excel (`pg-vendas-lp/pg-vendas-excel.css`) e a
 * do Python (`pg-vendas-elementor/pg-vendas-python-bem.css`) já usam.
 *
 * ⚠️ Ao mexer no SASS desta página, mexa aqui também — ou o efeito não chega ao
 * ar.
 */

/* ==========================================================================
 * Hero redesenhado exclusivo da Jornada
 * ========================================================================== */

body.pgv-claude.pgv-claude--jornada .hero-claude {
    margin: 0;
    border-radius: 0;
    background: #000;
    padding: 6.4rem 3.2rem !important;
}

body.pgv-claude.pgv-claude--jornada .hero-claude .container {
    max-width: 104rem;
    gap: 2.4rem;
}

body.pgv-claude.pgv-claude--jornada .hero-claude__logo-canto {
    position: absolute;
    top: 0;
    right: 0;
    z-index: 1;
    width: clamp(18rem, 22vw, 32.4rem);
    max-width: none;
    pointer-events: none;
}

body.pgv-claude.pgv-claude--jornada .hero-claude__video-chamada {
    position: relative;
    z-index: 2;
    width: min(100%, 59.5rem);
    padding: 1.3rem 2.4rem;
    border: 1px solid transparent;
    border-radius: 999px;
    background:
        linear-gradient(#000, #000) padding-box,
        linear-gradient(
            90.15deg,
            rgba(129, 128, 128, 0.2) 25.42%,
            #818080 49.96%,
            rgba(129, 128, 128, 0.4) 66.6%,
            rgba(129, 128, 128, 0.2) 82.39%
        ) border-box;
    color: #ad9f9a;
    font-family: "Bricolage Grotesque", sans-serif;
    font-size: 1.8rem;
    line-height: 1.2;
    text-align: center;
    text-wrap: balance;
}

body.pgv-claude.pgv-claude--jornada .hero-claude__video-area {
    position: relative;
    z-index: 1;
    width: 100%;
    max-width: 80rem;
}

body.pgv-claude.pgv-claude--jornada .hero-claude__video-blur {
    position: absolute;
    top: 50%;
    left: 50%;
    z-index: 0;
    width: 165%;
    max-width: none;
    transform: translate(-50%, -50%);
    pointer-events: none;
}

body.pgv-claude.pgv-claude--jornada .hero-claude__wrapper-video {
    position: relative;
    z-index: 1;
    max-width: none;
    border: 1px solid #d97757;
    background: #000;
    box-sizing: border-box;
}

body.pgv-claude.pgv-claude--jornada .hero-claude__video {
    position: absolute;
    inset: 0;
    z-index: 1;
    background: #000;
}

/*
 * A capa vale tambem na /curso-claude sem fonte (lespera) desde 28/09/2026. O hero dela
 * e o `hero-claude--aula`, o mesmo da aula, que nao tem capa; a especificidade e a da
 * regra da Jornada, entao as duas capas se comportam igual.
 */
body.pgv-claude.pgv-claude--jornada .hero-claude__video-capa,
body.pgv-claude .hero-claude--aula .hero-claude__video-capa {
    position: absolute;
    inset: 0;
    z-index: 3;
    display: grid;
    overflow: hidden;
    place-items: center;
    background: #000;
    cursor: pointer;
}

body.pgv-claude.pgv-claude--jornada .hero-claude__video-capa[hidden],
body.pgv-claude .hero-claude--aula .hero-claude__video-capa[hidden] {
    display: none;
}

body.pgv-claude.pgv-claude--jornada .hero-claude__video-capa::after,
body.pgv-claude .hero-claude--aula .hero-claude__video-capa::after {
    content: "";
    position: absolute;
    inset: 0;
    z-index: 2;
    background: rgba(0, 0, 0, 0.18);
    transition: background-color 180ms ease;
}

body.pgv-claude.pgv-claude--jornada .hero-claude__video-capa img,
body.pgv-claude .hero-claude--aula .hero-claude__video-capa img {
    position: absolute;
    inset: 0;
    z-index: 1;
    width: 100%;
    height: 100%;
    max-width: none;
    object-fit: cover;
    transition: transform 240ms ease;
}

body.pgv-claude.pgv-claude--jornada .hero-claude__video-capa:hover::after,
body.pgv-claude.pgv-claude--jornada .hero-claude__video-capa:focus-visible::after,
body.pgv-claude .hero-claude--aula .hero-claude__video-capa:hover::after,
body.pgv-claude .hero-claude--aula .hero-claude__video-capa:focus-visible::after {
    background: rgba(0, 0, 0, 0.08);
}

body.pgv-claude.pgv-claude--jornada .hero-claude__video-capa:hover img,
body.pgv-claude.pgv-claude--jornada .hero-claude__video-capa:focus-visible img,
body.pgv-claude .hero-claude--aula .hero-claude__video-capa:hover img,
body.pgv-claude .hero-claude--aula .hero-claude__video-capa:focus-visible img {
    transform: scale(1.02);
}

body.pgv-claude.pgv-claude--jornada .hero-claude__video-capa:focus-visible,
body.pgv-claude .hero-claude--aula .hero-claude__video-capa:focus-visible {
    outline: 2px solid #fff;
    outline-offset: -4px;
}

body.pgv-claude.pgv-claude--jornada .hero-claude__subtitulo {
    position: relative;
    z-index: 2;
    font-size: 1.8rem;
    text-align: center;
}

body.pgv-claude.pgv-claude--jornada .curso-rating {
    display: none !important;
}

body.pgv-claude.pgv-claude--jornada .hero-claude__divisor {
    display: block;
    width: 100%;
    margin-top: -1px;
    background: linear-gradient(
        to bottom,
        #000 0%,
        #000 59.5%,
        #f7f1ea 59.5%,
        #f7f1ea 100%
    );
    line-height: 0;
}

body.pgv-claude.pgv-claude--jornada .hero-claude__divisor img {
    width: 100%;
    height: auto;
    max-width: none;
}

body.pgv-claude .objetivos__decoracao {
    position: absolute;
    bottom: 0;
    left: 50%;
    z-index: 0;
    width: min(92vw, 177rem);
    max-width: none;
    transform: translate(-50%, 20%);
    pointer-events: none;
}

body.pgv-claude .objetivos {
    padding-bottom: 20rem;
}

body.pgv-claude .objetivos > .container {
    position: relative;
    z-index: 1;
    max-width: 120rem;
}

body.pgv-claude .objetivos__titulo {
    font-weight: 700;
}

body.pgv-claude .formacao {
    background: #151312;
}

body.pgv-claude .formacao__wrapper-textos {
    max-width: 93rem;
    text-wrap: pretty;
}

body.pgv-claude .formacao__titulo {
    color: #000;
}

body.pgv-claude .formacao__numero {
    color: #d97757;
}

body.pgv-claude .formacao__card {
    position: relative;
    overflow: hidden;
    isolation: isolate;
    padding: 3.9rem;
}

body.pgv-claude .formacao__card::after {
    content: "";
    position: absolute;
    top: 0;
    right: 0;
    z-index: 0;
    width: min(45.8rem, 100%);
    aspect-ratio: 458 / 360;
    background: url("/wp-content/themes/hashtag/desenvolvimento_hashtag/assets/imgs/pg-vendas-claude-2/efeito-formacao.svg") top right / contain no-repeat;
    pointer-events: none;
}

body.pgv-claude .formacao__card > * {
    position: relative;
    z-index: 1;
}

body.pgv-claude .formacao__lista {
    flex-flow: column;
}

body.pgv-claude .formacao__lista li {
    font-weight: 700;
}

body.pgv-claude .diferenciais__cards {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    width: 100%;
    max-width: 114rem;
    margin-inline: auto;
}

body.pgv-claude .diferenciais__texto {
    color: #000;
}

body.pgv-claude .diferenciais__conteudo {
    display: flex;
    flex-direction: column;
    gap: 1.6rem;
}

body.pgv-claude .garantia {
    position: relative;
    isolation: isolate;
}

body.pgv-claude .garantia__efeito {
    position: absolute;
    top: 42%;
    left: 50%;
    z-index: 0;
    width: min(116rem, 100%);
    max-width: none;
    transform: translate(-50%, -50%);
    pointer-events: none;
}

body.pgv-claude .garantia > .container {
    position: relative;
    z-index: 1;
}

body.pgv-claude .garantia__paragrafo {
    line-height: 1.6;
    text-wrap: pretty;
}

body.pgv-claude .garantia__paragrafo:first-of-type {
    max-width: 72rem;
}

body.pgv-claude .garantia__paragrafo:nth-of-type(2) {
    max-width: 74rem;
}

body.pgv-claude .hashtag__paragrafo {
    font-size: 1.7rem;
    line-height: 1.6;
    font-weight: 400;
}

body.pgv-claude.pgv-claude--jornada .hero-claude .botao,
body.pgv-claude .objetivos .botao,
body.pgv-claude .formacao .botao,
body.pgv-claude .diferenciais .botao,
body.pgv-claude .oferta .botao {
    background:
        radial-gradient(
            56.84% 210.31% at 50% 100%,
            #1f9d55 0%,
            rgba(31, 157, 85, 0) 79%
        ),
        linear-gradient(0deg, #177a42, #177a42);
    border: 1px solid #1f9d55;
    box-shadow: 0 0 30px 0 #31985d96;
}

@media (min-width: 48em) {
    body.pgv-claude .diferenciais__conteudo {
        margin: 0 1.6rem 1.6rem;
    }

    body.pgv-claude .divisor-secao--publico {
        padding-bottom: 9rem;
    }

    body.pgv-claude .publico__lista {
        max-width: 35rem;
    }

    body.pgv-claude .ementa__numero {
        padding-inline: 4rem;
    }
}

@media (max-width: 47.9375em) {
    body.pgv-claude.pgv-claude--jornada .hero-claude {
        padding: 5.2rem 2rem !important;
    }

    body.pgv-claude.pgv-claude--jornada .hero-claude .container {
        gap: 2rem;
    }

    body.pgv-claude.pgv-claude--jornada .hero-claude__logo-canto {
        width: 16rem;
    }

    body.pgv-claude.pgv-claude--jornada .hero-claude__video-chamada {
        padding: 1.1rem 1.8rem;
    }

    body.pgv-claude .objetivos {
        padding-bottom: 10rem;
    }

    body.pgv-claude .formacao__card {
        padding: 2.5rem;
    }

    body.pgv-claude .diferenciais__cards {
        grid-template-columns: 1fr;
        max-width: 55.7rem;
    }

}

@media (prefers-reduced-motion: reduce) {
    body.pgv-claude.pgv-claude--jornada .hero-claude__video-capa::after,
    body.pgv-claude.pgv-claude--jornada .hero-claude__video-capa img,
    body.pgv-claude .hero-claude--aula .hero-claude__video-capa::after,
    body.pgv-claude .hero-claude--aula .hero-claude__video-capa img {
        transition: none;
    }
}

/* ==========================================================================
 * A primeira dobra em tela baixa
 *
 * Em telas desktop baixas, cada versão reduz o padding no elemento que o
 * controla: `.hero-claude` na Jornada e `.hero__interno` no hero original.
 * ========================================================================== */

@media (max-height: 720px) and (min-width: 769px) {
    body.pgv-claude.pgv-claude--jornada .hero-claude {
        padding-top: 4.6rem !important;
        padding-bottom: 4.6rem !important;
    }

    body.pgv-claude:not(.pgv-claude--jornada) .hero-claude .hero__interno {
        padding-top: 4.6rem;
        padding-bottom: 4.6rem;
    }
}

@media (max-height: 650px) and (min-width: 769px) {
    body.pgv-claude.pgv-claude--jornada .hero-claude {
        padding-top: 3.2rem !important;
        padding-bottom: 3.2rem !important;
    }

    body.pgv-claude:not(.pgv-claude--jornada) .hero-claude .hero__interno {
        padding-top: 3.2rem;
        padding-bottom: 3.2rem;
    }

    /*
     * A headline é o segundo maior bloco da dobra. `clamp` em vez de um valor fixo
     * porque a faixa de altura é contínua: 633px e 649px não merecem o mesmo
     * corte, e um degrau seco aparece como salto de tipografia ao redimensionar.
     *
     * 🔴 Os DOIS seletores. Desde 20/09/2026 a headline é um `<p>` (o `<h1>` virou o
     * rótulo do curso, na logo), e o seletor antigo sozinho deixaria de casar: medido
     * em Chrome real em 1366x640 e 1440x600, a fonte voltava de 34px para 46px e o CTA
     * descia 44px — justamente nas telas para as quais este bloco existe. O seletor de
     * `h1` fica porque a Jornada e a aula compartilham este CSS e nada garante que a
     * próxima variação não volte a usar `h1` aqui.
     */
    body.pgv-claude .hero-claude h1.titulo,
    body.pgv-claude .hero-claude p.titulo--g {
        font-size: clamp(3.4rem, 4.2vh, 4.6rem);
    }
}

/* ==========================================================================
 * Header exclusivo da Jornada
 *
 * A classe existe apenas quando esta pgv recebe `fonte=jornada`. O logo central
 * vem pelos argumentos do `get_header()` e fica oculta no celular para preservar
 * a logo institucional e a leitura do CTA sem aumentar o header.
 * ========================================================================== */

body.pgv-claude--jornada.header--comunidade .header {
    padding-block: 1.9rem;
}

body.pgv-claude--jornada .header > .fuga {
    position: relative;
}

body.pgv-claude--jornada .header__logo-central {
    position: absolute;
    top: 50%;
    left: 50%;
    display: flex;
    width: 17rem;
    visibility: hidden;
    opacity: 0;
    transform: translate(-50%, calc(-50% - 0.4rem));
    pointer-events: none;
    transition:
        opacity 180ms ease,
        transform 180ms ease,
        visibility 180ms ease;
}

body.pgv-claude--jornada .header__logo-central img {
    width: 100%;
    height: auto;
}

body.pgv-claude--jornada.pgv-claude--logo-hero-fora .header__logo-central {
    visibility: visible;
    opacity: 1;
    transform: translate(-50%, -50%);
}

@media (max-width: 47.9375em) {
    body.pgv-claude--jornada.header--comunidade .header {
        padding-block: 1.4rem;
    }

    body.pgv-claude--jornada .header__logo-central {
        display: none;
    }
}

@media (prefers-reduced-motion: reduce) {
    body.pgv-claude--jornada .header__logo-central {
        transition: none;
    }
}

/* ==========================================================================
 * Cronometro exclusivo da Jornada
 *
 * O markup e o script so entram com `fonte=jornada`. O script compartilhado
 * decide quando mostrar o bloco (ultimas 48 horas).
 * ========================================================================== */

body.pgv-claude--jornada .hero-claude__countdown {
    position: relative;
    z-index: 1;
    width: 100%;
    padding-bottom: 0;
    text-align: center;
}

body.pgv-claude--jornada .html-cronometro {
    margin-top: 2rem;
}

body.pgv-claude--jornada .hero-claude__countdown-title,
body.pgv-claude--jornada .hero-claude__countdown-grid {
    margin: 0;
}

body.pgv-claude--jornada .hero-claude__countdown-title {
    font-family: "Bricolage Grotesque", sans-serif;
    font-size: 2.4rem;
    font-weight: 700;
    line-height: 1.2;
}

body.pgv-claude--jornada .hero-claude__countdown-highlight {
    color: #f8b59f;
}

body.pgv-claude--jornada .hero-claude__countdown-grid {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 1.2rem;
    margin-top: 1.6rem;
}

body.pgv-claude--jornada .hero-claude__countdown-item {
    position: relative;
    display: flex;
    flex-direction: column;
    align-items: center;
    min-width: 6.1rem;
}

body.pgv-claude--jornada .hero-claude__countdown-item:not(:last-child)::after {
    content: ":";
    position: absolute;
    top: 0;
    right: -0.8rem;
    color: #fff;
    font-family: "Bricolage Grotesque", sans-serif;
    font-size: 2rem;
    font-weight: 700;
    line-height: 6rem;
}

body.pgv-claude--jornada .hero-claude__countdown-number {
    margin: 0;
    font-family: "Bricolage Grotesque", sans-serif;
    font-size: 6rem;
    line-height: 1;
}

body.pgv-claude--jornada .hero-claude__countdown-label.texto {
    margin: 0.4rem 0 0;
    color: #ad9484;
    font-size: 1.16rem;
    font-weight: 600;
    text-transform: uppercase;
}

@media (max-width: 47.9375em) {
    body.pgv-claude--jornada .html-cronometro {
        margin-top: 1.2rem;
    }

    body.pgv-claude--jornada .hero-claude__countdown-title {
        font-size: 1.8rem;
    }

    body.pgv-claude--jornada .hero-claude__countdown-grid {
        flex-wrap: wrap;
        gap: 1rem;
        margin-top: 1.2rem;
    }

    body.pgv-claude--jornada .hero-claude__countdown-item {
        min-width: 6.2rem;
    }

    body.pgv-claude--jornada .hero-claude__countdown-item:not(:last-child)::after {
        right: -0.6rem;
        font-size: 1.4rem;
        line-height: 4.8rem;
    }

    body.pgv-claude--jornada .hero-claude__countdown-number {
        font-size: 4.8rem;
    }

    body.pgv-claude--jornada .cronometro .texto {
        font-size: 1.3rem;
    }
}

@media (max-width: 29.9375em) {
    body.pgv-claude--jornada .hero-claude__countdown-grid {
        gap: 0.8rem;
    }

    body.pgv-claude--jornada .hero-claude__countdown-item {
        min-width: 5rem;
    }

    body.pgv-claude--jornada .hero-claude__countdown-item:not(:last-child)::after {
        right: -0.5rem;
        font-size: 1rem;
        line-height: 3.4rem;
    }

    body.pgv-claude--jornada .hero-claude__countdown-number {
        font-size: 3.4rem;
    }

    body.pgv-claude--jornada .cronometro .texto {
        font-size: 1.05rem;
    }
}

/* ==========================================================================
 * O alvo de toque do "Ocultar aulas"
 *
 * Sao 13 botoes na ementa padrao e 14 na Jornada (um por modulo), com 21px de
 * altura — `padding: 2.7px 0` sobre uma linha de 13,3px. O minimo do WCAG 2.2
 * AA para alvo de
 * toque e 24px, e no dedo 21px erra: o toque cai no acordeao em volta e fecha
 * o modulo que a pessoa acabou de abrir.
 *
 * A area cresce sem o botao crescer: o padding vertical sobe para 8px e a
 * margem negativa devolve o espaco ao layout, entao NADA se move na tela — so
 * o retangulo que recebe o clique. Medido depois: 32px de altura clicavel, com
 * o texto exatamente onde estava.
 *
 * Vale para os dois: o `width: max-content` impede que o botao, que e `flex`,
 * estique pela largura toda do acordeao e vire um alvo de 108px de largura por
 * onde ninguem espera clicar.
 * ========================================================================== */

body.pgv-claude .toggle-lessons-btn {
    padding-top: 8px;
    padding-bottom: 8px;
    margin-top: -5.3px;
    margin-bottom: -5.3px;
    width: max-content;
}

/* Preco de referencia exibido somente na oferta da Jornada. */
body.pgv-claude .oferta__preco-original {
    display: flex;
    align-items: center;
    gap: 0.8rem;
    margin-bottom: 0.6rem;
    color: #fff;
    font-size: 1.6rem;
    font-weight: 500;
}

body.pgv-claude .oferta__preco-original span:last-child {
    color: #f8b59f;
    font-size: 2.3rem;
    text-decoration: line-through;
    text-decoration-thickness: 2px;
}

/*
 * 🔴 O gabarito de SEO precisa do proprio fundo NESTA pagina.
 *
 * O `body` do site e creme (`rgb(247,241,234)`, declarado por `html, body` no
 * `style.css`) e as pgv escuras pintam por cima, secao a secao. O gabarito nao
 * estava dentro de nenhuma secao pintada: herdava o creme e mantinha o texto
 * branco. Medido em Chrome real: 31 dos 32 blocos de texto do gabarito ficavam
 * em 1,12:1 — contra os 4,5:1 do minimo. O texto estava la, publicado, e
 * praticamente invisivel.
 *
 * As outras pgv nao tem esse defeito porque o `body` DELAS ja e escuro
 * (`rgb(6,8,18)` no Power BI, `rgb(0,2,22)` no Analise de Dados) ou porque o
 * proprio `.vc-gabarito` ja se pinta (`rgb(18,18,18)` no Excel). Por isso o
 * conserto e aqui, no bundle desta pagina, e nao no partial: mexer no partial
 * mudaria o fundo de tres paginas que estao certas para consertar uma.
 *
 * A cor e a MESMA das secoes `formacao` e `ementa` desta pagina — nao e escolha,
 * e a segunda superficie escura que a pagina ja tem. Ver o bloco do `.resumo-aeo`
 * logo abaixo, onde a medicao esta escrita.
 */
body.pgv-claude .vc-gabarito {
    background: #0c0c0c;
    color: #fff;
}

/*
 * O bloco "O que e o Curso de Claude?" ficou de fora do conserto acima, e era o vizinho
 * de cima do gabarito.
 *
 * O `.resumo-aeo` nao pinta fundo nenhum (medido: `rgba(0,0,0,0)` em toda pgv que o tem)
 * — quem pinta e o body de cada pagina — e o card dentro dele e `rgba(11,17,35,.74)`, um
 * navy do partial. Sobre o creme do body ele compunha em `rgb(72,75,87)`: um
 * cinza-azulado que nao e cor do desenho, e o bloco virava uma ilha CLARA entre a secao
 * preta de cima (`rgb(0,0,0)`) e o gabarito de baixo.
 *
 * Medido em producao em 02/09/2026 nas SETE pgv que tem `.resumo-aeo`, lendo a cadeia de
 * ancestrais ate o `html`. Em cinco o body pinta a mesma cor do gabarito logo abaixo
 * (Power BI `rgb(6,8,18)`, Python `rgb(13,17,23)`, Excel `rgb(18,18,18)`, No Code
 * `rgb(13,9,13)`, SQL `rgb(0,16,16)`); na do n8n o body nao tem cor e sim um
 * `linear-gradient(... rgb(0,0,0) 11%)`, ou seja, preto onde o resumo cai. A Claude era a
 * unica que caia no creme — pelo mesmo motivo do gabarito acima: o body dela e claro.
 *
 * ⚠️ A varredura por "primeiro ancestral com cor" devolveu VAZIO no n8n, e vazio ali le
 * como "nao e ilha" quando significa "nao medi". Fundo se confere lendo a cadeia inteira,
 * `background-image` incluido — parar no primeiro `backgroundColor` opaco perde a pagina
 * que pinta por gradiente.
 *
 * ⚠️ Isto NAO e conserto de violacao, ao contrario do bloco acima. O texto do card ja
 * passava: 7,39:1 no corpo e 5,23:1 no rotulo dos KPI, contra os 4,5:1 do minimo. Hoje
 * estao em 15,78:1 e 9,66:1 (composicao alpha + luminancia relativa da WCAG, sobre as
 * cores medidas). O que se conserta aqui e a consistencia; o contraste vem junto.
 *
 * ==========================================================================
 * 🔴 Por que `#0c0c0c` e nao um navy proprio, e por que o CARD entra junto
 *
 * A primeira versao usava `#0b1023`, um navy — resolvia a ilha clara e trazia um
 * azul que a pagina nao tem em lugar nenhum. Medido em 03/09/2026: azul `+19`
 * (B acima do maior entre R e G), amplitude de canal `24`.
 *
 * `#0c0c0c` nao e cor nova: e a segunda superficie escura DESTA pagina, das secoes
 * `formacao` (2.228px) e `ementa` (782px). Com ela a faixa passa a ser o mesmo
 * material dessas duas, em vez de um terceiro tom so dela. Azul `+0`, amplitude `0`,
 * e 35% menos luminancia que o navy (3,68 contra 5,63 x1e3) — mais escuro E menos
 * colorido, que era o pedido.
 *
 * ⚠️ Trocar so a secao deixaria o defeito PIOR, e por isso o card muda junto. O
 * `.resumo-aeo__card` do partial e `rgba(11,17,35,.74)`: sobre o navy ele compunha
 * exatamente na cor da secao (quem desenha o card e a borda e os dois brilhos de
 * canto, nunca o preenchimento), mas sobre `#0c0c0c` comporia em `rgb(11,16,29)` —
 * um retangulo AZUL visivel no meio de uma faixa neutra.
 *
 * O alpha fica: `rgba(12,12,12,.74)` compoe exatamente em `#0c0c0c` sobre a secao,
 * que e o comportamento que sempre existiu. Opaco daria o mesmo pixel hoje (medido:
 * a secao nao tem `background-image` nem pseudo-elemento, e os dois
 * `radial-gradient` laranja moram no proprio card, acima do `background-color`),
 * mas mataria o `backdrop-filter: blur(18px) saturate(1.4)` se um dia entrar algo
 * atras.
 *
 * O escopo `body.pgv-claude` e obrigatorio: o `.resumo-aeo__card` e do partial e
 * atende as sete pgv que tem o bloco.
 * ==========================================================================
 */
body.pgv-claude .resumo-aeo {
    background-color: #0c0c0c;
}

body.pgv-claude .resumo-aeo__card {
    background-color: rgba(12, 12, 12, 0.74);
}

/* ==========================================================================
 * Secoes editoriais finais do Claude - composicao do Figma 6202:12.
 *
 * Todo seletor depende do wrapper exclusivo da pgv. Os partials continuam
 * compartilhados e fornecem os dados; esta folha altera somente a variante
 * `claude-final` montada em `template-parts/venda/claude-secoes-finais.php`.
 * ========================================================================== */

body.pgv-claude .hashtag-final-transicao {
    overflow: hidden;
    background: #000;
}

body.pgv-claude .hashtag-final-transicao .claude-final__divisor {
    position: relative;
    z-index: 2;
    overflow: hidden;
    width: 100%;
    margin-block: -1px;
    background: #000;
    line-height: 0;
}

body.pgv-claude .hashtag-final-transicao .claude-final__divisor img {
    display: block;
    width: 100%;
    height: auto;
    max-width: none;
}

body.pgv-claude .claude-final {
    --claude-final-creme: #f7f1ea;
    --claude-final-preto: #000;
    --claude-final-escuro: #151312;
    --claude-final-coral: #d97757;
    --claude-final-coral-claro: #f8b5a0;
    --claude-final-muted: #a89c97;
    overflow: hidden;
    background: var(--claude-final-creme);
    color: #fff;
    font-family: "Plus Jakarta Sans", sans-serif;
}

body.pgv-claude .claude-final *,
body.pgv-claude .claude-final *::before,
body.pgv-claude .claude-final *::after {
    box-sizing: border-box;
}

body.pgv-claude .claude-final__grupo {
    position: relative;
}

body.pgv-claude .claude-final__realce {
    color: var(--claude-final-coral);
}

body.pgv-claude .claude-final__divisor {
    position: relative;
    z-index: 2;
    overflow: hidden;
    width: 100%;
    margin-block: -1px;
    background: var(--claude-final-creme);
    line-height: 0;
}

body.pgv-claude .claude-final__divisor img {
    display: block;
    width: 100%;
    height: auto;
    max-width: none;
}

/* Resumo do curso --------------------------------------------------------- */

body.pgv-claude .claude-final__grupo--resumo,
body.pgv-claude .claude-final .resumo-aeo {
    background: var(--claude-final-escuro);
}

body.pgv-claude .claude-final .resumo-aeo {
    padding: 4.4rem 3.12rem 5.4rem;
}

body.pgv-claude .claude-final .resumo-aeo .container {
    width: 100%;
    max-width: 104rem;
}

body.pgv-claude .claude-final .resumo-aeo__card {
    overflow: visible;
    width: 100%;
    max-width: 104rem;
    padding: 0;
    border: 0;
    border-radius: 0;
    background: none;
    box-shadow: none;
    backdrop-filter: none;
    -webkit-backdrop-filter: none;
}

body.pgv-claude .claude-final .resumo-aeo__card::before,
body.pgv-claude .claude-final .resumo-aeo__eyebrow {
    display: none;
}

body.pgv-claude .claude-final .resumo-aeo__titulo {
    margin: 0 0 1.6rem;
    color: #fff;
    font-family: "Bricolage Grotesque", sans-serif;
    font-size: 3.6rem;
    font-weight: 500;
    letter-spacing: 0;
    line-height: 1.3;
    text-align: center;
    text-wrap: balance;
}

body.pgv-claude .claude-final .resumo-aeo__titulo .realce {
    background: none;
    color: var(--claude-final-coral);
    font-weight: 500;
    -webkit-text-fill-color: currentColor;
}

body.pgv-claude .claude-final .resumo-aeo__resposta {
    max-width: 87.6rem;
    margin: 0 auto 5.4rem;
    color: var(--claude-final-muted);
    font-size: 1.7rem;
    line-height: 1.6;
    text-align: center;
    text-wrap: balance;
}

body.pgv-claude .claude-final .resumo-aeo__resposta strong {
    color: #fff;
    font-weight: 600;
}

body.pgv-claude .claude-final .resumo-aeo__bento {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    grid-template-rows: 19.2rem 11rem 14rem 11rem;
    gap: 1.5rem 3rem;
    margin: 0 0 3rem;
}

body.pgv-claude .claude-final .resumo-aeo__cell {
    min-width: 0;
    padding: 3.1rem 3.8rem;
    border: 0;
    border-radius: 2rem;
    background: #000;
    transition: none;
}

body.pgv-claude .claude-final .resumo-aeo__cell:hover {
    transform: none;
    border-color: transparent;
    background: #000;
}

body.pgv-claude .claude-final .resumo-aeo__cell--kpi {
    grid-column: span 1;
    min-height: 19.2rem;
    padding: 3.1rem;
    border: 1px solid rgba(217, 119, 87, 0.5);
    background: linear-gradient(114deg, rgba(22, 22, 22, 0.9), rgba(7, 5, 5, 0.9));
}

body.pgv-claude .claude-final .resumo-aeo__cell--wide {
    grid-column: span 1;
}

body.pgv-claude .claude-final .resumo-aeo__cell--full {
    grid-column: 1 / span 2;
}

body.pgv-claude .claude-final .resumo-aeo__kpi-num {
    background: none;
    color: var(--claude-final-coral);
    font-family: "Bricolage Grotesque", sans-serif;
    font-size: clamp(4.8rem, 5.2vw, 6.5rem);
    font-weight: 600;
    letter-spacing: 0;
    line-height: 1;
    -webkit-text-fill-color: currentColor;
}

body.pgv-claude .claude-final .resumo-aeo__kpi-num small {
    margin-left: 0;
    color: var(--claude-final-coral);
    font-size: 0.62em;
    font-weight: 400;
    -webkit-text-fill-color: currentColor;
}

body.pgv-claude .claude-final .resumo-aeo__kpi-label {
    margin-top: 0.8rem;
    color: var(--claude-final-muted);
    font-size: 1.7rem;
    font-weight: 400;
    line-height: 1.45;
}

body.pgv-claude .claude-final .resumo-aeo__stars {
    margin-top: 0.5rem;
    font-size: 1.7rem;
}

body.pgv-claude .claude-final .resumo-aeo__stars i {
    color: rgba(217, 119, 87, 0.25);
}

body.pgv-claude .claude-final .resumo-aeo__stars b {
    color: var(--claude-final-coral);
}

body.pgv-claude .claude-final .resumo-aeo__cell-label {
    margin: 0 0 0.5rem;
    color: var(--claude-final-coral);
    font-family: "Bricolage Grotesque", sans-serif;
    font-size: 1.7rem;
    font-weight: 600;
    letter-spacing: 0;
    line-height: 1.3;
    text-transform: none;
}

body.pgv-claude .claude-final .resumo-aeo__cell-val {
    color: #fff;
    font-size: 2rem;
    line-height: 1.55;
}

body.pgv-claude .claude-final .resumo-aeo__imagem {
    grid-column: 3;
    grid-row: 2 / 5;
    overflow: hidden;
    width: 100%;
    height: 100%;
    margin: 0;
    border-radius: 24px;
    background: var(--claude-final-coral);
}

body.pgv-claude .claude-final .resumo-aeo__imagem img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

body.pgv-claude .claude-final .resumo-aeo__chips-wrap {
    padding: 3rem 3.8rem;
    border: 1px solid rgba(217, 119, 87, 0.5);
    border-radius: 2rem;
    background: linear-gradient(137deg, #161616, #070505);
}

body.pgv-claude .claude-final .resumo-aeo__topicos-titulo {
    margin: 0 0 2rem;
    color: var(--claude-final-coral);
    font-family: "Bricolage Grotesque", sans-serif;
    font-size: 2.5rem;
    font-weight: 600;
    letter-spacing: 0;
    line-height: 1.3;
    text-transform: none;
}

body.pgv-claude .claude-final .resumo-aeo__chips {
    gap: 1rem;
}

body.pgv-claude .claude-final .resumo-aeo__chips li {
    min-height: 4.9rem;
    padding: 1.3rem 2.5rem;
    border: 1px solid var(--claude-final-coral-claro);
    border-radius: 999px;
    background: #1c1918;
    color: #fff;
    font-size: 1.6rem;
    font-weight: 600;
}

body.pgv-claude .claude-final .resumo-aeo__chips li::before {
    width: 0.7rem;
    height: 0.7rem;
    background: var(--claude-final-coral-claro);
    box-shadow: none;
}

body.pgv-claude .claude-final .resumo-aeo__chips li:hover {
    border-color: var(--claude-final-coral-claro);
    background: #1c1918;
}

body.pgv-claude .claude-final .resumo-aeo__toggle {
    min-height: 4.9rem;
    margin: 2rem 0 0;
    padding: 1.3rem 2.5rem;
    border: 1px solid var(--claude-final-coral);
    border-radius: 999px;
    background: #382a22;
    color: #fff;
    font-size: 1.6rem;
}

body.pgv-claude .claude-final .resumo-aeo__toggle:hover {
    border-color: var(--claude-final-coral);
    background: #382a22;
}

body.pgv-claude .claude-final .resumo-aeo__atualizado {
    margin: 3rem 0 0;
    padding: 0;
    border: 0;
    color: var(--claude-final-muted);
    font-size: 1.6rem;
    font-weight: 400 !important;
}

body.pgv-claude .claude-final .resumo-aeo__atualizado::before {
    display: none;
}

body.pgv-claude .claude-final .resumo-aeo__atualizado time {
    color: inherit;
    font-weight: 400 !important;
}

/* Blocos explicativos ----------------------------------------------------- */

body.pgv-claude .claude-final .vc-gabarito--claude-final {
    background: var(--claude-final-creme);
    color: #000;
}

body.pgv-claude .claude-final .vc-gabarito--claude-final .vc-contexto {
    width: 100%;
    margin: 0;
    padding: 3.6rem 3.12rem 5.1rem;
    border: 0;
    border-radius: 0;
    background: var(--claude-final-creme);
}

body.pgv-claude .claude-final .vc-contexto > .container {
    display: flex;
    flex-direction: column;
    gap: 4rem;
    width: 100%;
    max-width: 114rem;
}

body.pgv-claude .claude-final .vc-contexto__bloco {
    display: grid;
    grid-template-columns: minmax(0, 0.78fr) minmax(0, 1.22fr);
    align-items: stretch;
    gap: 4rem;
    max-width: none;
    margin: 0;
    padding: 4.2rem;
    border: 0;
    border-radius: 2rem;
    background: #fff;
    box-shadow: none;
}

body.pgv-claude .claude-final .vc-contexto__bloco:nth-child(even) {
    grid-template-columns: minmax(0, 1.22fr) minmax(0, 0.78fr);
}

body.pgv-claude .claude-final .vc-contexto__bloco:nth-child(even) .vc-contexto__imagem {
    grid-column: 2;
}

body.pgv-claude .claude-final .vc-contexto__bloco:nth-child(even) .vc-contexto__texto {
    grid-column: 1;
    grid-row: 1;
}

body.pgv-claude .claude-final .vc-contexto__imagem {
    display: block;
    align-self: stretch;
    width: 100%;
    height: 100%;
    min-height: 28.5rem;
    border-radius: 2rem;
    object-fit: cover;
}

body.pgv-claude .claude-final .vc-contexto__texto {
    align-self: center;
}

body.pgv-claude .claude-final .vc-contexto__texto h2 {
    max-width: none;
    margin: 0 0 2rem !important;
    color: var(--claude-final-coral);
    font-family: "Bricolage Grotesque", sans-serif;
    font-size: 3.6rem;
    font-weight: 600 !important;
    letter-spacing: 0;
    line-height: 1.3;
    text-align: left;
}

body.pgv-claude .claude-final .vc-contexto__texto h2::after {
    display: none;
}

body.pgv-claude .claude-final .vc-contexto__texto p {
    margin: 0;
    color: #696969;
    font-size: 1.7rem;
    line-height: 1.6;
}

body.pgv-claude .claude-final .vc-contexto__texto p + p {
    margin-top: 2.4rem;
}

body.pgv-claude .claude-final .vc-contexto__texto strong {
    color: #000;
    font-weight: 700;
}

/* Comparativo ------------------------------------------------------------- */

body.pgv-claude .claude-final .vc-gabarito--claude-final .vc-cmp {
    width: 100%;
    margin: 0;
    padding: 5.4rem 3.12rem 6.4rem;
    border: 0;
    border-radius: 0;
    background: var(--claude-final-preto);
}

body.pgv-claude .claude-final .vc-cmp > .container {
    width: 100%;
    max-width: 104rem;
}

body.pgv-claude .claude-final .vc-cmp h2 {
    max-width: 62rem;
    margin: 0 auto 3rem;
    color: #fff;
    font-family: "Bricolage Grotesque", sans-serif;
    font-size: 3.6rem;
    font-weight: 500 !important;
    letter-spacing: 0;
    line-height: 1.1;
    text-align: center;
    text-wrap: balance;
}

body.pgv-claude .claude-final .vc-cmp h2::after {
    display: none;
}

body.pgv-claude .claude-final .vc-cmp__tabela {
    width: 100%;
    margin: -1rem auto;
    border-collapse: separate;
    border-spacing: 1rem;
    table-layout: fixed;
}

@media (min-width: 48em) {
    body.pgv-claude .claude-final .vc-cmp__tabela tbody {
        margin-top: -1rem;
    }
}

body.pgv-claude .claude-final .vc-cmp__th,
body.pgv-claude .claude-final .vc-cmp__td {
    width: 50%;
    padding: 1.8rem 2rem;
    border: 0;
    border-radius: 1rem;
    font-size: 1.6rem;
    line-height: 1.35;
    text-align: center;
    vertical-align: middle;
}

body.pgv-claude .claude-final .vc-cmp__td {
    height: 7.2rem;
    padding-inline: 3rem;
    font-weight: 400;
    text-wrap: pretty;
}

body.pgv-claude .claude-final .vc-cmp__th {
    height: 7.2rem;
    font-family: "Bricolage Grotesque", sans-serif;
    font-size: 2.5rem;
    font-weight: 400;
}

body.pgv-claude .claude-final .vc-cmp__th--a {
    border: 1px solid #5a2e2e;
    background: #261a1a;
    color: #ed7c7c;
}

body.pgv-claude .claude-final .vc-cmp__th--b {
    border: 1px solid var(--claude-final-coral);
    background: #c75b38;
    color: #fff;
}

body.pgv-claude .claude-final .vc-cmp__td--a {
    background: #1d1d1d;
    color: var(--claude-final-muted);
}

body.pgv-claude .claude-final .vc-cmp__td--b {
    background: #2e2522;
    color: #fff;
    font-weight: 300;
    text-wrap: balance;
}

/* Beneficios -------------------------------------------------------------- */

body.pgv-claude .claude-final .vc-gabarito--claude-final .vc-dif {
    width: 100%;
    margin: 0;
    padding: 11.5rem 3.12rem 8.9rem;
    border: 0;
    border-radius: 0;
    background: var(--claude-final-escuro);
}

body.pgv-claude .claude-final .vc-dif > .container {
    width: 100%;
    max-width: 124rem;
}

body.pgv-claude .claude-final .vc-dif h2 {
    max-width: 78rem;
    margin: 0 auto 5.5rem !important;
    color: #fff;
    font-family: "Bricolage Grotesque", sans-serif;
    font-size: 3.6rem;
    font-weight: 500 !important;
    letter-spacing: 0;
    line-height: 1.1;
    text-align: center;
    text-wrap: balance;
}

body.pgv-claude .claude-final .vc-dif h2::after {
    display: none;
}

body.pgv-claude .claude-final .vc-dif__intro {
    max-width: 76rem;
    margin: -3rem auto 4rem;
    color: var(--claude-final-muted);
    text-align: center;
}

body.pgv-claude .claude-final .vc-dif__grid {
    display: grid;
    grid-template-columns: repeat(12, minmax(0, 1fr));
    gap: 2rem;
}

body.pgv-claude .claude-final .vc-dif__item {
    grid-column: span 3;
    min-height: 31rem;
    padding: 3rem;
    border: 0;
    border-radius: 2rem;
    background: #fff;
    box-shadow: none;
}

body.pgv-claude .claude-final .vc-dif__item:nth-child(n + 5) {
    grid-column: span 4;
    min-height: 25.8rem;
}

body.pgv-claude .claude-final .vc-dif__item::before {
    display: none;
}

body.pgv-claude .claude-final .vc-dif__icone {
    display: block;
    width: 4rem;
    height: 4rem;
    margin: 0 0 1.5rem;
}

body.pgv-claude .claude-final .vc-dif__item h3 {
    margin: 0 0 1.5rem;
    color: #000;
    font-family: "Bricolage Grotesque", sans-serif;
    font-size: 2rem;
    font-weight: 600;
    line-height: 1.3;
}

body.pgv-claude .claude-final .vc-dif__item p {
    margin: 0;
    color: #696969;
    font-size: 1.7rem;
    line-height: 1.5;
    opacity: 1;
}

/* O FAQ e irmao da composicao, por isso recebe uma classe exclusiva no partial. */
body.pgv-claude .claude-final-faq {
    padding: 8rem 3.12rem 9rem;
    background: var(--claude-final-creme, #f7f1ea);
}

body.pgv-claude .claude-final-faq > .container {
    display: flex;
    flex-flow: column;
    align-items: center;
    gap: 4rem;
    width: 100%;
    max-width: 110rem;
}

body.pgv-claude .claude-final-faq,
body.pgv-claude .claude-final-faq .titulo,
body.pgv-claude .claude-final-faq .accordeon-title,
body.pgv-claude .claude-final-faq .accordeon-content,
body.pgv-claude .claude-final-faq .paragrafo {
    color: #000;
}

body.pgv-claude .claude-final-faq .titulo {
    margin: 0;
    font-family: "Bricolage Grotesque", sans-serif;
    font-size: 3.6rem;
    font-weight: 600;
    line-height: 1.2;
    text-align: center;
}

body.pgv-claude .claude-final-faq .faq__acordeoes {
    width: 100%;
    gap: 4rem;
}

body.pgv-claude .claude-final-faq .accordeon-item {
    padding-inline: 0;
    border-bottom-color: rgba(0, 0, 0, 0.14);
}

body.pgv-claude .claude-final-faq .accordeon-title {
    padding: 1.8rem 4rem 1.8rem 0;
    font-size: 1.7rem;
    line-height: 1.45;
}

body.pgv-claude .claude-final-faq .accordeon-title::after {
    right: 0.4rem;
}

body.pgv-claude .claude-final-faq .accordeon-content .paragrafo {
    margin: 0;
    padding: 0 3.2rem 1.8rem 0;
    line-height: 1.65;
}

body.pgv-claude .claude-final-faq .botao,
body.pgv-claude .claude-final-faq .botao:link,
body.pgv-claude .claude-final-faq .botao:visited,
body.pgv-claude .claude-final-faq .botao:hover,
body.pgv-claude .claude-final-faq .botao:active {
    margin-top: 0;
    color: #fff !important;
}

@media (max-width: 64em) {
    body.pgv-claude .claude-final .vc-contexto__bloco,
    body.pgv-claude .claude-final .vc-contexto__bloco:nth-child(even) {
        grid-template-columns: minmax(0, 1fr);
    }

    body.pgv-claude .claude-final .vc-contexto__bloco:nth-child(even) .vc-contexto__imagem,
    body.pgv-claude .claude-final .vc-contexto__bloco:nth-child(even) .vc-contexto__texto {
        grid-column: 1;
        grid-row: auto;
    }

    body.pgv-claude .claude-final .vc-contexto__imagem {
        max-height: 42rem;
    }

    body.pgv-claude .claude-final .vc-dif__item,
    body.pgv-claude .claude-final .vc-dif__item:nth-child(n + 5) {
        grid-column: span 6;
        min-height: 0;
    }
}

@media (max-width: 47.9375em) {
    body.pgv-claude .claude-final__divisor img,
    body.pgv-claude .hashtag-final-transicao .claude-final__divisor img {
        position: relative;
        left: 50%;
        width: 72rem;
        transform: translateX(-50%);
    }

    body.pgv-claude .claude-final .resumo-aeo {
        padding: 3.6rem 1.6rem 3.2rem;
    }

    body.pgv-claude .claude-final .resumo-aeo__titulo,
    body.pgv-claude .claude-final .vc-contexto__texto h2,
    body.pgv-claude .claude-final .vc-cmp h2,
    body.pgv-claude .claude-final .vc-dif h2 {
        font-size: 2.8rem;
    }

    body.pgv-claude .claude-final .resumo-aeo__resposta {
        margin-bottom: 3.2rem;
        font-size: 1.55rem;
        text-align: left;
        text-wrap: wrap;
    }

    body.pgv-claude .claude-final .resumo-aeo__bento {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        grid-template-rows: none;
        gap: 1.2rem;
    }

    body.pgv-claude .claude-final .resumo-aeo__cell {
        padding: 2rem;
        border-radius: 1.4rem;
    }

    body.pgv-claude .claude-final .resumo-aeo__cell--kpi {
        grid-column: span 1;
        min-height: 13.5rem;
        padding: 2rem;
    }

    body.pgv-claude .claude-final .resumo-aeo__cell--kpi:nth-of-type(3) {
        grid-column: 1 / -1;
    }

    body.pgv-claude .claude-final .resumo-aeo__kpi-num {
        font-size: 4rem;
    }

    body.pgv-claude .claude-final .resumo-aeo__kpi-label {
        font-size: 1.3rem;
    }

    body.pgv-claude .claude-final .resumo-aeo__imagem {
        grid-column: 1 / -1;
        grid-row: auto;
        justify-self: center;
        width: 100%;
        aspect-ratio: 340 / 390;
        border-radius: 24px;
    }

    body.pgv-claude .claude-final .resumo-aeo__cell--wide {
        grid-column: span 1;
    }

    body.pgv-claude .claude-final .resumo-aeo__cell--full {
        grid-column: 1 / -1;
    }

    body.pgv-claude .claude-final .resumo-aeo__cell-label,
    body.pgv-claude .claude-final .resumo-aeo__cell-val {
        font-size: 1.45rem;
    }

    body.pgv-claude .claude-final .resumo-aeo__chips-wrap {
        padding: 2.4rem 2rem;
        border-radius: 1.6rem;
    }

    body.pgv-claude .claude-final .resumo-aeo__topicos-titulo {
        font-size: 2.1rem;
    }

    body.pgv-claude .claude-final .resumo-aeo__chips li,
    body.pgv-claude .claude-final .resumo-aeo__toggle {
        width: 100%;
        min-height: 4.6rem;
        justify-content: flex-start;
        padding: 1.2rem 1.6rem;
        font-size: 1.4rem;
    }

    body.pgv-claude .claude-final .resumo-aeo__atualizado {
        display: grid;
        grid-template-columns: minmax(0, 1fr);
        align-items: start;
        gap: 0.4rem;
        margin-top: 2.4rem;
        padding-top: 2rem;
        border-top: 1px solid rgba(255, 255, 255, 0.12);
        font-size: 1.45rem;
        line-height: 1.35;
    }

    body.pgv-claude .claude-final .resumo-aeo__atualizado time {
        white-space: nowrap;
        text-align: left;
    }

    body.pgv-claude .claude-final .vc-gabarito--claude-final .vc-contexto,
    body.pgv-claude .claude-final .vc-gabarito--claude-final .vc-cmp,
    body.pgv-claude .claude-final .vc-gabarito--claude-final .vc-dif {
        padding-inline: 1.6rem;
    }

    body.pgv-claude .claude-final .vc-contexto > .container {
        gap: 2rem;
    }

    body.pgv-claude .claude-final .vc-contexto__bloco {
        gap: 2.4rem;
        padding: 2rem;
        border-radius: 1.6rem;
    }

    body.pgv-claude .claude-final .vc-contexto__imagem {
        height: auto;
        min-height: 0;
        max-height: none;
        aspect-ratio: 467 / 364;
        border-radius: 1.4rem;
    }

    body.pgv-claude .claude-final .vc-contexto__bloco:nth-child(2) .vc-contexto__imagem {
        aspect-ratio: 467 / 285;
    }

    body.pgv-claude .claude-final .vc-contexto__texto h2 {
        margin-bottom: 1.6rem !important;
    }

    body.pgv-claude .claude-final .vc-contexto__texto p {
        font-size: 1.55rem;
    }

    body.pgv-claude .claude-final .vc-cmp {
        padding-block: 4.8rem;
    }

    body.pgv-claude .claude-final .vc-cmp h2,
    body.pgv-claude .claude-final .vc-dif h2 {
        margin-bottom: 3.2rem !important;
    }

    body.pgv-claude .claude-final .vc-cmp__tabela {
        margin: 0;
        border-spacing: 0;
    }

    body.pgv-claude .claude-final .vc-cmp__tabela tbody {
        display: grid;
        gap: 1.6rem;
        margin: 0;
    }

    body.pgv-claude .claude-final .vc-cmp__tabela tr,
    body.pgv-claude .claude-final .vc-cmp__tabela tr + tr {
        display: grid;
        gap: 0.6rem;
        margin: 0;
    }

    body.pgv-claude .claude-final .vc-cmp__td {
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;
        width: 100%;
        height: auto;
        min-height: 0;
        padding: 1.6rem;
        border-radius: 1rem;
        font-size: 1.45rem;
        line-height: 1.5;
        text-align: center;
    }

    body.pgv-claude .claude-final .vc-cmp__td + .vc-cmp__td {
        margin-top: 0;
    }

    body.pgv-claude .claude-final .vc-cmp__td::before {
        margin-bottom: 0.7rem;
        font-family: "Bricolage Grotesque", sans-serif;
        font-size: 1.4rem;
        letter-spacing: 0;
        text-transform: none;
    }

    body.pgv-claude .claude-final .vc-cmp__td--a::before {
        color: #ed7c7c;
    }

    body.pgv-claude .claude-final .vc-cmp__td--b::before {
        color: var(--claude-final-coral-claro);
    }

    body.pgv-claude .claude-final .vc-dif {
        padding-block: 6.4rem 5.6rem;
    }

    body.pgv-claude .claude-final .vc-dif__grid {
        grid-template-columns: minmax(0, 1fr);
        gap: 1.6rem;
    }

    body.pgv-claude .claude-final .vc-dif__item,
    body.pgv-claude .claude-final .vc-dif__item:nth-child(n + 5) {
        grid-column: auto;
        padding: 2.4rem;
        border-radius: 1.6rem;
    }

    body.pgv-claude .claude-final .vc-dif__item h3 {
        font-size: 1.9rem;
    }

    body.pgv-claude .claude-final .vc-dif__item p {
        font-size: 1.55rem;
    }

    body.pgv-claude .claude-final-faq {
        padding: 5.6rem 1.6rem 6.4rem;
    }

    body.pgv-claude .claude-final-faq > .container {
        gap: 3rem;
    }

    body.pgv-claude .claude-final-faq .titulo {
        font-size: 2.8rem;
    }

    body.pgv-claude .claude-final-faq .faq__acordeoes {
        gap: 0;
    }

    body.pgv-claude .claude-final-faq .accordeon-title {
        padding-block: 1.6rem;
        font-size: 1.55rem;
    }

    body.pgv-claude .claude-final-faq .botao {
        width: min(100%, 32rem);
    }
}

/*
 * 🔴 O bloco do WhatsApp herdava texto branco sobre o creme do body.
 *
 * O `.secao-wpp` vem do campo de rodape do site (`the_field('footer','option')`)
 * e chega DEPOIS, por JS — nao esta no HTML que o `curl` recebe, entao escapa de
 * conferencia por terminal. Ele nao pinta fundo nenhum: usa o do body. Nas pgv
 * escuras isso da preto com texto branco; aqui o body e creme
 * (`rgb(247,241,234)`) e o texto continuava branco, herdado do `body` do tema.
 * Medido em Chrome real: 1,13:1, contra os 4,5:1 do minimo — o titulo, os dois
 * paragrafos e o telefone estavam publicados e ilegiveis.
 *
 * O conserto e o mesmo que o `.vc-gabarito` logo acima ja usa: pintar o bloco
 * em vez de reescrever o texto. Preto fecha a pagina ate o rodape do site — que e
 * exatamente o que a `/curso-power-bi` e a `/curso-de-excel-online` mostram.
 *
 * ⚠️ Ate 02/09/2026 este bloco vinha logo depois do `.rodape` proprio da pagina,
 * tambem preto; o `.rodape` saiu (era a segunda linha de copyright da pagina) e
 * agora o vizinho de cima e o FAQ, que e creme. O preto continua certo, mas por
 * outro motivo: ele e a transicao para o rodape do site, nao a continuacao de uma
 * faixa preta.
 */
body.pgv-claude .secao-wpp {
    background-color: #000;

    /*
     * O `.footer__container` abre com `margin-top: 14.9rem`, e essa margem
     * colapsa para FORA do `.footer`, que e transparente: sobrava uma faixa de
     * 149px com o creme do body entre o bloco preto e o rodape navy. Absorver a
     * faixa como padding e devolve-la como margem negativa pinta a faixa sem
     * mover nada — as margens adjacentes somam zero e a altura da pagina fica
     * identica. Mexer no `.footer` nao serve: a "luz" dele e um `absolute`
     * ancorado no topo da tag, que subiria os mesmos 149px.
     */
    padding-bottom: calc(60px + 14.9rem);
    margin-bottom: -14.9rem;
}

@media (max-width: 29.9375em) {
    body.pgv-claude .secao-wpp {
        padding-bottom: calc(60px + 9.54rem);
        margin-bottom: -9.54rem;
    }
}

/*
 * O telefone e o unico link do site que chega aqui sem classe: fica no azul de
 * navegador (`#00b3ff`) no meio de uma pagina laranja. Mesma decisao da pgv do
 * Excel, que o recolore para o verde dela.
 */
body.pgv-claude .secao-wpp--div-titulo a,
body.pgv-claude .secao-wpp a:not([class]) {
    color: #d97757;
}

body.pgv-claude .secao-wpp--div-titulo a:hover,
body.pgv-claude .secao-wpp a:not([class]):hover {
    color: #e8917a;
}

/* ==========================================================================
 * O header e o rodape do SITE, na paleta desta pagina
 *
 * A pgv e preta com laranja de ponta a ponta; o header e o rodape do site sao
 * azuis. Medido em 02/09/2026 na `/curso-claude` em producao, e o que estava
 * azul era exatamente isto:
 *
 *   .header                 rgb(0,4,28)      navy
 *   .footer__container      rgb(14,25,57)    navy, com borda rgb(9,65,139)
 *   .footer__h              rgb(64,102,206)  o quadrado do "H", azul forte
 *   .footer__luz            imagem AZUL em `mix-blend-mode: soft-light`
 *
 * As cores que entram no lugar sao as que a PAGINA ja serve, medidas nela, e nao
 * escolhidas aqui:
 *
 *   #19110f  o `.accordion-item` da ementa (rgb(25,17,15)) — 17 blocos
 *   #3f241b  superficie quente da pagina (rgb(63,36,27))
 *   #d97757  o `.destaque` do h1 (rgb(217,119,87)) — a cor da marca do curso
 *   #f8b59f  o tom claro mais frequente do main (rgb(248,181,159)) — 340 usos
 *
 * O DESENHO vem da pgv do Excel (`pg-vendas-excel.css`), que e o unico precedente
 * no tema que repinta header e rodape por bundle de pagina: base quase preta com o
 * tom da pagina, o accent so na borda e no quadrado do "H", e a "luz" desligada.
 * As cores dele sao verdes porque foram medidas contra a pagina dele; o que se
 * herda e o metodo, nao os numeros.
 *
 * 🔴 Por que NAO por variante do tema (`header--claude`/`footer--claude`), que e o
 * mecanismo que 9 cursos usam (`header--n8n`, `footer--ia`, `header--vba`…): essas
 * variantes moram no CSS COMPILADO compartilhado, e o `.css` do disco e build de
 * um fonte que nao reproduz (mesmo motivo do cabecalho deste arquivo). Acrescentar
 * uma la e editar a mao um artefato servido em TODAS as paginas, para consertar
 * uma. Esta folha carrega so aqui.
 *
 *   ⚠️ O comentario equivalente no `pg-vendas-excel.css` afirma que as variantes
 *   `.footer--sql`/`.footer--ia` "nao chegam a ser aplicadas por template nenhum".
 *   Isso e falso hoje, medido: `node scripts/venda/valida-paleta-virada.mjs` lista
 *   9 cursos servindo variante de header e 9 de rodape.
 *
 * O botao "Matricule-se" fica como esta, de proposito. Ele nao e azul — e o
 * gradiente amarelo→laranja do site (`rgb(238,225,43)` → `rgb(255,130,41)`), ja
 * dentro da familia quente —, e e o marcador de conversao que aparece igual em
 * todo o site. Medido nas outras oito pgv: NENHUMA variante troca o botao; so a do
 * Excel troca, e la o motivo foi o amarelo brigar com o verde. Trocar aqui pelo
 * `#fa7043` do CTA do hero criaria dois botoes laranja identicos na mesma dobra.
 * ========================================================================== */

body.pgv-claude .header {
    background-color: #19110f;
    box-shadow: inset 0 -1px 0 #d9775729;
}

body.pgv-claude .footer__container {
    background-color: #19110f;
    border-top-color: #d97757;
}

body.pgv-claude .footer__h {
    background-color: #3f241b;
    border-color: #d97757;
}

body.pgv-claude .footer a:hover {
    color: #f8b59f;
}

/*
 * A "luz" do rodape e um `<img>` azul em `mix-blend-mode: soft-light`. Sobre o
 * marrom escuro ela puxa a faixa inteira para o roxo — mesmo motivo pelo qual a
 * pgv do Excel e a `/curso-ingles` ja a desligam.
 */
body.pgv-claude .footer__luz {
    display: none;
}