/*
Theme Name: BOLÃO88
Version: 0.5.1
Text Domain: bolao88
*/
:root{--bg:#040806;--panel:#0c120e;--panel2:#121a14;--gold:#f0c64e;--gold2:#a87913;--green:#20d477;--green2:#087f48;--text:#f8f5ea;--muted:#b7c2bb;--line:rgba(240,198,78,.22)}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:#030705;color:var(--text);font-family:Inter,Segoe UI,system-ui,sans-serif;background-image:radial-gradient(circle at 50% -10%,rgba(16,110,62,.20),transparent 36%),linear-gradient(#050a07,#020403)}
a{color:inherit;text-decoration:none}.wrap{width:min(1240px,92%);margin:auto}
.b88-header{position:sticky;top:0;z-index:40;background:rgba(3,8,5,.88);backdrop-filter:blur(16px);border-bottom:1px solid var(--line);box-shadow:0 12px 45px rgba(0,0,0,.28)}
.top{height:82px;display:flex;align-items:center;justify-content:space-between}.brand img{display:block;width:250px;max-height:62px;object-fit:cover;object-position:center;filter:drop-shadow(0 0 12px rgba(240,198,78,.22))}
nav{display:flex;align-items:center;gap:8px}nav a{padding:10px 14px;border-radius:10px;color:#d9dfdb}nav a:hover{background:rgba(32,212,119,.09);color:var(--gold)}
main{min-height:65vh}.b88-hero{position:relative;min-height:650px;border-radius:0 0 28px 28px;overflow:hidden;background:#030604}
.b88-hero:before{content:"";position:absolute;inset:0;background-image:linear-gradient(90deg,rgba(1,5,3,.97) 0%,rgba(1,5,3,.80) 31%,rgba(1,5,3,.22) 67%,rgba(1,5,3,.68) 100%),url("assets/bolao88-identidade-oficial.png");background-size:cover;background-position:center;filter:saturate(1.08)}
.b88-hero:after{content:"";position:absolute;inset:auto 0 0;height:180px;background:linear-gradient(transparent,#030705)}
.hero-inner{position:relative;z-index:2;min-height:650px;display:flex;align-items:center}.hero-copy{max-width:590px;padding:70px 0 100px}.eyebrow{font-weight:900;letter-spacing:.18em;color:var(--green);font-size:13px}.hero-copy h1{font-size:clamp(50px,7vw,92px);line-height:.9;margin:12px 0 20px;background:linear-gradient(#fff7d2,#e8b83e 58%,#8c5c08);-webkit-background-clip:text;color:transparent;text-shadow:0 10px 45px rgba(240,198,78,.12)}
.hero-copy p{font-size:20px;line-height:1.6;color:#e3e8e4;text-shadow:0 2px 10px #000}.actions{display:flex;gap:12px;flex-wrap:wrap;margin-top:26px}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;padding:13px 20px;border:1px solid rgba(255,255,255,.08);border-radius:11px;background:linear-gradient(135deg,#21bf6d,#087b46);color:#fff;font-weight:850;box-shadow:0 8px 28px rgba(20,180,100,.22);cursor:pointer}.btn:hover{transform:translateY(-1px);filter:brightness(1.08)}.btn.alt{background:rgba(4,9,6,.75);border-color:var(--gold);color:var(--gold);box-shadow:none}
.section{padding:62px 0}.section-title{text-align:center;margin-bottom:28px}.section-title .eyebrow{display:block}.section-title h2{font-size:36px;margin:7px 0;color:var(--gold)}
.feature-grid{display:grid;grid-template-columns:repeat(6,1fr);gap:14px}.feature{position:relative;text-align:center;padding:24px 14px 22px;border:1px solid var(--line);border-radius:18px;background:linear-gradient(160deg,rgba(20,31,23,.94),rgba(7,12,9,.94));overflow:hidden;min-height:205px}.feature:before{content:"";position:absolute;inset:0;background:radial-gradient(circle at 50% 0,rgba(32,212,119,.12),transparent 45%);pointer-events:none}.feature:hover{border-color:rgba(32,212,119,.55);transform:translateY(-3px);box-shadow:0 18px 45px rgba(0,0,0,.35),0 0 28px rgba(32,212,119,.08)}
.feature-icon{width:68px;height:68px;border:2px solid var(--green);border-radius:50%;margin:0 auto 16px;display:grid;place-items:center;font-size:30px;color:var(--gold);box-shadow:0 0 18px rgba(32,212,119,.18),inset 0 0 18px rgba(240,198,78,.06)}.feature h3{font-size:15px;text-transform:uppercase;letter-spacing:.04em;margin:0 0 8px;color:#fff}.feature p{font-size:13px;line-height:1.5;color:var(--muted);margin:0}
.b88-strip{margin:0 auto 50px;border:1px solid var(--line);border-radius:18px;background:linear-gradient(90deg,rgba(6,19,12,.95),rgba(18,13,5,.95),rgba(6,19,12,.95));padding:22px;text-align:center;color:var(--gold);letter-spacing:.22em;text-transform:uppercase;font-size:13px;box-shadow:0 0 40px rgba(240,198,78,.05)}
.footer{padding:28px 0 38px;border-top:1px solid var(--line);color:#849087;font-size:13px}.footer-row{display:flex;justify-content:space-between;gap:20px;flex-wrap:wrap}
.card{background:linear-gradient(145deg,#111913,#080d0a);border:1px solid rgba(240,198,78,.16);border-radius:16px;padding:22px;box-shadow:0 16px 40px rgba(0,0,0,.22)}
.auth{max-width:470px;margin:55px auto}.auth input,.auth select{width:100%;padding:14px;margin:7px 0 15px;border-radius:10px;border:1px solid #304237;background:#07100b;color:#fff}
@media(max-width:1000px){.feature-grid{grid-template-columns:repeat(3,1fr)}}@media(max-width:720px){.top{height:70px}.brand img{width:190px}nav a:first-child{display:none}.b88-hero,.hero-inner{min-height:570px}.b88-hero:before{background-position:62% center}.hero-copy{padding:55px 0 90px;max-width:92%}.hero-copy p{font-size:17px}.feature-grid{grid-template-columns:repeat(2,1fr)}}@media(max-width:460px){.feature-grid{grid-template-columns:1fr}.hero-copy h1{font-size:52px}}

/* V0.4.2 - correcoes de alinhamento e composicao */
.b88-header .top{height:88px}
.brand{display:flex;align-items:center;height:72px;overflow:hidden}
.brand img{width:270px!important;height:62px!important;max-height:none!important;object-fit:cover!important;object-position:center 58%!important;border-radius:0!important;filter:drop-shadow(0 0 10px rgba(240,198,78,.18))}
.b88-hero{min-height:590px!important;border-radius:0!important;background:
 radial-gradient(circle at 77% 43%,rgba(24,212,116,.12),transparent 27%),
 linear-gradient(90deg,#030705 0%,#061009 47%,#030705 100%)!important}
.b88-hero:before{content:""!important;position:absolute!important;inset:0!important;background:
 linear-gradient(90deg,#030705 0%,rgba(3,7,5,.98) 34%,rgba(3,7,5,.62) 52%,rgba(3,7,5,.12) 72%,rgba(3,7,5,.52) 100%),
 url("assets/bolao88-hero-88.webp")!important;background-repeat:no-repeat!important;background-size:auto 100%!important;background-position:right center!important;filter:none!important}
.b88-hero:after{height:105px!important;background:linear-gradient(transparent,#030705)!important}
.hero-inner{min-height:590px!important;align-items:center!important}
.hero-copy{max-width:590px!important;padding:60px 0 80px!important}
.hero-copy h1{font-size:clamp(54px,6vw,84px)!important;margin:12px 0 18px!important;letter-spacing:-.035em}
.hero-copy p{max-width:570px!important;font-size:18px!important}
.section{padding:48px 0 58px!important}
.section-title{margin:0 auto 30px!important}
.section-title h2{font-size:34px!important;line-height:1.15!important;margin:8px 0!important}
.feature-grid{align-items:stretch!important}
.feature{min-height:210px!important;display:flex!important;flex-direction:column!important;justify-content:flex-start!important}
.b88-strip{margin-top:2px!important}
@media(max-width:900px){
 .b88-header .top{height:76px}.brand{height:62px}.brand img{width:220px!important;height:52px!important}
 .b88-hero:before{background:
 linear-gradient(90deg,#030705 0%,rgba(3,7,5,.92) 55%,rgba(3,7,5,.48) 100%),
 url("assets/bolao88-hero-88.webp")!important;background-size:auto 82%!important;background-position:right bottom!important;background-repeat:no-repeat!important}
 .hero-copy{max-width:520px!important}
}
@media(max-width:650px){
 .b88-hero{min-height:620px!important}
 .b88-hero:before{opacity:.56;background-size:auto 66%!important;background-position:85% bottom!important}
 .hero-inner{min-height:620px!important;align-items:flex-start!important}
 .hero-copy{padding:55px 0 250px!important;max-width:100%!important}
 .hero-copy h1{font-size:54px!important}.hero-copy p{font-size:16px!important}
 .actions{gap:9px!important}.actions .btn{width:100%!important}
 .section{padding-top:40px!important}.section-title h2{font-size:28px!important}
}

/* V0.4.3 */
.b88-hero{min-height:520px!important}
.hero-inner{min-height:520px!important}
.hero-copy{max-width:620px!important;padding:70px 0 80px!important}
.hero-copy h1{font-size:clamp(34px,4vw,54px)!important;line-height:1.05!important;letter-spacing:-.02em!important;margin:12px 0 18px!important;color:#fff!important;background:none!important;-webkit-text-fill-color:initial!important;text-shadow:none!important}
.hero-copy p{font-size:18px!important;line-height:1.65!important;color:#dbe4de!important}
.b88-hero:before{background:
 linear-gradient(90deg,#030705 0%,rgba(3,7,5,.97) 43%,rgba(3,7,5,.68) 58%,rgba(3,7,5,.18) 78%,rgba(3,7,5,.44) 100%),
 url("assets/bolao88-hero-88.webp")!important;background-repeat:no-repeat!important;background-size:auto 108%!important;background-position:right center!important}
@media(max-width:650px){.hero-copy{padding:52px 0 235px!important}.hero-copy h1{font-size:38px!important}.b88-hero:before{background-size:auto 62%!important;background-position:85% bottom!important}}

body.home .b88-hero{min-height:510px!important;position:relative!important;overflow:hidden!important;background:#020503!important}
body.home .b88-hero:before{content:""!important;position:absolute!important;inset:0!important;background:linear-gradient(90deg,#020503 0%,rgba(2,5,3,.99) 43%,rgba(2,5,3,.76) 60%,rgba(2,5,3,.25) 82%,rgba(2,5,3,.5) 100%),url("assets/bolao88-hero-88.webp") right center/auto 112% no-repeat!important;opacity:.86!important;border:0!important;box-shadow:none!important}
body.home .b88-hero:after{content:""!important;position:absolute!important;left:0!important;right:0!important;bottom:0!important;height:120px!important;background:linear-gradient(transparent,#020503)!important}
body.home .hero-inner{position:relative!important;z-index:2!important;min-height:510px!important;display:flex!important;align-items:center!important}
body.home .hero-copy{max-width:610px!important;padding:55px 0 75px!important}
body.home .hero-copy h1{font-size:clamp(34px,3.6vw,52px)!important;line-height:1.08!important;color:#fff!important;background:none!important;-webkit-text-fill-color:#fff!important;margin:10px 0 18px!important}
body.home .hero-copy p{font-size:18px!important;line-height:1.65!important;color:#d5dfd8!important;max-width:600px!important}
body.home .section{background:#020503!important;position:relative!important;z-index:3!important}
@media(max-width:760px){body.home .b88-hero{min-height:610px!important}body.home .b88-hero:before{background:linear-gradient(180deg,#020503 0%,rgba(2,5,3,.98) 48%,rgba(2,5,3,.45) 73%,#020503 100%),url("assets/bolao88-hero-88.webp") 72% bottom/auto 58% no-repeat!important}body.home .hero-inner{min-height:610px!important;align-items:flex-start!important}body.home .hero-copy{padding:45px 0 260px!important}.hero-copy h1{font-size:36px!important}}

/* ==========================================================
   BOLAO88 V0.4.5 - HERO: ARTE COMPLETA, SEM RECORTE
   ========================================================== */
body.home .b88-hero{
  position:relative!important;
  min-height:0!important;
  overflow:hidden!important;
  background:#020503!important;
  border:0!important;
}
body.home .b88-hero:before,
body.home .b88-hero:after{
  content:none!important;
  display:none!important;
}
body.home .hero-inner{
  position:relative!important;
  z-index:1!important;
  min-height:clamp(480px,45vw,650px)!important;
  display:flex!important;
  align-items:center!important;
  overflow:hidden!important;
}
body.home .hero-inner:before{
  content:""!important;
  position:absolute!important;
  inset:0!important;
  z-index:-2!important;
  background-image:url("assets/bolao88-hero-88.webp")!important;
  background-repeat:no-repeat!important;
  background-position:right center!important;
  background-size:contain!important;
}
body.home .hero-inner:after{
  content:""!important;
  position:absolute!important;
  inset:0!important;
  z-index:-1!important;
  background:linear-gradient(90deg,
    #020503 0%,
    rgba(2,5,3,.99) 31%,
    rgba(2,5,3,.91) 42%,
    rgba(2,5,3,.58) 53%,
    rgba(2,5,3,.10) 68%,
    rgba(2,5,3,0) 100%)!important;
  pointer-events:none!important;
}
body.home .hero-copy{
  position:relative!important;
  z-index:2!important;
  width:min(610px,48%)!important;
  max-width:610px!important;
  padding:64px 0!important;
}
body.home .hero-copy h1{
  font-size:clamp(34px,3.6vw,52px)!important;
  line-height:1.08!important;
  margin:10px 0 18px!important;
}
body.home .hero-copy p{
  max-width:590px!important;
  font-size:18px!important;
  line-height:1.65!important;
}
@media (min-width:1400px){
 body.home .hero-inner{min-height:650px!important}
}
@media (max-width:900px){
 body.home .hero-inner{
   min-height:auto!important;
   display:block!important;
   padding-top:0!important;
 }
 body.home .hero-inner:before{
   position:relative!important;
   display:block!important;
   inset:auto!important;
   width:100%!important;
   height:auto!important;
   aspect-ratio:16/9!important;
   background-position:center!important;
   background-size:contain!important;
 }
 body.home .hero-inner:after{
   background:linear-gradient(180deg,#020503 0%,rgba(2,5,3,.08) 28%,rgba(2,5,3,.08) 62%,#020503 100%)!important;
   height:min(56vw,500px)!important;
 }
 body.home .hero-copy{
   width:100%!important;
   max-width:680px!important;
   padding:34px 0 52px!important;
 }
}
@media (max-width:560px){
 body.home .hero-inner:before{aspect-ratio:16/10!important}
 body.home .hero-copy h1{font-size:34px!important}
 body.home .hero-copy p{font-size:16px!important}
}

/* BOLAO88 V0.4.6 - logo integral no cabecalho */
.b88-header .brand{
  display:flex!important;
  align-items:center!important;
  justify-content:flex-start!important;
  height:76px!important;
  width:auto!important;
  overflow:visible!important;
  flex:0 0 auto!important;
}
.b88-header .brand img{
  display:block!important;
  width:auto!important;
  height:64px!important;
  max-width:min(420px,42vw)!important;
  max-height:64px!important;
  object-fit:contain!important;
  object-position:left center!important;
  border-radius:0!important;
}
@media(max-width:720px){
 .b88-header .brand{height:64px!important}
 .b88-header .brand img{height:52px!important;max-height:52px!important;max-width:68vw!important}
}


/* ==========================================================
   BOLAO88 V0.4.7 - HERO FINAL: ARTE OFICIAL INTEGRAL
   A arte aprovada e exibida como IMG real, sem crop/cover.
   ========================================================== */
body.home .b88-hero{
  min-height:0!important;
  overflow:visible!important;
  background:#020503!important;
}
body.home .b88-hero:before,
body.home .b88-hero:after,
body.home .hero-inner:before,
body.home .hero-inner:after{
  content:none!important;
  display:none!important;
  background:none!important;
}
body.home .hero-inner{
  width:min(1440px,95%)!important;
  min-height:620px!important;
  display:grid!important;
  grid-template-columns:minmax(420px,44%) minmax(0,56%)!important;
  align-items:center!important;
  gap:32px!important;
  overflow:visible!important;
}
body.home .hero-copy{
  width:100%!important;
  max-width:620px!important;
  padding:54px 0!important;
  position:relative!important;
  z-index:2!important;
}
body.home .hero-art{
  width:100%!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  min-width:0!important;
  padding:24px 0!important;
}
body.home .hero-art img{
  display:block!important;
  width:100%!important;
  height:auto!important;
  max-width:820px!important;
  max-height:none!important;
  object-fit:contain!important;
  object-position:center!important;
  border:0!important;
  margin:0!important;
  padding:0!important;
  filter:none!important;
}
@media(max-width:980px){
 body.home .hero-inner{
   width:min(920px,92%)!important;
   min-height:0!important;
   grid-template-columns:1fr!important;
   gap:0!important;
 }
 body.home .hero-copy{max-width:760px!important;padding:46px 0 22px!important}
 body.home .hero-art{padding:0 0 38px!important}
 body.home .hero-art img{max-width:900px!important;width:100%!important}
}
@media(max-width:560px){
 body.home .hero-copy{padding:34px 0 20px!important}
 body.home .hero-copy h1{font-size:34px!important}
 body.home .hero-copy p{font-size:16px!important}
 body.home .hero-art{padding-bottom:28px!important}
}


/* ==========================================================
   BOLAO88 V0.4.8 - HOME OFICIAL APROVADA
   A arte aprovada e exibida integralmente, sem crop.
   ========================================================== */
body.home .b88-header{display:none!important}
body.home main{min-height:0!important}
body.home .b88-home-official{position:relative;width:100%;background:#020403;line-height:0;overflow:hidden}
body.home .b88-home-official picture,body.home .b88-home-official img{display:block;width:100%;height:auto;max-width:none!important}
body.home .b88-home-hit{position:absolute;z-index:5;display:block;border-radius:12px;outline-offset:4px}
body.home .b88-home-hit:focus-visible{outline:3px solid #20d477;background:rgba(32,212,119,.10)}
body.home .b88-hit-login{left:84.6%;top:1.7%;width:11.6%;height:6.6%}
body.home .b88-hit-access{left:4.7%;top:54.1%;width:14.6%;height:6.5%}
body.home .b88-hit-resources{left:20.6%;top:54.1%;width:13.8%;height:6.5%}
body.home .b88-hit-inicio{left:48.7%;top:2.2%;width:5.1%;height:5.5%}
body.home .b88-hit-recursos{left:58.6%;top:2.2%;width:6.1%;height:5.5%}
body.home .b88-hit-contato{left:77.2%;top:2.2%;width:5.5%;height:5.5%}
body.home footer{margin-top:0!important}
@media(max-width:760px){body.home .b88-home-official{overflow-x:auto}body.home .b88-home-official .b88-home-art{width:1100px!important;max-width:none!important}body.home .b88-home-official{scrollbar-width:thin}}


/* ==========================================================
   BOLAO88 V0.4.9 - HOME REAL HTML/CSS (SEM SCREENSHOT CLICAVEL)
   ========================================================== */
body.home .b88-header{display:block!important}
body.home main{min-height:0!important}
body.home .b88-home-official{display:none!important}
body.home .b88-header{position:relative!important;background:#020604!important}
body.home .b88-header .top{height:92px!important}
body.home .b88-header .brand img{height:72px!important;max-height:72px!important;width:auto!important;object-fit:contain!important}
body.home .b88-header nav{gap:14px!important}
body.home .b88-header nav a{font-weight:700!important}
.b88-live-hero{position:relative;overflow:hidden;background:radial-gradient(circle at 76% 35%,rgba(0,232,126,.13),transparent 26%),linear-gradient(180deg,#030705,#020403);border-bottom:1px solid rgba(240,198,78,.18)}
.b88-live-hero-grid{min-height:590px;display:grid;grid-template-columns:minmax(420px,43%) minmax(0,57%);align-items:center;gap:10px;position:relative}
.b88-live-copy{position:relative;z-index:3;padding:64px 0 74px}
.b88-live-copy:after{content:"";position:absolute;z-index:-1;left:-15vw;right:-110px;top:-80px;bottom:-80px;background:linear-gradient(90deg,#020503 0%,rgba(2,5,3,.99) 67%,rgba(2,5,3,.78) 82%,transparent 100%);pointer-events:none}
.b88-live-copy h1{font-size:clamp(46px,5vw,72px);line-height:.98;letter-spacing:-.035em;margin:14px 0 24px;color:#fff;font-weight:900}
.b88-live-copy h1 strong{font-weight:900;color:var(--gold);text-shadow:0 0 24px rgba(240,198,78,.14)}
.b88-live-copy p{font-size:18px;line-height:1.65;color:#e2e8e4;max-width:620px;margin:0}
.b88-live-copy .btn{min-width:210px;font-size:16px}.b88-live-copy .btn span{font-size:24px;line-height:0;margin-left:5px}
.b88-live-scene{position:absolute;right:-4vw;top:0;bottom:0;width:68%;background-image:linear-gradient(90deg,#020503 0%,rgba(2,5,3,.72) 9%,rgba(2,5,3,.05) 29%,rgba(2,5,3,0) 100%),url("assets/bolao88-hero-scene-v049.webp");background-repeat:no-repeat;background-size:cover;background-position:center;filter:saturate(1.05) contrast(1.02);z-index:1}
.b88-live-scene:after{content:"";position:absolute;inset:auto 0 0;height:100px;background:linear-gradient(transparent,#020403)}
.b88-dots{height:24px;display:flex;justify-content:center;align-items:center;gap:9px;background:#020403}.b88-dots i{display:block;width:36px;height:5px;border-radius:20px;background:#2e3c34}.b88-dots i:first-child{background:var(--gold)}
.b88-live-features{padding-top:26px!important;background:#020403!important}
.b88-live-features .feature-grid{grid-template-columns:repeat(6,1fr);gap:14px}
.b88-live-features .feature{min-height:225px!important;border-color:rgba(240,198,78,.42);transition:.2s ease}.b88-live-features .feature:hover{transform:translateY(-5px);border-color:var(--green);box-shadow:0 18px 46px rgba(0,0,0,.45),0 0 25px rgba(32,212,119,.08)}
.b88-live-features .feature-icon{font-weight:900}
.b88-live-features .b88-strip{margin-top:36px;margin-bottom:0;background:transparent;border-width:1px 0 0;border-radius:0;font-size:16px}
@media(max-width:1050px){.b88-live-hero-grid{grid-template-columns:1fr;min-height:760px}.b88-live-copy{max-width:650px;padding:54px 0 360px}.b88-live-copy:after{right:-8vw;bottom:270px}.b88-live-scene{width:100%;height:430px;top:auto;right:0;bottom:0;background-size:cover;background-position:center}.b88-live-features .feature-grid{grid-template-columns:repeat(3,1fr)}}
@media(max-width:720px){body.home .b88-header .top{height:auto!important;min-height:76px;gap:10px}body.home .b88-header .brand img{height:54px!important;max-height:54px!important}.b88-live-hero-grid{min-height:720px}.b88-live-copy{padding:42px 0 340px}.b88-live-copy h1{font-size:44px}.b88-live-copy p{font-size:16px}.b88-live-copy .actions{display:grid;grid-template-columns:1fr}.b88-live-copy .btn{width:100%}.b88-live-scene{height:330px}.b88-live-features .feature-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:480px){.b88-live-copy h1{font-size:38px}.b88-live-features .feature-grid{grid-template-columns:1fr}.b88-live-scene{height:300px}.b88-live-hero-grid{min-height:700px}.b88-live-copy{padding-bottom:320px}}

/* ==========================================================
   BOLAO88 V0.5.0 - HERO DINAMICO, SEM IMAGEM FIXA DE PAGINA
   A arte aprovada e somente o fundo; todo conteudo segue HTML/CSS.
   ========================================================== */
body.home .b88-live-hero{min-height:620px;isolation:isolate;background:#020503}
body.home .b88-live-hero-grid{min-height:620px;grid-template-columns:minmax(420px,46%) minmax(0,54%);overflow:visible}
body.home .b88-live-copy{z-index:4;padding:68px 0 82px}
body.home .b88-live-copy:after{right:-180px;background:linear-gradient(90deg,#020503 0%,rgba(2,5,3,.985) 60%,rgba(2,5,3,.82) 76%,rgba(2,5,3,.32) 92%,transparent 100%)}
body.home .b88-live-scene{
  right:-1.5vw;top:20px;bottom:20px;width:72%;
  background-image:linear-gradient(90deg,rgba(2,5,3,.90) 0%,rgba(2,5,3,.50) 12%,rgba(2,5,3,.10) 27%,rgba(2,5,3,0) 44%),url("assets/bolao88-hero-scene-v049.webp");
  background-repeat:no-repeat;
  background-size:100% 100%,contain;
  background-position:center,right center;
  filter:saturate(1.06) contrast(1.02);
  transform-origin:70% 50%;
  animation:b88HeroFloat 16s ease-in-out infinite alternate;
  will-change:transform,background-position;
}
body.home .b88-live-scene:before{content:"";position:absolute;inset:0;background:linear-gradient(180deg,#020503 0%,transparent 8%,transparent 88%,#020503 100%);pointer-events:none}
body.home .b88-live-scene:after{height:70px;background:linear-gradient(transparent,#020403)}
body.home .b88-dots i{transition:width .3s ease,opacity .3s ease}.b88-dots i:nth-child(2){opacity:.65}.b88-dots i:nth-child(3){opacity:.4}
@keyframes b88HeroFloat{
  0%{transform:translate3d(0,0,0) scale(1);background-position:center,right center}
  50%{transform:translate3d(-10px,-2px,0) scale(1.012);background-position:center,98% center}
  100%{transform:translate3d(5px,2px,0) scale(1.004);background-position:center,100% center}
}
@media (prefers-reduced-motion:reduce){body.home .b88-live-scene{animation:none!important;transform:none!important}}
@media(max-width:1050px){
 body.home .b88-live-hero-grid{min-height:800px;grid-template-columns:1fr}
 body.home .b88-live-copy{padding:52px 0 390px;max-width:680px}
 body.home .b88-live-copy:after{right:-8vw;bottom:300px}
 body.home .b88-live-scene{right:0;top:auto;bottom:10px;width:100%;height:430px;background-size:100% 100%,contain;background-position:center,center bottom}
}
@media(max-width:720px){
 body.home .b88-live-hero-grid{min-height:760px}
 body.home .b88-live-copy{padding:40px 0 360px}
 body.home .b88-live-scene{height:340px;background-size:100% 100%,contain;background-position:center,center bottom;animation-duration:20s}
}
@media(max-width:480px){body.home .b88-live-hero-grid{min-height:720px}body.home .b88-live-copy{padding-bottom:330px}body.home .b88-live-scene{height:305px}}
