/* ========================================================= SAY IT LAST — HOMEPAGE EXPERIENCE LAB SET 1 OF 3 / FILE 2 OF 4 Version 0.1.0 — August 22, 2026 PURPOSE - Test a calmer homepage motion language without rewriting V6.43. - Add SOFT / PROXIMITY section landing, not hard full-page snapping. - Reduce competing idle animation around T1/T2/T3. - Keep deliberate click/tap behavior and one-time celebrations. - Keep the existing page structure, copy, header and footer untouched. ROLLBACK - Deactivate the "Say It Last — Homepage Experience Lab" plugin. ========================================================= */ /* ------------------------------------------------------ 1. SOFT SECTION LANDING JS adds .sil-home-experience-page only when the SIL homepage experience is actually present. ------------------------------------------------------ */ html.sil-home-experience-page, html.sil-home-experience-page body { scroll-snap-type: y proximity; scroll-padding-top: 118px; } /* Only the major story beats are landing points. Small bridges are intentionally NOT snap points. */ html.sil-home-experience-page #sil-wordpress-preview .intro, html.sil-home-experience-page #sil-wordpress-preview .map-section, html.sil-home-experience-page #sil-wordpress-preview #legacyBridge, html.sil-home-experience-page #sil-wordpress-preview .resources-hero, html.sil-home-experience-page #sil-wordpress-preview .conversion-close { scroll-snap-align: start; scroll-snap-stop: normal; } /* ------------------------------------------------------ 2. ONE QUIET INVITATION LANGUAGE No scale changes here: box-shadow only. That avoids fighting the many existing transform rules in V6.43. ------------------------------------------------------ */ @keyframes silInviteGlowV1 { 0%, 100% { box-shadow: 0 12px 28px rgba(22,63,82,.10), 0 0 0 0 rgba(246,196,107,.16); } 50% { box-shadow: 0 15px 32px rgba(22,63,82,.14), 0 0 0 8px rgba(246,196,107,.035); } } /* Stop prior competing throbber/ring/burp animations. */ #sil-wordpress-preview .journey-throbber, #sil-wordpress-preview .journey-throbber::before, #sil-wordpress-preview .journey-throbber::after, #sil-wordpress-preview .journey-throbber .jt-heart { animation: none !important; } /* Closed = one calm glow. */ #sil-wordpress-preview .mapboard:not(.center-open) #mapCenter.journey-throbber, #sil-wordpress-preview .legacy-bridge:not(.open) #legacySeed.journey-throbber, #sil-wordpress-preview .resources-bridge:not(.open) #resourcesSeed.journey-throbber { animation: silInviteGlowV1 2.65s ease-in-out infinite !important; } /* Open = settled. The check is the confirmation; it does not keep pulsing. */ #sil-wordpress-preview .mapboard.center-open #mapCenter.journey-throbber, #sil-wordpress-preview .legacy-bridge.open #legacySeed.journey-throbber, #sil-wordpress-preview .resources-bridge.open #resourcesSeed.journey-throbber { animation: none !important; } /* The T2 orbit may remain as a quiet static frame, but no spinning. */ #sil-wordpress-preview .legacy-invite-orbit, #sil-wordpress-preview .legacy-invite-orbit::before, #sil-wordpress-preview .legacy-invite-orbit::after { animation: none !important; } #sil-wordpress-preview .legacy-invite-orbit::before, #sil-wordpress-preview .legacy-invite-orbit::after { opacity: .36 !important; } /* Stop constant movement in the handoff connectors. They still visually connect the scenes. */ #sil-wordpress-preview .journey-next-cue::before, #sil-wordpress-preview .experience-bridge-line, #sil-wordpress-preview .legacy-seed-line, #sil-wordpress-preview .resources-seed-line { animation: none !important; } /* Slow the map route dashes once T1 is open. This keeps them alive without looking mechanical. */ #sil-wordpress-preview .mapboard.center-open .routes path { animation-duration: 4.8s !important; } /* ------------------------------------------------------ 3. SOFTER BLOOMS Same reveal concept, less spring / overshoot. Existing stagger delays are preserved. ------------------------------------------------------ */ @keyframes silBloomSoftV1 { 0% { opacity: 0; transform: translateY(9px) scale(.96); } 100% { opacity: 1; transform: translateY(0) scale(1); } } #sil-wordpress-preview .mapboard.center-open .point { animation-name: silBloomSoftV1 !important; animation-duration: .48s !important; animation-timing-function: cubic-bezier(.22,.72,.24,1) !important; animation-fill-mode: both !important; } #sil-wordpress-preview .legacy-bridge.open .screen-bloom { animation-name: silBloomSoftV1 !important; animation-duration: .50s !important; animation-timing-function: cubic-bezier(.22,.72,.24,1) !important; animation-fill-mode: both !important; } /* T3 already uses transitions. Keep the bloom but remove the dramatic tiny-to-full scale feeling. */ #sil-wordpress-preview .resource-link { transform: translate(var(--bloom-x,0), var(--bloom-y,-24px)) scale(.92) !important; transition: opacity .34s ease, transform .48s cubic-bezier(.22,.72,.24,1), box-shadow .20s ease !important; } #sil-wordpress-preview .resources-bridge.open .resource-link { transform: translate(0,0) scale(1) !important; } /* ------------------------------------------------------ 4. WORD FLIPPER — KEEP IT, JUST CALM THE TRAVEL The existing JavaScript still controls phrase timing. ------------------------------------------------------ */ #sil-wordpress-preview .hero-flip { transform: translateY(.14em) !important; transition: opacity .34s ease, transform .34s cubic-bezier(.22,.72,.24,1) !important; } #sil-wordpress-preview .hero-flip.active { transform: translateY(0) !important; } /* ------------------------------------------------------ 5. RESPONSIVE ------------------------------------------------------ */ @media (max-width: 760px) { html.sil-home-experience-page, html.sil-home-experience-page body { scroll-padding-top: 82px; } /* Phone snapping remains proximity-only and therefore never forces a one-screen-at-a-time presentation. */ html.sil-home-experience-page #sil-wordpress-preview .intro, html.sil-home-experience-page #sil-wordpress-preview .map-section, html.sil-home-experience-page #sil-wordpress-preview #legacyBridge, html.sil-home-experience-page #sil-wordpress-preview .resources-hero, html.sil-home-experience-page #sil-wordpress-preview .conversion-close { scroll-snap-align: start; } } /* Accessibility: when motion reduction is requested, keep normal scrolling and static controls. */ @media (prefers-reduced-motion: reduce) { html.sil-home-experience-page, html.sil-home-experience-page body { scroll-snap-type: none !important; } #sil-wordpress-preview .journey-throbber, #sil-wordpress-preview .journey-throbber::before, #sil-wordpress-preview .journey-throbber::after, #sil-wordpress-preview .journey-throbber .jt-heart, #sil-wordpress-preview .routes path, #sil-wordpress-preview .point, #sil-wordpress-preview .screen-bloom, #sil-wordpress-preview .resource-link, #sil-wordpress-preview .hero-flip { animation: none !important; transition: none !important; } }