/*
  Paisagem — faixa vinho, composição centralizada: título grande no topo e,
  abaixo, o vídeo centralizado com o subtítulo + parágrafo embaixo.
*/
.paisagem {
  width: 100%;
  background-color: var(--color-vinho);
  padding: var(--sp-section) var(--grid-margin);
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: var(--sp-section);
  text-align: center;
}

.paisagem__title {
  margin: 0;
  text-align: center;
  color: var(--color-areia);
}
/* Quebra fixa: uma frase por linha. */
.paisagem__line {
  display: block;
}
/* Destaque de "no vinho" — itálico (peso maior que o traço fino do título). */
.paisagem__hl {
  font-style: italic;
}

/* Vídeo centralizado com o texto centralizado embaixo. */
.paisagem__row {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: var(--sp-12);
  width: 100%;
}
.paisagem__figure {
  margin: 0;
  overflow: hidden;
  line-height: 0;   /* remove respiro abaixo do vídeo */
  /* Cresce de 46% (centralizado) até largura total no scroll.
     --expand (0→1) é definido pelo scroll-expand.js. */
  --expand: 0;
  width: calc(46% + var(--expand) * (54% + 2 * var(--grid-margin)));
}
.paisagem__video {
  display: block;
  width: 100%;
  /* vertical no início, vira faixa mais baixa conforme abre pra largura total */
  height: calc(92vh - var(--expand) * 16vh);
  object-fit: cover;
}
.paisagem__text-col {
  max-width: 82ch;
  display: flex;
  flex-direction: column;
  gap: var(--sp-6);
}
.paisagem__subtitle {
  margin: 0;
  color: var(--color-areia);
}
.paisagem__text {
  margin: 0;
  color: var(--color-areia);
}

@media (max-width: 768px) {
  .paisagem {
    gap: var(--sp-16);
  }
  .paisagem__figure {
    width: 100%;
  }
  .paisagem__video {
    height: 70vh;
  }
  .paisagem__text-col {
    max-width: none;
  }
}
