/* Matrículas abertas no LF e no LM (23/10/2026), ligado pelo fase-cursos.js às 8h07 de 26/10. O DMAT e o LC têm o
   mesmo esquema no <style> da própria página (lá o verify não deixa CSS externo).
   Nas duas páginas o visual da Black já é o da página desde 07/10, então o topo de matrículas é o topo da Black do
   hero-black.css, com o botão "Fazer matrícula" no lugar do formulário. O letreiro é a faixa de urgência da própria
   página (.urgency-bar-top, "FAIXA DE URGÊNCIA (TOPO FIXO)"), de volta fixa no alto: "tem que ter letreiro, lá em cima
   fixo". A faixa de antes, que vendia o curso, sai junto com a venda.
   A linha corre até a margem: sem as linhas presas (.bh-l), sem pretty e sem max-width no texto (regra da Maria, 21/10). */

/* ── fases ── */
.bh--matriculas{display:none}
html:not([data-black=matriculas]) [data-so-matriculas]{display:none}
html[data-black=matriculas] .bh--matriculas{display:flex}
html[data-black=matriculas] .bh:not(.bh--matriculas),
html[data-black=matriculas] [data-bh-barra],
html[data-black=matriculas] [data-venda-black]{display:none !important}
html[data-black=matriculas]{scroll-padding-top:56px}

/* ── letreiro fixo: o lugar dele no fluxo segura a altura, a faixa fica presa no alto ── */
.lt-lugar{height:var(--lt-h)}
.lt{position:fixed;top:0;left:0;right:0;z-index:10001;height:var(--lt-h);padding-block:0;box-sizing:border-box;text-decoration:none}
@media (prefers-reduced-motion:reduce){.lt .urgency-scrolling-content{animation:none}}

/* ── texto do topo ── */
/* text-wrap:wrap nos dois: o hero-black.css põe pretty no texto */
.bh--matriculas .bh-titulo{font-size:clamp(30px,8.4cqi,56px);line-height:1.06;text-wrap:wrap}
.bh--matriculas .bh-lead{max-width:none;text-wrap:wrap}
.bh--matriculas .bh-form-area{width:100%;max-width:500px}
.bh--matriculas .bh-btn{margin-top:16px;text-decoration:none}
.bh--matriculas .bh-btn:hover{color:var(--tinta)}

/* ── a folha da Vitalícia ("muito pobrinhas", 24/10): a folha quadriculada com fita do formulário da lista, com o que
   entra e o botão. O ✓ é o círculo azul-claro com a borda de tinta do adesivo. */
/* o corpo mora na lista (e não no item) para o corpo-cede.js ceder os itens juntos (data-cede-grupo) */
.bm-ficha{list-style:none;margin:2px 0 0;padding:0;display:grid;gap:10px;font:500 15.5px/1.4 var(--fonte)}
.bm-ficha li{position:relative;padding-left:32px;color:var(--tinta)}
.bh .bm-ficha b{font-weight:900;color:var(--tinta)}
.bm-ficha li::before{content:"";position:absolute;left:0;top:0;width:22px;height:22px;border-radius:50%;background:var(--acc);
  box-shadow:0 0 0 1.5px var(--tinta)}
.bm-ficha li::after{content:"";position:absolute;left:8px;top:4px;width:5px;height:10px;border:solid var(--tinta);
  border-width:0 2.4px 2.4px 0;rotate:45deg}

/* ── no lugar do contador: as capas dos três cursos impressas e presas com fita, como as aulas da LM ── */
.bm-capas{display:flex;gap:16px;padding-top:10px}
.bm-capa{position:relative;width:clamp(70px,9.5vh,96px);padding:4px;background:#fff;border-radius:3px;box-shadow:0 10px 20px rgba(0,0,0,.35)}
.bm-capa img{display:block;width:100%;height:auto;border-radius:2px}
.bm-capa::before{content:"";position:absolute;z-index:1;top:-9px;left:50%;width:46px;height:16px;translate:-50% 0;rotate:-4deg;background:var(--fita)}
.bm-capa:nth-child(1){rotate:-5deg}
.bm-capa:nth-child(2){rotate:3deg}
.bm-capa:nth-child(2)::before{rotate:3deg;background:rgba(255,255,255,.7)}
.bm-capa:nth-child(3){rotate:-2deg}