/* V3 client revision layer. Existing v2 presentation remains in its own worktree. */
[hidden]{display:none!important}
/* Header banner: the watercolour wash and green wave line from the owner's business and loyalty cards (the pink band was removed at the owner's request). */
.header{border-bottom:0;padding-bottom:16px;background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1440 16' preserveAspectRatio='none'%3E%3Cpath d='M0 6C300 1 620 11 980 6S1300 2 1440 4' fill='none' stroke='%2378b966' stroke-width='3' vector-effect='non-scaling-stroke'/%3E%3C/svg%3E") bottom/100% 12px no-repeat,url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='720' height='240'%3E%3Cfilter id='w'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.006 .018' numOctaves='3' seed='7'/%3E%3CfeColorMatrix values='0 0 0 0 1 0 0 0 0 .97 0 0 0 0 .96 0 0 0 -1.6 1.05'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23w)' opacity='.55'/%3E%3C/svg%3E") 0 0/720px 240px,radial-gradient(ellipse 55% 160% at 0% 0%,#cdebe7 0%,#d6eeea 30%,#d6eeea00 75%),radial-gradient(ellipse 55% 160% at 100% 0%,#fcd6cd 0%,#fcdfd7 35%,#fcdfd700 78%),#f9f4f1}
.header .brand{width:194px;flex-shrink:0}
.header{display:grid;grid-template-columns:minmax(0,1fr) auto minmax(0,1fr);min-height:104px}
.header-actions{justify-self:end}
.store-sign{display:block;position:relative;width:132px;text-decoration:none;perspective:500px;border-radius:8px}
.sign-rig{position:relative;display:block;padding-top:13px;transform-origin:50% 0;transform:rotate(-2deg)}
.sign-rig::before,.sign-rig::after{content:"";position:absolute;top:0;width:2px;height:17px;background:var(--green);border-radius:2px;z-index:-1}
.sign-rig::before{left:25%}.sign-rig::after{right:25%}
.store-sign .neon{position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:5px;min-height:60px;padding:8px 7px;background:var(--ink);border:2px solid #b69da7;border-radius:8px;overflow:hidden;color:var(--cream);box-shadow:0 4px 0 #40333a,0 9px 14px -7px #29202465}
.store-sign .neon-top{font-family:var(--sans);font-size:12px;line-height:1;white-space:nowrap}
.store-sign .neon-word{font-family:'Tilt Neon',var(--sans);font-size:27px;line-height:1;letter-spacing:.1em;padding-left:.1em}
.store-sign.is-open .neon{border-color:#f6b6cd;box-shadow:inset 0 0 9px #ed4b8033,0 4px 0 #40333a,0 9px 17px -7px #ed4b8070}
.store-sign.is-open .neon-top{color:#e4f8df;text-shadow:0 0 6px #70b364a0}
.store-sign.is-open .neon-word{color:#fff2f6;text-shadow:0 0 3px #ffb2ce,0 0 10px #ed4b80,0 0 18px #ed4b8090}
.store-sign.is-closed .neon{color:#dccbd2}
.store-sign .neon::after{content:"";position:absolute;top:-40%;right:-60%;bottom:-40%;left:-60%;background:linear-gradient(110deg,transparent 40%,#ffffff25 49%,transparent 58%);transform:translateX(-110%);pointer-events:none}
@media(prefers-reduced-motion:no-preference){
 .store-sign.sign-enter .sign-rig{animation:sign-arrive 3.6s linear both}
 .store-sign.sign-enter.is-open .neon-word{animation:sign-power .8s .25s both}
 .store-sign.sign-enter .neon::after{animation:sign-glint .9s .7s both}
 .store-sign.sign-nudge .sign-rig{animation:sign-swing 1.25s both}
 .store-sign.sign-nudge .neon::after{animation:sign-glint .8s both}
 .store-sign.sign-paused *,.store-sign.sign-paused *::after{animation-play-state:paused!important}
}
@keyframes sign-arrive{0.0%{transform:translateY(-20.0px) rotate(-15.00deg) rotateY(0.00deg);opacity:0.00}2.2%{transform:translateY(-18.6px) rotate(-15.00deg) rotateY(0.00deg);opacity:0.67}4.4%{transform:translateY(-14.3px) rotate(-15.00deg) rotateY(0.00deg)}6.7%{transform:translateY(-7.2px) rotate(-15.00deg) rotateY(0.00deg)}8.9%{transform:translateY(0.0px) rotate(-14.68deg) rotateY(-2.12deg)}11.1%{transform:translateY(0.0px) rotate(-12.18deg) rotateY(-4.58deg)}13.3%{transform:translateY(0.0px) rotate(-8.30deg) rotateY(-5.91deg)}15.6%{transform:translateY(0.0px) rotate(-3.88deg) rotateY(-6.04deg)}17.8%{transform:translateY(0.0px) rotate(0.23deg) rotateY(-5.12deg)}20.0%{transform:translateY(0.0px) rotate(3.38deg) rotateY(-3.45deg)}22.2%{transform:translateY(0.0px) rotate(5.17deg) rotateY(-1.43deg)}24.4%{transform:translateY(0.0px) rotate(5.47deg) rotateY(0.55deg)}26.7%{transform:translateY(0.0px) rotate(4.46deg) rotateY(2.16deg)}28.9%{transform:translateY(0.0px) rotate(2.48deg) rotateY(3.17deg)}31.1%{transform:translateY(0.0px) rotate(0.02deg) rotateY(3.49deg)}33.3%{transform:translateY(0.0px) rotate(-2.44deg) rotateY(3.17deg)}35.6%{transform:translateY(0.0px) rotate(-4.48deg) rotateY(2.36deg)}37.8%{transform:translateY(0.0px) rotate(-5.80deg) rotateY(1.26deg)}40.0%{transform:translateY(0.0px) rotate(-6.29deg) rotateY(0.09deg)}42.2%{transform:translateY(0.0px) rotate(-5.98deg) rotateY(-0.92deg)}44.4%{transform:translateY(0.0px) rotate(-5.03deg) rotateY(-1.63deg)}46.7%{transform:translateY(0.0px) rotate(-3.69deg) rotateY(-1.97deg)}48.9%{transform:translateY(0.0px) rotate(-2.26deg) rotateY(-1.92deg)}51.1%{transform:translateY(0.0px) rotate(-0.98deg) rotateY(-1.55deg)}53.3%{transform:translateY(0.0px) rotate(-0.06deg) rotateY(-0.96deg)}55.6%{transform:translateY(0.0px) rotate(0.40deg) rotateY(-0.30deg)}57.8%{transform:translateY(0.0px) rotate(0.38deg) rotateY(0.32deg)}60.0%{transform:translateY(0.0px) rotate(-0.04deg) rotateY(0.80deg)}62.2%{transform:translateY(0.0px) rotate(-0.73deg) rotateY(1.08deg)}64.4%{transform:translateY(0.0px) rotate(-1.55deg) rotateY(1.13deg)}66.7%{transform:translateY(0.0px) rotate(-2.33deg) rotateY(0.98deg)}68.9%{transform:translateY(0.0px) rotate(-2.94deg) rotateY(0.68deg)}71.1%{transform:translateY(0.0px) rotate(-3.30deg) rotateY(0.31deg)}73.3%{transform:translateY(0.0px) rotate(-3.39deg) rotateY(-0.06deg)}75.6%{transform:translateY(0.0px) rotate(-3.23deg) rotateY(-0.37deg)}77.8%{transform:translateY(0.0px) rotate(-2.88deg) rotateY(-0.57deg)}80.0%{transform:translateY(0.0px) rotate(-2.43deg) rotateY(-0.65deg)}82.2%{transform:translateY(0.0px) rotate(-1.97deg) rotateY(-0.60deg)}84.4%{transform:translateY(0.0px) rotate(-1.58deg) rotateY(-0.46deg)}86.7%{transform:translateY(0.0px) rotate(-1.32deg) rotateY(-0.26deg)}88.9%{transform:translateY(0.0px) rotate(-1.21deg) rotateY(-0.04deg)}91.1%{transform:translateY(0.0px) rotate(-1.25deg) rotateY(0.15deg)}93.3%{transform:translateY(0.0px) rotate(-1.41deg) rotateY(0.29deg)}95.6%{transform:translateY(0.0px) rotate(-1.65deg) rotateY(0.36deg)}97.8%{transform:translateY(0.0px) rotate(-1.92deg) rotateY(0.36deg)}100.0%{transform:translateY(0.0px) rotate(-2.16deg) rotateY(0.30deg)}}
@keyframes sign-swing{0%,100%{transform:rotate(-2deg)}25%{transform:rotate(8deg) rotateY(8deg)}52%{transform:rotate(-6deg) rotateY(-4deg)}76%{transform:rotate(2deg)}}
@keyframes sign-power{from{opacity:.4;filter:brightness(.55)}55%{opacity:1;filter:brightness(1.6)}to{opacity:1;filter:brightness(1)}}
@keyframes sign-glint{from{transform:translateX(-110%)}to{transform:translateX(110%)}}
.waffle-hero h1{font-size:clamp(50px,5.9vw,84px);line-height:1.04;max-width:10ch;letter-spacing:-1px;margin-bottom:32px}
.liked-carousel{max-width:1020px;margin:auto}
.liked-window{display:grid;gap:32px;touch-action:pan-y}
.liked-slide{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(24px,5vw,72px);align-items:center}
.liked-photo{overflow:hidden;border-radius:50% 50% var(--radius) var(--radius);background:var(--cream);aspect-ratio:4/4.6}
.liked-photo img{display:block;width:100%;height:100%;object-fit:cover}
.liked-copy{padding:24px 0}
.liked-copy h3{font-size:clamp(32px,4vw,52px);line-height:1.08;margin:0 0 20px}
.liked-copy p{max-width:31ch;color:var(--muted);margin:0 0 28px}
.liked-copy .liked-category{font-size:14px;font-weight:500;color:var(--green);margin-bottom:12px}
.liked-copy .button{margin-top:4px}
.liked-carousel.is-ready .liked-window{gap:0}
.liked-carousel.is-ready .liked-slide{grid-area:1/1;opacity:0;visibility:hidden;pointer-events:none;transition:opacity .55s ease,visibility .55s}
.liked-carousel.is-ready .liked-slide.is-active{opacity:1;visibility:visible;pointer-events:auto}
.liked-controls{display:flex;justify-content:center;align-items:center;gap:12px;margin-top:28px}
.liked-controls button{height:44px;min-width:44px;border:1px solid var(--green);border-radius:var(--radius);background:transparent;color:var(--ink);padding:0 14px}
.liked-controls button:hover{background:var(--mint)}
.liked-controls [data-liked-status]{font-size:14px;min-width:40px;text-align:center}
.liked-controls [data-liked-pause]{margin-left:12px}
.order-choices{display:flex;flex-wrap:wrap;gap:16px}
.order-choices .button{min-width:150px}
.order-choices .button[aria-expanded="true"]{background:var(--green);border-color:var(--green);color:var(--cream)}
.order-split{grid-template-columns:minmax(0,1fr);max-width:940px;margin-top:24px}
.order-split>div{animation:order-reveal .3s ease-out}
.order-split h3{scroll-margin-top:140px}
.order-note{max-width:52ch}
.order-split .pickup-store,.order-split .delivery-store{padding-top:24px;padding-bottom:24px}
.site-footer{background:#dcefdc}
.site-footer .footer-brand{justify-self:start;align-self:start} /* no box behind the logo (owner, October 25) */
.site-footer p,.footer-bottom{color:var(--ink)}
.category-filters{gap:10px;align-items:stretch}
.category-filters .filter{min-height:44px}
.menu-controls [data-menu-all]{flex-shrink:0}
.menu-item{grid-template-columns:minmax(0,1fr)}
.menu-group.with-photos .menu-item{grid-template-columns:76px minmax(0,1fr)}
.season-item{grid-template-columns:1fr}
.allergy-note{background:var(--blush);border:0;padding:20px 24px;border-radius:var(--radius);max-width:none}
@keyframes order-reveal{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}
@media(max-width:760px){
 .header{grid-template-columns:minmax(0,1fr) auto auto;gap:12px;min-height:92px}
 .header .brand{width:clamp(106px,36vw,158px);max-width:100%;min-width:0}
 .store-sign{width:110px}
 .store-sign .neon{min-height:57px;padding:7px 5px}
 .store-sign .neon-word{font-size:24px}
 .waffle-hero h1{font-size:clamp(44px,9vw,64px);max-width:13ch;margin-bottom:24px}
 .liked-slide{grid-template-columns:1fr;gap:0;max-width:440px;margin:auto;width:100%}
 .liked-photo{width:100%;max-width:360px;justify-self:center;aspect-ratio:4/4.4}
 .liked-copy{padding:24px 0 0}
 .liked-copy h3{font-size:34px;margin-bottom:12px}
 .liked-copy p{margin-bottom:20px;max-width:32ch}
 .liked-copy .liked-category{margin-bottom:8px}
 .liked-controls{margin-top:24px}
 .order-choices{gap:12px}
 .order-choices .button{flex:1;min-width:0}
 .category-filters{overflow-x:auto;flex-wrap:nowrap;padding-bottom:16px;scrollbar-width:thin}
 .category-filters .filter{flex:none;white-space:nowrap}
 .menu-controls{flex-wrap:wrap;gap:12px}
}
@media(max-width:380px){.header{padding-left:12px;padding-right:12px;gap:8px}.store-sign{width:104px}.header .nav-toggle{width:40px;min-width:40px}.store-sign .neon-top{font-size:11px}}
@media(prefers-reduced-motion:reduce){
 .liked-carousel.is-ready .liked-slide,.film-chapters button span{transition:none}
 .order-split>div{animation:none}
}

/* Full-width peach, with a mint scalloped edge outlined in the owner's green. */
.waffle-hero{max-width:none;padding-left:max(5vw,calc((100% - 1440px)/2));padding-right:max(5vw,calc((100% - 1440px)/2));padding-bottom:48px}
.flavour-trail{background:var(--mint);border-bottom:1px solid #70b36460}
.flavour-trail::before{top:-18px;height:19px;background:radial-gradient(circle at 18px 0,transparent 16px,var(--logo-green) 16.7px,var(--logo-green) 18px,var(--mint) 18.7px) 0 0/36px 19px repeat-x}
.flavour-stamp{background:var(--cream)}
.sweet-fx{position:fixed;top:0;right:0;bottom:0;left:0;pointer-events:none;overflow:hidden;z-index:70;contain:strict}
.rolling-cookie{position:absolute;left:0;top:0;filter:drop-shadow(0 3px 3px #29202430);will-change:transform}
.rolling-cookie svg{display:block;width:100%;height:100%}
.cookie-sprinkle{position:absolute;width:5px;height:13px;border-radius:3px;will-change:transform}
.cookie-ring{position:absolute;width:44px;height:44px;border:3px solid var(--baby-pink);border-radius:50%;box-shadow:0 0 0 5px #70b36460}
.film-chapters{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;margin-top:20px}
.film-chapters button{display:flex;flex-direction:column;align-items:stretch;justify-content:center;width:100%;height:auto;gap:8px;padding:4px 0;min-height:44px;border:0}
.film-chapters button .reel-track{display:block;width:100%;height:5px;border-radius:8px;background:#29202425;overflow:hidden;margin:0}
.film-chapters button .reel-fill{display:block;width:100%;height:100%;border-radius:8px;background:var(--green);transform:scaleX(var(--progress,0));transform-origin:left;transition:none;margin:0}
.film-chapters button .reel-name{display:block;width:auto;height:auto;margin:0;background:none!important;border-radius:0;font-size:12px;font-weight:400;line-height:1.3;color:var(--muted);text-align:left}
.film-chapters button[aria-pressed="true"] .reel-name{color:var(--ink);font-weight:600}
.film-chapters button[aria-pressed="true"] .reel-track{background:#29202425}
.film-time{font-size:12px;color:var(--muted);text-align:right;font-variant-numeric:tabular-nums;margin:4px 0 0}
.film-credit{display:block;text-align:center;margin-top:12px;font-size:14px;text-decoration:underline;text-underline-offset:4px}
.liked-carousel.is-ready .liked-slide{transition-duration:.75s;transition-timing-function:cubic-bezier(.45,0,.2,1)} /* same pace as the menu category rows */
@media(max-width:760px){
 .waffle-hero{padding-left:22px;padding-right:22px}
 .film-chapters{gap:10px;margin-top:16px}
}
@media(prefers-reduced-motion:reduce){.liked-carousel.is-ready .liked-slide{transition:none}}

/* Tagline "Ice cream that rolls with you." v3.js draws one ice-cream roll as tall as both lines on a canvas behind
   the words and unrolls it left to right, the scraping in video one played backwards: both lines appear together on
   the sheet it lays down. Without JS, or with reduced motion, the words just
   show; a CSS failsafe reveals them if the script never runs. */
.waffle-hero .roll-title{position:relative;isolation:isolate;font-size:clamp(48px,5.8vw,82px);max-width:none;line-height:1.06;margin-bottom:40px;letter-spacing:-1.4px}
.tagline{position:relative;display:inline-block}
.tw-line{position:relative;display:inline-block}
.tw-text{position:relative;display:inline-block}
.tw-rolls{color:var(--green)}
.tw-you{color:var(--pink-deep)}
.tw-dot{position:relative;display:inline-block;width:.4em;height:.1em}
.tw-roll{position:absolute;left:.04em;bottom:-.02em;width:.34em;height:.34em;z-index:2;pointer-events:none;transform-origin:50% 100%}
.tw-body{display:block;width:100%;height:100%;transform-origin:50% 100%}
.tw-body svg{display:block;width:100%;height:100%;filter:drop-shadow(0 .03em .03em #29202438)}
.tw-canvas{position:absolute;z-index:-1;pointer-events:none}
@media(prefers-reduced-motion:no-preference){
 .tw-js .tw-text{clip-path:inset(-.4em 100% -.4em -.4em);animation:tw-failsafe .3s 6s both}
 .tw-js .tw-roll{opacity:0;animation:tw-failsafe .3s 6s both}
 .tw-dot.is-in .tw-roll{animation:tw-dot-in .2s ease-out both,tw-rock 7s 2.5s ease-in-out infinite}
 .tw-dot.is-in .tw-body{animation:tw-settle .5s .05s cubic-bezier(.3,1.5,.5,1) both}
}
@keyframes tw-failsafe{to{clip-path:inset(-1em);opacity:1}}
@keyframes tw-dot-in{from{opacity:0;transform:translateY(-.25em)}to{opacity:1;transform:none}}
@keyframes tw-settle{0%{transform:none}35%{transform:scale(1.18,.84)}70%{transform:scale(.96,1.05)}100%{transform:none}}
@keyframes tw-rock{0%,88%,100%{transform:none}92%{transform:rotate(-14deg)}96%{transform:rotate(8deg)}}
.waffle-film{box-shadow:0 5px 12px #29202424,0 28px 38px -16px #29202470,0 58px 80px -28px #276a3860,0 12px 50px #ed4b8017,0 0 0 1px #fff9}
.liked-photo{box-shadow:0 4px 10px #29202417,0 20px 28px -14px #29202445,0 38px 52px -20px #276a3840,0 0 0 1px #fff9;transition:box-shadow .3s ease}
.liked-photo:hover{box-shadow:0 7px 14px #29202420,0 28px 38px -14px #276a3855,0 44px 58px -20px #276a3840,0 0 0 1px #fff9}
.liked-copy{position:relative;isolation:isolate;padding-right:70px}
.liked-copy::before{content:"";position:absolute;top:-22px;right:-18px;bottom:-22px;left:-18px;z-index:-1;pointer-events:none;background:radial-gradient(ellipse at 100% 50%,#e6f1dc88,transparent 70%);border-radius:60px}
.liked-copy::after{content:"";position:absolute;right:-12px;top:0;bottom:0;width:65px;background:url('assets/dessert-sketch.svg') center/contain no-repeat;opacity:.42;pointer-events:none}
.liked-slide.is-active .liked-copy::after{animation:dessert-sketch-in 2.4s ease-out both}
@keyframes dessert-sketch-in{from{opacity:0;transform:translateY(10px) rotate(4deg)}to{opacity:.42;transform:translateY(0) rotate(0)}}
.delivery-section>.section>.section-heading{text-align:center}
.delivery-section .section-heading p{margin-left:auto;margin-right:auto}
.order-choices{justify-content:center;max-width:480px;margin-left:auto;margin-right:auto}
.order-split{margin-left:auto;margin-right:auto;text-align:left}
@media(max-width:760px){
 .waffle-hero .roll-title{font-size:clamp(40px,8.8vw,64px);margin-bottom:34px;letter-spacing:-.8px}
 .liked-copy{padding-right:0}
 .liked-copy::before,.liked-copy::after{display:none}
}
@media(prefers-reduced-motion:reduce){
 .liked-slide.is-active .liked-copy::after{animation:none}
}

/* Footer glaze (refinements.mjs): chocolate glaze along the top of the footer that melts into drips once in view. */
.site-footer{position:relative;padding-top:120px}
.footer-glaze{position:absolute;left:0;right:0;top:-1px;height:104px;pointer-events:none;overflow:hidden}
.footer-glaze svg{display:block;width:100%;height:100%}
.footer-glaze .glaze-narrow{display:none}
.glaze-shadow{opacity:.28;transform:translate(0,3px)}
.footer-glaze .drip{transform-box:fill-box;transform-origin:50% 0}
.glaze-drop{opacity:0;transform-box:fill-box;transform-origin:50% 0}
.sprinkle-0{fill:#fff6ea}.sprinkle-1{fill:#ffe08a}.sprinkle-2{fill:#a8dd98}.sprinkle-3{fill:#f48fb1}
@media(max-width:600px){.footer-glaze .glaze-wide{display:none}.footer-glaze .glaze-narrow{display:block}.site-footer{padding-top:128px}}
@media(prefers-reduced-motion:no-preference){
 .footer-glaze.is-armed .drip{transform:scaleY(.2)}
 .footer-glaze.is-revealed .drip{animation:glaze-ooze var(--t) calc(var(--d) + .3s) cubic-bezier(.45,.05,.2,1) both}
 .footer-glaze.is-revealed .glaze-drop{animation:glaze-drop 1.7s 2.5s cubic-bezier(.55,0,.9,.6) both}
}
@keyframes glaze-ooze{from{transform:scaleY(.2)}72%{transform:scaleY(1.05)}to{transform:scaleY(1)}}
@keyframes glaze-drop{0%{opacity:0;transform:translateY(-6px) scale(.3)}25%{opacity:1;transform:translateY(-2px) scale(.95)}45%{opacity:1;transform:translateY(4px) scale(.9,1.2)}100%{opacity:0;transform:translateY(70px) scale(.75,1.35)}}
/* Own pages for Locations and hours (/locations/) and Order online (/order/). */
.page-section .section-heading h1{margin-bottom:12px}
.order-page .order-split{grid-template-columns:repeat(2,minmax(0,1fr));max-width:1100px;gap:24px;align-items:start}
.order-page .order-split>div{padding:28px;background:#fff;border-radius:var(--radius);box-shadow:0 2px 8px #29202412,0 14px 32px -18px #29202440}
@media(max-width:760px){.order-page .order-split{grid-template-columns:1fr}.order-page .order-split>div{padding:22px}}

/* Summer Menu slideshow (v3.js): owner photos crossfade on the left, the matching item is highlighted on the right. */
.season-slides{max-width:420px}
.season-slides .season-frame{display:grid;aspect-ratio:1/1;overflow:hidden;border-radius:var(--radius);background:#f7f0e6;box-shadow:0 4px 10px #29202414,0 22px 34px -18px #276a3855}
.season-slide{grid-area:1/1;width:100%;height:100%;object-fit:cover;object-position:50% 50%;opacity:0;transition:opacity .8s ease}
.season-slide.is-active{opacity:1}
.season-caption{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-top:14px}
.season-now{display:flex;align-items:center;min-height:2.6em;font-weight:600;font-size:15px;line-height:1.3}
.season-dots{display:flex;gap:2px;flex-shrink:0}
.season-dots button{display:grid;place-items:center;width:30px;height:32px;padding:0;border:0;background:none;cursor:pointer}
.season-dots button span{position:relative;display:block;width:8px;height:8px;border-radius:8px;background:#276a3840;overflow:hidden;transition:width .35s ease,background .35s ease}
.season-dots button[aria-current="true"] span{width:26px;background:#276a3830}
.season-dots button[aria-current="true"] span::after{content:"";position:absolute;top:0;right:0;bottom:0;left:0;background:var(--green);border-radius:inherit;transform-origin:left;transform:scaleX(1)}
.season-slides.is-timing .season-dots button[aria-current="true"] span::after{animation:season-fill 4.5s linear both}
@keyframes season-fill{from{transform:scaleX(0)}to{transform:scaleX(1)}}
.season-item{padding-left:14px;padding-right:14px;margin-left:-14px;margin-right:-14px;border-radius:var(--radius);transition:background .35s ease}
.season-item.is-current{background:#ffffffa6}
.season-list .season-item{cursor:pointer}
@media(max-width:760px){.season-slides{max-width:none}}
@media(prefers-reduced-motion:reduce){.season-slide{transition:opacity .2s}.season-dots button span{transition:none}}

/* Hero reels as a story-card stack: the playing reel in front, the next two fanned behind it (v3.js keeps them in order). */
.reel-stack{position:relative;isolation:isolate}
.reel-stack .waffle-film{border-radius:28px;z-index:2;box-shadow:0 2px 6px #29202420,0 24px 40px -18px #29202475,0 48px 70px -34px #276a3860,0 0 0 1px #ffffffb0}
.deck-card{position:absolute;top:0;right:0;bottom:0;left:0;border-radius:28px;background:#e8cfc0 var(--poster) center/cover no-repeat;box-shadow:0 14px 30px -16px #29202466,0 0 0 1px #ffffffc0;pointer-events:none;transition:transform .6s cubic-bezier(.2,.8,.2,1),filter .6s}
.deck-card::after{content:"";position:absolute;top:0;right:0;bottom:0;left:0;border-radius:inherit;background:linear-gradient(180deg,#fff8f31f,#fff8f366)}
.deck-mid{z-index:1;transform:translate(calc(7% - 7% * var(--pull,0)),calc(-3% + 3% * var(--pull,0))) rotate(calc(5deg - 5deg * var(--pull,0))) scale(calc(.95 + .05 * var(--pull,0)));filter:saturate(.9)}
.deck-back{z-index:0;transform:translate(13%,-6%) rotate(10deg) scale(.9);filter:saturate(.75)}
.reel-stack .film-topline{top:18px;left:18px;right:18px;justify-content:flex-start;align-items:center;gap:9px;font-size:14px}
.reel-stack .film-topline::before{content:"";flex:none;width:30px;height:30px;border-radius:50%;background:#fff url('assets/ice-cream-icon-48.png') center/22px no-repeat;box-shadow:0 0 0 2px #f48fb1,0 0 0 4px #fff}
.reel-stack.is-shuffling .waffle-film{animation:reel-forward .65s cubic-bezier(.2,.8,.2,1)}
@keyframes reel-forward{from{transform:translate(7%,-3%) rotate(5deg) scale(.95)}to{transform:none}}
@keyframes reel-forward-phone{from{transform:translate(2%,-5%) rotate(3deg) scale(.94)}to{transform:none}}
@media(max-width:760px){
 .reel-stack .waffle-film,.deck-card{border-radius:24px}
 .reel-stack{margin-top:26px}
 .deck-mid{transform:translate(calc(2% - 2% * var(--pull,0)),calc(-5% + 5% * var(--pull,0))) rotate(calc(3deg - 3deg * var(--pull,0))) scale(calc(.94 + .06 * var(--pull,0)))}
 .deck-back{transform:translate(-2%,-9%) rotate(-3deg) scale(.88)}
 .reel-stack.is-shuffling .waffle-film{animation-name:reel-forward-phone}
}
@media(prefers-reduced-motion:reduce){.deck-card{transition:none}.reel-stack.is-shuffling .waffle-film{animation:none}}

/* WebGL chocolate (choc-footer.js) replaces the SVG glaze when available. */
.footer-glaze.has-gl{height:150px;overflow:visible}
.footer-glaze.has-gl svg{display:none}
.choc-canvas{position:absolute;left:0;top:-1px;width:100%;height:150px;pointer-events:none}

/* Swipeable reel stack (v3.js): drag the front reel sideways; vertical scrolling stays native. */
.reel-stack .waffle-film{touch-action:pan-y;cursor:grab;user-select:none;-webkit-user-select:none}
.reel-stack.is-dragging .waffle-film{cursor:grabbing}
.reel-stack.is-dragging .deck-card{transition:none}
.deck-mid::after{opacity:calc(1 - var(--pull,0))}

/* No custom Pause pill on the reels: the video keeps its native controls. */
.reel-stack .film-play{display:none!important}

/* First-visit swipe tutorial on the reel (v3.js). Never blocks taps or swipes. */
.swipe-hint{position:absolute;top:0;right:0;bottom:0;left:0;z-index:4;pointer-events:none;opacity:0;transition:opacity .4s ease}
.swipe-hint.is-playing{opacity:1}
.swipe-hint.is-leaving{opacity:0}
.swipe-hint::before{content:"";position:absolute;top:0;right:0;bottom:0;left:0;border-radius:inherit;background:radial-gradient(ellipse at 50% 55%,#29202440,transparent 70%)}
.swipe-hand{position:absolute;left:62%;top:44%;width:52px;height:60px;filter:drop-shadow(0 6px 10px #29202466)}
.swipe-hand svg{display:block;width:100%;height:100%}
.swipe-ripple{position:absolute;left:37%;top:4%;width:22px;height:22px;margin:-11px 0 0 -11px;border-radius:50%;border:2px solid #fff;opacity:0}
.swipe-label{position:absolute;left:50%;bottom:72px;transform:translateX(-50%);white-space:nowrap;padding:9px 16px;border-radius:999px;background:#292024cc;color:#fff;font-size:14px;font-weight:600;letter-spacing:.01em;box-shadow:0 6px 18px #29202440;backdrop-filter:blur(6px)}
@media(prefers-reduced-motion:no-preference){
 .swipe-hint.is-playing .swipe-hand{animation:swipe-hand 2.6s .35s ease-in-out both}
 .swipe-hint.is-playing .swipe-ripple{animation:swipe-ripple 1.3s .55s ease-out 2}
 .swipe-hint.is-playing .swipe-label{animation:swipe-label .5s .15s cubic-bezier(.3,1.4,.5,1) both}
}
@media(prefers-reduced-motion:reduce){.swipe-hand{display:none}}
@keyframes swipe-hand{0%{transform:translate(0,8px) scale(.9);opacity:0}10%{transform:translate(0,0) scale(1);opacity:1}14%{transform:scale(.92)}34%{transform:translate(-110px,6px) rotate(-14deg) scale(.92);opacity:1}44%{transform:translate(-118px,4px) rotate(-14deg) scale(1);opacity:0}54%{transform:translate(0,0) scale(1);opacity:0}60%{transform:translate(0,0) scale(1);opacity:1}64%{transform:scale(.92)}84%{transform:translate(-110px,6px) rotate(-14deg) scale(.92);opacity:1}100%{transform:translate(-118px,4px) rotate(-14deg);opacity:0}}
@keyframes swipe-ripple{0%{opacity:0;transform:scale(.4)}8%{opacity:.9}35%{opacity:0;transform:scale(2.1)}100%{opacity:0}}
@keyframes swipe-label{from{opacity:0;transform:translate(-50%,10px)}to{opacity:1;transform:translateX(-50%)}}

/* Phones: size the reel card from the screen height (svh = with the browser bars showing) so the tagline
   lands fully on the first screen of tall phones (Galaxy S25 Ultra, iPhone Pro Max). 393px is the header,
   deck peek, progress bars, credit link, the two tagline lines and a little air; the card keeps 300px minimum. */
@media(max-width:760px){
 .reel-stack .waffle-film::before{display:none}
 .reel-stack .waffle-film{aspect-ratio:auto;height:440px;height:calc(100vh - 393px);height:clamp(300px,calc(100vh - 393px),460px);height:clamp(300px,calc(100svh - 393px),460px)}
}

/* Phones: a compact footer that fits below the header on tall phones, so the chocolate stays visible at the very bottom. */
@media(max-width:600px){
 .site-footer{padding:112px 20px 16px}
 .site-footer .footer-main{grid-template-columns:1fr 1fr;gap:16px 16px}
 .site-footer .footer-brand{grid-column:1/-1}
 .site-footer .footer-brand img{width:112px}
 .site-footer .footer-links{grid-column:1/-1}
 .site-footer .footer-links p{columns:2;column-gap:16px}
 .site-footer h2{margin-bottom:4px}
 .site-footer p{line-height:1.55}
 .site-footer .footer-bottom{margin-top:16px;padding-top:12px;gap:6px}
}
/* The lit (inverted) state must beat the Order page's white card, or its cream text lands on white. */
.order-page .order-split>.is-lit{background:var(--ink);color:var(--cream);border-color:var(--ink)}
/* Very narrow phones (folded Galaxy Z Fold): keep "Call <store>" and the number each on one line. */
@media(max-width:380px){.pickup-store .button{flex-wrap:wrap;justify-content:center;gap:2px 10px;font-size:14px;padding-left:12px;padding-right:12px}.pickup-store .button .call-number{white-space:nowrap}.pickup-store .button span,.pickup-store .button b{white-space:nowrap}}


/* Second-round client revisions: featured flavours and a single waffle photo. */
.featured-tag{display:inline-block;margin:8px 8px 0 0;padding:4px 9px;border-radius:99px;background:var(--mint);color:var(--green);font:500 11px/1.5 var(--sans);vertical-align:middle}
.waffle-menu-split{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,1fr);gap:clamp(24px,5vw,64px);align-items:start}
.waffle-menu-photo{margin:24px 0 0;position:sticky;top:140px}
.waffle-menu-photo img{display:block;width:100%;height:auto;aspect-ratio:3/2;object-fit:cover;border-radius:24px;box-shadow:0 14px 35px -22px #376b42aa}
.waffle-menu-photo figcaption{font-size:13px;color:var(--muted);padding:14px 4px}
.waffle-menu-split .menu-items{grid-template-columns:1fr;gap:0}
.waffle-menu-split .menu-item{padding-top:22px;padding-bottom:22px;min-height:0;grid-template-columns:1fr}
.flavour-art{height:100%;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:20px;text-align:center;padding:28px;background:radial-gradient(ellipse at 50% 25%,#fffaf3 0%,#f6dde4 72%);color:var(--ink)}
.flavour-art-scoops{background:radial-gradient(ellipse at 50% 25%,#fffaf3 0%,#dcefdc 72%)}
.flavour-art-symbol{font-size:clamp(65px,9vw,115px);line-height:1.2;filter:drop-shadow(0 12px 12px #73544120)}
.flavour-art-title{font-family:var(--serif);font-size:clamp(24px,3vw,40px);line-height:1.15}
.flavour-art-note{font:500 11px/1.5 var(--sans);letter-spacing:.12em;text-transform:uppercase}
@media(max-width:760px){.waffle-menu-split{grid-template-columns:1fr;gap:12px}.waffle-menu-photo{position:static;margin-top:20px}.waffle-menu-photo img{max-height:340px}.flavour-art-symbol{font-size:90px}}

/* Menu category cards (October 22): with more than eight, v3.js splits the grid into two rows that slide one card at a
   time and loop. Without JS it stays the plain grid above. Column count and gaps match the grid at each width. */
.category-grid.is-sliding{--cat-cols:4;--cat-gx:24px;--cat-gy:40px;display:flex;flex-direction:column;gap:var(--cat-gy);overflow:hidden;touch-action:pan-y;padding-top:10px;padding-bottom:22px;margin-top:-10px;margin-bottom:-22px}
.cat-track{display:grid;grid-auto-flow:column;grid-auto-columns:calc((100% - (var(--cat-cols) - 1) * var(--cat-gx)) / var(--cat-cols));gap:var(--cat-gy) var(--cat-gx);transition:transform .75s cubic-bezier(.45,0,.2,1);will-change:transform}
.cat-controls{display:flex;justify-content:center;gap:12px;margin-top:28px}
.cat-controls button{height:44px;min-width:44px;border:1px solid var(--green);border-radius:var(--radius);background:transparent;color:var(--ink);padding:0 14px}
.cat-controls button:hover{background:var(--mint)}
@media(max-width:1000px){.category-grid.is-sliding{--cat-gx:18px;--cat-gy:32px}}
@media(max-width:760px){.category-grid.is-sliding{--cat-cols:2}}
@media(max-width:640px){.category-grid.is-sliding{--cat-gx:14px;--cat-gy:28px}.cat-controls{margin-top:22px}}
@media(prefers-reduced-motion:reduce){.cat-track{transition:none}}

/* Menu photos (October 23): each thumbnail is a button. With a mouse, resting on it shows a bigger photo beside it;
   a click, tap or Enter opens the photo full size in a dialog. Built by v3.js; the menu reads the same without it. */
.item-photo-button{display:block;width:76px;height:76px;padding:0;border:0;border-radius:var(--radius);background:none;cursor:zoom-in;transition:box-shadow .2s ease}
.item-photo-button .item-photo{display:block}
.item-photo-button:hover{box-shadow:0 0 0 2px var(--cream),0 0 0 4px var(--baby-pink);outline:0}
.item-photo-button:focus-visible{box-shadow:0 0 0 2px var(--cream),0 0 0 4px var(--baby-pink);outline:0}
.photo-peek{position:fixed;left:0;top:0;z-index:60;width:300px;padding:8px 8px 12px;background:#fff;border-radius:calc(var(--radius) + 4px);box-shadow:0 2px 6px #2920241a,0 18px 40px -12px #29202452,0 0 0 1px #2920240d;pointer-events:none;opacity:0;transform:scale(.96);transition:opacity .16s ease,transform .2s var(--ease-out)}
.photo-peek.is-shown{opacity:1;transform:none}
.photo-peek .peek-frame,.photo-view .view-frame{aspect-ratio:1;border-radius:var(--radius);overflow:hidden;background:#f0eadf}
.photo-peek img,.photo-view img{display:block;width:100%;height:100%;object-fit:cover;opacity:0;transition:opacity .2s ease}
.photo-peek img.is-loaded,.photo-view img.is-loaded{opacity:1}
.photo-peek .peek-name,.photo-view .view-name{display:block;font-weight:600;font-size:16px;line-height:1.3;margin:10px 4px 0}
.photo-peek .peek-group,.photo-view .view-group{display:block;font-size:13px;color:var(--muted);margin:2px 4px 0}
.photo-view{width:min(520px,calc(100vw - 32px));max-height:calc(100vh - 32px);max-height:calc(100dvh - 32px);padding:10px 10px 14px;border:0;border-radius:calc(var(--radius) + 4px);background:#fff;color:var(--ink);box-shadow:0 30px 60px -20px #29202466;overflow:auto}
.photo-view::backdrop{background:#292024a6}
.photo-view.is-modal{position:fixed;top:50%;left:50%;margin:0;transform:translate(-50%,-50%)}
.photo-view .view-frame{max-height:calc(100vh - 140px);max-height:calc(100dvh - 140px);aspect-ratio:auto}
.photo-view .view-frame img{aspect-ratio:1;max-height:calc(100vh - 140px);max-height:calc(100dvh - 140px);object-fit:contain;background:#f0eadf}
.photo-view .view-foot{display:flex;align-items:start;justify-content:space-between;gap:12px}
.photo-view .view-close{flex:none;margin-top:8px;height:40px;min-width:40px;padding:0 14px;border:1px solid var(--green);border-radius:var(--radius);background:transparent;color:var(--ink);font:inherit;font-size:14px;cursor:pointer}
.photo-view .view-close:hover{background:var(--mint)}
.photo-view[open]{animation:view-in .22s var(--ease-out)}
@keyframes view-in{from{opacity:0;transform:scale(.97)}}
@media(max-width:640px){.item-photo-button{width:60px;height:60px}}
@media(prefers-reduced-motion:reduce){.photo-peek,.photo-peek img,.photo-view img{transition:none}.photo-peek{transform:none}.photo-view[open]{animation:none}}

/* Molten Lava Cake (October 25): a feature panel instead of a one-item list, the big photo beside its name. */
.lava-feature{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,1fr);gap:clamp(24px,5vw,64px);align-items:center;padding-top:28px;border-top:3px solid var(--ink)}
.lava-photo{margin:0}
.lava-photo img{display:block;width:100%;height:auto;aspect-ratio:3/2;object-fit:cover;border-radius:24px;box-shadow:0 14px 35px -22px #2920248c}
.lava-feature .menu-items{display:block}
.lava-feature .lava-item{display:block;border:0;padding:0}
.lava-item h4{display:block;font-family:var(--serif);font-weight:400;font-size:clamp(32px,4vw,46px);line-height:1.05;margin:0 0 14px}
.lava-item p{font-size:17px;line-height:1.6;max-width:42ch}
@media(max-width:760px){.lava-feature{grid-template-columns:1fr;gap:18px;padding-top:20px}.lava-item h4{font-size:30px;margin-bottom:8px}.lava-item p{font-size:15px}}
