/* Not-So-Serious Games : style commun à toutes les pages */
:root{
  --encre:#232323;
  --encre-douce:#5C5C5C;
  --bleu:#5554C2;
  --bleu-fonce:#424297;
  --trait:#DCDCDC;
}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{
  margin:0;background:#fff;color:var(--encre);
  font:400 1.0625rem/1.65 Nunito,system-ui,sans-serif;
}
.page{max-width:37rem;margin:0 auto;padding:2.5rem 1.5rem 4rem}
header{text-align:center;padding-bottom:1.5rem}
.logo{width:min(34rem,100%);height:auto;display:block;margin:0 auto}
.icone-jeu{width:8.5rem;height:8.5rem;display:block;margin:0 auto .9rem}
h1{font:400 2.4rem/1.15 "Coming Soon",cursive;margin:.4rem 0 .2rem}
h2{font:400 1.8rem/1.2 "Coming Soon",cursive;margin:2.75rem 0 .75rem}
h3{font-size:1.0625rem;font-weight:700;margin:1.75rem 0 .35rem}
p{margin:0 0 1rem}
ul{margin:0 0 1rem;padding-left:1.2rem}
li{margin-bottom:.4rem}
a{color:var(--bleu-fonce);text-decoration-color:var(--bleu);text-decoration-thickness:2px;text-underline-offset:3px}
a:hover{color:var(--bleu)}
a:focus-visible{outline:2px solid var(--bleu);outline-offset:3px;border-radius:2px}
.maj{color:var(--encre-douce);font-size:.92rem;margin:0}
.retour{display:inline-block;margin-bottom:1.25rem;font-size:.95rem}
.lang{display:flex;gap:.5rem;justify-content:center;margin:1.5rem 0 2rem}
.lang button{
  font:600 .9rem/1 Nunito,sans-serif;color:var(--encre-douce);
  background:none;border:2px solid var(--trait);border-radius:999px;
  padding:.45rem .95rem;cursor:pointer;
}
.lang button[aria-pressed="true"]{color:#fff;border-color:var(--bleu);background:var(--bleu)}
.lang button:focus-visible{outline:2px solid var(--bleu);outline-offset:2px}
.contact,.cle{
  border-top:2px solid var(--trait);border-bottom:2px solid var(--trait);
  padding:1.15rem 0;margin:2rem 0;text-align:center;font-size:1.15rem;
}
.cle{margin:1.5rem 0 0;font-size:1.2rem}
.boutique{text-align:center;margin:1.25rem 0 0}
.boutique a{
  display:inline-block;font-weight:700;text-decoration:none;color:#fff;
  background:var(--bleu);border-radius:999px;padding:.6rem 1.3rem;
}
.boutique a:hover{background:var(--bleu-fonce);color:#fff}
.bientot{color:var(--encre-douce);font-style:italic}
/* cartes des jeux, page d'accueil */
.jeux{display:grid;gap:1.25rem;margin:1.5rem 0 0}
.jeu{
  display:flex;gap:1.1rem;align-items:center;text-decoration:none;color:inherit;
  border:2px solid var(--trait);border-radius:1.25rem;padding:1rem 1.1rem;
}
.jeu:hover{border-color:var(--bleu)}
.jeu img{width:5.5rem;height:5.5rem;flex:none}
.jeu strong{display:block;font:400 1.45rem/1.2 "Coming Soon",cursive;color:var(--encre)}
.jeu span{display:block;color:var(--encre-douce);font-size:.98rem;line-height:1.45}
.jeu em{display:block;font-style:normal;color:var(--bleu-fonce);font-weight:600;font-size:.92rem;margin-top:.3rem}
footer{
  margin-top:3.5rem;padding-top:1.25rem;border-top:2px solid var(--trait);
  color:var(--encre-douce);font-size:.9rem;text-align:center;
}
[hidden]{display:none !important}
