/* One illustrated story, one shared timeline. No video or animation library. */
.film-chapters>button{font-size:8px;color:#93978a;white-space:nowrap;border:0;background:transparent;padding:6px 0;cursor:pointer}.motion-off .film-chapters>button{cursor:default}
.journey-hero{height:calc(100svh - 100px);min-height:650px;max-height:950px;grid-template-columns:1fr 1.1fr;align-items:center;padding:20px 9% 55px;gap:4%}
.journey-copy{padding-bottom:30px;position:relative;z-index:2}.journey-hero h1{font-size:clamp(55px,5.8vw,88px);line-height:1.08;letter-spacing:-4px;margin:28px 0 35px;max-width:600px}.journey-hero h1 em{white-space:nowrap}.journey-copy .button{gap:60px;font-size:12px;padding:17px 20px}.order-film{--cycle:15s;width:100%;max-width:510px;position:relative;justify-self:center;isolation:isolate}.film-glow{position:absolute;inset:5% -20%;background:radial-gradient(ellipse,#e9d9bd65,transparent 67%);z-index:-1}.journey-svg{display:block;width:100%;overflow:visible;font-family:var(--body)}.svg-tiny{font-size:9px}.svg-micro{font-size:6px;letter-spacing:.7px;font-weight:700}.svg-brand{font:700 31px var(--font);letter-spacing:-3px}.svg-heading{font:500 17px var(--font);letter-spacing:-.7px}.svg-product{font:600 15px var(--font);letter-spacing:-.4px}.svg-button{font-size:11px;font-weight:600;fill:#fffdf6}.success-title{font:500 31px var(--font);fill:#34462c;letter-spacing:-1px}.success-subtitle{font-size:12px;fill:#818672}.order-scene{transform-origin:260px 280px;animation:order-scene var(--cycle) infinite both cubic-bezier(.4,0,.2,1)}.order-device{transform-origin:260px 280px;animation:device-drift var(--cycle) infinite both ease-in-out}.delivery-scene{opacity:0;transform-origin:260px 280px;animation:delivery-scene var(--cycle) infinite both cubic-bezier(.4,0,.2,1)}.complete-scene{opacity:0;transform-origin:260px 280px;animation:complete-scene var(--cycle) infinite both cubic-bezier(.2,.75,.25,1)}.tap-pointer{opacity:0;animation:order-tap var(--cycle) infinite both ease-in-out}.added-badge{opacity:0;animation:added var(--cycle) infinite both}.order-cart{opacity:0;animation:cart-in var(--cycle) infinite both ease-in-out}.sent-toast{opacity:0;animation:sent var(--cycle) infinite both ease-in-out}.add-button{animation:plus-out var(--cycle) infinite both}.phone-spark{opacity:0;animation:phone-spark var(--cycle) infinite both}.delivery-bike{animation:bike-travel var(--cycle) infinite both cubic-bezier(.25,.5,.3,1)}.bike-bounce{animation:bike-bounce .55s infinite ease-in-out}.wheel-spokes{transform-origin:144px 360px;animation:wheel .65s infinite linear}.wheel-front{transform-origin:251px 360px}.road-lines{animation:road .9s infinite linear}.delivery-house{animation:house-arrives var(--cycle) infinite both cubic-bezier(.3,.6,.2,1)}.delivery-clouds{animation:cloud-drift var(--cycle) infinite both linear}.arrival-ping{transform-origin:367px 125px;opacity:0;animation:arrival var(--cycle) infinite both ease-in-out}.success-disc{transform-origin:260px 271px;animation:disc-in var(--cycle) infinite both cubic-bezier(.2,.8,.3,1)}.success-tick{stroke-dasharray:110;stroke-dashoffset:110;animation:draw-tick var(--cycle) infinite both ease-in-out}.success-confetti{transform-origin:260px 271px;animation:confetti var(--cycle) infinite both ease-out}.success-ring{transform-origin:260px 271px;animation:success-ring var(--cycle) infinite both ease-out}.ring-outer{animation-delay:.15s}.film-controls{display:flex;justify-content:center;gap:22px;align-items:center;margin-top:-8px}.film-chapters{display:flex;align-items:center;gap:14px}.film-chapters>span{font-size:8px;color:#93978a;white-space:nowrap}.film-chapters b{font-weight:500;font-size:11px;margin-left:6px}.film-chapters>i{height:1px;width:22px;background:#d7d9cc}.chapter-order{animation:chapter-order var(--cycle) infinite both}.chapter-delivery{animation:chapter-delivery var(--cycle) infinite both}.chapter-done{animation:chapter-done var(--cycle) infinite both}.film-replay{width:29px;height:29px;display:grid;place-items:center;background:transparent;border:1px solid #cfd2c4;border-radius:50%;color:#626951;font-size:20px;cursor:pointer;transition:background .2s}.film-replay:hover{background:#e7e8dc}.film-disclaimer{display:block;text-align:center;font-size:6px;letter-spacing:1.4px;color:#999b8e;margin-top:20px}.journey-scroll{position:absolute;bottom:24px;left:50%;font-size:24px;color:#70785f;transform:translateX(-50%)}
@keyframes order-scene{0%{opacity:0;transform:translateY(16px) scale(.96)}5%,33%{opacity:1;transform:translateY(0) scale(1)}40%,97%{opacity:0;transform:translateY(-25px) scale(.8) rotate(-6deg)}100%{opacity:0;transform:translateY(16px) scale(.96)}}
@keyframes device-drift{0%,40%,100%{transform:rotate(-4deg)}18%,30%{transform:rotate(1deg)}}
@keyframes order-tap{0%,10%{opacity:0;transform:translate(25px,30px) scale(1.4)}14%{opacity:1;transform:translate(0,0) scale(1)}16%{opacity:1;transform:translate(0,0) scale(.76)}19%{opacity:0;transform:translate(0,0) scale(1.45)}22%{opacity:0;transform:translate(-60px,80px) scale(1.25)}24%{opacity:1;transform:translate(-60px,80px) scale(1)}26%{opacity:1;transform:translate(-60px,80px) scale(.76)}29%{opacity:0;transform:translate(-60px,80px) scale(1.45)}30%,100%{opacity:0}}
@keyframes added{0%,16%{opacity:0}18%,100%{opacity:1}}
@keyframes plus-out{0%,16%{opacity:1}18%,100%{opacity:0}}
@keyframes cart-in{0%,17%{opacity:0;transform:translateY(12px)}21%,26%{opacity:1;transform:translateY(0)}29%,100%{opacity:0;transform:translateY(0)}}
@keyframes sent{0%,26%{opacity:0;transform:translateY(10px)}30%,100%{opacity:1;transform:translateY(0)}}
@keyframes phone-spark{0%,26%{opacity:0;transform:translateY(4px)}30%,34%{opacity:1;transform:translateY(0)}38%,100%{opacity:0;transform:translateY(-6px)}}
@keyframes delivery-scene{0%,35%{opacity:0;transform:translateY(25px) scale(.85)}42%,70%{opacity:1;transform:translateY(0) scale(1)}78%,100%{opacity:0;transform:translateY(-15px) scale(1.07)}}
@keyframes bike-travel{0%,37%{transform:translateX(-190px)}47%{transform:translateX(-45px)}61%{transform:translateX(25px)}68%,100%{transform:translateX(91px)}}
@keyframes bike-bounce{0%,100%{transform:translateY(0)}50%{transform:translateY(-1.8px)}}
@keyframes wheel{to{transform:rotate(360deg)}}
@keyframes road{to{transform:translateX(-78px)}}
@keyframes house-arrives{0%,39%{opacity:0;transform:translateX(70px)}50%,100%{opacity:1;transform:translateX(0)}}
@keyframes cloud-drift{0%,38%{transform:translateX(20px)}75%,100%{transform:translateX(-15px)}}
@keyframes arrival{0%,65%{opacity:0;transform:translateY(8px) scale(.8)}69%,100%{opacity:1;transform:translateY(0) scale(1)}}
@keyframes complete-scene{0%,73%{opacity:0;transform:translateY(16px) scale(.9)}79%,94%{opacity:1;transform:translateY(0) scale(1)}99%,100%{opacity:0;transform:translateY(-12px) scale(1.02)}}
@keyframes disc-in{0%,74%{transform:scale(.7)}82%,100%{transform:scale(1)}}
@keyframes draw-tick{0%,79%{stroke-dashoffset:110}85%,100%{stroke-dashoffset:0}}
@keyframes confetti{0%,76%{opacity:0;transform:scale(.6) rotate(-7deg)}84%,94%{opacity:1;transform:scale(1) rotate(0deg)}100%{opacity:0;transform:scale(1.05)}}
@keyframes success-ring{0%,75%{opacity:0;transform:scale(.6)}85%,95%{opacity:1;transform:scale(1)}100%{opacity:0;transform:scale(1.05)}}
@keyframes chapter-order{0%,36%{color:#343f2b}40%,97%{color:#a8ac9d}100%{color:#343f2b}}
@keyframes chapter-delivery{0%,36%{color:#a8ac9d}42%,73%{color:#343f2b}78%,100%{color:#a8ac9d}}
@keyframes chapter-done{0%,73%{color:#a8ac9d}79%,97%{color:#343f2b}100%{color:#a8ac9d}}
.motion-off .order-scene,.motion-off .order-device{opacity:1;transform:none}.motion-off .delivery-scene,.motion-off .complete-scene{opacity:0}.motion-off .order-cart{opacity:1}.motion-off .film-replay{display:none}
@media(max-width:1000px){.journey-hero{padding-left:7%;padding-right:5%;gap:0}.journey-hero h1{font-size:62px;letter-spacing:-3px}.order-film{max-width:460px}}
@media(max-width:700px){.journey-hero{height:auto;min-height:0;max-height:none;padding:28px 6% 42px;gap:0;display:flex;flex-direction:column;align-items:center}.journey-copy{text-align:center;padding:0;width:100%}.journey-copy .eyebrow{font-size:7px}.journey-hero h1{font-size:43px;letter-spacing:-2px;line-height:1.04;margin:17px 0 17px;max-width:none}.journey-hero h1 br{display:none}.journey-hero h1 em{display:block}.journey-copy .button{padding:12px 16px;font-size:10px;gap:28px}.order-film{width:100%;max-width:375px;margin-top:7px}.film-controls{gap:17px;margin-top:-6px}.film-chapters{gap:10px}.film-chapters b{font-size:10px}.film-chapters>i{width:15px}.film-replay{width:25px;height:25px;font-size:17px}.film-disclaimer{font-size:5px;margin-top:13px}.journey-scroll{bottom:7px;font-size:20px}}
@media(max-height:780px) and (min-width:701px){.journey-hero{min-height:500px;height:calc(100svh - 100px);padding-top:5px;padding-bottom:30px}.order-film{max-width:400px}.journey-hero h1{font-size:56px}.journey-scroll{bottom:8px}}
@media(prefers-reduced-motion:reduce){.order-scene,.order-device{opacity:1;transform:none}.delivery-scene,.complete-scene{opacity:0}.order-cart{opacity:1}.film-replay{display:none}}