/* IMT Academy — Mentoria "Crie seu produto digital" · 08/10/2026
 * A NOVA IDENTIDADE 2026-10 (ID visual/ISRAEL MEIRA/NOVA-IDENTIDADE-2026-10.md) numa landing:
 *   papel  radial #F5F4F0 → #F2F1EC → #E3E2DD   (texto #000, apoio #2B2B2B, linhas preto 9%)
 *   palco  radial #1C1C1C → #101010 → #060606   (texto #FCFCFC, apoio #B9B9B9, linhas branco 12%)
 *   lime   #D8FF00 só como acento. No papel, NUNCA lime fino (1,02:1): só área cheia (faixa,
 *          estrela grande com contorno preto, botão preto com texto lime). No palco pode tudo.
 *   Clash Grotesk fina (título, conectivo) + Bodoni Moda 900 itálico (a palavra-chave, caixa baixa)
 *   Anton (a frase de efeito, caixa alta, com a faixa na virada) · Montserrat 600 espaçada 0,42em
 *   (o contador e a assinatura). No máximo 3 famílias por bloco; Anton e Bodoni gigante nunca no mesmo.
 * Elementos: círculos concêntricos (5 anéis), estrela de 4 pontas, faixa, papel rasgado, o objeto 3D
 * com a sombra de contato em código.
 *
 * Revelar à prova de falha (lp.js): todo estado escondido vive só em html.anima …:not(.ok); sem JS,
 * sem IntersectionObserver ou com menos movimento, a página é o estado final. Nenhum style="".
 * O seletor de parcelas é o da loja (/assets/loja/parcelas.css), que lê --f, --acento-escuro e
 * --acento-halo daqui.
 */

@font-face { font-family: 'Clash Grotesk'; font-weight: 300; font-style: normal; font-display: swap; src: url('/assets/fontes/clash-grotesk-light.otf') format('opentype'); }
@font-face { font-family: 'Clash Grotesk'; font-weight: 400; font-style: normal; font-display: swap; src: url('/assets/fontes/clash-grotesk-regular.otf') format('opentype'); }
@font-face { font-family: 'Clash Grotesk'; font-weight: 500; font-style: normal; font-display: swap; src: url('/assets/fontes/clash-grotesk-medium.otf') format('opentype'); }
@font-face { font-family: 'Clash Grotesk'; font-weight: 600; font-style: normal; font-display: swap; src: url('/assets/fontes/clash-grotesk-semibold.otf') format('opentype'); }

:root {
  --lime: #D8FF00; --preto: #000; --branco: #FCFCFC;
  --papel: #F2F1EC; --palco: #1C1C1C;
  --apoio-papel: #2B2B2B; --apoio-palco: #B9B9B9;
  --clash: 'Clash Grotesk', 'Helvetica Neue', Arial, sans-serif;
  --bodoni: 'Bodoni Moda', 'Didot', 'Bodoni 72', Georgia, serif;
  --anton: 'Anton', 'Impact', 'Arial Narrow', sans-serif;
  --mont: 'Montserrat', system-ui, -apple-system, sans-serif;
  /* o que o seletor de parcelas da loja (parcelas.css) lê */
  --f: var(--clash); --acento-escuro: var(--lime); --acento-halo: rgba(216,255,0,.22);
  --larg: 1180px;
  --ease-out: cubic-bezier(.16, 1, .3, 1);
  --mola: cubic-bezier(.27, .29, .11, 1.21);
  --mola-suave: cubic-bezier(.25, .24, .14, 1.18);
}
@supports (transition-timing-function: linear(0, 1)) {
  :root {
    --mola: linear(0, 0.006 1.5%, 0.021 3%, 0.055 5%, 0.1 7%, 0.196 10.5%, 0.533 21.5%, 0.628 25%, 0.712 28.5%, 0.774 31.5%, 0.835 35%, 0.885 38.5%, 0.925 42%, 0.959 46%, 0.986 50.5%, 1.003 55%, 1.015 60.5%, 1.019 73.5%, 1.005 99.5%, 1);
    --mola-suave: linear(0, 0.005 1.5%, 0.021 3%, 0.053 5%, 0.095 7%, 0.187 10.5%, 0.521 22%, 0.611 25.5%, 0.691 29%, 0.75 32%, 0.81 35.5%, 0.859 39%, 0.899 42.5%, 0.938 47%, 0.966 51.5%, 0.987 56.5%, 1.002 62.5%, 1.011 77.5%, 1.005 99.5%, 1);
  }
}

/* ── superfícies: o fundo troca e tudo troca junto ─────────────────────────── */
.papel { --tx: #000; --tx-apoio: var(--apoio-papel); --linha: rgba(0,0,0,.09); --linha-forte: rgba(0,0,0,.16); --foco: #000;
  color: var(--tx); background: radial-gradient(120% 90% at 50% 46%, #F5F4F0 0%, #F2F1EC 50%, #E3E2DD 100%); }
.palco { --tx: var(--branco); --tx-apoio: var(--apoio-palco); --linha: rgba(255,255,255,.12); --linha-forte: rgba(255,255,255,.2); --foco: var(--lime);
  color: var(--tx); background: radial-gradient(120% 90% at 50% 28%, #1C1C1C 0%, #101010 48%, #060606 100%); }

/* ── base ───────────────────────────────────────────────────────────────── */
*, *::before, *::after { box-sizing: border-box; }
[hidden] { display: none !important; }
html { -webkit-text-size-adjust: 100%; scroll-behavior: smooth; scroll-padding-bottom: 104px; }
body { margin: 0; font: 400 17px/1.5 var(--clash); letter-spacing: -.01em; color: #000; background: var(--papel); overflow-x: hidden; -webkit-font-smoothing: antialiased; }
img, video, svg { display: block; max-width: 100%; }
img, video { height: auto; }
a { color: inherit; }
b, strong { font-weight: 600; }
h1, h2, h3, p, ul, ol, dl, dd, figure { margin: 0; }
ul, ol { padding: 0; list-style: none; }
:focus-visible { outline: 3px solid var(--foco, #000); outline-offset: 3px; border-radius: 6px; }
.sr { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.sem-quebra { white-space: nowrap; }

.dentro { width: 100%; max-width: calc(var(--larg) + 40px); margin: 0 auto; padding: 0 20px; }
.dentro--estreito { max-width: 820px; }
.secao { position: relative; padding: 84px 0; overflow: hidden; }
@media (min-width: 900px) { .dentro { padding: 0 40px; max-width: calc(var(--larg) + 80px); } .dentro--estreito { max-width: 900px; } .secao { padding: 120px 0; } }

/* grão monocromático, leve (a referência é limpa) */
.grao { position: fixed; inset: 0; z-index: 90; pointer-events: none; opacity: .05;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='220' height='220'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2' stitchTiles='stitch'/%3E%3CfeColorMatrix type='saturate' values='0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E"); }

/* ── tipografia da identidade ───────────────────────────────────────────── */
.fina { display: block; font: 300 clamp(1.55rem, 6.4vw, 3.1rem)/1.02 var(--clash); letter-spacing: -.045em; }
/* Bodoni Moda é variável: SEMPRE pela família, peso 900, itálico (nunca local('BodoniModaItalic-Black')) */
.serifada { display: block; font-family: var(--bodoni); font-weight: 900; font-style: italic; letter-spacing: -.04em; line-height: .98;
  padding-top: .1em; text-transform: none; }
.serifada--lime { color: var(--lime); }
.papel .serifada--lime { color: #000; }   /* lime no papel some: a regra 1 da identidade */
.espacado { font: 600 .74rem/1.6 var(--mont); letter-spacing: .42em; text-transform: uppercase; }
.corpo { max-width: 46ch; margin-top: 22px; font: 400 clamp(1.02rem, 2.6vw, 1.18rem)/1.45 var(--clash); color: var(--tx-apoio); }
.corpo--centro { margin-left: auto; margin-right: auto; text-align: center; }
.titulo-misto .fina { font-size: clamp(1.45rem, 5.4vw, 2.6rem); }
.titulo-misto .serifada { font-size: clamp(2.7rem, 13vw, 6.2rem); }
.titulo-misto--centro { text-align: center; }

/* a faixa de destaque: abraça a caixa-alta (Anton) ou a serifada (Bodoni); uma por bloco */
.destaque { display: inline-block; }
.destaque--preta { background: var(--preto); color: var(--lime); }
.destaque--lime { background: var(--lime); color: var(--preto); }

.estrela { position: absolute; width: 40px; height: 40px; pointer-events: none; }

/* ── botões ─────────────────────────────────────────────────────────────── */
.cta { position: relative; display: inline-flex; align-items: center; justify-content: center; min-height: 60px; padding: 0 32px; border: 0; border-radius: 999px;
  font: 500 1.08rem/1.15 var(--clash); letter-spacing: -.005em; text-decoration: none; text-align: center; cursor: pointer;
  transition: transform .2s var(--ease-out), box-shadow .3s var(--ease-out); }
.cta:active { transform: scale(.97); transition-duration: .09s; }
.cta--preto { background: var(--preto); color: var(--lime); box-shadow: 0 16px 34px -16px rgba(0,0,0,.6); }
.cta--lime { background: var(--lime); color: var(--preto); box-shadow: 0 0 34px rgba(216,255,0,.22); }
@media (hover: hover) {
  .cta--preto:hover { box-shadow: 0 20px 44px -14px rgba(0,0,0,.75), 0 0 0 3px rgba(0,0,0,.1); }
  .cta--lime:hover { box-shadow: 0 0 52px rgba(216,255,0,.42); }
}
.cta--brilho { overflow: hidden; isolation: isolate; }
.cta--brilho::after { content: ""; position: absolute; top: 0; left: 0; width: 30%; height: 100%; z-index: -1; pointer-events: none;
  background: linear-gradient(90deg, transparent, rgba(255,255,255,.6), transparent); transform: skewX(-20deg) translateX(-150%); animation: brilho 3.5s linear infinite; }
@keyframes brilho { 0% { transform: skewX(-20deg) translateX(-150%); } 71.5%, 100% { transform: skewX(-20deg) translateX(420%); } }

/* ═══ HERO (papel) ═══════════════════════════════════════════════════════ */
.hero { position: relative; overflow: hidden; }
.topo { position: relative; z-index: 3; display: flex; align-items: center; justify-content: space-between; gap: 12px; padding-top: 14px; padding-bottom: 6px; }
.logo { display: inline-flex; align-items: center; min-height: 44px; }
.logo img { height: 26px; width: auto; }
.topo__entrar { display: inline-flex; align-items: center; gap: .32em; min-height: 44px; padding: 0 16px; border-radius: 999px; border: 1.5px solid rgba(0,0,0,.45);
  font: 400 .9rem/1 var(--clash); text-decoration: none; white-space: nowrap; }
.topo__entrar b { font-weight: 600; }

.hero__grade { position: relative; display: grid; grid-template-areas: "kicker" "titulo" "figura" "oferta"; justify-items: center; text-align: center; padding-bottom: 56px; }
.hero__texto { display: contents; }
.hero__texto > .espacado { grid-area: kicker; margin-top: 18px; color: var(--tx-apoio); padding-left: .42em; font-size: .66rem; }
.hero__titulo { grid-area: titulo; margin-top: 10px; position: relative; z-index: 2; }
.hero__titulo .fina:first-child { font-size: clamp(1.7rem, 8vw, 3.4rem); }
.hero__titulo .serifada { font-size: clamp(3.2rem, 20.5vw, 6.6rem); margin: -.02em 0 .2em; }
.hero__titulo .fina:last-child { font-size: clamp(1.25rem, 5.6vw, 2.3rem); }
.hero__oferta { grid-area: oferta; display: grid; justify-items: center; gap: 12px; position: relative; z-index: 2; margin-top: 4px; }
.hero__preco { font: 900 italic clamp(2.7rem, 13vw, 4.6rem)/1 var(--bodoni); letter-spacing: -.03em; }
/* o "de R$ 197,90 por" (09/10/2026): o 'de_cents' do products.php; só vitrine, o checkout cobra o Pix */
.preco-de { font: 400 1.02rem/1.2 var(--clash); letter-spacing: -.005em; color: var(--tx-apoio); margin-bottom: -6px; }
.preco-de s { text-decoration-line: line-through; text-decoration-thickness: 2px; text-decoration-color: currentColor; color: var(--tx); font-weight: 500; white-space: nowrap; }
.preco-de--compra { display: block; margin: 0 0 8px; color: var(--apoio-palco); font-size: 1.05rem; }
.preco-de--compra s { color: var(--branco); text-decoration-color: var(--lime); text-decoration-thickness: 2.5px; }
.hero__preco .destaque { padding: .06em .16em .1em .1em; line-height: .86; }
.hero__preco small { font-size: .58em; letter-spacing: 0; }
.hero__fatos { font-size: .66rem; padding-left: .42em; display: flex; flex-wrap: wrap; justify-content: center; column-gap: 1.6em; row-gap: 6px; }
/* a data (09/10/2026): na linha de cima no celular, ao lado do "ao vivo e online" quando cabe */
.hero__data { font-weight: 600; white-space: nowrap; }
.hero__acao { display: grid; justify-items: center; gap: 10px; margin-top: 4px; }
.apoio { font-size: .98rem; color: var(--tx-apoio); }

.hero__figura { grid-area: figura; position: relative; width: min(84vw, 380px); margin: 18px 0 14px; z-index: 1; }
.hero__figura .objeto { position: relative; z-index: 2; width: 100%; }
.aneis { position: absolute; z-index: 0; left: 50%; top: 52%; width: 300%; max-width: none; height: auto; transform: translate(-50%, -50%); }
.papel .aneis g { stroke: rgba(0,0,0,.09); }
.palco .aneis g { stroke: rgba(255,255,255,.12); }
.sombra { position: absolute; z-index: 1; left: 18%; right: 10%; bottom: 3%; height: 9%; border-radius: 50%; background: rgba(0,0,0,.28); filter: blur(10px); transform: rotate(3deg); }
.hero__figura .estrela--g { z-index: 3; width: 17%; height: auto; aspect-ratio: 1; right: -1%; top: -6%; transform: rotate(8deg); }
.hero__figura .estrela--p1 { z-index: 3; width: 6%; height: auto; aspect-ratio: 1; right: -8%; top: 30%; }
.hero__figura .estrela--p2 { z-index: 3; width: 4.4%; height: auto; aspect-ratio: 1; right: 14%; top: -12%; transform: rotate(12deg); }
/* papel rasgado (assado em PNG: o papel ocupa 400 × 140 de 520 × 300) com o texto vivo, sobre a borda do objeto */
.rasgado { position: absolute; z-index: 4; left: -6%; bottom: 6%; width: 44%; aspect-ratio: 400 / 140; transform: rotate(-5deg);
  background: url('img/rasgado.png') 50% 43.75% / 130% 214.3% no-repeat; display: flex; align-items: center; padding: 0 9%;
  font: 400 clamp(.8rem, 3.4vw, 1.12rem)/1.15 var(--clash); color: #111; text-align: left; }
.rasgado b { font-weight: 600; }

@media (min-width: 900px) {
  .topo { padding-top: 24px; }
  .logo img { height: 30px; }
  .hero__grade { grid-template-columns: minmax(0, 1.08fr) minmax(0, .92fr); grid-template-areas: "texto figura"; justify-items: start; text-align: left;
    align-items: center; column-gap: 24px; padding: 8px 40px 72px; }
  .hero__texto { display: flex; flex-direction: column; align-items: flex-start; grid-area: texto; }
  .hero__texto > .espacado { margin-top: 0; padding-left: 0; font-size: .7rem; }
  .hero__titulo { margin-top: 14px; }
  .hero__titulo .fina:first-child { font-size: clamp(2rem, 3.4vw, 3.2rem); }
  .hero__titulo .serifada { font-size: min(8.4vw, 15.5vh, 8.6rem); }
  .hero__titulo .fina:last-child { font-size: clamp(1.4rem, 2.3vw, 2.2rem); }
  .hero__oferta { grid-area: auto; justify-items: start; margin-top: min(3.4vh, 30px); gap: 10px; }
  .hero__preco { font-size: min(4.8vw, 8.6vh, 4.6rem); }
  .hero__fatos { padding-left: 0; justify-content: flex-start; }
  .hero__acao { grid-auto-flow: column; align-items: center; justify-items: start; gap: 22px; margin-top: 8px; }
  .hero__figura { justify-self: center; width: 100%; max-width: 560px; margin: 0; }
  .rasgado { font-size: clamp(.95rem, 1.3vw, 1.2rem); }
}

/* ═══ A TURMA (palco) ════════════════════════════════════════════════════ */
.turma__grade { display: grid; gap: 48px; grid-template-areas: "texto" "foto" "fatos"; }
.turma__texto { grid-area: texto; }
.turma__foto { grid-area: foto; }
.turma .fatos { grid-area: fatos; }
.turma .titulo-misto .serifada { font-size: clamp(2.6rem, 12.4vw, 5.4rem); }
.assentos { margin-top: 34px; }
.assentos__fila { display: grid; grid-template-columns: repeat(5, 1fr); gap: 10px; max-width: 420px; }
.assento { position: relative; aspect-ratio: 1; border-radius: 12px; border: 2px solid var(--lime); box-shadow: 0 0 22px rgba(216,255,0,.12) inset;
  transition: background-color .3s var(--ease-out), border-color .3s var(--ease-out); }
.assento::after { content: ""; position: absolute; inset: 0; margin: auto; width: 34%; height: 34%; border-radius: 50%; background: var(--lime); opacity: .9; transform: scale(.0); transition: transform .45s var(--mola); }
.assento.livre::after { transform: scale(1); }
.assento.ocupado { border-color: #3A3A3A; background: #2A2A2A; box-shadow: none; }
.assento.ocupado::after { background: #5A5A5A; transform: scale(1); width: 26%; height: 26%; }
.assentos__texto { margin-top: 16px; color: var(--lime); padding-left: 0; }
.fatos { display: grid; gap: 0; border-top: 1px solid var(--linha); align-self: end; }
.fato { display: grid; gap: 6px; padding: 22px 0; border-bottom: 1px solid var(--linha); }
.fato dt { font: 600 .68rem/1.4 var(--mont); letter-spacing: .42em; text-transform: uppercase; color: var(--tx-apoio); }
.fato dd { font: 400 1rem/1.45 var(--clash); color: var(--tx-apoio); max-width: 44ch; }
.fato dd b { display: block; font: 300 clamp(1.4rem, 4.6vw, 1.9rem)/1.1 var(--clash); letter-spacing: -.03em; color: var(--tx); margin-bottom: 6px; }
@media (min-width: 900px) {
  .turma__grade { grid-template-columns: minmax(0, .85fr) minmax(0, 1.15fr); grid-template-areas: "foto texto" "foto fatos"; column-gap: 72px; row-gap: 40px; align-items: center; }
  .turma .fatos { align-self: start; }
  .turma__foto { width: 100%; max-width: 460px; }
  .assentos__fila { grid-template-columns: repeat(10, 1fr); max-width: 560px; gap: 10px; }
}

/* as fotos dele (09/10/2026): inteiras, com o cenário, cantos da identidade e a legenda espaçada */
.turma__foto, .quem__foto { position: relative; justify-self: center; width: min(100%, 440px); }
.foto { width: 100%; height: auto; border-radius: 28px; background: #2a2a2a; }
.palco .foto { box-shadow: 0 0 0 1px rgba(255,255,255,.1), 0 40px 80px -40px rgba(0,0,0,.95); }
.papel .foto { background: #E3E2DD; box-shadow: 0 30px 60px -36px rgba(0,0,0,.45); }
.estrela--foto { z-index: 2; width: 16%; height: auto; aspect-ratio: 1; right: -4%; top: -5%; transform: rotate(10deg); }
.foto__legenda { margin-top: 14px; padding-left: .42em; font-size: .62rem; color: var(--tx-apoio); }

/* ═══ O CAMINHO (papel): a sequência de verdade ═════════════════════════ */
.passos { display: grid; gap: 14px; margin-top: 48px; counter-reset: passo; }
.passo { position: relative; padding: 26px 24px 28px; border-radius: 28px; background: rgba(255,255,255,.62); border: 1px solid var(--linha);
  box-shadow: 0 24px 50px -36px rgba(0,0,0,.35); }
.passo__n { display: block; font: 900 italic 4.6rem/.9 var(--bodoni); letter-spacing: -.04em; color: #000; }
.passo h3 { margin-top: 14px; font: 600 1.3rem/1.15 var(--clash); letter-spacing: -.02em; }
.passo h3 span { display: block; font-weight: 300; }
.passo p { margin-top: 12px; font: 400 1rem/1.45 var(--clash); color: var(--tx-apoio); }
@media (min-width: 760px) { .passos { grid-template-columns: repeat(2, 1fr); } }
@media (min-width: 1100px) { .passos { grid-template-columns: repeat(4, 1fr); gap: 18px; margin-top: 64px; } .passo__n { font-size: 5.4rem; } }

/* ═══ A PROVA (palco) ════════════════════════════════════════════════════ */
.efeito { max-width: 16ch; margin: 0 auto; text-align: center; font: 400 clamp(2.5rem, 11vw, 6rem)/.98 var(--anton); letter-spacing: -.005em; text-transform: uppercase; text-wrap: balance; }
.efeito .destaque { line-height: .86; padding: .07em .09em .05em; margin-top: .12em; }
.vitrine { display: grid; grid-auto-flow: column; grid-auto-columns: minmax(66%, 1fr); gap: 14px; overflow-x: auto; scroll-snap-type: x mandatory; scroll-padding-inline: 20px;
  padding-bottom: 12px; margin: 40px -20px 0; padding-inline: 20px; scrollbar-width: thin; }
.peca { scroll-snap-align: start; }
.peca__video { width: 100%; aspect-ratio: 9 / 16; object-fit: cover; border-radius: 20px; background: #111; box-shadow: 0 0 0 1px rgba(255,255,255,.1), 0 30px 60px -30px rgba(0,0,0,.9); }
.peca__rotulo { margin-top: 14px; font: 600 .62rem/1.5 var(--mont); letter-spacing: .3em; text-transform: uppercase; color: var(--lime); }
.peca__titulo { margin-top: 6px; font: 600 1.12rem/1.2 var(--clash); letter-spacing: -.02em; }
.peca__texto { margin-top: 6px; font: 400 .95rem/1.4 var(--clash); color: var(--tx-apoio); }
.peca__texto b { color: var(--tx); font-weight: 500; }
@media (min-width: 720px) { .vitrine { grid-auto-flow: row; grid-template-columns: repeat(3, 1fr); overflow: visible; margin-inline: auto; padding-inline: 0; max-width: 980px; gap: 28px; } }
.prova__chave { margin-bottom: 18px; text-align: center; color: var(--lime); padding-left: .42em; }
/* os 4 exemplos reais (09/10/2026): rolagem no celular, 2 colunas no tablet, 4 no computador */
@media (min-width: 720px) { .vitrine--4 { grid-template-columns: repeat(2, 1fr); max-width: 660px; } }
@media (min-width: 1100px) { .vitrine--4 { grid-template-columns: repeat(4, 1fr); max-width: 1180px; gap: 24px; } }
.nota-honesta { max-width: 52ch; margin: 30px auto 0; text-align: center; font: 400 .95rem/1.45 var(--clash); color: var(--tx-apoio); }
.laco { max-width: 760px; margin: 64px auto 0; text-align: center; }
.laco .fina { font-size: clamp(1.3rem, 4.6vw, 2.2rem); }
.laco .serifada { font-size: clamp(3rem, 14vw, 6.6rem); }

/* ═══ PARA QUEM É (papel) ════════════════════════════════════════════════ */
.quem__grade { display: grid; gap: 44px; }
.lista-mais { display: grid; gap: 18px; margin-top: 30px; }
.lista-mais li { display: grid; grid-template-columns: 30px 1fr; gap: 16px; align-items: start; font: 400 clamp(1.05rem, 2.6vw, 1.2rem)/1.4 var(--clash); }
.mais { width: 30px; height: 30px; margin-top: 1px; }
.mais rect { fill: #000; }
.mais rect.mais__traco { fill: var(--branco); }
.lista-mais--palco .mais rect { fill: var(--lime); }
.lista-mais--palco .mais rect.mais__traco { fill: #000; }
.quem__lado { display: grid; gap: 28px; align-content: start; }
.quem__foto { width: min(100%, 420px); }
.nao-e { align-self: end; padding: 28px 26px; border-radius: 28px; border: 1.5px solid rgba(0,0,0,.45); }
.nao-e__titulo { font: 300 clamp(1.4rem, 4.4vw, 1.9rem)/1.12 var(--clash); letter-spacing: -.03em; }
.nao-e p + p { margin-top: 12px; color: var(--tx-apoio); }
.nao-e a { color: var(--tx); font-weight: 600; text-decoration: underline; text-underline-offset: .18em; display: inline-block; padding: 12px 0; margin: -12px 0; }   /* 13/10/2026: o link da garantia */
@media (min-width: 900px) { .quem__grade { grid-template-columns: minmax(0, 1.2fr) minmax(0, .8fr); gap: 72px; } }

/* ═══ COMPRAR (palco) ════════════════════════════════════════════════════ */
.oferta__grade { display: grid; gap: 44px; }
@media (min-width: 900px) { .oferta__grade { grid-template-columns: 1fr 1fr; align-items: start; gap: 56px; } }
.recebe { margin-top: 32px; padding: 26px 24px; border-radius: 28px; background: rgba(255,255,255,.04); border: 1px solid rgba(255,255,255,.12); box-shadow: inset 0 1px 0 rgba(255,255,255,.1); }
.recebe__rotulo { font: 600 .68rem/1.4 var(--mont); letter-spacing: .42em; text-transform: uppercase; color: var(--lime); }
.recebe .lista-mais { margin-top: 20px; }
.recebe .lista-mais li { font-size: 1.02rem; color: var(--tx-apoio); }
.recebe .lista-mais b { color: var(--tx); font-weight: 500; }
/* depois de pagar: a sequência de verdade (pagamento → acesso → data e link → gravação) */
.depois { margin-top: 30px; }
.depois__rotulo { font: 600 .68rem/1.4 var(--mont); letter-spacing: .42em; text-transform: uppercase; color: var(--tx-apoio); }
.depois ol { display: grid; gap: 0; margin-top: 14px; border-top: 1px solid var(--linha); }
.depois li { display: grid; grid-template-columns: 44px 1fr; gap: 12px; align-items: baseline; padding: 16px 0; border-bottom: 1px solid var(--linha);
  font: 400 1rem/1.4 var(--clash); color: var(--tx-apoio); }
.depois li b { color: var(--tx); font-weight: 500; }
.depois__n { font: 900 italic 1.9rem/1 var(--bodoni); color: var(--lime); letter-spacing: -.03em; }

.compra { background: #0B0B0B; color: var(--branco); border: 1px solid rgba(255,255,255,.12); border-radius: 36px; padding: 30px 22px;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.12), 0 40px 80px -40px rgba(0,0,0,.9); align-self: start; }
.compra__vagas { color: var(--lime); margin-bottom: 12px; }
.compra__vagas:empty { display: none; }
.preco__valor { display: block; font: 900 italic clamp(3.6rem, 17vw, 6rem)/1 var(--bodoni); letter-spacing: -.035em; color: var(--lime); }
.preco__valor small { font-size: .5em; letter-spacing: 0; }
/* o preço com cupom (09/10/2026, cupom.js): o novo vem como texto corrido ("R$ 26,91", sem o <small>), então
   fica um pouco menor que o de lista para caber numa linha de 320 px até o desktop */
.preco .cupom-novo { font-size: clamp(2.9rem, 14.5vw, 5rem); }
.preco__nota { margin-top: 12px; color: var(--apoio-palco); }
.preco__nota b { color: var(--branco); font-weight: 500; }
.espera { margin-top: 26px; display: grid; gap: 14px; padding: 22px 20px; border-radius: 22px; border: 1.5px solid rgba(216,255,0,.5); background: rgba(216,255,0,.05); }
.espera__titulo { font: 900 italic 2.2rem/1 var(--bodoni); letter-spacing: -.03em; color: var(--lime); }
.espera__texto { color: var(--apoio-palco); }
.espera .cta { width: 100%; }
body.esgotado .compra .preco__nota, body.fechado .compra .preco__nota { opacity: .6; }
/* turma completa ou vendas fechadas: a lista de espera já diz o que houve; a condição de pagamento sai do hero */
body.esgotado .compra__vagas, body.esgotado .hero .apoio, body.fechado .hero .apoio { display: none; }

.form { display: grid; gap: 14px; margin-top: 26px; }
.form label { display: grid; gap: 7px; font: 500 .82rem/1 var(--clash); letter-spacing: .02em; color: #C9CCC4; }
.form input[type=text], .form input[type=email], .form input[type=tel] { height: 56px; padding: 0 16px; border-radius: 14px; border: 1px solid rgba(255,255,255,.16);
  background: #151515; color: var(--branco); font: 400 1.02rem var(--clash); letter-spacing: 0; width: 100%; }
.form input::placeholder { color: #6b7066; }
.form input:focus { outline: none; border-color: var(--lime); box-shadow: 0 0 0 3px rgba(216,255,0,.22); }
.form input[aria-invalid="true"] { border-color: #FC5860; }
.formas { border: 0; padding: 0; margin: 6px 0 0; min-width: 0; display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.formas legend { font: 500 .82rem/1 var(--clash); letter-spacing: .02em; color: #C9CCC4; margin-bottom: 10px; padding: 0; }
.forma { position: relative; cursor: pointer; }
.forma input { position: absolute; opacity: 0; inset: 0; margin: 0; }
.forma span { display: grid; gap: 4px; min-height: 76px; align-content: center; padding: 12px 14px; border-radius: 14px; border: 1px solid rgba(255,255,255,.16); background: #151515;
  font: 400 .88rem/1.3 var(--clash); color: #C9CCC4; transition: border-color .2s, background .2s; }
.forma span b { font-size: 1.06rem; color: var(--branco); font-weight: 600; }
.forma input:checked + span { border-color: var(--lime); background: rgba(216,255,0,.06); box-shadow: 0 0 0 1px var(--lime); }
.forma input:focus-visible + span { outline: 3px solid var(--lime); outline-offset: 2px; }
.erro { padding: 12px 14px; border-radius: 12px; background: rgba(252,88,96,.12); border: 1px solid rgba(252,88,96,.4); color: #FFB3B7; font-size: .95rem; }
.form .cta { width: 100%; margin-top: 6px; padding-inline: 14px; font-size: clamp(.98rem, 4.2vw, 1.12rem); white-space: nowrap; }
.form .cta[disabled] { opacity: .7; cursor: wait; }
@media (max-width: 359px) { .form .cta { white-space: normal; text-wrap: balance; padding-block: 10px; } }
.aviso { font-size: .86rem; color: #8E9588; }
.aviso--termos { margin-top: 6px; }
.aviso--termos a { color: inherit; font-weight: 600; text-decoration: underline; text-underline-offset: .18em; display: inline-block; padding: 12px 0; margin: -12px 0; }
.produto-de { display: flex; align-items: center; gap: 12px; margin-top: 26px; padding-top: 22px; border-top: 1px solid rgba(255,255,255,.1);
  font: 600 .64rem/1 var(--mont); letter-spacing: .3em; text-transform: uppercase; color: #8E9588; }
.produto-de img { height: 24px; width: auto; }
@media (min-width: 560px) { .compra { padding: 40px 36px; } }
/* a garantia ao lado do preço (13/10/2026): uma linha que leva às regras, logo abaixo */
.compra__garantia { margin-top: 18px; }
.compra__garantia a { display: flex; gap: 12px; align-items: flex-start; padding: 14px 16px; border-radius: 16px; border: 1px solid rgba(255,255,255,.16);
  background: rgba(255,255,255,.03); text-decoration: none; font: 400 .92rem/1.42 var(--clash); color: #C9CCC4; }
.compra__garantia b { color: var(--branco); font-weight: 600; }
.compra__garantia .estrela { position: static; flex: none; width: 22px; height: 22px; margin-top: 1px; }
.compra__garantia-ver { color: var(--branco); font-weight: 500; text-decoration: underline; text-underline-offset: .18em; white-space: nowrap; }
@media (hover: hover) { .compra__garantia a:hover { border-color: rgba(216,255,0,.5); } }

/* ═══ A GARANTIA (dentro do palco da compra, logo abaixo dela) · 13/10/2026 ═══
   A caixa com fio lime (como a da lista de espera), o título misto, três números em fios, o passo a passo
   em cartões (a compra, logo acima, usa linhas numeradas: arranjo diferente) e dois quadros no fim.
   Lime só no fio, no rótulo e na serifada: o resto é branco e apoio. */
.garantia { margin-top: 64px; scroll-margin-top: 16px; }
.garantia__caixa { position: relative; padding: 32px 20px 26px; border-radius: 36px; border: 1.5px solid rgba(216,255,0,.5); background: rgba(216,255,0,.03);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.08), 0 40px 80px -48px rgba(0,0,0,.9); }
.garantia__topo { display: grid; gap: 34px; }
.garantia__chave { color: var(--lime); padding-left: 0; }
.garantia .titulo-misto { margin-top: 14px; }
.garantia .titulo-misto .serifada { font-size: clamp(2.7rem, 13vw, 5.4rem); }
.garantia .corpo { max-width: 40ch; }
.garantia__numeros { display: grid; border-top: 1px solid var(--linha); align-self: center; }
.garantia__numero { display: grid; gap: 6px; padding: 20px 0; border-bottom: 1px solid var(--linha); }
.garantia__numero dt { font: 600 .66rem/1.4 var(--mont); letter-spacing: .42em; text-transform: uppercase; color: var(--tx-apoio); }
.garantia__numero dd { font: 400 .98rem/1.45 var(--clash); color: var(--tx-apoio); max-width: 48ch; }
.garantia__numero dd b { display: block; margin-bottom: 8px; font: 900 italic clamp(1.9rem, 8.4vw, 2.6rem)/1 var(--bodoni); letter-spacing: -.03em; color: var(--tx); }
.garantia__sub { margin-top: 44px; padding-left: 0; font-size: .66rem; color: var(--tx-apoio); }
.garantia__passos { display: grid; gap: 12px; margin-top: 16px; }
.garantia__passo { display: grid; align-content: start; gap: 6px; padding: 20px 20px 18px; border-radius: 22px; background: rgba(255,255,255,.04); border: 1px solid var(--linha); }
.garantia__n { font: 900 italic 2.5rem/.9 var(--bodoni); letter-spacing: -.04em; color: var(--tx); }
.garantia__passo-titulo { margin-top: 6px; font: 500 1.1rem/1.25 var(--clash); letter-spacing: -.015em; color: var(--tx); }
.garantia__passo-texto { font: 400 .96rem/1.42 var(--clash); color: var(--tx-apoio); }
.garantia__prova { margin-top: 8px; padding-top: 12px; border-top: 1px solid var(--linha); font: 400 .9rem/1.4 var(--clash); color: var(--tx); }
.garantia__prova span { display: block; margin-bottom: 4px; font: 600 .6rem/1.4 var(--mont); letter-spacing: .38em; text-transform: uppercase; color: var(--tx-apoio); }
/* (revisão de 13/10/2026) as duas metas lado a lado, com o mesmo peso: no Pix e no cartão */
.garantia__metas { display: flex; flex-wrap: wrap; gap: 6px 22px; margin-bottom: 12px; }
.garantia__meta { display: grid; gap: 4px; }
.garantia__numero dd .garantia__meta b { margin-bottom: 0; font-size: clamp(1.7rem, 7.4vw, 2.6rem); }
.garantia__meta small { font: 600 .6rem/1.4 var(--mont); letter-spacing: .3em; text-transform: uppercase; color: var(--tx-apoio); }
/* (revisão de 13/10/2026) a gravação: até quando entra, e o prazo que cresce se ela atrasar */
.garantia__nota { margin-top: 16px; max-width: 70ch; font: 400 .95rem/1.5 var(--clash); color: var(--tx-apoio); }
.garantia__nota b { color: var(--tx); font-weight: 500; }
.garantia__fim { display: grid; gap: 14px; margin-top: 30px; }
.garantia__pedir, .garantia__outra { padding: 24px 22px; border-radius: 24px; }
.garantia__pedir { background: #0B0B0B; border: 1px solid rgba(255,255,255,.12); }
.garantia__outra { border: 1.5px solid rgba(255,255,255,.28); }
.garantia__fim h3 { font: 500 1.22rem/1.2 var(--clash); letter-spacing: -.02em; }
.garantia__fim p { margin-top: 10px; font: 400 .98rem/1.5 var(--clash); color: var(--tx-apoio); }
.garantia__fim p b { color: var(--tx); font-weight: 500; }
.garantia__fim a { color: var(--tx); font-weight: 600; text-decoration: underline; text-underline-offset: .18em; display: inline-block; padding: 12px 0; margin: -12px 0; }
@media (min-width: 640px) { .garantia__passos { grid-template-columns: repeat(2, 1fr); } .garantia__fim { grid-template-columns: 1fr 1fr; } }
@media (min-width: 900px) {
  .garantia { margin-top: 96px; }
  .garantia__caixa { padding: 56px 52px 48px; }
  .garantia__topo { grid-template-columns: minmax(0, 1.05fr) minmax(0, .95fr); column-gap: 64px; align-items: center; }
  .garantia__sub { margin-top: 56px; }
}
/* (13/10/2026) os passos numa fileira só, quantos o registro tiver (4 desde que o de divulgação saiu); 'auto-fit' fecha as colunas vazias */
@media (min-width: 1100px) { .garantia__passos { grid-template-columns: repeat(auto-fit, minmax(190px, 1fr)); } }
/* (revisão de 13/10/2026) o bloco curto de quem já comprou: a aula começou, as vendas pararam ou a data mudou */
.garantia--curta .titulo-misto .serifada { font-size: clamp(2.3rem, 10.5vw, 4.4rem); }
.garantia--curta .garantia__fim { margin-top: 26px; }

/* ═══ DÚVIDAS (papel) ════════════════════════════════════════════════════ */
.faq .titulo-misto { margin-bottom: 30px; }
.faq details { border-bottom: 1px solid var(--linha-forte); }
.faq summary { list-style: none; cursor: pointer; display: flex; align-items: center; justify-content: space-between; gap: 16px; padding: 22px 0;
  font: 500 clamp(1.08rem, 2.8vw, 1.24rem)/1.3 var(--clash); letter-spacing: -.015em; }
.faq summary::-webkit-details-marker { display: none; }
.faq summary::after { content: "+"; flex: none; display: grid; place-items: center; width: 34px; height: 34px; background: #000; color: var(--branco);
  font: 400 1.4rem/1 var(--clash); transition: transform .3s var(--mola); }
.faq details[open] summary::after { transform: rotate(45deg); }
.faq details p { padding: 0 0 22px; max-width: 62ch; color: var(--tx-apoio); }
.faq details a { font-weight: 600; display: inline-block; padding: 12px 2px; margin: -12px 0; }

/* ═══ RODAPÉ ═════════════════════════════════════════════════════════════ */
.rodape { padding: 56px 0 120px; }
.rodape__grade { display: grid; gap: 22px; }
.rodape .logo img { height: 30px; }
.rodape nav { display: flex; flex-wrap: wrap; gap: 10px 22px; }
.rodape nav a { display: inline-flex; align-items: center; min-height: 44px; font: 400 .95rem/1 var(--clash); text-decoration: none; color: var(--tx-apoio); }
.rodape nav a:first-child { color: var(--lime); }
.rodape__assina { font-size: .62rem; color: var(--tx-apoio); opacity: .8; }
@media (min-width: 900px) { .rodape { padding: 64px 0; } .rodape__grade { grid-template-columns: auto 1fr auto; align-items: center; gap: 40px; } .rodape nav { justify-content: center; } }

/* ═══ BARRA FIXA (só celular) ═════════════════════════════════════════════ */
.barra { position: fixed; left: 0; right: 0; bottom: 0; z-index: 80; display: flex; align-items: center; justify-content: space-between; gap: 12px;
  padding: 12px 16px calc(12px + env(safe-area-inset-bottom)); background: rgba(6,6,6,.9); -webkit-backdrop-filter: blur(18px) saturate(150%); backdrop-filter: blur(18px) saturate(150%);
  color: var(--branco); transform: translateY(110%); transition: transform .55s var(--ease-out); }
.barra.vem { transform: none; }
.barra p { font: 400 .98rem/1.15 var(--clash); }
.barra p b { font-weight: 600; }
.barra small { display: block; font-size: .8rem; color: var(--apoio-palco); }
.barra .cta { min-height: 50px; padding: 0 22px; flex: none; font-size: 1rem; }
@media (min-width: 900px) { .barra { display: none; } }

/* ═══ MOVIMENTO — revelar à prova de falha (o lp.js só põe html.anima se der para animar) ═══ */
html.anima .anim { transition: opacity .16s var(--ease-out) var(--d, 0ms), transform .55s var(--mola) var(--d, 0ms); }
html.anima .anim:not(.ok) { opacity: 0; transform: translateY(24px) scale(.98); }
/* o objeto entra de baixo, com a mola suave (o "busto" da base) */
html.anima .anim--objeto { transform-origin: 50% 100%; transition: opacity .2s var(--ease-out) var(--d, 0ms), transform .8s var(--mola-suave) var(--d, 0ms); }
html.anima .anim--objeto:not(.ok) { transform: translateY(14%) scale(.9) rotate(-3deg); }
html.anima .d1 { --d: 60ms; } html.anima .d2 { --d: 120ms; } html.anima .d3 { --d: 180ms; } html.anima .d4 { --d: 240ms; }
html.anima .d5 { --d: 300ms; } html.anima .d6 { --d: 360ms; } html.anima .d7 { --d: 420ms; }
/* o hero entra por coreografia (o lp.js põe .ok no .hero dois quadros depois da carga) */
html.anima .hero .d1 { --d: 80ms; } html.anima .hero .d2 { --d: 160ms; } html.anima .hero .d3 { --d: 320ms; }
html.anima .hero .d4 { --d: 620ms; } html.anima .hero .d5 { --d: 860ms; }
/* a faixa do preço cresce da esquerda, depois o número */
html.anima .hero__preco .destaque { transition: clip-path .32s var(--ease-out) calc(var(--d, 0ms) + 160ms); clip-path: inset(0 0 0 0); }
html.anima .hero__oferta:not(.ok) .hero__preco .destaque { clip-path: inset(0 100% 0 0); }
/* as estrelas acendem depois do objeto */
html.anima .hero__figura .estrela { transition: opacity .2s var(--ease-out) 900ms, transform .5s var(--mola) 900ms; }
html.anima .hero__figura:not(.ok) .estrela { opacity: 0; transform: scale(.3) rotate(-40deg); }
/* os assentos: um por um, quando o contador chega (o JS põe .livre/.ocupado e o atraso por classe) */
html.anima .assento { transition-delay: calc(var(--i, 0) * 55ms); }
html.anima .assento::after { transition-delay: calc(var(--i, 0) * 55ms + 120ms); }
.assento.i0 { --i: 0; } .assento.i1 { --i: 1; } .assento.i2 { --i: 2; } .assento.i3 { --i: 3; } .assento.i4 { --i: 4; }
.assento.i5 { --i: 5; } .assento.i6 { --i: 6; } .assento.i7 { --i: 7; } .assento.i8 { --i: 8; } .assento.i9 { --i: 9; }
html.parado *, html.parado *::before, html.parado *::after { transition: none !important; }

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  .cta--brilho::after { animation: none !important; }
  *, *::before, *::after { transition-duration: .001ms !important; transition-delay: 0ms !important; }
}
