/* Layout: app escuro de curso. No alto, o módulo da vez ("Comece por aqui" / "Continue de onde
   parou"); depois os módulos (a mentoria trancada no fim), o presente PedUp e o suporte.
   As telas (Entrar, Início, Aula) trocam sem recarregar. Mesma família visual das capas. */
:root {
  --fundo: #050B08;
  --fundo-2: #08130D;
  --cartao: #0C1912;
  --cartao-2: #13261C;
  --linha: rgba(255, 255, 255, .08);
  --linha-2: rgba(255, 255, 255, .14);
  --tinta: #F3F6F2;
  --tinta-2: #B6C2B8;
  --tinta-3: #8A978D;
  --menta: #43E393;
  --zap: #25D366;
  --zap-texto: #03200D;
  --campo: #0B3A25;
  --pedup: #FF6B00;
  --pedup-claro: #FF9440;
  --erro: #FF8A7A;
  --f-titulo: "Archivo", "Arial Narrow", system-ui, sans-serif;
  --f-texto: "Archivo", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
  --sai: cubic-bezier(.2, .8, .2, 1);
  --sobe: cubic-bezier(.16, 1, .3, 1);
  --topo: 64px;
  color-scheme: dark;
}

*, *::before, *::after { box-sizing: border-box; }
[hidden] { display: none !important; }
html { background: var(--fundo); -webkit-text-size-adjust: 100%; }
body {
  margin: 0; background: var(--fundo); color: var(--tinta);
  font-family: var(--f-texto); font-size: 16px; line-height: 1.55;
  font-variant-numeric: tabular-nums; overflow-x: clip;
  -webkit-font-smoothing: antialiased; -webkit-tap-highlight-color: transparent;
}
body::before { content: ""; position: fixed; inset: 0 0 auto; height: env(safe-area-inset-top, 0px); z-index: 30; background: var(--fundo); }
img { max-width: 100%; height: auto; display: block; }
button { font: inherit; color: inherit; background: none; border: 0; padding: 0; cursor: pointer; text-align: inherit; }
a { color: inherit; }
h1, h2, h3, p, ol, ul { margin: 0; }
h1, h2, h3 { text-wrap: balance; font-weight: 700; }
p { text-wrap: pretty; }
mark { background: none; color: var(--menta); }
.i { width: 20px; height: 20px; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; flex: none; }
:focus-visible { outline: 3px solid var(--menta); outline-offset: 3px; }
[id] { scroll-margin-top: calc(var(--topo) + 20px); }

.lim { width: 100%; max-width: 1240px; margin-inline: auto; padding-left: max(16px, env(safe-area-inset-left, 0px)); padding-right: max(16px, env(safe-area-inset-right, 0px)); }
@media (min-width: 900px) {
  .lim { padding-left: max(32px, env(safe-area-inset-left, 0px)); padding-right: max(32px, env(safe-area-inset-right, 0px)); }
}

/* Títulos no estilo das capas: estreitos, fortes, em caixa alta */
.tg { font-family: var(--f-titulo); font-weight: 800; font-stretch: 68%; text-transform: uppercase; line-height: .9; letter-spacing: -.004em; }
.sobre { display: inline-flex; align-items: center; gap: 8px; font-size: 12px; font-weight: 700; letter-spacing: .14em; text-transform: uppercase; color: var(--menta); }
.apoio { color: var(--tinta-2); font-size: 17px; max-width: 46ch; }
.selo { display: inline-flex; align-items: center; height: 26px; padding: 0 11px; border-radius: 999px; background: var(--zap); color: var(--zap-texto); font-weight: 800; font-stretch: 80%; font-size: 13px; letter-spacing: .07em; text-transform: uppercase; white-space: nowrap; }
.link { position: relative; color: var(--tinta-2); font-size: 14px; text-decoration: underline; text-decoration-color: var(--linha-2); text-underline-offset: 3px; }
.link:disabled { cursor: default; text-decoration: none; color: var(--tinta-3); }

/* Botões */
.bt {
  position: relative; overflow: hidden; display: inline-flex; align-items: center; justify-content: center; gap: 10px;
  min-height: 50px; padding: 0 22px; border-radius: 999px; font-weight: 700; font-size: 15.5px; line-height: 1.2;
  text-decoration: none; white-space: nowrap;
  transition: transform .16s var(--sai), background-color .2s var(--sai), box-shadow .2s var(--sai), color .2s var(--sai);
  --gira: var(--tinta); --gira-f: rgba(255, 255, 255, .18);
}
.bt:active { transform: scale(.97); }
.bt-g { background: var(--zap); color: var(--zap-texto); box-shadow: 0 12px 34px -12px rgba(37, 211, 102, .6), inset 0 -2px 0 rgba(0, 0, 0, .12); --gira: var(--zap-texto); --gira-f: rgba(3, 32, 13, .2); }
.bt-grande { min-height: 58px; padding: 0 30px; font-size: 16px; font-stretch: 92%; text-transform: uppercase; letter-spacing: .02em; }
.bt-grande::after {
  content: ""; position: absolute; top: 0; bottom: 0; left: -40%; width: 30%;
  background: linear-gradient(100deg, transparent, rgba(255, 255, 255, .45), transparent);
  transform: translateX(-120%) skewX(-18deg); animation: brilho 4.6s var(--sai) 1.4s infinite;
}
@keyframes brilho { 0%, 72% { transform: translateX(-120%) skewX(-18deg); } 100% { transform: translateX(560%) skewX(-18deg); } }
.bt-vidro { background: rgba(255, 255, 255, .06); box-shadow: inset 0 0 0 1px var(--linha-2); color: var(--tinta); }
.bt-pedup { background: var(--pedup); color: #fff; box-shadow: 0 12px 34px -14px rgba(255, 107, 0, .7), inset 0 -2px 0 rgba(0, 0, 0, .14); --gira: #fff; --gira-f: rgba(255, 255, 255, .3); }
.bt-cheio { width: 100%; }
.bt .i { width: 19px; height: 19px; stroke-width: 2.3; }
@media (hover: hover) and (pointer: fine) {
  .bt-g:hover { background: #3BE07B; }
  .bt-vidro:hover { background: rgba(255, 255, 255, .1); }
  .bt-pedup:hover { background: #FF7A1A; }
  .link:not(:disabled):hover { color: var(--tinta); }
}

/* Carregando: rodinha dentro do que foi clicado + barrinha no topo */
.ocupado { pointer-events: none; }
.ocupado:not(.capa):not(.item):not(.linha-bt):not(.play) { color: transparent !important; }
.ocupado:not(.capa):not(.item):not(.linha-bt) > * { opacity: 0; }
.item.ocupado > *, .linha-bt.ocupado > * { opacity: .35; }
.link.ocupado::before { width: 14px; height: 14px; border-width: 2px; }
a[data-sai]:not(.bt) { position: relative; }
.ocupado::before {
  content: ""; position: absolute; inset: 0; margin: auto; width: 20px; height: 20px; border-radius: 50%; z-index: 4;
  border: 2.5px solid var(--gira-f, rgba(255, 255, 255, .2)); border-top-color: var(--gira, var(--tinta));
  animation: gira .7s linear infinite;
}
@keyframes gira { to { transform: rotate(360deg); } }
.carga { position: fixed; z-index: 90; top: env(safe-area-inset-top, 0px); left: 0; right: 0; height: 2.5px; background: var(--menta); box-shadow: 0 0 12px rgba(67, 227, 147, .7); transform-origin: left; transform: scaleX(0); opacity: 0; pointer-events: none; }
.carga.indo { opacity: 1; transform: scaleX(.75); transition: transform 1.4s var(--sai); }
.carga.fim { opacity: 0; transform: scaleX(1); transition: transform .2s var(--sai), opacity .3s var(--sai) .15s; }


/* Topo (depois de entrar) */
.topo { position: sticky; top: env(safe-area-inset-top, 0px); z-index: 20; background: rgba(5, 11, 8, .84); -webkit-backdrop-filter: saturate(1.4) blur(14px); backdrop-filter: saturate(1.4) blur(14px); box-shadow: 0 1px 0 var(--linha); }
.topo-in { display: flex; align-items: center; gap: 16px; height: var(--topo); }
.marca { display: inline-flex; align-items: center; gap: 10px; font-weight: 650; font-stretch: 84%; font-size: 16.5px; white-space: nowrap; position: relative; }
.marca img { width: 34px; height: 34px; border-radius: 50%; box-shadow: 0 0 0 1.5px var(--linha-2); }
.marca .no { font-weight: 400; color: var(--tinta-2); }
.menu { display: flex; gap: 2px; margin-left: 14px; }
.menu button { height: 36px; padding: 0 14px; border-radius: 999px; color: var(--tinta-2); font-size: 14.5px; font-weight: 600; position: relative; }
.menu button[aria-current="true"] { color: var(--tinta); background: rgba(255, 255, 255, .07); }
.eu { margin-left: auto; display: flex; align-items: center; gap: 10px; position: relative; }
.pill { display: inline-flex; align-items: center; gap: 8px; height: 34px; padding: 0 12px 0 6px; border-radius: 999px; background: rgba(255, 255, 255, .05); box-shadow: inset 0 0 0 1px var(--linha); font-size: 13px; color: var(--tinta-2); white-space: nowrap; }
.pill b { color: var(--tinta); font-weight: 700; }
.anel { --p: 0; width: 22px; height: 22px; border-radius: 50%; background: conic-gradient(var(--menta) calc(var(--p) * 1%), rgba(255, 255, 255, .12) 0); -webkit-mask: radial-gradient(circle, transparent 6.5px, #000 7px); mask: radial-gradient(circle, transparent 6.5px, #000 7px); transition: --p .6s; }
.avatar { width: 36px; height: 36px; border-radius: 50%; background: var(--campo); color: var(--menta); font-weight: 800; font-size: 15px; box-shadow: inset 0 0 0 1.5px rgba(67, 227, 147, .4); display: grid; place-items: center; text-transform: uppercase; }
.eu-menu { position: absolute; top: calc(100% + 10px); right: 0; width: 250px; padding: 14px; border-radius: 16px; background: var(--cartao-2); box-shadow: 0 0 0 1px var(--linha-2), 0 24px 48px -16px rgba(0, 0, 0, .8); display: grid; gap: 12px; animation: entra .2s var(--sobe) backwards; }
.eu-menu small { display: block; color: var(--tinta-3); font-size: 12px; }
.eu-menu b { display: block; font-size: 14px; overflow-wrap: anywhere; }
.pill-longo { display: none; }
@media (min-width: 560px) { .pill-longo { display: inline; } .pill-curto { display: none; } }
@media (max-width: 899px) { .menu { display: none; } }
@media (max-width: 380px) { .marca .no { display: none; } }
@media (hover: hover) and (pointer: fine) { .menu button:hover { color: var(--tinta); } }

/* Abas de baixo (celular) */
.abas { position: fixed; z-index: 25; left: 0; right: 0; bottom: 0; display: grid; grid-template-columns: repeat(3, 1fr); padding: 6px max(8px, env(safe-area-inset-right, 0px)) calc(6px + env(safe-area-inset-bottom, 0px)) max(8px, env(safe-area-inset-left, 0px)); background: rgba(5, 11, 8, .92); -webkit-backdrop-filter: blur(14px); backdrop-filter: blur(14px); box-shadow: 0 -1px 0 var(--linha); }
.abas button { position: relative; display: flex; flex-direction: column; align-items: center; gap: 3px; padding: 6px 0 4px; font-size: 11px; font-weight: 600; color: var(--tinta-3); }
.abas button[aria-current="true"] { color: var(--menta); }
.abas .i { width: 22px; height: 22px; }
body.dentro { padding-bottom: calc(68px + env(safe-area-inset-bottom, 0px)); }
@media (min-width: 900px) { .abas { display: none; } body.dentro { padding-bottom: 0; } }

/* Troca de tela */
.entra { animation: entra .32s var(--sobe) backwards; }
@keyframes entra { from { opacity: 0; transform: translateY(8px); } }

/* ============ ENTRAR ============ */
.entrar { position: relative; overflow: hidden; isolation: isolate; }
.parede { position: absolute; z-index: -1; pointer-events: none; overflow: hidden; inset: 0 0 auto 0; height: 330px; -webkit-mask: linear-gradient(180deg, #000 35%, transparent 96%); mask: linear-gradient(180deg, #000 35%, transparent 96%); }
.parede::after { content: ""; position: absolute; inset: 0; background: radial-gradient(80% 70% at 50% 100%, rgba(5, 11, 8, .2), rgba(5, 11, 8, .55)); }
.parede-in { position: absolute; left: 50%; top: -120px; width: 760px; display: grid; grid-template-columns: repeat(4, 1fr); gap: 14px; transform: translateX(-50%) rotate(-9deg); transform-origin: 50% 220px; }
.parede .col { animation: desce 80s linear infinite; }
.parede .col:nth-child(2n) { animation-direction: reverse; animation-duration: 96s; }
.parede img { width: 100%; border-radius: 12px; margin-bottom: 14px; box-shadow: 0 0 0 1px rgba(255, 255, 255, .06); }
@keyframes desce { from { transform: translateY(0); } to { transform: translateY(-50%); } }
.entrar::before { content: ""; position: absolute; z-index: -1; left: -10%; top: 160px; width: 80%; height: 520px; background: radial-gradient(closest-side, rgba(67, 227, 147, .14), transparent); pointer-events: none; }
.entrar-lado { position: relative; padding-top: 236px; padding-bottom: 48px; }
.painel { width: min(460px, 100%); display: grid; gap: 18px; }
.painel .marca { margin-bottom: 4px; }
.entrar-tit { font-size: clamp(46px, 12.5vw, 84px); }
.form { display: grid; gap: 12px; margin-top: 6px; }
.rot { font-size: 13.5px; font-weight: 600; color: var(--tinta-2); }
.campo { display: flex; align-items: center; gap: 10px; height: 58px; padding: 0 16px; border-radius: 16px; background: rgba(255, 255, 255, .045); box-shadow: inset 0 0 0 1px var(--linha-2); transition: box-shadow .15s var(--sai), background-color .15s var(--sai); }
.campo .i { color: var(--tinta-3); }
.campo:focus-within { box-shadow: inset 0 0 0 2px var(--menta); background: rgba(67, 227, 147, .05); }
.campo input { flex: 1; min-width: 0; height: 100%; border: 0; background: none; outline: none; color: var(--tinta); font: inherit; font-size: 17px; }
.campo input::placeholder { color: var(--tinta-3); }
.campo.erra, .slots.erra { animation: treme .42s var(--sai); }
.campo.erra { box-shadow: inset 0 0 0 2px var(--erro); }
@keyframes treme { 20% { transform: translateX(-7px); } 40% { transform: translateX(6px); } 60% { transform: translateX(-4px); } 80% { transform: translateX(2px); } }
.erro { color: var(--erro); font-size: 14px; }
.enviado { font-size: 15px; color: var(--tinta-2); }
.enviado b { color: var(--tinta); font-weight: 650; }
.slots { position: relative; display: grid; grid-template-columns: repeat(6, 1fr); gap: 8px; }
.slots input { position: absolute; inset: 0; z-index: 2; width: 100%; height: 100%; opacity: 0; border: 0; font-size: 16px; caret-color: transparent; color: transparent; background: none; }
.slots span { height: 62px; border-radius: 14px; background: rgba(255, 255, 255, .045); box-shadow: inset 0 0 0 1px var(--linha-2); display: grid; place-items: center; font-size: 28px; font-weight: 700; font-stretch: 85%; transition: box-shadow .15s var(--sai), background-color .15s var(--sai); }
.slots span.cheio { box-shadow: inset 0 0 0 1px rgba(67, 227, 147, .5); background: rgba(67, 227, 147, .07); animation: pop .2s var(--sai); }
.slots.foco span.vez { box-shadow: inset 0 0 0 2px var(--menta); }
.slots.foco span.vez::after { content: ""; width: 2px; height: 28px; background: var(--menta); animation: pisca 1s steps(1) infinite; }
.slots.erra span { box-shadow: inset 0 0 0 2px var(--erro); }
@keyframes pop { 50% { transform: scale(1.08); } }
@keyframes pisca { 50% { opacity: 0; } }
.cod-links { display: flex; justify-content: space-between; gap: 12px; flex-wrap: wrap; }
.ajuda { font-size: 14px; color: var(--tinta-3); }
.ajuda a { color: var(--tinta-2); text-underline-offset: 3px; }
.sem-senha { display: flex; gap: 18px; flex-wrap: wrap; font-size: 13px; color: var(--tinta-2); }
.sem-senha span { display: inline-flex; align-items: center; gap: 6px; }
.sem-senha .i { width: 16px; height: 16px; color: var(--menta); stroke-width: 2.6; }

@media (min-width: 900px) {
  .entrar { min-height: max(640px, calc(100svh - 41px)); display: flex; }
  .parede { inset: 0 0 0 40%; height: auto; -webkit-mask: linear-gradient(90deg, transparent, #000 32%); mask: linear-gradient(90deg, transparent, #000 32%); }
  .parede::after { background: linear-gradient(180deg, var(--fundo), transparent 16%, transparent 84%, var(--fundo)), rgba(5, 11, 8, .25); }
  .parede-in { width: 980px; gap: 18px; top: -170px; transform-origin: 50% 440px; }
  .parede img { margin-bottom: 18px; border-radius: 14px; }
  .entrar::before { left: -12%; top: 10%; width: 60%; height: 80%; }
  .entrar-lado { display: flex; align-items: center; padding-block: 56px; }
}

/* Notificação do e-mail (simulada) */

/* ============ INÍCIO ============ */
.palco { position: relative; overflow: hidden; isolation: isolate; }
.palco::before { content: ""; position: absolute; z-index: -1; inset: 0; background: radial-gradient(95% 42% at 50% 24%, rgba(21, 96, 63, .7), transparent 72%), radial-gradient(60% 40% at 0% 0%, rgba(67, 227, 147, .07), transparent); }
@media (min-width: 900px) { .palco::before { background: radial-gradient(48% 78% at 78% 48%, rgba(21, 96, 63, .7), transparent 72%), radial-gradient(40% 60% at 6% 0%, rgba(67, 227, 147, .07), transparent); } }
.palco-in { display: grid; grid-template-areas: "oi" "capas" "txt"; padding-block: 20px 36px; }
.oi { grid-area: oi; font-size: 15px; color: var(--tinta-2); }
.oi b { color: var(--tinta); font-weight: 650; }
.palco-txt { grid-area: txt; display: grid; gap: 14px; justify-items: start; }
.ponto { width: 7px; height: 7px; border-radius: 50%; background: var(--menta); box-shadow: 0 0 0 0 rgba(67, 227, 147, .6); animation: ponto 2s var(--sai) infinite; }
@keyframes ponto { 70%, 100% { box-shadow: 0 0 0 8px rgba(67, 227, 147, 0); } }
.palco-linha { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
.palco-mod { font-size: 13.5px; color: var(--tinta-2); }
.palco-tit { font-size: clamp(46px, 12.6vw, 78px); }
.palco-tit .p { display: inline-block; overflow: hidden; vertical-align: top; padding-top: .14em; margin-top: -.14em; padding-bottom: .04em; }
.palco-tit .pi { display: inline-block; animation: palavra .7s var(--sobe) backwards; animation-delay: calc(var(--i) * 55ms + 60ms); }
@keyframes palavra { from { transform: translateY(105%); } }
.visto { display: flex; align-items: center; gap: 12px; font-size: 13.5px; color: var(--tinta-2); width: min(360px, 100%); }
.visto .trilho { flex: 1; height: 5px; border-radius: 99px; background: rgba(255, 255, 255, .12); overflow: hidden; }
.visto .trilho i { display: block; height: 100%; width: 0; border-radius: inherit; background: var(--menta); transition: width .9s var(--sobe) .3s; }
.acoes { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 6px; }
@media (max-width: 599px) { .acoes { display: grid; width: 100%; } }
.com { display: inline-flex; align-items: center; gap: 8px; font-size: 13px; color: var(--tinta-2); }
.com img { width: 26px; height: 26px; border-radius: 50%; object-fit: cover; box-shadow: 0 0 0 1.5px rgba(67, 227, 147, .5); }
.com b { color: var(--tinta); font-weight: 650; }

.palco-capas { grid-area: capas; position: relative; height: 262px; margin-block: 8px 18px; cursor: pointer; }
.palco-capas::before { content: ""; position: absolute; left: 50%; top: 55%; width: 340px; height: 200px; transform: translate(-50%, -50%); background: radial-gradient(closest-side, rgba(67, 227, 147, .35), transparent); filter: blur(20px); }
.pc { position: absolute; top: 50%; border-radius: 12px; box-shadow: 0 0 0 1px rgba(255, 255, 255, .1), 0 30px 60px -20px rgba(0, 0, 0, .85); }
.pc-meio { z-index: 2; left: 50%; width: 156px; transform: translate(-50%, -50%) perspective(1100px) rotateY(var(--ry, -10deg)) rotateX(var(--rx, 3deg)); transition: transform .45s var(--sai); animation: meioEntra .8s var(--sobe) backwards; }
.pc-esq, .pc-dir { width: 116px; filter: brightness(.55) saturate(.8); }
.pc-esq { left: calc(50% - 152px); transform: translateY(-50%) rotate(-8deg); animation: esqEntra .8s var(--sobe) .08s backwards; }
.pc-dir { left: calc(50% + 36px); transform: translateY(-50%) rotate(8deg); animation: dirEntra .8s var(--sobe) .08s backwards; }
@keyframes meioEntra { from { opacity: 0; transform: translate(-50%, -42%) perspective(1100px) rotateY(-26deg) rotateX(8deg); } }
@keyframes esqEntra { from { opacity: 0; transform: translate(36px, -50%) rotate(0); } }
@keyframes dirEntra { from { opacity: 0; transform: translate(-36px, -50%) rotate(0); } }

@media (min-width: 900px) {
  .palco-in { grid-template-columns: minmax(0, 1.15fr) minmax(0, .85fr); grid-template-areas: "oi capas" "txt capas"; grid-template-rows: auto 1fr; column-gap: 32px; padding-block: 28px 36px; }
  .palco-txt { align-content: start; padding-top: 18px; }
  .palco-capas { height: 390px; margin: 0; align-self: center; }
  .palco-capas::before { width: 520px; height: 360px; }
  .pc-meio { width: 226px; border-radius: 16px; }
  .pc-esq, .pc-dir { width: 168px; border-radius: 14px; }
  .pc-esq { left: calc(50% - 212px); }
  .pc-dir { left: calc(50% + 50px); }
}

.secao { padding-top: 56px; }
#aulas.secao { padding-top: 28px; }
@media (max-width: 899px) { .secao { padding-top: 32px; } .secao-cab { margin-bottom: 14px; } .secao-cab h2 { font-size: clamp(30px, 8.6vw, 40px); } }
.secao-cab { display: flex; flex-wrap: wrap; align-items: flex-end; justify-content: space-between; gap: 8px 24px; margin-bottom: 20px; }
.secao-cab > div { display: grid; gap: 8px; }
.secao-cab h2 { font-size: clamp(32px, 7vw, 46px); }
.secao-cab p { color: var(--tinta-2); font-size: 15px; max-width: 44ch; }

/* Celular: "Continue de onde parou" vira um cartão compacto (capa pequena + texto + botão),
   para os módulos aparecerem logo (pedido do Pedro: estava grande demais) */
@media (max-width: 899px) {
  .palco-in { grid-template-columns: 96px minmax(0, 1fr); grid-template-areas: "oi oi" "capas txt"; column-gap: 16px; row-gap: 12px; align-items: start; padding-block: 16px 24px; }
  .palco-capas { height: auto; margin: 0; }
  .palco-capas::before, .pc-esq, .pc-dir { display: none; }
  .pc-meio { position: static; display: block; width: 100%; transform: none; border-radius: 10px; animation: none; }
  .palco-txt { gap: 8px; }
  .palco-txt .sobre { font-size: 11px; }
  .palco-linha { gap: 8px; }
  .palco-linha .selo { height: 22px; padding: 0 9px; font-size: 11.5px; }
  .palco-mod { font-size: 12.5px; }
  .palco-tit { font-size: clamp(26px, 7.6vw, 34px); }
  #palco-sub, .palco-txt .com, .acoes [data-rolar="aulas"] { display: none; }
  .visto { font-size: 12px; gap: 4px 8px; flex-wrap: wrap; width: 100%; }
  .palco .visto .trilho { flex-basis: 100%; }
  .acoes { display: flex; width: auto; margin-top: 2px; }
  .acoes .bt-grande { min-height: 44px; padding: 0 20px; font-size: 14px; }
  .oi { display: none; }
  .palco-in { grid-template-areas: "capas txt"; padding-top: 18px; }
  .palco-mod { display: block; max-width: 100%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
  .palco-txt { min-width: 0; width: 100%; }
  .palco-linha { flex-wrap: nowrap; width: 100%; min-width: 0; overflow: hidden; }
  .palco-linha .selo { flex: none; }
  .palco-mod { flex: 1; min-width: 0; }
  .palco-tit { font-size: clamp(24px, 6.8vw, 30px); }
  #aulas .secao-cab p, #aulas .secao-cab .sobre { display: none; }
}

/* Os 7 módulos: uma fileira no computador; no celular, duas colunas com as capas grandes */
.mods { --cw: 136px; display: flex; gap: 14px; overflow-x: auto; scroll-snap-type: x mandatory; scrollbar-width: none; margin-inline: calc(-1 * max(16px, env(safe-area-inset-left, 0px))); padding-inline: max(16px, env(safe-area-inset-left, 0px)); scroll-padding-inline: max(16px, env(safe-area-inset-left, 0px)); padding-block: 6px 4px; }
.mods::-webkit-scrollbar { display: none; }
@media (max-width: 899px) {
  .mods { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 18px 12px; overflow: visible; margin-inline: 0; padding-inline: 0; container-type: inline-size; }
  .mods .capa { --cw: calc((100cqw - 12px) / 2); width: auto; }
}
@media (min-width: 900px) {
  .mods { container-type: inline-size; overflow: visible; margin-inline: 0; padding-inline: 0; gap: 16px; }
  .mods .capa { --cw: calc((100cqw - 16px * (var(--n, 7) - 1)) / var(--n, 7)); }
}
.capa { position: relative; display: grid; gap: 8px; width: var(--cw); flex: none; scroll-snap-align: start; align-content: start; }
.capa-img { position: relative; display: block; border-radius: 12px; transition: transform .25s var(--sai); }
.capa-img img { width: 100%; aspect-ratio: 2 / 3; object-fit: cover; border-radius: 12px; box-shadow: 0 0 0 1px rgba(255, 255, 255, .08), 0 18px 36px -18px rgba(0, 0, 0, .9); transition: filter .25s var(--sai), box-shadow .25s var(--sai); }
.capa-play { position: absolute; left: 50%; top: 50%; width: 52px; height: 52px; margin: -26px 0 0 -26px; border-radius: 50%; background: var(--zap); color: var(--zap-texto); display: grid; place-items: center; opacity: 0; transform: scale(.85); transition: opacity .2s var(--sai), transform .25s var(--sai); box-shadow: 0 12px 30px -8px rgba(0, 0, 0, .6); }
.capa-play .i { width: 22px; height: 22px; margin-left: 3px; }
.capa.agora .capa-img img { box-shadow: 0 0 0 2px var(--menta), 0 0 32px -6px rgba(67, 227, 147, .55), 0 18px 36px -18px rgba(0, 0, 0, .9); }
.capa.ocupado .capa-img img { filter: brightness(.4); }
.capa.ocupado::before { top: 0; bottom: auto; margin-top: calc(var(--cw) * .75 - 10px); }
.capa-barra { display: block; height: 3px; border-radius: 99px; background: rgba(255, 255, 255, .1); overflow: hidden; }
.capa-barra i { display: block; height: 100%; border-radius: inherit; background: var(--menta); }
.capa-leg { display: flex; align-items: center; gap: 6px; font-size: 12.5px; color: var(--tinta-3); font-weight: 600; white-space: nowrap; }
.capa-leg .i { width: 14px; height: 14px; stroke-width: 3; color: var(--menta); }
.capa.feita .capa-leg { color: var(--tinta-2); }
.capa.agora .capa-leg { color: var(--menta); }
@media (hover: hover) and (pointer: fine) {
  .capa:hover .capa-img { transform: translateY(-4px); }
  .capa:hover .capa-img img { filter: brightness(.78); }
  .capa:hover .capa-play { opacity: 1; transform: scale(1); }
}

/* Bônus */

/* Presente PedUp: o cardápio trancado, que abre quando o aluno faz o cadastro no PedUp */
.extras { display: grid; gap: 12px; }

.tranca { position: relative; display: grid; grid-template-columns: 112px minmax(0, 1fr); grid-template-areas: "capa cab" "cupom cupom" "corpo corpo"; gap: 18px; padding: 18px; border-radius: 24px; background: linear-gradient(160deg, #0F2219, #08130D 70%); box-shadow: inset 0 0 0 1px var(--linha-2); overflow: hidden; isolation: isolate; transition: box-shadow .6s var(--sai); }
.tranca::before { content: ""; position: absolute; z-index: -1; left: -20%; top: -40%; width: 80%; height: 90%; background: radial-gradient(closest-side, rgba(67, 227, 147, .12), transparent); }
.tranca::after { content: ""; position: absolute; z-index: -1; right: -25%; bottom: -45%; width: 75%; height: 90%; background: radial-gradient(closest-side, rgba(255, 107, 0, .13), transparent); }
.tranca[data-aberto="sim"] { box-shadow: inset 0 0 0 1.5px rgba(67, 227, 147, .55), 0 0 60px -20px rgba(67, 227, 147, .5); }
.tranca[data-aberto="nao"] .so-aberto, .tranca[data-aberto="sim"] .so-trancado { display: none !important; }
.tranca[data-aberto="sim"] .so-aberto { animation: entra .35s var(--sobe) backwards; }
.tranca-cab { grid-area: cab; display: grid; gap: 8px; align-content: center; justify-items: start; }
.tranca-cab h3 { font-size: clamp(30px, 8vw, 42px); }
.tranca .cupom { grid-area: cupom; }
@media (max-width: 899px) { .tranca[data-aberto="sim"] { grid-template-areas: "capa cab" "corpo corpo" "cupom cupom"; } }
.tranca .pres-tit { font-size: clamp(26px, 6.6vw, 34px); }
.achou { display: flex; gap: 10px; align-items: flex-start; padding: 12px 14px; border-radius: 14px; background: rgba(67, 227, 147, .07); box-shadow: inset 0 0 0 1px rgba(67, 227, 147, .28); font-size: 14.5px !important; color: var(--tinta) !important; }
.achou .i { flex: none; width: 18px; height: 18px; margin-top: 1px; color: var(--menta); stroke-width: 2.6; }
.dias { display: grid; gap: 8px; }
.dias-txt { display: flex; justify-content: space-between; gap: 12px; font-size: 13.5px; color: var(--tinta-2); }
.dias-txt b { color: var(--tinta); font-weight: 650; }
.dias-trilho { height: 6px; border-radius: 9px; background: rgba(255, 255, 255, .1); overflow: hidden; }
.dias-trilho i { display: block; height: 100%; width: var(--p, 100%); border-radius: inherit; background: var(--pedup-claro); transition: width .8s var(--sai) .2s; }
.estado { display: inline-flex; align-items: center; gap: 6px; height: 26px; padding: 0 10px 0 8px; border-radius: 999px; font-size: 12px; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; background: rgba(255, 255, 255, .07); color: var(--tinta-2); box-shadow: inset 0 0 0 1px var(--linha-2); }
.estado .i { width: 14px; height: 14px; stroke-width: 2.4; }
.tranca[data-aberto="sim"] .estado { background: rgba(67, 227, 147, .14); color: var(--menta); box-shadow: inset 0 0 0 1px rgba(67, 227, 147, .45); }
.tranca-corpo { grid-area: corpo; display: grid; gap: 14px; align-content: start; justify-items: start; }
.tranca-corpo p { color: var(--tinta-2); font-size: 15px; }
.tranca-corpo .dias { width: 100%; }
.tranca-acoes { display: flex; align-items: center; gap: 12px 18px; flex-wrap: wrap; }
.preco { display: grid; font-size: 12px; color: var(--tinta-3); line-height: 1.3; }
.preco b { color: var(--tinta); font-size: 15px; font-weight: 650; }
@media (min-width: 900px) {
  .tranca { grid-template-columns: 180px minmax(0, 1fr) minmax(0, 400px); grid-template-areas: "capa cab cupom" "capa corpo cupom"; grid-template-rows: auto 1fr; column-gap: 28px; row-gap: 16px; padding: 24px; }
  .tranca-cab { align-content: end; }
  .tranca .cupom { align-self: center; }
}

/* A capa trancada (mesmo molde das capas das aulas) */
.ec { grid-area: capa; container-type: inline-size; position: relative; aspect-ratio: 2 / 3; border-radius: 12px; background: radial-gradient(120% 70% at 50% 0%, #15603F, #0B3A25 50%, #062317); box-shadow: 0 0 0 1px rgba(255, 255, 255, .1), 0 20px 40px -18px rgba(0, 0, 0, .9); overflow: hidden; align-self: start; }
.ec-in { position: absolute; inset: 0; padding: 7cqw 7cqw 8cqw; display: flex; flex-direction: column; gap: 6cqw; }
.ec-topo { display: flex; align-items: center; gap: 3cqw; font-size: 5.4cqw; font-weight: 700; font-stretch: 80%; white-space: nowrap; }
.ec-topo span { min-width: 0; overflow: hidden; text-overflow: ellipsis; }
.ec-topo img { width: 10cqw; height: 10cqw; border-radius: 50%; }
.ec-topo i { font-style: normal; font-weight: 400; opacity: .8; }
.ec-topo b { flex: none; margin-left: auto; background: var(--zap); color: var(--zap-texto); border-radius: 99px; padding: 1cqw 3cqw; font-size: 5.2cqw; letter-spacing: .06em; }
.ec-janela { position: relative; flex: 1; border-radius: 5cqw; overflow: hidden; background: #0A0F0C; box-shadow: 0 0 0 1px rgba(67, 227, 147, .35); }
.ec-janela img { width: 100%; height: 100%; object-fit: cover; object-position: top; filter: blur(7px) saturate(.25) brightness(.55); transform: scale(1.18); transition: filter 1s var(--sai) .25s, transform 1s var(--sai) .25s; }
.ec-cad { position: absolute; left: 50%; top: 50%; width: 40cqw; height: 40cqw; margin: -20cqw 0 0 -20cqw; border-radius: 50%; display: grid; place-items: center; background: rgba(5, 11, 8, .55); -webkit-backdrop-filter: blur(6px); backdrop-filter: blur(6px); box-shadow: 0 0 0 1px rgba(67, 227, 147, .5), 0 0 30px -4px rgba(67, 227, 147, .45); color: var(--menta); transition: opacity .4s var(--sai) .55s, transform .5s var(--sai) .55s; }
.ec-cad svg { width: 52%; height: 52%; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; overflow: visible; }
.alca { transform-box: view-box; transform-origin: 16px 11px; transition: transform .45s var(--sobe); }
.ec-tit { font-size: 15cqw; line-height: .9; }
.ec-barras { display: flex; gap: 2.4cqw; }
.ec-barras i { flex: 1; height: 1.8cqw; border-radius: 9px; background: rgba(255, 255, 255, .18); }
.ec-barras i:first-child { background: var(--menta); }
.tranca[data-aberto="sim"] .ec-janela img { filter: none; transform: scale(1); }
.tranca[data-aberto="sim"] .alca { transform: translateY(-3px) rotate(-28deg); }
.tranca[data-aberto="sim"] .ec-cad { opacity: 0; transform: scale(.6); }
.tranca[data-aberto="sim"] .ec-barras i { background: var(--menta); }
.tranca[data-aberto="sim"] .canhoto b { color: var(--menta); }

/* Os benefícios: um cupom de verdade, com canhoto */
.cupom { display: grid; grid-template-columns: minmax(0, 1fr) 62px; border-radius: 16px; background: rgba(255, 255, 255, .035); box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .09); --furo: 9px; -webkit-mask: radial-gradient(circle at calc(100% - 62px) 0, transparent var(--furo), #000 calc(var(--furo) + .5px)) top / 100% 51% no-repeat, radial-gradient(circle at calc(100% - 62px) 100%, transparent var(--furo), #000 calc(var(--furo) + .5px)) bottom / 100% 51% no-repeat; mask: radial-gradient(circle at calc(100% - 62px) 0, transparent var(--furo), #000 calc(var(--furo) + .5px)) top / 100% 51% no-repeat, radial-gradient(circle at calc(100% - 62px) 100%, transparent var(--furo), #000 calc(var(--furo) + .5px)) bottom / 100% 51% no-repeat; }
.cupom-main { display: grid; gap: 10px; padding: 16px; min-width: 0; }
.pres-de { display: flex; align-items: center; gap: 8px; font-size: 13px; font-weight: 650; color: var(--tinta-2); }
.pres-de img { width: 26px; height: 26px; }
.pres-tit { font-size: clamp(30px, 8vw, 42px); }
.pres-tit span { color: var(--pedup-claro); }
.pres-antes { font-size: 14px; color: var(--tinta-2); }
.pres-antes s { color: var(--tinta-3); }
.pres-lista { list-style: none; padding: 0; display: grid; gap: 8px; font-size: 14.5px; }
.pres-lista li { display: flex; gap: 9px; align-items: flex-start; }
.pres-lista .i { width: 18px; height: 18px; margin-top: 2px; color: var(--pedup-claro); stroke-width: 2.6; }
.canhoto { display: grid; place-items: center; align-content: center; gap: 6px; border-left: 2px dashed rgba(255, 255, 255, .16); }
.canhoto span { writing-mode: vertical-rl; transform: rotate(180deg); font-size: 11px; letter-spacing: .2em; text-transform: uppercase; color: var(--tinta-3); font-weight: 700; }
.canhoto b { writing-mode: vertical-rl; transform: rotate(180deg); font-family: var(--f-titulo); font-weight: 800; font-stretch: 70%; font-size: 30px; letter-spacing: .06em; color: var(--pedup-claro); }
.canhoto b { transition: color .4s var(--sai); }
@media (min-width: 900px) { .cupom-main { padding: 20px; } }

/* Dúvidas */
.duvida { display: grid; grid-template-columns: 64px minmax(0, 1fr); gap: 14px 16px; align-items: center; margin-top: 56px; padding: 20px; border-radius: 22px; background: var(--cartao); box-shadow: inset 0 0 0 1px var(--linha); }
.duvida img { width: 64px; height: 64px; border-radius: 50%; object-fit: cover; box-shadow: 0 0 0 2px rgba(255, 255, 255, .14), 0 10px 24px -10px rgba(255, 107, 0, .6); }
.duvida h2 { font-size: 26px; }
.duvida p { font-size: 15px; color: var(--tinta-2); }
.duvida .bt { grid-column: 1 / -1; }
@media (min-width: 700px) { .duvida { grid-template-columns: 64px minmax(0, 1fr) auto; padding: 20px 24px; } .duvida .bt { grid-column: auto; } }
.rodape { padding-block: 28px 36px; font-size: 13px; color: var(--tinta-3); }

/* ============ AULA ============ */
.aula-grade { display: grid; gap: 28px; padding-block: 16px 56px; }
@media (min-width: 1040px) { .aula-grade { grid-template-columns: minmax(0, 1fr) 340px; align-items: start; gap: 32px; } }
.voltar { position: relative; display: inline-flex; align-items: center; gap: 6px; height: 36px; padding: 0 14px 0 8px; margin-bottom: 12px; border-radius: 999px; color: var(--tinta-2); font-weight: 600; font-size: 14px; }
.voltar .i { width: 18px; height: 18px; }
@media (hover: hover) and (pointer: fine) { .voltar:hover { color: var(--tinta); background: rgba(255, 255, 255, .06); } }
.player { position: relative; aspect-ratio: 16 / 9; border-radius: 18px; overflow: hidden; background: #000; box-shadow: 0 0 0 1px var(--linha-2), 0 40px 80px -40px rgba(0, 0, 0, .9); isolation: isolate; margin-inline: calc(-1 * max(16px, env(safe-area-inset-left, 0px))); border-radius: 0; }
@media (min-width: 600px) { .player { margin-inline: 0; border-radius: 18px; } }
.player-fundo { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; z-index: -2; }
.player.bonus .player-fundo { filter: blur(28px) brightness(.45) saturate(1.2); transform: scale(1.2); }
.player-capa { position: absolute; left: 50%; top: 50%; height: 84%; width: auto; aspect-ratio: 1; transform: translate(-50%, -50%); border-radius: 12px; box-shadow: 0 0 0 1px rgba(255, 255, 255, .12), 0 24px 50px -16px rgba(0, 0, 0, .9); }
.player.bonus .player-tit { display: none; }
.player.bonus .player-selo { display: inline-flex; }
.player::before { content: ""; position: absolute; inset: 0; z-index: -1; background: linear-gradient(0deg, rgba(5, 11, 8, .92), rgba(5, 11, 8, .12) 58%, rgba(5, 11, 8, .4)); }
.player-tit { position: absolute; left: 22px; bottom: 20px; right: 45%; display: none; gap: 10px; justify-items: start; }
.player-tit strong { font-family: var(--f-titulo); font-weight: 800; font-stretch: 68%; text-transform: uppercase; font-size: clamp(26px, 3.2vw, 40px); line-height: .92; }
.player-selo { position: absolute; left: 14px; top: 14px; }
@media (min-width: 700px) { .player-tit { display: grid; } .player-selo { display: none; } }
.play { position: absolute; left: 50%; top: 50%; width: 70px; height: 70px; margin: -35px 0 0 -35px; border-radius: 50%; background: var(--zap); color: var(--zap-texto); display: grid; place-items: center; animation: pulso 2.4s var(--sai) infinite; --gira: var(--zap-texto); --gira-f: rgba(3, 32, 13, .2); transition: transform .2s var(--sai); }
.play .i { width: 30px; height: 30px; margin-left: 4px; }
@media (min-width: 700px) { .play { width: 88px; height: 88px; margin: -44px 0 0 -44px; } .play .i { width: 36px; height: 36px; } }
@keyframes pulso { 0% { box-shadow: 0 0 0 0 rgba(37, 211, 102, .45); } 70%, 100% { box-shadow: 0 0 0 22px rgba(37, 211, 102, 0); } }
@media (hover: hover) and (pointer: fine) { .play:hover { transform: scale(1.06); } }

.aula-info { display: grid; gap: 12px; padding-top: 22px; justify-items: start; }
.aula-onde { font-size: 13.5px; color: var(--tinta-2); display: flex; gap: 8px; align-items: center; flex-wrap: wrap; }
.aula-onde b { color: var(--menta); font-size: 11.5px; letter-spacing: .12em; text-transform: uppercase; }
.aula-tit { font-size: clamp(38px, 9vw, 60px); }
.aula-acoes { display: grid; gap: 10px; width: 100%; margin-top: 6px; }
@media (min-width: 600px) { .aula-acoes { display: flex; flex-wrap: wrap; width: auto; } }
.bt-vista .ck { width: 22px; height: 22px; border-radius: 50%; box-shadow: inset 0 0 0 2px var(--tinta-3); display: grid; place-items: center; transition: background-color .25s var(--sai), box-shadow .25s var(--sai); }
.bt-vista .ck .i { width: 14px; height: 14px; stroke-width: 3.2; stroke-dasharray: 24; stroke-dashoffset: 24; transition: stroke-dashoffset .35s var(--sai) .08s; }
.bt-vista[aria-pressed="true"] { background: rgba(67, 227, 147, .12); box-shadow: inset 0 0 0 1px rgba(67, 227, 147, .5); color: var(--menta); }
.bt-vista[aria-pressed="true"] .ck { background: var(--menta); box-shadow: none; color: var(--zap-texto); }
.bt-vista[aria-pressed="true"] .ck .i { stroke-dashoffset: 0; }

.blocos { display: grid; gap: 14px; margin-top: 26px; }
@media (min-width: 700px) { .blocos { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
.bloco { display: grid; gap: 6px; align-content: start; padding: 16px; border-radius: 18px; background: var(--cartao); box-shadow: inset 0 0 0 1px var(--linha); }
.bloco h2 { display: flex; align-items: center; gap: 8px; margin-bottom: 6px; font-size: 12px; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; color: var(--tinta-2); }
.linha-bt { position: relative; display: grid; grid-template-columns: 42px minmax(0, 1fr) 20px; gap: 12px; align-items: center; width: 100%; padding: 8px; margin-inline: -8px; width: calc(100% + 16px); border-radius: 12px; }
.linha-bt .ic { width: 42px; height: 42px; border-radius: 11px; display: grid; place-items: center; background: var(--campo); color: var(--menta); }
.linha-bt .nome { font-size: 15px; font-weight: 600; line-height: 1.25; }
.linha-bt small { display: block; font-size: 12.5px; color: var(--tinta-3); }
.linha-bt > .i { color: var(--tinta-3); width: 18px; height: 18px; }
.linha-bt.prox { grid-template-columns: 56px minmax(0, 1fr) 20px; }
.linha-bt.prox img { width: 56px; aspect-ratio: 2 / 3; object-fit: cover; border-radius: 8px; box-shadow: 0 0 0 1px rgba(255, 255, 255, .1); }
.linha-bt.prox.quad img { aspect-ratio: 1; }
@media (hover: hover) and (pointer: fine) { .linha-bt:hover { background: rgba(255, 255, 255, .05); } }
.duvida-mini { display: flex; align-items: center; gap: 10px; margin-top: 18px; font-size: 14px; color: var(--tinta-2); }
.duvida-mini img { width: 30px; height: 30px; border-radius: 50%; object-fit: cover; }
.duvida-mini a { color: var(--menta); font-weight: 600; text-decoration: none; }

.lista { padding: 8px; border-radius: 20px; background: var(--cartao); box-shadow: inset 0 0 0 1px var(--linha); }
@media (min-width: 1040px) { .lista { position: sticky; top: calc(var(--topo) + env(safe-area-inset-top, 0px) + 16px); max-height: calc(100vh - var(--topo) - 40px); overflow: auto; scrollbar-width: thin; margin-top: 48px; } }
.lista-cab { display: grid; gap: 10px; padding: 12px 10px 6px; }
.lista-cab strong { font-size: 15.5px; }
.lista-cab .visto { width: 100%; font-size: 12.5px; }
a.linha-bt { color: inherit; text-decoration: none; }
.palco-mod:empty { display: none; }
.tag-bonus { display: inline-block; padding: 1px 8px; border-radius: 999px; font-size: 11px; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; color: var(--pedup-claro); box-shadow: inset 0 0 0 1px rgba(255, 148, 64, .45); }
.lista-mod { margin-top: 8px; padding-top: 10px; border-top: 1px solid var(--linha); }
.lista-mod-cab { display: grid; grid-template-columns: 34px minmax(0, 1fr) auto; gap: 12px; align-items: center; width: 100%; padding: 6px 8px; border-radius: 12px; text-align: left; }
.lista-mod-cab img { width: 34px; aspect-ratio: 2 / 3; object-fit: cover; border-radius: 6px; box-shadow: 0 0 0 1px rgba(255, 255, 255, .1); }
.lista-mod-cab small { display: block; font-size: 10.5px; font-weight: 700; letter-spacing: .14em; text-transform: uppercase; color: var(--menta); }
.lista-mod-cab b { display: block; font-family: var(--f-titulo); font-weight: 800; font-stretch: 72%; text-transform: uppercase; font-size: 17px; line-height: 1.05; color: var(--tinta); }
.lista-mod-n { font-size: 12px; font-weight: 600; color: var(--tinta-3); }
.lista-mod.aqui .lista-mod-cab { background: rgba(67, 227, 147, .07); }
.lista-mod.aqui .lista-mod-cab img { box-shadow: 0 0 0 1.5px var(--menta); }
.lista-aulas { display: grid; gap: 2px; margin: 4px 0 2px 25px; padding-left: 10px; border-left: 1.5px solid var(--linha-2); }
.lista-mod.aqui .lista-aulas { border-left-color: rgba(67, 227, 147, .5); }
.lista-mod-cab.trancado small { color: var(--pedup-claro); }
.lista-mod-cab.trancado .st { color: var(--menta); box-shadow: inset 0 0 0 1.5px rgba(67, 227, 147, .5); }
.lista-mod-cab.trancado .st .i { width: 12px; height: 12px; }
.item { position: relative; display: grid; grid-template-columns: 22px minmax(0, 1fr); gap: 10px; align-items: center; width: 100%; padding: 7px 8px; border-radius: 10px; text-align: left; }
.item small { display: block; font-size: 11.5px; color: var(--tinta-3); }
.item .nome { color: var(--tinta-2); }
.item[aria-current="true"] .nome { color: var(--tinta); }
.item .nome { font-size: 14px; font-weight: 600; line-height: 1.25; }
.item[aria-current="true"] { background: rgba(67, 227, 147, .1); }
.item[aria-current="true"] small { color: var(--menta); }
.st { width: 22px; height: 22px; border-radius: 50%; display: grid; place-items: center; box-shadow: inset 0 0 0 1.5px var(--linha-2); }
.st.feita { background: var(--menta); color: var(--zap-texto); box-shadow: none; }
.st .i { width: 13px; height: 13px; stroke-width: 3.2; }
.st.agora { color: var(--menta); box-shadow: inset 0 0 0 1.5px var(--menta); }
.st.agora .i { width: 11px; height: 11px; margin-left: 2px; }
@media (hover: hover) and (pointer: fine) { .item:hover { background: rgba(255, 255, 255, .05); } }

/* Folha de desbloquear */
.veu { position: fixed; inset: 0; z-index: 80; background: rgba(0, 0, 0, .6); -webkit-backdrop-filter: blur(4px); backdrop-filter: blur(4px); opacity: 0; transition: opacity .25s var(--sai); }
.veu.vem { opacity: 1; }
.folha { position: fixed; z-index: 81; left: 0; right: 0; bottom: 0; max-height: 92vh; overflow: auto; padding: 26px max(20px, env(safe-area-inset-right, 0px)) calc(24px + env(safe-area-inset-bottom, 0px)) max(20px, env(safe-area-inset-left, 0px)); border-radius: 26px 26px 0 0; background: #0E1E16; box-shadow: 0 0 0 1px var(--linha-2), 0 -30px 60px -20px rgba(0, 0, 0, .8); transform: translateY(30px); opacity: 0; transition: transform .35s var(--sobe), opacity .25s var(--sai); }
.folha.vem { transform: none; opacity: 1; }
.folha:focus { outline: none; }
@media (min-width: 700px) { .folha { left: 50%; top: 50%; bottom: auto; width: 460px; border-radius: 26px; padding: 30px; transform: translate(-50%, calc(-50% + 16px)); } .folha.vem { transform: translate(-50%, -50%); } }
.fechar { position: absolute; top: 14px; right: 14px; width: 38px; height: 38px; border-radius: 50%; display: grid; place-items: center; background: rgba(255, 255, 255, .06); color: var(--tinta-2); }
.passo { display: grid; gap: 14px; justify-items: start; animation: entra .3s var(--sobe) backwards; }
.passo h2 { font-size: clamp(32px, 8vw, 40px); padding-right: 40px; }
.folha-ic { width: 54px; height: 54px; border-radius: 16px; display: grid; place-items: center; background: var(--campo); color: var(--menta); box-shadow: inset 0 0 0 1px rgba(67, 227, 147, .4); }
.folha-ic .i { width: 26px; height: 26px; }
.passos { list-style: none; padding: 0; display: grid; gap: 10px; width: 100%; }
.passos li { display: grid; grid-template-columns: 30px minmax(0, 1fr); gap: 12px; align-items: start; font-size: 15px; color: var(--tinta-2); }
.passos b { width: 30px; height: 30px; border-radius: 50%; display: grid; place-items: center; background: rgba(67, 227, 147, .12); color: var(--menta); font-size: 14px; }
.passos span { padding-top: 4px; }
.folha-preco { display: flex; justify-content: space-between; align-items: baseline; width: 100%; padding: 12px 14px; border-radius: 14px; background: repeating-linear-gradient(-45deg, rgba(255, 255, 255, .025) 0 8px, transparent 8px 16px); box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .12); font-size: 14px; color: var(--tinta-2); }
.folha-preco b { color: var(--tinta); font-size: 16px; }
.espera { width: 54px; height: 54px; border-radius: 50%; border: 3px solid rgba(67, 227, 147, .18); border-top-color: var(--menta); animation: gira .8s linear infinite; }
.ok { width: 54px; height: 54px; border-radius: 50%; display: grid; place-items: center; background: var(--menta); color: var(--zap-texto); animation: pop .4s var(--sai); }
.ok .i { width: 28px; height: 28px; stroke-width: 3; }
.folha-ic-pedup { background: rgba(255, 107, 0, .12); box-shadow: inset 0 0 0 1px rgba(255, 148, 64, .4); }
.folha-ic-pedup img { width: 30px; height: 30px; }
.passo .form { width: 100%; }
.campo-cod input { text-align: center; text-indent: .32em; font-size: 26px; font-weight: 700; font-stretch: 85%; letter-spacing: .32em; }
.campo-cod input::placeholder { letter-spacing: .32em; }

/* Aviso pequeno */
.toast { position: fixed; z-index: 85; left: 50%; bottom: calc(24px + env(safe-area-inset-bottom, 0px)); display: flex; gap: 10px; align-items: center; width: max-content; max-width: calc(100% - 32px); padding: 12px 16px; border-radius: 14px; background: #16291F; box-shadow: 0 0 0 1px var(--linha-2), 0 20px 40px -12px rgba(0, 0, 0, .8); font-size: 14.5px; transform: translate(-50%, 16px); opacity: 0; pointer-events: none; transition: opacity .25s var(--sai), transform .3s var(--sobe); }
.toast.vem { opacity: 1; transform: translate(-50%, 0); }
.toast .i { color: var(--menta); width: 18px; height: 18px; stroke-width: 2.6; }
@media (max-width: 899px) { body.dentro .toast { bottom: calc(84px + env(safe-area-inset-bottom, 0px)); } }

/* Painel do dono */
.dono { display: grid; gap: 16px; padding-top: 32px; padding-bottom: 64px; }
.dono h1 { font-size: clamp(38px, 8vw, 60px); }
.dono-voltar { min-height: 40px; font-size: 14px; margin-left: auto; }
.dono-ligacoes { display: flex; flex-wrap: wrap; gap: 8px; }
.dono-ligacoes span { display: inline-flex; align-items: center; gap: 8px; padding: 8px 12px; border-radius: 999px; font-size: 13.5px; color: var(--tinta-2); background: var(--cartao); box-shadow: inset 0 0 0 1px var(--linha); }
.dono-ligacoes i { width: 8px; height: 8px; border-radius: 50%; background: var(--erro); }
.dono-ligacoes .ligado i { background: var(--menta); }
.dono-ligacoes b { color: var(--tinta); }
.dono-bloco { gap: 12px !important; padding: 20px !important; }
.dono-bloco h2 { font-size: 17px; }
.dono-ajuda { font-size: 14px; color: var(--tinta-2); }
.dono-form { display: grid; gap: 10px; }
.dono-form .campo, .dono-busca { height: 50px; }
.dono-form .campo input, .dono-busca input { font-size: 15.5px; }
@media (min-width: 800px) { .dono-form { grid-template-columns: minmax(0, 1.3fr) minmax(0, 1fr) auto; } }
.dono-cab { display: flex; flex-wrap: wrap; gap: 10px 16px; align-items: center; justify-content: space-between; }
.dono-busca { flex: 1; max-width: 420px; min-width: 220px; }
.dono-tabela { overflow-x: auto; margin-inline: -4px; }
.dono-tabela table { width: 100%; border-collapse: collapse; font-size: 14px; }
.dono-tabela th { text-align: left; font-size: 12px; font-weight: 650; color: var(--tinta-3); padding: 8px; white-space: nowrap; border-bottom: 1px solid var(--linha); }
.dono-tabela td { padding: 10px 8px; border-bottom: 1px solid var(--linha); vertical-align: top; white-space: nowrap; color: var(--tinta-2); }
.dono-tabela td b { display: block; color: var(--tinta); font-weight: 650; }
.dono-tabela td small { color: var(--tinta-3); }
.dono-tabela tr.sem td { opacity: .5; }
.dono-tabela tr.sem td:last-child { opacity: 1; }
a.marca { color: inherit; text-decoration: none; }
@media (max-width: 699px) {
  .dono-tabela thead { display: none; }
  .dono-tabela tr { display: flex; flex-wrap: wrap; align-items: baseline; gap: 4px 14px; padding: 12px 4px; border-bottom: 1px solid var(--linha); }
  .dono-tabela td { padding: 0; border: 0; white-space: normal; font-size: 13.5px; }
  .dono-tabela td:first-child { flex-basis: 100%; }
  .dono-tabela td small { overflow-wrap: anywhere; }
  .dono-tabela td:last-child { margin-left: auto; }
}
.dono-tabela td.dono-trava { white-space: normal; min-width: 220px; max-width: 420px; }
.dono-vazio { color: var(--tinta-3); font-size: 14px; padding: 8px 4px; }

/* 7º módulo: mentoria individual, trancada */
.capa.trancada .capa-img img { filter: brightness(.68) saturate(.92); }
.capa-tranca { position: absolute; inset: 0; display: flex; flex-direction: column; justify-content: flex-end; gap: 6px; padding: 9%; border-radius: 12px; background: linear-gradient(180deg, rgba(5, 11, 8, 0) 45%, rgba(5, 11, 8, .9)); box-shadow: inset 0 0 0 1px rgba(67, 227, 147, .35); }
.capa-tranca .cad { position: absolute; right: 8%; top: 6%; width: 24%; aspect-ratio: 1; border-radius: 50%; display: grid; place-items: center; background: rgba(5, 11, 8, .55); -webkit-backdrop-filter: blur(6px); backdrop-filter: blur(6px); box-shadow: 0 0 0 1px rgba(67, 227, 147, .5), 0 0 24px -4px rgba(67, 227, 147, .45); color: var(--menta); }
.capa-tranca .cad .i { width: 46%; height: 46%; }
.capa-tranca .selo { align-self: flex-start; height: 20px; padding: 0 8px; font-size: 10.5px; }
.capa-tranca b { font-family: var(--f-titulo); font-weight: 800; font-stretch: 68%; text-transform: uppercase; line-height: .9; font-size: calc(var(--cw) * .15); }
.capa-tranca b mark { display: block; }
.capa.trancada .capa-play { display: none; }
.capa.trancada .capa-leg { color: var(--menta); }
.folha-ic-foto { padding: 0; overflow: hidden; }
.folha-ic-foto img { width: 100%; height: 100%; object-fit: cover; }
.form-ment { gap: 8px; }
.form-ment .rot { margin-top: 6px; }
.chips { display: flex; flex-wrap: wrap; gap: 8px; }
.chips button { position: relative; min-height: 42px; padding: 0 16px; border-radius: 999px; font-size: 14.5px; font-weight: 600; color: var(--tinta-2); background: rgba(255, 255, 255, .045); box-shadow: inset 0 0 0 1px var(--linha-2); transition: background-color .15s var(--sai), color .15s var(--sai), box-shadow .15s var(--sai); }
.chips button[aria-checked="true"] { background: rgba(67, 227, 147, .14); color: var(--menta); box-shadow: inset 0 0 0 2px var(--menta); }
.chips.erra { animation: treme .42s var(--sai); }
.campo-texto { height: auto; padding: 12px 16px; align-items: flex-start; }
.campo-texto textarea { flex: 1; min-width: 0; border: 0; background: none; outline: none; resize: vertical; color: var(--tinta); font: inherit; font-size: 16px; line-height: 1.45; min-height: 72px; }
.campo-texto textarea::placeholder { color: var(--tinta-3); }
.mentoria-ok { display: inline-flex; align-items: center; gap: 6px; }

/* Barra de teste: só aparece para o e-mail de teste, no modo teste */
.barra-teste { background: #0A1C13; border-bottom: 1px solid var(--linha); font-size: 12.5px; color: var(--tinta-2); }
.barra-teste-in { display: flex; align-items: center; gap: 6px; padding-block: 7px; overflow-x: auto; scrollbar-width: none; white-space: nowrap; }
.barra-teste-in::-webkit-scrollbar { display: none; }
.barra-teste b { font-size: 10.5px; letter-spacing: .14em; color: var(--fundo); background: var(--pedup-claro); border-radius: 4px; padding: 2px 6px; margin-right: 4px; }
.barra-teste .sep { margin-left: 8px; }
.barra-teste button { position: relative; flex: none; height: 28px; padding: 0 12px; border-radius: 999px; box-shadow: inset 0 0 0 1px var(--linha-2); font-size: 12.5px; color: var(--tinta); }
.barra-teste button[aria-current="true"] { background: var(--menta); color: var(--zap-texto); box-shadow: none; font-weight: 700; }
@media (hover: hover) and (pointer: fine) { .barra-teste button:hover { background: rgba(255, 255, 255, .08); } .barra-teste button[aria-current="true"]:hover { background: var(--menta); } }

/* Vídeo do YouTube (não listado) dentro do quadro da aula */
.sprite { position: absolute; width: 0; height: 0; overflow: hidden; }
.video { position: absolute; inset: 0; z-index: 3; background: #000; }
.video iframe, .video > div { width: 100%; height: 100%; border: 0; display: block; }
.sem-video { position: absolute; inset: 0; z-index: 3; display: grid; place-content: center; justify-items: center; gap: 8px; padding: 20px; text-align: center; background: rgba(5, 11, 8, .82); -webkit-backdrop-filter: blur(4px); backdrop-filter: blur(4px); animation: entra .3s var(--sobe) backwards; }
.sem-video strong { font-size: clamp(16px, 2vw, 20px); }
.sem-video p { font-size: 14px; color: var(--tinta-2); max-width: 40ch; }

/* Modo de teste: o código aparece na tela (só para o e-mail de teste) */
.teste-cod { justify-self: start; display: inline-flex; flex-wrap: wrap; align-items: center; gap: 2px 10px; padding: 8px 12px; border-radius: 12px; font-size: 13.5px; color: var(--tinta-2); background: repeating-linear-gradient(-45deg, rgba(255, 255, 255, .03) 0 8px, transparent 8px 16px); box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .14); position: relative; }
.teste-cod span { white-space: nowrap; }
.teste-cod b { color: var(--menta); letter-spacing: .08em; font-size: 15px; margin-left: 4px; }
.teste-cod::before { content: "Teste"; font-size: 10px; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; color: var(--fundo); background: var(--tinta-3); border-radius: 4px; padding: 1px 5px; }

@media (prefers-reduced-motion: reduce) {
  .parede .col, .bt-grande::after, .ponto, .play, .palco-tit .pi, .pc, .entra, .passo, .eu-menu { animation: none !important; }
  .folha, .toast, .ec-janela img, .ec-cad, .alca, .visto .trilho i { transition-duration: .01ms !important; transition-delay: 0s !important; }
}