/* Scoped additions: the published specimens retain their complete proportions. */
.type-hero-grid {
  display: grid;
  grid-template-columns: minmax(0, 0.8fr) minmax(0, 1.2fr);
  grid-template-rows: auto 1fr;
  column-gap: clamp(2rem, 5vw, 4rem);
  row-gap: 1.5rem;
  align-items: start;
}

.type-study .project-hero { padding-top: clamp(2.5rem, 5vw, 4rem); }
.type-heading { grid-column: 1; grid-row: 1; }
.type-introduction { grid-column: 1; grid-row: 2; }
.type-introduction > p:first-child { margin-top: 0; }
.type-hero-grid > .type-specimen { grid-column: 2; grid-row: 1 / 3; }
.type-study .project-hero h1 { letter-spacing: -0.045em; }
.type-study .hero-actions { margin-top: 1.5rem; align-items: center; }
.type-study .availability { margin-top: 2rem; }

.type-specimen { margin: 0; min-width: 0; }
.type-specimen img,
.type-feature-art img { display: block; width: 100%; height: auto; }
.type-specimen > a { display: block; }
.type-specimen figcaption {
  margin-top: 0.85rem;
  color: var(--muted);
  font-size: 0.85rem;
  line-height: 1.65;
}
.type-specimen figcaption a { text-underline-offset: 3px; }
.type-specimen-detail { max-width: 940px; margin-inline: auto; }
.type-evaluation-copy { color: var(--muted); }
.type-evaluation-copy p { max-width: 63ch; }
.type-evaluation-copy .type-signin-note { margin: 0.75rem 0 0; font-size: 0.85rem; }
.type-development { max-width: 63ch; padding-top: 1.5rem; border-top: 1px solid var(--line); }
.type-development h3 { margin-bottom: 0.5rem; font-size: 1.05rem; }
.type-development p { margin-bottom: 0; color: var(--muted); }

.type-feature { align-items: center; }
.type-feature-art { display: block; max-width: 270px; }
.type-feature h3 { margin-bottom: 1rem; }

@media (max-width: 980px) and (min-width: 601px) {
  .type-feature-art { grid-row: span 2; }
}

@media (max-width: 900px) {
  .type-hero-grid { grid-template-columns: minmax(0, 1fr); grid-template-rows: auto; }
  .type-heading, .type-introduction, .type-hero-grid > .type-specimen { grid-column: auto; grid-row: auto; }
  .type-introduction { max-width: 650px; }
  .type-hero-grid .type-specimen { max-width: 700px; margin-inline: auto; }
}

@media (max-width: 600px) {
  .type-feature-art { max-width: 100%; }
}
