/* Project architecture only: clear links, original media, captions, subtle index hover. */
.projects-page .project-list {
  max-width: 800px;
  width: calc(100% - 64px);
  margin: 32px auto 60px;
  padding: 24px;
  background: #fff;
  display: flex;
  align-items: center;
  justify-content: center;
}
/* PROJECT INDEX — text links only; detail media rules below stay intact. */
.project-index { list-style: none; margin: 0; padding: 0; text-align: center; }
.project-index li { margin: 0; padding: 0; }
.project-index a { display: inline-block; padding: 8px 0; color: #111; font: 20px/1.4 Georgia, serif; text-decoration: none; transform-origin: center; transition: transform 160ms ease; }
.project-index a:hover, .project-index a:focus-visible { text-decoration: underline; text-underline-offset: 4px; }
.project-feed { margin: 36px auto 0; max-width: 960px; }
.project-feed:empty { display: none; }
.project-media { margin: 0 auto 40px; }
.project-slotted-media { display: block; margin: 0; min-width: 0; }
.project-media-caption { display: block; font: 12px/1.6 'Courier New', monospace; padding: 8px 0; }
.project-media img { display: block; width: auto; max-width: 100%; height: auto; margin: auto; object-fit: contain; }
.project-media video { display: block; width: 100%; max-height: 80svh; object-fit: contain; }
.project-media iframe { display: block; width: 100%; aspect-ratio: 16 / 9; border: 0; }
.project-media figcaption { margin-top: 10px; font: 12px/1.6 'Courier New', monospace; }
.project-note { max-width: 800px; margin: 28px auto; line-height: 1.7; }
[data-project-texts] p + p, [data-project-description] p + p { margin-top: 1em; }
[data-project-template] #project-message { font: 13px/1.6 'Courier New', monospace; }
@media (max-width: 700px) {
  .projects-page .project-list { width: calc(100% - 32px); padding: 18px; margin-top: 20px; }
  .project-index a { font-size: 18px; }
}
@media (prefers-reduced-motion: reduce) {
  .gallery img, .flipper { transition: none !important; }
}

@media (hover: hover) and (pointer: fine) {
  .project-index a:hover, .project-index a:focus-visible { transform: scale(1.05); }
}
@media (prefers-reduced-motion: reduce) {
  .project-index a { transition: none; }
  .project-index a:hover, .project-index a:focus-visible { transform: none; }
}

/* ANALYTIC FEELINGS — continuous PDF-inspired flow, no page-height panels.
   Text / media / sources: content/projects.js → analytic-feelings. */
.essay-project .project-page { background: #fff; max-width: 960px; }
.essay-project .project-header { display: block; border: 0; padding: 12px 0 44px; text-align: center; }
.essay-project .project-header h1 { font: 400 clamp(30px, 4vw, 42px)/1.2 Georgia, serif; }
.essay-project .project-header .project-meta { display: none; } /* Caption sits below the film. */
.essay-project .project-intro,
.essay-project .project-note { max-width: 800px; margin: 0 auto 42px; text-align: center; font: 20px/1.55 Georgia, serif; }
.essay-project .project-feed { margin-top: 0; }
.essay-project .project-media { margin-bottom: 42px; }
.essay-project .project-media:has(+ .project-media) { margin-bottom: 24px; }
.essay-project .project-media img { max-width: 100%; height: auto; } /* Keep intrinsic resolution. */
.essay-project .project-media figcaption { text-align: center; font: italic 17px/1.5 Georgia, serif; }
.essay-project .project-media-status { display: block; margin-top: 5px; color: #555; font: 12px/1.5 'Courier New', monospace; }
.essay-project .project-references { white-space: nowrap; font: 11px/1.4 'Courier New', monospace; vertical-align: super; }
.essay-project .project-references a + a { margin-left: 4px; }
.essay-project .project-sources { max-width: 800px; margin: 64px auto 0; padding-top: 22px; border-top: 1px solid #d4d4d4; }
.essay-project .project-sources h2 { font: 20px/1.4 Georgia, serif; margin-bottom: 18px; }
.essay-project .project-sources ol { padding-left: 24px; font: 13px/1.7 'Courier New', monospace; }
.essay-project .project-sources li { padding-left: 4px; margin-bottom: 12px; overflow-wrap: anywhere; scroll-margin-top: 20px; }
.essay-project .site-footer span { display: inline-block; background: #fff; color: #000; padding: 6px 10px; border: 1px solid #111; }
@media (max-width: 700px) {
  .essay-project .detail-main { width: calc(100% - 32px); }
  .essay-project .project-header { padding-bottom: 30px; }
  .essay-project .project-intro, .essay-project .project-note { font-size: 17px; line-height: 1.6; margin-bottom: 32px; }
  .essay-project .project-media { margin-bottom: 32px; }
  .essay-project .project-media figcaption { font-size: 15px; }
}
