/**
 * 99SEEDS flower mascot: pivots and motion presets for the inline SVG from
 * inc/seeds-brand-art.php. Add classes to the <svg class="seeds-mascot">:
 *   seeds-mascot--bloom  unfold once (page load or when the class is added)
 *   seeds-mascot--alive  calm loop: petal sway, twinkling sparkles, drifting confetti
 *   seeds-mascot--spin   petals turn one step on hover of the surrounding link/button (or .is-spun)
 * Bloom easing can be swapped with --m-ease on the svg or an ancestor.
 * Hooks for custom motion: .seeds-mascot__petals/__petal/__head/__face/__eye/__mouth/__cheek/__sparkle/__bit,
 * each repeated element carries --i (0…n) for staggering.
 */
/* ---------- Mascot: pivots, blink and opt-in motion ----------
 * Parts with an outline exist twice (ink layer + fill layer) with the same class and --i,
 * so every rule below moves both copies together. Local 0 0 is the face centre for petals,
 * head and face, and the own centre for bits and sparkles. Entrance effects animate
 * `transform`, loops animate `rotate`/`scale`, so both can run on one element.
 */
.seeds-mascot { overflow: visible; }
.seeds-mascot__petals, .seeds-mascot__petal, .seeds-mascot__face, .seeds-mascot__head, .seeds-mascot__bit, .seeds-mascot__sparkle { transform-origin: 0 0; }
.seeds-mascot__eye, .seeds-mascot__wink, .seeds-mascot__mouth { transform-box: fill-box; transform-origin: center; }
.seeds-mascot .seeds-mascot__eye { animation: s-blink 5.4s infinite; animation-delay: calc(var(--i, 0) * .04s); }
@keyframes s-blink { 0%, 93%, 100% { transform: scaleY(1); } 95.5% { transform: scaleY(.08); } }

/* Bloom: the flower unfolds once — face pops, petals fan out, eyes open, grin, sparkles, confetti. */
.seeds-mascot--bloom :is(.seeds-mascot__head, .seeds-mascot__ink .seeds-mascot__face) { animation: s-m-pop .62s var(--m-ease, cubic-bezier(.34, 1.56, .64, 1)) both; }
.seeds-mascot--bloom .seeds-mascot__petal { animation: s-m-petal .56s var(--m-ease, cubic-bezier(.34, 1.56, .64, 1)) both; animation-delay: calc(.12s + var(--i) * .06s); }
.seeds-mascot--bloom .seeds-mascot__eye { animation: s-m-eye .34s var(--m-ease, cubic-bezier(.34, 1.56, .64, 1)) both, s-blink 5.4s 1.6s infinite; animation-delay: calc(.46s + var(--i) * .07s), 1.6s; }
.seeds-mascot--bloom .seeds-mascot__wink { animation: s-m-eye .34s .6s var(--m-ease, cubic-bezier(.34, 1.56, .64, 1)) both; }
.seeds-mascot--bloom .seeds-mascot__mouth { animation: s-m-grin .4s .62s var(--m-ease, cubic-bezier(.34, 1.56, .64, 1)) both; }
.seeds-mascot--bloom .seeds-mascot__sparkle { animation: s-m-spark .5s var(--m-ease, cubic-bezier(.34, 1.56, .64, 1)) both; animation-delay: calc(.7s + var(--i) * .05s); }
.seeds-mascot--bloom .seeds-mascot__bit { animation: s-m-bit .46s var(--m-ease, cubic-bezier(.34, 1.56, .64, 1)) both; animation-delay: calc(.6s + var(--i) * .045s); }
@keyframes s-m-pop { from { transform: scale(.15); } }
@keyframes s-m-petal { from { transform: scale(.3) rotate(-24deg); } }
@keyframes s-m-eye { from { transform: scaleY(0); } }
@keyframes s-m-grin { from { transform: scale(.2, 0); } }
@keyframes s-m-spark { from { transform: scale(0) rotate(-90deg); } }
@keyframes s-m-bit { from { transform: scale(0) rotate(-45deg); } }

/* Alive: slow petal sway, twinkling sparkles, drifting confetti; the face stays upright. Loops only, safe to combine with bloom. */
.seeds-mascot--alive .seeds-mascot__petals { animation: s-m-sway 7s ease-in-out infinite; }
.seeds-mascot--alive .seeds-mascot__sparkle { animation: s-m-twinkle 2.6s ease-in-out infinite; animation-delay: calc(var(--i) * -.43s); }
.seeds-mascot--alive .seeds-mascot__bit { animation: s-m-drift 4.8s ease-in-out infinite; animation-delay: calc(var(--i) * -.4s); }
.seeds-mascot--alive.seeds-mascot--bloom .seeds-mascot__sparkle { animation: s-m-spark .5s var(--m-ease, cubic-bezier(.34, 1.56, .64, 1)) both, s-m-twinkle 2.6s ease-in-out infinite; animation-delay: calc(.7s + var(--i) * .05s), calc(var(--i) * -.43s); }
.seeds-mascot--alive.seeds-mascot--bloom .seeds-mascot__bit { animation: s-m-bit .46s var(--m-ease, cubic-bezier(.34, 1.56, .64, 1)) both, s-m-drift 4.8s ease-in-out infinite; animation-delay: calc(.6s + var(--i) * .045s), calc(var(--i) * -.4s); }
@keyframes s-m-sway { 0%, 100% { rotate: -4deg; } 50% { rotate: 4deg; } }
@keyframes s-m-twinkle { 0%, 100% { scale: 1; } 50% { scale: .55; } }
@keyframes s-m-drift { 0%, 100% { rotate: -10deg; scale: 1; } 50% { rotate: 10deg; scale: .9; } }

/* Spin: petals turn one step (six petals, so 60° lands seamlessly) — e.g. on logo hover. The face stays upright. */
.seeds-mascot--spin .seeds-mascot__petals { transition: transform .8s cubic-bezier(.34, 1.56, .64, 1); }
:is(a, button):hover .seeds-mascot--spin .seeds-mascot__petals, .seeds-mascot--spin.is-spun .seeds-mascot__petals { transform: rotate(60deg); }

@media (prefers-reduced-motion: reduce) {
	.seeds-mascot, .seeds-mascot * { animation: none !important; transition: none !important; }
}