/* Free sheet music pages (/sheets/...) */
.sheet {
  padding: clamp(8rem, 12vw, 11rem) var(--page-x) clamp(6rem, 9vw, 9rem);
  min-height: 100svh;
}
.sheet-layout {
  display: grid;
  grid-template-columns: minmax(0, 1.05fr) minmax(320px, .95fr);
  align-items: start;
  gap: clamp(3rem, 7vw, 8rem);
  padding-top: clamp(3rem, 5.5vw, 5.5rem);
}
.sheet-preview {
  margin: 0;
  max-width: 680px;
  padding: clamp(1rem, 2vw, 1.6rem) clamp(1rem, 2vw, 1.6rem) 0;
  background: var(--paper);
  border: 1px solid var(--line-dark);
  box-shadow: 0 30px 60px -38px rgba(17, 17, 15, .38);
}
.sheet-preview img { aspect-ratio: 1100 / 870; }
.sheet-copy h1 {
  margin: 0;
  font-size: clamp(3.4rem, 6.4vw, 7.2rem);
  font-weight: 400;
  line-height: .84;
  letter-spacing: -.07em;
}
.sheet-copy > p {
  max-width: 30rem;
  margin: 2rem 0 0;
  color: #4d4c48;
  font-size: clamp(.95rem, 1.15vw, 1.08rem);
  line-height: 1.65;
}
.sheet-form { margin-top: 2.6rem; max-width: 32rem; }
.sheet-label {
  display: block;
  margin-bottom: .7rem;
  color: var(--muted-dark);
  font-size: .61rem;
  letter-spacing: .12em;
  text-transform: uppercase;
}
.sheet-field {
  display: flex;
  border: 1px solid var(--ink);
}
.sheet-field input {
  flex: 1 1 auto;
  min-width: 0;
  min-height: 3rem;
  padding: .75rem 1rem;
  border: 0;
  border-radius: 0;
  background: transparent;
  color: var(--ink);
  font: inherit;
  font-size: .9rem;
}
.sheet-field input::placeholder { color: var(--muted-light); }
.sheet-field input:focus { outline: none; background: rgba(255, 255, 255, .35); }
.sheet-field:focus-within { outline: 1px solid var(--ink); outline-offset: 3px; }
.sheet-field .solid-link {
  flex: 0 0 auto;
  border: 0;
  border-left: 1px solid var(--ink);
  cursor: pointer;
}
.sheet-note {
  margin: 1rem 0 0;
  color: var(--muted-dark);
  font-size: .72rem;
  line-height: 1.6;
}
.sheet-note a { text-decoration: underline; text-underline-offset: 2px; }
.sheet-note a:hover { opacity: .6; }
.sheet-copy .release-links { margin-top: 2.6rem; }

/* confirmation page */
.sheet-done .sheet-copy { max-width: 40rem; padding-top: clamp(3rem, 5.5vw, 5.5rem); }

@media (max-width: 980px) {
  .sheet-layout { grid-template-columns: 1fr; }
  .sheet-preview { order: 2; max-width: none; }
}
@media (max-width: 680px) {
  .sheet { padding: 7rem 1.25rem 5rem; }
  .sheet-layout { padding-top: 2.6rem; gap: 3rem; }
  .sheet-field { flex-direction: column; }
  .sheet-field .solid-link { justify-content: center; border-left: 0; border-top: 1px solid var(--ink); }
}
