.hero-story--image {
  background-position: center;
  background-size: cover;
}

/* Destaque principal: proporções mais compactas e melhor leitura. */
.hero-grid {
  grid-template-columns: minmax(0, 1.65fr) minmax(270px, .75fr);
  gap: 20px;
  padding: 32px 0;
}

.hero-story {
  min-height: 330px;
  padding: clamp(28px, 4vw, 54px);
}

.hero-story h1 {
  font-size: clamp(2.1rem, 4vw, 3.65rem);
  max-width: 650px;
}

.hero-story p {
  font-size: 1.02rem;
  margin: 18px 0 8px;
}

.hero-note {
  border-top: 4px solid var(--teal);
  padding: 30px;
  justify-content: center;
}

.hero-note h2 {
  font-family: 'DM Serif Display', Georgia, serif;
  letter-spacing: -.03em;
  margin: 14px 0;
}

.hero-note p {
  font-size: .95rem;
  margin: 0;
}

@media (max-width: 720px) {
  .hero-story { min-height: 310px; }
  .hero-note { min-height: 0; padding: 24px; }
}