/* ==========================================================================
   06 — BRINDE  (Figma 3270:1360 — 1920 x 577)
   Banner full-bleed: foto de fundo, véu preto a 49% e conteúdo centralizado.
   ========================================================================== */

.brinde {
  display: grid;
  place-items: center;
  min-height: 577px;
  padding: clamp(4rem, 8vw, 6rem) var(--gutter);
  color: var(--c-branco);
  isolation: isolate;
}

/* ---- Fundo --------------------------------------------------------------- */
.brinde__bg {
  position: absolute;
  inset: 0;
  z-index: -1;
  overflow: hidden;
}

.brinde__bg img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
  will-change: transform;
}

/* véu: rgba(0,0,0,0.49) no Figma */
.brinde__bg::after {
  content: "";
  position: absolute;
  inset: 0;
  background: rgb(0 0 0 / 0.49);
}

/* ---- Conteúdo ------------------------------------------------------------ */
.brinde__inner {
  position: relative;
  z-index: var(--z-content);
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 28px;
  width: 100%;
  max-width: 653px;
  text-align: center;
}

.brinde__head {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 13px;
}

.brinde__title {
  font-size: var(--fs-h2-lg);
  line-height: 1.08;
}

.brinde__lead {
  max-width: 591px; /* o Figma limita o parágrafo, não o bloco */
  font-size: var(--fs-lead);
  line-height: var(--lh-lead);
}

/* ==========================================================================
   Responsivo
   ========================================================================== */

@media (max-width: 767px) {
  .brinde {
    min-height: 0;
    padding-block: clamp(3.5rem, 14vw, 5rem);
  }

  .brinde__title {
    text-wrap: balance; /* "Fechou, ganhou de / verdade" em vez de órfã */
  }

  .brinde__inner {
    gap: var(--sp-6);
  }

  .brinde__lead {
    max-width: none;
  }

  .brinde__inner .btn {
    width: 100%;
  }
}
