/* Página Quem somos — organograma da equipe (visual do site: preto + amarelo) */
.eq-hero { padding-bottom: 36px; }
.eq-hero h1 { max-width: 18ch; }
.eq-sec { padding: 40px 0 90px; }
.eq-head { text-align: center; margin-bottom: 46px; }
.eq-head h2 { margin: 12px 0 0; font-weight: 300; font-size: clamp(26px, 3.6vw, 38px); }

.eq-chart { display: flex; flex-direction: column; align-items: center; }
.eq-level { position: relative; display: flex; justify-content: center; gap: 22px; width: fit-content; max-width: 100%; }
.eq-vline { width: 2px; height: 44px; background: linear-gradient(180deg, rgba(245,197,24,.15), #f5c518); }
.eq-grupo { margin: 18px 0 20px; padding: 6px 16px; border-radius: 999px; font-size: 11.5px; font-weight: 800; letter-spacing: .14em; text-transform: uppercase; color: #17140a; background: var(--accent, #f5c518); }

/* Ligações do organograma: barra horizontal entre os centros do primeiro e do último cartão + haste de cada cartão */
.eq-level.conn::before { content: ""; position: absolute; top: -20px; left: calc(var(--w) / 2); right: calc(var(--w) / 2); height: 2px; background: #f5c518; opacity: .85; }
.eq-level.conn .eq-card::before { content: ""; position: absolute; top: -20px; left: 50%; width: 2px; height: 20px; background: #f5c518; transform: translateX(-1px); opacity: .85; }
.eq-grupo + .eq-level.conn::before { top: -20px; }

.eq-card { position: relative; width: var(--w, 230px); padding: 22px 16px 20px; text-align: center; border-radius: 22px; background: linear-gradient(180deg, #181a20, #101116); border: 1px solid rgba(255,255,255,.09); box-shadow: 0 28px 50px -34px #000; transition: transform .2s, border-color .2s, box-shadow .2s; }
.eq-card:hover { transform: translateY(-3px); border-color: rgba(245,197,24,.5); box-shadow: 0 30px 60px -30px rgba(245,197,24,.35); }
.eq-card--dir { border-color: rgba(245,197,24,.35); background: linear-gradient(180deg, #1c1b14, #101116); }
.eq-l1 .eq-card, .eq-l2 .eq-card { width: 270px; }
.eq-photo { width: 124px; height: 124px; margin: 0 auto 14px; border-radius: 50%; overflow: hidden; border: 3px solid #f5c518; background: radial-gradient(circle at 50% 30%, #3a2f0c, #0b0c0f 75%); box-shadow: 0 0 28px -6px rgba(245,197,24,.55); }
.eq-card--dir .eq-photo { width: 144px; height: 144px; }
.eq-photo img { width: 100%; height: 100%; object-fit: cover; object-position: 50% 18%; display: block; }
.eq-name { margin: 0; font-size: 17px; font-weight: 700; color: #fff; }
.eq-role { margin: 6px 0 0; font-size: 13.5px; font-weight: 600; color: var(--accent, #f5c518); line-height: 1.35; }
.eq-det { margin: 4px 0 0; font-size: 12.5px; color: var(--on-dark-dim, #a8a29e); line-height: 1.4; }
.eq-l4 { flex-wrap: nowrap; gap: 20px 18px; }

@media (max-width: 900px) {
  .eq-level { flex-direction: column; align-items: center; gap: 22px; }
  .eq-level.conn::before { display: none; }
  .eq-level.conn .eq-card::before { top: -22px; height: 22px; }
  .eq-l1 .eq-card, .eq-card, .eq-card--dir { width: min(300px, 92%); }
  .eq-l4 { flex-direction: column; flex-wrap: nowrap; width: 100%; }
  .eq-level { width: 100%; }
}

/* Celular: a diretoria empilha, mas um trilho amarelo à esquerda liga os três cartões (mesmo nível) */
@media (max-width: 900px) {
  .eq-l3.conn { width: min(340px, 100%); padding-left: 18px; align-items: stretch; }
  .eq-l3.conn::after { content: ""; position: absolute; left: 0; top: 40px; bottom: 40px; width: 2px; background: #f5c518; opacity: .85; }
  .eq-l3.conn .eq-card { width: 100%; }
  .eq-l3.conn .eq-card::before { top: 50%; left: -18px; width: 18px; height: 2px; transform: none; }
}
