/* Final visual adjustments: centered photo hero and responsive spacing. */
html,
body {
  overflow-x: hidden;
}

.hero {
  height: auto;
  min-height: 700px;
}

.hero-image {
  background: url("../img/hero-constelacao-sp.jpg") center center / cover no-repeat;
  z-index: -2;
}

.final-cta-image {
  background: url("../img/cta-band.jpg") center center / cover no-repeat;
}

.hero-overlay {
  background: linear-gradient(90deg, rgba(91, 23, 49, .94) 0%, rgba(119, 38, 64, .82) 46%, rgba(166, 85, 104, .46) 100%);
}

.hero-content {
  width: min(800px, 74%);
  padding: 96px 0 64px 98px;
}

.hero h1 {
  font-size: clamp(44px, 4vw, 54px);
}

.online-image {
  background: linear-gradient(#fff0, #fff2), url("../img/soft-detail.jpg") center / cover;
}

@media (max-width: 900px) {
  .shell {
    width: min(var(--shell), calc(100% - 32px));
  }

  .hero.shell {
    width: 100%;
  }

  .hero {
    min-height: 0;
    border-radius: 0;
  }

  .hero-image {
    background-position: 61% center;
  }

  .hero-overlay {
    background: linear-gradient(90deg, rgba(91, 23, 49, .89), rgba(119, 38, 64, .73));
  }

  .hero-content {
    width: 100%;
    padding: 80px 24px 56px;
  }

  .hero h1 {
    font-size: clamp(38px, 10vw, 48px);
    line-height: 1.12;
  }

  .hero-copy {
    line-height: 1.65;
  }

  .hero-trust {
    gap: 10px 14px;
    font-size: 11px;
  }
}

@media (max-width: 560px) {
  /* Mobile gutters: keep every text block comfortably away from the viewport. */
  .shell {
    width: calc(100% - 40px);
  }

  .hero-content {
    padding-inline: 20px;
  }

  .process-band,
  .online-panel,
  .faq-panel {
    padding: 40px 24px;
  }

  .facilitator {
    padding: 28px 24px;
  }

  .process-band > *,
  .online-panel > *,
  .faq-panel > *,
  .facilitator > *,
  .investment-grid > *,
  .arrival-grid > * {
    min-width: 0;
  }

  .hero-actions .pill,
  .investment-price .pill,
  .final-cta .pill {
    width: 100%;
    min-width: 0;
    max-width: 100%;
    padding-inline: 14px;
    white-space: normal;
    text-align: center;
    line-height: 1.35;
  }

  .hero-actions .pill span,
  .investment-price .pill span,
  .final-cta .pill span {
    flex: 0 0 27px;
  }

  .final-cta.shell {
    width: calc(100% - 40px);
    border-radius: 24px;
  }

  .final-cta-content {
    padding-inline: 20px;
  }
}