/* Smooth scroll behavior */
html {
scroll-behavior: smooth;
}
/* Reveal on scroll */
.reveal {
opacity: 0;
transform: translateY(16px);
transition: opacity .7s ease, transform .7s ease;
}
.reveal.visible {
opacity: 1;
transform: translateY(0);
}
/* Blob animations */
.blob {
animation: float 16s ease-in-out infinite;
}
.blob-fuchsia {
animation-duration: 20s;
}
.blob-spin {
animation: spin 40s linear infinite;
}
@keyframes float {
0% { transform: translateY(0) translateX(0); }
50% { transform: translateY(-24px) translateX(16px); }
100% { transform: translateY(0) translateX(0); }
}
@keyframes spin {
0% { transform: translateX(-50%) rotate(0deg); }
100% { transform: translateX(-50%) rotate(360deg); }
}
/* Optional: Reduce motion preference */
@media (prefers-reduced-motion: reduce) {
.reveal, .blob, .blob-fuchsia, .blob-spin {
animation: none !important;
transition: none !important;
opacity: 1 !important;
transform: none !important;
}
}
/* Simple prose styling for modal content */
.prose h4 {
margin: 1rem 0 .5rem;
font-weight: 600;
}
.prose p {
margin: .5rem 0;
color: #374151;
}
.prose ul {
margin: .5rem 0 .5rem 1.25rem;
color: #374151;
}