@tailwind base;
@tailwind components;
@tailwind utilities;


html {
    scroll-behavior: smooth;
  }
  .grain:before {
    content: "";
    position: absolute;
    inset: 0;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='180' height='180'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='180' height='180' filter='url(%23n)' opacity='.08'/%3E%3C/svg%3E");
    mix-blend-mode: overlay;
    pointer-events: none;
    border-radius: inherit;
  }

  section[id] {
    scroll-margin-top: 60px;
  }