/* /apresentacao no celular — só o que esta página tem de próprio.
   Tudo que for repetível mora em css/m/kit.css e vale nas cinco. */

/* ═══════════════════════════════════════════════════════ o herói
   96px de recuo no topo = a barra fixa (56px) mais folga. É o que mantém a verificação de
   "texto estático coberto por barra fixa" limpa, e o que impede a página de abrir com meia
   tela vazia — defeito que na rodada anterior custou 387px de vazio e só foi achado a olho. */
#ap-hero{padding-top:96px}
.m-hero__eyebrow{opacity:.55;margin-bottom:18px}
.m-hero__t{font-size:clamp(40px,12vw,66px);line-height:.96}
.m-hero__para{font-size:17px;line-height:1.55;margin-top:28px}
.m-hero__nota{margin-top:22px;opacity:.45;line-height:1.5}
#ap-hero .m-bolt{margin-block:32px}

/* ═══════════════════════════════════════════════════════ pílula em bloco
   No desktop ela flutua ao lado do conteúdo; aqui atravessa a coluna, para ser alvo de toque
   confortável sem depender de mira. */
.m-pill-bloco{display:flex;width:100%;margin-top:var(--m-gap)}
.m-sec--dark .m-pill-bloco{border:1px solid currentColor}

/* ═══════════════════════════════════════════════════════ 07 · os programas */
.m-quadro__formato{margin:-2px 0 14px;opacity:.5;line-height:1.5}
.m-quadro__gera{margin-top:18px;padding-top:16px;border-top:1px solid rgba(255,255,255,.16)}
.m-sec--light .m-quadro__gera{border-top-color:rgba(12,12,12,.14)}
.m-quadro__lbl{opacity:.5;margin-bottom:8px}
.m-quadro__gera__t{font-size:15px;line-height:1.5}
.m-quadros__remate{margin-top:var(--m-respiro);font-size:17px;line-height:1.55}

/* ═══════════════════════════════════════════════════════ 08 · as frentes */
.m-frentes{display:flex;flex-direction:column;gap:var(--m-respiro)}
.m-frente__k{opacity:.5;margin-bottom:10px}
.m-frente__t{font-size:clamp(24px,7vw,34px);line-height:1.05;margin-bottom:14px}
.m-frente__d{font-size:17px;line-height:1.55}
.m-frente__itens{margin-top:18px;display:flex;flex-direction:column;gap:12px}
.m-frente__itens li{
  position:relative;padding-left:18px;
  font-size:15px;line-height:1.5;opacity:.85;
}
.m-frente__itens li::before{
  content:'';position:absolute;left:0;top:.6em;
  width:6px;height:1px;background:currentColor;opacity:.6;
}
.m-frente__r{margin-top:18px;opacity:.5;line-height:1.6}

/* ═══════════════════════════════════════════════════════ 09 · a pergunta */
#ap-pergunta{padding-block:calc(var(--m-respiro) * 1.2)}
.m-pergunta__label{opacity:.55;margin-bottom:20px}
.m-pergunta__t{font-size:clamp(32px,10vw,52px);line-height:1}
.m-pergunta__nota{margin-top:24px;font-size:17px;line-height:1.55}
.m-contato{
  margin-top:var(--m-respiro);
  display:flex;flex-direction:column;gap:8px;line-height:1.6;
}
.m-contato b{font-weight:500}
.m-contato span,.m-contato a{opacity:.7}
/* O e-mail sai do corpo de rótulo. Ele é a única linha desta página em que o leitor age, e
   enquanto for a pendência entre colchetes tem 69 caracteres — em 11px isso é prosa em tamanho
   de etiqueta, e a verificação reprovou com razão. Fonte de corpo, alvo de 44px. */
.m-contato > :last-child{
  font-family:var(--font-body);
  font-size:15px;line-height:1.5;letter-spacing:0;text-transform:none;
  margin-top:6px;
}
.m-contato a{min-height:var(--m-toque);display:flex;align-items:center}