@import "tailwindcss";

/* Basis-Stile */

body {
  font-family: "Space Mono", monospace;
}
h1,
.font-title {
  font-family: "Jura", sans-serif;
  font-size: 3rem;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

/* Logo Glow Styles from home.html */
:root {
  --glow: #ffc107;
}

.logo-wrap {
  display: inline-block;
  padding: 16px 24px;
  border-radius: 12px;
}

.glow-pulse {
  display: block;
  max-width: 100%;
  height: auto;
  opacity: 0.8;
  animation: neonPulse 7s ease-in-out infinite;
}

@keyframes neonPulse {
  0%,
  100% {
    filter: drop-shadow(0 0 3px var(--glow)) drop-shadow(0 0 7px var(--glow))
      drop-shadow(0 0 7px var(--glow));
  }
  50% {
    filter: drop-shadow(0 0 0.5px var(--glow)) drop-shadow(0 0 2px var(--glow))
      drop-shadow(0 0 1px var(--glow));
  }
}

@media (prefers-reduced-motion: reduce) {
  .glow-pulse {
    animation: none;
  }
}

@media only screen and (max-width: 768px) {
  .title-text {
    font-family: "Jura", sans-serif;
    font-size: 2rem;
  }
}