/* Magic Smoothies — DARK COSMIC "magic" theme (production, real-only).
   Deep-purple starfield, big gradient serif type, gold accents, glowing cards,
   handwritten "magic" script notes. Matches the flagship demo's mood with the
   client's REAL logo as the glowing centerpiece (no AI mascot/fruit, no stock). */
:root{
  --bg0:#190724;--bg1:#240A30;--bg2:#3A0F4A;
  --cream:#FBF1E7;--ink:#FBF1E7;--muted:#C3AAD6;--muted2:#9C84B4;
  --gold:#F4B740;--pink:#E76FBE;--purple:#A074F2;
  --berry:#E84C8A;--mango:#FF8A3D;--green:#46C265;--teal:#33C0BA;--plum:#2C0E2B;
  --line:rgba(255,255,255,.12);--card:rgba(255,255,255,.05);--cardline:rgba(255,255,255,.13);
  --gold-on-warm:#FFE9A8;
  --s-section:88px;
  --elev-flat:0 14px 40px rgba(0,0,0,.35);
  --elev-glow:0 18px 44px rgba(0,0,0,.4),0 0 44px rgba(231,111,190,.18);
}
*{box-sizing:border-box;}
html{scroll-behavior:smooth;overflow-x:hidden;}
body{margin:0;font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;color:var(--cream);background:#160620;font-size:16px;line-height:1.6;overflow-x:hidden;position:relative;padding-top:69px;}
/* cosmic backdrop + starfield (fixed) */
body::before{content:"";position:fixed;inset:0;z-index:-2;pointer-events:none;background:
  radial-gradient(130% 80% at 82% -8%,#5A2270 0%,rgba(90,34,112,0) 55%),
  radial-gradient(110% 70% at 8% 2%,#3A0F4A 0%,rgba(58,15,74,0) 52%),
  linear-gradient(180deg,#220A2E 0%,#180722 55%,#120420 100%);}
body::after{content:"";position:fixed;inset:0;z-index:-1;pointer-events:none;opacity:.55;background-image:
  radial-gradient(1px 1px at 24px 32px,rgba(255,255,255,.55),transparent),
  radial-gradient(1px 1px at 92px 128px,rgba(255,255,255,.4),transparent),
  radial-gradient(1.6px 1.6px at 168px 64px,rgba(244,183,64,.55),transparent),
  radial-gradient(1px 1px at 130px 210px,rgba(255,255,255,.32),transparent),
  radial-gradient(1.4px 1.4px at 50px 180px,rgba(231,111,190,.5),transparent);
  background-size:220px 240px;}
h1,h2,h3,h4{font-family:'Fraunces',Georgia,serif;line-height:1.06;letter-spacing:-.01em;margin:0;color:var(--cream);}
em{font-style:italic;color:var(--pink);}
@supports ((-webkit-background-clip:text) or (background-clip:text)){
  em{background:linear-gradient(100deg,var(--pink),var(--purple),#7BB8FF,var(--purple),var(--pink));background-size:280% 100%;-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;color:transparent;animation:flowText 9s ease-in-out infinite;}
}
a{color:inherit;}
img{max-width:100%;height:auto;}
:focus-visible{outline:3px solid var(--gold);outline-offset:2px;border-radius:4px;}
.skip{position:absolute;left:-9999px;top:0;background:var(--gold);color:#2C0E2B;padding:10px 16px;border-radius:0 0 10px 0;z-index:100;font-weight:800;}
.skip:focus{left:0;}
.vh{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0;}
.eyebrow{display:inline-block;font-weight:800;font-size:12px;letter-spacing:.16em;text-transform:uppercase;color:var(--gold);margin-bottom:12px;}
.lede{font-size:1.12rem;color:var(--muted);max-width:48ch;}
.script{font-family:'Caveat',cursive;font-size:1.7rem;color:var(--gold);margin:0;line-height:1;}
@supports ((-webkit-background-clip:text) or (background-clip:text)){
  .script{background:linear-gradient(100deg,var(--gold),#FFE9A8,var(--gold),#FFD36A,var(--gold));background-size:220% 100%;-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;color:transparent;animation:flowText 6s ease-in-out infinite;}
}

/* eyebrow pill */
.pill{display:inline-flex;align-items:center;gap:8px;background:rgba(255,255,255,.06);border:1px solid var(--cardline);border-radius:999px;padding:7px 15px;font-size:.74rem;font-weight:800;letter-spacing:.12em;text-transform:uppercase;color:var(--gold);}
.pill .dot{width:8px;height:8px;border-radius:50%;background:var(--green);box-shadow:0 0 8px var(--green);}

/* nav */
.nav{position:fixed;top:0;left:0;right:0;z-index:50;display:flex;align-items:center;justify-content:space-between;gap:16px;padding:10px 22px;background:rgba(22,6,32,.72);backdrop-filter:blur(12px);border-bottom:1px solid var(--line);}
.brand{display:flex;align-items:center;text-decoration:none;}
.brand img{height:48px;width:auto;display:block;filter:drop-shadow(0 2px 10px rgba(231,111,190,.35));}
.links{display:flex;align-items:center;gap:22px;}
.links a{text-decoration:none;font-weight:600;color:#E9DCF2;font-size:.95rem;padding:11px 0;}
.links a.on{color:var(--gold);}
.links a.cta{background:linear-gradient(120deg,var(--gold),#FFD36A);color:#2C0E2B;padding:9px 18px;border-radius:999px;font-weight:800;box-shadow:0 6px 20px rgba(244,183,64,.3);}
/* position:relative+z-index:61 keeps the animated X painted ABOVE the open drawer (.links.is-open
   z-index:60) within the shared .nav stacking context, so it stays visible + tappable on mobile. */
.burger{display:none;position:relative;z-index:61;flex-direction:column;gap:5px;cursor:pointer;padding:14px 10px;margin:-14px -10px;background:none;border:0;align-items:center;justify-content:center;}
.burger span{width:24px;height:2px;background:#E9DCF2;border-radius:2px;transition:transform .25s ease,opacity .2s ease;}
.burger[aria-expanded="true"] span:nth-child(1){transform:translateY(7px) rotate(45deg);}
.burger[aria-expanded="true"] span:nth-child(2){opacity:0;}
.burger[aria-expanded="true"] span:nth-child(3){transform:translateY(-7px) rotate(-45deg);}

/* buttons */
.btn{position:relative;overflow:hidden;display:inline-block;text-decoration:none;font-weight:800;border-radius:999px;padding:13px 26px;font-size:.98rem;transition:transform .12s ease,box-shadow .12s ease;}
.btn:hover{transform:translateY(-2px);}
.btn--solid,.btn--gold{background:linear-gradient(120deg,var(--gold),#FFD36A);color:#2C0E2B;box-shadow:0 10px 28px rgba(244,183,64,.28);}
.btn--ghost{background:rgba(255,255,255,.05);color:var(--cream);border:2px solid var(--cardline);}
.btn--ghost:hover{border-color:var(--gold);background:rgba(244,183,64,.08);}
.btn--cream{background:var(--cream);color:#2C0E2B;}
/* periodic "flash" sheen sweep across the primary CTAs */
.btn--solid::after,.btn--gold::after,.btn--cream::after{content:"";position:absolute;top:0;left:-80%;width:55%;height:100%;background:linear-gradient(110deg,transparent,rgba(255,255,255,.6),transparent);transform:skewX(-18deg);pointer-events:none;animation:sheen 4.6s ease-in-out infinite;}
@keyframes sheen{0%,24%{left:-80%}46%,100%{left:170%}}
[hidden]{display:none!important;}
.btn:disabled,.btn[aria-disabled="true"]{opacity:.42;cursor:not-allowed;box-shadow:none;filter:saturate(.7);animation:none!important;}
.btn:disabled:hover{transform:none;}

/* hero */
.hero{position:relative;overflow:hidden;padding:48px 22px 56px;text-align:center;}
.hero__inner{position:relative;z-index:2;max-width:780px;margin:0 auto;}
.hero__crest{position:relative;width:min(520px,96vw);aspect-ratio:1;margin:0 auto 6px;display:flex;align-items:center;justify-content:center;}
.hero__logo{position:relative;z-index:3;width:min(360px,74vw);height:auto;margin:0;display:block;filter:drop-shadow(0 0 46px rgba(231,111,190,.55)) drop-shadow(0 12px 30px rgba(0,0,0,.5));animation:floaty 6.5s ease-in-out infinite;}
.hero__glow{position:absolute;width:120%;height:120%;border-radius:50%;background:radial-gradient(circle,rgba(231,111,190,.4) 0%,rgba(160,116,242,.14) 38%,transparent 62%);filter:blur(48px);z-index:0;animation:glowPulse 6.5s ease-in-out infinite;}
.orbit{position:absolute;top:50%;left:50%;width:clamp(40px,10.5vw,62px);height:auto;object-fit:contain;z-index:2;filter:drop-shadow(0 6px 14px rgba(0,0,0,.45));transform:translate(-50%,-50%);will-change:transform;}
.orbit--1{top:7%;left:50%;animation-delay:0s;}
.orbit--2{top:23%;left:84%;animation-delay:.5s;}
.orbit--3{top:60%;left:92%;animation-delay:1s;}
.orbit--4{top:89%;left:69%;animation-delay:1.5s;}
.orbit--5{top:89%;left:31%;animation-delay:2s;}
.orbit--6{top:60%;left:8%;animation-delay:2.5s;}
.orbit--7{top:23%;left:16%;animation-delay:3s;}
@keyframes bob{0%,100%{margin-top:0}50%{margin-top:-9px}}
.hero .lede{margin:8px auto 0;}
/* hero magical place-name (moved out of the top bar 2026-07-17 per Ron — big magical Cinzel Decorative) */
.hero__place{margin:16px 0 4px;display:flex;flex-direction:column;align-items:center;gap:7px;}
.hero__place-name{font-family:'Cinzel Decorative','Fraunces',serif;font-weight:700;font-size:clamp(2rem,8.4vw,3.5rem);line-height:1.04;background:linear-gradient(100deg,#FFE9A8,#F4B740 42%,#FFD36A 66%,#F7C6E8);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;color:transparent;filter:drop-shadow(0 3px 20px rgba(244,183,64,.42));letter-spacing:.005em;text-wrap:balance;}
.hero__place-sub{font-family:'Plus Jakarta Sans',sans-serif;font-weight:800;font-size:.62rem;letter-spacing:.44em;text-transform:uppercase;color:var(--gold);opacity:.82;padding-left:.44em;}
.hero__cta{display:flex;gap:12px;justify-content:center;flex-wrap:wrap;}
.hero__chips{display:flex;gap:10px;justify-content:center;flex-wrap:wrap;margin:24px auto 0;}
.hero__chips span{background:rgba(255,255,255,.06);border:1px solid var(--cardline);border-radius:999px;padding:7px 14px;font-size:.82rem;font-weight:600;color:#E9DCF2;}
.hero__blob{position:absolute;border-radius:50%;filter:blur(18px);opacity:.5;z-index:1;}
.hero__blob--1{width:340px;height:340px;top:-100px;right:-40px;background:radial-gradient(circle,rgba(231,111,190,.5),transparent 70%);}
.hero__blob--2{width:280px;height:280px;bottom:-110px;left:-70px;background:radial-gradient(circle,rgba(160,116,242,.45),transparent 70%);}
.hero__blob--3{width:200px;height:200px;top:40px;left:10%;background:radial-gradient(circle,rgba(244,183,64,.32),transparent 70%);}
.spark{position:absolute;z-index:1;color:var(--gold);opacity:0;animation:sparkle 4s ease-in-out infinite;text-shadow:0 0 12px rgba(244,183,64,.7);}
.spark--1{top:70px;left:15%;font-size:22px;animation-delay:.2s;}
.spark--2{top:120px;right:13%;font-size:30px;animation-delay:1.2s;}
.spark--3{top:44px;right:30%;font-size:16px;animation-delay:2.1s;}
.spark--4{top:220px;left:23%;font-size:26px;animation-delay:.8s;color:var(--pink);text-shadow:0 0 12px rgba(231,111,190,.75);}
.spark--5{top:310px;right:21%;font-size:19px;animation-delay:2.6s;}
.spark--6{top:16%;left:47%;font-size:15px;animation-delay:1.6s;}
/* hero starfield layers (denser + magic, over the global body starfield) + rotating halo behind the logo */
.hero__sky{position:absolute;inset:0;overflow:hidden;pointer-events:none;z-index:0;}
.stars{position:absolute;top:0;left:0;border-radius:50%;background:transparent;}
.stars--far{width:1px;height:1px;opacity:.55;animation:starTw 5.5s ease-in-out infinite,starFloat 26s ease-in-out infinite;}
.stars--mid{width:1.6px;height:1.6px;opacity:.75;animation:starTw 4s ease-in-out infinite .8s,starFloat 20s ease-in-out infinite reverse;}
.stars--near{width:2.6px;height:2.6px;opacity:.95;animation:starTw 3s ease-in-out infinite .3s,starFloat 15s ease-in-out infinite;}
.hero__halo{position:absolute;width:142%;height:142%;border-radius:50%;z-index:0;background:conic-gradient(from 0deg,transparent 0deg,rgba(244,183,64,.2) 40deg,transparent 90deg,rgba(231,111,190,.2) 140deg,transparent 190deg,rgba(160,116,242,.2) 250deg,transparent 300deg,rgba(244,183,64,.2) 350deg,transparent 360deg);filter:blur(20px);opacity:.6;-webkit-mask:radial-gradient(circle,#000 20%,rgba(0,0,0,.4) 48%,transparent 70%);mask:radial-gradient(circle,#000 20%,rgba(0,0,0,.4) 48%,transparent 70%);animation:haloSpin 46s linear infinite;}
@keyframes sparkle{0%,100%{opacity:0;transform:scale(.55) rotate(0)}50%{opacity:.95;transform:scale(1) rotate(18deg)}}
@keyframes starTw{0%,100%{opacity:.3}50%{opacity:.95}}
@keyframes starFloat{0%,100%{transform:translate(0,0)}50%{transform:translate(5px,-14px)}}
@keyframes haloSpin{to{transform:rotate(360deg)}}
@keyframes floaty{0%,100%{transform:translateY(0)}50%{transform:translateY(-11px)}}
@keyframes glowPulse{0%,100%{opacity:.82;transform:scale(1)}50%{opacity:1;transform:scale(1.08)}}
@media(prefers-reduced-motion:reduce){.stars,.hero__halo,.hero__logo,.hero__glow{animation:none!important}.stars--far{opacity:.5}.stars--mid{opacity:.6}.stars--near{opacity:.8}}
@keyframes twinkle{0%,100%{opacity:0;transform:scale(.6)}50%{opacity:.95;transform:scale(1)}}

.shot{margin:0 auto;}
.shot--wide{position:relative;z-index:2;max-width:760px;margin:38px auto 0;padding:0 22px;}
.shot--wide img{width:100%;border-radius:22px;box-shadow:0 24px 60px rgba(0,0,0,.5),0 0 0 1px var(--cardline),0 0 50px rgba(231,111,190,.25);display:block;}
.shot--wide figcaption{text-align:center;color:var(--muted);font-size:.85rem;margin-top:12px;font-style:italic;}
.shot--feature{max-width:360px;margin:6px auto 26px;padding:0 22px;}
.shot--feature img{width:100%;border-radius:20px;box-shadow:0 18px 44px rgba(0,0,0,.5),0 0 40px rgba(160,116,242,.25);display:block;}
/* product-shot variant: transparent cutout floating on a cosmic glow (menu feature figures) */
.shot--product img{border-radius:24px;box-shadow:none;object-fit:contain;max-height:440px;padding:20px;
  background:radial-gradient(120% 92% at 50% 22%,rgba(231,111,190,.18),rgba(160,116,242,.07) 52%,transparent 74%);
  filter:drop-shadow(0 16px 20px rgba(0,0,0,.5));}
/* hero product lineup — a rainbow row of the nicest smoothies with a few bowls IN FRONT (2026-07-10, Ron).
   Sits between the hero intro and the CTAs. Smoothies = back row (z1/2); bowls pulled up + z3/4 = front. */
.hero__lineup{position:relative;width:100%;max-width:940px;margin:20px auto 6px;padding:0 6px;}
.hl__glow{position:absolute;top:2%;left:50%;transform:translateX(-50%);width:92%;height:78%;border-radius:50%;pointer-events:none;z-index:0;
  background:radial-gradient(circle,rgba(231,111,190,.26),rgba(160,116,242,.11) 48%,transparent 72%);filter:blur(44px);animation:glowPulse 7s ease-in-out infinite;}
.hl__row{position:relative;display:flex;justify-content:center;align-items:flex-end;}
.hl__row--s{z-index:1;}
/* uniform 1:1 squares — BIG + heavily OVERLAPPING (owner: "pořádně velký & na sobě, ne vedle").
   The transparent square margins mean big negative margins are needed before the cups actually overlap.
   Center is brought to the FRONT via z-index (same size), tapering back toward the edges. */
.hl__s{position:relative;width:34%;height:auto;margin:0 -12.5%;z-index:2;filter:drop-shadow(0 15px 18px rgba(0,0,0,.55));}
.hl__s--edge{z-index:1;}
.hl__s--hero{z-index:3;}
.hl__row--b{margin-top:-21%;z-index:4;}
.hl__b{position:relative;width:36%;height:auto;margin:0 -11.5%;z-index:2;filter:drop-shadow(0 17px 20px rgba(0,0,0,.6));}
.hl__b--edge{z-index:1;}
.hl__b--mid{z-index:3;}
.hero__lineup figcaption{position:relative;z-index:5;text-align:center;color:var(--muted);font-size:.85rem;margin-top:0;font-style:italic;}
@media(max-width:620px){
  .hl__s--edge,.hl__b--edge{display:none;}   /* mobile: tighter cluster — 3 smoothies + 2 bowls */
  .hl__s{width:46%;margin:0 -13%;}
  .hl__b{width:50%;margin:0 -12%;}
  .hl__row--b{margin-top:-24%;}
}
.shot--feature figcaption{text-align:center;color:var(--muted);font-size:.85rem;margin-top:10px;font-style:italic;}
.shot--feature figcaption{text-align:center;color:var(--muted);font-size:.85rem;margin-top:10px;font-style:italic;}
.shot--story{max-width:760px;margin:26px auto;}
.shot--story img{width:100%;border-radius:22px;box-shadow:0 20px 50px rgba(0,0,0,.5),0 0 44px rgba(231,111,190,.22);display:block;}
.shot--story figcaption{text-align:center;color:var(--muted);font-size:.85rem;margin-top:10px;font-style:italic;}

/* glass cards (3-up) */
.threeup{max-width:720px;margin:var(--s-section) auto 0;padding:0 22px 10px;display:grid;grid-template-columns:repeat(2,1fr);gap:18px;}
.catnav-sec{margin:32px auto 0;}
.catnav{max-width:940px;margin:0 auto;padding:0 22px;display:flex;flex-wrap:wrap;justify-content:center;gap:12px;}
.catnav a{display:inline-flex;align-items:center;gap:8px;padding:13px 22px;border-radius:14px;font-family:'Fraunces',Georgia,serif;font-weight:700;font-size:1.05rem;color:var(--cream);background:var(--card);border:1px solid var(--cardline);text-decoration:none;box-shadow:var(--elev-flat);transition:transform .15s ease,border-color .15s ease,background .15s ease,box-shadow .15s ease;}
.catnav a:hover,.catnav a:focus-visible{transform:translateY(-3px);border-color:var(--gold);background:rgba(244,183,64,.10);box-shadow:0 12px 30px rgba(244,183,64,.20);}
@media (max-width:520px){.catnav a{font-size:.98rem;padding:11px 16px;}}
.card3{background:var(--card);border:1px solid var(--cardline);border-radius:20px;padding:24px;backdrop-filter:blur(6px);box-shadow:var(--elev-flat);}
.card3__ic{display:block;width:58px;height:58px;object-fit:contain;margin-bottom:14px;filter:drop-shadow(0 5px 14px rgba(0,0,0,.45));}
.card3 h3{font-size:1.25rem;margin-bottom:6px;}
.card3 p{color:var(--muted);font-size:.95rem;margin:0;}

/* gradient accent bands */
.band{margin:var(--s-section) 0 0;padding:58px 22px;color:#fff;text-align:center;position:relative;}
.band--berry{background:linear-gradient(135deg,#C42D6E,#7A1A52);}
.band--mango{background:linear-gradient(135deg,#C95A1A,#A8430F);}
.band--green{background:linear-gradient(135deg,#247A38,#155E5F);}
.band--plum{background:linear-gradient(135deg,#3A1148,#26092F);}
.band__inner{max-width:680px;margin:0 auto;position:relative;z-index:1;}
.band h2{font-size:clamp(1.6rem,4vw,2.4rem);margin-bottom:12px;color:#fff;}
.band--berry em,.band--mango em,.band--green em,.band--plum em{background:none;color:var(--gold-on-warm);-webkit-text-fill-color:var(--gold-on-warm);animation:none;}
.band p{opacity:.96;margin:0 auto 22px;max-width:48ch;color:#fff;}

.page-head{max-width:820px;margin:0 auto;padding:72px 22px 8px;text-align:center;}
.page-head h1{font-size:clamp(2.2rem,6vw,3.6rem);font-weight:900;}
.page-head h1 em{display:inline-block;}
.page-head .lede{margin:14px auto 0;}
.legend{margin:16px auto 0;font-size:.9rem;color:var(--muted);display:flex;gap:14px;justify-content:center;flex-wrap:wrap;align-items:center;}

.flag{display:inline-block;font-weight:800;font-size:.62rem;letter-spacing:.04em;padding:2px 6px;border-radius:6px;vertical-align:middle;}
.flag--df{background:#143A22;color:#7BE0A0;}
.flag--v{background:#3A1430;color:#F5A8D4;}
.flag--gf{background:#3A2A12;color:#F6C871;}
.flag--vg{background:#142A44;color:#9FC8FF;}
.sig{color:var(--gold);font-style:normal;font-weight:700;}
.ilink{color:var(--gold);text-decoration:underline;text-underline-offset:2px;font-weight:700;}

/* no-ice comparison */
.noice{max-width:1000px;margin:var(--s-section) auto 0;padding:0 22px;}
.noice__head{text-align:center;max-width:680px;margin:0 auto;}
.noice__head .lede{margin:14px auto 0;max-width:42ch;}
.noice__compare{display:flex;align-items:stretch;justify-content:center;gap:22px;margin-top:34px;}
.noice__col{flex:1;max-width:300px;text-align:center;background:var(--card);border:1px solid var(--cardline);border-radius:22px;padding:26px 22px;backdrop-filter:blur(6px);}
.noice__col--ours{position:relative;border:2px solid transparent;background:linear-gradient(160deg,rgba(255,255,255,.09),rgba(255,255,255,.02)) padding-box,linear-gradient(125deg,var(--gold),var(--berry),var(--purple)) border-box;box-shadow:var(--elev-glow);animation:winGlow 3.6s ease-in-out infinite;}
.noice__col--ours b{color:var(--gold);}
@supports ((-webkit-background-clip:text) or (background-clip:text)){
  .noice__col--ours b{background:linear-gradient(100deg,var(--gold),var(--pink),var(--gold));background-size:200% 100%;-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;color:transparent;animation:flowText 5s ease-in-out infinite;}
}
.noice__col .noice__win{display:inline-block;margin-bottom:10px;background:linear-gradient(120deg,var(--gold),#FFD36A);color:#2C0E2B;font-weight:800;font-size:.72rem;letter-spacing:.05em;padding:4px 13px;border-radius:999px;box-shadow:0 4px 14px rgba(244,183,64,.32);}
@keyframes winGlow{0%,100%{box-shadow:0 18px 44px rgba(0,0,0,.4),0 0 28px rgba(244,183,64,.2)}50%{box-shadow:0 18px 50px rgba(0,0,0,.45),0 0 52px rgba(244,183,64,.44)}}
.noice__cta{text-align:center;margin-top:30px;}
.noice__col b{display:block;font-family:'Fraunces',serif;font-size:1.2rem;margin:16px 0 4px;}
.noice__col span{color:var(--muted);font-size:.9rem;}
.noice__col--theirs{opacity:.78;}
.noice__vs{align-self:center;font-family:'Fraunces',serif;font-style:italic;color:var(--muted);font-size:1.1rem;flex:none;}
.cup{position:relative;width:86px;height:116px;margin:0 auto;border:3px solid rgba(255,255,255,.45);border-top:none;border-radius:8px 8px 24px 24px/6px 6px 40px 40px;overflow:hidden;background:rgba(255,255,255,.04);}
.cup__fill{position:absolute;left:0;right:0;bottom:0;}
.cup__fill--full{height:86%;background:linear-gradient(180deg,#FF8A3D,#E84C8A 55%,#A074F2);box-shadow:0 0 26px rgba(231,111,190,.5),inset 0 6px 14px rgba(255,255,255,.18);}
.cup__fill--full::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,transparent 34%,rgba(255,255,255,.5) 50%,transparent 66%);transform:translateY(120%);animation:cupShimmer 3.6s ease-in-out infinite;}
@keyframes cupShimmer{0%,30%{transform:translateY(120%)}72%,100%{transform:translateY(-120%)}}
.cup__fill--ice{height:50%;background:linear-gradient(180deg,#b6cdd9,#93b3c4);}
.cup__shine{position:absolute;top:10px;left:13px;width:7px;height:48px;background:linear-gradient(180deg,rgba(255,255,255,.7),rgba(255,255,255,0));border-radius:999px;transform:rotate(8deg);filter:blur(.4px);}
.cup__ice{position:absolute;width:15px;height:15px;background:rgba(255,255,255,.92);border:1px solid #cfe0e8;border-radius:4px;top:48%;left:18px;transform:rotate(12deg);}
.cup__ice--2{top:60%;left:44px;transform:rotate(-16deg);}

/* açaí builder */
.ab{max-width:1020px;margin:var(--s-section) auto 0;padding:0 22px;}
.ab__head{text-align:center;max-width:680px;margin:0 auto;}
.ab__head .lede{margin:14px auto 0;max-width:42ch;}
.ab__stage{display:grid;grid-template-columns:300px 1fr;gap:30px;align-items:start;margin-top:30px;background:rgba(255,255,255,.045);border:1px solid var(--cardline);border-radius:26px;padding:28px;backdrop-filter:blur(8px);box-shadow:0 24px 60px rgba(0,0,0,.45),0 0 60px rgba(160,116,242,.12);}
.ab__bowlwrap{position:sticky;top:90px;background:radial-gradient(120% 90% at 50% 10%,rgba(231,111,190,.18),rgba(160,116,242,.06));border:1px solid var(--cardline);border-radius:20px;padding:10px;transition:box-shadow .6s ease,background .6s ease;}
.ab__bowl{width:100%;height:auto;display:block;overflow:visible;}
.ab__steps{display:flex;gap:8px;margin-bottom:18px;}
.ab__dot{flex:1;background:rgba(255,255,255,.05);border:1px solid var(--cardline);border-radius:999px;padding:9px 8px;font-weight:800;font-size:.8rem;color:var(--muted);cursor:pointer;white-space:nowrap;}
.ab__dot.is-on{background:linear-gradient(120deg,var(--gold),#FFD36A);color:#2C0E2B;border-color:transparent;}
.ab__pane{display:none;}
.ab__pane.is-on{display:block;}
.ab__grouptitle{font-weight:800;font-size:.72rem;letter-spacing:.1em;text-transform:uppercase;color:var(--gold);margin:14px 0 8px;}
.ab__bases{display:grid;grid-template-columns:1fr 1fr 1fr;gap:10px;}
.ab__base{background:rgba(255,255,255,.04);border:2px solid var(--cardline);border-radius:16px;padding:14px 10px;cursor:pointer;text-align:center;color:var(--cream);transition:border-color .15s,transform .1s;}
.ab__base:hover{transform:translateY(-2px);}
.ab__base.is-on{border-color:var(--gold);box-shadow:0 8px 24px rgba(244,183,64,.2);}
.ab__swatch{display:block;width:34px;height:34px;border-radius:50%;margin:0 auto 8px;box-shadow:inset 0 -3px 6px rgba(0,0,0,.25),0 0 14px rgba(255,255,255,.15);}
.ab__base b{display:block;font-family:'Fraunces',serif;font-size:.98rem;}
.ab__basedesc{display:block;color:var(--muted);font-size:.74rem;margin-top:2px;line-height:1.3;}
.ab__chips{display:flex;flex-wrap:wrap;gap:8px;}
.ab__chip{background:rgba(255,255,255,.05);border:1px solid var(--cardline);border-radius:999px;padding:8px 13px;font-size:.86rem;font-weight:600;color:var(--cream);cursor:pointer;display:inline-flex;align-items:center;gap:6px;transition:transform .1s;}
.ab__chip:hover{transform:translateY(-1px);}
.ab__chip.is-on{background:linear-gradient(120deg,#B81E5E,#5A3AA8);color:#fff;border-color:transparent;}
.ab__chipico{font-size:1rem;}
.ab__chipimg{width:22px;height:22px;object-fit:contain;vertical-align:middle;filter:drop-shadow(0 1px 3px rgba(0,0,0,.4));}
.ab__baseimg{display:block;width:50px;height:50px;object-fit:contain;margin:0 auto 8px;filter:drop-shadow(0 3px 8px rgba(0,0,0,.45));}
.ab__name{width:100%;padding:13px 16px;border:2px solid var(--cardline);border-radius:14px;font:inherit;font-size:1rem;background:rgba(255,255,255,.05);color:var(--cream);}
.ab__name::placeholder{color:var(--muted2);}
.ab__name:focus{border-color:var(--gold);outline:none;}
.ab__result{margin-top:14px;}
.ab__resulthint{color:var(--muted);font-size:.9rem;font-style:italic;}
.ab__card{background:linear-gradient(160deg,rgba(255,255,255,.07),rgba(255,255,255,.02));border:1px dashed var(--gold);border-radius:18px;padding:18px;}
.ab__cardtag{font-weight:800;font-size:.78rem;color:var(--gold);margin-bottom:8px;}
.ab__cardname{font-family:'Fraunces',serif;font-size:1.3rem;display:block;margin-bottom:8px;color:var(--cream);}
.ab__cardrow{margin:4px 0;font-size:.92rem;color:var(--cream);}
.ab__cardrow span{font-weight:800;color:var(--muted);text-transform:uppercase;font-size:.68rem;letter-spacing:.06em;margin-right:4px;}
.ab__cardflags{margin:10px 0 6px;display:flex;gap:5px;}
.ab__cardnote{color:var(--muted);font-size:.78rem;font-style:italic;margin:6px 0 0;}
.ab__flags{margin:16px 0 4px;min-height:22px;display:flex;align-items:center;gap:6px;font-size:.85rem;flex-wrap:wrap;color:var(--muted);}
.ab__flagslbl{font-weight:700;color:var(--muted);}
.ab__cardact{display:flex;align-items:center;gap:12px;margin-top:14px;flex-wrap:wrap;}
.ab__copy{background:rgba(244,183,64,.16);color:#FBE4AE;border:1px solid rgba(244,183,64,.45);border-radius:999px;padding:8px 16px;font:inherit;font-weight:800;font-size:.82rem;cursor:pointer;}
.ab__copy:hover{background:rgba(244,183,64,.26);}
.ab__copied{font-size:.8rem;color:#7BE0A0;font-weight:700;}
.ab--step3 .ab__flags{display:none;}
.ab__nav{display:flex;gap:10px;margin-top:16px;}
.ab__nav .btn{padding:11px 20px;}
.ab__note{text-align:center;color:var(--muted);font-size:.84rem;font-style:italic;margin-top:16px;}

/* flavor teaser */
.flavors{max-width:1040px;margin:var(--s-section) auto 0;padding:0 22px;}
.flavors__grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-top:30px;}
.fcard{display:block;text-decoration:none;border-radius:20px;overflow:hidden;background:rgba(255,255,255,.045);border:1px solid var(--cardline);box-shadow:0 18px 40px rgba(0,0,0,.4);transition:transform .16s ease,box-shadow .16s ease;}
.fcard:hover{transform:translateY(-5px);box-shadow:0 26px 56px rgba(0,0,0,.55),0 0 36px rgba(231,111,190,.3);}
/* real product photos are transparent cutouts → present them as PRODUCT SHOTS: the cup/bowl floats
   (object-fit:contain) on a soft cosmic glow with a cast shadow, instead of a cropped photo (2026-07-10). */
.fcard__img{display:block;width:100%;aspect-ratio:1/1;object-fit:contain;padding:16px 16px 8px;
  background:radial-gradient(118% 96% at 50% 20%,rgba(231,111,190,.16),rgba(160,116,242,.06) 52%,transparent 74%);
  filter:drop-shadow(0 12px 16px rgba(0,0,0,.5));transition:transform .3s cubic-bezier(.2,.7,.2,1);}
.fcard:hover .fcard__img{transform:translateY(-4px) scale(1.03);}
.fcard h3{font-size:1.4rem;font-weight:700;margin-bottom:5px;color:var(--cream);}
.fcard__body{padding:14px 18px 18px;}
.fcard__body p{color:var(--muted);font-size:.9rem;margin:0 0 11px;}
.fcard__f{display:inline-block;font-weight:800;font-size:.72rem;letter-spacing:.04em;background:rgba(244,183,64,.16);color:#FBE4AE;border:1px solid rgba(244,183,64,.42);padding:4px 10px;border-radius:999px;}
.flavors__cta{text-align:center;margin-top:26px;}
/* calm mid-page section ems — only the hero h1/script + page-head h1 ems animate */
.noice h2 em,.ab h2 em,.flavors h2 em{animation:none;background-position:0 50%;}

/* menu */
.menu-wrap{max-width:900px;margin:0 auto;padding:18px 22px 20px;}
.menu-sec{margin-bottom:38px;}
.menu-sec h2{display:flex;justify-content:space-between;align-items:baseline;gap:12px;flex-wrap:wrap;font-size:1.7rem;color:var(--gold);margin-bottom:6px;padding-bottom:8px;border-bottom:2px solid var(--line);}
.menu-price{font-family:'Plus Jakarta Sans',sans-serif;font-weight:800;font-size:.9rem;letter-spacing:0;color:var(--cream);white-space:nowrap;}
.i-price{margin-left:auto;font-weight:800;color:var(--gold);font-size:.95rem;white-space:nowrap;padding-left:12px;}
.fcard__price{display:inline-block;font-weight:800;font-size:1.05rem;color:var(--gold);}
.menu-subnote{color:var(--muted);font-size:.92rem;margin:0 0 14px;}
.builder-cta{display:inline-flex;align-items:center;gap:9px;margin:2px 0 18px;font-family:'Fraunces',Georgia,serif;font-size:1.14rem;font-weight:700;color:var(--plum);background:linear-gradient(120deg,var(--gold),#FFD36A);padding:12px 22px;border-radius:12px;text-decoration:none;box-shadow:0 10px 28px rgba(244,183,64,.28);transition:transform .15s ease,box-shadow .15s ease;}
.builder-cta:hover{transform:translateY(-2px);box-shadow:0 14px 34px rgba(244,183,64,.36);}
.menu-sub{color:var(--pink);margin:20px 0 8px;text-transform:uppercase;letter-spacing:.08em;font-family:'Plus Jakarta Sans',sans-serif;font-weight:800;font-size:.8rem;-webkit-text-fill-color:initial;}
.items{list-style:none;padding:0;margin:0;}
.items li{padding:12px 0;border-bottom:1px dashed var(--line);}
.mi__main{display:flex;flex-direction:column;gap:3px;}
/* real product thumbnail floats left of the item text (2026-07-10); items without a photo just have .mi__main */
.items li.mi--img{display:flex;align-items:flex-start;gap:15px;}
.mi__thumb{width:66px;height:66px;flex:0 0 auto;object-fit:contain;margin-top:1px;filter:drop-shadow(0 6px 9px rgba(0,0,0,.5));transition:transform .25s cubic-bezier(.2,.7,.2,1);}
.items li.mi--img:hover .mi__thumb{transform:scale(1.08) translateY(-2px);}
@media(max-width:560px){.mi__thumb{width:54px;height:54px;}.items li.mi--img{gap:11px;}}
.i-top{display:flex;align-items:baseline;gap:10px;flex-wrap:wrap;}
.i-name{font-family:'Fraunces',serif;font-weight:700;font-size:1.12rem;color:var(--cream);}
.i-flags{display:inline-flex;gap:5px;}
.i-desc{color:var(--muted);font-size:.95rem;}
.steps{list-style:none;padding:0;margin:8px 0 4px;display:grid;grid-template-columns:1fr 1fr;gap:14px;}
.steps li{display:flex;gap:12px;align-items:flex-start;background:var(--card);border:1px solid var(--cardline);border-radius:14px;padding:14px 16px;font-size:.95rem;color:var(--cream);}
.steps b{font-family:'Fraunces',serif;}
.step__n{flex:none;width:26px;height:26px;border-radius:50%;background:linear-gradient(120deg,var(--berry),var(--purple));color:#fff;font-weight:800;display:flex;align-items:center;justify-content:center;font-size:.85rem;}
.boosts{color:var(--muted);font-size:.98rem;line-height:1.9;}
.menu-note{text-align:center;color:var(--muted);font-size:.9rem;font-style:italic;margin-top:14px;}

/* order */
.order-wrap{max-width:880px;margin:0 auto;padding:30px 22px 10px;display:grid;grid-template-columns:1fr 1fr;gap:20px;}
.order-card{background:var(--card);border:1px solid var(--cardline);border-radius:20px;padding:26px;backdrop-filter:blur(6px);box-shadow:var(--elev-flat);display:flex;flex-direction:column;}
.order-card--soon{background:linear-gradient(180deg,rgba(255,255,255,.06),rgba(255,255,255,.02));}
.order-card__tag{display:inline-block;align-self:flex-start;background:linear-gradient(120deg,var(--gold),#FFD36A);color:#2C0E2B;font-weight:800;font-size:.72rem;letter-spacing:.08em;text-transform:uppercase;padding:5px 12px;border-radius:999px;margin-bottom:12px;}
.order-card__tag--alt{background:linear-gradient(120deg,var(--berry),var(--purple));color:#fff;}
.order-card h3{font-size:1.3rem;margin-bottom:8px;}
.order-card p{color:var(--muted);margin:0 0 18px;}
.order-card .btn{width:100%;text-align:center;}
.order-card__btns{display:flex;flex-direction:column;gap:10px;margin-top:auto;}
.order-card__hint{display:block;margin-top:auto;font-size:.8rem;color:var(--muted);font-style:italic;}

/* story */
.story{max-width:820px;margin:0 auto;padding:20px 22px 8px;}
.story__big{font-family:'Fraunces',serif;font-size:1.4rem;line-height:1.45;color:var(--cream);}
.story__sub{color:var(--muted);font-size:1.06rem;line-height:1.6;margin:14px 0 0;max-width:62ch;}
.story__cols{display:grid;grid-template-columns:repeat(3,1fr);gap:22px;margin-top:30px;}
.story__cols h3{font-size:1.15rem;color:var(--pink);margin-bottom:6px;}
.story__cols p{color:var(--muted);font-size:.95rem;margin:0;}

/* visit */
.visit{max-width:980px;margin:0 auto;padding:26px 22px 10px;display:grid;grid-template-columns:1.1fr .9fr;gap:28px;align-items:start;}
.map-embed{border-radius:22px;overflow:hidden;border:1px solid var(--cardline);box-shadow:0 18px 44px rgba(0,0,0,.4);aspect-ratio:16/11;background:#241036;}
.map-embed iframe{width:100%;height:100%;border:0;display:block;}
.visit__cluster{position:relative;margin-top:14px;background:linear-gradient(160deg,rgba(255,255,255,.06),rgba(255,255,255,.02));border:1px solid var(--cardline);border-radius:18px;height:140px;overflow:hidden;}
.visit__road{position:absolute;left:0;right:0;top:50%;transform:translateY(-50%);height:40px;background:repeating-linear-gradient(90deg,rgba(255,255,255,.25) 0 22px,transparent 22px 44px) center/100% 3px no-repeat,rgba(255,255,255,.08);display:flex;align-items:center;justify-content:flex-start;padding-left:14px;color:var(--muted);font-weight:700;font-size:.78rem;letter-spacing:.05em;}
.pin{position:absolute;top:13%;transform:translateX(-50%);background:#2A123F;border:1px solid var(--cardline);border-radius:12px;padding:7px 11px;font-weight:800;font-size:.78rem;box-shadow:0 8px 18px rgba(0,0,0,.4);text-align:center;line-height:1.1;color:var(--cream);white-space:nowrap;}
.pin span{display:block;font-weight:600;font-size:.66rem;color:var(--muted);}
.pin--ronjon{left:2%;transform:none;top:56%;color:#8FBEFF;border-color:rgba(127,178,255,.5);background:#152036;}
.pin--ronjon span{color:#8FBEFF;font-style:italic;opacity:.85;}
.pin--guac{left:34%;color:var(--green);} .pin--us{left:60%;color:var(--gold);top:56%;border:2px solid var(--gold);} .pin--poke{left:auto;right:2%;transform:none;color:var(--teal);}
.visit__info h2{font-size:1.5rem;margin-bottom:6px;}
.visit__addr{font-family:'Fraunces',serif;font-weight:700;font-size:1.2rem;color:var(--cream);}
.visit__info h3{margin:18px 0 2px;font-size:1rem;color:var(--pink);font-weight:800;}
.visit__info p{color:var(--muted);margin:0;}
.visit__cta{display:flex;gap:10px;flex-wrap:wrap;margin-top:22px;}
.greviews{margin-top:24px;padding-top:18px;border-top:1px solid var(--line);}
.greviews h3{font-size:1rem;color:var(--gold);margin:0 0 4px;font-weight:800;}
.greviews p{color:var(--muted);font-size:.92rem;margin:0 0 10px;}

/* footer */
.foot{background:rgba(10,3,16,.6);border-top:1px solid var(--line);color:#D9C9E6;margin-top:70px;padding:46px 22px 30px;}
.foot__grid{max-width:980px;margin:0 auto;display:grid;grid-template-columns:1.4fr 1fr 1fr;gap:28px;}
.foot__logo{height:60px;width:auto;display:block;margin-bottom:10px;filter:drop-shadow(0 2px 10px rgba(231,111,190,.3));}
.foot p{color:#C3AAD6;font-size:.9rem;margin:0 0 6px;}
.foot h3{color:var(--gold);font-size:.95rem;margin:0 0 6px;font-weight:800;}
.foot__link{color:var(--gold);text-decoration:underline;text-underline-offset:2px;}
.foot__note{max-width:980px;margin:30px auto 0;padding-top:18px;border-top:1px solid var(--line);font-size:.82rem;color:var(--muted2);text-align:center;}
.foot__note em{background:none;color:var(--gold);-webkit-text-fill-color:var(--gold);animation:none;}

/* ── gentle ambient motion (light) ── */
body::after{animation:starDrift 160s linear infinite;}
.hero__blob{animation:blobPulse 17s ease-in-out infinite;}
.hero__blob--2{animation-duration:21s;animation-delay:-5s;}
.hero__blob--3{animation-duration:14s;animation-delay:-3s;}
.pill .dot{animation:dotPulse 2.6s ease-in-out infinite;}
.hero__cta .btn--solid{animation:ctaGlow 3.4s ease-in-out infinite;}
/* hero load-in (wordmark + crest + script have their own entrances; the rest stagger up) */
.hero__inner--center .hero__crest{animation:fadeIn 1.1s ease .28s both;}
.hero__inner--center .hero__motto,.hero__inner--center .lede,.hero__inner--center .hero__place,.hero__inner--center .hero__cta{opacity:0;animation:riseIn .85s cubic-bezier(.2,.7,.2,1) forwards;}
.hero__inner--center .hero__motto{animation-delay:.5s;}
.hero__inner--center .hero__place{animation-delay:.62s;}
.hero__inner--center .lede{animation-delay:.66s;}
.hero__inner--center .infotags{animation-delay:.78s;}
.hero__inner--center .hero__cta{animation-delay:.9s;}
/* scroll reveal (the .fx class is added by fx.js — never hides content without JS) */
.fx{opacity:0;transform:translateY(20px);transition:opacity .7s cubic-bezier(.2,.7,.2,1),transform .7s cubic-bezier(.2,.7,.2,1);}
.fx--in{opacity:1;transform:none;}
@keyframes flowText{0%{background-position:0% 50%}50%{background-position:100% 50%}100%{background-position:0% 50%}}
@keyframes starDrift{from{background-position:0 0,0 0,0 0,0 0,0 0}to{background-position:220px 240px,-220px 240px,220px -240px,-220px -240px,180px 200px}}
@keyframes blobPulse{0%,100%{transform:translateY(0) scale(1);opacity:.5}50%{transform:translateY(-16px) scale(1.07);opacity:.62}}
@keyframes dotPulse{0%,100%{box-shadow:0 0 6px var(--green);opacity:.85}50%{box-shadow:0 0 14px var(--green);opacity:1}}
@keyframes ctaGlow{0%,100%{box-shadow:0 10px 28px rgba(244,183,64,.28)}50%{box-shadow:0 10px 36px rgba(244,183,64,.52)}}
@keyframes riseIn{from{opacity:0;transform:translateY(18px)}to{opacity:1;transform:none}}
@keyframes fadeIn{from{opacity:0;transform:scale(.96)}to{opacity:1;transform:none}}

@media(max-width:760px){
  .nav{backdrop-filter:none;background:rgba(22,6,32,.96);gap:8px;padding:10px 14px;}
  /* mobile quick-links: always-visible horizontal strip (no hamburger) — Ron 2026-07-17 */
  .links{display:flex;flex:1;min-width:0;justify-content:space-between;align-items:center;gap:1px;overflow-x:auto;scrollbar-width:none;-webkit-overflow-scrolling:touch;}
  .links::-webkit-scrollbar{display:none;}
  .links a{font-size:.8rem;font-weight:700;padding:7px 6px;white-space:nowrap;border-radius:8px;}
  .links a.on{color:var(--gold);background:rgba(244,183,64,.12);}
  .links a.cta{display:none;}
  .burger{display:none;}
  .ab__dot{font-size:.74rem;padding:9px 5px;}
  .pin{font-size:.72rem;padding:6px 9px;}
  .visit__cluster{height:150px;}
  .threeup{grid-template-columns:1fr;margin-top:40px;}
  .noice__compare{flex-direction:column;align-items:center;}
  .noice__col{max-width:340px;width:100%;}
  .ab__stage{grid-template-columns:1fr;padding:18px;}
  /* mobile: keep the bowl pinned under the nav (compact) so it stays visible while the
     topping chips scroll below it — you always see what you're building. */
  .ab__bowlwrap{position:sticky;top:64px;z-index:5;max-width:172px;margin:0 auto;transition:max-width .3s ease;}
  .ab__bases{grid-template-columns:1fr;}
  .steps{grid-template-columns:1fr;}
  .order-wrap{grid-template-columns:1fr;}
  .story__cols{grid-template-columns:1fr;}
  .visit{grid-template-columns:1fr;}
  .flavors__grid{grid-template-columns:1fr;}
  .foot__grid{grid-template-columns:1fr;gap:20px;}
  .hero__chips{gap:7px;}
}
@media(prefers-reduced-motion:reduce){
  html{scroll-behavior:auto;}
  *,*::before,*::after{animation:none!important;transition-duration:.01ms!important;}
  .btn:hover,.ab__base:hover,.ab__chip:hover{transform:none;}
  .spark,.pstar,.rise,.orb,.aurora{display:none;}
  .wordmark,.hero__inner--center .hero__motto,.hero__inner--center .lede,.hero__inner--center .hero__place,.hero__inner--center .hero__cta,.hero__inner--center .script,.hero__crest{opacity:1!important;transform:none!important;}
  .fx{opacity:1!important;transform:none!important;}
}

/* ── sticky mobile action bar (Order · Call · Directions) ── */
.actionbar{display:none;}
.actionbar__ic{display:block;font-size:1.15rem;margin-bottom:1px;}
/* open-now badge */
.open-now{display:inline-block;font-family:'Plus Jakarta Sans',sans-serif;font-weight:800;font-size:.66rem;letter-spacing:.02em;padding:2px 9px;border-radius:999px;vertical-align:middle;margin-left:6px;-webkit-text-fill-color:initial;}
.open-now.is-open{background:rgba(70,194,101,.18);color:#7BE0A0;border:1px solid rgba(70,194,101,.4);}
.open-now.is-closed{background:rgba(255,255,255,.06);color:var(--muted);border:1px solid var(--cardline);}
/* live Google review cards (populated by fx.js only when a Places key is configured) */
.greviews__rating{font-weight:800;color:var(--gold);margin:2px 0 12px;font-size:1rem;}
.greview{margin:0 0 12px;padding:13px 15px;background:var(--card);border:1px solid var(--cardline);border-radius:14px;}
.greview__stars{color:var(--gold);letter-spacing:2px;font-size:.9rem;}
.greview blockquote{margin:6px 0;color:var(--cream);font-size:.92rem;line-height:1.5;}
.greview figcaption{color:var(--muted);font-size:.82rem;font-weight:700;}
.greview__date{font-weight:600;opacity:.8;}
.greviews__stars{color:var(--gold);letter-spacing:2px;margin-right:6px;}
/* Loved-on-Google band — REAL curated snapshot, server-rendered in build.mjs (GBP + REVIEWS). */
.gbrand{display:inline-flex;align-items:center;gap:9px;background:rgba(255,255,255,.1);border:1px solid rgba(255,255,255,.2);border-radius:999px;padding:6px 15px 6px 9px;font-weight:800;font-size:.78rem;letter-spacing:.03em;color:#fff;margin-bottom:16px;}
.gbrand svg{width:18px;height:18px;display:block;flex:0 0 auto;}
.greviews-band__cards:not(:empty){display:grid;gap:14px;text-align:left;max-width:920px;margin:8px auto 22px;grid-template-columns:1fr;}
@media(min-width:720px){.greviews-band__cards:not(:empty){grid-template-columns:repeat(auto-fit,minmax(240px,1fr));}}
.band__sub{margin:16px auto 0!important;font-size:.86rem;opacity:.9;}
/* Hero trust chip — the highest-impact social proof, right under the CTAs (only renders when GBP.rating is set). */
.gtrust{display:inline-flex;align-items:center;gap:9px;margin-top:18px;padding:8px 16px 8px 11px;border-radius:999px;background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.16);backdrop-filter:blur(6px);color:var(--cream);font-size:.9rem;font-weight:600;text-decoration:none;transition:transform .18s ease,border-color .18s ease,background .18s ease;box-shadow:0 6px 22px rgba(0,0,0,.25);}
.gtrust:hover{transform:translateY(-2px);border-color:rgba(255,233,168,.5);background:rgba(255,255,255,.11);}
.gtrust svg{width:19px;height:19px;flex:0 0 auto;display:block;}
.gtrust__stars{color:var(--gold);letter-spacing:1.5px;font-size:.95rem;}
.gtrust__txt b{color:#fff;font-weight:800;}
.band__sub a{color:var(--gold-on-warm);text-decoration:underline;text-underline-offset:3px;}
.greviews .ilink+.ilink{margin-left:16px;}
@media(max-width:760px){
  .actionbar{display:grid;grid-template-columns:1fr 1fr 1fr;position:fixed;left:0;right:0;bottom:0;z-index:70;background:rgba(22,6,32,.96);backdrop-filter:blur(10px);border-top:1px solid var(--cardline);padding:7px 6px calc(7px + env(safe-area-inset-bottom,0px));}
  .actionbar a{display:flex;flex-direction:column;align-items:center;justify-content:center;text-decoration:none;color:var(--cream);font-weight:700;font-size:.72rem;padding:5px 4px;border-radius:12px;min-height:44px;}
  .actionbar a:first-child{color:var(--gold);}
  .actionbar a:active{background:rgba(255,255,255,.07);}
  body{padding-bottom:66px;}
}

/* ── Custom brand line-icons (inline SVG, gold) — replace emoji in functional chrome ──────────── */
.ic{display:inline-block;width:1.05em;height:1.05em;vertical-align:-.16em;color:var(--gold);flex:0 0 auto;}
/* hero trust chips: icon + label, centered */
.hero__chips span{display:inline-flex;align-items:center;gap:7px;}
.hero__chips .ic{width:15px;height:15px;}
/* footer + visit headings: leading wayfinding icon */
.foot h3 .ic,.visit__info h3 .ic{width:16px;height:16px;vertical-align:-.18em;margin-right:7px;}
.visit__info h2 .ic-lg{display:inline-grid;place-items:center;width:34px;height:34px;margin-right:11px;border-radius:11px;background:linear-gradient(150deg,rgba(244,183,64,.22),rgba(231,111,190,.18));border:1px solid var(--cardline);vertical-align:-.32em;}
.visit__info h2 .ic-lg .ic{width:19px;height:19px;vertical-align:0;}
.visit__info h2{display:flex;align-items:center;}
/* sticky mobile action bar: gold niche icons above the label */
.actionbar__ic .ic{width:23px;height:23px;}

/* ── Superfood badge showcase (the commissioned 3D set) ───────────────────────────────────────── */
.supers{max-width:1080px;margin:0 auto;padding:6px 22px 8px;}
.supers__row{list-style:none;display:flex;flex-wrap:wrap;justify-content:center;gap:14px 30px;margin:30px 0 0;padding:0;}
.supers__row li{display:flex;flex-direction:column;align-items:center;gap:11px;width:104px;text-align:center;}
.supers__row img{width:92px;height:92px;object-fit:contain;filter:drop-shadow(0 12px 22px rgba(0,0,0,.4));transition:transform .4s cubic-bezier(.2,.7,.2,1);}
.supers__row li:hover img,.supers__row li:focus-within img{transform:translateY(-7px) scale(1.06);}
.supers__row span{font-weight:800;font-size:.82rem;letter-spacing:.01em;color:var(--cream);}
.supers__row li.fx:nth-child(2){transition-delay:60ms;}
.supers__row li.fx:nth-child(3){transition-delay:120ms;}
.supers__row li.fx:nth-child(4){transition-delay:180ms;}
.supers__row li.fx:nth-child(5){transition-delay:240ms;}
.supers__row li.fx:nth-child(6){transition-delay:300ms;}
.supers__row li.fx:nth-child(7){transition-delay:360ms;}
@media (max-width:560px){
  .supers__row{gap:12px 14px;}
  .supers__row li{width:88px;}
  .supers__row img{width:76px;height:76px;}
}

/* ══ Centered hero — rainbow wordmark on top · mascot below · Taste-the-Magic centered (2026-07-03) ══ */
.hero__inner--center{max-width:900px;margin:0 auto;display:flex;flex-direction:column;align-items:center;text-align:center;gap:12px;}
@media(min-width:961px){.hero__inner--center{min-height:calc(100vh - 84px);justify-content:center;gap:12px;max-width:1180px;}}

/* brand lockup: mobile = wordmark stacked over logo · desktop = wordmark LEFT + logo RIGHT */
.hero__brand{display:flex;flex-direction:column;align-items:center;gap:4px;width:100%;}
@media(min-width:961px){.hero__brand{flex-direction:row;align-items:center;justify-content:center;gap:40px;}}

/* the signature: a huge animated rainbow wordmark, broken to two staggered lines (Magic ↖ · Smoothies ↘) */
.wordmark{font-family:'Fraunces',Georgia,serif;font-weight:900;font-style:italic;font-size:clamp(2.8rem,9.4vw,7.8rem);line-height:.96;letter-spacing:-.02em;margin:0;padding:0 2px .12em;text-align:left;max-width:100%;
  background:linear-gradient(115deg,#F4B740,#FF8A3D,#E76FBE,#A074F2,#7BB8FF,#33C0BA,#E76FBE,#F4B740);background-size:300% 100%;
  -webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;color:transparent;
  filter:drop-shadow(0 4px 26px rgba(231,111,190,.5)) drop-shadow(0 0 16px rgba(244,183,64,.34));
  animation:flowText 7s ease-in-out infinite,wordmarkIn 1.05s cubic-bezier(.2,1.3,.4,1) both;}
.wordmark .wm1,.wordmark .wm2{display:block;}
.wordmark .wm2{margin-left:1.5em;}
/* MOBILE (≤620px): make the wordmark BIG — near-fill the width (owner) — with a tighter stagger so the
   long "Smoothies" line still clears the content column. Scales with the viewport via vw. */
@media(max-width:620px){
  .wordmark{font-size:clamp(3.4rem,15.5vw,5.4rem);line-height:.92;letter-spacing:-.02em;}
  .wordmark .wm2{margin-left:.5em;}
}
/* very small phones (≤340px: iPhone SE 1st/2nd gen, Galaxy Fold cover) — pull the size back so the
   single-word "Smoothies" line never overflows overflow-x:hidden and gets clipped. Overrides ≤620. */
@media(max-width:340px){.wordmark{font-size:clamp(2.4rem,12vw,5.4rem);}.wordmark .wm2{margin-left:.4em;}}
@keyframes wordmarkIn{0%{opacity:0;transform:scale(.84) translateY(12px)}60%{opacity:1;transform:scale(1.03)}100%{transform:scale(1)}}

/* mascot logo — below the wordmark on mobile, to its RIGHT on desktop. ENLARGED 2026-07-06, then
   AGAIN 2026-07-07 ("ještě víc" na mobilu): mobile crest fills the content column (390px phone →
   ~332px logo, was ~276); desktop stays 360 / 90%. */
.hero__inner--center .hero__crest{width:100%;max-width:360px;margin:0 auto;}
.hero__brand .hero__crest{margin:0;flex:0 0 auto;}
.hero__inner--center .hero__crest .hero__logo{width:92%;}
@media(min-width:961px){.hero__inner--center .hero__crest{max-width:360px;}.hero__inner--center .hero__crest .hero__logo{width:90%;}}

/* tagline + BIG centered "Taste the Magic" script */
.hero__motto{font-size:clamp(1.5rem,3.7vw,2.7rem);line-height:1.08;margin:.1em 0 0;overflow-wrap:break-word;}
.hero__motto .fancy{font-family:'Cinzel Decorative','Fraunces',serif;font-weight:900;font-style:normal;letter-spacing:.01em;}
.script--hero{margin:2px 0;font-size:clamp(1.9rem,5.4vw,3.3rem);text-align:center;transform-origin:center;opacity:0;animation:scriptPop 1s cubic-bezier(.2,1.5,.4,1) .8s both,flowText 6s ease-in-out 1.9s infinite;}
@keyframes scriptPop{0%{opacity:0;transform:scale(.5) translateY(6px)}55%{opacity:1;transform:scale(1.14)}100%{opacity:1;transform:scale(1)}}
.hero__inner--center .lede{max-width:52ch;}

/* info tags — flat, grouped, deliberately NOT button-shaped (small · muted · gold icon · faint bg · square-ish) */
.hero__inner--center .hero__cta{margin-top:6px;}
@media(max-width:960px){
  .hero__inner--center .hero__crest{max-width:360px;}
  .hero__inner--center .hero__crest .hero__logo{width:96%;}
}

/* ══ Richer hero sky — more stars + new motion types + non-star magic (2026-07-03 Ron) ══════════ */
/* aurora shimmer wash across the top */
.aurora{position:absolute;inset:-10% -20% auto -20%;height:72%;z-index:0;pointer-events:none;
  background:radial-gradient(60% 100% at 30% 0%,rgba(231,111,190,.16),transparent 70%),radial-gradient(55% 100% at 75% 0%,rgba(160,116,242,.14),transparent 70%),radial-gradient(52% 100% at 50% 0%,rgba(244,183,64,.09),transparent 72%);
  filter:blur(26px);opacity:.75;animation:auroraSway 16s ease-in-out infinite;}
/* second aurora — a bottom-up wash (blue/gold), slower + reversed, for extra ambient motion (2026-07-06 "overshoot") */
.aurora--2{inset:auto -22% -14% -22%;height:60%;filter:blur(30px);opacity:.6;
  background:radial-gradient(56% 100% at 62% 100%,rgba(123,184,255,.12),transparent 70%),radial-gradient(52% 100% at 28% 100%,rgba(244,183,64,.10),transparent 72%);
  animation:auroraSway 21s ease-in-out infinite reverse;}
@keyframes auroraSway{0%,100%{transform:translateX(-3%) skewX(0deg);opacity:.6}50%{transform:translateX(3%) skewX(-3deg);opacity:.9}}
/* soft drifting bokeh orbs (magic, not stars) */
.orb{position:absolute;border-radius:50%;z-index:1;pointer-events:none;filter:blur(2px);opacity:.5;}
.orb--1{width:14px;height:14px;top:26%;left:12%;background:radial-gradient(circle at 35% 30%,#FFE9A8,rgba(244,183,64,0) 70%);animation:orbFloat 13s ease-in-out infinite;}
.orb--2{width:20px;height:20px;top:62%;left:82%;background:radial-gradient(circle at 35% 30%,#F7C6E8,rgba(231,111,190,0) 70%);animation:orbFloat 17s ease-in-out infinite reverse;}
.orb--3{width:10px;height:10px;top:74%;left:22%;background:radial-gradient(circle at 35% 30%,#C9B6FF,rgba(160,116,242,0) 70%);animation:orbFloat 15s ease-in-out 2s infinite;}
.orb--4{width:16px;height:16px;top:16%;left:70%;background:radial-gradient(circle at 35% 30%,#AEE8FF,rgba(123,184,255,0) 70%);animation:orbFloat 19s ease-in-out 1s infinite reverse;}
@keyframes orbFloat{0%,100%{transform:translate(0,0);opacity:.32}50%{transform:translate(14px,-22px);opacity:.68}}
/* extra sparks (7–10) to fill the sky */
.spark--7{top:52%;left:12%;font-size:20px;animation-delay:1.9s;color:var(--purple);text-shadow:0 0 12px rgba(160,116,242,.7);}
.spark--8{top:8%;left:60%;font-size:17px;animation-delay:.5s;}
.spark--9{top:80%;left:66%;font-size:22px;animation-delay:2.9s;color:var(--pink);text-shadow:0 0 12px rgba(231,111,190,.7);}
.spark--10{top:34%;left:6%;font-size:16px;animation-delay:1.3s;}
/* big pulsing stars (scale + glow in place) */
.pstar{position:absolute;z-index:1;color:var(--gold);pointer-events:none;text-shadow:0 0 14px rgba(244,183,64,.8);animation:pulseStar 5s ease-in-out infinite;}
.pstar--1{top:18%;left:26%;font-size:30px;color:#F7C6E8;text-shadow:0 0 16px rgba(231,111,190,.85);animation-delay:.4s;}
.pstar--2{top:56%;left:9%;font-size:24px;animation-delay:1.8s;}
.pstar--3{top:40%;left:88%;font-size:27px;color:#C9B6FF;text-shadow:0 0 16px rgba(160,116,242,.8);animation-delay:1s;}
@keyframes pulseStar{0%,100%{opacity:.22;transform:scale(.7) rotate(0)}50%{opacity:1;transform:scale(1.15) rotate(12deg)}}
/* rising sparkles (fairy-dust drifting up + fading) */
.rise{position:absolute;bottom:5%;z-index:1;color:#FFE9A8;font-size:15px;pointer-events:none;opacity:0;text-shadow:0 0 8px rgba(244,183,64,.7);animation:riseSpark 9s linear infinite;}
.rise--1{left:20%;font-size:13px;animation-delay:0s;}
.rise--2{left:44%;font-size:17px;color:#F7C6E8;animation-delay:2.4s;}
.rise--3{left:64%;font-size:12px;animation-delay:4.1s;}
.rise--4{left:82%;font-size:16px;color:#C9B6FF;animation-delay:6s;}
.rise--5{left:34%;font-size:14px;animation-delay:7.5s;}
@keyframes riseSpark{0%{opacity:0;transform:translateY(0) scale(.5) rotate(0)}12%{opacity:.9}80%{opacity:.5}100%{opacity:0;transform:translateY(-320px) scale(1.05) rotate(90deg)}}
/* a 4th shooting star */
.shoot--4{top:16%;left:42%;animation:shoot 12s ease-in 4s infinite;}

/* ══ Rainbow "Magic Smoothies" label atop each feature card (2026-07-03 Ron) ══════════════════ */
.ms-tag{display:block;font-family:'Fraunces',Georgia,serif;font-weight:800;font-style:italic;font-size:.82rem;letter-spacing:.01em;margin:0 0 3px;
  background:linear-gradient(100deg,#F4B740,#E76FBE,#A074F2,#7BB8FF,#E76FBE,#F4B740);background-size:250% 100%;
  -webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;color:var(--pink);animation:flowText 6s ease-in-out infinite;}

/* ══ Falling / shooting stars (hero sky) ═══════════════════════════════════════════════════════ */
.shoot{position:absolute;width:2px;height:2px;border-radius:50%;background:#fff;box-shadow:0 0 7px 2px rgba(255,255,255,.9);opacity:0;}
.shoot::after{content:"";position:absolute;top:0;left:0;width:82px;height:1.7px;transform-origin:left center;transform:rotate(-44deg);background:linear-gradient(90deg,rgba(255,255,255,.95),rgba(255,233,168,.45),transparent);border-radius:2px;}
.shoot--1{top:12%;left:74%;animation:shoot 8s ease-in 2.2s infinite;}
.shoot--2{top:6%;left:90%;animation:shoot 11s ease-in 6s infinite;}
.shoot--3{top:22%;left:56%;animation:shoot 14s ease-in 10s infinite;}
@keyframes shoot{0%{opacity:0;transform:translate(0,0)}4%{opacity:1}17%{opacity:.95;transform:translate(-250px,242px)}23%{opacity:0;transform:translate(-310px,300px)}100%{opacity:0;transform:translate(-310px,300px)}}

/* ══ No-ice comparison: our smoothie jumps into place + glows magically on scroll ══════════════ */
.noice__col--ours.fx{opacity:0;transform:none;transition:opacity .5s ease;}
.noice__col--ours.fx--in{opacity:1;}
.noice__col--ours.fx--in .cup{transform-origin:bottom center;animation:cupJump .9s cubic-bezier(.16,1.6,.4,1) both,cupMagic 1.5s ease .55s 1;}
@keyframes cupJump{0%{transform:translateY(52px) scale(.78)}55%{transform:translateY(-12px) scale(1.08)}72%{transform:translateY(5px) scale(.98)}86%{transform:translateY(-2px) scale(1.01)}100%{transform:translateY(0) scale(1)}}
@keyframes cupMagic{0%,100%{filter:none}32%{filter:drop-shadow(0 0 16px rgba(244,183,64,.95)) drop-shadow(0 0 30px rgba(231,111,190,.75)) brightness(1.14)}64%{filter:drop-shadow(0 0 9px rgba(244,183,64,.4))}}

@media(prefers-reduced-motion:reduce){
  .shoot{display:none;}
  .noice__col--ours.fx--in .cup{animation:none;}
  .hero__inner--split .script{opacity:1!important;animation:none!important;}
}

/* ══ Bowl builder — magic star bursts + escalating glow tiers + order-card pop (2026-07-03) ══════ */
/* Stars live in #abFx inside the bowl SVG (overflow:visible so they rise above the rim). The glow
   tiers are cumulative (is-magic-1→2→3, added in order); the last present tier wins the box-shadow. */
.ab__bowlwrap.is-magic-1{box-shadow:0 0 0 1px var(--cardline),0 0 24px rgba(244,183,64,.18);}
.ab__bowlwrap.is-magic-2{box-shadow:0 0 0 1px rgba(244,183,64,.32),0 0 42px rgba(231,111,190,.26);}
.ab__bowlwrap.is-magic-3{box-shadow:0 0 0 1px rgba(244,183,64,.5),0 0 62px rgba(160,116,242,.4),0 0 100px rgba(244,183,64,.22);background:radial-gradient(120% 92% at 50% 8%,rgba(244,183,64,.22),rgba(231,111,190,.12) 46%,rgba(160,116,242,.05));}
.ab__bowlwrap::after{content:"";position:absolute;inset:0;border-radius:20px;pointer-events:none;opacity:0;}
.ab__bowlwrap.is-burst::after{animation:bowlBurst .9s ease-out 1;}
@keyframes bowlBurst{0%{opacity:.9;box-shadow:0 0 0 0 rgba(244,183,64,.55),0 0 24px 4px rgba(231,111,190,.5)}100%{opacity:0;box-shadow:0 0 0 28px rgba(244,183,64,0),0 0 24px 4px rgba(231,111,190,0)}}
.ab__result.is-pop{animation:cardPop .6s cubic-bezier(.2,1.4,.4,1);}
@keyframes cardPop{0%{opacity:.3;transform:translateY(10px) scale(.94)}60%{opacity:1;transform:translateY(0) scale(1.03)}100%{transform:scale(1)}}

/* ══ No-ice box: magic glow radiates around the whole card border on scroll-in (2026-07-03) ═════ */
.noice__col--ours.fx--in{animation:cardMagicIn 1.7s ease .1s 1,winGlow 3.6s ease-in-out 1.85s infinite;}
@keyframes cardMagicIn{0%{box-shadow:var(--elev-glow)}22%{box-shadow:0 18px 50px rgba(0,0,0,.45),0 0 6px 2px rgba(255,255,255,.55),0 0 34px rgba(244,183,64,.6)}50%{box-shadow:0 18px 60px rgba(0,0,0,.5),0 0 14px 4px rgba(244,183,64,.7),0 0 82px rgba(231,111,190,.78)}100%{box-shadow:var(--elev-glow)}}
.noice__col--ours::before{content:"";position:absolute;inset:-2px;border-radius:22px;padding:2px;background:linear-gradient(125deg,#FFE9A8,#E76FBE,#A074F2,#FFE9A8);background-size:220% 220%;-webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask-composite:exclude;opacity:0;pointer-events:none;z-index:1;}
.noice__col--ours.fx--in::before{animation:cardBorderFlare 1.7s ease .1s 1;}
@keyframes cardBorderFlare{0%{opacity:0;background-position:0% 50%}30%{opacity:1}55%{opacity:.9;background-position:100% 50%}100%{opacity:0;background-position:120% 50%}}

/* ══ $100k pass — Wave A: premium platform feel (2026-07-07 overnight build) ═══════════════════ */
/* Cross-page view transitions — soft cinematic morph instead of a hard reload (Chromium MPA VT;
   others gracefully hard-navigate). The nav mascot + mobile action bar persist across pages. */
@media (prefers-reduced-motion: no-preference){
  @view-transition{navigation:auto;}
  ::view-transition-old(root){animation:vtOut .26s ease both;}
  ::view-transition-new(root){animation:vtIn .34s cubic-bezier(.2,.7,.2,1) both;}
}
.brand img{view-transition-name:brand-logo;}
.actionbar{view-transition-name:actionbar;}
@keyframes vtOut{to{opacity:0;transform:translateY(-8px) scale(.99)}}
@keyframes vtIn{from{opacity:0;transform:translateY(10px)}}
/* text selection in brand colors (gradient-clipped text needs the fill override) */
::selection{background:rgba(244,183,64,.9);color:#2C0E2B;-webkit-text-fill-color:#2C0E2B;}
/* cosmic scrollbar */
html{scrollbar-color:#5a2270 #160620;}
@media(hover:hover){
  ::-webkit-scrollbar{width:12px;}
  ::-webkit-scrollbar-track{background:#160620;}
  ::-webkit-scrollbar-thumb{background:linear-gradient(180deg,#4a1d5e,#7a2f96);border-radius:8px;border:3px solid #160620;}
  ::-webkit-scrollbar-thumb:hover{background:linear-gradient(180deg,#6b2a86,#9a44b8);}
}
/* rainbow scroll-progress hairline (element injected by fx.js) */
.pagebar{position:fixed;top:0;left:0;right:0;height:3px;z-index:90;transform-origin:left;transform:scaleX(0);background:linear-gradient(90deg,var(--gold),var(--pink),var(--purple),#7BB8FF);pointer-events:none;box-shadow:0 0 8px rgba(231,111,190,.5);}
/* anchor targets clear the sticky nav */
section[id]{scroll-margin-top:84px;}

/* ══ $100k pass — Wave B: hero magic (floating real fruit · pointer parallax · cursor trail) ═══ */
/* pointer-parallax: fx.js sets --px/--py on .hero__sky; each layer translates by its own depth.
   Uses the separate `translate` property so it COMPOSES with the layers' transform animations. */
.stars--far{--dp:5px;}
.stars--mid{--dp:9px;}
.stars--near{--dp:15px;}
.orb{--dp:18px;}
.hero__blob{--dp:10px;}
.stars,.orb,.hero__blob,.skyfruit{translate:calc(var(--px,0)*var(--dp,0px)) calc(var(--py,0)*var(--dp,0px));transition:translate .45s cubic-bezier(.2,.7,.3,1);}
/* floating real-fruit cutouts (Ron's ask, shipped 2026-07-07) — edge slots, depth-blurred far ones */
.skyfruit{position:absolute;z-index:1;pointer-events:none;transform:translate(-50%,-50%);}
.skyfruit img{display:block;filter:drop-shadow(0 10px 22px rgba(0,0,0,.45)) drop-shadow(0 0 16px rgba(231,111,190,.22));animation:fruitBob 12s ease-in-out infinite;transform:rotate(var(--rot,0deg));}
.skyfruit--far{opacity:.55;filter:blur(1.5px);}
@keyframes fruitBob{0%,100%{margin-top:0;transform:rotate(var(--rot,0deg))}50%{margin-top:-16px;transform:rotate(calc(var(--rot,0deg) + 7deg)) scale(1.04)}}
@media(max-width:760px){
  .skyfruit--dsk{display:none;}
  .skyfruit img{max-width:46px;height:auto;}
}
/* magic cursor trail (spawned by fx.js — desktop fine-pointers only) */
.ctrail{position:fixed;z-index:99;pointer-events:none;translate:-50% -50%;text-shadow:0 0 8px currentColor;animation:ctrailFade .78s ease-out forwards;}
@keyframes ctrailFade{0%{opacity:.95;transform:scale(1) translateY(0) rotate(0)}100%{opacity:0;transform:scale(.25) translateY(16px) rotate(50deg)}}
/* logo "spell" on hover — the crest brightens and the halo spins up */
.hero__logo{transition:filter .5s ease;}
@media(hover:hover){
  .hero__crest:hover .hero__logo{filter:drop-shadow(0 0 60px rgba(244,183,64,.7)) drop-shadow(0 0 30px rgba(231,111,190,.6)) drop-shadow(0 12px 30px rgba(0,0,0,.5));}
  .hero__crest:hover .hero__halo{animation-duration:9s;}
}
@media(prefers-reduced-motion:reduce){
  .ctrail{display:none;}
  .stars,.orb,.hero__blob,.skyfruit{translate:none;transition:none;}
}

/* ══ $100k pass — Wave C: menu-board craft + typographic system (2026-07-07) ═══════════════════ */
/* fluid display scale for ALL section headings (was browser-default ~1.5em → felt template-y) */
.noice__head h2,.ab__head h2,.flavors h2,.supers h2{font-size:clamp(1.8rem,4.6vw,2.7rem);}
h1,h2,h3{text-wrap:balance;}
p,.lede,.i-desc{text-wrap:pretty;}
.i-price,.menu-price,.fcard__price{font-variant-numeric:tabular-nums;}
/* designed press states (mobile taps feel intentional, not default) */
a,button{-webkit-tap-highlight-color:transparent;}
@media(pointer:coarse){
  .btn:active,.ab__chip:active,.ab__base:active,.fcard:active,.mnav a:active{transform:scale(.97);transition:transform .08s ease;}
}
/* sticky menu section nav (scrollspy highlights via fx.js) */
.mnav{position:sticky;top:63px;z-index:40;display:flex;gap:8px;overflow-x:auto;scrollbar-width:none;padding:12px 22px;margin:16px auto 0;max-width:900px;background:rgba(22,6,32,.86);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);border-bottom:1px solid var(--line);}
.mnav::-webkit-scrollbar{display:none;}
.mnav a{flex:0 0 auto;text-decoration:none;font-weight:800;font-size:.8rem;color:var(--muted);padding:8px 14px;border-radius:999px;border:1px solid var(--cardline);background:rgba(255,255,255,.04);transition:color .15s,border-color .15s,background .15s;}
.mnav a:hover{color:var(--cream);border-color:rgba(244,183,64,.5);}
.mnav a.is-on{color:#2C0E2B;background:linear-gradient(120deg,var(--gold),#FFD36A);border-color:transparent;}
.menu-sec[id]{scroll-margin-top:130px;}
/* menu-board dotted leader lines between name and price */
.i-lead{flex:1;min-width:24px;border-bottom:2px dotted rgba(255,255,255,.16);transform:translateY(-5px);}
/* verbatim Google-review quote pinned to the exact dish it praises */
.i-quote{display:block;margin-top:5px;font-size:.8rem;font-style:italic;color:var(--gold-on-warm);opacity:.85;}
/* per-item "Order on Uber Eats" CTA (2026-07-17) — subtle gold pill under each menu item → the shop's real Uber Eats store */
.mi__order{align-self:flex-start;display:inline-flex;align-items:center;gap:6px;margin-top:9px;font-family:'Plus Jakarta Sans',sans-serif;font-size:.76rem;font-weight:800;letter-spacing:.01em;color:var(--gold);background:rgba(244,183,64,.10);border:1px solid rgba(244,183,64,.32);border-radius:999px;padding:5px 14px;text-decoration:none;transition:transform .15s ease,background .15s ease,box-shadow .15s ease;}
.mi__order:hover,.mi__order:focus-visible{background:rgba(244,183,64,.2);transform:translateY(-1px);box-shadow:0 6px 16px rgba(244,183,64,.22);}
/* arriving from a deep link: the section header glows once */
.menu-sec:target h2{animation:targetGlow 1.8s ease .2s 1;}
@keyframes targetGlow{0%,100%{text-shadow:none}35%{text-shadow:0 0 22px rgba(244,183,64,.85),0 0 40px rgba(231,111,190,.5)}}
/* directional scroll-reveal variants (data-fx set in markup; fx.js drives .fx--in) */
.fx[data-fx="left"]{transform:translateX(-28px);}
.fx[data-fx="right"]{transform:translateX(28px);}
.fx[data-fx="zoom"]{transform:scale(.94);}
.fx--in[data-fx]{transform:none;}
/* one-shot "enchant" sweep on the italic word when a section heading reveals */
.noice__head.fx--in h2 em,.ab__head.fx--in h2 em,.flavors .noice__head.fx--in h2 em{animation:emSweep 1.5s ease .25s 1;}
@keyframes emSweep{0%{background-position:0% 50%}100%{background-position:280% 50%}}
/* ══ $100k pass — Wave D: builder upgrades (2026-07-07) ════════════════════════════════════════ */
/* the flying topping (chip → bowl arc, spawned by ab.js) */
.ab__fly{position:fixed;z-index:95;width:26px;height:26px;pointer-events:none;translate:-50% -50%;filter:drop-shadow(0 4px 10px rgba(0,0,0,.5)) drop-shadow(0 0 10px rgba(244,183,64,.5));will-change:transform,opacity;}
/* finale → order bridge on the counter card */
.ab__cardcta{display:flex;gap:10px;margin-top:14px;flex-wrap:wrap;}
.ab__cardcta .btn{padding:10px 18px;font-size:.88rem;}
/* the empty bowl beckons (hint text pulses until a base is picked) */
.ab__bowl #abHint{animation:hintPulse 2.6s ease-in-out infinite;}
@keyframes hintPulse{0%,100%{opacity:.55}50%{opacity:1}}
/* comfortable 44px tap targets on touch devices */
@media(pointer:coarse){
  .ab__chip{padding:11px 16px;}
  .ab__dot{padding:12px 8px;}
}
/* ══ $100k pass — Wave E: nav drawer, live hours, visit & footer depth (2026-07-07) ═══════════ */
/* mobile drawer: dim + lock the page behind it, tap-outside closes (scrim injected by fx.js) */
/* z-index 49 = under the nav bar (50); the burger itself is bumped to 61 (see .burger) so the X
   stays above the drawer (60). Scrim just dims + captures tap-outside. */
.navscrim{position:fixed;inset:0;z-index:49;background:rgba(10,2,16,.55);backdrop-filter:blur(3px);-webkit-backdrop-filter:blur(3px);opacity:0;transition:opacity .25s ease;}
.navscrim.is-on{opacity:1;}
html.nav-locked,html.nav-locked body{overflow:hidden;}
/* hero open-now chip rides in the info-tag row without double chrome */
.infotag--open{padding:0!important;border:0!important;background:none!important;}
/* order page: status + trust under the lede */
.order-open{margin:14px 0 0;}
.page-head .gtrust{margin-top:14px;}
/* visit: 7-day hours table with a highlighted "today" row */
.hours{width:100%;max-width:340px;border-collapse:collapse;margin:8px 0 2px;}
.hours th{text-align:left;font-weight:600;color:var(--muted);padding:4px 0;font-size:.92rem;}
.hours td{text-align:right;color:var(--cream);font-size:.92rem;font-variant-numeric:tabular-nums;}
.hours tr.is-today th,.hours tr.is-today td{color:var(--gold);font-weight:800;}
.hours tr.is-today th::after{content:" · today";font-size:.68rem;letter-spacing:.06em;text-transform:uppercase;opacity:.85;}
/* copy-address pill */
.visit__copy{background:rgba(244,183,64,.14);color:#FBE4AE;border:1px solid rgba(244,183,64,.4);border-radius:999px;padding:7px 15px;font:inherit;font-weight:800;font-size:.8rem;cursor:pointer;}
.visit__copy:hover{background:rgba(244,183,64,.24);}
/* map veil — kills the scroll/zoom trap until the visitor opts in */
.map-embed{position:relative;}
.map-veil{position:absolute;inset:0;width:100%;background:rgba(20,6,30,.12);border:0;cursor:pointer;display:flex;align-items:flex-end;justify-content:center;padding:16px;font:inherit;}
.map-veil span{background:rgba(22,6,32,.88);border:1px solid var(--cardline);color:var(--cream);padding:9px 18px;border-radius:999px;font-weight:800;font-size:.84rem;box-shadow:0 8px 22px rgba(0,0,0,.45);}
/* footer: ghost script watermark + explore/order columns + compact trust chip */
.foot{position:relative;overflow:hidden;}
/* decorative script watermark — inline SVG (not HTML text) so it's unambiguously decorative and
   never trips automated colour-contrast checks; the tagline is stated in readable contrast elsewhere. */
.foot__ghost{position:absolute;right:-1%;bottom:-6px;width:min(560px,72vw);height:auto;opacity:.05;pointer-events:none;transform:rotate(-4deg);}
.foot__grid{grid-template-columns:1.3fr .7fr 1.1fr 1fr;}
.foot__navlinks a{display:inline-block;padding:2px 0;text-decoration:none;color:#D9C9E6;}
.foot__navlinks a:hover{color:var(--gold);}
.foot .gtrust{margin-top:12px;font-size:.8rem;padding:6px 12px 6px 9px;box-shadow:none;}
.foot .gtrust svg{width:16px;height:16px;}
@media(max-width:760px){.foot__grid{grid-template-columns:1fr;}}
/* sticky action bar: Order reads as the primary action */
@media(max-width:760px){
  .actionbar a:first-child{background:rgba(244,183,64,.14);border-radius:12px;}
}
/* ══ $100k pass — Wave F: FAQ, story craft, tilt cards, dividers, perf touches (2026-07-07) ════ */
/* real-facts FAQ accordion (mirrors the FAQPage schema verbatim — native <details>, zero JS) */
.faq{max-width:760px;margin:var(--s-section) auto 0;padding:0 22px;}
.faq__list{margin-top:26px;display:flex;flex-direction:column;gap:10px;}
.faq details{background:var(--card);border:1px solid var(--cardline);border-radius:16px;overflow:hidden;backdrop-filter:blur(6px);}
.faq summary{list-style:none;cursor:pointer;padding:16px 20px;font-family:'Fraunces',serif;font-weight:700;font-size:1.05rem;color:var(--cream);display:flex;justify-content:space-between;align-items:center;gap:12px;}
.faq summary::-webkit-details-marker{display:none;}
.faq summary:hover{color:var(--gold-on-warm);}
.faq .faq__ic{color:var(--gold);flex:0 0 auto;transition:transform .3s cubic-bezier(.2,.9,.3,1.3);}
.faq details[open] .faq__ic{transform:rotate(135deg) scale(1.2);}
.faq details p{margin:0;padding:0 20px 17px;color:var(--muted);font-size:.96rem;}
/* ✦ ornamental section dividers */
.sxdiv{display:flex;align-items:center;gap:16px;max-width:460px;margin:var(--s-section) auto 0;padding:0 22px;}
.sxdiv::before,.sxdiv::after{content:"";flex:1;height:1px;}
.sxdiv::before{background:linear-gradient(90deg,transparent,rgba(255,255,255,.18));}
.sxdiv::after{background:linear-gradient(270deg,transparent,rgba(255,255,255,.18));}
.sxdiv span{color:var(--gold);opacity:.75;font-size:.95rem;text-shadow:0 0 10px rgba(244,183,64,.5);}
.sxdiv+.noice,.sxdiv+.ab,.sxdiv+.supers,.sxdiv+.flavors,.sxdiv+.faq{margin-top:36px;}
/* editorial drop cap on the story opener */
.story__big::first-letter{font-size:2.6em;line-height:.82;float:left;padding:6px 10px 0 0;font-style:italic;color:var(--gold);
  background:linear-gradient(140deg,var(--gold),var(--pink));-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;}
/* tilt cards: pointer-tracked specular shine (fx.js sets --mx/--my; class added on capable devices) */
.tilt{position:relative;will-change:transform;}
.tilt::after{content:"";position:absolute;inset:0;border-radius:inherit;pointer-events:none;z-index:2;
  background:radial-gradient(340px circle at var(--mx,50%) var(--my,50%),rgba(255,255,255,.13),transparent 62%);
  opacity:0;transition:opacity .25s ease;}
.tilt:hover::after{opacity:1;}
/* long-page render skips (below-fold sections paint lazily) */
.flavors,.supers,.greviews-band,.faq{content-visibility:auto;contain-intrinsic-size:auto 640px;}
/* background tab → pause the sky (fx.js toggles .tab-hidden on <html>) */
.tab-hidden .hero__sky *{animation-play-state:paused!important;}
html.tab-hidden body::after{animation-play-state:paused!important;}
/* print stylesheet — the menu prints like a real menu board (was invisible: white on transparent) */
@media print{
  body{background:#fff!important;color:#111;padding-bottom:0;}
  body::before,body::after,.nav,.actionbar,.foot,.pagebar,.band,.mnav,.shot,.skip,.hero__sky,.gtrust,.i-quote,.mi__thumb,.mi__order{display:none!important;}
  .items li.mi--img{display:block;}
  .page-head{padding:0 0 8px;}
  .menu-wrap{padding:0;max-width:100%;}
  h1,h2,h3,.i-name,em,.script,.wordmark{color:#111!important;-webkit-text-fill-color:#111!important;background:none!important;animation:none!important;filter:none!important;}
  .menu-sec h2{color:#111!important;border-color:#bbb;}
  .i-desc,.menu-subnote,.lede,.menu-note{color:#444!important;}
  .i-price,.menu-price{color:#111!important;}
  .items li{border-color:#ddd;}
  .i-lead{border-color:#bbb;}
  .steps li{border:1px solid #ddd;background:#fff;color:#222;}
  .step__n{background:#333;}
  a{color:#111;text-decoration:none;}
  .faq details{border:1px solid #ddd;background:#fff;}
  .faq summary{color:#111;}
  .faq details p,.story__sub,.story__cols p{color:#333;}
  .story__big{color:#111;}
  .hours th,.hours td{color:#111;}
  .visit__copy,.map-veil{display:none!important;}
}
