/* ============================================================
   CREATIVE SAGE · each artwork's own page (/art/<slug>) and the
   gallery's no-script link list. Printed after wp-glue.css by
   cs_print_late_styles() (handle cs-art-page, Task 12), only on
   single artworks and the Gallery page. Reuses main.css tokens
   and the lightbox classes (.avail-pill, .spec-list). Task 14.
   ============================================================ */
.art-page { padding-block: clamp(40px, 6vw, 80px) clamp(76px, 10vw, 140px); }
.art-page-grid {
  display: grid; grid-template-columns: minmax(0, 1.25fr) minmax(300px, 1fr);
  gap: clamp(32px, 5vw, 72px); align-items: start;
}
.art-page-grid--solo { grid-template-columns: minmax(0, 720px); }
.art-page-img {
  display: flex; align-items: center; justify-content: center;
  background: #1B140D; border-radius: 16px; overflow: hidden; box-shadow: var(--shadow-lg);
}
.art-page-img img { width: auto; max-width: 100%; height: auto; max-height: min(86vh, 900px); object-fit: contain; }
.art-page-info {
  display: flex; flex-direction: column; gap: 14px;
  position: sticky; top: calc(var(--wp-admin--admin-bar--height, 0px) + 104px);
}
.art-page-info .h1 { margin-top: 6px; }
.art-page-desc p { color: var(--ink-2); font-size: var(--fs-lead); line-height: 1.75; max-width: 60ch; }
.art-page-desc p + p { margin-top: 1em; }
.art-page-actions { display: flex; flex-direction: column; align-items: flex-start; gap: 10px; padding-top: 18px; }
.art-page-back { align-self: flex-start; margin-top: 10px; }
@media (max-width: 880px) {
  .art-page-grid { grid-template-columns: 1fr; }
  .art-page-info { position: static; }
  .art-page-img img { max-height: 70vh; }
}
.art-noscript-list { list-style: none; columns: 3 220px; column-gap: 28px; margin-top: 28px; }
.art-noscript-list li { break-inside: avoid; padding: 4px 0; }