@import url("project.css");

.project-title { max-width: 980px; }

.hero-media img {
  height: min(68vw, 860px);
  object-position: center 48%;
}

.narrative-copy {
  display: grid;
  gap: clamp(42px, 6vw, 78px);
}

.figure-stack,
.figure-pair,
.result-gallery {
  display: grid;
  gap: clamp(18px, 2.4vw, 34px);
}

.figure-pair { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.result-gallery { grid-template-columns: repeat(3, minmax(0, 1fr)); }

.project-figure { margin: 0; }

.project-figure img {
  width: 100%;
  display: block;
  background: var(--soft);
  object-fit: cover;
}

.project-figure--interface img { aspect-ratio: 1.86 / 1; }
.project-figure--photo img { aspect-ratio: 4 / 3; }

.project-figure--diagram img {
  aspect-ratio: 1.7 / 1;
  padding: clamp(18px, 3vw, 44px);
  object-fit: contain;
}

.figure-caption {
  display: grid;
  gap: 5px;
  padding-top: 11px;
}

.caption-title {
  font-size: 0.74rem;
  font-weight: 600;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.caption-text {
  max-width: 62ch;
  color: var(--muted);
  font-size: 0.8rem;
  line-height: 1.45;
}

.decision-list { margin-top: 4px; }

.decision-list h3 { max-width: 720px; }

.result-lead {
  max-width: 920px;
  margin: 0;
  font-family: "Instrument Serif", Georgia, serif;
  font-size: clamp(2rem, 4vw, 4.1rem);
  letter-spacing: -0.025em;
  line-height: 1.04;
}

.result-note {
  max-width: 850px;
  margin: 0;
  padding: 22px 0 0;
  border-top: 1px solid var(--line);
  color: var(--muted);
  font-size: 0.9rem;
}

@media (max-width: 760px) {
  .hero-media img { height: 70vw; min-height: 390px; }
  .figure-pair,
  .result-gallery { grid-template-columns: 1fr; }
  .project-figure--interface img,
  .project-figure--photo img { aspect-ratio: auto; }
}