/* /brand no celular — só o que esta página tem de próprio. */

#br-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}
#br-hero .m-bolt{margin-block:32px}
.m-aviso{margin-top:var(--m-gap);font-size:15px;line-height:1.5;opacity:.6}
.m-ordem__link{
  display:flex;align-items:center;min-height:var(--m-toque);
  text-decoration:underline;text-underline-offset:4px;text-decoration-thickness:1px;
}

/* ═══════════════════════════════════════════════════════ a seção dentro do capítulo
   45 delas na página. O fio no topo é o que separa uma da outra sem exigir uma caixa por
   seção — caixa dentro de caixa, 45 vezes, viraria ruído de moldura. */
.m-br__sec{
  padding-top:var(--m-respiro);
  margin-top:var(--m-respiro);
  border-top:1px solid currentColor;
}
.m-br__sec:first-of-type{margin-top:0}
.m-br__resumo{font-size:17px;line-height:1.55;margin-top:12px}
.m-br__estado{margin-top:12px;opacity:.45}
.m-br__corpo{margin-top:var(--m-gap)}
.m-br__lbl{margin:var(--m-gap) 0 12px;opacity:.5}

/* ═══════════════════════════════════════════════════════ os sete tipos de bloco */
.m-br__p{font-size:16px;line-height:1.6;margin-bottom:14px}
.m-br__p:last-child{margin-bottom:0}

.m-br__destaque{
  font-family:var(--font-display);
  font-variation-settings:'wdth' var(--disp-wdth),'wght' var(--disp-wght);
  font-size:clamp(18px,5vw,24px);line-height:1.2;text-transform:uppercase;
  margin:var(--m-gap) 0;
  padding-left:16px;
  border-left:2px solid currentColor;
}

.m-br__itens{display:flex;flex-direction:column;gap:10px}
.m-br__itens li{font-size:16px;line-height:1.5;padding-left:16px;position:relative}
.m-br__itens li::before{content:'';position:absolute;left:0;top:.62em;width:6px;height:1px;background:currentColor;opacity:.6}
.m-br__itens--n{counter-reset:i}
.m-br__itens--n li{counter-increment:i;padding-left:28px}
.m-br__itens--n li::before{
  content:counter(i,decimal-leading-zero);
  top:0;width:auto;height:auto;background:none;
  font-family:var(--font-mono);font-size:11px;letter-spacing:.14em;opacity:.5;
}

.m-br__fichas{display:flex;flex-wrap:wrap;gap:8px}
.m-br__fichas li{
  padding:10px 14px;
  border:1px solid currentColor;border-radius:4px;
  font-size:15px;line-height:1.3;opacity:.85;
}

.m-br__lista{display:flex;flex-direction:column;gap:var(--m-gap)}
.m-br__lista__t{font-size:17px;font-weight:600;line-height:1.35;margin-bottom:6px}
.m-br__lista__c{font-size:15px;line-height:1.5;opacity:.85}
.m-br__par{display:flex;flex-direction:column;gap:4px;margin-top:10px;font-size:15px;line-height:1.5}
.m-br__par__l{opacity:.5}

/* "é X, não é Y": uma metade sobre a outra, e o rótulo faz o contraste que a posição fazia
   no desktop. */
.m-br__pares{display:flex;flex-direction:column;gap:14px}
.m-br__pares li{
  display:flex;flex-direction:column;gap:2px;
  padding-bottom:14px;
  border-bottom:1px solid rgba(128,128,128,.25);
}
.m-br__pares li:last-child{border-bottom:0;padding-bottom:0}
.m-br__pares__e{font-size:17px;font-weight:600;line-height:1.3}
.m-br__pares__n{font-size:15px;line-height:1.4;opacity:.55}

.m-br__col{margin-bottom:var(--m-gap)}
.m-br__col:last-child{margin-bottom:0}

/* ═══════════════════════════════════════════════════════ as peças previstas
   No desktop cada uma é uma ficha com a proporção do formato desenhada. Aqui o formato é dito
   por escrito — quem vai produzir a peça precisa da medida, não do retângulo. */
.m-br__vagas{display:flex;flex-direction:column;gap:18px}
.m-br__vagas li{
  padding:18px;
  border:1px solid currentColor;border-radius:4px;
}
.m-br__vaga__t{font-size:17px;font-weight:600;line-height:1.3}
.m-br__vaga__f{margin-top:8px;opacity:.5;line-height:1.5}
.m-br__vaga__n{margin-top:10px;font-size:15px;line-height:1.5;opacity:.8}

/* ═══════════════════════════════════════════════════════ o calendário
   No desktop é grade de sete colunas por N semanas. Em 351px sete colunas dariam 50px cada e
   os nomes não caberiam — vira lista por dia, que é como se lê um ritmo de publicação no
   celular de qualquer jeito. */
.m-br__cal{display:flex;flex-direction:column;gap:12px}
.m-br__cal li{display:flex;gap:14px;align-items:baseline}
.m-br__cal__d{flex:0 0 42px;opacity:.5}
.m-br__cal__v{font-size:15px;line-height:1.5}

/* O acordeão dentro da ficha de peça: sem o fio de topo do kit, senão vira moldura dentro de
   moldura setenta vezes. */
.m-br__vagas .m-acc__item{border-top:0;border-bottom:0;margin-top:12px}
.m-br__vagas .m-acc__q{padding:10px 0;font-size:15px;opacity:.7}
