/* Scoped to the complete project overview. No unrelated grids are changed. */
[data-project-wall] .work-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  column-gap: clamp(42px, 6vw, 82px);
  row-gap: 64px;
  padding-block: 10px;
}
[data-project-wall] .work-card,
[data-project-wall] .work-card:nth-child(even) { padding: 0; min-width: 0; }
[data-project-wall] .work-image {
  aspect-ratio: 2 / 1;
  border-radius: 12px;
  background: var(--surface);
}
[data-project-wall] .work-image img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transform: none;
  transition: none;
}
[data-project-wall] .work-info { padding: 22px 30px 8px; }
[data-project-wall] .work-info h3 { font-size: clamp(22px, 2.2vw, 32px); line-height: 1.12; }
[data-project-wall] .work-info p { margin-top: 9px; font-size: 14px; line-height: 1.45; }
[data-project-wall] .work-info > svg { top: 25px; width: 20px; height: 20px; }
[data-project-wall] .work-card:focus-visible { outline-offset: 8px; border-radius: 12px; }
[data-project-wall][data-project-state="ready"] .work-grid { display: block; padding: 0; }
[data-project-wall] .project-wall-row { position: relative; isolation: isolate; width: 100%; margin-block: 12px; }
[data-project-wall] .project-wall-dom { position: absolute; inset: 0; overflow: hidden; touch-action: pan-y; }
[data-project-wall] .project-plane {
  inset: auto;
  transform-origin: center;
  transform-style: flat;
  backface-visibility: hidden;
  -webkit-backface-visibility: hidden;
  contain: layout style;
}
[data-project-wall] .project-plane .work-image { box-shadow: 0 18px 32px -25px #0007; }
[data-project-wall] .work-info > svg { transition: color 160ms, transform 160ms var(--ease); }
[data-project-wall] .is-project-active .work-info > svg { color: var(--focus); transform: translate(2px, -2px); }
[data-project-wall] .project-plane:active .work-info > svg { transform: translate(3px, -3px); }
[data-project-wall] .work-footer { margin-top: 32px; }
@media (max-width: 760px) {
  [data-project-wall] .work-grid { grid-template-columns: 1fr; row-gap: 42px; }
  [data-project-wall] .work-info { padding-top: 18px; }
  [data-project-wall] .work-info h3 { font-size: 24px; }
  [data-project-wall] .work-info > svg { top: 21px; }
  [data-project-wall] .project-wall-row { margin-block: 8px; }
}
@media (prefers-reduced-motion: reduce) {
  [data-project-wall] .work-info > svg { transition: none; }
}