/* ==========================================================================
   Conecta FAMO · components.css
   Cabeçalho, rodapé, linha do tempo de eventos, cartões, equipe,
   parceiros, galeria e lightbox. Componentes usados em mais de uma página.
   ========================================================================== */

/* --------------------------------------------------------------------------
   Cabeçalho
   -------------------------------------------------------------------------- */
.cabecalho {
  position: sticky;
  top: 0;
  z-index: 50;
  background: rgba(22, 21, 58, 0.94);
  backdrop-filter: saturate(140%) blur(12px);
  -webkit-backdrop-filter: saturate(140%) blur(12px);
  border-bottom: 1px solid rgba(255, 255, 255, 0.08);
  transition: box-shadow var(--transicao);
}
.cabecalho.is-rolado { box-shadow: 0 10px 30px -18px rgba(0, 0, 0, 0.6); }

.cabecalho__inner {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--e-3);
  min-height: var(--header-h);
}

.marca { display: inline-flex; align-items: center; flex: none; }
.marca img { width: auto; height: 36px; }
@media (max-width: 380px) { .marca img { height: 30px; } }

.nav__lista {
  display: flex;
  align-items: center;
  gap: 0.25rem;
  margin: 0;
  padding: 0;
  list-style: none;
}
.nav__link {
  display: inline-flex;
  align-items: center;
  min-height: 44px;
  padding: 0 0.85rem;
  border-radius: 999px;
  color: rgba(255, 255, 255, 0.82);
  font-weight: 700;
  font-size: var(--fs-sm);
  text-decoration: none;
  transition: color var(--transicao), background var(--transicao);
}
.nav__link:hover { color: var(--branco); background: rgba(255, 255, 255, 0.08); }
.nav__link[aria-current] { color: var(--laranja-400); }
.nav__cta { margin-left: var(--e-1); min-height: 44px; padding-block: 0.55rem; }

.nav-toggle {
  display: none;
  align-items: center;
  justify-content: center;
  width: 48px;
  height: 48px;
  border: 1px solid rgba(255, 255, 255, 0.2);
  border-radius: 12px;
  background: transparent;
  color: var(--branco);
}
.nav-toggle svg { width: 24px; height: 24px; }
.nav-toggle .icone-fechar { display: none; }
.nav-toggle[aria-expanded="true"] .icone-abrir { display: none; }
.nav-toggle[aria-expanded="true"] .icone-fechar { display: block; }

@media (max-width: 1023px) {
  .nav-toggle { display: inline-flex; }
  .nav {
    position: fixed;
    inset: var(--header-h) 0 auto 0;
    max-height: calc(100dvh - var(--header-h));
    overflow-y: auto;
    padding: var(--e-2) var(--gutter) var(--e-4);
    background: var(--indigo-900);
    border-bottom: 1px solid rgba(255, 255, 255, 0.1);
    box-shadow: 0 30px 40px -20px rgba(0, 0, 0, 0.6);
    transform: translateY(-8px);
    opacity: 0;
    visibility: hidden;
    transition: opacity var(--transicao), transform var(--transicao), visibility var(--transicao);
  }
  .nav.is-aberta { opacity: 1; visibility: visible; transform: none; }
  .nav__lista { flex-direction: column; align-items: stretch; gap: 0; }
  .nav__link {
    display: flex;
    min-height: 56px;
    padding: 0 var(--e-1);
    border-radius: 0;
    border-bottom: 1px solid rgba(255, 255, 255, 0.08);
    font-family: var(--fonte-titulo);
    font-size: 1.25rem;
  }
  .nav__link:hover { background: transparent; }
  .nav__cta { margin: var(--e-3) 0 0; width: 100%; }
  body.menu-aberto { overflow: hidden; }
}

/* --------------------------------------------------------------------------
   Trilha (motivo do logo): linha laranja com nós
   -------------------------------------------------------------------------- */
.no {
  width: 14px;
  height: 14px;
  border-radius: 50%;
  background: var(--laranja-500);
  box-shadow: 0 0 0 5px var(--laranja-100);
  flex: none;
}
.no--vazio { background: var(--branco); border: 3px solid var(--laranja-500); box-shadow: none; }

/* --------------------------------------------------------------------------
   Linha do tempo de eventos (home e página do projeto)
   Mobile: vertical. Desktop: horizontal com nós sobre a trilha.
   -------------------------------------------------------------------------- */
.linha-tempo {
  position: relative;
  display: grid;
  gap: var(--e-4);
  margin: 0;
  padding: 0 0 0 34px;
  list-style: none;
}
.linha-tempo::before {
  content: "";
  position: absolute;
  left: 6px;
  top: 8px;
  bottom: 8px;
  width: 2px;
  background: linear-gradient(var(--laranja-500), var(--laranja-500)) top / 2px var(--trilha-cheia, 100%) no-repeat, var(--linha);
}
.linha-tempo__item { position: relative; display: grid; gap: var(--e-2); }
.linha-tempo__item > .no { position: absolute; left: -34px; top: 4px; }
.linha-tempo__data {
  font-family: var(--fonte-titulo);
  font-weight: 700;
  font-size: var(--fs-lg);
  color: var(--indigo-900);
  line-height: 1.2;
}

@media (min-width: 900px) {
  .linha-tempo {
    grid-auto-flow: column;
    grid-auto-columns: calc((100% - 2 * var(--e-4)) / 3);
    padding: 34px 0 0;
    gap: var(--e-4);
  }
  .linha-tempo::before {
    left: 0;
    right: 0;
    top: 6px;
    bottom: auto;
    width: auto;
    height: 2px;
    background: var(--linha);
  }
  .linha-tempo__item > .no { left: 0; top: -34px; }
  .linha-tempo--realizado::before { background: var(--laranja-500); }
}

/* --------------------------------------------------------------------------
   Cartão de evento
   -------------------------------------------------------------------------- */
.evento-card {
  position: relative;
  display: flex;
  flex-direction: column;
  height: 100%;
  border-radius: var(--raio);
  background: var(--branco);
  overflow: hidden;
  box-shadow: var(--sombra);
}
.evento-card__midia {
  position: relative;
  aspect-ratio: 16 / 10;
  background: var(--indigo-800);
  overflow: hidden;
}
.evento-card__midia img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform 500ms cubic-bezier(0.2, 0.7, 0.2, 1);
}
.evento-card:hover .evento-card__midia img { transform: scale(1.04); }
.evento-card__corpo {
  display: flex;
  flex-direction: column;
  gap: 0.6rem;
  flex: 1;
  padding: var(--e-3);
}
.evento-card__titulo { font-size: var(--fs-lg); font-weight: 700; line-height: 1.25; }
.evento-card__titulo a { color: var(--tinta); text-decoration: none; }
/* Cartão inteiro clicável a partir do link do título */
.evento-card__titulo a::after { content: ""; position: absolute; inset: 0; }
.evento-card__titulo a:focus-visible { outline: none; }
.evento-card:has(a:focus-visible) { outline: 3px solid var(--laranja-500); outline-offset: 3px; }
.evento-card__meta {
  display: flex;
  flex-wrap: wrap;
  gap: 0.35rem 1rem;
  margin-top: auto;
  padding-top: 0.4rem;
  color: var(--tinta-suave);
  font-size: var(--fs-sm);
}
.evento-card__meta span { display: inline-flex; align-items: center; gap: 0.35rem; }
.evento-card__meta svg { width: 16px; height: 16px; }

/* Edição sem material publicado ainda */
.evento-card--em-breve {
  background: transparent;
  box-shadow: none;
  border: 2px dashed #c9cde0;
}
.evento-card--em-breve .evento-card__midia {
  display: grid;
  place-items: center;
  background:
    radial-gradient(circle at 1px 1px, rgba(22, 21, 58, 0.14) 1px, transparent 0) 0 0 / 18px 18px,
    var(--nevoa);
  color: var(--tinta-suave);
}
.evento-card--em-breve .evento-card__midia svg { width: 36px; height: 36px; }
@media (max-width: 899px) { .evento-card--em-breve .evento-card__midia { aspect-ratio: 16 / 6; } }

.etiqueta {
  display: inline-flex;
  align-items: center;
  align-self: flex-start;
  justify-self: start;
  gap: 0.35rem;
  padding: 0.2rem 0.65rem;
  border-radius: 999px;
  background: var(--azul-100);
  color: var(--azul-700);
  font-size: var(--fs-xs);
  font-weight: 700;
}
.etiqueta--laranja { background: var(--laranja-100); color: #7a4f00; }

/* --------------------------------------------------------------------------
   Equipe
   -------------------------------------------------------------------------- */
.equipe-coord {
  display: grid;
  gap: var(--e-3);
  margin-bottom: var(--e-5);
}
@media (min-width: 640px) { .equipe-coord { grid-template-columns: repeat(2, minmax(0, 1fr)); } }

.pessoa-destaque {
  display: flex;
  align-items: center;
  gap: var(--e-3);
  padding: var(--e-3);
  border-radius: var(--raio-lg);
  background: var(--indigo-900);
  color: var(--branco);
}
.pessoa-destaque .avatar { width: 104px; height: 104px; font-size: 2rem; border: 3px solid var(--laranja-500); }
.pessoa-destaque h3 { font-size: var(--fs-xl); }
.pessoa-destaque p { color: rgba(255, 255, 255, 0.78); margin-top: 0.3rem; }

.equipe-grupo-titulo {
  display: grid;
  gap: 0.25rem;
  margin-bottom: var(--e-4);
}
.equipe-grupo-titulo h3 { font-size: var(--fs-lg); }
.equipe-grupo-titulo p { font-size: var(--fs-sm); }

.equipe-alunos {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: var(--e-4) var(--e-3);
  margin: 0;
  padding: 0;
  list-style: none;
}
.pessoa {
  display: grid;
  justify-items: center;
  gap: 0.6rem;
  text-align: center;
}
.pessoa .avatar { width: 96px; height: 96px; font-size: 1.6rem; }
.pessoa__nome { font-family: var(--fonte-titulo); font-weight: 700; font-size: 1.0625rem; line-height: 1.25; }
.pessoa__papel { font-size: var(--fs-sm); color: var(--tinta-suave); line-height: 1.35; }

.avatar {
  display: grid;
  place-items: center;
  flex: none;
  border-radius: 50%;
  overflow: hidden;
  background: var(--indigo-800);
  color: var(--laranja-400);
  font-family: var(--fonte-titulo);
  font-weight: 800;
  letter-spacing: -0.02em;
}
.avatar img { width: 100%; height: 100%; object-fit: cover; }

/* Aviso na home: monitores ficam em cada edição */
.monitores-aviso {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: var(--e-2) var(--e-4);
  padding: var(--e-3) var(--e-4);
  border-radius: var(--raio-lg);
  background: var(--nevoa);
}
.monitores-aviso p { max-width: 60ch; color: var(--tinta-suave); }
.equipe-coord { margin-bottom: var(--e-4); }

/* Vaga reservada (aluno ainda sem dados) */
.pessoa--aguardando .avatar {
  background: var(--nevoa);
  border: 2px dashed #c3c7da;
  color: #9a9db3;
}
.pessoa--aguardando .avatar svg { width: 40%; height: 40%; }
.pessoa--aguardando .pessoa__nome { color: var(--tinta-suave); font-weight: 600; }

@media (min-width: 640px) { .equipe-alunos { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@media (min-width: 1100px) { .equipe-alunos { grid-template-columns: repeat(5, minmax(0, 1fr)); } }
@media (max-width: 479px) {
  .equipe-alunos { gap: var(--e-3) var(--e-2); }
  .pessoa .avatar { width: 80px; height: 80px; }
  .pessoa-destaque { gap: var(--e-2); padding: var(--e-2); }
  .pessoa-destaque .avatar { width: 80px; height: 80px; }
}

/* --------------------------------------------------------------------------
   Parceiros
   -------------------------------------------------------------------------- */
.parceiros {
  display: flex;
  flex-wrap: wrap;
  gap: var(--e-3);
  margin: 0;
  padding: 0;
  list-style: none;
}
.parceiro {
  display: grid;
  place-items: center;
  width: clamp(140px, 30vw, 200px);
  aspect-ratio: 3 / 2;
  padding: var(--e-2);
  border-radius: var(--raio);
  background: var(--branco);
  border: 1px solid var(--linha);
}
.parceiro img { max-height: 100%; width: auto; object-fit: contain; }

/* --------------------------------------------------------------------------
   Filtro (chips)
   -------------------------------------------------------------------------- */
.filtro {
  display: flex;
  flex-wrap: wrap;
  gap: var(--e-1);
  margin-bottom: var(--e-4);
}
.filtro button {
  min-height: 44px;
  padding: 0 1.1rem;
  border: 1.5px solid var(--linha);
  border-radius: 999px;
  background: var(--branco);
  font-weight: 700;
  font-size: var(--fs-sm);
  transition: background var(--transicao), border-color var(--transicao), color var(--transicao);
}
.filtro button:hover { border-color: var(--indigo-900); }
.filtro button[aria-pressed="true"] { background: var(--indigo-900); border-color: var(--indigo-900); color: var(--branco); }

.grade-eventos {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(min(100%, 300px), 1fr));
  gap: var(--e-4) var(--e-3);
  margin: 0;
  padding: 0;
  list-style: none;
}

/* --------------------------------------------------------------------------
   Galeria + lightbox
   -------------------------------------------------------------------------- */
.galeria {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0.6rem;
  margin: 0;
  padding: 0;
  list-style: none;
}
@media (min-width: 640px) { .galeria { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--e-2); } }
.galeria li:first-child { grid-column: span 2; }
@media (min-width: 1024px) {
  .galeria { grid-template-columns: repeat(4, minmax(0, 1fr)); }
  .galeria li:first-child { grid-row: span 2; }
}
.galeria button {
  display: block;
  width: 100%;
  height: 100%;
  padding: 0;
  border: 0;
  border-radius: var(--raio-sm);
  overflow: hidden;
  background: var(--indigo-800);
  aspect-ratio: 4 / 3;
}
.galeria li:first-child button { aspect-ratio: 16 / 10; }
@media (min-width: 1024px) { .galeria li:first-child button { aspect-ratio: auto; min-height: 100%; } }
.galeria img { width: 100%; height: 100%; object-fit: cover; transition: transform 400ms ease, opacity 200ms ease; }
.galeria button:hover img { transform: scale(1.05); }

.lightbox {
  width: 100%;
  max-width: none;
  height: 100%;
  max-height: none;
  margin: 0;
  padding: 0;
  border: 0;
  background: rgba(10, 9, 30, 0.96);
  color: var(--branco);
}
.lightbox::backdrop { background: rgba(10, 9, 30, 0.8); }
.lightbox[open] { display: grid; grid-template-rows: auto 1fr auto; }
.lightbox__topo {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--e-2);
  padding: var(--e-2) var(--gutter);
}
.lightbox__contador { font-size: var(--fs-sm); color: rgba(255, 255, 255, 0.75); }
.lightbox__palco {
  position: relative;
  display: grid;
  place-items: center;
  min-height: 0;
  padding: 0 var(--gutter);
  touch-action: pan-y;
}
.lightbox__palco img {
  max-width: 100%;
  max-height: 100%;
  width: auto;
  object-fit: contain;
  border-radius: var(--raio-sm);
}
.lightbox__legenda {
  padding: var(--e-2) var(--gutter) var(--e-3);
  text-align: center;
  color: rgba(255, 255, 255, 0.85);
  font-size: var(--fs-sm);
}
.lightbox__btn {
  display: inline-grid;
  place-items: center;
  width: 48px;
  height: 48px;
  border: 1px solid rgba(255, 255, 255, 0.25);
  border-radius: 50%;
  background: rgba(22, 21, 58, 0.7);
  color: var(--branco);
}
.lightbox__btn:hover { background: var(--laranja-500); border-color: var(--laranja-500); color: var(--indigo-900); }
.lightbox__btn svg { width: 22px; height: 22px; }
.lightbox__nav { position: absolute; top: 50%; transform: translateY(-50%); }
.lightbox__nav--ant { left: var(--gutter); }
.lightbox__nav--prox { right: var(--gutter); }
@media (max-width: 639px) {
  .lightbox__nav { top: auto; bottom: -56px; transform: none; }
  .lightbox__palco { margin-bottom: 64px; }
}

/* Vídeos */
.videos {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(min(100%, 280px), 1fr));
  gap: var(--e-3);
  margin: 0;
  padding: 0;
  list-style: none;
}
.videos video {
  width: 100%;
  aspect-ratio: 16 / 9;
  object-fit: cover;
  border-radius: var(--raio);
  background: var(--indigo-900);
}
.videos figcaption { margin-top: 0.6rem; font-size: var(--fs-sm); color: var(--tinta-suave); }

/* Estado vazio */
.vazio {
  display: grid;
  justify-items: start;
  gap: var(--e-2);
  padding: var(--e-4);
  border: 2px dashed #c9cde0;
  border-radius: var(--raio);
  color: var(--tinta-suave);
}

/* --------------------------------------------------------------------------
   Trilha de navegação (breadcrumb)
   -------------------------------------------------------------------------- */
.trilha-nav ol {
  display: flex;
  flex-wrap: wrap;
  gap: 0.4rem;
  margin: 0 0 var(--e-3);
  padding: 0;
  list-style: none;
  font-size: var(--fs-sm);
}
.trilha-nav li + li::before { content: "/"; margin-right: 0.4rem; color: rgba(255, 255, 255, 0.4); }
.trilha-nav a { color: rgba(255, 255, 255, 0.78); }
.trilha-nav a:hover { color: var(--branco); }
.trilha-nav [aria-current] { color: var(--laranja-400); }

/* --------------------------------------------------------------------------
   Contato
   -------------------------------------------------------------------------- */
.contato {
  display: grid;
  gap: var(--e-4);
  align-items: stretch;
}
@media (min-width: 900px) { .contato { grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); } }

.contato__lista { display: grid; gap: var(--e-3); margin: 0; padding: 0; list-style: none; }
.contato__item { display: flex; gap: var(--e-2); align-items: flex-start; }
.contato__icone {
  display: grid;
  place-items: center;
  width: 48px;
  height: 48px;
  flex: none;
  border-radius: 14px;
  background: var(--indigo-900);
  color: var(--laranja-400);
}
.contato__icone svg { width: 22px; height: 22px; }
.contato__item strong { display: block; font-family: var(--fonte-titulo); font-size: 1.0625rem; }
.contato__item a { color: var(--tinta); }
.contato__item a:hover { color: var(--azul-700); }

.redes { display: flex; gap: var(--e-1); margin-top: var(--e-1); }
.redes a {
  display: grid;
  place-items: center;
  width: 46px;
  height: 46px;
  border-radius: 50%;
  border: 1.5px solid var(--linha);
  color: var(--indigo-900);
  transition: background var(--transicao), color var(--transicao), border-color var(--transicao);
}
.redes a:hover { background: var(--indigo-900); border-color: var(--indigo-900); color: var(--laranja-400); }
.redes svg { width: 20px; height: 20px; }

.mapa {
  min-height: 340px;
  border-radius: var(--raio-lg);
  overflow: hidden;
  background: var(--nevoa);
}
.mapa iframe { display: block; width: 100%; height: 100%; min-height: 340px; border: 0; }

/* --------------------------------------------------------------------------
   Rodapé
   -------------------------------------------------------------------------- */
.rodape {
  background: var(--indigo-950);
  color: rgba(255, 255, 255, 0.78);
  padding-top: var(--e-6);
  font-size: var(--fs-sm);
}
.rodape__grid {
  display: grid;
  gap: var(--e-4);
  padding-bottom: var(--e-5);
}
@media (min-width: 768px) { .rodape__grid { grid-template-columns: 1.6fr 1fr 1fr; } }
.rodape__marca img { height: 40px; width: auto; margin-bottom: var(--e-2); }
.rodape__marca p { max-width: 36ch; }
.rodape__slogan { font-family: var(--fonte-titulo); font-size: var(--fs-lg); color: var(--branco); font-weight: 700; margin-bottom: 0.4rem; }
.rodape h2 { font-size: 1rem; color: var(--branco); margin-bottom: var(--e-2); letter-spacing: 0; }
.rodape ul { display: grid; gap: 0.5rem; margin: 0; padding: 0; list-style: none; }
.rodape a { color: rgba(255, 255, 255, 0.78); text-decoration: none; }
.rodape a:hover { color: var(--laranja-400); text-decoration: underline; }
.rodape .redes a { border-color: rgba(255, 255, 255, 0.2); color: var(--branco); }
.rodape .redes a:hover { background: var(--laranja-500); border-color: var(--laranja-500); color: var(--indigo-900); text-decoration: none; }
.rodape__base {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  gap: var(--e-1) var(--e-3);
  padding-block: var(--e-3);
  border-top: 1px solid rgba(255, 255, 255, 0.1);
  font-size: var(--fs-xs);
  color: rgba(255, 255, 255, 0.6);
}

/* Botão voltar ao topo */
.topo-btn {
  position: fixed;
  right: var(--gutter);
  bottom: var(--gutter);
  z-index: 40;
  display: grid;
  place-items: center;
  width: 48px;
  height: 48px;
  border-radius: 50%;
  background: var(--laranja-500);
  color: var(--indigo-900);
  box-shadow: 0 10px 24px -10px rgba(0, 0, 0, 0.5);
  opacity: 0;
  visibility: hidden;
  transform: translateY(10px);
  transition: opacity var(--transicao), transform var(--transicao), visibility var(--transicao);
}
.topo-btn.is-visivel { opacity: 1; visibility: visible; transform: none; }
.topo-btn svg { width: 22px; height: 22px; }

/* Tablet: cartões da linha do tempo na horizontal (imagem ao lado do texto) */
@media (min-width: 640px) and (max-width: 899px) {
  .linha-tempo .evento-card { flex-direction: row; }
  .linha-tempo .evento-card__midia { flex: 0 0 40%; aspect-ratio: auto; min-height: 200px; }
}

/* --------------------------------------------------------------------------
   Cronograma das aulas (página do evento)
   -------------------------------------------------------------------------- */
.cronograma {
  position: relative;
  display: grid;
  gap: var(--e-3);
  margin: 0;
  padding: 0;
  list-style: none;
}
.cronograma__item {
  position: relative;
  display: grid;
  gap: var(--e-2);
  padding: var(--e-3);
  border-radius: var(--raio);
  border: 1px solid var(--linha);
  background: var(--branco);
}
@media (min-width: 768px) {
  .cronograma::before {
    content: "";
    position: absolute;
    left: 7px;
    top: 30px;
    bottom: 30px;
    width: 2px;
    background: var(--laranja-500);
  }
  .cronograma { padding-left: 40px; }
  .cronograma__item { grid-template-columns: 200px minmax(0, 1fr); gap: var(--e-4); padding: var(--e-4); }
  .cronograma__item::before {
    content: "";
    position: absolute;
    left: -40px;
    top: calc(var(--e-4) + 6px);
    width: 16px;
    height: 16px;
    border-radius: 50%;
    background: var(--laranja-500);
    box-shadow: 0 0 0 5px var(--laranja-100);
  }
}
.cronograma__quando { display: grid; align-content: start; gap: 0.2rem; }
.cronograma__modulo {
  font-family: var(--fonte-titulo);
  font-weight: 800;
  font-size: var(--fs-xl);
  line-height: 1.1;
  color: var(--indigo-900);
}
.cronograma__quando time { color: var(--tinta-suave); }
.cronograma__horas {
  justify-self: start;
  margin-top: 0.4rem;
  padding: 0.2rem 0.65rem;
  border-radius: 999px;
  background: var(--laranja-100);
  color: #7a4f00;
  font-size: var(--fs-xs);
  font-weight: 700;
}
.cronograma__conteudo { display: grid; gap: 0.6rem; }
.cronograma__conteudo h3 { font-size: var(--fs-lg); }
.cronograma__conteudo ul { margin: 0; padding-left: 1.15rem; color: var(--tinta-suave); display: grid; gap: 0.25rem; }
.cronograma__monitores {
  margin-top: 0.4rem;
  padding-top: 0.75rem;
  border-top: 1px solid var(--linha);
  font-size: var(--fs-sm);
  color: var(--tinta-suave);
}
.cronograma__monitores strong { color: var(--tinta); }

/* Vídeo gravado em pé (celular) */
.videos .video--vertical video { aspect-ratio: 9 / 16; max-height: 640px; object-fit: contain; }