/* Kitchen Time: spice drawings and their entrance motion (hero, About story, product page). */
@keyframes kt-spin { to { transform: rotate(360deg); } }
@keyframes kt-pop { from { opacity: 0; transform: translate3d(var(--px, 0), var(--py, 0), 0) scale(.6); } to { opacity: 1; transform: translate3d(var(--px, 0), var(--py, 0), 0) scale(1); } }
.kt-bit { position: absolute; width: var(--w, 16%); transform: translate3d(var(--px, 0), var(--py, 0), 0) rotate(var(--r, 0deg)); filter: drop-shadow(0 18px 14px rgba(40, 0, 8, .45)); animation: kt-drop 1.1s var(--ease) both; animation-delay: var(--ad, .8s); }
.kt-bit svg { width: 100%; height: auto; }
@keyframes kt-drop { from { opacity: 0; transform: translate3d(var(--px, 0), calc(var(--py, 0px) - 60px), 0) rotate(calc(var(--r, 0deg) - 40deg)) scale(.5); } to { opacity: 1; transform: translate3d(var(--px, 0), var(--py, 0), 0) rotate(var(--r, 0deg)); } }
.kt-bit--a { --w: 20%; left: 2%; top: 12%; --ad: .75s; }
.kt-bit--b { --w: 17%; right: 4%; top: 64%; --ad: .95s; }
.kt-bit--c { --w: 17%; right: 7%; top: 5%; --ad: .85s; }
.kt-bit--d { --w: 14%; left: 14%; bottom: 8%; --ad: 1.05s; }
.kt-bit--e { --w: 14%; left: -1%; top: 52%; --ad: 1s; }
.kt-bit--f { --w: 16%; right: 26%; bottom: 0; --ad: 1.1s; }
.kt-bit--g { --w: 24%; left: 38%; bottom: -3%; --ad: 1.15s; z-index: 2; }
.kt-bit--h { --w: 6%; left: 30%; top: 4%; --ad: 1.2s; }
.kt-bit--i { --w: 5%; right: 30%; top: 20%; --ad: 1.25s; }
.kt-bit--j { --w: 9%; right: 0; top: 40%; --ad: 1.3s; }
.kt-bit--k { --w: 8%; left: 8%; top: 38%; --ad: 1.35s; }