/* ==========================================================================
   A+ Market · "Freezer to Table" design layer (Dev, 2026-10-12)
   A black-and-gold poster that comes alive. Restyles the live shop; it never
   removes anything. Motion lives in gp.js and only runs under html.gp-motion.
   ========================================================================== */
:root {
  --night: #0B0A08; --char: #15120E; --char2: #1E1A14;
  --g1: #B8892A; --g2: #F2CF6B; --g3: #D4A72C;
  --gold-grad: linear-gradient(100deg, #B8892A 0%, #F2CF6B 38%, #D4A72C 62%, #9C7420 100%);
  --cream: #F6EFE2; --frost: #DDEBF5; --ember: #E8692A;
  --bg: var(--night); --surface: var(--char); --surface2: var(--char2); --text: #F3ECDD; --muted: #A89C88;
  --gp-display: 'Anton', 'Impact', 'Arial Narrow', sans-serif;
  --gp-script: 'Allura', 'Brush Script MT', cursive;
  --gp-ease: cubic-bezier(.16, 1, .3, 1);
}
html { -webkit-text-size-adjust: 100%; }
body { font-family: 'Inter', 'Segoe UI', system-ui, sans-serif; background: var(--night); overflow-x: clip; }
::selection { background: var(--g2); color: #000; }
.gp-grain { position: fixed; inset: -50%; z-index: 9990; pointer-events: none; opacity: .06; mix-blend-mode: overlay;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E"); }
.gp-motion .gp-grain { animation: gp-grain 1s steps(4) infinite; }
@keyframes gp-grain { 0% { transform: translate(0, 0); } 25% { transform: translate(-3%, 2%); } 50% { transform: translate(2%, -3%); } 75% { transform: translate(-2%, -1%); } }

/* ---------- Header + category pills (a gold puck slides between them) ---------- */
header { background: rgba(11,10,8,.78) !important; backdrop-filter: blur(16px) saturate(140%); -webkit-backdrop-filter: blur(16px) saturate(140%); border-bottom: 1px solid rgba(201,162,39,.14) !important; }
header .logo { font-family: var(--gp-display); font-weight: 400; font-size: 26px; letter-spacing: .04em; background: var(--gold-grad); -webkit-background-clip: text; background-clip: text; color: transparent; line-height: 1; }
header .logo span { color: var(--cream); -webkit-text-fill-color: var(--cream); margin-left: 2px; }
header .logo small { -webkit-text-fill-color: var(--muted); font-family: 'Inter', sans-serif; font-size: 10px; letter-spacing: .24em; margin-top: 4px; }
.cart-btn { background: var(--gold-grad) !important; color: #120E06 !important; border-radius: 999px !important; font-weight: 800 !important; padding: 10px 18px !important; box-shadow: 0 6px 20px rgba(201,162,39,.25); transition: transform .3s var(--gp-ease), box-shadow .3s; }
.cart-btn:hover { transform: translateY(-2px); box-shadow: 0 10px 28px rgba(201,162,39,.4); }
.cart-btn.gp-pop { animation: gp-pop .5s var(--gp-ease); }
@keyframes gp-pop { 0% { transform: scale(1); } 35% { transform: scale(1.18) rotate(-4deg); } 100% { transform: scale(1); } }
.cat-nav { background: rgba(11,10,8,.72) !important; backdrop-filter: blur(14px); -webkit-backdrop-filter: blur(14px); border-bottom: 1px solid rgba(201,162,39,.12) !important; }
.cat-nav-inner { position: relative; }
.cat-pill { position: relative; z-index: 1; transition: color .35s var(--gp-ease) !important; }
.gp-motion .cat-pill.active { background: transparent !important; border-color: transparent !important; color: #120E06 !important; }
.gp-puck { position: absolute; z-index: 0; top: 10px; left: 0; height: 34px; width: 80px; border-radius: 999px; background: var(--gold-grad); box-shadow: 0 6px 18px rgba(201,162,39,.3); transition: transform .55s var(--gp-ease), width .55s var(--gp-ease); pointer-events: none; }

/* ---------- Boot: thermometer to -18 C, the badge stamps, freezer doors open ---------- */
#gp-boot { display: none; }
.gp-motion:not(.gp-booted) #gp-boot { display: block; position: fixed; inset: 0; z-index: 9995; perspective: 1600px; }
#gp-boot .door { position: absolute; top: 0; bottom: 0; width: 50.5%; background:
  linear-gradient(90deg, rgba(255,255,255,.04), transparent 30%, rgba(0,0,0,.25)),
  repeating-linear-gradient(0deg, transparent 0 46px, rgba(255,255,255,.025) 46px 47px),
  linear-gradient(180deg, #17150F, #0B0A08); }
#gp-boot .door.l { left: 0; transform-origin: 0 50%; border-right: 1px solid rgba(201,162,39,.25); }
#gp-boot .door.r { right: 0; transform-origin: 100% 50%; border-left: 1px solid rgba(201,162,39,.25); }
#gp-boot .handle { position: absolute; top: 74%; height: 16%; width: 10px; border-radius: 6px; background: var(--gold-grad); box-shadow: 0 0 24px rgba(201,162,39,.35); }
#gp-boot .door.l .handle { right: 26px; } #gp-boot .door.r .handle { left: 26px; }
#gp-boot .frost { position: absolute; inset: 0; opacity: 0; pointer-events: none;
  -webkit-mask-image: radial-gradient(75% 70% at 50% 50%, transparent 28%, #000 85%); mask-image: radial-gradient(75% 70% at 50% 50%, transparent 28%, #000 85%);
  background: radial-gradient(80% 70% at 50% 50%, transparent 40%, rgba(221,235,245,.25) 100%),
  url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='700' height='700'%3E%3Cfilter id='f'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.012 .02' numOctaves='5' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 .87 0 0 0 0 .93 0 0 0 0 .97 0 0 0 1.6 -.62'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23f)'/%3E%3C/svg%3E") center / 700px 700px; }
#gp-boot .core { position: absolute; inset: 0; display: grid; place-content: center; justify-items: center; gap: 10px; text-align: center; }
#gp-boot .seal { width: min(46vw, 230px); height: auto; opacity: 0; filter: drop-shadow(0 0 40px rgba(201,162,39,.35)); }
#gp-boot .temp { font: 400 clamp(4.2rem, 16vw, 9rem)/.9 var(--gp-display); color: var(--frost); letter-spacing: .02em; font-variant-numeric: tabular-nums; text-shadow: 0 0 40px rgba(221,235,245,.35); }
#gp-boot .deg { font-size: .45em; vertical-align: top; margin-left: 4px; color: var(--g2); }
#gp-boot .cap { font: 600 .72rem 'Inter', sans-serif; letter-spacing: .34em; text-transform: uppercase; color: rgba(243,236,221,.6); }

/* ---------- Hero: the poster ---------- */
.hero { min-height: calc(100svh - 110px); display: flex; flex-direction: column; justify-content: center; align-items: center; padding: 56px 20px 64px !important; isolation: isolate;
  background: radial-gradient(60% 50% at 50% 42%, rgba(201,162,39,.16), transparent 70%), radial-gradient(120% 90% at 50% 0%, #1A1206, var(--night) 70%) !important; border-bottom: 0 !important; }
.hero::before { background: radial-gradient(40% 30% at 50% 45%, rgba(242,207,107,.08), transparent 70%) !important; }
.hero > * { position: relative; z-index: 2; }
.hero .hero-logo { width: 112px !important; height: 112px !important; border-radius: 50%; margin-bottom: 18px !important; animation: none !important; filter: drop-shadow(0 0 30px rgba(201,162,39,.4)) !important; }
.hero-divider { display: none; }
.hero h1 { margin: 0 0 18px !important; line-height: .86 !important; letter-spacing: 0 !important; font-weight: 400 !important; }
.hero h1 .gp-kick { display: block; font: 700 clamp(.8rem, 1.6vw, 1.05rem)/1 'Inter', sans-serif; letter-spacing: .42em; text-transform: uppercase; color: var(--cream); margin-bottom: 14px; }
.hero h1 .gp-kick::before, .hero h1 .gp-kick::after { content: ""; display: inline-block; width: 42px; height: 1px; background: var(--g3); vertical-align: middle; margin: 0 14px; }
.hero h1 > span { display: block; color: inherit !important; position: relative; }
.hero h1 .gp-big { display: block; font: 400 clamp(5.2rem, 21vw, 17.5rem)/.82 var(--gp-display); letter-spacing: .01em; text-transform: uppercase;
  background: var(--gold-grad), radial-gradient(circle at 30% 30%, rgba(255,255,255,.3), transparent 40%); background-blend-mode: overlay; -webkit-background-clip: text; background-clip: text; color: transparent;
  filter: drop-shadow(0 8px 30px rgba(0,0,0,.6)); }
.hero h1 .gp-big .ch { display: inline-block; }
.hero h1 .gp-script { display: block; font: 400 clamp(3.4rem, 11vw, 8.6rem)/.7 var(--gp-script); color: var(--cream); transform: rotate(-6deg); margin: -.22em 0 0 22%; text-shadow: 0 6px 24px rgba(0,0,0,.65); }
.hero p { color: rgba(243,236,221,.72) !important; font-size: 15px !important; max-width: 470px !important; }
.hero .badges { gap: 8px !important; max-width: 760px; }
.hero .badge, .sec-banner .badge, #section-syrups .badge { background: rgba(20,17,12,.7) !important; border: 1px solid rgba(201,162,39,.32) !important; color: var(--g2) !important; border-radius: 999px !important; backdrop-filter: blur(6px); font-size: 12px !important; font-weight: 600; }
.gp-plates { position: absolute !important; inset: 0; z-index: 1 !important; pointer-events: none; }
.gp-plates .plate { position: absolute; border-radius: 50%; object-fit: cover; aspect-ratio: 1; box-shadow: 0 0 0 7px #17130D, 0 0 0 8px rgba(201,162,39,.55), 0 30px 60px rgba(0,0,0,.7); }
.gp-plates .p1 { width: 21vw; max-width: 300px; left: 4%; top: 12%; }
.gp-plates .p2 { width: 16vw; max-width: 230px; right: 6%; top: 9%; }
.gp-plates .p3 { width: 13vw; max-width: 190px; left: 11%; bottom: 7%; }
.gp-plates .p4 { width: 18vw; max-width: 260px; right: 3%; bottom: 9%; }
.gp-plates .p5 { width: 9vw; max-width: 130px; left: 30%; top: 4%; opacity: .9; }

/* ---------- Crossing tapes ---------- */
.gp-tapes { position: relative; height: 150px; overflow: hidden; background: var(--night); }
.gp-tapes .tape { position: absolute; left: -10%; width: 120%; top: 50%; padding: 14px 0; overflow: hidden; white-space: nowrap; }
.gp-tapes .t1 { background: var(--gold-grad); color: #120E06; transform: translateY(-50%) rotate(-3.5deg); z-index: 2; box-shadow: 0 10px 30px rgba(0,0,0,.5); }
.gp-tapes .t2 { background: #1A160F; color: var(--frost); transform: translateY(-50%) rotate(3deg); border-block: 1px solid rgba(221,235,245,.18); }
.gp-tapes .run { display: inline-flex; gap: 26px; align-items: center; font: 400 clamp(1.4rem, 3vw, 2.2rem)/1 var(--gp-display); text-transform: uppercase; letter-spacing: .04em; will-change: transform; }
.gp-tapes .run b { font-weight: 400; opacity: .7; font-size: .7em; }

/* ---------- Info strip: flyer-style icon row ---------- */
.info-strip { background: var(--night) !important; border: 0 !important; padding: 34px 20px 10px !important; }
.info-item .icon { width: 58px; height: 58px; margin: 0 auto 10px !important; display: grid; place-items: center; border-radius: 50%; border: 1.5px solid rgba(201,162,39,.6); font-size: 24px !important; filter: grayscale(1) sepia(1) saturate(3.2) brightness(1.05); }
.info-item .title { font: 400 1.2rem/1.1 var(--gp-display) !important; letter-spacing: .06em; text-transform: uppercase; color: var(--cream); }
.info-item .desc { font-size: 12.5px !important; }

/* ---------- Bulk savings: a freezer scale fills to 20 kg ---------- */
.gp-bulk { border-block: 1px solid rgba(201,162,39,.16) !important; background: radial-gradient(60% 120% at 50% 0%, rgba(201,162,39,.12), transparent 70%), #0E0C09 !important; padding: 26px 20px 30px !important; }
.gp-meter { max-width: 680px; margin: 22px auto 0; text-align: left; }
.gp-meter .bar { position: relative; height: 12px; border-radius: 999px; background: rgba(255,255,255,.07); box-shadow: inset 0 1px 3px rgba(0,0,0,.6); }
.gp-meter .fill { position: absolute; inset: 0 auto 0 0; width: 0; border-radius: inherit; background: var(--gold-grad); box-shadow: 0 0 18px rgba(242,207,107,.45); }
.gp-meter .mark { position: absolute; top: -7px; width: 2px; height: 26px; background: rgba(243,236,221,.35); }
.gp-meter .mark i { position: absolute; top: 32px; left: 50%; transform: translateX(-50%); white-space: nowrap; font: 700 11px 'Inter', sans-serif; letter-spacing: .08em; color: var(--muted); transition: color .3s; font-style: normal; }
.gp-meter .mark.on i { color: var(--g2); }
.gp-meter .kg { display: flex; justify-content: space-between; align-items: baseline; margin-bottom: 10px; }
.gp-meter .kg b { font: 400 2.4rem/1 var(--gp-display); color: var(--cream); font-variant-numeric: tabular-nums; }
.gp-meter .kg span { font-size: 12px; color: var(--muted); letter-spacing: .14em; text-transform: uppercase; }

/* ---------- Product sections ---------- */
.section { max-width: 1240px !important; padding: 56px 20px !important; }
.sec-title { display: inline-block; border: 0 !important; padding: 8px 22px 6px !important; margin-bottom: 26px !important; font: 400 clamp(1.5rem, 3.4vw, 2.3rem)/1 var(--gp-display) !important; letter-spacing: .05em !important; color: #120E06 !important; background: var(--gold-grad);
  clip-path: polygon(2% 8%, 12% 0, 30% 6%, 52% 1%, 74% 7%, 92% 0, 99% 10%, 100% 52%, 97% 92%, 80% 100%, 58% 94%, 36% 100%, 14% 95%, 0 100%, 1% 55%); }
.products-grid { gap: 22px !important; }
#bigGrid, #smallGrid { grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)) !important; }
.product-card { background: radial-gradient(90% 60% at 50% 18%, #241D12, #13110D 70%) !important; border: 1px solid rgba(201,162,39,.18) !important; border-radius: 22px !important; position: relative; transition: transform .5s var(--gp-ease), border-color .3s, box-shadow .5s !important; }
.product-card:hover { transform: translateY(-6px) !important; border-color: rgba(242,207,107,.55) !important; box-shadow: 0 30px 60px rgba(0,0,0,.55), 0 0 0 1px rgba(242,207,107,.2); }
#bigGrid .product-card, #smallGrid .product-card { padding-top: 22px; }
#bigGrid .product-img, #smallGrid .product-img { width: 74% !important; height: auto !important; aspect-ratio: 1; margin: 0 auto; border-radius: 50%; box-shadow: 0 0 0 7px #1B1610, 0 0 0 8px rgba(201,162,39,.5), 0 26px 40px rgba(0,0,0,.6); }
.product-img { background: #1A140C !important; }
.product-body { padding: 18px 18px 20px !important; }
.product-name { font: 400 1.45rem/1.05 var(--gp-display) !important; letter-spacing: .03em; text-transform: uppercase; color: var(--cream); }
.product-weight { display: inline-block; width: fit-content; font: 800 11px 'Inter', sans-serif !important; letter-spacing: .14em; text-transform: uppercase; color: #120E06 !important; background: var(--gold-grad); padding: 4px 10px 3px; border-radius: 3px; transform: rotate(-2deg); margin: 4px 0 2px; }
.product-desc { font-size: 13px !important; }
.product-price { font: 400 2.1rem/1 var(--gp-display) !important; letter-spacing: .02em; background: var(--gold-grad); -webkit-background-clip: text; background-clip: text; color: transparent !important; }
.qty-control { gap: 6px !important; }
.qty-btn { width: 38px !important; height: 38px !important; border-radius: 50% !important; background: transparent !important; border: 1.5px solid rgba(201,162,39,.5) !important; color: var(--g2) !important; transition: transform .25s var(--gp-ease), background .2s, color .2s !important; }
.qty-btn:last-child { background: var(--gold-grad) !important; color: #120E06 !important; border-color: transparent !important; }
.qty-btn:hover { transform: scale(1.08); }
.qty-btn:active { transform: scale(.92); }
.qty-num { width: 40px !important; border: 0 !important; background: transparent !important; font: 400 1.35rem var(--gp-display) !important; color: var(--cream) !important; }
.qty-num.gp-tick { animation: gp-tick .45s var(--gp-ease); }
@keyframes gp-tick { 0% { transform: translateY(0); } 40% { transform: translateY(-40%); opacity: .2; } 41% { transform: translateY(40%); } 100% { transform: translateY(0); opacity: 1; } }
.restock-badge { border-radius: 999px !important; }
.gp-fly { position: fixed; z-index: 9999; pointer-events: none; font: 400 1.3rem var(--gp-display); color: #120E06; background: var(--gold-grad); border-radius: 999px; padding: 6px 12px; box-shadow: 0 10px 30px rgba(0,0,0,.4); }
#special1kgBanner { border-radius: 22px !important; transform: rotate(-1deg); box-shadow: 0 20px 50px rgba(232,105,42,.25); }

/* ---------- Bundles: the frosted freezer ---------- */
.gp-freezer-head, .bundle-section { background: radial-gradient(70% 80% at 50% 0%, rgba(221,235,245,.1), transparent 70%), linear-gradient(180deg, #0D1319, #0A0E12) !important; }
.gp-freezer-head { border-top: 1px solid rgba(221,235,245,.14) !important; border-bottom: 0 !important; padding-top: 72px !important; position: relative; overflow: hidden; }
.gp-freezer-head h2 { font: 400 clamp(2.6rem, 7vw, 5rem)/.95 var(--gp-display) !important; text-transform: uppercase; letter-spacing: .02em; color: var(--frost); }
.gp-freezer-head h2 span { color: transparent !important; background: var(--gold-grad); -webkit-background-clip: text; background-clip: text; }
.bundle-section { max-width: none !important; padding: 26px 20px 80px !important; }
.bundle-grid { max-width: 1240px; margin: 0 auto; grid-template-columns: repeat(auto-fill, minmax(250px, 1fr)) !important; gap: 22px !important; }
.bundle-card { background: linear-gradient(160deg, rgba(221,235,245,.09), rgba(221,235,245,.03)) !important; border: 1px solid rgba(221,235,245,.18) !important; border-radius: 22px !important; backdrop-filter: blur(10px); padding: 26px 22px 22px !important; overflow: hidden; }
.bundle-card::before { content: ""; position: absolute; inset: 0; pointer-events: none; opacity: var(--frost-o, .32); transition: opacity 1.2s var(--gp-ease);
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='200' height='200'%3E%3Cfilter id='f'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.05' numOctaves='3'/%3E%3CfeColorMatrix values='0 0 0 0 .9 0 0 0 0 .95 0 0 0 0 1 0 0 0 1.2 -.6'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23f)'/%3E%3C/svg%3E"); }
.bundle-card.gp-clear { --frost-o: .06; }
.bundle-card > *:not(.bundle-badge) { position: relative; }
.bundle-card.featured { padding-top: 50px !important; }
.bundle-card.featured { border-color: rgba(242,207,107,.55) !important; box-shadow: 0 0 0 1px rgba(242,207,107,.2), 0 30px 70px rgba(0,0,0,.45); }
.bundle-badge { background: var(--gold-grad) !important; color: #120E06 !important; top: 14px !important; right: 14px !important; }
.bundle-name { font: 400 1.6rem/1 var(--gp-display) !important; text-transform: uppercase; letter-spacing: .03em; color: var(--frost) !important; }
.bundle-price { font: 400 2.6rem/1 var(--gp-display) !important; background: var(--gold-grad); -webkit-background-clip: text; background-clip: text; color: transparent !important; font-variant-numeric: tabular-nums; }
.bundle-btn { background: var(--gold-grad) !important; color: #120E06 !important; border-radius: 999px !important; padding: 14px !important; letter-spacing: .02em; transition: transform .3s var(--gp-ease), box-shadow .3s !important; }
.bundle-btn:hover { transform: translateY(-2px); box-shadow: 0 12px 28px rgba(201,162,39,.35); }
.btag { border-color: rgba(221,235,245,.2) !important; color: var(--frost) !important; background: rgba(221,235,245,.05) !important; }

/* ---------- "Also available" prompts become big outlined words ---------- */
.scroll-next { padding: 46px 20px !important; cursor: pointer; }
.scroll-next-name { font: 400 clamp(2.4rem, 8vw, 5.6rem)/1 var(--gp-display) !important; text-transform: uppercase; letter-spacing: .02em; color: transparent !important; -webkit-text-stroke: 1.5px rgba(242,207,107,.75); transition: color .4s; }
.scroll-next:hover .scroll-next-name { color: var(--g2) !important; }

/* ---------- Frozen meals: frost ---------- */
#section-frozen { background: radial-gradient(70% 60% at 50% 0%, rgba(221,235,245,.1), transparent 70%), linear-gradient(180deg, #0D1319, #0B0F13); position: relative; overflow: hidden; }
#section-frozen .gp-snow { position: absolute; inset: 0; width: 100%; height: 100%; pointer-events: none; z-index: 0; }
#section-frozen > * { position: relative; z-index: 1; }
.sec-banner { border-top: 0 !important; padding-top: 70px !important; }
.sec-banner-title { font: 400 clamp(2.8rem, 8vw, 5.6rem)/.95 var(--gp-display) !important; text-transform: uppercase; letter-spacing: .02em; }
.sec-banner-title span { color: transparent !important; background: var(--gold-grad); -webkit-background-clip: text; background-clip: text; }
.sec-banner-icon { font-size: 54px !important; }
.gp-motion .sec-banner-icon { animation: gp-bob 4s ease-in-out infinite; }
@keyframes gp-bob { 50% { transform: translateY(-8px) rotate(6deg); } }
#section-frozen .sec-banner-title { color: var(--frost); }
.coming-soon-card { background: linear-gradient(160deg, rgba(221,235,245,.1), rgba(221,235,245,.03)) !important; border: 1px dashed rgba(221,235,245,.35) !important; border-radius: 22px !important; }
.coming-soon-card .cs-title { font: 400 2rem/1 var(--gp-display) !important; text-transform: uppercase; color: var(--frost) !important; letter-spacing: .04em; }
.gp-cutoff { display: inline-flex; gap: 12px; align-items: center; margin-top: 18px; padding: 10px 18px; border-radius: 999px; border: 1px solid rgba(221,235,245,.3); color: var(--frost); font: 600 12px 'Inter', sans-serif; letter-spacing: .1em; text-transform: uppercase; }
.gp-cutoff b { font: 400 1.25rem var(--gp-display); letter-spacing: .06em; color: var(--g2); font-variant-numeric: tabular-nums; }

/* ---------- Cookies & rusks: the warm cream kitchen ---------- */
#section-cookies, #section-rusks, #section-cookies + .scroll-next {
  --text: #22180C; --muted: #6E5D46; --surface: #FFFaF1; --surface2: #F2E7D3; --border: rgba(139,105,20,.22);
  background: radial-gradient(60% 50% at 50% 0%, #FFF7E8, #F4EBDB 70%); color: var(--text); }
#section-cookies .sec-banner-eyebrow, #section-rusks .sec-banner-eyebrow { color: #8B6914 !important; }
#section-cookies .badge, #section-rusks .badge { background: #FFF9EE !important; color: #6B4F10 !important; border-color: rgba(139,105,20,.3) !important; }
#section-cookies + .scroll-next .scroll-next-name { -webkit-text-stroke-color: #8B6914; }
#section-cookies + .scroll-next:hover .scroll-next-name { color: #8B6914 !important; }
#section-cookies .product-card, #section-rusks .product-card { background: #FFFDF8 !important; border: 0 !important; border-radius: 6px !important; padding: 12px 12px 0; box-shadow: 0 2px 0 rgba(0,0,0,.04), 0 24px 40px rgba(80,55,15,.16); }
#section-cookies .product-card:nth-child(odd), #section-rusks .product-card:nth-child(odd) { transform: rotate(-1.4deg); }
#section-cookies .product-card:nth-child(even), #section-rusks .product-card:nth-child(even) { transform: rotate(1.2deg); }
#section-cookies .product-card:hover, #section-rusks .product-card:hover { transform: rotate(0) translateY(-6px) !important; }
#section-cookies .product-card::before, #section-rusks .product-card::before { content: ""; position: absolute; top: -10px; left: 50%; width: 90px; height: 22px; transform: translateX(-50%) rotate(-3deg); background: rgba(242,207,107,.55); z-index: 2; }
#section-cookies .product-card > img, #section-rusks .product-card > img { height: 210px !important; border-radius: 3px; }
#section-cookies .product-name, #section-rusks .product-name { color: #22180C; }
#section-cookies .product-price, #section-rusks .product-price { background: linear-gradient(100deg, #8B6914, #B8892A); -webkit-background-clip: text; background-clip: text; }
#section-cookies .qty-btn, #section-rusks .qty-btn { color: #8B6914 !important; border-color: rgba(139,105,20,.45) !important; }
#section-cookies .qty-btn:last-child, #section-rusks .qty-btn:last-child { color: #120E06 !important; }
#section-cookies .qty-num, #section-rusks .qty-num { color: #22180C !important; }
.gp-dunk { width: min(260px, 60vw); margin: 26px auto 0; display: block; overflow: visible; }
.gp-dunk .mug { fill: #FFFDF8; stroke: #22180C; stroke-width: 3; }
.gp-dunk .coffee { fill: #6B3E1E; }
.gp-dunk .rusk { fill: #D9A35A; stroke: #8A5A22; stroke-width: 2; }
.gp-dunk .wet { fill: #8A5426; }
.gp-dunk .steam { fill: none; stroke: rgba(34,24,12,.25); stroke-width: 3; stroke-linecap: round; }

/* ---------- Syrups: gold on black ---------- */
#section-syrups { background: radial-gradient(60% 80% at 50% 0%, rgba(201,162,39,.16), transparent 70%), #0B0A08 !important; padding-top: 70px !important; }
#section-syrups h2 { font: 400 clamp(2.6rem, 7vw, 5rem)/.95 var(--gp-display) !important; text-transform: uppercase; letter-spacing: .02em; }
.gp-syr-link { display: inline-block; margin-top: 22px; color: var(--g2); font-weight: 700; font-size: 13px; letter-spacing: .12em; text-transform: uppercase; text-decoration: none; border-bottom: 1px solid rgba(242,207,107,.4); padding-bottom: 4px; }
#syrupGrid { grid-template-columns: repeat(auto-fill, minmax(210px, 1fr)) !important; }
#syrupGrid .product-img, #pumpGrid .product-img { height: 260px !important; object-fit: cover; }

/* ---------- Cart bar + modals ---------- */
.cart-bar { background: rgba(11,10,8,.86) !important; backdrop-filter: blur(16px); -webkit-backdrop-filter: blur(16px); border-top: 1px solid rgba(201,162,39,.4) !important; }
.go-btn, .pay-btn { background: var(--gold-grad) !important; border-radius: 999px !important; color: #120E06 !important; }
.overlay { backdrop-filter: blur(8px); -webkit-backdrop-filter: blur(8px); }
.modal { border-radius: 22px !important; border-color: rgba(201,162,39,.25) !important; }
.gp-motion .overlay.open .modal { animation: gp-sheet .55s var(--gp-ease); }
@keyframes gp-sheet { from { transform: translateY(40px) scale(.98); opacity: 0; } to { transform: none; opacity: 1; } }

/* ---------- Delivery ---------- */
.gp-deliver { background: linear-gradient(180deg, var(--night), #120F0A); padding: 100px 20px 90px; border-top: 1px solid rgba(201,162,39,.14); }
.gp-deliver .wrap { max-width: 1100px; margin: 0 auto; text-align: center; }
.gp-deliver .k { font: 700 11px 'Inter', sans-serif; letter-spacing: .34em; text-transform: uppercase; color: var(--g3); margin-bottom: 12px; }
.gp-deliver h2 { font: 400 clamp(2.6rem, 7vw, 5rem)/.95 var(--gp-display); text-transform: uppercase; color: var(--cream); letter-spacing: .02em; }
.gp-deliver h2 em { font: 400 1.15em/.8 var(--gp-script); text-transform: none; color: var(--g2); font-style: normal; margin-left: .1em; }
.gp-deliver .route { width: 100%; height: auto; margin: 30px 0 16px; overflow: visible; }
.gp-deliver .road { fill: none; stroke: rgba(243,236,221,.08); stroke-width: 18; stroke-linecap: round; }
.gp-deliver .line { fill: none; stroke: var(--g2); stroke-width: 3; stroke-dasharray: 10 12; stroke-linecap: round; }
.gp-deliver .pin circle { fill: var(--g2); } .gp-deliver .pin .ring { fill: none; stroke: rgba(242,207,107,.5); stroke-width: 2; }
.gp-deliver .home path { fill: var(--cream); }
.gp-deliver .cards { display: grid; grid-template-columns: repeat(4, 1fr); gap: 16px; text-align: left; }
.gp-deliver .c { display: grid; gap: 8px; align-content: start; padding: 22px; border-radius: 18px; background: var(--char); border: 1px solid rgba(201,162,39,.16); color: var(--muted); font-size: 13.5px; line-height: 1.5; text-decoration: none; }
.gp-deliver .c b { font: 400 1.6rem/1 var(--gp-display); letter-spacing: .03em; text-transform: uppercase; color: var(--cream); }
.gp-deliver .c.wa { border-color: rgba(37,211,102,.35); }
.gp-deliver .c.wa b { color: #5BE38F; }
.gp-deliver .more { display: inline-block; margin-top: 26px; color: var(--g2); font-size: 13px; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; text-decoration: none; }

/* ---------- Footer: giant wordmark ---------- */
footer { background: #0E0C09 !important; overflow: hidden; padding-top: 60px !important; }
footer > img { width: 84px !important; height: 84px !important; border-radius: 50%; opacity: 1 !important; }
.gp-giant { display: flex; justify-content: center; margin: 34px -20px -10px; font: 400 clamp(5rem, 21vw, 19rem)/.8 var(--gp-display); letter-spacing: .01em; white-space: nowrap; user-select: none; }
.gp-giant span { display: inline-block; background: var(--gold-grad); -webkit-background-clip: text; background-clip: text; color: transparent; }

/* ---------- Phones ---------- */
@media (max-width: 760px) {
  header { padding: 10px 14px !important; }
  header .logo small { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; max-width: 54vw; font-size: 8.5px; letter-spacing: .16em; }
  .cart-btn { padding: 9px 14px !important; font-size: 13px !important; }
  .gp-meter .mark i { font-size: 10px; letter-spacing: .02em; }
  header .logo { font-size: 22px; }
  .hero { min-height: calc(100svh - 104px); padding: 40px 16px 48px !important; }
  .hero h1 .gp-big { font-size: 25vw; }
  .hero h1 .gp-script { font-size: 15vw; margin-left: 18%; }
  .hero h1 .gp-kick { letter-spacing: .3em; }
  .hero h1 .gp-kick::before, .hero h1 .gp-kick::after { width: 22px; margin: 0 8px; }
  .hero .badge { font-size: 11px !important; padding: 5px 11px !important; }
  .gp-plates .p1 { width: 30vw; left: -8%; top: 6%; }
  .gp-plates .p2 { width: 24vw; right: -6%; top: 14%; }
  .gp-plates .p3 { width: 22vw; left: -6%; bottom: 4%; }
  .gp-plates .p4 { width: 26vw; right: -8%; bottom: 6%; }
  .gp-plates .p5 { display: none; }
  .gp-tapes { height: 110px; }
  .info-inner { grid-template-columns: repeat(3, 1fr) !important; gap: 8px !important; }
  .info-item .icon { width: 48px; height: 48px; font-size: 20px !important; }
  .info-item .title { font-size: 1rem !important; }
  .info-item .desc { font-size: 11px !important; }
  .section { padding: 40px 14px !important; }
  #bigGrid, #smallGrid, #syrupGrid, #section-rusks .products-grid { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; gap: 12px !important; }
  #bigGrid .product-card, #smallGrid .product-card { padding-top: 16px; }
  .products-grid .product-body { padding: 12px 12px 14px !important; }
  .products-grid .product-name { font-size: 1.15rem !important; }
  #bigGrid .product-desc, #smallGrid .product-desc, #syrupGrid .product-desc, #section-rusks .product-desc { display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; font-size: 12px !important; margin: 4px 0 8px !important; }
  .products-grid .product-footer { flex-direction: column; align-items: stretch !important; gap: 8px; }
  .products-grid .product-price { font-size: 1.7rem !important; }
  .products-grid .qty-control { justify-content: space-between; }
  #syrupGrid .product-img, #pumpGrid .product-img { height: 200px !important; }
  #section-rusks .product-card > img { height: 130px !important; }
  #section-cookies .product-card > img { height: 220px !important; }
  .gp-deliver { padding: 70px 16px; }
  .gp-deliver .cards { grid-template-columns: 1fr 1fr; gap: 10px; }
  .gp-deliver .c { padding: 16px; font-size: 12.5px; }
  .gp-deliver .c b { font-size: 1.25rem; }
  .scroll-next { padding: 34px 16px !important; }
}

@media (prefers-reduced-motion: reduce) {
  .gp-grain, .sec-banner-icon { animation: none !important; }
}
.sec-title { max-width: 100%; }
.gp-meter .mark.m20 i { left: auto; right: 0; transform: none; }
.gp-meter .mark.m15 i { transform: translateX(calc(-100% - 8px)); left: 0; }
.gp-meter .kg b span { font: inherit; color: inherit; letter-spacing: 0; text-transform: none; }
.cart-btn { white-space: nowrap; }
.gp-dunk { margin-top: 70px; }
#section-cookies .products-grid, #frozenGrid { grid-template-columns: minmax(0, 380px) !important; justify-content: center; }
#small1kgTitle { margin-top: 64px !important; }