/* =====================================================
   ACC PROJECT PREVIEW
   Sticky info + curated image preview, closing on an
   "+ Explore" overlay into a dedicated project gallery.
   Extracted verbatim from Spaces (the original home of this
   pattern) so Places can share it without duplicating the
   rules or inventing a new visual language. Spaces' markup
   and rendered output are unchanged by this extraction.
===================================================== */

.project{
  display:grid;
  grid-template-columns:minmax(200px,33%) 1fr;
  gap:clamp(24px,4vw,56px);
  margin:0 var(--margin) clamp(100px,12vw,180px);
}
.project__info{ position:sticky; top:clamp(28px,4vw,64px); align-self:start; }
.project__info h3{ margin:0 0 8px; }
.project__info .category{ margin:0 0 20px; }

.project__media{ display:flex; flex-direction:column; gap:clamp(14px,1.8vw,24px); }
.media__hero{ aspect-ratio:2/1; }
.media__row{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:clamp(14px,1.8vw,24px);
  align-items:stretch;
}
.media__stack{ display:flex; flex-direction:column; gap:clamp(14px,1.8vw,24px); }
.media__stack .media{ aspect-ratio:2/1; }

.final-image .media__overlay{
  position:absolute; inset:0;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  background:rgba(var(--acc-ink-rgb),.13);
  transition:background-color var(--transition-slow) var(--ease);
}
.final-image:hover .media__overlay{ background:rgba(var(--acc-ink-rgb),.28); }
.final-image .media__overlay .label{
  font-family:var(--font-accent);
  font-size:10.5px;
  letter-spacing:.1em;
  text-transform:uppercase;
  color:var(--acc-bg);
  opacity:.92;
}

@media (max-width:860px){
  .project{ display:block; }
  .project__info{ position:static; margin-bottom:clamp(20px,3vw,32px); }
}