:root{
  --fondo:#070707; --fondo2:#121212; --panel:#1C1C1C; --linea:#272727;
  --acento:#E3202B; --acento-osc:#B0141D; --gris:#A3A3A3; --texto:#E8E8E8; --blanco:#FFFFFF;
  --tinta:#FFFFFF;
  --rojo-cp:#C0180C;
  --r:18px; --ancho:1160px;
}
*{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:80px}
body{font-family:Inter,system-ui,sans-serif;background:var(--fondo);color:var(--texto);-webkit-font-smoothing:antialiased;line-height:1.5;overflow-x:hidden}
body::before{content:"";position:fixed;inset:0;z-index:-1;pointer-events:none;
  background:repeating-linear-gradient(135deg,transparent 0 22px,rgba(255,255,255,.016) 22px 24px)}
a{color:inherit;text-decoration:none}
img{display:block;max-width:100%}
.v{color:var(--acento)}
.cont{width:min(var(--ancho),100% - 32px);margin-inline:auto}

/* Barra */
.barra{position:sticky;top:0;z-index:20;background:rgba(7,7,7,.88);backdrop-filter:blur(12px);border-bottom:1px solid var(--linea)}
.barra .cont{display:flex;align-items:center;gap:28px;height:64px}
.marca{font-weight:900;font-size:22px;letter-spacing:-.5px;white-space:nowrap;color:var(--blanco)}
.menu{display:flex;gap:22px;margin-left:auto;font-weight:600;font-size:15px;color:var(--gris)}
.menu a:hover{color:var(--blanco)}
@media (max-width:760px){.menu{display:none}.barra .btn{margin-left:auto}}

/* Botones */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;border-radius:12px;padding:13px 22px;font-weight:800;font-size:16px;white-space:nowrap;transition:transform .15s,background .15s}
.btn:hover{transform:translateY(-1px)}
.btn svg{width:20px;height:20px;flex:none}
.btn-v{background:var(--acento);color:var(--tinta)}
.btn-v:hover{background:#F2333D}
.btn-o{border:2px solid var(--linea);color:var(--blanco)}
.btn-o:hover{border-color:var(--gris)}
.btn-ch{padding:9px 16px;font-size:14px;border-radius:10px}
.btn-rojo{background:var(--rojo-cp);color:#fff}
.btn-rojo:hover{background:#D9241A}

/* Secciones */
section{padding:88px 0}
.etq{font-weight:800;font-size:13px;letter-spacing:3px;color:var(--gris);text-transform:uppercase;margin-bottom:12px}
h1,h2,h3{color:var(--blanco);font-weight:900;letter-spacing:-1.5px;line-height:1.02}
h2{font-size:clamp(34px,5vw,54px);margin-bottom:14px}
h3{font-size:22px;letter-spacing:-.5px}
.intro{font-size:18px;color:var(--gris);max-width:620px}
.cab{display:flex;align-items:flex-end;justify-content:space-between;gap:20px;flex-wrap:wrap;margin-bottom:36px}

/* Portada */
.hero{padding:64px 0 72px}
.hero .cont{display:grid;grid-template-columns:1.15fr .85fr;gap:40px;align-items:center}
.hero h1{font-size:clamp(46px,7.4vw,92px);letter-spacing:-3px;line-height:.95;margin:6px 0 22px}
.hero p{font-size:19px;max-width:540px;color:var(--texto)}
.hero .acciones{display:flex;gap:12px;flex-wrap:wrap;margin-top:30px}
.foto{position:relative;aspect-ratio:1;max-width:460px;width:100%;margin-left:auto}
.foto .aro{position:absolute;inset:9% 6% 0 6%;border:4px solid var(--acento);border-radius:50%}
.foto .disco{position:absolute;inset:9% 6% 0 6%;border-radius:50%;background:radial-gradient(circle at 50% 40%,#3E0A0E,#0B0B0B 72%);box-shadow:0 0 80px rgba(227,32,43,.32)}
.foto img{position:relative;width:100%;height:100%;object-fit:contain;
  -webkit-mask-image:linear-gradient(#000 82%,transparent);mask-image:linear-gradient(#000 82%,transparent)}
.cifras{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:var(--linea);border:1px solid var(--linea);border-radius:var(--r);overflow:hidden;margin-top:44px}
.cifras div{background:var(--fondo2);padding:20px 22px}
.cifras b{display:block;font-size:30px;font-weight:900;color:var(--blanco);letter-spacing:-1px;line-height:1.1}
.cifras span{font-size:14px;color:var(--gris);font-weight:600}
@media (max-width:860px){
  .hero .cont{grid-template-columns:1fr}
  .foto{order:-1;max-width:300px;margin:0 auto}
  .hero{padding-top:24px}
}
@media (max-width:520px){.cifras{grid-template-columns:1fr}.cifras b{font-size:26px}}

/* Video destacado */
.destacado{display:grid;grid-template-columns:1.6fr 1fr;gap:32px;align-items:center;background:var(--fondo2);border:1px solid var(--linea);border-radius:24px;padding:18px}
.destacado .txt{padding:10px 14px 10px 0}
.destacado h3{font-size:clamp(24px,3vw,34px);letter-spacing:-1px;margin:6px 0 14px}
@media (max-width:860px){.destacado{grid-template-columns:1fr}.destacado .txt{padding:4px 6px 10px}}
.reproductor{position:relative;aspect-ratio:16/9;border-radius:14px;overflow:hidden;background:#000;cursor:pointer}
.reproductor img{width:100%;height:100%;object-fit:cover}
.reproductor iframe{position:absolute;inset:0;width:100%;height:100%;border:0}
.play{position:absolute;left:50%;top:50%;translate:-50% -50%;width:76px;height:76px;border-radius:50%;background:var(--acento);display:grid;place-items:center;box-shadow:0 8px 30px rgba(0,0,0,.45);transition:scale .15s}
.reproductor:hover .play{scale:1.08}
.play{background:var(--acento)}
.play svg{width:30px;height:30px;margin-left:5px}

/* Rejilla de videos */
.videos{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}
@media (max-width:900px){.videos{grid-template-columns:repeat(2,1fr)}}
@media (max-width:560px){.videos{grid-template-columns:1fr}}
.video{display:block;border-radius:16px;overflow:hidden;background:var(--fondo2);border:1px solid var(--linea);transition:border-color .15s,transform .15s}
.video:hover{border-color:var(--acento);transform:translateY(-3px)}
.video .min{position:relative;aspect-ratio:16/9;background:#111}
.video .min img{width:100%;height:100%;object-fit:cover}
.video .dur{position:absolute;right:8px;bottom:8px;background:rgba(0,0,0,.82);color:#fff;font-weight:700;font-size:12px;padding:2px 7px;border-radius:6px}
.video .info{padding:14px 16px 16px}
.video h4{color:var(--blanco);font-size:16px;font-weight:800;line-height:1.3;letter-spacing:-.2px;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.video small{display:block;margin-top:6px;color:var(--gris);font-weight:600;font-size:13px}

/* Tarjetas de redes */
.redes{display:grid;grid-template-columns:repeat(4,1fr);gap:18px}
@media (max-width:960px){.redes{grid-template-columns:repeat(2,1fr)}}
@media (max-width:520px){.redes{grid-template-columns:1fr}}
.red{display:flex;flex-direction:column;gap:10px;background:var(--fondo2);border:1px solid var(--linea);border-radius:var(--r);padding:24px;transition:border-color .15s}
.red:hover{border-color:var(--acento)}
.red .ico{width:46px;height:46px;border-radius:12px;display:grid;place-items:center;background:var(--panel)}
.red .ico svg{width:24px;height:24px}
.red h3{margin-top:6px}
.red p{color:var(--gris);font-size:15px;flex:1}
.red .usr{font-weight:800;color:var(--acento);font-size:15px}

/* Comunidad */
.comunidad{display:grid;grid-template-columns:1.2fr .8fr;gap:40px;align-items:center;background:radial-gradient(ellipse at 80% 50%,#3A0A0E,#101010 68%);border:1px solid #3A1417;border-radius:28px;padding:56px}
.comunidad h2{font-size:clamp(32px,4.4vw,48px)}
.comunidad ul{list-style:none;display:grid;gap:12px;margin-top:22px}
.comunidad li{display:flex;gap:12px;align-items:flex-start;font-size:17px}
.comunidad li::before{content:"";flex:none;width:10px;height:10px;border-radius:50%;background:var(--acento);margin-top:8px}
.comunidad .lado{display:flex;flex-direction:column;align-items:flex-start;gap:14px}
@media (max-width:860px){.comunidad{grid-template-columns:1fr;padding:34px 24px}}

/* Sobre mí */
.sobre > div{max-width:760px}
.sobre p{font-size:18px;margin-bottom:16px}
.logros{list-style:none;border-top:1px solid var(--linea)}
.logros li{display:flex;justify-content:space-between;gap:18px;padding:16px 0;border-bottom:1px solid var(--linea)}
.logros b{color:var(--blanco);font-weight:800}
.logros span{color:var(--gris);font-size:14px;font-weight:600;text-align:right;white-space:nowrap}
@media (max-width:860px){.sobre{grid-template-columns:1fr}}

/* Pie */
footer{border-top:1px solid var(--linea);padding:48px 0 40px;margin-top:40px;font-size:14px;color:var(--gris)}
footer .cont{display:grid;grid-template-columns:1.4fr 1fr 1fr;gap:32px}
footer h5{color:var(--blanco);font-size:14px;font-weight:800;margin-bottom:12px}
footer nav{display:grid;gap:8px}
footer a:hover{color:var(--blanco)}
footer .legal{grid-column:1/-1;border-top:1px solid var(--linea);padding-top:22px;display:flex;justify-content:space-between;gap:16px;flex-wrap:wrap}
@media (max-width:760px){footer .cont{grid-template-columns:1fr}}

/* Página /juega */
.socio{border-radius:28px;padding:48px;border:1px solid var(--linea);position:relative;overflow:hidden}
.socio + .socio{margin-top:28px}
.socio .fila{display:grid;grid-template-columns:1.1fr .9fr;gap:40px;align-items:start}
@media (max-width:900px){.socio{padding:30px 22px}.socio .fila{grid-template-columns:1fr}}
.socio-cp{background:linear-gradient(135deg,#3A0905,#1A0D0C 55%,#151515)}
.socio-cp{border-color:#5A1A14}
.socio-bc{--acento:#00FF80;background:linear-gradient(135deg,#123824,#1B2320 55%,#1A1D1C);border-color:#1F5A3A}
.socio-bc .btn-v{color:#0E1110}.socio-bc .btn-v:hover{background:#3DFF9C}
.socio .logo-cp{height:38px;width:auto}
.wm{font-weight:900;font-size:46px;letter-spacing:-1.5px;color:#fff;line-height:1}
.socio h2{font-size:clamp(30px,4vw,44px);margin:22px 0 12px}
.socio p.d{color:var(--texto);font-size:17px;max-width:520px}
.codigo{display:flex;align-items:center;justify-content:space-between;gap:14px;background:rgba(0,0,0,.35);border:2px dashed rgba(255,255,255,.22);border-radius:16px;padding:16px 16px 16px 22px;margin:26px 0 18px}
.codigo small{display:block;font-size:12px;font-weight:800;letter-spacing:2.5px;color:var(--gris)}
.codigo b{font-size:30px;font-weight:900;letter-spacing:1px;color:#fff}
.copiar{background:#fff;color:#111;border:0;border-radius:10px;padding:10px 16px;font:800 14px Inter,sans-serif;cursor:pointer}
.copiar.ok{background:var(--acento)}
.pasos{list-style:none;display:grid;gap:14px;counter-reset:p}
.pasos li{counter-increment:p;display:grid;grid-template-columns:44px 1fr;gap:14px;align-items:start;background:rgba(0,0,0,.28);border:1px solid rgba(255,255,255,.08);border-radius:14px;padding:16px}
.pasos li::before{content:counter(p,decimal-leading-zero);font-weight:900;font-size:20px;color:var(--acento)}
.pasos b{display:block;color:#fff;font-weight:800}
.pasos span{color:var(--gris);font-size:15px}
.promo-cab{display:flex;justify-content:space-between;align-items:baseline;gap:12px;margin-bottom:14px;flex-wrap:wrap}
.promo-cab h3{font-size:26px}
.promo-cab small{font-weight:800;color:var(--acento);font-size:14px}
.aviso{margin-top:20px;font-size:13px;color:var(--gris)}
.legales{margin-top:40px;background:var(--fondo2);border:1px solid var(--linea);border-radius:var(--r);padding:26px 28px;font-size:14px;color:var(--gris);display:grid;gap:8px}
.legales b{color:var(--blanco)}
.socio-cp .pasos li::before{color:#FF6B5E}
.destacado h3{letter-spacing:-.6px;line-height:1.12}

/* Patrocinadores en la barra */
.patro{display:flex;gap:8px}
.pat{display:inline-flex;align-items:center;gap:8px;border-radius:10px;padding:8px 14px;font-weight:800;font-size:14px;white-space:nowrap;border:1.5px solid;transition:background .15s}
.pat img{width:18px;height:18px}
.pat-cp{border-color:#C0180C;color:#fff;background:rgba(192,24,12,.18)}
.pat-cp:hover,.pat-cp.on{background:#C0180C}
.pat-bc{border-color:#00FF80;color:#fff;background:rgba(0,255,128,.08)}
.pat-bc:hover,.pat-bc.on{background:#00FF80;color:#0E1110}
.pat-bc .pt{width:8px;height:8px;border-radius:50%;background:#00FF80}
.pat-bc:hover .pt,.pat-bc.on .pt{background:#0E1110}
.barra .menu{margin-left:auto}
@media (max-width:1020px){.barra .sub-btn{display:none}}
@media (max-width:760px){
  .barra .cont{flex-wrap:wrap;height:auto;padding:12px 0;gap:10px}
  .patro{width:100%}
  .pat{flex:1;justify-content:center}
}

/* Página oficial metida dentro */
.dentro{display:block;width:100%;border:0;height:calc(100vh - 65px);height:calc(100dvh - 65px)}
@media (max-width:760px){.dentro{height:calc(100dvh - 112px)}}
.embebida{overflow:hidden}

/* La barra toma los colores de la página que va dentro */
.tema-bc{--fondo:#242726;--linea:#3A3F3D;--acento:#24EE89;--gris:#A7ADAA;--blanco:#fff}
.tema-bc .barra{background:#292D2E;backdrop-filter:none}
.tema-bc .btn-v{color:#0E1110}.tema-bc .btn-v:hover{background:#4DF5A2}
.tema-bc .pat-cp{background:transparent;border-color:#4A4F4D}
.tema-bc .pat-bc.on{background:#24EE89;border-color:#24EE89}
.tema-cp{--fondo:#020202;--linea:#1E2226;--acento:#FF2335;--gris:#9AA0A6;--blanco:#fff}
.tema-cp .barra{background:#020202;backdrop-filter:none}
.tema-cp .btn-v{color:#fff}.tema-cp .btn-v:hover{background:#FF4655}
.tema-cp .pat-cp.on{background:#FF2335;border-color:#FF2335}
.tema-cp .pat-bc{background:transparent;border-color:#2A2F33}
.tema-cp .pat-bc .pt{background:#00FF80}

/* Contador de seguidores */
.conteo{display:grid;grid-template-columns:1fr 1fr;gap:18px}
.cuenta{display:flex;align-items:center;gap:20px;background:var(--fondo2);border:1px solid var(--linea);border-radius:var(--r);padding:24px 28px;transition:border-color .15s}
.cuenta:hover{border-color:var(--acento)}
.cuenta .ico{width:58px;height:58px;border-radius:14px;background:var(--panel);display:grid;place-items:center;flex:none}
.cuenta .ico svg{width:30px;height:30px}
.cuenta b{display:block;font-size:clamp(34px,4.4vw,52px);font-weight:900;color:var(--blanco);letter-spacing:-1.5px;line-height:1;font-variant-numeric:tabular-nums}
.cuenta span{color:var(--gris);font-weight:600;font-size:15px}
@media (max-width:700px){.conteo{grid-template-columns:1fr}.cuenta{padding:20px}}

/* Promo de BC.GAME arriba de la portada */
.promo-bc{padding:28px 0 8px}
.pbc{--g:#E3202B;display:grid;grid-template-columns:1.4fr .9fr;gap:36px;align-items:center;background:radial-gradient(ellipse at 85% 30%,rgba(227,32,43,.18),transparent 60%),#121212;border:1.5px solid rgba(227,32,43,.5);border-radius:24px;padding:36px 40px;box-shadow:0 20px 60px rgba(0,0,0,.45)}
.pbc-top{display:flex;align-items:center;gap:14px;font-weight:800;font-size:13px;letter-spacing:3px;text-transform:uppercase;color:#A7ADAA}
.pbc-top img{height:30px;width:auto}
.pbc-h{font-size:clamp(34px,5vw,58px)!important;font-weight:900;letter-spacing:-2px;color:#fff;text-transform:uppercase;line-height:.98;margin:16px 0 14px!important}
.pbc-h span{color:var(--g)}
.pbc p{color:#D9DCDA;font-size:17px;max-width:560px}
.pbc-acc{display:flex;gap:12px;flex-wrap:wrap;margin-top:24px}
.pbc-btn{display:inline-flex;align-items:center;background:var(--g);color:#fff;font-weight:900;font-size:19px;letter-spacing:.5px;border-radius:12px;padding:15px 28px;box-shadow:0 6px 26px rgba(227,32,43,.3);transition:transform .15s,background .15s}
.pbc-btn:hover{background:#F2333D;transform:translateY(-1px)}
.pbc-sec{display:inline-flex;align-items:center;border:1.5px solid #262626;color:#fff;font-weight:800;border-radius:12px;padding:15px 22px}
.pbc-sec:hover{border-color:var(--g)}
.pbc-cod{display:inline-flex;align-items:center;gap:10px;margin-top:16px;border:1.5px dashed rgba(227,32,43,.6);border-radius:10px;padding:7px 12px;font-weight:700;font-size:14px;color:#A7ADAA}
.pbc-cod b{color:var(--g);font-weight:900}
.pbc-cod button{background:none;border:0;color:#fff;font:800 14px Inter,sans-serif;cursor:pointer}
.pbc-reloj{text-align:center}
.pbc-reloj small{display:block;font-size:12px;font-weight:800;letter-spacing:3px;color:#A7ADAA}
.pbc-reloj .fin{letter-spacing:0;font-weight:600;margin-top:12px}
#mini-reloj{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;margin-top:14px}
#mini-reloj div{background:#1A1A1A;border:1px solid #262626;border-radius:12px;padding:14px 0 10px}
#mini-reloj b{display:block;font-size:34px;font-weight:900;color:#fff;line-height:1;font-variant-numeric:tabular-nums}
#mini-reloj span{font-size:11px;font-weight:700;color:#A7ADAA}
.pbc-legal{font-size:12px;color:#7C8380;margin-top:10px;text-align:center}
@media (max-width:860px){.pbc{grid-template-columns:1fr;padding:26px 20px;gap:24px}.pbc-acc{flex-direction:column}.pbc-btn,.pbc-sec{justify-content:center;white-space:nowrap}}

.pat-bc.on-r{background:var(--acento);border-color:var(--acento)}.pat-bc.on-r .pt{background:#fff}