/* ============================================================
   BRAINZAP RENTALS — "GEAR LIST" theme
   The flyer, brought to life. Loaded after brainzap.css on the
   rentals catalog + item pages. Blue crumpled paper, black panels,
   yellow Krungthep headers, cyan gear text. Voice + colors are
   Brainzap's own (#FFD400 yellow, black, Bushwick). No AI copy.
   Krungthep renders on Mac/iOS; Oswald is the cross-browser fallback.
   ============================================================ */
:root{
  --fl-blue:#0081B3; --fl-yellow:#FFD400; --fl-black:#0a0a0a;
  --fl-cyan:#7fe9ff; --fl-panel:rgba(7,16,22,.86); --fl-panel-2:rgba(7,16,22,.94);
  --fl-display:"Krungthep","Krungthep UI","Krungtherp",Oswald,Impact,"Arial Black",sans-serif;
}
body{
  background-color:var(--fl-blue)!important;
  background-image:url("/images/paper-blue.jpg")!important;
  background-size:1100px auto!important;background-position:center!important;background-repeat:repeat!important;
  color:#fff;
}
body::before{content:'';position:fixed;inset:0;z-index:-1;pointer-events:none;background:
  radial-gradient(1000px 520px at 50% -8%, rgba(255,212,0,.10), transparent 62%),
  rgba(3,12,18,.42)}

/* ---------- header ---------- */
.site-header{background:var(--fl-black)!important;border-bottom:3px solid var(--fl-yellow)!important}
.site-header.scrolled{box-shadow:0 4px 0 rgba(0,0,0,.4)!important}
.brand,.brand small{color:#fff!important}
.nav-links a{color:var(--fl-yellow)!important;font-family:var(--fl-display);font-size:14px;letter-spacing:.04em;text-transform:uppercase}
.nav-links a:hover{color:#fff!important}
.search{background:rgba(255,255,255,.08)!important;border-color:rgba(255,212,0,.5)!important}
.search input,.search svg{color:#fff!important}
.search input::placeholder{color:rgba(255,255,255,.6)!important}
.search:focus-within{background:rgba(255,255,255,.14)!important;border-color:var(--fl-yellow)!important;box-shadow:0 0 0 3px rgba(255,212,0,.3)!important}
.cart-btn{background:var(--fl-yellow)!important;color:#000!important;border-color:#000!important;font-family:var(--fl-display);letter-spacing:.04em}
.cart-count{background:#000!important;color:var(--fl-yellow)!important}

/* ============================================================
   GEAR LIST hero (the flyer banner)
   ============================================================ */
.flyer-hero{position:relative;overflow:hidden;border-bottom:3px solid var(--fl-yellow);
  background:linear-gradient(180deg,rgba(0,0,0,.34),rgba(0,0,0,.02))}
.flyer-hero__in{max-width:var(--wrap,1320px);margin:0 auto;
  padding:clamp(26px,5vw,62px) var(--gut,32px) clamp(22px,4vw,46px);position:relative;z-index:2}
.flyer-hero__kicker{font-family:var(--fl-display);font-size:clamp(11px,1.5vw,15px);letter-spacing:.16em;
  color:var(--fl-yellow);text-transform:uppercase;text-shadow:0 2px 0 rgba(0,0,0,.55)}
.flyer-hero__title{font-family:var(--fl-display);font-weight:400;font-size:clamp(66px,17vw,190px);line-height:.8;
  color:var(--fl-yellow);letter-spacing:.005em;margin:4px 0 0;text-transform:uppercase;
  text-shadow:7px 7px 0 var(--fl-black),0 0 46px rgba(255,212,0,.35)}
.flyer-hero__line{font-family:var(--fl-display);font-size:clamp(14px,2.6vw,28px);color:#fff;letter-spacing:.05em;
  margin-top:12px;text-transform:uppercase;text-shadow:2px 2px 0 rgba(0,0,0,.6)}
.flyer-hero__line b{color:var(--fl-cyan);font-weight:inherit}
.flyer-hero__cta{display:flex;gap:12px;flex-wrap:wrap;margin-top:24px}
.fbtn{display:inline-flex;align-items:center;font-family:var(--fl-display);font-size:15px;letter-spacing:.06em;
  text-transform:uppercase;padding:13px 24px;border-radius:10px;border:3px solid var(--fl-black);
  box-shadow:4px 4px 0 rgba(0,0,0,.45);transition:transform .12s,box-shadow .12s}
.fbtn:hover{transform:translate(-2px,-2px);box-shadow:6px 7px 0 rgba(0,0,0,.5)}
.fbtn--yellow{background:var(--fl-yellow);color:#000}
.fbtn--ghost{background:rgba(0,0,0,.55);color:var(--fl-yellow);border-color:var(--fl-yellow)}
.flyer-hero__bolt{position:absolute;right:-3%;top:50%;transform:translateY(-50%) rotate(9deg);
  width:min(42vw,560px);height:150%;background:url("/images/bolt-yellow.png") right center/contain no-repeat;
  opacity:.92;z-index:1;pointer-events:none;filter:drop-shadow(0 0 34px rgba(255,212,0,.45))}
@media(max-width:780px){.flyer-hero__bolt{opacity:.22}}

/* ---------- subbar ---------- */
.subbar{background:rgba(8,18,24,.94)!important;border-bottom:2px solid rgba(255,212,0,.5)!important}
.result-count{color:var(--fl-cyan)!important;font-weight:700;font-family:var(--fl-display);letter-spacing:.04em}
.active-chip{background:var(--fl-yellow)!important;color:#000!important;border-color:#000!important}
.active-chip button{color:#000!important}
.clear-all{color:var(--fl-yellow)!important}
.filters-toggle{color:#fff!important;border-color:rgba(255,212,0,.5)!important}
.sort-select{background-color:rgba(255,255,255,.08)!important;border-color:rgba(255,212,0,.45)!important;color:#fff!important}
.view-toggle{border-color:rgba(255,212,0,.45)!important}
.view-toggle button{background:transparent!important;color:#fff!important}
.view-toggle button[aria-pressed="true"]{background:var(--fl-yellow)!important;color:#000!important}

/* ---------- filter rail ---------- */
.rail{background:var(--fl-black)!important;border:3px solid var(--fl-yellow);border-radius:14px;
  padding:8px 14px 14px!important;box-shadow:6px 7px 0 rgba(0,0,0,.5)}
.rail-title{color:var(--fl-yellow)!important;font-family:var(--fl-display);letter-spacing:.05em}
.rail details summary,.rail summary{color:var(--fl-yellow)!important;font-family:var(--fl-display);font-size:13px;letter-spacing:.05em;text-transform:uppercase}
.rail .frow,.rail label{color:#fff!important}
.rail .num{color:var(--fl-cyan)!important}
.rail .reset{color:var(--fl-yellow)!important;border:2px solid var(--fl-yellow)!important;background:transparent!important;font-family:var(--fl-display);letter-spacing:.04em}
.rail .reset:hover{background:var(--fl-yellow)!important;color:#000!important}

/* ---------- category bands: flyer tabs ---------- */
.cat-band{margin:0 0 36px}
.cat-band h2{display:inline-block;font-family:var(--fl-display)!important;font-weight:400!important;
  font-size:clamp(28px,5.2vw,58px)!important;line-height:1!important;color:var(--fl-yellow)!important;letter-spacing:.01em;
  background:var(--fl-black);padding:9px 24px;border-radius:4px;transform:rotate(-1.4deg);
  box-shadow:5px 6px 0 rgba(0,0,0,.5);text-shadow:2px 2px 0 rgba(0,0,0,.55);margin:0 0 20px;text-transform:uppercase}
.cat-band h2 .num{color:var(--fl-cyan)!important;font-size:.5em}

/* ---------- gear cards ---------- */
.gear-card{background:var(--fl-panel)!important;border:3px solid var(--fl-black)!important;border-radius:12px!important;
  box-shadow:5px 6px 0 rgba(0,0,0,.45)!important;overflow:hidden;transition:transform .14s ease,box-shadow .14s ease,border-color .14s ease}
.gear-card:hover{transform:translate(-3px,-3px);box-shadow:8px 9px 0 rgba(0,0,0,.5)!important;border-color:var(--fl-yellow)!important}
.gear-card__frame{background:#fff!important}
.gear-card__cat{color:var(--fl-cyan)!important;font-family:var(--fl-display);font-size:11px;letter-spacing:.05em;text-transform:uppercase}
.gear-card__title{color:#fff!important;font-weight:700}
.gear-card__foot .price{color:var(--fl-yellow)!important;font-family:var(--fl-display);letter-spacing:.02em}
.gear-card__foot .unit{color:rgba(255,255,255,.6)!important}
.add-btn{background:var(--fl-yellow)!important;color:#000!important;border-color:#000!important;font-family:var(--fl-display);font-size:12px;letter-spacing:.04em;text-transform:uppercase}
.add-btn:hover{background:#fff!important}
.badge--pkg{background:var(--fl-yellow)!important;color:#000!important;border-color:#000!important;font-family:var(--fl-display);letter-spacing:.04em}
.badge--inc{background:var(--fl-black)!important;color:var(--fl-cyan)!important}
.empty-state{color:#fff!important;background:var(--fl-panel)!important;border-color:rgba(255,212,0,.4)!important}

/* ---------- "+ loads of g&e" strip under the grid ---------- */
.flyer-foot{max-width:var(--wrap,1320px);margin:8px auto 0;padding:26px var(--gut,32px) 60px;text-align:center}
.flyer-foot .ge{font-family:var(--fl-display);font-size:clamp(22px,5vw,46px);color:var(--fl-yellow);text-transform:uppercase;
  letter-spacing:.02em;text-shadow:3px 3px 0 rgba(0,0,0,.5)}
.flyer-foot .ln{font-family:var(--fl-display);color:#fff;letter-spacing:.06em;margin-top:10px;font-size:clamp(12px,1.8vw,16px);text-transform:uppercase}
.flyer-foot a{color:var(--fl-yellow);border-bottom:2px solid rgba(255,212,0,.5)}

/* ---------- item pages ---------- */
.breadcrumb{color:rgba(255,255,255,.7)!important}
.breadcrumb a{color:var(--fl-cyan)!important}
.breadcrumb .sep{color:rgba(255,255,255,.4)!important}
.buybox{background:var(--fl-panel)!important;border:3px solid var(--fl-black);border-radius:14px;padding:20px!important;box-shadow:6px 7px 0 rgba(0,0,0,.45)}
.buybox .cat{color:var(--fl-cyan)!important;font-family:var(--fl-display);letter-spacing:.05em;text-transform:uppercase}
.buybox h1{color:#fff!important;font-family:var(--fl-display)!important;font-weight:400!important;line-height:1.08;text-transform:uppercase;letter-spacing:.005em}
.buybox .status{color:rgba(255,255,255,.75)!important}
.buybox .desc{color:rgba(255,255,255,.85)!important}
.priceblock{border-color:rgba(255,255,255,.18)!important}
.priceblock .big{color:var(--fl-yellow)!important;font-family:var(--fl-display)}
.priceblock .unit{color:rgba(255,255,255,.75)!important}
.quote{background:rgba(255,255,255,.06)!important;border-radius:10px;padding:12px!important}
.quote label{color:rgba(255,255,255,.8)!important}
.quote input{background:rgba(255,255,255,.12)!important;color:#fff!important;border-color:rgba(255,212,0,.4)!important}
.quote-line{color:rgba(255,255,255,.85)!important}
.included h3,.related h2{color:var(--fl-yellow)!important;font-family:var(--fl-display)!important;font-weight:400!important;text-transform:uppercase;letter-spacing:.02em}
.included{border-top-color:rgba(255,255,255,.18)!important}
.included ul{color:rgba(255,255,255,.85)!important}
.included li::before{color:var(--fl-yellow)!important}
.included a{color:#fff!important;border-bottom-color:var(--fl-yellow)!important}
.related p{color:rgba(255,255,255,.8)!important}
.gallery-main,.gallery-thumb{background:#fff!important;border-radius:10px;border:3px solid var(--fl-black)!important}
.gallery-thumb.is-active{outline:3px solid var(--fl-yellow)!important}
.item-layout .btn-primary,.mobile-buybar .btn-primary{background:var(--fl-yellow)!important;color:#000!important;border-color:#000!important;font-family:var(--fl-display);letter-spacing:.04em}
.btn-ghost{background:rgba(0,0,0,.45)!important;color:var(--fl-yellow)!important;border-color:rgba(255,212,0,.5)!important;font-family:var(--fl-display);letter-spacing:.04em}
.mobile-buybar{background:var(--fl-black)!important;border-top:2px solid var(--fl-yellow)!important}
.mobile-buybar .price{color:var(--fl-yellow)!important;font-family:var(--fl-display)}

/* keep the storm game out of the filter rail on gear pages */
.bz-game-ctl{left:auto!important;right:14px!important;align-items:flex-end!important}
