@font-face{font-family:"Plus Jakarta Sans";src:url(/fonte.woff2) format("woff2");font-weight:200 800;font-display:swap}
:root{--fs:"Plus Jakarta Sans","Segoe UI",system-ui,sans-serif;--bg:#F4F2EE;--sf:#fff;--bd:#E9E4DB;--bd2:#D9D2C6;--tx:#1F1C18;--tx2:#5F594F;--acc:#C19A4B;--acc2:#E2BF73;--acc-tx:#7F5F1C;--esc:#141210;--esc-tx2:#C9C1B3;--ouro:#F0CF86;--curva:cubic-bezier(.32,.72,0,1);--sh:inset 0 1px 0 rgba(255,255,255,.9),0 1px 2px rgba(31,28,24,.04),0 12px 32px -16px rgba(31,28,24,.22)}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--bg);color:var(--tx);font:16px/1.5 var(--fs);-webkit-font-smoothing:antialiased}
img,video{display:block;max-width:100%}
h1,h2,h3,p,ol,ul{margin:0}
ol,ul{padding:0;list-style:none}
a{color:inherit}
.miolo{width:100%;max-width:1136px;margin:0 auto;padding:0 32px}

/* botoes */
.bt{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:48px;padding:0 24px;border-radius:12px;border:1px solid var(--bd2);background:var(--sf);box-shadow:var(--sh);font:700 15px/1.2 var(--fs);color:var(--tx);text-decoration:none;cursor:pointer;transition:transform .2s var(--curva)}
.bt:hover{transform:translateY(-1px)}
.bt:focus-visible,a:focus-visible,input:focus-visible{outline:2px solid var(--acc);outline-offset:2px}
.bt.pri{background:linear-gradient(135deg,var(--acc2),var(--acc));border-color:transparent;color:#1A1508;box-shadow:0 0 24px rgba(226,191,115,.28)}
.bt.fan{background:rgba(255,255,255,.06);border-color:rgba(255,255,255,.26);color:#fff;box-shadow:none}
.ic{width:18px;height:18px;flex:0 0 18px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}

/* faixa escura com o brilho da capa */
.escuro{background:var(--esc);background-image:radial-gradient(1100px 620px at 84% -120px,rgba(226,191,115,.34),transparent 70%),radial-gradient(640px 400px at 8% 8%,rgba(193,154,75,.24),transparent 72%),radial-gradient(900px 360px at 40% 112%,rgba(193,154,75,.12),transparent 70%);background-repeat:no-repeat;color:#fff}
.marca{display:flex;gap:16px;align-items:center}
.marca img{width:72px;height:72px;flex:0 0 72px;border-radius:50%;filter:drop-shadow(0 0 16px rgba(226,191,115,.6))}
.marca b{display:block;font-size:17px;line-height:1.3}
.marca small{display:block;font-size:14px;color:var(--esc-tx2)}

.escuro.faixa{background-color:var(--esc);background-image:radial-gradient(640px 200px at 88% -72px,rgba(226,191,115,.16),transparent 72%)}

/* video: capa com um botao claro, sem controles ate o clique */
.video-caixa{position:relative;display:block;width:100%;height:100%}
.bt-play{position:absolute;left:50%;bottom:32px;transform:translateX(-50%);display:inline-flex;align-items:center;gap:8px;min-height:48px;padding:0 24px;border:0;border-radius:12px;background:linear-gradient(135deg,var(--acc2),var(--acc));color:#1A1508;font:700 15px/1.2 var(--fs);white-space:nowrap;cursor:pointer;box-shadow:0 0 24px rgba(226,191,115,.28)}
.bt-play[hidden]{display:none}
.bt-play:hover{filter:brightness(1.05)}
.bt-play:focus-visible{outline:2px solid #fff;outline-offset:2px}

/* Vitrine */
.topo{padding:32px 0 48px}
.topo h1{margin-top:48px;max-width:960px;text-wrap:balance;font-size:clamp(34px,5.4vw,64px);line-height:1.06;font-weight:800;letter-spacing:-.03em;text-shadow:0 0 48px rgba(226,191,115,.28)}
.topo .sub{margin-top:24px;max-width:860px;font-size:clamp(18px,2.2vw,24px);line-height:1.35;color:var(--esc-tx2)}
.topo .sub span{color:var(--ouro);font-weight:800;text-shadow:0 0 18px rgba(226,191,115,.7)}
.acoes{display:flex;flex-wrap:wrap;gap:12px;margin-top:32px}
.palco-video{margin-top:48px;border-radius:16px;overflow:hidden;background:#000;box-shadow:0 24px 64px -24px rgba(0,0,0,.8),0 0 0 1px rgba(255,255,255,.12)}
.palco-video video{width:100%;aspect-ratio:16/9;background:#000}

.bloco{padding:48px 0}
.bloco h2{text-wrap:balance;font-size:clamp(26px,3.4vw,40px);line-height:1.12;font-weight:800;letter-spacing:-.02em;max-width:900px}
.bloco .intro{margin-top:12px;font-size:18px;color:var(--tx2)}

.lista-aula{margin-top:32px;border-top:1px solid var(--bd2)}
.lista-aula li{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,1fr);gap:24px;padding:16px 0;border-bottom:1px solid var(--bd2);align-items:start}
.lista-aula b{font-size:18px;line-height:1.35;font-weight:700}
.lista-aula i{font-size:16px;line-height:1.5;color:var(--tx2)}

.metodo{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:32px;margin-top:32px;align-items:stretch}
.cartaz{display:block;border-radius:12px;overflow:hidden;border:1px solid var(--bd2);box-shadow:var(--sh);background:var(--sf)}
.cartaz img{width:100%;height:auto}
.passos{display:grid;grid-auto-rows:1fr;background:var(--sf);border:1px solid var(--bd);border-radius:12px;box-shadow:var(--sh);padding:8px 24px}
.passos .fase{display:flex;align-items:flex-end;padding-bottom:4px;font-size:13px;font-weight:800;color:var(--acc-tx)}
.passos .p{display:flex;align-items:center;gap:12px;font-size:15px;line-height:1.25;font-weight:600;border-top:1px solid var(--bd)}
.passos .fase + .p{border-top:0}
.passos .n{flex:0 0 32px;width:32px;height:32px;border-radius:50%;display:grid;place-items:center;background:var(--esc);color:var(--ouro);font-size:13px;font-weight:800}

.rodape{padding:32px 0}
.rodape .miolo{display:flex;flex-wrap:wrap;gap:24px;align-items:center;justify-content:space-between}
.rodape .fala{display:flex;flex-wrap:wrap;gap:12px;align-items:center}
.rodape a.tx{font-size:14px;color:var(--esc-tx2)}

/* Sala de Aula */
.cab-sala{padding:24px 0}
.cab-sala .miolo{display:flex;flex-wrap:wrap;gap:16px;align-items:center;justify-content:space-between}
.cab-sala .marca img{width:56px;height:56px;flex-basis:56px}
.cab-sala a.tx{font-size:14px;color:var(--esc-tx2)}
.sala{padding:32px 0 48px}
.fila{display:grid;gap:24px}
.fila.um{grid-template-columns:minmax(0,1.7fr) minmax(0,1fr)}
.fila.dois{grid-template-columns:minmax(0,1fr);margin-top:24px}
.cartao{display:flex;flex-direction:column;gap:12px;padding:24px;background:var(--sf);border:1px solid var(--bd);border-radius:16px;box-shadow:var(--sh)}
.cartao h2{font-size:20px;line-height:1.2;font-weight:800;letter-spacing:-.01em}
.cartao p{font-size:15px;color:var(--tx2)}
.cartao ul{display:grid;gap:8px;font-size:15px;color:var(--tx2)}
.cartao ul li{display:flex;gap:8px}
.cartao ul li::before{content:"";flex:0 0 8px;height:8px;margin-top:8px;background:var(--acc)}
.cartao .pe{display:flex;flex-wrap:wrap;gap:8px;margin-top:auto;padding-top:12px}
.cartao .pe .bt{flex:1 1 auto}
.cartao.linha{flex-direction:row;align-items:center;justify-content:space-between;gap:24px}
.cartao.linha>div{display:grid;gap:8px}
.cartao.linha .bt{flex:none}
.video-sala{border-radius:16px;overflow:hidden;background:#000;box-shadow:var(--sh)}
.video-sala video{width:100%;height:100%;aspect-ratio:16/9;object-fit:contain;background:#000}

/* porta da Sala */
.porta{min-height:100vh;min-height:100dvh;display:grid;place-items:center;padding:24px 16px}
.cartao-porta{width:100%;max-width:440px;padding:32px;display:grid;gap:12px;justify-items:center;text-align:center;background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.14);border-radius:16px}
.logo-porta{width:88px;height:88px;border-radius:50%;filter:drop-shadow(0 0 16px rgba(226,191,115,.6))}
.cartao-porta h1{font-size:28px;line-height:1.15;font-weight:800;letter-spacing:-.02em}
.cartao-porta>p{font-size:15px;color:var(--esc-tx2)}
.cartao-porta form{width:100%;display:grid;gap:8px;margin-top:12px;text-align:left}
.cartao-porta label{font-size:14px;font-weight:700}
.cartao-porta input{width:100%;min-height:48px;padding:0 16px;border-radius:12px;border:1px solid rgba(255,255,255,.3);background:rgba(0,0,0,.3);color:#fff;font:16px var(--fs)}
.cartao-porta .bt{width:100%;margin-top:8px}
.erro{font-size:14px;font-weight:700;color:#FFB4AB}
.volta{margin-top:12px;font-size:14px;color:var(--esc-tx2)}

@media (max-width:860px){
  .miolo{padding:0 16px}
  .lista-aula li{grid-template-columns:1fr;gap:4px}
  .metodo,.fila.um,.fila.dois{grid-template-columns:1fr}
  .passos .p,.passos .fase{min-height:48px}
  .acoes .bt,.rodape .fala .bt{flex:1 1 100%}
  .video-sala video{height:auto}
  .cartao.linha{flex-direction:column;align-items:stretch}
  .bt-play{bottom:12px;min-height:40px;padding:0 16px;font-size:14px}
}