.hero {
  position: relative;
  isolation: isolate;
  height: clamp(590px, 42vw, 760px);
  overflow: hidden;
  background: #03162f;
  border-bottom: 8px solid var(--red);
}

.hero > img {
  position: absolute;
  inset: 0;
  z-index: -3;
  width: 100%;
  height: 100%;
  max-height: none;
  object-fit: cover;
  object-position: center;
}

.hero-shade {
  position: absolute;
  inset: 0;
  z-index: -2;
  background:
    linear-gradient(90deg, rgba(1, 12, 29, .9) 0%, rgba(2, 18, 43, .68) 34%, rgba(2, 17, 37, .08) 67%),
    linear-gradient(0deg, rgba(2, 10, 24, .48), transparent 42%);
}

.hero-copy {
  position: absolute;
  left: max(30px, 5vw);
  top: 50%;
  width: min(575px, 44vw);
  transform: translateY(-50%);
  color: #fff;
}

.hero-genre {
  display: inline-block;
  margin: 0 0 1rem;
  padding: .58rem .82rem;
  border: 1px solid rgba(255, 241, 210, .45);
  background: rgba(6, 33, 65, .72);
  color: #fff2d5;
  font: 700 .64rem Arial, sans-serif;
  letter-spacing: .13em;
}

.title-card {
  width: 100%;
  padding: .65rem .9rem;
  background: #f6f0e4;
  border: 1px solid rgba(218, 168, 61, .72);
  box-shadow: 0 16px 34px rgba(0, 0, 0, .36);
  transform: rotate(-.7deg);
}

.title-card img {
  display: block;
  width: 100%;
  height: auto;
  mix-blend-mode: multiply;
}

.hero-byline {
  margin: 1.3rem 0 .5rem;
  color: #f2ba40;
  font: 700 .7rem Arial, sans-serif;
  letter-spacing: .15em;
}

.hero-tagline {
  max-width: 540px;
  margin: 0;
  color: #fff1d6;
  font-size: clamp(1.15rem, 1.65vw, 1.5rem);
  font-weight: 700;
  line-height: 1.35;
}

.notebook-links { border-top: 1px solid var(--line); }

@media (max-width: 760px) {
  .hero { height: 720px; }
  .hero > img { object-position: 65% center; }
  .hero-shade {
    background:
      linear-gradient(90deg, rgba(1, 12, 29, .94), rgba(2, 18, 43, .45)),
      linear-gradient(0deg, rgba(2, 10, 24, .58), transparent 50%);
  }
  .hero-copy { left: 24px; top: 45%; width: calc(100% - 48px); }
  .hero-genre { font-size: .56rem; }
  .hero-tagline { font-size: 1.04rem; }
}

/* Gold Master Revision 2 — Recovered from the Rehearsal Hall */
.artifact-gallery{padding-top:4.5rem;padding-bottom:4.75rem}
.artifact-gallery .section-rule h2{white-space:nowrap}
.artifact-deck{margin:-.55rem auto 2.1rem;text-align:center;font-family:Georgia,serif;font-style:italic;color:#6a563f;font-size:1.05rem}
.artifact-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:2rem 1.35rem}
.artifact-card{min-width:0}
.artifact-photo{position:relative;aspect-ratio:1/1;overflow:visible;background:#c9b28d;border:1px solid rgba(75,42,25,.25);box-shadow:0 13px 28px rgba(55,32,17,.13)}
.artifact-photo img{display:block;width:100%;height:100%;object-fit:cover;filter:saturate(.92) contrast(1.02)}
.artifact-tag{position:absolute;left:.65rem;bottom:-.8rem;padding:.42rem .62rem .36rem;background:#ead7b2;color:#6f291f;border:1px solid #9a6a43;box-shadow:1px 2px 0 rgba(77,45,25,.18);font:700 .62rem/1.16 Arial,sans-serif;letter-spacing:.065em;transform:rotate(-1deg)}
.artifact-tag b{font-weight:900}
.artifact-card h3{margin:1.35rem 0 .42rem;color:#641f1b;font-family:Georgia,serif;font-size:1.12rem}
.artifact-card p{margin:0;color:#3e3429;line-height:1.48;font-size:.98rem}
.artifact-card p em{font-family:Georgia,serif;color:#563d2f}
.artifact-aside{font-size:.85rem;color:#6d5b49}
@media (max-width:900px){.artifact-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.artifact-gallery .section-rule h2{white-space:normal;text-align:center}}
@media (max-width:560px){.artifact-grid{grid-template-columns:1fr}.artifact-deck{padding:0 1rem}.artifact-photo{max-width:420px;margin:0 auto}.artifact-card h3,.artifact-card p{max-width:420px;margin-left:auto;margin-right:auto}}