#page-menu{--deep:#2a0845;--orange:#ff8a00;--cream:#fff8f0;--yellow:#ffd85b;--soft-purple:#8d54b0;position:relative;overflow:hidden;background:radial-gradient(circle at 92% 3%,rgba(255,216,91,.55),transparent 23%),radial-gradient(circle at 8% 38%,rgba(141,84,176,.16),transparent 25%),var(--cream);padding:74px 0 0;color:var(--deep)}
#page-menu:before{content:"";position:absolute;inset:0;pointer-events:none;background-image:radial-gradient(rgba(42,8,69,.1) 1px,transparent 1px);background-size:24px 24px;mask-image:linear-gradient(#000,transparent 42%)}
#page-menu .menu-glow{position:absolute;width:380px;height:380px;border-radius:50%;filter:blur(20px);pointer-events:none;opacity:.3;animation:drift 7s ease-in-out infinite alternate}.glow-one{background:#ffb000;right:-180px;top:420px}.glow-two{background:#c992ef;left:-220px;top:1020px}@keyframes drift{to{transform:translate(36px,-30px) scale(1.12)}}
#page-menu .container{position:relative;z-index:1}.menu-hero{min-height:430px;display:grid;grid-template-columns:1.2fr .8fr;align-items:center;gap:40px;padding-bottom:68px}.menu-eyebrow,.popular-heading>span{display:inline-block;color:var(--orange);font-size:.76rem;letter-spacing:.15em;font-weight:900}.hero-copy h1{font-size:clamp(3.2rem,7vw,6.8rem);line-height:.9;letter-spacing:-.06em;margin:18px 0 22px;color:var(--deep)}.hero-copy h1 span{color:var(--orange);display:block}.hero-copy>p{font-size:1.12rem;max-width:550px;color:#654777;font-weight:600}.hero-pills{display:flex;gap:9px;flex-wrap:wrap;margin-top:24px}.hero-pills span{padding:8px 13px;border-radius:99px;background:rgba(255,255,255,.72);box-shadow:0 9px 20px rgba(42,8,69,.08);font-size:.78rem;font-weight:800}
.hero-orbit{height:320px;width:320px;margin:auto;border:2px dashed rgba(42,8,69,.18);border-radius:50%;display:grid;place-items:center;position:relative;animation:spin 20s linear infinite}.hero-orbit i{width:116px;height:190px;border-radius:22px;background:linear-gradient(145deg,#7d3ca4,#2a0845);box-shadow:12px 18px 30px rgba(42,8,69,.23)}.hero-orbit i:before{content:"SNAPGO";display:block;text-align:center;margin-top:18px;font-weight:900;letter-spacing:.1em;color:var(--yellow)}.hero-orbit span{position:absolute;width:58px;height:58px;display:grid;place-items:center;border-radius:18px;background:#fff;font-size:1.8rem;box-shadow:0 14px 25px rgba(42,8,69,.16);animation:counterspin 20s linear infinite}.hero-orbit span:nth-of-type(1){top:-20px;left:52px}.hero-orbit span:nth-of-type(2){right:-25px;top:124px}.hero-orbit span:nth-of-type(3){bottom:-15px;left:84px}@keyframes spin{to{transform:rotate(360deg)}}@keyframes counterspin{to{transform:rotate(-360deg)}}
.shelf-section{padding:48px 0 76px}.shelf-heading{display:flex;align-items:center;justify-content:space-between;margin-bottom:20px}.shelf-heading>div{display:flex;align-items:center;gap:15px}.shelf-icon{font-size:2.6rem;filter:drop-shadow(0 8px 10px rgba(42,8,69,.14))}.shelf-heading h2{font-size:clamp(1.8rem,4vw,3rem);margin:0;line-height:1;color:var(--deep);letter-spacing:-.045em}.shelf-heading p{margin:4px 0 0;color:#826592;font-weight:750}.swipe-hint{color:#8b6e98;font-size:.82rem;font-weight:800}.swipe-hint b{font-size:1.2rem;color:var(--orange)}
.product-rail{display:flex;align-items:flex-end;gap:14px;overflow-x:auto;overscroll-behavior-x:contain;scroll-snap-type:x mandatory;padding:28px 10px 18px;scroll-padding-inline:10px;scrollbar-width:none}.product-rail::-webkit-scrollbar{display:none}.shelf-product{flex:0 0 142px;scroll-snap-align:start;text-align:center;position:relative;padding:0 5px 12px;transition:transform .3s ease;cursor:default}.shelf-product:after{content:"";height:9px;position:absolute;left:0;right:0;bottom:0;border-radius:50%;background:rgba(42,8,69,.15);filter:blur(4px);transition:.3s ease}.shelf-product img{width:100%;height:132px;object-fit:contain;object-position:center bottom;position:relative;z-index:1;filter:drop-shadow(0 15px 12px rgba(42,8,69,.2));transition:transform .3s ease,filter .3s ease}.shelf-product h3{font-size:.92rem;line-height:1.1;margin:10px 0 4px;color:var(--deep);font-weight:900;min-height:2.02em;display:flex;align-items:flex-end;justify-content:center}.shelf-product small{display:block;color:#80628f;font-size:.72rem;font-weight:700;min-height:1.3em}.shelf-product b{display:inline-block;margin-top:8px;padding:4px 10px;border-radius:99px;background:#fff0d8;color:var(--orange);font-size:.78rem}.shelf-product:hover{transform:translateY(-12px)}.shelf-product:hover img{animation:shelfHover .8s ease-in-out infinite alternate;filter:drop-shadow(0 18px 17px rgba(255,138,0,.5))}.shelf-product:hover:after{background:rgba(255,138,0,.42);transform:scale(1.2)}@keyframes shelfHover{to{transform:translateY(-4px) scale(1.1)}}
.shelf-ledge{height:20px;border-radius:99px;background:linear-gradient(180deg,#fff,#eadbc7);box-shadow:0 11px 0 #d6c1ab,0 18px 28px rgba(42,8,69,.16);position:relative}.shelf-ledge i{position:absolute;left:4%;right:4%;top:5px;height:2px;background:rgba(42,8,69,.09)}
.vending-interlude{margin:8px auto 26px;min-height:330px;border-radius:40px;background:linear-gradient(120deg,#2a0845,#4e1673 62%,#7c2f90);display:grid;grid-template-columns:.8fr 1.2fr;align-items:center;gap:56px;padding:38px 10%;overflow:hidden;box-shadow:0 28px 55px rgba(42,8,69,.24);color:#fff}.mini-vending{width:190px;margin:auto;padding:13px;background:linear-gradient(135deg,#9b4fc1,#2a0845);border-radius:21px;box-shadow:15px 18px 0 rgba(0,0,0,.2),0 0 30px rgba(255,216,91,.38);animation:machineBob 4s ease-in-out infinite alternate}.vending-top{display:flex;justify-content:space-between;padding:4px 3px 10px;font-size:.7rem;font-weight:900;letter-spacing:.1em}.vending-top i{color:var(--yellow);font-style:normal}.vending-window{display:grid;grid-template-columns:repeat(2,1fr);gap:7px;padding:11px;background:#180027;border-radius:12px}.vending-window span{display:grid;place-items:center;min-height:48px;border-radius:7px;background:#fff;font-size:1.5rem;animation:shelfFloat 2.5s ease-in-out infinite alternate}.vending-window span:nth-child(even){animation-delay:-1.25s}.vending-slot{height:19px;margin:12px 14px 2px;border-radius:8px;background:var(--orange);box-shadow:inset 0 4px 0 rgba(0,0,0,.22)}@keyframes machineBob{to{transform:translateY(-12px) rotate(2deg)}}.interlude-copy>span{font-size:.72rem;font-weight:900;letter-spacing:.15em;color:var(--yellow)}.interlude-copy h2{font-size:clamp(2rem,4vw,3.9rem);line-height:.95;margin:13px 0;color:#fff}.interlude-copy h2 em{font-style:normal;color:var(--yellow)}.interlude-copy p{max-width:480px;color:#dbc6e7;font-weight:600}.particle{position:absolute;width:12px;height:12px;border-radius:50%;background:var(--yellow);box-shadow:0 0 20px var(--yellow);animation:particle 4s linear infinite}.p1{top:18%;left:44%}.p2{bottom:22%;right:13%;animation-delay:-1.4s}.p3{top:22%;right:30%;background:var(--orange);animation-delay:-2.8s}@keyframes particle{to{transform:translateY(-40px) translateX(20px);opacity:0}}
.popular-section{margin-top:40px;padding:88px 0 96px;background:linear-gradient(140deg,#fff1d1,#fff8f0 46%,#e9d6f2)}.popular-heading{text-align:center;margin-bottom:36px}.popular-heading h2{font-size:clamp(2.3rem,5vw,4.6rem);letter-spacing:-.06em;margin:8px 0;color:var(--deep)}.popular-picks{display:grid;grid-template-columns:repeat(4,1fr);gap:18px}.popular-item{min-height:300px;position:relative;border-radius:28px;padding:22px 18px;overflow:hidden;display:flex;flex-direction:column;justify-content:flex-end;box-shadow:0 20px 38px rgba(42,8,69,.13);transition:.3s ease}.popular-item:hover{transform:translateY(-9px) rotate(-1deg);box-shadow:0 30px 46px rgba(42,8,69,.2)}.popular-item.orange{background:#ff9c22}.popular-item.yellow{background:#ffde68}.popular-item.purple{background:#9561b9}.popular-item.cream{background:#fff}.popular-item img{position:absolute;top:22px;left:50%;transform:translateX(-50%);width:70%;height:150px;object-fit:contain;filter:drop-shadow(0 18px 13px rgba(42,8,69,.25));transition:.3s ease}.popular-item:hover img{transform:translateX(-50%) scale(1.08)}.popular-item .favorite,.rating{position:absolute;z-index:1;top:14px;padding:5px 8px;background:rgba(255,255,255,.82);border-radius:99px;font-size:.61rem;font-weight:900;color:var(--deep)}.favorite{left:12px}.rating{right:12px}.popular-item>div{position:relative;z-index:1}.popular-item small{font-weight:800;color:rgba(42,8,69,.72)}.popular-item h3{font-size:1.2rem;margin:2px 0;color:var(--deep);line-height:1.1}.popular-item b{display:inline-block;margin-top:8px;padding:5px 11px;border-radius:99px;background:var(--deep);color:#fff;font-size:.76rem}
.menu-reveal{opacity:0;transform:translateY(25px);transition:.65s ease}.menu-reveal.is-visible{opacity:1;transform:none}@media(max-width:760px){#page-menu{padding-top:40px}.menu-hero{grid-template-columns:1fr;text-align:center;padding-bottom:28px}.hero-copy>p{margin-inline:auto}.hero-pills{justify-content:center}.hero-orbit{transform:scale(.78);height:250px;margin-top:-20px}.shelf-section{padding:36px 0 54px}.swipe-hint{display:none}.product-rail{margin-right:calc(-1 * clamp(20px,4vw,32px));padding-right:clamp(20px,4vw,32px)}.vending-interlude{grid-template-columns:1fr;gap:24px;text-align:center;padding:34px 20px}.interlude-copy p{margin-inline:auto}.popular-section{padding:62px 0}.popular-picks{display:flex;overflow-x:auto;scroll-snap-type:x mandatory;padding:5px 4px 22px;gap:14px;scrollbar-width:none}.popular-picks::-webkit-scrollbar{display:none}.popular-item{flex:0 0 230px;scroll-snap-align:start}.shelf-product{flex-basis:126px}}

#page-menu .hero-machine{height:370px;display:grid;place-items:center;position:relative;perspective:1200px;isolation:isolate}
#page-menu .hero-machine img{position:relative;z-index:1;width:min(390px,86vw);height:100%;object-fit:contain;filter:drop-shadow(0 28px 18px rgba(42,8,69,.26));animation:machineShowcase 15s linear infinite;transform-style:preserve-3d}
#page-menu .machine-halo{position:absolute;width:280px;height:280px;border-radius:50%;background:radial-gradient(circle,rgba(255,216,91,.62),rgba(255,138,0,.15) 48%,transparent 70%);filter:blur(6px);animation:haloPulse 3.6s ease-in-out infinite alternate}
@keyframes machineShowcase{0%{transform:rotateY(0deg) rotateX(3deg)}50%{transform:rotateY(180deg) rotateX(-3deg)}100%{transform:rotateY(360deg) rotateX(3deg)}}
@keyframes haloPulse{to{transform:scale(1.14);opacity:.7}}
@media(max-width:760px){#page-menu .hero-machine{height:280px;margin-top:-18px}#page-menu .hero-machine img{width:270px}}

/* Interactive hero machine */
#page-menu .menu-hero{grid-template-columns:1fr 1fr;gap:18px}
#page-menu .menu-hero{grid-template-columns:minmax(0,1fr) 350px;min-height:360px;padding-bottom:24px;gap:32px}
#page-menu .hero-machine{height:310px;align-self:center}
#page-menu .hero-machine img{width:235px;height:310px;max-width:none;animation:none;transition:filter .35s ease;will-change:transform}
#page-menu .hero-machine:hover img{filter:drop-shadow(0 34px 24px rgba(42,8,69,.32))}
#page-menu .hero-machine:before{content:"";position:absolute;width:62%;height:18px;bottom:18px;border-radius:50%;background:rgba(42,8,69,.22);filter:blur(9px);z-index:0;transition:.35s ease}
#page-menu .hero-machine:hover:before{transform:scale(1.08);background:rgba(255,138,0,.32)}
#page-menu .machine-halo{width:240px;height:240px;animation:haloPulse 3.2s ease-in-out infinite alternate}
#page-menu .machine-spark{position:absolute;z-index:2;width:9px;height:9px;border-radius:50%;background:var(--orange);box-shadow:0 0 16px 4px rgba(255,138,0,.5);animation:machineSpark 3s ease-in-out infinite}
#page-menu .spark-a{top:15%;left:14%}#page-menu .spark-b{right:13%;top:33%;animation-delay:-1s;background:var(--yellow)}#page-menu .spark-c{bottom:19%;left:19%;animation-delay:-2s}
@keyframes machineSpark{50%{transform:translateY(-18px) scale(1.45);opacity:.35}}
@media(max-width:760px){#page-menu .menu-hero{grid-template-columns:1fr;min-height:auto;gap:4px;padding-bottom:18px}#page-menu .hero-machine{height:230px;margin-top:0}#page-menu .hero-machine img{width:175px;height:230px}#page-menu .machine-halo{width:205px;height:205px}#page-menu .hero-machine:before{bottom:14px}}

/* Compact, consistent page rhythm */
#page-menu{padding-top:56px}
#page-menu .menu-hero{min-height:400px;padding-bottom:34px}
#page-menu .shelf-section{padding:34px 0 46px}
#page-menu .product-rail{padding-top:20px;padding-bottom:12px}
#page-menu .vending-interlude{min-height:280px;margin:0 auto 14px;padding:28px 8%;gap:40px}
#page-menu .popular-section{margin-top:20px;padding:58px 0 64px}
#page-menu .popular-heading{margin-bottom:24px}
#page-menu .vending-interlude.menu-reveal{opacity:1;transform:none}
@media(max-width:760px){#page-menu{padding-top:36px}#page-menu .menu-hero{min-height:auto;padding-bottom:20px}#page-menu .shelf-section{padding:30px 0 38px}#page-menu .vending-interlude{min-height:0;margin-bottom:8px;padding:28px 20px}#page-menu .popular-section{margin-top:12px;padding:48px 0}}
