/* HistoriaCasinos — style.v1.css */
:root{
  --azul:#1C4F6B;
  --azul-osc:#0e2733;
  --arena:#E8D9B5;
  --terracota:#C06A3C;
  --texto:#222a2d;
  --blanco:#fffaf2;
  --radio:10px;
}
*{box-sizing:border-box;}
html,body{margin:0;padding:0;}
body{
  font-family:"Segoe UI",Verdana,Arial,sans-serif;
  color:var(--texto);
  background:var(--blanco);
  line-height:1.6;
}
h1,h2,h3,h4{
  font-family:Georgia,"Times New Roman",serif;
  color:var(--azul);
  line-height:1.25;
}
a{color:var(--azul);text-decoration:underline;}
a:hover{color:var(--terracota);}
img,.ilustracion{max-width:100%;height:auto;display:block;}
[hidden]{display:none!important;}

/* ---------- Age gate ---------- */
#agegate{
  position:fixed;inset:0;z-index:999;
  background:var(--azul-osc);
  color:var(--blanco);
  display:flex;align-items:center;justify-content:center;
  padding:1.5rem;
}
#agegate .caja{
  background:var(--azul);
  border:2px solid var(--arena);
  border-radius:var(--radio);
  padding:2rem;max-width:30rem;text-align:center;
}
#agegate h2{color:var(--arena);}
#agegate p{color:var(--blanco);}
.agegate-botones{display:flex;gap:1rem;justify-content:center;margin-top:1.5rem;flex-wrap:wrap;}
.boton{
  display:inline-block;padding:.7rem 1.4rem;border-radius:999px;
  border:2px solid var(--arena);background:var(--terracota);color:var(--blanco);
  font-weight:bold;cursor:pointer;font-size:1rem;
}
.boton:hover{background:var(--arena);color:var(--azul-osc);}
.boton.secundario{background:transparent;}

/* ---------- Layout general ---------- */
header.sitio{
  background:var(--azul);color:var(--blanco);padding:1rem 1.2rem;
}
header.sitio .marca{
  font-family:Georgia,serif;font-size:1.6rem;font-weight:bold;color:var(--arena);
  text-decoration:none;display:inline-block;
}
header.sitio .lema{font-size:.85rem;color:var(--arena);margin:.2rem 0 .8rem;}
nav.principal ul{
  list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:.4rem .9rem;
}
nav.principal a{color:var(--blanco);text-decoration:none;font-size:.92rem;}
nav.principal a:hover,nav.principal a.activo{color:var(--terracota);text-decoration:underline;}

main{max-width:960px;margin:0 auto;padding:1.6rem 1.2rem 3rem;}
.hero{
  background:linear-gradient(180deg,var(--arena),var(--blanco));
  padding:1.6rem 1.2rem;border-radius:var(--radio);margin-bottom:2rem;
}
.hero-grid{display:flex;gap:1.5rem;flex-wrap:wrap;align-items:center;}
.hero-grid .texto{flex:1 1 300px;}
.hero-grid .imagen{flex:1 1 220px;max-width:240px;}

.tizadores{display:flex;gap:1rem;flex-wrap:wrap;margin:2rem 0;}
.tizador{
  flex:1 1 220px;background:var(--arena);border-radius:var(--radio);
  padding:1rem;border:1px solid #d8c7a0;
}
.tizador h3{margin-top:0;}

.franja{
  background:var(--arena);border-radius:var(--radio);padding:1.2rem;margin:1.5rem 0;
}
.nota{
  border-left:4px solid var(--terracota);padding:.5rem 1rem;background:#fff4ea;margin:1.5rem 0;
}
table{width:100%;border-collapse:collapse;margin:1rem 0;}
table caption{text-align:left;font-weight:bold;margin-bottom:.4rem;}
th,td{border:1px solid #ccb98e;padding:.5rem;text-align:left;vertical-align:top;}
th{background:var(--arena);}

footer.sitio{
  background:var(--azul-osc);color:var(--arena);padding:2rem 1.2rem;margin-top:2rem;
}
footer.sitio a{color:var(--arena);}
footer.sitio .columnas{display:flex;flex-wrap:wrap;gap:1.6rem;max-width:960px;margin:0 auto;}
footer.sitio .columna{flex:1 1 200px;}
footer.sitio small{display:block;margin-top:1.4rem;opacity:.8;max-width:960px;margin-left:auto;margin-right:auto;}

/* ---------- Tablero de Temporada ---------- */
#tablero-wrap{margin:1.5rem 0;}
#tablero-circulo{position:relative;max-width:460px;margin:0 auto;}
#tablero-circulo svg{width:100%;height:auto;}
.sector{cursor:pointer;}
.sector path{fill:var(--azul);stroke:var(--blanco);stroke-width:1.5;transition:fill .15s;}
.sector:hover path,.sector:focus path{fill:var(--terracota);}
.sector[aria-pressed="true"] path{fill:var(--terracota);}
.sector text{fill:var(--blanco);font-size:9px;font-family:Georgia,serif;text-anchor:middle;pointer-events:none;}
.sector:focus{outline:3px solid var(--azul-osc);outline-offset:2px;}

#tablero-acordeon{display:none;}
#tablero-acordeon .acc-item{border:1px solid #ccb98e;border-radius:6px;margin-bottom:.5rem;overflow:hidden;}
#tablero-acordeon .acc-btn{
  width:100%;text-align:left;padding:.7rem 1rem;background:var(--arena);
  border:none;font-weight:bold;font-size:1rem;cursor:pointer;color:var(--azul-osc);
}
#tablero-acordeon .acc-btn[aria-pressed="true"]{background:var(--terracota);color:var(--blanco);}
#tablero-acordeon .acc-panel{padding:.9rem 1rem;}

#tablero-resultado{
  margin-top:1.2rem;background:var(--blanco);border:2px solid var(--azul);border-radius:var(--radio);
  padding:1.2rem;min-height:4rem;
}
#tablero-resultado .resultado-cont{display:flex;gap:1rem;flex-wrap:wrap;align-items:flex-start;}
#tablero-resultado .resultado-cont .ilustracion{max-width:110px;flex:0 0 110px;}
#tablero-resultado .resultado-cont .rtexto{flex:1 1 220px;}
.sr-solo{position:absolute;left:-9999px;}

@media (max-width:640px){
  #tablero-circulo{display:none;}
  #tablero-acordeon{display:block;}
  .hero-grid .imagen{max-width:160px;margin:0 auto;}
}
