/* Ambient effects are only emitted on the home hero. The treatment and emoji
   rules below use the existing data/classes so every built-in preset benefits. */
.hero--seasonal-effects { position: relative; overflow: hidden; isolation: isolate; }
.hero--seasonal-effects .hero-grid { position: relative; z-index: 2; }
.home-seasonal-effects { position: absolute; z-index: 1; inset: 0; overflow: hidden; pointer-events: none; }
.home-seasonal-effects__particle { position: absolute; left: var(--x); top: var(--y); color: var(--seasonal-sparkle, var(--orange)); font: 700 var(--size)/1 Georgia, serif; opacity: 0; text-shadow: 0 0 10px color-mix(in srgb, currentColor 76%, transparent); will-change: transform, opacity; }
.home-seasonal-effects__particle--breeze { animation: jla-seasonal-breeze var(--duration) ease-in-out var(--delay) infinite both; }
.home-seasonal-effects__particle--snow { color: #fff; animation: jla-seasonal-snow var(--duration) linear var(--delay) infinite both; }

.home-seasonal-effects--launch { --seasonal-sparkle: color-mix(in srgb, var(--orange) 82%, #fff); }
.home-seasonal-effects--new-year, .home-seasonal-effects--anniversary { --seasonal-sparkle: #f6d878; }
.home-seasonal-effects--valentines, .home-seasonal-effects--mothers-day { --seasonal-sparkle: #ffb5d0; }
.home-seasonal-effects--st-patricks, .home-seasonal-effects--earth-day { --seasonal-sparkle: #9be08a; }
.home-seasonal-effects--easter { --seasonal-sparkle: #f8d7ef; }
.home-seasonal-effects--pride { --seasonal-sparkle: #ffd36f; }
.home-seasonal-effects--fathers-day { --seasonal-sparkle: #bcecff; }
.home-seasonal-effects--summer { --seasonal-sparkle: #ffe07c; }
.home-seasonal-effects--halloween { --seasonal-sparkle: #ffb451; }
.home-seasonal-effects--black-friday { --seasonal-sparkle: #ff8a71; }
.home-seasonal-effects--tabletop-gaming { --seasonal-sparkle: #d4b1ff; }

.home-seasonal-effects__gift-stack { position: absolute; bottom: 20px; left: var(--gift-x); width: 38px; height: 29px; border-radius: 3px; background: linear-gradient(90deg, transparent 43%, #f8df87 44% 56%, transparent 57%), linear-gradient(#cf4a45 0 38%, #b62f38 39%); box-shadow: 0 7px 19px rgb(0 0 0 / 23%); animation: jla-seasonal-gift 4.6s ease-in-out var(--gift-delay) infinite; }
.home-seasonal-effects__gift-stack::before { position: absolute; right: -8px; bottom: 1px; width: 25px; height: 20px; border-radius: 3px; background: linear-gradient(90deg, transparent 43%, #f8df87 44% 56%, transparent 57%), linear-gradient(#4c8e65 0 38%, #2e6e4d 39%); box-shadow: 0 5px 14px rgb(0 0 0 / 18%); content: ""; }
.home-seasonal-effects__gift-stack::after { position: absolute; top: -6px; left: 12px; width: 13px; height: 8px; border: 2px solid #f8df87; border-bottom: 0; border-radius: 12px 12px 0 0; content: ""; }

.home-seasonal-effects__firework { position: absolute; left: var(--firework-x); top: var(--firework-y); width: 1px; height: 1px; animation: jla-seasonal-firework 5.8s ease-out var(--firework-delay) infinite; }
.home-seasonal-effects__firework i { position: absolute; width: 3px; height: 28px; border-radius: 999px; background: linear-gradient(#fff7bb, #ff8b4a 56%, transparent); transform: rotate(var(--ray)) translateY(-18px) scaleY(.18); transform-origin: 50% 100%; opacity: 0; box-shadow: 0 0 8px #ffca6e; animation: jla-seasonal-firework-ray 5.8s ease-out var(--firework-delay) infinite; }
.home-seasonal-effects__firework i:nth-child(3n) { background: linear-gradient(#d6f7ff, #6db5ff 56%, transparent); box-shadow: 0 0 8px #76c3ff; }
.home-seasonal-effects__firework i:nth-child(4n) { background: linear-gradient(#ffe4f1, #ff74b6 56%, transparent); box-shadow: 0 0 8px #ff7ac1; }

@keyframes jla-seasonal-breeze { 0% { transform: translate3d(-8vw, 9px, 0) rotate(-8deg) scale(.72); opacity: 0; } 12%, 80% { opacity: .78; } 52% { transform: translate3d(11vw, -11px, 0) rotate(18deg) scale(1); } 100% { transform: translate3d(29vw, 7px, 0) rotate(34deg) scale(.75); opacity: 0; } }
@keyframes jla-seasonal-snow { 0% { transform: translate3d(0, -20vh, 0) rotate(0); opacity: 0; } 9% { opacity: .92; } 88% { opacity: .86; } 100% { transform: translate3d(7vw, 115vh, 0) rotate(300deg); opacity: 0; } }
@keyframes jla-seasonal-gift { 0%, 100% { transform: translateY(0) rotate(-2deg); } 50% { transform: translateY(-4px) rotate(2deg); } }
@keyframes jla-seasonal-firework { 0%, 17%, 100% { opacity: 0; transform: scale(.2); } 22%, 46% { opacity: 1; transform: scale(1); } 62% { opacity: 0; transform: scale(1.16); } }
@keyframes jla-seasonal-firework-ray { 0%, 20%, 100% { opacity: 0; transform: rotate(var(--ray)) translateY(-18px) scaleY(.15); } 25% { opacity: 1; } 56% { opacity: 0; transform: rotate(var(--ray)) translateY(-46px) scaleY(1.15); } }

/* Subtle movement for the marks already attached to the brand and service artwork. */
.home-content-seasonal-mark { animation: jla-home-mark-twinkle 3.8s ease-in-out infinite; transform-origin: 70% 65%; }
.brand-mark--image .home-content-seasonal-mark { animation-name: jla-home-brand-image-twinkle; }
.service-icon--image .home-content-seasonal-mark { animation-name: jla-home-service-image-twinkle; }
.brand-mark--treatment-summer .home-content-seasonal-mark, .service-icon--treatment-summer .home-content-seasonal-mark, .brand-mark--treatment-earth-day .home-content-seasonal-mark, .service-icon--treatment-earth-day .home-content-seasonal-mark { animation-name: jla-home-mark-spin; animation-duration: 10s; animation-timing-function: linear; }
.brand-mark--treatment-bonfire-night .home-content-seasonal-mark, .service-icon--treatment-bonfire-night .home-content-seasonal-mark, .brand-mark--treatment-new-year .home-content-seasonal-mark, .service-icon--treatment-new-year .home-content-seasonal-mark, .brand-mark--treatment-anniversary .home-content-seasonal-mark, .service-icon--treatment-anniversary .home-content-seasonal-mark { animation-name: jla-home-mark-sparkle; animation-duration: 2.6s; }
.brand-mark--treatment-christmas .home-content-seasonal-mark, .service-icon--treatment-christmas .home-content-seasonal-mark, .brand-mark--treatment-easter .home-content-seasonal-mark, .service-icon--treatment-easter .home-content-seasonal-mark { animation-name: jla-home-mark-gift; }
.brand-mark--treatment-tabletop-gaming .home-content-seasonal-mark, .service-icon--treatment-tabletop-gaming .home-content-seasonal-mark { animation-name: jla-home-mark-dice; animation-duration: 4.8s; }
@keyframes jla-home-mark-twinkle { 0%, 100% { filter: drop-shadow(0 0 0 transparent); } 50% { filter: drop-shadow(0 0 5px color-mix(in srgb, var(--orange) 68%, transparent)); } }
@keyframes jla-home-brand-image-twinkle { 0%, 100% { transform: scale(.72); filter: drop-shadow(0 0 0 transparent); } 50% { transform: scale(.78); filter: drop-shadow(0 0 5px color-mix(in srgb, var(--orange) 70%, transparent)); } }
@keyframes jla-home-service-image-twinkle { 0%, 100% { transform: scale(.9); filter: drop-shadow(0 0 0 transparent); } 50% { transform: scale(.96); filter: drop-shadow(0 0 5px color-mix(in srgb, var(--orange) 70%, transparent)); } }
@keyframes jla-home-mark-spin { to { transform: rotate(360deg); } }
@keyframes jla-home-mark-sparkle { 0%, 100% { filter: brightness(1) drop-shadow(0 0 0 transparent); } 50% { filter: brightness(1.4) drop-shadow(0 0 8px currentColor); } }
@keyframes jla-home-mark-gift { 0%, 100% { transform: rotate(11deg) translateY(0); } 50% { transform: rotate(5deg) translateY(-3px); } }
@keyframes jla-home-mark-dice { 0%, 100% { transform: rotate(0); } 50% { transform: rotate(10deg) scale(1.06); } }

/* Seasonal packs stay polished in the conversation picker without being distracting. */
html[data-jla-emoji-pack] .conversation-emoji[data-emoji="sparkle"], html[data-jla-emoji-pack] .conversation-emoji[data-emoji="star"], html[data-jla-emoji-pack] .conversation-emoji[data-emoji="fireworks"], html[data-jla-emoji-pack] .conversation-emoji[data-emoji="snowflake"] { animation: jla-emoji-twinkle 2.9s ease-in-out infinite; transform-origin: 50% 50%; }
html[data-jla-emoji-pack="bonfire-night"] .conversation-emoji[data-emoji="fireworks"], html[data-jla-emoji-pack="new-year"] .conversation-emoji[data-emoji="fireworks"] { animation-name: jla-emoji-firework; }
html[data-jla-emoji-pack="christmas"] .conversation-emoji[data-emoji="snowflake"] { --jla-emoji-face: #fff; --jla-emoji-accent: #fff; --jla-emoji-ink: color-mix(in srgb, var(--teal) 80%, #fff); }
html[data-jla-emoji-pack="winter-sale"] .conversation-emoji[data-emoji="snowflake"] { --jla-emoji-accent: #e7f8ff; }
html[data-jla-emoji-pack="summer"] .conversation-emoji[data-emoji="sun"] { animation: jla-emoji-rotate 11s linear infinite; transform-origin: 50% 50%; }
html[data-jla-emoji-pack="earth-day"] .conversation-emoji[data-emoji="globe"], html[data-jla-emoji-pack="tabletop-gaming"] .conversation-emoji[data-emoji="dice"] { animation: jla-emoji-rotate 9s ease-in-out infinite; transform-origin: 50% 50%; }
html[data-jla-emoji-pack="valentines"] .conversation-emoji[data-emoji="heart"], html[data-jla-emoji-pack="mothers-day"] .conversation-emoji[data-emoji="flower"] { animation: jla-emoji-pulse 2.8s ease-in-out infinite; transform-origin: 50% 50%; }
html[data-jla-emoji-pack="launch"] .conversation-emoji[data-emoji="orbit"], html[data-jla-emoji-pack="launch"] .conversation-emoji[data-emoji="flare"], html[data-jla-emoji-pack="st-patricks"] .conversation-emoji[data-emoji="clover"], html[data-jla-emoji-pack="easter"] .conversation-emoji[data-emoji="egg"], html[data-jla-emoji-pack="pride"] .conversation-emoji[data-emoji="rainbow"], html[data-jla-emoji-pack="halloween"] .conversation-emoji[data-emoji="pumpkin"], html[data-jla-emoji-pack="black-friday"] .conversation-emoji[data-emoji="bolt"] { animation: jla-emoji-float 3.4s ease-in-out infinite; transform-origin: 50% 50%; }
html[data-jla-emoji-pack="launch"] .conversation-emoji[data-emoji="grid"], html[data-jla-emoji-pack="mothers-day"] .conversation-emoji[data-emoji="gift"], html[data-jla-emoji-pack="earth-day"] .conversation-emoji[data-emoji="leaf"], html[data-jla-emoji-pack="fathers-day"] .conversation-emoji[data-emoji="tool"], html[data-jla-emoji-pack="halloween"] .conversation-emoji[data-emoji="moon"], html[data-jla-emoji-pack="bonfire-night"] .conversation-emoji[data-emoji="bonfire"], html[data-jla-emoji-pack="pride"] .conversation-emoji[data-emoji="confetti"], html[data-jla-emoji-pack="anniversary"] .conversation-emoji[data-emoji="confetti"] { animation: jla-emoji-twinkle 3.2s ease-in-out infinite; transform-origin: 50% 50%; }
@keyframes jla-emoji-twinkle { 0%, 100% { filter: drop-shadow(0 0 0 transparent); transform: scale(1); } 50% { filter: drop-shadow(0 0 5px var(--jla-emoji-accent)); transform: scale(1.08); } }
@keyframes jla-emoji-firework { 0%, 100% { filter: drop-shadow(0 0 0 transparent); transform: scale(.88) rotate(-7deg); } 45% { filter: drop-shadow(0 0 7px var(--jla-emoji-accent)); transform: scale(1.13) rotate(7deg); } }
@keyframes jla-emoji-rotate { 50% { transform: rotate(180deg); } 100% { transform: rotate(360deg); } }
@keyframes jla-emoji-pulse { 0%, 100% { transform: scale(1); } 50% { transform: scale(1.1); } }
@keyframes jla-emoji-float { 0%, 100% { transform: translateY(0) rotate(-3deg); } 50% { transform: translateY(-2px) rotate(4deg); } }

@media (max-width: 700px) { .home-seasonal-effects__particle:nth-child(n + 19) { display: none; } .home-seasonal-effects__gift-stack { transform: scale(.78); transform-origin: bottom center; } .home-seasonal-effects__firework:nth-child(n + 4) { display: none; } }
@media (prefers-reduced-motion: reduce) { .home-seasonal-effects { display: none; } .home-content-seasonal-mark, html[data-jla-emoji-pack] .conversation-emoji { animation: none !important; } }
