html {
  scroll-behavior: smooth;
}

section[id] {
  scroll-margin-top: 4rem;
}

/* Hero image diagonal clip */
.hero-clip {
  clip-path: polygon(20% 0, 100% 0, 100% 100%, 0 100%);
}

@media (max-width: 768px) {
  .hero-clip {
    clip-path: none;
    opacity: 0.25;
  }
}