/* Bully Blast theme - home page. Ported from the approved Build 263 prototype (app/views/public.js "home" view stylesheet),
   scoped to main.bb-p-home. The prototype's own page nav, footer and prototype/simulation panels are not carried over. */
.bb-p-home{--char:#1c1c1e; --char-deep:#141416; --char-raise:#242427;
    --paper:#f4f3ee; --paper-dim:#a7a7a3; --yellow:#f3ea22; --yellow-hot:#f8f26b; --ink:#0c0c0d;
    --line:rgba(244,243,238,.14); --pouch:url('../../img/site/pouch.png');}
.bb-p-home *{margin:0;padding:0;box-sizing:border-box;}
.bb-p-home{background:var(--char);color:var(--paper);font-family:'Inter',system-ui,sans-serif;-webkit-font-smoothing:antialiased;overflow-x:clip;}
.bb-p-home .display{font-family:'Anton',sans-serif;text-transform:uppercase;line-height:.9;letter-spacing:.01em;}
.bb-p-home .yh{color:var(--yellow);}
.bb-p-home button{font-family:inherit;cursor:pointer;}
.bb-p-home .act{position:relative;height:1180vh;}
.bb-p-home .stage{position:sticky;top:0;height:100vh;overflow:hidden;cursor:grab;background:#0e0e10 url('../../img/site/range-warehouse.jpg') center/cover no-repeat;}
.bb-p-home .bg-grid{display:none;}
.bb-p-home .bg-vig{position:absolute;inset:0;pointer-events:none;background:linear-gradient(to bottom,rgba(10,10,12,.55) 0%,transparent 24%,transparent 50%,rgba(10,10,12,.72) 100%);}
.bb-p-home .spot{position:absolute;left:50%;top:42%;width:66vmin;height:66vmin;transform:translate(-50%,-50%);pointer-events:none;background:none;filter:blur(6px);will-change:transform;}
.bb-p-home .ribbon{position:absolute;inset:0;perspective:1400px;}
.bb-p-home .item{position:absolute;left:50%;top:42%;width:clamp(188px,21vw,313px);aspect-ratio:480/623;transform-origin:center;will-change:transform,opacity,filter;}
.bb-p-home .item .pk{position:absolute;inset:0;background:var(--pouch) center/contain no-repeat;transform-origin:center bottom;}
.bb-p-home .item .badge{position:absolute;top:5%;left:-7%;background:var(--yellow);color:var(--ink);font-weight:800;font-size:.6rem;letter-spacing:.1em;padding:5px 9px;transform:rotate(-6deg);box-shadow:0 6px 14px rgba(0,0,0,.4);}
.bb-p-home .hero-panel{position:absolute;left:0;right:0;bottom:9vh;display:flex;flex-direction:column;align-items:center;text-align:center;z-index:8;will-change:opacity,transform;}
.bb-p-home .hero-panel .kicker{color:var(--yellow);font-size:.68rem;letter-spacing:.34em;text-transform:uppercase;font-weight:800;margin-bottom:8px;}
.bb-p-home .hero-panel .vname{font-size:clamp(2.4rem,6vw,4.6rem);}
.bb-p-home .hero-panel .vsub{color:var(--paper);font-size:.92rem;margin-top:4px;}
.bb-p-home .progress{margin-top:20px;width:min(38vw,440px);}
.bb-p-home .ptrack{position:relative;height:3px;background:rgba(244,243,238,.16);border-radius:2px;}
.bb-p-home .pfill{position:absolute;left:0;top:0;height:100%;background:var(--yellow);border-radius:2px;transition:width .4s cubic-bezier(.3,.7,.2,1);}
.bb-p-home .phandle{position:absolute;top:50%;width:14px;height:14px;border-radius:50%;background:var(--yellow);transform:translate(-50%,-50%);box-shadow:0 0 10px 2px rgba(243,234,34,.5);transition:left .4s cubic-bezier(.3,.7,.2,1);}
.bb-p-home .hero-shop{display:flex;align-items:center;gap:16px;margin-top:22px;}
.bb-p-home .cta{background:var(--yellow);color:var(--ink);border:none;padding:12px 24px;font-weight:800;letter-spacing:.12em;text-transform:uppercase;font-size:.78rem;}
.bb-p-home .cta:hover{background:var(--yellow-hot);}
.bb-p-home .vprice{font-weight:800;font-size:1rem;}
.bb-p-home .scrollcue{position:absolute;left:50%;bottom:3vh;transform:translateX(-50%);color:var(--paper-dim);font-size:.64rem;letter-spacing:.28em;text-transform:uppercase;z-index:8;animation:cue 2s ease-in-out infinite;}
@keyframes cue{0%,100%{opacity:.4;}50%{opacity:1;}}
.bb-p-home .arrow{position:absolute;top:42%;transform:translateY(-50%);z-index:9;background:rgba(20,20,22,.4);border:1.5px solid var(--line);color:var(--paper);width:48px;height:48px;border-radius:50%;font-size:1.4rem;line-height:1;display:grid;place-items:center;transition:.15s;}
.bb-p-home .arrow:hover{border-color:var(--yellow);color:var(--yellow);}
.bb-p-home .arrow.left{left:5vw;}
.bb-p-home .arrow.right{right:5vw;}
@media(max-width:640px){.bb-p-home .arrow{width:40px;height:40px;}
.bb-p-home .arrow.left{left:3vw;}
.bb-p-home .arrow.right{right:3vw;}}
.bb-p-home .side-text{position:absolute;left:42%;right:5vw;top:0;bottom:0;z-index:8;opacity:0;pointer-events:none;display:flex;align-items:center;}
@media(max-width:760px){.bb-p-home .side-text{left:4vw;right:4vw;top:50%;bottom:0;}
.bb-p-home .hl-box{min-height:40vh;padding:22px 22px;}
.bb-p-home .hl-block{inset:22px 22px;}
.bb-p-home .side-text .ht{font-size:clamp(1.6rem,6.5vw,2.4rem);}
.bb-p-home .side-text .hd{font-size:.96rem;max-width:100%;}}
.bb-p-home .hl-box{position:relative;width:100%;min-height:360px;padding:36px 44px;background:rgba(15,15,17,.82);backdrop-filter:blur(4px);-webkit-backdrop-filter:blur(4px);border:1px solid var(--line);border-left:3px solid var(--yellow);overflow:hidden;}
.bb-p-home .hl-block{position:absolute;inset:36px 44px;display:flex;flex-direction:column;justify-content:center;text-align:center;will-change:opacity,transform;}
.bb-p-home .side-text .hk{font-family:'Anton',sans-serif;color:var(--yellow);font-size:.92rem;letter-spacing:.2em;text-transform:uppercase;}
.bb-p-home .side-text .ht{font-family:'Anton',sans-serif;text-transform:uppercase;font-size:clamp(1.9rem,3.8vw,3rem);line-height:.98;margin:8px 0 16px;}
.bb-p-home .side-text .hd{color:#d7d7d2;font-size:1.02rem;line-height:1.7;max-width:64%;margin:0 auto;}
.bb-p-home .tw{display:inline-block;will-change:transform,opacity;}
.bb-p-home .rail{position:absolute;right:2.4vw;top:50%;transform:translateY(-50%);display:flex;flex-direction:column;gap:9px;z-index:9;opacity:0;transition:opacity .3s;}
.bb-p-home .rail i{width:2px;height:24px;background:rgba(244,243,238,.2);}
.bb-p-home .rail i.on{background:var(--yellow);}
.bb-p-home .act3{position:relative;height:640vh;}
.bb-p-home .stage3{position:sticky;top:0;height:100vh;width:100vw;overflow:hidden;background:#0e0e10;}
.bb-p-home #blast{position:absolute;inset:0;width:100%;height:100%;display:block;}
.bb-p-home .blast-copy{position:absolute;left:0;right:0;top:9vh;text-align:center;z-index:3;pointer-events:none;}
.bb-p-home .blast-copy .kicker{color:var(--yellow);font-size:.7rem;letter-spacing:.34em;text-transform:uppercase;font-weight:800;}
.bb-p-home .blast-copy h2{font-family:'Anton',sans-serif;text-transform:uppercase;font-size:clamp(2.4rem,7vw,5.4rem);line-height:.9;margin-top:10px;}
.bb-p-home .blast-cue{position:absolute;bottom:5vh;left:0;right:0;text-align:center;color:var(--paper-dim);font-size:.64rem;letter-spacing:.26em;text-transform:uppercase;z-index:3;}
.bb-p-home .cta-wrap{height:130vh;background:var(--yellow);}
.bb-p-home .cta-strip{position:sticky;top:0;min-height:100vh;display:flex;flex-direction:column;align-items:center;justify-content:center;background:var(--yellow) url('../../img/site/cta-splat.jpg') center/cover no-repeat;color:var(--ink);padding:0 6vw;text-align:center;overflow:hidden;}
.bb-p-home .cta-strip .kick{font-size:.72rem;letter-spacing:.34em;text-transform:uppercase;font-weight:800;opacity:.72;}
.bb-p-home .cta-strip h2{font-family:'Anton',sans-serif;text-transform:uppercase;font-size:clamp(2.6rem,8vw,6.4rem);line-height:.88;margin:10px 0 0;}
.bb-p-home .cta-strip p{max-width:46ch;margin:16px auto 28px;font-size:1.06rem;font-weight:600;}
.bb-p-home .cta-strip .btns{display:flex;gap:14px;justify-content:center;flex-wrap:wrap;}
.bb-p-home .cta-strip .b{background:var(--ink);color:var(--yellow);border:none;padding:16px 32px;font-weight:800;letter-spacing:.1em;text-transform:uppercase;font-size:.9rem;cursor:pointer;transition:transform .15s;}
.bb-p-home .cta-strip .b.alt{background:transparent;color:var(--ink);border:2px solid var(--ink);}
.bb-p-home .cta-strip .b:hover{transform:translateY(-2px);}
.bb-p-home .gallery{position:relative;height:293vh;background:var(--char-deep);}
.bb-p-home .g-pin{position:sticky;top:0;height:100vh;overflow:hidden;background:var(--char-deep) url('../../img/site/halftone-dark.jpg') center/cover no-repeat;}
.bb-p-home .g-head{position:absolute;top:8vh;left:0;right:0;text-align:center;z-index:60;pointer-events:none;}
.bb-p-home .g-head .kick{color:var(--yellow);font-size:.72rem;letter-spacing:.34em;text-transform:uppercase;font-weight:800;}
.bb-p-home .g-head h2{font-family:'Anton',sans-serif;text-transform:uppercase;font-size:clamp(2rem,5vw,3.6rem);margin-top:8px;}
.bb-p-home .g-stage{position:absolute;inset:0;}
.bb-p-home .g-row{position:absolute;left:50%;top:50%;width:min(94vw,1720px);display:flex;gap:1vw;justify-content:center;transform-origin:center;will-change:transform,opacity;}
.bb-p-home .g-tile{position:relative;flex:1 1 0;min-width:0;aspect-ratio:3/4;background:#17171a;border:1px solid var(--line);overflow:hidden;box-shadow:0 30px 60px rgba(0,0,0,.5);will-change:transform,opacity;}
.bb-p-home .g-tile .thumb{position:absolute;inset:0;background:radial-gradient(130% 100% at 50% 28%,#2a2a2f,#0d0d0f);}
.bb-p-home .g-tile .play{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:52px;height:52px;border-radius:50%;background:rgba(243,234,34,.92);display:grid;place-items:center;color:var(--ink);font-size:1rem;padding-left:4px;}
.bb-p-home .g-tile .tag{position:absolute;left:10px;bottom:10px;font-size:.6rem;letter-spacing:.12em;text-transform:uppercase;color:#d0d0cc;}
.bb-p-home .g-tile .ret{position:absolute;right:8px;top:8px;width:20px;height:20px;opacity:.55;}
@media(max-width:760px){.bb-p-home .g-tile{width:38vw;}}
.bb-p-home .safety{background:var(--char);padding:12vh 6vw;}
.bb-p-home .safety .wrap2{max-width:1040px;margin:0 auto;}
.bb-p-home .safety .kick{color:var(--yellow);font-size:.72rem;letter-spacing:.34em;text-transform:uppercase;font-weight:800;}
.bb-p-home .safety h2{font-family:'Anton',sans-serif;text-transform:uppercase;font-size:clamp(2.2rem,5vw,3.6rem);margin:8px 0 30px;line-height:.96;}
.bb-p-home .safety .grid{display:grid;grid-template-columns:repeat(4,1fr);gap:18px;}
@media(max-width:900px){.bb-p-home .safety .grid{grid-template-columns:repeat(2,1fr);}}
@media(max-width:480px){.bb-p-home .safety .grid{grid-template-columns:1fr;}}
.bb-p-home .safety .card{border:1px solid var(--line);border-left:3px solid var(--yellow);padding:22px 24px;background:var(--char-raise);}
.bb-p-home .safety .card h3{font-family:'Anton',sans-serif;text-transform:uppercase;font-size:1.08rem;letter-spacing:.02em;margin-bottom:8px;}
.bb-p-home .safety .card p{color:var(--paper-dim);font-size:.92rem;line-height:1.6;}
.bb-p-home .safety .note{margin-top:26px;font-size:.82rem;color:var(--paper-dim);line-height:1.6;}
.bb-p-home .safety .note b{color:var(--paper);}
.bb-p-home .foot-cta{background:var(--char-deep);text-align:center;padding:14vh 6vw 12vh;border-top:1px solid var(--line);}
.bb-p-home .foot-cta h2{font-family:'Anton',sans-serif;text-transform:uppercase;font-size:clamp(2.4rem,7vw,5.6rem);line-height:.9;}
.bb-p-home .foot-cta h2 .yh{color:var(--yellow);}
.bb-p-home .foot-cta .b{margin-top:26px;background:var(--yellow);color:var(--ink);border:none;padding:16px 36px;font-weight:800;letter-spacing:.1em;text-transform:uppercase;font-size:.95rem;cursor:pointer;}
.bb-p-home .foot-cta .b:hover{background:var(--yellow-hot);}
.bb-p-home .g-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:10px;}
.bb-p-home .g-grid .g-tile{margin:0;position:relative;aspect-ratio:1/1;overflow:hidden;background:#101012;}
.bb-p-home .g-grid .g-tile img{width:100%;height:100%;object-fit:cover;display:block;}
@media(max-width:520px){.bb-p-home .g-grid{grid-template-columns:repeat(auto-fill,minmax(140px,1fr));}}
.bb-p-home .g-row .g-tile{flex:1 1 0;min-width:0;width:auto;max-width:min(24vw,320px);aspect-ratio:3/4;}
@media(max-width:760px){.bb-p-home .g-row .g-tile{max-width:44vw;}}
.bb-p-home .g-row .g-tile img{width:100%;height:100%;object-fit:cover;display:block;}
.bb-p-home .g-row{transform:translate(-50%,-50%);}
.bb-p-home .pk.pk-art{background-size:contain;background-position:center;background-repeat:no-repeat;}
@media (max-width: 430px){.bb-p-home #stage{overflow:hidden;}}

/* ---- production additions (Build 298) ---- */
.bb-p-home a.cta,.bb-p-home a.b{display:inline-block;text-decoration:none;}
@media (max-width:960px){.bb-p-home .stage{background-image:url('../../img/site/range-warehouse-960.jpg');} .bb-p-home .cta-strip{background-image:url('../../img/site/cta-splat-960.jpg');} .bb-p-home .g-pin{background-image:url('../../img/site/halftone-dark-960.jpg');}}
@media (prefers-reduced-motion: reduce){.bb-p-home .scrollcue{animation:none;}}
/* system 301 B10: the Homepage Spotlight zone (only when a moderator placed approved content there) */
.spotlight{padding:72px 20px}
.spotlight .cgrid{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,280px),1fr));gap:18px;margin-top:22px}
.spotlight .ccard{margin:0;border-radius:16px;overflow:hidden;background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.12)}
.spotlight .ccard img,.spotlight .ccard video{display:block;width:100%;aspect-ratio:4/3;object-fit:cover;background:#111}
.spotlight .ccard figcaption{display:flex;flex-direction:column;gap:6px;padding:14px 16px;font-size:14px}
.spotlight .ccard .by{color:#f3ea22;font-weight:700}
.spotlight .more{margin-top:22px}
