/* Front-end + editor styles for the bracis-figma/organization block. */

.bracis-figma-org-card {
  width: 100%;
  max-width: 360px;
  display: grid;
  justify-items: center;
  text-align: center;
  margin-left: auto;
  margin-right: auto;
}

.bracis-figma-org-heading {
  text-align: center;
  width: 100%;
  align-self: center;
  line-height: 1.15;
  margin-left: auto;
  margin-right: auto;
  margin-bottom: 0.1rem !important;
}

/* Supporting Agency: as agencias de fomento, EMPILHADAS.
 *
 * Eram duas lado a lado e agora sao tres, e lado a lado nao fecha mais: as
 * tres tem proporcoes muito diferentes (CAPES 1:1, CNPq 3,25:1, FAPEMAT
 * 4,84:1), entao dividir a largura do card em partes iguais dava CAPES com
 * 98px de altura ao lado de uma FAPEMAT de 20px. Empilhadas, cada uma recebe a
 * largura inteira do card e a altura sai da propria proporcao — e a coluna
 * deixa de depender de quantas agencias sao.
 *
 * A largura de cada marca e calibrada uma por uma, e nao comum as tres, porque
 * e ela que define o peso optico: quanto mais deitada a marca, mais largura
 * precisa para o wordmark ler na mesma altura aparente. As tres abaixo saem em
 * ~135 / ~74 / ~62px de altura no desktop largo.
 */
.bracis-figma-agency-logos {
  display: flex;
  flex-direction: column;
  /* Acompanha a escala das marcas em vez de ser fixo: elas crescem com a
     viewport, e um vao travado em rem apertaria no desktop largo e sobraria no
     celular. Ver o desconto de margem da CAPES abaixo — e ele que faz este vao
     valer igual nos dois intervalos, e nao so no primeiro. */
  gap: clamp(2rem, 2.5vw, 3rem);
  justify-content: center;
  align-items: center;
  width: 100%;
}

.bracis-figma-agency-logos .bracis-figma-logo-slot.is-large {
  flex: 0 0 auto;
  max-width: 100%;
  width: 100%;
}

.bracis-figma-agency-logos .bracis-figma-logo-slot.is-large img {
  height: auto;
  max-height: none;
  max-width: 100%;
}

/* CAPES: quadrada (1,003:1). A mais compacta do trio, logo a que menos largura
   ganha — e mesmo assim a mais alta das tres.
 *
 * O DESCONTO DE MARGEM. O capes-logo.jpg tem branco embutido: a tinta mede
 * 305x283 num arquivo de 325x324, sobrando 19px em cima e 22px embaixo. Esse
 * branco entra na caixa da imagem e SOMA ao `gap` do flex, enquanto o CNPq e a
 * FAPEMAT nao tem folga nenhuma — a tinta deles preenche o arquivo. O vao
 * visivel saia 37,1px entre CAPES e CNPq contra 28,0px entre CNPq e FAPEMAT,
 * 33% a mais, e era isso que fazia a FAPEMAT parecer colada. As duas margens
 * negativas abaixo devolvem exatamente essa folga (19/324 e 22/324 da largura,
 * que na CAPES e igual a altura), e os tres vaos de TINTA ficam iguais.
 *
 * Em `calc()` sobre a propria variavel, e nao em porcentagem: margem em % se
 * resolve contra a LARGURA do bloco contentor, nao contra a altura do elemento
 * — o mesmo erro que ja custou uma placa eliptica em blocks/speakers.
 */
.bracis-figma-agency-logos .is-capes img {
  /* +25% a pedido do usuário (2026-09-14), sobre o clamp original de 104/9,8vw/156px */
  --mark-w: clamp(130px, 12.25vw, 195px);
  width: var(--mark-w);
  margin-top: calc(var(--mark-w) * -0.0586);
  margin-bottom: calc(var(--mark-w) * -0.0679);
}

/* CNPq: 3,25:1. +25% a pedido do usuário (2026-09-14), sobre 170/15,9vw/272px */
.bracis-figma-agency-logos .is-cnpq img {
  width: clamp(213px, 19.9vw, 340px);
}

/* FAPEMAT: 4,84:1, e o lockup tem duas linhas de texto miudo embaixo do
   wordmark. E a mais deitada do trio: sem largura ela some, e por isso e a
   unica que passa dos 272px. E ela que fixa a escala do trio — as outras duas
   sao calibradas contra ela. +25% a pedido do usuário (2026-09-14), sobre
   175/17vw/300px. */
.bracis-figma-agency-logos .is-fapemat img {
  width: clamp(219px, 21.3vw, 375px);
}

/* ── 4-column Organization layout ────────────────────────────────── */

.bracis-org-section-inner {
  width: 100%;
  padding-left: 2rem;
  padding-right: 2rem;
  box-sizing: border-box;
}

.bracis-figma-org-4col-grid {
  display: grid;
  grid-template-columns: 1fr 1fr 2fr 1fr;
  gap: 3rem;
  width: 100%;
  margin-top: 0;
  align-items: stretch;
}

.bracis-figma-org-4col-grid .bracis-figma-org-card {
  width: 100%;
  min-width: 0;
  display: flex;
  flex-direction: column;
  align-items: center;
}

/* Todos os títulos com altura fixa, alinhados pelo topo */
.bracis-figma-org-4col-grid .bracis-figma-org-heading {
  width: 100%;
  min-height: 3.5rem;
  display: flex;
  align-items: flex-start;
  justify-content: center;
  margin-top: 0 !important;
  margin-bottom: 1.5rem !important;
}

/* Logo slot ocupa o espaço restante e centraliza verticalmente */
.bracis-figma-org-4col-grid .bracis-figma-logo-slot.is-large,
.bracis-figma-org-4col-grid .bracis-figma-logo-slot.is-institutional {
  flex: 1;
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 0;
  width: 100%;
}

/* All org logos scale with the viewport so they shrink/grow together and stay
   balanced; caps match the previous fixed desktop sizes. */
.bracis-figma-org-4col-grid .bracis-figma-logo-slot.is-large img,
.bracis-figma-org-4col-grid .bracis-figma-logo-slot.is-institutional img {
  height: clamp(140px, 20vw, 300px);
  width: auto;
  max-width: 100%;
  max-height: none;
}

/* SBC (Promotion): altura ajustada visualmente. +25% a pedido do usuário
   (2026-09-14), sobre 95/13,5vw/200px. */
.bracis-figma-org-4col-grid .bracis-figma-org-card:nth-child(1) .bracis-figma-logo-slot img {
  height: clamp(119px, 16.9vw, 250px);
}

/* UFMT (Organized by): vertical lockup — size by height like SBC so the
   two "Realização" marks carry the same visual weight. +25% a pedido do
   usuário (2026-09-14), mesmo clamp do SBC acima. */
.bracis-figma-org-4col-grid .bracis-figma-org-card:nth-child(2) .bracis-figma-logo-slot img {
  height: clamp(119px, 16.9vw, 250px);
  width: auto;
  max-width: 100%;
  max-height: none;
}

/* Suporte institucional: 75% da altura base */
.bracis-figma-org-4col-grid .bracis-figma-logo-slot.is-institutional img {
  height: clamp(110px, 15vw, 225px);
}

.bracis-figma-org-4col-grid .bracis-figma-agency-logos {
  flex: 1;
  gap: clamp(2rem, 2.5vw, 3rem);
  flex-direction: column;
  align-items: center;
  min-height: 0;
}

.bracis-figma-org-4col-grid .bracis-figma-agency-logos .bracis-figma-logo-slot.is-large {
  flex: 0 0 auto;
  min-width: 0;
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
}

/* A pilha das agencias e mais alta que uma marca sozinha, e o card generico
   trava em 360px (regra do topo do arquivo). Aqui a coluna do grid ja da
   2fr — mais que o suficiente — entao o teto sai e quem manda na largura sao
   os clamps por marca. */
.bracis-figma-org-4col-grid .bracis-figma-org-card:nth-child(3) {
  max-width: none;
}

/* As agencias fogem do dimensionamento por ALTURA que vale para as outras tres
   marcas da secao (`height: clamp(140px, 20vw, 300px)`, logo acima): ali cada
   card tem uma marca so, e a altura comum e o que as iguala. Aqui sao tres
   proporcoes diferentes na mesma coluna, e igualar a altura faria a FAPEMAT
   sair tres vezes mais larga que a CAPES. Quem manda e a largura, calibrada
   marca por marca — os clamps sao os mesmos do bloco base, repetidos com o
   prefixo do grid porque a regra generica ganha por especificidade. */
.bracis-figma-org-4col-grid .bracis-figma-agency-logos .bracis-figma-logo-slot.is-large img {
  height: auto;
  max-height: none;
  max-width: 100%;
}

.bracis-figma-org-4col-grid .bracis-figma-agency-logos .is-capes img {
  /* +25% a pedido do usuário (2026-09-14) — ver a base equivalente acima */
  --mark-w: clamp(130px, 12.25vw, 195px);
  width: var(--mark-w);
  margin-top: calc(var(--mark-w) * -0.0586);
  margin-bottom: calc(var(--mark-w) * -0.0679);
}

.bracis-figma-org-4col-grid .bracis-figma-agency-logos .is-cnpq img {
  width: clamp(213px, 19.9vw, 340px);
}

.bracis-figma-org-4col-grid .bracis-figma-agency-logos .is-fapemat img {
  width: clamp(219px, 21.3vw, 375px);
}

@media (max-width: 899px) {
  .bracis-figma-org-4col-grid {
      grid-template-columns: repeat(2, 1fr);
      gap: 2.5rem;
    }


  /* SBC (Promotion): compact mark, give it the most height. +25% a pedido do
     usuário (2026-09-14), sobre 160px. */
    .bracis-figma-org-4col-grid .bracis-figma-org-card:nth-child(1) .bracis-figma-logo-slot img {
      height: auto;
      max-height: 200px;
    }

  /* UFMT (Organized by): vertical lockup, same height as SBC. +25% a pedido
     do usuário (2026-09-14). */
    .bracis-figma-org-4col-grid .bracis-figma-org-card:nth-child(2) .bracis-figma-logo-slot img {
      height: auto;
      max-height: 200px;
    }


  /* UniSENAI (Institutional): very wide wordmark, keep it shorter */
    .bracis-figma-org-4col-grid .bracis-figma-logo-slot.is-institutional img {
      height: auto;
      max-height: 70px;
    }

}

@media (max-width: 500px) {
  .bracis-figma-org-4col-grid {
      grid-template-columns: 1fr;
      gap: 2rem;
    }

}