/* Removlo global styles — Tailwind utilities come from app/assets/builds/tailwind.css */ body { font-family: "Inter", ui-sans-serif, system-ui, sans-serif; } ::selection { background-color: #c7d2fe; color: #312e81; } html { scroll-padding-top: 5rem; --cursor-x: 50vw; --cursor-y: 30vh; } .cursor-glow { background: radial-gradient(560px circle at var(--cursor-x) var(--cursor-y), rgba(99, 102, 241, 0.13), transparent 45%), radial-gradient(420px circle at calc(var(--cursor-x) + 12rem) calc(var(--cursor-y) + 8rem), rgba(14, 165, 233, 0.1), transparent 45%); transition: opacity 0.25s ease; } .soft-shine { position: relative; overflow: hidden; } .soft-shine::after { content: ""; position: absolute; inset: -40% -70%; pointer-events: none; background: linear-gradient(105deg, transparent 42%, rgba(255, 255, 255, 0.55), transparent 58%); transform: translateX(-55%) rotate(8deg); transition: transform 0.9s cubic-bezier(0.16, 1, 0.3, 1); } .soft-shine:hover::after { transform: translateX(55%) rotate(8deg); } .route-marquee { animation: route-marquee 22s linear infinite; } .float-slow { animation: float-slow 7s ease-in-out infinite; } .float-slower { animation: float-slow 9s ease-in-out infinite reverse; } @keyframes route-marquee { from { transform: translateX(0); } to { transform: translateX(-50%); } } @keyframes float-slow { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-10px); } } /* Scroll-reveal (enabled only when JS adds .js to ) */ .js .reveal { opacity: 0; transform: translateY(26px); transition: opacity 0.7s cubic-bezier(0.16, 1, 0.3, 1), transform 0.7s cubic-bezier(0.16, 1, 0.3, 1); } .js .reveal.is-visible { opacity: 1; transform: none; } @media (prefers-reduced-motion: reduce) { .js .reveal { opacity: 1 !important; transform: none !important; transition: none !important; } .animate-pulse, .animate-ping, .route-marquee, .float-slow, .float-slower { animation: none !important; } html { scroll-behavior: auto !important; } }