:root {
  --ari-blue: 59 130 246;
  --ari-green: 34 197 94;
  --ink: 15 23 42;
}

/* Science-themed hero background */
.lab-bg {
  background:
    radial-gradient(ellipse 900px 600px at 10% 20%, rgba(var(--ari-blue), .08), transparent),
    radial-gradient(ellipse 700px 500px at 90% 70%, rgba(var(--ari-green), .06), transparent),
    linear-gradient(180deg, #ffffff, #fafbfc);
  position: relative;
}

/* Subtle grid pattern */
.lab-bg::before {
  content: '';
  position: absolute;
  inset: 0;
  background-image:
    linear-gradient(rgba(15,23,42,.03) 1px, transparent 1px),
    linear-gradient(90deg, rgba(15,23,42,.03) 1px, transparent 1px);
  background-size: 40px 40px;
  mask-image: radial-gradient(ellipse 70% 60% at 50% 40%, black 30%, transparent 70%);
  -webkit-mask-image: radial-gradient(ellipse 70% 60% at 50% 40%, black 30%, transparent 70%);
  pointer-events: none;
}

/* Gradient text effect */
.gradient-text {
  background: linear-gradient(135deg, rgb(var(--ari-blue)), rgb(var(--ari-green)));
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
}

/* Primary button */
.btn-primary {
  background: linear-gradient(135deg, rgb(var(--ari-blue)), rgb(var(--ari-green)));
  transition: all 0.2s ease;
}

.btn-primary:hover {
  filter: brightness(1.05);
  transform: translateY(-1px);
}

/* Smooth scroll */
html {
  scroll-behavior: smooth;
}

/* Focus states */
a:focus-visible,
button:focus-visible,
input:focus-visible,
select:focus-visible {
  outline: 2px solid rgb(var(--ari-blue));
  outline-offset: 2px;
}

/* FAQ accordion */
.faq-panel {
  transition: all 0.2s ease;
}

.faq-icon {
  transition: transform 0.2s ease;
}

/* Mobile menu animation */
#mobileMenu:not(.hidden) {
  animation: slideDown 0.2s ease-out;
}

@keyframes slideDown {
  from {
    opacity: 0;
    transform: translateY(-8px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

/* Reduced motion */
@media (prefers-reduced-motion: reduce) {
  *,
  *::before,
  *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
  }
  
  html {
    scroll-behavior: auto;
  }
}

/* Selection color */
::selection {
  background: rgba(var(--ari-blue), 0.2);
}