/* Hero: o painel completo assume o papel de principal prova visual. */
.hero-grid {
  grid-template-columns: minmax(330px, .78fr) minmax(570px, 1.22fr);
  gap: 40px;
}

.hero-dashboard {
  position: relative;
  align-self: center;
  margin: -20px -32px -42px 0;
}

.hero-dashboard img {
  display: block;
  width: 100%;
  height: auto;
  filter: drop-shadow(0 30px 40px rgba(0, 16, 10, .5));
}

@media (max-width: 900px) {
  .hero-grid { grid-template-columns: 1fr; gap: 30px; }
  .hero-dashboard { max-width: 730px; margin: 0 auto -25px; }
}

@media (max-width: 560px) {
  .hero-dashboard { margin: 0 auto -12px; }
}