/* ===== page banner: same dark photo as the home hero ===== */
.pbn{position:relative;overflow:hidden;color:#fff;min-height:340px;display:flex;align-items:center;background:#0b0b0d}
.pbn-bg{position:absolute;inset:0;background-size:cover;background-position:right center;background-repeat:no-repeat;background-color:#0b0b0d}
.pbn-tint{position:absolute;inset:0;background:linear-gradient(90deg,rgba(8,8,10,.35) 0%,rgba(8,8,10,0) 55%)}
.pbn-glow{position:absolute;width:55%;height:110%;left:-12%;bottom:-70%;background:radial-gradient(closest-side,rgba(225,6,0,.45),transparent);pointer-events:none}
.pbn-in{position:relative;z-index:2;padding:54px clamp(24px,7vw,110px);max-width:900px;animation:pbin .8s ease both}
@keyframes pbin{from{opacity:0;translate:0 18px}to{opacity:1;translate:0 0}}
.pbn-c{display:flex;align-items:center;gap:10px;font:500 14px 'Jost',sans-serif;letter-spacing:.06em;text-transform:uppercase;color:#cfcfcf}
.pbn-c a{color:#fff}.pbn-c a:hover{color:#ff7a72}
.pbn-c i{width:22px;height:2px;background:#E10600;border-radius:2px}
.pbn h1{font:700 clamp(36px,5.4vw,76px)/1 'Jost',sans-serif!important;letter-spacing:-.025em;margin:18px 0 14px;color:#fff;text-transform:none!important;max-width:820px}
.pbn p{font-size:clamp(16px,1.4vw,19px);color:#d8d8d8;max-width:560px;margin:0}
@media(max-width:700px){.pbn{min-height:240px}.pbn-in{padding:40px 22px}}
@media(prefers-reduced-motion:reduce){.pbn-in{animation:none}}





/* hero-style banners (static, same look as home hero) */
.pbn{min-height:min(440px,60vh)}
.pbn-bg{background-position:right center;filter:saturate(.95) contrast(1.05)}
.pbn-tint{background:linear-gradient(90deg,rgba(8,8,10,.94) 0%,rgba(8,8,10,.82) 36%,rgba(8,8,10,.35) 70%,rgba(8,8,10,.2) 100%),linear-gradient(0deg,rgba(8,8,10,.75),transparent 40%)}
.pbn-glow{left:-10%;bottom:-50%;width:70%;height:100%;background:radial-gradient(closest-side,rgba(225,6,0,.5),transparent)}
.pbn-in{padding:64px clamp(24px,7vw,110px);max-width:860px;animation:none}
.pbn h1{font-size:clamp(40px,6vw,84px)!important;line-height:.98;letter-spacing:-.03em;margin:22px 0 20px}
.pbn h1 em{font-style:normal;color:#E10600}
.pbn-shop,.pbn-ct{background:#0b0b0d}
.pbn-shop .pbn-in,.pbn-ct .pbn-in{max-width:min(58%,700px)}
.pbn-pt{position:absolute;right:clamp(24px,6%,100px);top:50%;translate:0 -50%;width:min(36%,440px);display:grid;grid-template-columns:repeat(3,1fr);gap:14px}
.pt{width:100%;aspect-ratio:1;object-fit:cover;border-radius:20px;border:4px solid #fff;box-shadow:0 22px 28px -16px rgba(0,0,0,.85)}
.pt1{rotate:-4deg}.pt2{rotate:3deg;translate:0 14px}.pt3{rotate:-2deg}.pt4{rotate:3deg;translate:0 -6px}.pt5{rotate:-3deg;translate:0 10px}.pt6{rotate:4deg}
.pbn-rp{position:absolute;right:clamp(30px,9%,160px);top:50%;width:300px;height:300px;translate:0 -50%}
.rg{position:absolute;border-radius:50%;border:2px solid rgba(225,6,0,.7)}
.rg1{inset:70px}.rg2{inset:30px;opacity:.55}.rg3{inset:-10px;opacity:.3}
.rpc{position:absolute;left:50%;top:50%;translate:-50% -50%;width:112px;height:112px;border-radius:50%;background:#E10600;color:#fff;display:grid;place-items:center;box-shadow:0 0 0 12px rgba(225,6,0,.22),0 24px 40px -12px rgba(0,0,0,.7)}
.rf{position:absolute;display:flex;align-items:center;gap:8px;white-space:nowrap;background:rgba(255,255,255,.12);border:1px solid rgba(255,255,255,.3);color:#fff;border-radius:999px;padding:9px 16px;font:500 14px 'Jost',sans-serif}
.rf svg{color:#ff6a62}
.rf1{left:-60px;top:6px}.rf2{right:-70px;top:120px}.rf3{left:-20px;bottom:8px}
@media(max-width:900px){.pbn-pt,.pbn-rp{display:none}.pbn-shop .pbn-in,.pbn-ct .pbn-in{max-width:none}}
@media(max-width:700px){.pbn{min-height:300px}.pbn-in{padding:44px 22px}}

/* photo banners: lighter fade so the photo shows */
.pbn-bg{background-size:cover;background-position:right center}
.pbn-tint{background:linear-gradient(90deg,rgba(8,8,10,.85) 0%,rgba(8,8,10,.55) 40%,rgba(8,8,10,0) 75%),linear-gradient(0deg,rgba(8,8,10,.5),transparent 40%)}
.pbn-glow{opacity:.8}
.pbn-shop .pbn-in,.pbn-ct .pbn-in{max-width:860px}
/* aligned banner text: same size, same left edge as the page content */
.pbn{min-height:360px}
.pbn-in{padding:56px max(24px,calc((100vw - 1240px)/2 + 24px));max-width:none;width:100%}
.pbn h1{font-size:clamp(34px,4.6vw,64px)!important;line-height:1.02;max-width:900px;margin:18px 0 16px}
.pbn h1 br{display:block}
.pbn p{max-width:520px}
@media(max-width:700px){.pbn{min-height:280px}.pbn-in{padding:40px 22px}}
/* HD hose photo for the shop banner */
.pbn-shop .pbn-bg{background-position:right 72%}
.pbn-shop .pbn-tint{background:linear-gradient(90deg,rgba(8,8,10,.92) 0%,rgba(8,8,10,.7) 38%,rgba(8,8,10,.1) 70%,rgba(8,8,10,0) 100%)}
.pbn-ct .pbn-bg{background-position:right center}
.pbn-ct .pbn-tint{background:linear-gradient(90deg,rgba(8,8,10,.92) 0%,rgba(8,8,10,.65) 45%,rgba(8,8,10,.15) 100%)}
/* stronger black fade on every page banner + soft blur on the photo */
.pbn-bg{filter:blur(2.5px) saturate(.95);transform:scale(1.04)}
.pbn-tint,.pbn-ct .pbn-tint,.pbn-shop .pbn-tint{background:linear-gradient(90deg,rgba(8,8,10,.97) 0%,rgba(8,8,10,.9) 34%,rgba(8,8,10,.55) 62%,rgba(8,8,10,.25) 100%),linear-gradient(0deg,rgba(8,8,10,.7),transparent 45%)}
