/* Breaking Budz Christmas 2026 — clean candy-cane top bar + composited snow.
   Visual-only patch over the confirmed working Christmas build.
   Two perfectly straight diagonal red/white candy-cane rules, no scallops.
   The entire original hero image is retained and never masked. */
:root { --xmas-hdr-desktop: 154px; --candy-size: 8px; }
.brand-nav {
  box-sizing: border-box !important;
  position: relative !important;
  height: var(--xmas-hdr-desktop) !important;
  min-height: var(--xmas-hdr-desktop) !important;
  padding-block: 14px !important;
  overflow: hidden !important;
  border: 0 !important;
  border-radius: 0 !important;
  background-color: #0b0619 !important;
  background-image: linear-gradient(90deg,rgba(9,7,19,.54),rgba(8,8,23,.14) 48%,rgba(9,7,19,.54)),url('assets/breaking-budz-desktop-atmosphere.webp') !important;
  background-size: cover, cover !important;
  background-position: center center, center center !important;
  box-shadow: inset 0 0 24px #05030f9c !important;
}
.brand-nav::before, .brand-nav::after {
  content: '' !important;
  display: block !important;
  position: absolute !important;
  left: 0 !important;
  right: 0 !important;
  width: 100% !important;
  height: var(--candy-size) !important;
  pointer-events: none !important;
  z-index: 12 !important;
  border: 0 !important;
  border-radius: 0 !important;
  opacity: 1 !important;
  filter: none !important;
  transform: none !important;
  /* A horizontal, perfectly straight ribbon made from diagonal red & white sections. */
  background: repeating-linear-gradient(120deg, #d72445 0 11px, #fffaf0 11px 22px) !important;
  background-size: auto !important;
  background-repeat: repeat !important;
}
.brand-nav::before { top: 0 !important; bottom: auto !important; box-shadow: 0 2px 0 #c51e3d, 0 3px 7px #05010e !important; }
.brand-nav::after { top: auto !important; bottom: 0 !important; box-shadow: 0 -2px 0 #c51e3d, 0 -3px 7px #05010e !important; }
.brand-nav-home {
  max-height: calc(100% - 2px) !important;
  overflow: visible !important;
  min-height: 0 !important;
  align-self: center !important;
}
.xmas-nav-picture { max-height: 100% !important; overflow: visible !important; }
.xmas-nav-art {
  width: 100% !important;
  height: 100% !important;
  max-height: calc(var(--xmas-hdr-desktop) - 30px) !important;
  object-fit: contain !important;
  object-position: 50% 50% !important;
  clip-path: none !important;
  mask-image: none !important;
  -webkit-mask-image: none !important;
}
.brand-nav .site-menu-toggle, .brand-nav .cart-trigger { flex-shrink: 0; z-index: 13 !important; }
.site-quick-nav { top: var(--xmas-hdr-desktop) !important; }
/* A single lightweight snowfield is ABOVE the hero / page wallpaper but BELOW
   the menu stack (and behind the header candy-cane borders). Product photos, prices, text, and controls remain unobscured.
   Screen blending also prevents an opaque-black canvas from hiding the shop
   on device/GPU combinations that composite transparent canvas incorrectly. */
.site-shell { position: relative !important; z-index: 3 !important; }
#xmas-snowfall {
  position: fixed !important;
  inset: 0 !important;
  z-index: 5 !important;
  pointer-events: none !important;
  background: transparent !important;
  mix-blend-mode: screen !important;
  opacity: .95;
  transform: none !important;
  isolation: auto !important;
  contain: size !important;
}
#menu.menu-section {
  position: relative !important;
  isolation: isolate !important;
  z-index: 11 !important;
}
#menu .product-slot, #menu .product-image, #menu .product-info {
  position: relative;
}
#xmas-wallpaper { z-index: 0 !important; }
#xmas-snowmen { z-index: 1 !important; }
.hero.skate-hero { overflow: visible !important; }
.skate-art, .skate-art-wrap { -webkit-mask-image: none !important; mask-image: none !important; }
@media (max-width: 819px) {
  :root { --xmas-hdr-desktop: 110px; --candy-size: 7px; }
  .brand-nav {
    grid-template-columns: 43px minmax(0,1fr) 43px !important;
    gap: 4px !important;
    padding: 15px 9px !important;
  }
  .brand-nav-home { height: 100% !important; }
  .xmas-nav-picture { height: 100% !important; }
  .xmas-nav-art {
    height: 100% !important;
    max-height: 78px !important;
    width: 100% !important;
    object-fit: contain !important;
  }
}
@media (max-width: 360px) {
  :root { --xmas-hdr-desktop: 100px; --candy-size: 6px; }
  .brand-nav { padding-inline: 6px !important; gap: 2px !important; }
  .xmas-nav-art { max-height: 70px !important; }
}
@media (prefers-reduced-motion: reduce) {
  #xmas-snowfall { opacity: .55; }
}

/* Header button cleanup: no artificial white snow along menu/cart button tops. */
.brand-nav .site-menu-toggle::before,
.brand-nav .cart-trigger::before,
.brand-nav .site-menu-toggle::after,
.brand-nav .cart-trigger::after { content: none !important; display: none !important; }
