/* Breaking Budz Xmas performance and artwork-fit refinement.
   Purely presentational; no API, KV, cart, admin, checkout or inventory changes. */
:root{--xmas-hdr-desktop:154px}
/* Fit complete, unaltered Christmas banner inside its own space at every viewport. */
.brand-nav{
  height:var(--xmas-hdr-desktop)!important;min-height:0!important;
  position:relative;overflow:hidden;isolation:isolate;
  background-color:#080913!important;
  background-image:linear-gradient(90deg,rgba(6,7,17,.94),rgba(12,9,35,.25) 32%,rgba(12,9,35,.25) 68%,rgba(6,7,17,.94)),url('assets/breaking-budz-desktop-atmosphere.webp')!important;
  background-position:center,center!important;background-size:100% 100%,cover!important;
  background-repeat:no-repeat,no-repeat!important;
  box-shadow:inset 0 -5px 12px rgba(5,7,20,.7),0 2px 14px rgba(182,247,253,.18)!important;
}
.brand-nav::before{content:''!important;display:block!important;position:absolute!important;inset:0 0 auto!important;height:4px!important;z-index:1!important;pointer-events:none!important;background:repeating-linear-gradient(90deg,#f34b65 0 15px,#ffe57b 15px 30px,#6dff7c 30px 45px,#5ff0ff 45px 60px,#df76ff 60px 75px)!important;filter:none!important}
.brand-nav::after{content:''!important;display:block!important;position:absolute!important;inset:auto 0 0!important;height:7px!important;z-index:1!important;pointer-events:none!important;background:linear-gradient(180deg,transparent,rgba(229,249,255,.8)),repeating-radial-gradient(ellipse at 20px 11px,#f7ffff 0 9px,transparent 10px 22px)!important;filter:none!important}
.brand-nav-home{z-index:2!important;max-width:100%!important;align-self:stretch;overflow:hidden!important}
.xmas-nav-picture{display:flex;align-items:center;justify-content:center;width:100%;height:100%;min-width:0;pointer-events:none}
.xmas-nav-art{display:block;width:100%;height:100%;max-height:100%;max-width:100%;object-fit:contain;object-position:center;filter:none;transform:none}
.brand-nav .site-menu-toggle,.brand-nav .cart-trigger{z-index:4!important;flex-shrink:0}
.site-quick-nav{top:var(--xmas-hdr-desktop)!important}
/* Never crop or fade the illustrated edges of the hero. All elements in the original picture survive. */
.hero.skate-hero{overflow:visible!important;isolation:isolate;background-color:#090514!important;background-image:linear-gradient(90deg,rgba(4,7,18,.83),rgba(20,8,34,.46) 42%,rgba(20,8,34,.46) 58%,rgba(4,7,18,.83)),url('assets/breaking-budz-desktop-atmosphere.webp')!important;background-position:center,center!important;background-size:100% 100%,cover!important;background-repeat:no-repeat,no-repeat!important}
.hero.skate-hero::before,.hero.skate-hero::after{content:none!important;display:none!important}
.hero .hero-aura,.skate-art-glow{display:none!important;animation:none!important}
.skate-hero-layout{width:min(100%,610px)!important;max-width:610px!important;min-height:0!important;margin:0 auto!important;padding:14px 12px 22px!important;display:flex!important;justify-content:center!important;align-items:center!important}
.skate-art-wrap{width:min(100%,573px)!important;max-width:573px!important;flex:0 1 573px!important;min-width:0!important;overflow:visible!important;box-shadow:0 0 0 1px rgba(224,253,255,.28),0 14px 45px rgba(0,0,0,.35)!important;background:transparent!important;border-radius:12px!important;line-height:0!important}
.skate-art{display:block;width:100%!important;height:auto!important;max-height:none!important;object-fit:contain!important;object-position:center!important;margin:0 auto!important;filter:none!important;-webkit-mask-image:none!important;mask-image:none!important;border-radius:12px}
/* Replace a large number of individual filters/animations with lightweight fixed art. */
#xmas-wallpaper{transform:none!important;background-size:100% 100%,min(570px,120vw) auto!important}
#xmas-snowmen{grid-template-columns:repeat(4,minmax(0,1fr))!important;grid-template-rows:repeat(3,minmax(0,1fr))!important;opacity:.65!important;contain:strict}
.xmas-snowman-cell,.xmas-snowman{filter:none!important}
.xmas-snowman{width:clamp(70px,9vw,98px)!important}
.xmas-snowman .snowman-body,.xmas-snowman .snowman-hat-pom,.xmas-snowman .snowman-eyes{animation:none!important}
.xmas-snowman .snowman-arm-left{animation:xmas-wave 4.8s ease-in-out infinite!important}
.xmas-snowman .snowman-arm-right{animation:xmas-wave 5.2s ease-in-out infinite reverse!important}
/* Card borders hold their festive colour without repainting every frame while scrolling. */
.product-slot::before,.product-slot::after{animation:none!important;transition:opacity .2s ease}
.effects-ready .product-slot.bb-visible{animation:none!important}
#menu .product-slot{box-shadow:0 5px 15px rgba(0,0,0,.30),inset 0 1px 0 rgba(255,255,255,.05)!important}
#menu .product-slot:hover{box-shadow:0 8px 24px rgba(0,0,0,.45),0 0 12px rgba(160,255,175,.25)!important}
@media(max-width:819px){
  :root{--xmas-hdr-desktop:98px}
  .brand-nav{grid-template-columns:43px minmax(0,1fr) 43px!important;gap:3px!important;padding:5px 8px!important;background-size:100% 100%,cover!important}
  .brand-nav-home{width:100%!important}
  .xmas-nav-art{width:100%!important;height:88px!important;max-width:100%!important;max-height:calc(var(--xmas-hdr-desktop) - 10px)!important;object-fit:contain!important}
  .skate-hero-layout{width:100%!important;padding:0!important;max-width:570px!important}
  .skate-art-wrap,.skate-art{width:100%!important;max-width:100%!important;flex:1 1 auto!important;border-radius:0!important;box-shadow:none!important}
  .skate-art{max-height:none!important}
  #xmas-snowmen{grid-template-columns:repeat(2,minmax(0,1fr))!important;grid-template-rows:repeat(4,minmax(0,1fr))!important;opacity:.46!important}
  .xmas-snowman{width:clamp(55px,16vw,78px)!important}
  .xmas-snowman .snowman-arm-right{animation:none!important}
  #menu .product-slot{box-shadow:0 4px 14px rgba(0,0,0,.3)!important}
  #menu .product-slot:hover{transform:none!important}
  .product-image{transition:none!important}
}
@media(max-width:360px){:root{--xmas-hdr-desktop:90px}.xmas-nav-art{height:80px!important}}
@media(prefers-reduced-motion:reduce){
  #xmas-snowmen .xmas-snowman *,.marquee-track,.skate-art-glow{animation:none!important}
  .product-slot,.product-slot *{transition:none!important}
}

/* DEVICE-RENDERING SAFETY FIX:
   The transparent snowfall canvas must never be the topmost fullscreen layer.
   Some mobile/GPU configurations composite desynchronised canvas as opaque
   black, hiding the site even though flakes remain visible. Keep the canvas
   behind all meaningful content while retaining snow visible in page gutters. */
#xmas-wallpaper { z-index:0 !important; }
#xmas-snowmen { z-index:1 !important; }
#xmas-snowfall { z-index:2 !important; background:transparent !important; }
.site-shell { position:relative !important; z-index:3 !important; }