.hover-glow:hover {
    box-shadow: 0 5px 25px 8px rgba(255, 255, 255, 1);
    transform: scale(1.05);
}
.hover-glow-less:hover {
    box-shadow: 0 0px 15px rgba(255, 255, 255, .7);
    transform: scale(1.05);
}
.fade-in {
    animation: fadeIn 2s ease-in-out;
}
@keyframes fadeIn {
    from { opacity: 0; }
    to { opacity: 1; }
}

.idle-glow {
  box-shadow: 0 0 20px 5px rgba(0, 255, 255, 0.6);
  transition: box-shadow 0.7s ease-in-out;
}

.idle-glow.fadeout {
  box-shadow: 0 0 0px 0px rgba(0, 255, 255, 0);
}

.sr-only {
  position: absolute;
  width: 1px;
  height: 1px;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
}

/* Custom 360-degree rotation for group hover with slower timing */
.group:hover .group-hover\:rotate-360 {
    transform: rotate(360deg);
    transition-duration: 1.5s; /* Adjust this value as needed */
}

.matrix-mode::before {
  content: none; /* remove image overlay */
}

@keyframes glitch {
  0% { transform: translate(0, 0); }
  20% { transform: translate(-1px, 1px); }
  40% { transform: translate(1px, -1px); }
  60% { transform: translate(-1px, 1px); }
  80% { transform: translate(1px, 1px); }
  100% { transform: translate(0, 0); }
}

.matrix-mode #rjlLinkLogo {
  animation: glitch 0.3s infinite;
}

.fade-reveal {
  opacity: 0;
  animation: fadeIn 1s ease-in-out forwards;
}


@keyframes logoPulse {
  0% {
    transform: scale(1);
    opacity: 1;
  }
  50% {
    transform: scale(1.1);
    opacity: 0.85;
  }
  100% {
    transform: scale(1);
    opacity: 1;
  }
}

#logo.pulse {
  animation: logoPulse 0.25s ease;
}


.subheader-glitch {
  position: relative;
  animation: glitchEffect 0.3s linear;
}

@keyframes glitchEffect {
  0% {
    transform: translate(0);
    opacity: 1;
    color: #00ffcc;
    text-shadow: none;
  }
  20% {
    transform: translate(-1px, 1px);
    color: #00ffaa;
    text-shadow: -1px 0 red;
  }
  40% {
    transform: translate(1px, -1px);
    color: #00ffee;
    text-shadow: 1px 0 blue;
  }
  60% {
    transform: translate(-2px, 2px);
    color: #00e6e6;
    text-shadow: -2px 0 lime;
  }
  80% {
    transform: translate(1px, 1px);
    color: #00ffcc;
    text-shadow: 1px 0 cyan;
  }
  100% {
    transform: translate(0);
    color: #00ffcc;
    text-shadow: none;
  }
}


@keyframes glitchText {
  0% {
    text-shadow: 2px 0 red, -2px 0 cyan;
    transform: translate(0, 0);
  }
  15% {
    text-shadow: -2px 2px lime, 2px -2px magenta;
    transform: translate(-2px, 2px);
  }
  30% {
    text-shadow: 3px -1px red, -3px 1px cyan;
    transform: translate(3px, -1px);
  }
  45% {
    text-shadow: -1px 2px lime, 1px -2px magenta;
    transform: translate(-1px, 1px);
  }
  60% {
    text-shadow: 2px -1px red, -2px 1px cyan;
    transform: translate(2px, 1px);
  }
  75% {
    text-shadow: -2px 1px lime, 2px -1px magenta;
    transform: translate(-2px, -1px);
  }
  100% {
    text-shadow: none;
    transform: translate(0, 0);
  }
}

.glitch-active {
  animation: glitchText 1s linear 1;
}

/* New utility classes */
.logo-size {
  max-height: 75px;
}

.footer-link {
  text-decoration: underline;
}

/* Performance optimizations */
.hover-glow {
  will-change: transform, box-shadow;
}

.hover-glow-less {
  will-change: transform, box-shadow;
}

.fade-in {
  will-change: opacity;
}

.matrix-mode #rjlLinkLogo {
  will-change: transform;
}

/* Accessibility: Respect user's motion preferences */
@media (prefers-reduced-motion: reduce) {
  *,
  *::before,
  *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
    scroll-behavior: auto !important;
  }

  /* Disable specific animations */
  .fade-in,
  .fade-reveal,
  .glitch-active,
  .matrix-mode #rjlLinkLogo,
  .subheader-glitch,
  #logo.pulse {
    animation: none !important;
  }

  /* Disable hover effects */
  .hover-glow:hover,
  .hover-glow-less:hover {
    transform: none !important;
    box-shadow: 0 0px 5px rgba(255, 255, 255, 0.3) !important;
  }

  .idle-glow {
    box-shadow: none !important;
    transition: none !important;
  }
}

/* Print Styles */
@media print {
  /* Hide non-essential elements */
  #particles-js,
  #matrixRain,
  .fixed.inset-0.bg-gradient-to-br {
    display: none !important;
  }

  /* Remove backgrounds and shadows */
  body {
    background: white !important;
    color: black !important;
  }

  main {
    box-shadow: none !important;
    background: white !important;
    backdrop-filter: none !important;
  }

  /* Ensure good contrast */
  h1, h2, h3, h4, h5, h6 {
    color: black !important;
    page-break-after: avoid;
  }

  /* Show link URLs */
  a[href^="http"]::after {
    content: " (" attr(href) ")";
    font-size: 0.8em;
    color: #666;
  }

  a[href^="#"]::after {
    content: "";
  }

  /* Avoid page breaks inside elements */
  nav, footer {
    page-break-inside: avoid;
  }

  /* Remove hover effects */
  .hover-glow:hover,
  .hover-glow-less:hover {
    transform: none !important;
    box-shadow: none !important;
  }

  /* Optimize logo for print */
  .logo-size {
    max-width: 150px;
    height: auto;
  }
}