/* ==========================================================
   SEÇÃO 3 — Print: Secao-3-LP-FormacaoPrime.png (1920 × 678)

   As polaroids ficam acima das seções vizinhas (z-index), então
   podem "vazar" para a Seção 2 e a Seção 4 como se estivessem coladas.
   Posição = medida no print de 1920, relativa ao centro da tela,
   para acompanhar o conteúdo central em qualquer largura.
   ========================================================== */

.secao-3 {
  position: relative;
  z-index: 2;
  /* corta só o que passar das laterais da tela (evita rolagem lateral);
     em cima/embaixo as polaroids continuam invadindo as seções vizinhas */
  overflow-x: clip;
  height: 678px;
  padding-top: 120px;
  background: #dac8be;
  color: var(--cor-vinho);
  font-family: var(--fonte-gotham);
  text-align: center;
}

/* ---------- Polaroids ---------- */
.secao-3__polaroid {
  position: absolute;
  z-index: 1;
  pointer-events: none;
  user-select: none;
}

.secao-3__polaroid--dir {
  top: -69.5px;              /* invade 69px a Seção 2 */
  left: calc(50% + 380px);   /* x=1340 no print */
  width: 424.5px;
}

.secao-3__polaroid--esq {
  top: 316.6px;              /* invade 78px a Seção 4 */
  left: calc(50% - 828.7px); /* x=131.3 no print */
  width: 424.5px;
}

/* ---------- Título ---------- */
.secao-3__titulo {
  position: relative;
  z-index: 2;
  margin: 0 0 0 -0.1em; /* compensa o espaçamento negativo após a última letra (centraliza igual ao Figma) */
  font-size: 98px;
  line-height: 90px;
  font-weight: 300;
  letter-spacing: -0.1em;
  text-transform: uppercase;
}

.secao-3__titulo strong {
  font-weight: 500;
}

/* ---------- Caixas ---------- */
.secao-3__lista {
  position: relative;
  z-index: 2;
  width: 750px;
  margin: 41px auto 0;
  padding: 0;
  list-style: none;
}

.secao-3__lista li {
  display: flex;
  align-items: center;
  justify-content: center;
  height: 78px;
  background: var(--cor-clara);
  border-radius: 9.52px;
  font-size: 24px;
  line-height: 30px;
  font-weight: 400;
  letter-spacing: -0.06em;
}

.secao-3__lista li + li {
  margin-top: 18px;
}

.secao-3__lista li:last-child {
  height: 116px;
  padding-bottom: 6px; /* no Figma o texto desta caixa fica 3px acima do centro */
}

.secao-3__lista strong {
  font-weight: 500;
}