html {
  scroll-behavior: smooth;
}

.hero-area-v5 {
  background-color: var(--color-dark);
  padding-top: 30px;
  padding-bottom: 30px;
  position: relative;
  overflow: hidden;
  z-index: 1;
}

.hero-area-v5 .hero-content .hero-title {
  font-size: 64px;
}

@media (max-width: 1024px) {
  .hero-area-v5 .hero-content .hero-title {
    font-size: 50px;
  }
}

@media (max-width: 768px) {
  .hero-area-v5 .hero-content .hero-title {
    font-size: 48px;
  }
}

@media (max-width: 480px) {
  .hero-area-v5 .hero-content .hero-title {
    font-size: 32px;
  }
}

.template-header .nav-menu .sub-menu {
  width: 420px;
}