@charset "utf-8";

/* ============================================================
   TIMELINE 45 ANOS – CSS COMPLETO E CORRIGIDO
   Layout alternado A/B por linha:
   - ROW A (ímpar): [FOTO ESQ] | [ANO + TEXTO DIR]
   - ROW B (par):   [ANO + TEXTO ESQ] | [FOTO DIR]
   ============================================================ */

/* Reset de imagens */
.colunaEsquerda img,
.colunaDireita img,
.img-responsive {
  display: block;
  max-width: 100%;
  height: auto;
}

/* Linha da timeline: dois blocos lado a lado */
.row.timeline-row {
  display: flex !important;
  flex-wrap: nowrap;
  align-items: flex-start;     /* alinha topo-a-topo os dois blocos */
  gap: 24px;
  margin-bottom: 32px;
}

/* Remove floats antigos SOMENTE dentro da timeline */
.row.timeline-row .colunaEsquerda,
.row.timeline-row .colunaDireita,
.row.timeline-row .boxTestEsquerda,
.row.timeline-row .boxTestDireita,
.row.timeline-row .text1 {
  float: none !important;
  position: relative;
}

/* Larguras por tipo de linha */
.row.timeline-row.row-A .colunaEsquerda { /* FOTO ESQ */
  width: 55% !important;
  min-width: 280px;
}
.row.timeline-row.row-A .colunaDireita { /* STACK DIR */
  width: 45% !important;
  min-width: 260px;
}

.row.timeline-row.row-B .colunaEsquerda { /* STACK ESQ */
  width: 45% !important;
  min-width: 260px;
}
.row.timeline-row.row-B .colunaDireita { /* FOTO DIR */
  width: 55% !important;
  min-width: 280px;
}

/* Stack (ANO + TEXTO) — "um bloco com ano e texto" */
.row.timeline-row .stack {
  display: flex;
  flex-direction: column;
  align-items: flex-start;  /* alinha à esquerda */
  gap: 12px;
}

/* PNG do Ano */
.row.timeline-row .stack .ano,
.row.timeline-row .colunaDireita .ano,
.row.timeline-row .colunaEsquerda .ano {
  max-width: 320px;    /* ajuste fino 300–340px, se desejar */
  width: 100%;
  height: auto;
  object-fit: contain;
}

/* Texto */
.row.timeline-row .text1 {
  width: 100%;
  font-family: "Myriad Pro", "Lato", "Open Sans", sans-serif;
  font-size: 18px;
  line-height: 1.6;
  text-align: justify;
  color: #222;
}

/* Foto */
.row.timeline-row .foto img {
  width: 100%;
  height: auto;
  object-fit: cover; /* troque para 'contain' se preferir bordas */
}


/* Ajuste opcional – selo inicial */
.container > .row:first-of-type img[alt*="45 anos"] {
  margin-bottom: 16px;
}

/* Correção caso existam regras antigas com "Height" */
.boxTestEsquerda,
.boxTestDireita {
  height: auto;
}

.selo-final{
    max-width:400px;
    height:auto;
    display:block;
}

.linhaTimeline{
    margin:50px 0;
    border:0;
    height:2px;
    background:#096a3a;
}

/* ============================================================
   MOBILE
   ============================================================ */

@media (max-width: 768px) {

  /* empilha as colunas */
  .row.timeline-row {
    flex-direction: column;
    align-items: center;
    gap: 18px;
  }

  /* colunas ocupam tela toda */
  .row.timeline-row .colunaEsquerda,
  .row.timeline-row .colunaDireita {
    width: 100% !important;
    min-width: 0;
    text-align: center;
  }

  /* stack (ano + texto) centralizado */
  .row.timeline-row .stack {
    align-items: center;
    text-align: center;
  }

  /* imagem do ano */
  .row.timeline-row .ano {
    max-width: 220px;
    margin: 0 auto;
  }

  /* textos */
  .row.timeline-row .text1 {
    font-size: 16px;
    text-align: center;
    max-width: 95%;
    margin: 0 auto;
  }

  /* fotos */
  .row.timeline-row .foto img {
    width: 100%;
    height: auto;
    display: block;
  }

  /* selo final */
  .selo-final {
    max-width: 260px;
    margin: 0 auto;
  }

}

.sub45{
	font-size: 34px;
	font-weight: bold;
	color:#096a3a;
	margin-bottom: 20px;
}