/* ========================================================================= Women2Women — Subtle animations All motion respects prefers-reduced-motion for accessibility. IMPORTANT (progressive enhancement): the scroll-reveal opacity/transform state below is scoped to `html.js` only. The `js` class is added by a tiny inline script in the very first line of in header.php, before anything else renders. If JavaScript is disabled, blocked, or fails to execute for any reason, `html.js` is never added, so `.fade-in-section` simply keeps the `opacity: 1` default from main.css and all homepage content is visible immediately — it never silently depends on main.js's IntersectionObserver to reveal content that would otherwise stay hidden forever (every homepage section carries this class). ========================================================================= */ @media (prefers-reduced-motion: no-preference) { html.js .fade-in-section { opacity: 0; transform: translateY(24px); transition: opacity 0.7s ease, transform 0.7s ease; } html.js .fade-in-section.is-visible { opacity: 1; transform: translateY(0); } .hero-decor-heart { animation: w2w-float 4s ease-in-out infinite; } .heart-2 { animation-delay: 1.2s; } .hero-decor-circle { animation: w2w-float 5s ease-in-out infinite; } .circle-2 { animation-delay: 0.8s; } @keyframes w2w-float { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-12px); } } .cta-heart { animation: w2w-pulse 3.5s ease-in-out infinite; } .cta-heart-2 { animation-delay: 1s; } .cta-heart-3 { animation-delay: 2s; } @keyframes w2w-pulse { 0%, 100% { transform: scale(1); opacity: 0.15; } 50% { transform: scale(1.15); opacity: 0.28; } } } @media (prefers-reduced-motion: reduce) { html.js .fade-in-section, .hero-decor-heart, .hero-decor-circle, .cta-heart { animation: none !important; opacity: 1 !important; transform: none !important; transition: none !important; } } /* Non-motion, purely visual hover states stay active regardless of reduced motion since they are user-triggered, not ambient/looping. */