/* Shared case-study banner: four desktop fields, a clean 2-by-2 responsive grid. */
html body.project-viewport-page .project-facts { grid-template-columns: repeat(4, minmax(0, 1fr)); }
/* Supporting appointments keep a linked partner identity instead of a completion year. */
.project-facts :is(.project-partner-link, .pill-partner-link) { display: flex; gap: 12px; align-items: center; color: white; text-decoration: none; }
.project-facts :is(.project-partner-link, .pill-partner-link) :is(img, span) { transform-origin: left center; transition: transform .2s ease; }
.project-facts :is(.project-partner-link, .pill-partner-link):is(:hover, :focus-visible) :is(img, span) { transform: scale(1.04); }
.project-facts :is(.project-partner-link, .pill-partner-link) img { display: block; flex: none; width: 72px; height: 48px; object-fit: contain; background: transparent; filter: invert(1); mix-blend-mode: screen; }
.project-facts :is(.project-partner-link, .pill-partner-link):hover span { color: var(--hover-solid); }
@media (max-width: 1100px) {
  html body.project-viewport-page .project-facts { position: relative; grid-template-columns: repeat(2, minmax(0, 1fr)); --project-facts-gutter: 32px; }
  html body.project-viewport-page .project-facts::after { content: ''; position: absolute; top: 0; bottom: 0; left: 50%; width: 1px; background: rgba(255,255,255,.2); pointer-events: none; }
  html body.project-viewport-page .project-facts > div:nth-child(n) { position: relative; border: 0; border-bottom: 1px solid transparent; }
  html body.project-viewport-page .project-facts > div:nth-child(2n+3)::before { content: ''; position: absolute; top: 0; left: calc(-1 * var(--project-facts-gutter)); width: calc(200% + 2 * var(--project-facts-gutter)); height: 1px; background: rgba(255,255,255,.2); pointer-events: none; }
}
@media (max-width: 600px), (max-width: 1100px) and (max-height: 500px) and (orientation: landscape) {
  html body.project-viewport-page .project-facts { --project-facts-gutter: 24px; }
  .project-facts :is(.project-partner-link, .pill-partner-link) { gap: 8px; }
  .project-facts :is(.project-partner-link, .pill-partner-link) img { width: 60px; height: 40px; }
}
@media (max-width: 360px) {
  html body.project-viewport-page .project-facts { --project-facts-gutter: 16px; }
}
@media (prefers-reduced-motion: reduce) {
  .project-facts :is(.project-partner-link, .pill-partner-link) :is(img, span) { transition: none; }
}