.hero-bottom {
  background: linear-gradient(135deg, var(--dark-black), #0f172a);
  color: var(--white);
  border-radius: 0px;
  box-shadow: 0 4px 24px rgba(30,41,59,0.10);
  padding: 2.5rem 1rem 2rem 1rem;
  margin-top: 2.5rem;
}

.hero-bottom .section-title {
  color: var(--primary);
  font-size: 1.5rem;
  margin-bottom: 0.5rem;
}

.hero-bottom .bottom-intro {
  color: var(--hover-gray);
  font-size: 1.08rem;
  margin-bottom: 1.5rem;
  max-width: 600px;
  margin-left: auto;
  margin-right: auto;
}




@media (max-width: 600px) {
  .hero-bottom {
    padding: 1.2rem 0.2rem 1.5rem 0.2rem;
  }
 
}


/* ...existing code... */

.bottom-section {
  margin-bottom: 0 !important;
  padding-bottom: 0 !important;
}

.hero-bottom {
  margin-bottom: 0 !important;
  /* Keep your existing padding for inside spacing */
}

footer,
.footer-container {
  margin-top: 0 !important;
  padding-top: 0 !important;
}