/* Iteration 01: shared palette, explicit actions, shorter exploration. */
:root{--blue:var(--ec-electric);--ink:var(--ec-ink);--peach:var(--ec-peach);--lilac:var(--ec-ice);--white:var(--ec-cloud)}
.flavor-story{height:280svh}.motion-brand{border:0!important;padding:0!important}.motion-brand img{width:70px;height:52px;object-fit:contain;filter:brightness(0) saturate(100%);opacity:.82}.motion-top{align-items:center;top:14px}.motion-tabs button{min-height:44px;font-size:12px}.motion-arrows button{height:44px;width:44px}.motion-purchase>small{font-size:11px}.motion-purchase .button{font-size:13px;min-height:46px}.motion-copy p{font-size:14px}.motion-copy .motion-formula{font-size:10px}.motion-copy .eyebrow{font-size:10px}.flavor-card:before{border-radius:0;inset:55% 0 0;mask:url('assets/cloud-cut.svg') center top/100% 100% no-repeat;-webkit-mask:url('assets/cloud-cut.svg') center top/100% 100% no-repeat}.raspberry{--flavor:var(--ec-blue-raspberry)}.peach-card{--flavor:var(--ec-peach)}.mango{--flavor:var(--ec-mango-limeade)}.guava{--flavor:var(--ec-strawberry-guava)}.flavor-select select{min-height:46px;font-size:14px}.order-summary p{font-size:12px}.mix-feedback{padding:12px 14px;background:#e4e3ff;color:var(--ec-ink);font-size:12px;border-radius:10px;margin-top:14px}.mix-feedback[hidden]{display:none}.guide-return{display:inline-block;margin-top:25px;font-size:12px}.pack-views button{min-height:44px}.quantity{min-height:78px}
@media(max-width:700px){.flavor-story{height:230svh}.motion-stage{min-height:740px}.motion-brand img{height:40px;width:55px}.motion-copy{bottom:28%;width:61%}.motion-copy .eyebrow{font-size:8px}.motion-copy p{font-size:12px;max-width:200px}.motion-copy .motion-formula{font-size:8px}.motion-purchase{bottom:17%;right:5%;left:5%;align-items:flex-end}.motion-purchase>span{font-size:17px}.motion-purchase .button{font-size:12px;padding:12px 17px;max-width:100%}.motion-purchase>small{font-size:9px}.motion-bottom{bottom:18px}.motion-tabs{gap:0 10px}.motion-tabs button{font-size:9px;min-height:38px}.motion-arrows button{width:40px;height:40px}.motion-copy h1{font-size:26px}.pack-actor{top:39%;width:min(42vw,190px)}.flavor-word{top:10%;font-size:17vw}.motion-progress{height:4px}}
@media(prefers-reduced-motion:reduce){.flavor-story{height:auto}}