/* HistoriaCassino — style.v1.css — Museu do Salão dos Azulejos */
:root{
  --azul-azulejo:#1E4D6B;
  --branco-cal:#F2EFE6;
  --ocre:#C78A3E;
  --azul-escuro:#123246;
  --texto:#24323B;
  --borda:#d8cfb8;
  --radius:10px;
}
[hidden]{display:none!important}
*{box-sizing:border-box}
html,body{margin:0;padding:0}
body{
  font-family:"Segoe UI","Helvetica Neue",Arial,sans-serif;
  background:var(--branco-cal);
  color:var(--texto);
  line-height:1.6;
}
a{color:var(--azul-azulejo)}
a:hover{color:var(--ocre)}
img,svg{max-width:100%;height:auto}

/* Age gate */
#agegate{
  position:fixed;inset:0;z-index:999;
  background:var(--azul-escuro);
  color:var(--branco-cal);
  display:flex;align-items:center;justify-content:center;
  padding:1.5rem;text-align:center;
}
#agegate .agegate-box{
  max-width:520px;background:var(--azul-azulejo);
  border:3px solid var(--ocre);border-radius:var(--radius);
  padding:2rem;
}
#agegate h1{margin-top:0;font-size:1.4rem}
#agegate .agegate-botoes{display:flex;gap:1rem;justify-content:center;margin-top:1.5rem;flex-wrap:wrap}
#agegate button{
  font-size:1.05rem;padding:.7rem 1.8rem;border-radius:var(--radius);
  border:2px solid var(--ocre);cursor:pointer;font-weight:600;
}
#agegate-sim{background:var(--ocre);color:var(--azul-escuro)}
#agegate-nao{background:transparent;color:var(--branco-cal)}

/* Header / nav */
header.site-header{
  background:var(--azul-azulejo);
  color:var(--branco-cal);
  padding:1rem 1.2rem;
  border-bottom:6px solid var(--ocre);
}
.brand{font-size:1.5rem;font-weight:800;letter-spacing:.02em;text-decoration:none;color:var(--branco-cal)}
.brand span{color:var(--ocre)}
.ornamento{
  height:14px;
  background-image:repeating-linear-gradient(45deg,var(--ocre) 0 7px,var(--branco-cal) 7px 14px);
  opacity:.85;
}
nav.site-nav{background:var(--azul-escuro)}
nav.site-nav ul{
  list-style:none;margin:0;padding:.4rem 1rem;display:flex;flex-wrap:wrap;gap:.9rem;
}
nav.site-nav a{color:var(--branco-cal);text-decoration:none;font-size:.92rem}
nav.site-nav a:hover{color:var(--ocre)}

main{max-width:900px;margin:0 auto;padding:1.8rem 1.2rem 3rem}
h1{color:var(--azul-azulejo);border-bottom:3px solid var(--ocre);padding-bottom:.3rem}
h2{color:var(--azul-azulejo)}
figure{margin:1.4rem 0;text-align:center}
figcaption{font-size:.88rem;color:#55606a;margin-top:.4rem;font-style:italic}

footer.site-footer{
  background:var(--azul-escuro);color:var(--branco-cal);
  padding:1.4rem 1.2rem;font-size:.85rem;text-align:center;
}
footer.site-footer a{color:var(--ocre)}

/* Grid de azulejos */
.grade-azulejos{
  display:grid;grid-template-columns:repeat(4,1fr);gap:.8rem;margin:2rem 0;
}
.azulejo-card{
  perspective:800px;aspect-ratio:1;
}
.azulejo-inner{
  position:relative;width:100%;height:100%;
  transition:transform .6s;transform-style:preserve-3d;
  cursor:pointer;
}
.azulejo-card.virado .azulejo-inner{transform:rotateY(180deg)}
.azulejo-frente,.azulejo-verso{
  position:absolute;inset:0;backface-visibility:hidden;
  border-radius:8px;border:2px solid var(--ocre);
  display:flex;align-items:center;justify-content:center;
  padding:.5rem;text-align:center;
}
.azulejo-frente{background:var(--azul-azulejo)}
.azulejo-verso{
  background:var(--branco-cal);color:var(--texto);
  transform:rotateY(180deg);font-size:.78rem;overflow:auto;
}
.azulejo-frente svg{width:70%;height:70%}

.citacao-fonte{font-size:.8rem;color:#55606a}

.caixa-alerta{
  background:#fff3e2;border:2px solid var(--ocre);
  border-radius:var(--radius);padding:1rem 1.2rem;margin:1.4rem 0;
}

table.mapa-tabela{width:100%;border-collapse:collapse;margin:1rem 0}
table.mapa-tabela th,table.mapa-tabela td{
  border:1px solid var(--borda);padding:.5rem .7rem;text-align:left;font-size:.92rem
}
table.mapa-tabela th{background:var(--azul-azulejo);color:var(--branco-cal)}

@media (max-width:640px){
  .grade-azulejos{grid-template-columns:repeat(2,1fr)}
}