/* Página de apresentação (/site). Usa as cores, botões e etiquetas do estilo.css; aqui só o layout dela. */
.site main{max-width:1040px;margin:0 auto;padding-inline:16px;display:flex;flex-direction:column;gap:72px;padding-block:28px 72px}
.site h1{font-size:clamp(30px,5.2vw,48px);letter-spacing:-.02em;line-height:1.06}
.site h2{font-size:clamp(22px,3.2vw,30px);letter-spacing:-.01em}
.site h3{font-size:17px;font-weight:700;color:var(--ink)}
.site a{color:inherit}
.s-lead{font-size:17px;color:var(--muted);max-width:56ch}

.s-topo{max-width:1040px;margin:0 auto;padding:16px;display:flex;flex-wrap:wrap;gap:10px 16px;align-items:center;justify-content:space-between}
.s-marca{font-family:var(--display);font-weight:700;font-size:20px;text-decoration:none}
.s-marca span{color:var(--accent)}
.site .btn{text-decoration:none;display:inline-block}
.site .btn.primary{color:var(--accent-ink)}
.btn.grande{padding:12px 20px;font-size:16px}

.s-heroi{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,.95fr);gap:36px;align-items:center}
.s-heroi-texto{display:flex;flex-direction:column;gap:18px}

.s-demo{margin:0;background:var(--surface);border:1px solid var(--line);border-radius:14px;padding:18px;display:flex;flex-direction:column;gap:14px;min-width:0;box-shadow:0 18px 40px -28px rgba(6,20,17,.55)}
.s-demo-nums{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
.s-demo-nums div{display:flex;flex-direction:column;gap:2px;min-width:0}
.s-demo-nums b{font-family:var(--display);font-size:22px}
.s-demo .attention li{font-size:14px}
.s-grade{min-width:520px}
.s-grade .aula{cursor:default}

.s-ic{width:44px;height:44px;flex:none;border-radius:12px;background:var(--accent-soft);color:var(--accent);display:grid;place-items:center}
.s-ic svg{display:block}

.s-bloco{display:flex;flex-direction:column;gap:14px}
.s-motivos{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:1px;background:var(--line);border:1px solid var(--line);border-radius:14px;overflow:hidden;margin-top:10px}
.s-motivos article{background:var(--surface);padding:20px;display:flex;flex-direction:column;gap:8px}
.s-motivos .s-ic{margin-bottom:4px}
.s-motivos p{color:var(--muted)}

.s-areas{margin:10px 0 0;padding:0;list-style:none;display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:1px;background:var(--line);border:1px solid var(--line);border-radius:14px;overflow:hidden}
.s-areas li{background:var(--surface);padding:22px;display:grid;grid-template-columns:auto minmax(0,1fr);gap:6px 14px;align-content:start}
.s-areas li>*{grid-column:2}
.s-areas li>.s-ic{grid-column:1;grid-row:1/span 3}
.s-areas h3{font-size:19px}
.s-pergunta{font-weight:600;color:var(--accent)}
.s-areas p:last-child{color:var(--muted)}

.s-dupla{display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);gap:36px;align-items:center}
.s-dupla>div{display:flex;flex-direction:column;gap:14px}

.s-passos{margin:10px 0 0;padding:0;list-style:none;counter-reset:passo;display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:20px}
.s-passos li{counter-increment:passo;display:flex;flex-direction:column;gap:6px;color:var(--muted);border-top:3px solid var(--accent);padding-top:12px}
.s-passos li::before{content:counter(passo);font-family:var(--display);font-weight:700;font-size:28px;color:var(--accent);line-height:1}
.s-passos b{color:var(--ink);font-size:16px}
.s-nota{max-width:70ch}

.s-teste{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,420px);gap:36px;align-items:start;background:var(--sunk);border-radius:18px;padding:32px;scroll-margin-top:16px}
.s-teste-texto{display:flex;flex-direction:column;gap:14px;align-items:flex-start}
.s-lista{margin:0;padding-left:20px;display:flex;flex-direction:column;gap:8px;color:var(--muted)}
.s-teste form{gap:14px;padding:22px}

.s-rodape{max-width:1040px;margin:0 auto;padding:20px 16px 32px;display:flex;justify-content:space-between;gap:12px;color:var(--muted);font-size:14px;border-top:1px solid var(--line)}

@media (max-width:820px){
  .site main{gap:52px}
  .s-heroi,.s-dupla,.s-teste{grid-template-columns:minmax(0,1fr)}
  .s-teste{padding:20px}
}