/* Home: coluna da direita. Discord mais baixo, Apoie com a chamada da mensagem e Em destaque (3 x 2) alinhado
   com "Ultimas atualizacoes". */
.home-apoie{height:auto;min-height:104px;padding:.7rem 0}
.lista-discord{max-height:176px}
.home-topo__in{display:grid;gap:1rem}

@media (min-width:1280px){
  /* Duas linhas: (banner | Discord + Apoie) e (Ultimas atualizacoes | Em destaque). Os titulos da segunda linha ficam na mesma altura. */
  .home-grade{grid-template-rows:auto auto;row-gap:2rem}
  .home-esq,.home-dir{display:contents}
  .home-grade .home-esq > *{margin-top:0 !important}
  .home-grade .home-esq > [data-banner-carrossel]{grid-column:1;grid-row:1}
  .home-grade .home-esq > :not([data-banner-carrossel]){grid-column:1;grid-row:2}
  .home-topo{grid-column:2;grid-row:1;position:relative;min-height:400px}
  .home-destaques{grid-column:2;grid-row:2}
  /* O bloco da direita acompanha a altura do banner; a lista do Discord ocupa o que sobrar e rola. */
  .home-topo__in{position:absolute;inset:0;display:flex;flex-direction:column}
  .home-topo__in > .discord-igual{flex:1 1 auto;min-height:0;display:flex;align-self:stretch}
  .home-topo__in > .discord-igual > div{display:flex;flex-direction:column;flex:1;min-height:0;gap:.75rem}
  .home-topo__in > .discord-igual > div > *{margin:0}
  .home-topo__in > .discord-igual > div > :not(.lista-discord){flex:none}
  .home-topo__in > .discord-igual > div > a{margin-left:auto;margin-right:auto}
  .home-topo__in .lista-discord{flex:1 1 auto;min-height:0;max-height:none}
  .home-topo__in > .home-apoie{flex:none}
}
