/* Distinct structural illustrations, framed in full. Load after media-framing.css. */
[data-art="feedback"] { --art-paper:#eceae4; --art-ink:#33312e; --art-line:rgba(51,49,46,.18); }
[data-art="creator-data"] { --art-paper:#102d29; --art-ink:#e2eeec; --art-line:rgba(226,238,236,.18); }
[data-art="athena"] { --art-paper:#eaeae5; --art-ink:#263d47; --art-line:rgba(38,61,71,.18); }
[data-art="persona-studio"] { --art-paper:#f2e3d8; --art-ink:#482b27; --art-line:rgba(72,43,39,.2); }

/* Native image proportions produce one common height across all six desktop tiles. */
@media(min-width:761px) {
  .pg-home .project-index { grid-template-columns:1.6fr 1.6fr 1.77778fr 1.33333fr 1.6fr 1.6fr; }
}
.pg-home .index-item figure { aspect-ratio:8 / 5; }
.pg-home .index-item[href$="/gorda.html"] figure { aspect-ratio:16 / 9; }
.pg-home .index-item figure.work-card__media--team { aspect-ratio:4 / 3; }
@media(max-width:760px) {
  .pg-home .project-index { grid-template-columns:repeat(3,minmax(0,1fr)); align-items:start; }
}

.pg-home .work-card__media[data-art] {
  background:var(--art-paper);
  color:var(--art-ink);
}
.pg-home .index-item figure[data-art] > img,
.pg-home .project-item figure[data-art] > img,
.pg-home .project-preview figure[data-art] > img {
  object-fit:contain;
  object-position:center;
  filter:none;
  transform:none;
}
.pg-home .index-item:hover figure[data-art] > img,
.pg-home .index-item:focus-visible figure[data-art] > img {
  filter:none;
  transform:none;
}
.pg-home .work-card__media[data-art] figcaption {
  background:var(--art-paper);
  color:var(--art-ink);
  border-color:var(--art-line);
}

/* Detailed cases use each image's source proportions and a separate caption. */
.pub-case .pub-visual.project-art-detail,
.pg-persona .ps-flow.project-art-detail {
  padding:0;
  background:var(--art-paper);
  color:var(--art-ink);
  border:1px solid var(--art-line);
  border-radius:3px;
  overflow:hidden;
}
.project-art-detail[data-art] > img {
  display:block;
  width:100%;
  height:auto;
  max-height:none;
  aspect-ratio:auto;
  object-fit:contain;
}
.pub-case .pub-visual.project-art-detail figcaption,
.pg-persona .ps-flow.project-art-detail figcaption {
  margin:0;
  padding:clamp(16px,2.5vw,28px);
  border-top:1px solid var(--art-line);
  color:var(--art-ink);
  font-size:.8rem;
  line-height:1.65;
}
.project-art-note { max-width:70em; }
.project-art-steps {
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:20px;
  padding:22px 0 0;
  margin:20px 0 0;
  list-style:none;
  border-top:1px solid var(--art-line);
}
.project-art-steps li { min-width:0; }
.project-art-steps span { display:block; font:10px/1.5 var(--font-mono); letter-spacing:.08em; }
.project-art-steps strong { display:block; margin-top:6px; font-size:1rem; font-weight:600; }
.project-art-steps p { margin-top:6px; font-size:.8rem; line-height:1.65; }
@media(max-width:600px) {
  .project-art-steps { grid-template-columns:repeat(2,minmax(0,1fr)); gap:22px 18px; }
}