.reveal { opacity: 1; transform: none; }
.hero-art { background-image: url('assets/andras-hero.webp'); }
.hero { overflow: hidden; }
.game-title {
  margin: 1.3rem 0 0;
  font: 600 clamp(3.3rem, 8vw, 8.3rem)/.9 var(--display);
  color: #e6d5b7;
  letter-spacing: .045em;
  text-shadow: 0 4px 30px #000, 0 1px 2px #b98b63;
}
.game-title span {
  display: block;
  margin: .65rem 0 0 .4rem;
  font-size: .22em;
  letter-spacing: .62em;
}
.hero h1 span { font-size: clamp(1.6rem, 3.1vw, 3rem); }
.hero h1 strong { font-size: clamp(1.95rem, 4vw, 4rem); }
.hero-actions .button { clip-path: polygon(8% 0, 92% 0, 100% 50%, 92% 100%, 8% 100%, 0 50%); }
.section[id] { scroll-margin-top: 66px; border-top: 1px solid #54412f; }
.concept-note { font-size: .85rem; }
.legacy-grid { grid-template-columns: repeat(5, minmax(0, 1fr)); gap: .7rem; border: 0; }
.legacy-card, .legacy-card:last-child {
  border: 1px solid #594331;
  background: linear-gradient(160deg, #28191a, #141315 65%);
  padding: .6rem .85rem 1.1rem;
  min-height: 0;
}
.legacy-card::before, .chapter::before {
  content: '';
  display: block;
  aspect-ratio: var(--crop-ratio, 2 / 1);
  background: url('assets/andras-scenes.webp') var(--art-x) var(--art-y) / var(--art-size) auto no-repeat;
  border-bottom: 1px solid #594331;
}
.legacy-card { --art-size: 470.5%; --art-y: 50.9%; }
.legacy-card:nth-child(1) { --art-x: 6%; }
.legacy-card:nth-child(2) { --art-x: 36%; }
.legacy-card:nth-child(3) { --art-x: 94%; }
.legacy-card:nth-child(4) { --art-x: 63%; --art-y: 69.3%; }
.legacy-card:nth-child(5) { --art-x: 65%; }
.legacy-card .roman { font-size: 1.1rem; color: var(--gold); }
.legacy-card h3 { margin: .3rem 0; }
.legacy-card p { font-size: .87rem; }
.legacy-card small { position: static; }
.relic {
  display: grid;
  grid-template-columns: 1fr 1.4fr;
  gap: 1rem;
  align-items: center;
  padding: 1.5rem;
  margin-top: 2rem;
  border: 1px solid #594331;
  background: radial-gradient(ellipse at 0 90%, #30201a, #111114 70%);
}
.relic p, .relic h3 { margin: .25rem 0; }
.relic ol { margin: .25rem 0; padding-left: 1.4rem; }
.relic li strong { color: #d7b579; margin-right: .4em; }
.chapters { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: .65rem; border: 0; }
.chapter { display: block; border: 1px solid #594331; }
.chapter::before { --art-size: 560%; --art-y: 67.4%; }
.chapter:nth-child(1) { --art-x: 5%; }
.chapter:nth-child(2) { --art-x: 28.5%; }
.chapter:nth-child(3) { --art-x: 50.3%; }
.chapter:nth-child(4) { --art-x: 72.1%; }
.chapter:nth-child(5) { --art-x: 94.2%; }
.chapter-heading { margin: 0; padding: .85rem; font-size: 1rem; }
.chapter-heading span { display: block; color: var(--gold); font-size: .72rem; }
.chapter p { display: block; padding: 0 .85rem 1rem; border: 0; opacity: 1; font-size: .86rem; }
.chapter.active { border-color: var(--gold); }
.pre-register {
  background: linear-gradient(rgba(6,7,9,.55),rgba(6,7,9,.96)),
    url('assets/andras-hero.webp') center 37%/cover;
}
:focus-visible { outline: 2px solid #e2bd79; outline-offset: 4px; }

@media (max-width: 1200px) {
  .legacy-grid, .chapters { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}

@media (max-width: 760px) {
  .legacy-grid, .chapters { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .legacy-card { border-right: 1px solid #594331 !important; }
  .relic { grid-template-columns: 1fr; }
}