/* ========================================================= AIRVENOR — Animations Professional Aviation Website ========================================================= */ /* --------------------------------------------------------- HERO FLOAT --------------------------------------------------------- */ @keyframes airvenorFloat { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-10px); } } .hero-card { animation: airvenorFloat 6s ease-in-out infinite; will-change: transform; } /* --------------------------------------------------------- BUTTON GLOW --------------------------------------------------------- */ @keyframes airvenorPulseGlow { 0%, 100% { box-shadow: 0 8px 24px rgba(29, 161, 242, 0.12); } 50% { box-shadow: 0 8px 30px rgba(29, 161, 242, 0.30); } } .button-primary { animation: airvenorPulseGlow 2.8s ease-in-out infinite; } /* --------------------------------------------------------- REVEAL --------------------------------------------------------- */ /* * Elements are visible by default. * * JavaScript adds .js-enabled to . * Only then are reveal elements initially hidden. */ .reveal { opacity: 1; transform: translateY(0); } .js-enabled .reveal { opacity: 0; transform: translateY(20px); transition: opacity 0.65s ease, transform 0.65s ease; will-change: opacity, transform; } .js-enabled .reveal.is-visible { opacity: 1; transform: translateY(0); } /* --------------------------------------------------------- STAGGER --------------------------------------------------------- */ .js-enabled .card-grid .reveal:nth-child(1) { transition-delay: 0ms; } .js-enabled .card-grid .reveal:nth-child(2) { transition-delay: 80ms; } .js-enabled .card-grid .reveal:nth-child(3) { transition-delay: 160ms; } .js-enabled .card-grid .reveal:nth-child(4) { transition-delay: 240ms; } .js-enabled .brand-pill-row .reveal:nth-child(1) { transition-delay: 0ms; } .js-enabled .brand-pill-row .reveal:nth-child(2) { transition-delay: 80ms; } .js-enabled .brand-pill-row .reveal:nth-child(3) { transition-delay: 160ms; } .js-enabled .brand-pill-row .reveal:nth-child(4) { transition-delay: 240ms; } /* --------------------------------------------------------- HOVER GLOW --------------------------------------------------------- */ @keyframes airvenorSoftGlow { 0%, 100% { box-shadow: var(--shadow-sm); } 50% { box-shadow: var(--shadow-glow); } } .brand-mark:hover { animation: airvenorSoftGlow 2s ease-in-out infinite; } /* --------------------------------------------------------- MOBILE PERFORMANCE --------------------------------------------------------- */ @media (max-width: 760px) { /* * Reduce the amount of continuous animation on mobile. * This keeps scrolling smoother on lower-end devices. */ .hero-card { animation-duration: 7s; } .button-primary { animation-duration: 3.2s; } } /* --------------------------------------------------------- REDUCED MOTION --------------------------------------------------------- */ @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; } .reveal, .js-enabled .reveal, .js-enabled .reveal.is-visible { opacity: 1 !important; transform: none !important; } }