/* Stile delle pagine degli Arcani Maggiori */
* { box-sizing: border-box; }
body {
  margin: 0;
  background: #0b0b0b;
  color: #d6efeb;
  font-family: 'Playfair Display', Georgia, serif;
  font-size: 18px;
  line-height: 1.7;
}
a { color: #40E0D0; }
.testata {
  display: flex; justify-content: space-between; align-items: center; flex-wrap: wrap; gap: 10px;
  padding: 12px 20px; background: #111; box-shadow: 0 0 15px rgba(64,224,208,.45);
}
.testata .logo {
  font-family: 'Cinzel Decorative', serif; font-weight: 700; font-size: 24px;
  color: #40E0D0; text-decoration: none; text-shadow: 0 0 10px rgba(64,224,208,.6);
}
.testata nav { display: flex; gap: 16px; align-items: center; font-size: 16px; }
.testata nav a { text-decoration: none; }
.pill, .cta {
  display: inline-block; background: #40E0D0; color: #000 !important; text-decoration: none;
  font-weight: bold; border-radius: 25px; box-shadow: 0 0 15px rgba(64,224,208,.7);
}
.pill { padding: 6px 18px; }
.cta { padding: 12px 30px; margin-top: 10px; font-size: 18px; }
.arcano { max-width: 860px; margin: 0 auto; padding: 20px 20px 60px; }
.briciole { font-size: 14px; opacity: .7; margin: 6px 0 0; }
h1, h2 {
  font-family: 'Cinzel Decorative', serif; color: #40E0D0;
  text-shadow: 0 0 10px rgba(64,224,208,.5); line-height: 1.3;
}
h1 { font-size: 32px; margin: 14px 0 24px; text-align: center; }
h2 { font-size: 26px; margin: 48px 0 10px; border-bottom: 1px solid rgba(64,224,208,.3); padding-bottom: 8px; }
h3 { color: #40E0D0; font-size: 20px; margin: 28px 0 6px; }
.intro { display: flex; gap: 28px; align-items: flex-start; }
.intro img {
  width: 240px; height: auto; flex-shrink: 0; border-radius: 14px; box-shadow: 0 0 25px rgba(64,224,208,.6);
}
.etichetta { color: #40E0D0; font-weight: bold; }
.nota { font-style: italic; opacity: .85; }
img.rovesciata {
  float: right; width: 120px; height: auto; margin: 6px 0 12px 20px;
  transform: rotate(180deg); border-radius: 10px; box-shadow: 0 0 15px rgba(64,224,208,.5);
}
.finale {
  clear: both; text-align: center; margin-top: 56px; padding: 26px 20px;
  border: 1px solid rgba(64,224,208,.5); border-radius: 15px; background: rgba(20,20,20,.8);
}
.finale h2 { border: none; margin-top: 0; }
.prevnext { display: flex; justify-content: space-between; gap: 12px; margin-top: 40px; font-size: 17px; }
.prevnext a { text-decoration: none; }
.lead { font-size: 19px; }
.griglia {
  list-style: none; padding: 0; margin: 30px 0 0;
  display: grid; grid-template-columns: repeat(auto-fill, minmax(140px, 1fr)); gap: 22px;
}
.griglia a { display: flex; flex-direction: column; align-items: center; text-decoration: none; text-align: center; }
.griglia img {
  width: 120px; height: auto; border-radius: 10px; box-shadow: 0 0 12px rgba(64,224,208,.5);
  transition: transform .3s;
}
.griglia a:hover img { transform: scale(1.06); }
.griglia .num { font-size: 13px; opacity: .7; margin-top: 8px; }
.griglia .nome { font-family: 'Cinzel Decorative', serif; font-size: 15px; line-height: 1.3; }
.piede { text-align: center; font-size: 14px; opacity: .7; padding: 24px; border-top: 1px solid rgba(64,224,208,.2); }
@media (max-width: 640px) {
  body { font-size: 17px; }
  h1 { font-size: 25px; }
  h2 { font-size: 21px; }
  .intro { flex-direction: column; align-items: center; }
  .intro img { width: 200px; }
  .testata nav a:not(.pill) { display: none; }
}