/* Phase 3: uploaded prototype artwork index adapted to live PHP data. */
.ux-proto-work-hero{padding:64px 0 44px}
.ux-proto-work-hero h1{margin:0;font-family:var(--g-font-display);font-size:var(--g-fs-page-title);font-weight:600;letter-spacing:.01em;line-height:1.08}
.ux-proto-work-hero .lede{max-width:650px;margin:22px 0 0;color:var(--g-text-soft);font-size:1.02rem;line-height:1.7}
.ux-proto-works-section{padding:12px 0 72px}

.featured-work{display:grid;grid-template-columns:1.3fr 1fr;background:var(--g-surface-soft);border:1px solid var(--g-line);border-radius:2px;overflow:hidden;margin-bottom:44px;color:inherit;text-decoration:none}
.featured-work .fw-media{height:100%;min-height:320px;background:#eee8dd;overflow:hidden}
.featured-work .fw-media img{width:100%;height:100%;display:block;object-fit:cover;transition:transform .35s ease}
.featured-work:hover .fw-media img,.featured-work:focus-visible .fw-media img{transform:scale(1.018)}
.featured-work .fw-copy{padding:40px;display:flex;flex-direction:column;justify-content:center;align-items:flex-start}
.featured-work .eyebrow{font-size:.72rem;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--g-gold)}
.featured-work .fw-copy h3{font-family:var(--g-font-display);font-size:1.9rem;line-height:1.18;margin:12px 0 8px}
.featured-work .fw-artist{margin:0 0 14px;font-weight:600;font-size:.95rem}
.fw-meta{display:flex;gap:14px;font-size:.85rem;color:var(--g-muted);margin-bottom:22px;flex-wrap:wrap}
.fw-meta span:not(:last-child)::after{content:"|";margin-left:14px;color:var(--g-line-strong)}

.filters-row{display:flex;gap:14px;flex-wrap:wrap;margin-bottom:26px;align-items:stretch}
.filter-pill{position:relative;display:flex;align-items:center;border:1px solid var(--g-line-strong);border-radius:2px;background:transparent;color:var(--g-text-soft);font-size:.85rem;flex:1;min-width:150px}
.filter-pill summary{list-style:none;display:flex;align-items:center;gap:10px;width:100%;min-height:48px;padding:0 16px;cursor:pointer;user-select:none}
.filter-pill summary::-webkit-details-marker{display:none}
.filter-pill svg{width:15px;height:15px;flex:0 0 auto;color:var(--g-gold)}
.filter-pill .chev{margin-left:auto;color:var(--g-muted);font-size:.9rem}
.filter-pill[open],.filter-pill.active{border-color:var(--g-gold);background:var(--g-surface)}
.filter-menu{position:absolute;z-index:30;left:-1px;right:-1px;top:calc(100% + 6px);max-height:320px;overflow:auto;background:var(--g-surface);border:1px solid var(--g-line-strong);box-shadow:var(--g-shadow-soft);padding:6px}
.filter-menu a{display:block;padding:9px 10px;color:var(--g-text-soft);text-decoration:none;border-radius:2px;line-height:1.35}
.filter-menu a:hover,.filter-menu a:focus-visible,.filter-menu a.active{background:var(--g-surface-soft);color:var(--g-gold-deep)}
.filter-link{gap:10px;min-height:48px;padding:0 16px;text-decoration:none}
.filter-pill.search{display:flex;align-items:center;gap:8px;flex:1.4;padding:0 14px;min-width:220px}
.filter-pill.search input{border:0;outline:0;background:transparent;width:100%;min-height:46px;color:var(--g-text);font:inherit}
.filter-pill.search button{width:28px;height:28px;padding:0;border:0;background:transparent;display:grid;place-items:center;cursor:pointer;color:var(--g-gold)}

.ux-work-results{display:flex;justify-content:space-between;gap:18px;align-items:center;padding:0 0 20px;color:var(--g-muted);font-size:.78rem}
.ux-work-clear{color:var(--g-gold-deep);text-decoration:none;font-weight:700}
.work-grid{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:28px 20px}
.work-card{display:block;color:inherit;text-decoration:none;min-width:0}
.work-card .thumb{aspect-ratio:1/1;border-radius:2px;overflow:hidden;margin-bottom:14px;background:var(--g-surface-soft)}
.work-card .thumb img{width:100%;height:100%;display:block;object-fit:cover;transition:transform .3s ease}
.work-card:hover .thumb img,.work-card:focus-visible .thumb img{transform:scale(1.05)}
.work-card .artist{font-size:.88rem;font-weight:700;line-height:1.3}
.work-card .title{font-size:.85rem;color:var(--g-text-soft);margin-top:2px;line-height:1.35}
.work-card .meta{font-size:.78rem;color:var(--g-muted);margin-top:2px;line-height:1.4}
.load-more-wrap{display:flex;justify-content:center;margin-top:40px}
.btn.btn-outline{display:inline-flex;align-items:center;gap:10px;min-height:46px;padding:0 22px;border:1px solid var(--g-line-strong);border-radius:2px;color:var(--g-text);background:transparent;text-decoration:none;font-size:.76rem;font-weight:700;letter-spacing:.07em;text-transform:uppercase}
.btn.btn-outline svg{width:15px;height:15px}
.btn.btn-outline:hover,.btn.btn-outline:focus-visible{border-color:var(--g-gold);color:var(--g-gold-deep);background:var(--g-surface)}

/* Artwork detail remains dynamic and preserves the public sale contract. */
.ux-work-back{padding-top:30px}
.ux-work-detail{display:grid;grid-template-columns:minmax(0,1.45fr) minmax(300px,.55fr);gap:58px;padding:24px 0 64px}
.ux-work-hero{position:relative;min-height:560px;display:grid;place-items:center;background:#efeae1;border:1px solid var(--g-line)}
.ux-work-hero>a{display:grid;place-items:center;width:100%;height:100%;padding:28px}
.ux-work-hero img{display:block;max-width:100%;max-height:78vh;width:auto;height:auto}
.ux-work-view-hint{position:absolute;right:14px;bottom:14px;padding:7px 9px;background:rgba(255,253,250,.9);border:1px solid var(--g-line);color:var(--g-text-soft);font-size:.69rem;font-weight:700;letter-spacing:.04em;text-transform:uppercase}
.ux-work-info{align-self:start;position:sticky;top:108px}
.ux-work-artist{display:inline-flex;color:var(--g-text-soft);font-size:1rem;text-decoration:none}
.ux-work-info h1{margin:10px 0 10px;font-family:var(--g-font-display);font-size:clamp(2.7rem,4.5vw,5rem);font-weight:400;line-height:.93;letter-spacing:-.05em}
.ux-work-year{color:var(--g-muted);font-size:.85rem}
.ux-work-sale{margin-top:24px}
.ux-work-sale .g-button{width:100%;margin-top:12px}
.ux-work-price{font-family:var(--g-font-display);font-size:1.75rem}
.ux-work-state{font-size:.95rem;font-weight:750;text-transform:uppercase;letter-spacing:.025em}
.ux-work-copy{max-width:820px;padding:44px 0 64px}
.ux-work-copy .g-prose{font-size:1.03rem}
.ux-work-gallery{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px}
.ux-work-gallery figure{margin:0;background:#f0ece5;border:1px solid var(--g-line)}
.ux-work-gallery img{width:100%;display:block}
.ux-work-gallery figcaption{padding:9px 11px;color:var(--g-muted);font-size:.75rem}
.ux-work-exhibitions .g-list-row{grid-template-columns:160px minmax(0,1fr) auto;min-height:auto;padding:18px 0}
.ux-work-related .g-artwork-grid{grid-template-columns:repeat(4,minmax(0,1fr))}
.ux-work-links{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
.ux-work-link{display:flex;justify-content:space-between;gap:18px;padding:14px;border:1px solid var(--g-line);background:var(--g-surface);color:var(--g-text);text-decoration:none;font-size:.8rem}
.ux-work-link small{color:var(--g-muted);text-transform:uppercase;letter-spacing:.06em}
.ux-art-view{position:fixed;inset:0;z-index:1000;display:none;background:rgba(19,17,13,.96);padding:28px}
.ux-art-view:target{display:grid;grid-template-rows:auto 1fr}
.ux-art-view-close{justify-self:end;display:inline-flex;align-items:center;justify-content:center;width:44px;height:44px;border:1px solid rgba(255,255,255,.3);border-radius:50%;color:#fff;text-decoration:none;font-size:1.4rem}
.ux-art-view-stage{min-height:0;display:grid;place-items:center;padding:16px}
.ux-art-view-stage img{max-width:96vw;max-height:88vh;width:auto;height:auto;display:block}
.ux-art-view-caption{position:absolute;left:28px;bottom:20px;color:rgba(255,255,255,.76);font-size:.78rem}

@media(max-width:1100px){
  .work-grid{grid-template-columns:repeat(3,minmax(0,1fr))}
  .ux-work-detail{gap:38px}
  .ux-work-related .g-artwork-grid{grid-template-columns:repeat(3,minmax(0,1fr))}
}
@media(max-width:900px){
  .featured-work{grid-template-columns:1fr}
  .featured-work .fw-media{min-height:360px}
  .filters-row{display:grid;grid-template-columns:repeat(2,minmax(0,1fr))}
  .filter-pill{min-width:0}
  .filter-pill.search{min-width:0}
}
@media(max-width:820px){
  .ux-work-detail{grid-template-columns:1fr}
  .ux-work-info{position:static}
  .ux-work-hero{min-height:420px}
  .ux-work-related .g-artwork-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media(max-width:640px){
  .ux-proto-work-hero{padding:44px 0 32px}
  .ux-proto-work-hero h1{font-size:var(--g-fs-page-title)}
  .featured-work .fw-media{min-height:280px}
  .featured-work .fw-copy{padding:28px 24px}
  .filters-row{grid-template-columns:1fr}
  .work-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:24px 12px}
  .ux-work-hero{min-height:320px}
  .ux-work-hero>a{padding:14px}
  .ux-work-hero img{width:100%;height:auto;max-height:none}
  .ux-work-copy{padding-top:34px}
  .ux-work-gallery{grid-template-columns:1fr}
  .ux-work-exhibitions .g-list-row{grid-template-columns:1fr;gap:5px}
  .ux-work-related .g-artwork-grid{gap:20px 12px}
  .ux-work-links{grid-template-columns:1fr}
  .ux-art-view{padding:14px}
  .ux-art-view-caption{left:14px;bottom:12px}
}


/* artwork 4x5 contain presentation v2 */
.work-card .thumb{
  aspect-ratio:4/5;
  display:grid;
  place-items:center;
  padding:clamp(6px,.75vw,10px);
  box-sizing:border-box;
  background:#f1ede5;
}
.work-card .thumb img{
  width:100%;height:100%;display:block;object-fit:contain;box-sizing:border-box;background:transparent;
}
.work-card:hover .thumb img,.work-card:focus-visible .thumb img{transform:scale(1.015)}
