/* All Artists — fluid wall (design/artists-page Option A). Grayscale, Questrial, no radius. */
body.post-type-archive-artist #brx-content > .brxe-section > .brxe-container { width: 100%; max-width: 100%; }
.sart { --sg: clamp(24px, 4vw, 80px); }

.sart-head { margin: 0 var(--sg); padding: 36px 0 20px; display: flex; align-items: flex-end; justify-content: space-between; gap: 24px; flex-wrap: wrap; }
.sart-title { display: flex; align-items: baseline; gap: 18px; }
.sart-title h1 { margin: 0; font-size: 54px; line-height: 62px; font-weight: 400; color: #444; }
.sart-count { font-size: 12px; line-height: 17px; letter-spacing: 2px; text-transform: uppercase; color: #A3A3A3; }

.sart[data-view="list"] .sart-wall, .sart[data-view="grid"] .sart-list { display: none; }

/* view switch */
.sart-view { display: flex; align-items: center; gap: 2px; flex: 0 0 auto; }
.sart-view-btn { display: flex; align-items: center; gap: 8px; height: 40px; padding: 0 14px; background: none; border: 1px solid rgba(0,0,0,0.13);
  font-family: inherit; font-size: 12px; letter-spacing: 2px; text-transform: uppercase; color: #A3A3A3; cursor: pointer; }
.sart-view-btn + .sart-view-btn { border-left: 0; }
.sart-view-btn:hover { color: #555; }
.sart-view-btn[aria-pressed="true"] { color: #0A0A0A; border-color: rgba(0,0,0,0.45); }
.sart-view-btn[aria-pressed="true"] + .sart-view-btn { border-left: 0; }

/* names list */
.sart-list { margin: 8px var(--sg) 64px; columns: 4; column-gap: 48px; }
.sart-lname { display: block; padding: 9px 0; font-size: 17px; line-height: 24px; color: #444; text-decoration: none;
  border-bottom: 1px solid rgba(0,0,0,0.08); break-inside: avoid; }
.sart-lname:hover { color: #0A0A0A; }
@media (min-width: 1600px) { .sart-list { columns: 5; } }
@media (max-width: 1099px) { .sart-list { columns: 3; column-gap: 32px; } }
@media (max-width: 767px) {
  .sart-list { margin: 4px 16px 32px; columns: 1; }
  .sart-lname { padding: 0; min-height: 52px; display: flex; align-items: center; font-size: 16px; }
  .sart-view-btn span { display: none; }
  .sart-view-btn { width: 44px; height: 44px; padding: 0; justify-content: center; }
}

.sart-strip { display: flex; }
.sart-strip a, .sart-strip span { font-size: 12px; letter-spacing: 1px; display: flex; align-items: center; justify-content: center; text-decoration: none; color: #444; }
.sart-strip span { color: #CCC; }
.sart-strip a:hover { color: #0A0A0A; text-decoration: underline; text-underline-offset: 4px; }
.sart-strip-desktop { gap: 4px; }
.sart-strip-desktop a, .sart-strip-desktop span { width: 26px; height: 26px; }
.sart-strip-mobile { display: none; overflow-x: auto; padding: 4px 12px; border-bottom: 1px solid rgba(0,0,0,0.13); -webkit-overflow-scrolling: touch; }
.sart-strip-mobile a, .sart-strip-mobile span { min-width: 44px; min-height: 44px; flex: 0 0 auto; }

.sart-wall { margin: 8px var(--sg) 64px; display: grid; grid-template-columns: repeat(auto-fill, minmax(200px, 1fr)); gap: 2px; }
.sart-tile { position: relative; display: block; overflow: hidden; background: #F1F1F1; text-decoration: none; }
.sart-media { display: block; aspect-ratio: 1 / 1; }
.sart-img { width: 100%; height: 100%; object-fit: cover; display: block; transition: opacity .2s ease; }
.sart-tile:hover .sart-img { opacity: .85; }
.sart-name { position: absolute; left: 0; right: 0; bottom: 0; background: #fff; padding: 10px 12px; font-size: 14px; line-height: 20px; font-weight: 400; color: #444; transform: translateY(100%); transition: transform .2s ease; }
.sart-tile:hover .sart-name, .sart-tile:focus-visible .sart-name { transform: translateY(0); }
/* Tiles without a photo: name always visible on the gray square */
.sart-tile:not(:has(.sart-img)) .sart-name { transform: none; background: transparent; top: 0; display: flex; align-items: flex-end; }

@media (min-width: 1600px) { .sart-wall { grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); } }

/* Touch / no-hover: names under the tiles, always visible */
@media (hover: none), (max-width: 767px) {
  .sart-tile { background: transparent; overflow: visible; }
  .sart-media { background: #F1F1F1; }
  .sart-name { position: static; transform: none; padding: 6px 0 0; font-size: 12px; line-height: 16px; background: transparent; }
  .sart-tile:not(:has(.sart-img)) .sart-name { display: block; }
  .sart-wall { gap: 16px 12px; }
}
@media (max-width: 767px) {
  .sart-strip-mobile { display: flex; }
  .sart-strip-desktop { display: none; }
  .sart-head { margin: 0 16px; padding: 20px 0 8px; }
  .sart-title h1 { font-size: 29px; line-height: 36px; }
  .sart-wall { margin: 8px 16px 24px; grid-template-columns: repeat(3, minmax(0, 1fr)); }
}

/* ---- Exhibitions archive shares the wall ---- */
body.post-type-archive-exhibition #brx-content > .brxe-section > .brxe-container { width: 100%; max-width: 100%; }
.sart-dates { display: block; font-size: 12px; line-height: 17px; color: #676767; margin-top: 2px; }
.sart-years a { width: auto; padding: 0 6px; }
.sart-strip-mobile.sart-years a { padding: 0 10px; }
.sart-section-label { margin: 0 var(--sg); padding: 8px 0 14px; font-size: 12px; line-height: 17px; letter-spacing: 2px; text-transform: uppercase; color: #A3A3A3; }
.sart-wall-now { margin-bottom: 40px; }
@media (max-width: 767px) { .sart-section-label { margin: 0 16px; } }


/* ---- Year / letter headings: the landmark a jump from the strip arrives at ---- */
.sart-year { margin: 40px var(--sg) 16px; padding-bottom: 12px; border-bottom: 1px solid rgba(0,0,0,0.13); display: flex; align-items: baseline; gap: 14px; font-size: 34px; line-height: 42px; font-weight: 400; color: #444; scroll-margin-top: 110px; }
.sart-year:first-of-type { margin-top: 8px; }
.sart-year-back { align-self: center; width: 44px; height: 44px; margin-left: -12px; display: flex; align-items: center; justify-content: center; color: #A3A3A3; text-decoration: none; flex: 0 0 auto; }
.sart-year-back:hover { color: #0A0A0A; }
.sart-year-count { font-size: 12px; line-height: 17px; letter-spacing: 2px; text-transform: uppercase; color: #A3A3A3; }
.sart-wall + .sart-year { margin-top: 48px; }
@media (max-width: 767px) {
  .sart-year { margin: 28px 16px 12px; font-size: 24px; line-height: 30px; scroll-margin-top: 78px; }
  .sart-year-back { width: 40px; height: 44px; margin-left: -10px; }
}