/* Estilos compartidos de subpáginas — Zelcar Games (mismo lenguaje visual del home) */
:root{
  --navy:#023f9e; --navy-deep:#0c1c3c; --blue:#085ee8; --blue-btn:#0161db;
  --green:#2e8b27; --purple:#5b2bd0; --white:#ffffff;
}
*{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth}
body{font-family:'Nunito',system-ui,sans-serif;background:var(--navy-deep);color:#fff;overflow-x:hidden}
img{display:block}
a{text-decoration:none;color:inherit}
button{font-family:inherit;cursor:pointer;border:none;background:none}
h1,h2,h3{font-family:'Fredoka','Nunito',sans-serif;font-weight:600}

/* ---- NAV (idéntico al home) ---- */
.nav{position:absolute;top:1.4vw;left:6.4vw;right:6.4vw;height:3.4vw;z-index:50;
  background:linear-gradient(180deg,#0a4cb4 0%,#023f9e 100%);
  border:1px solid rgba(140,190,255,.55);border-radius:2vw;
  display:flex;align-items:center;padding:0 1.1vw;
  box-shadow:0 .4vw 1.6vw rgba(0,10,50,.45)}
.nav-logo{margin-left:1vw;line-height:0}
.nav-logo img{height:2.15vw;width:auto;display:block;filter:drop-shadow(0 .12vw .3vw rgba(0,0,60,.35))}
.nav-links{display:flex;align-items:center;gap:.15vw;position:absolute;left:50%;transform:translateX(-50%)}
.nav-links a{font-size:.92vw;font-weight:800;letter-spacing:.03em;color:#dbe9ff;padding:.62vw 1.05vw;border-radius:999px;transition:transform .18s,background .18s}
.nav-links a:hover{transform:scale(1.06);background:rgba(255,255,255,.12)}
.nav-links a.activo{background:linear-gradient(180deg,#2f83ff,#085ee8);border:1px solid rgba(170,210,255,.8);box-shadow:0 .15vw .6vw rgba(0,20,80,.5);color:#fff}
.nav-cta{background:#fff;color:#0a3fa0;font-weight:900;font-size:.92vw;letter-spacing:.03em;padding:.66vw 1.5vw;border-radius:999px;display:flex;align-items:center;gap:.5vw;transition:transform .18s;box-shadow:0 .15vw .8vw rgba(0,20,80,.4)}
.nav-cta:hover{transform:scale(1.06)}
.nav-cta svg{width:.85vw;height:.85vw}

/* ---- HERO DE SUBPÁGINA ---- */
.sub-hero{position:relative;width:100%;height:22vw;overflow:hidden}
.sub-hero img.bg{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center 35%}
.sub-hero .velo{position:absolute;inset:0;background:linear-gradient(180deg,rgba(4,16,60,.4) 0%,rgba(4,16,60,.12) 38%,rgba(6,16,55,.78) 100%)}
.sub-hero h1{position:absolute;left:0;right:0;bottom:3.2vw;text-align:center;font-size:3vw;letter-spacing:.08em;text-shadow:0 .2vw 1.2vw rgba(0,10,45,.95),0 0 2.4vw rgba(0,15,60,.8)}
.sub-hero .mig{position:absolute;left:0;right:0;bottom:1.6vw;text-align:center;font-size:.92vw;font-weight:700;color:#cfe4ff;letter-spacing:.05em}
.sub-hero .mig a{color:#8fc2ff}
.sub-hero .mig a:hover{text-decoration:underline}

/* ---- CONTENIDO ---- */
.contenido{position:relative;max-width:76vw;margin:0 auto;padding:3vw 0 4vw;z-index:2}
.contenido.angosto{max-width:60vw}
.panel{background:linear-gradient(135deg,rgba(255,255,255,.12),rgba(255,255,255,.05));border:1px solid rgba(255,255,255,.3);border-radius:1.4vw;backdrop-filter:blur(8px);padding:2.2vw 2.6vw;margin-bottom:2vw;box-shadow:0 .5vw 2vw rgba(0,10,50,.35)}
.panel h2{font-size:1.7vw;letter-spacing:.06em;margin-bottom:1vw;text-shadow:0 .12vw .6vw rgba(0,20,80,.5)}
.panel h3{font-size:1.15vw;letter-spacing:.04em;margin:1.3vw 0 .5vw}
.panel p, .panel li{font-size:1vw;line-height:1.65;font-weight:600;color:#eaf3ff}
.panel ul{padding-left:1.4vw;margin:.5vw 0}
.panel a{color:#8fc2ff;font-weight:800}
.panel a:hover{text-decoration:underline}
.fondo-pagina{position:fixed;inset:0;width:100vw;height:100vh;object-fit:cover;z-index:0;opacity:.35}
.velo-pagina{position:fixed;inset:0;background:linear-gradient(180deg,rgba(7,18,51,.75),rgba(12,28,60,.92));z-index:1}
.sobre-fondo{position:relative;z-index:2}

/* botón estándar */
.btn-azul{display:inline-flex;align-items:center;gap:.6vw;background:linear-gradient(180deg,#1e79f2,#0161db);border:1px solid rgba(150,205,255,.7);color:#fff;font-weight:900;font-size:.92vw;letter-spacing:.05em;padding:.8vw 1.8vw;border-radius:999px;transition:transform .18s;box-shadow:0 .3vw 1.2vw rgba(0,20,80,.5)}
.btn-azul:hover{transform:scale(1.07)}

/* grid de tarjetas (news / juegos / contacto) */
.grid-3{display:grid;grid-template-columns:repeat(3,1fr);gap:1.8vw}
.grid-2{display:grid;grid-template-columns:repeat(2,1fr);gap:1.8vw}
.tarjeta{background:linear-gradient(180deg,rgba(40,130,235,.28),rgba(10,60,160,.4));border:.14vw solid rgba(110,203,255,.65);border-radius:1.3vw;overflow:hidden;backdrop-filter:blur(6px);transition:transform .22s;box-shadow:0 .4vw 1.6vw rgba(0,30,100,.4);display:flex;flex-direction:column}
.tarjeta:hover{transform:translateY(-.4vw)}
.tarjeta img.thumb{width:100%;aspect-ratio:16/9;object-fit:cover}
.tarjeta .cuerpo{padding:1.2vw 1.4vw 1.4vw;display:flex;flex-direction:column;gap:.5vw;flex:1}
.tarjeta .fecha{font-size:.78vw;font-weight:800;letter-spacing:.08em;color:#9ec7ff}
.tarjeta h3{font-size:1.15vw;letter-spacing:.03em;line-height:1.25}
.tarjeta p{font-size:.9vw;line-height:1.5;font-weight:600;color:#e4f0ff;flex:1}
.tarjeta .link{font-size:.85vw;font-weight:900;letter-spacing:.05em;color:#8fc2ff}
.tarjeta.verde{background:linear-gradient(180deg,rgba(40,90,30,.35),rgba(15,50,15,.5));border-color:rgba(126,201,94,.65)}
.tarjeta.morada{background:linear-gradient(180deg,rgba(90,30,180,.35),rgba(40,8,90,.5));border-color:rgba(168,108,232,.65)}

/* ---- FOOTER (idéntico al home) ---- */
.footer{position:relative;background:#0c1c3c;margin-top:0;padding:1.6vw 11vw 1.2vw;z-index:2}
.footer-cols{display:flex;gap:7vw}
.footer-logo{width:7vw;flex:none;align-self:flex-start;margin-right:2.5vw}
.footer h4{font-family:'Nunito',sans-serif;font-size:.95vw;font-weight:900;letter-spacing:.08em;margin-bottom:1vw}
.footer ul{list-style:none}
.footer ul a{display:block;font-size:.88vw;font-weight:600;color:#b9c9e6;padding:.28vw 0;transition:color .15s}
.footer ul a:hover{color:#fff}
.social{display:flex;gap:1vw}
.social a{width:2.2vw;height:2.2vw;display:flex;align-items:center;justify-content:center;border-radius:.55vw;background:rgba(255,255,255,.08);transition:transform .18s,background .18s}
.social a:hover{transform:scale(1.12);background:rgba(255,255,255,.2)}
.social svg{width:1.15vw;height:1.15vw;fill:#fff}
.copyright{font-size:.76vw;font-weight:600;color:#8fa3c8;margin-top:1.2vw}

/* ---- FORMULARIOS ---- */
.form-z{display:flex;flex-direction:column;gap:1vw;margin-top:1.2vw}
.form-z label{font-size:.85vw;font-weight:900;letter-spacing:.06em;color:#cfe4ff}
.form-z input,.form-z select,.form-z textarea{width:100%;border-radius:.8vw;border:1px solid rgba(255,255,255,.4);background:rgba(8,30,80,.45);color:#fff;font-family:inherit;font-weight:600;font-size:.95vw;padding:.8vw 1.1vw;outline:none}
.form-z input:focus,.form-z select:focus,.form-z textarea:focus{border-color:#5fa8ff;background:rgba(10,38,100,.55)}
.form-z select{appearance:auto}
.form-z select option{color:#0c1c3c;background:#fff}
.form-z textarea{min-height:8vw;resize:vertical}
.form-z ::placeholder{color:#9db8dd}
.form-fila{display:grid;grid-template-columns:1fr 1fr;gap:1vw}
.acuse{display:none;background:linear-gradient(180deg,rgba(46,139,39,.35),rgba(28,97,30,.45));border:1px solid rgba(126,201,94,.8);border-radius:1vw;padding:1.4vw 1.8vw;font-size:1.05vw;font-weight:800;color:#eaffe6;margin-top:1.2vw}
.dato-llc{font-size:.85vw;font-weight:700;color:#b9c9e6;margin-top:.9vw}
.dato-llc a{color:#8fc2ff}

/* ============ MÓVIL (≤820px) ============ */
.solo-movil{display:none}
@media (max-width:820px){
  .solo-desktop{display:none!important}
  .solo-movil{display:block}
  body{background:#071233}
  .m-header{position:fixed;top:0;left:0;right:0;z-index:60;display:flex;align-items:center;justify-content:space-between;padding:3.5vw 4.5vw;background:linear-gradient(180deg,rgba(7,18,51,.94),rgba(7,18,51,.5) 70%,rgba(7,18,51,0))}
  .m-logo{width:26vw}
  .m-burger{width:11vw;height:11vw;border-radius:3.2vw;background:linear-gradient(180deg,#2f83ff,#085ee8);border:1px solid rgba(170,210,255,.8);display:flex;align-items:center;justify-content:center}
  .m-burger span,.m-burger span::before,.m-burger span::after{content:'';display:block;width:5vw;height:.55vw;border-radius:1vw;background:#fff;position:relative}
  .m-burger span::before{position:absolute;top:-1.6vw}
  .m-burger span::after{position:absolute;top:1.6vw}
  .m-menu{position:fixed;inset:0;z-index:70;background:rgba(4,10,34,.96);display:none;flex-direction:column;align-items:center;justify-content:center;gap:6vw}
  .m-menu.abierto{display:flex}
  .m-menu a{font-size:6.5vw;font-weight:900;color:#fff}
  .m-menu .cerrar{position:absolute;top:5vw;right:5vw;font-size:9vw;color:#fff;font-weight:400}
  .sub-hero{height:52vw;margin-top:0}
  .sub-hero h1{font-size:7.2vw;bottom:9vw}
  .sub-hero .mig{font-size:3vw;bottom:4vw}
  .contenido,.contenido.angosto{max-width:100%;padding:6vw 5vw 30vw}
  .panel{border-radius:4.5vw;padding:5.5vw;margin-bottom:5vw}
  .panel h2{font-size:5.4vw}
  .panel h3{font-size:4.2vw;margin:4vw 0 1.5vw}
  .panel p,.panel li{font-size:3.6vw;line-height:1.6}
  .panel ul{padding-left:5vw}
  .btn-azul{font-size:3.8vw;padding:3.2vw 6.5vw;gap:2vw}
  .grid-3,.grid-2{grid-template-columns:1fr;gap:4.5vw}
  .tarjeta{border-radius:4.5vw;border-width:.6vw}
  .tarjeta .cuerpo{padding:4vw 4.5vw 4.5vw;gap:1.6vw}
  .tarjeta .fecha{font-size:2.8vw}
  .tarjeta h3{font-size:4.6vw}
  .tarjeta p{font-size:3.4vw}
  .tarjeta .link{font-size:3.4vw}
  .form-z{gap:3vw}
  .form-z label{font-size:3.2vw}
  .form-z input,.form-z select,.form-z textarea{border-radius:2.6vw;font-size:3.8vw;padding:3vw 3.6vw}
  .form-z textarea{min-height:30vw}
  .form-fila{grid-template-columns:1fr;gap:3vw}
  .acuse{border-radius:3.5vw;padding:4.5vw;font-size:3.8vw}
  .dato-llc{font-size:3vw;margin-top:3vw}
  .footer{padding:6vw 6vw 26vw}
  .footer-cols{flex-wrap:wrap;gap:7vw}
  .footer-logo{width:26vw;margin-right:0}
  .footer h4{font-size:3.6vw;margin-bottom:2.5vw}
  .footer ul a{font-size:3.3vw;padding:1vw 0}
  .social{gap:3vw}
  .social a{width:9vw;height:9vw;border-radius:2.2vw}
  .social svg{width:4.6vw;height:4.6vw}
  .copyright{font-size:2.9vw;margin-top:5vw}
  .m-tabbar{position:fixed;left:3vw;right:3vw;bottom:2.5vw;z-index:60;background:linear-gradient(180deg,rgba(10,30,90,.92),rgba(6,16,54,.95));border:1px solid rgba(120,180,255,.5);border-radius:6vw;display:flex;padding:2vw 1.5vw;backdrop-filter:blur(8px);box-shadow:0 1vw 4vw rgba(0,5,30,.6)}
  .m-tab{flex:1;display:flex;flex-direction:column;align-items:center;gap:1vw;color:#cfe0fa;font-size:2.6vw;font-weight:800;letter-spacing:.04em;padding:1.5vw 0;border-radius:5vw}
  .m-tab svg{width:6vw;height:6vw}
  .m-tab.activo{background:linear-gradient(180deg,#2f83ff,#085ee8);color:#fff;border:1px solid rgba(170,210,255,.8)}
}
@media (min-width:821px){
  .m-header,.m-menu,.m-tabbar{display:none}
}