/* Project archive and individual project pages */
.project-index { padding: 68px 2% 100px; }
.project-index > h1 { text-align: center; font-size: 36px; line-height: 1.2; margin: 0 0 100px; text-decoration: underline; font-weight: 500; }
.project-grid { display: grid; grid-template-columns: repeat(3, minmax(0,1fr)); gap: 48px 20px; }
.project-card { display: block; text-decoration: none; color: inherit; }
.project-card img { display: block; width: 100%; aspect-ratio: 1; object-fit: cover; }
.project-card h2 { font-size: 24px; line-height: 1.15; font-weight: 500; margin: 20px 0 0; }
.project-detail { padding-top: 42px; }
.project-copy { max-width: 940px; padding: 0 20px; margin: 0 auto; text-align: center; }
.project-copy h1 { font-size: 24px; line-height: 1.2; font-weight: 500; margin: 0 0 34px; }
.project-copy p { margin: 0 0 28px; font-size: 16px; line-height: 1.65; }
.project-intro { margin-bottom: 100px; }
.project-intro h1 { margin-bottom: 32px; }
.project-section + .project-section { padding-top: 80px; }
.project-gallery { display: grid; grid-template-columns: repeat(2, minmax(0,1fr)); gap: 32px; margin: 84px auto 0; width: calc(100% - 80px); max-width: 1600px; }
.project-gallery img { width: 100%; height: auto; display: block; }
.project-gallery img:last-child:nth-child(odd) { grid-column: 1 / -1; width: 66%; justify-self: center; }
.project-video { max-width: 800px; width: calc(100% - 80px); aspect-ratio: 640 / 463; margin: 80px auto 0; }
.project-video iframe { border: 0; width: 100%; height: 100%; }
.project-pagination { display: flex; justify-content: space-between; gap: 25px; padding: 148px 2% 38px; }
.project-pagination a { color: inherit; text-decoration: none; max-width: 48%; min-height: 44px; display: flex; align-items: center; gap: 16px; }
.project-pagination a.next { text-align: right; margin-left: auto; }
.project-pagination small { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0,0,0,0); white-space: nowrap; border: 0; }
.project-pagination a span { display: block; font-family: var(--heading-font); font-size: 24px; line-height: 1.15; font-weight: 500; }
.project-pagination a:not(.next)::before, .project-pagination a.next::after { content: ''; flex: 0 0 12px; height: 12px; border-left: 1.5px solid; border-bottom: 1.5px solid; transform: rotate(45deg); }
.project-pagination a.next::after { transform: rotate(225deg); }
@media (max-width: 767px) {
  .project-index { padding: 82px 6% 70px; }
  .project-index > h1 { font-size: 28.166px; line-height: 1.327; margin-bottom: 92px; }
  .project-grid { grid-template-columns: 1fr; gap: 70px; }
  .project-card h2 { font-size: 20.064px; line-height: 1.4; margin-top: 20px; }
  .project-detail { padding-top: 40px; }
  .project-copy { padding: 0 24px; }
  .project-copy h1 { font-size: 22px; margin-bottom: 28px; }
  .project-copy p { font-size: 15px; }
  .project-intro { margin-bottom: 65px; }
  .project-section + .project-section { padding-top: 60px; }
  .project-gallery { width: 88%; gap: 34px; margin-top: 55px; }
  .project-gallery img:last-child:nth-child(odd) { width: 100%; }
  .project-video { width: calc(100% - 36px); margin-top: 55px; }
  .project-pagination { padding: 55px 6% 12px; gap: 0; }
  .project-pagination a { width: 50%; max-width: 50%; gap: 14px; }
  .project-pagination a.next { justify-content: flex-end; }
  .project-pagination a span { font-size: 19px; }
}
@media (max-width: 480px) {
  .project-gallery { grid-template-columns: 1fr; }
  .project-gallery img:last-child:nth-child(odd) { grid-column: auto; }
}