/* Field-authored artist pages.
   Every value here was measured off the live migrated canvases (2026-08-28)
   so a converted page lays out identically: the Bricks per-element CSS the
   canvas emitted, restated as classes.
     container row-gap 50px | rows flex-row, column-gap 40px
     columns 33.33% / 66.66%, row-gap 25px | 200px spacer above the name
     gallery grid, --columns:4 --gutter:30px, images square-cropped by Bricks
     hero at natural size (max-width 100%), never upscaled
   The .brxe-* classes on the markup are load-bearing: they pick up Bricks'
   own gallery/lightbox CSS and the child theme's .brxe-text rhythm. */

/* Like a canvas, this section sits inside the template's container, so without
   this the page gutter is applied twice — 279px of content on a 375px phone
   instead of 327px. Same fix as assets/canvas-mobile.css makes for canvases. */
.sartp.brxe-section > .brxe-container { max-width: 100%; }

.sartp .sartp-inner { display: flex; flex-direction: column; row-gap: 50px; }
.sartp-row { display: flex; flex-direction: row; column-gap: 40px; }
.sartp-col-a { display: flex; flex-direction: column; width: 33.33%; row-gap: 25px; }
.sartp-col-b { display: flex; flex-direction: column; width: 66.66%; row-gap: 25px; }
.sartp-spacer { height: 200px; }
.sartp-title-upper h1 { text-transform: uppercase; }
.sartp-hero { max-width: 100%; height: auto; }

/* Statement blocks: the canvas kept each legacy text block in its own element,
   25px apart. The converter preserves that grouping with .sartp-text. */
.sartp-statement > .sartp-text { margin-bottom: 0; }
.sartp-statement > .sartp-text + .sartp-text { margin-top: 25px; }

/* Exhibitions list — appended to every artist page, canvas or fields. */
.sartp-shows { margin-top: 60px; border-top: 1px solid #E4E4E4; padding-top: 28px; }
.sartp-shows-head { margin: 0 0 16px; font-size: 14px; line-height: 20px; font-weight: 400; letter-spacing: 1.5px; text-transform: uppercase; color: #676767; }
.sartp-shows-list { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px 40px; }
.sartp-show { display: flex; flex-wrap: wrap; align-items: baseline; gap: 4px 12px; }
.sartp-show a { font-size: 15px; line-height: 22px; color: #444; }
.sartp-show a:hover { color: #27CCC0; }
.sartp-show-dates { font-size: 13px; line-height: 20px; color: #909090; }

@media (max-width: 767px) {
  .sartp .sartp-inner { row-gap: 32px; }
  .sartp-row { flex-direction: column; row-gap: 24px; }
  .sartp-col-a, .sartp-col-b { width: 100%; }
  .sartp-spacer { display: none; }
  .sartp-gallery { --columns: 2 !important; --gutter: 12px !important; }
  .sartp-shows { margin-top: 40px; }
  .sartp-shows-list { grid-template-columns: 1fr; }
}