tailwind.css

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

@layer base {
  p {
    margin-bottom: 1rem;
  }
  p > a {
    text-decoration: underline;
  }
  p > a:hover {
    text-decoration: none;
  }
  /* pink links (excludes the logo) */
  a:not(.logo) {
    position: relative;
  }
  a:not(.logo)::after {
    content: '';
    transform-origin: 0 0;
    transform: scaleX(0);
    position: absolute;
    bottom: 0.01em;
    left: 0;
    right: 0;
    height: .4em;
    background: #F5B2A5;
    z-index: -1;
    opacity: 0.8;
    transition: transform .3s;
  }
  a:not(.logo):hover::after {
    transform: scaleX(1);
  }
  nav a:not(.logo)::after {
    bottom: 0.22em;
  }
  /* blog */
  article header h1,
  article header h2 {
    margin-bottom: 0 !important;
  }
  /* images in figures */
  figure img {
    margin-top: 0 !important;
    margin-bottom: 0 !important;
  }
}

@layer components {
  /* background noise effect */
  .noise {
    z-index: 100;
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    pointer-events: none;
    opacity: .05;
  }
}