/* 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; }