/* Uniform gallery cards share one crop and equal gutters. */
.work-collection { position: relative; display: block; }
.work-collection .collection-deck { overflow: hidden; isolation: isolate; background: #0b0c0e; }
.collection-film { position: absolute; inset: 0 auto 0 0; width: 100%; display: block; transition: width .45s cubic-bezier(.2,.8,.2,1), left .45s cubic-bezier(.2,.8,.2,1); z-index: calc(3 - var(--film-index)); overflow: hidden; }
.collection-film img { width: 100%; height: 100%; object-fit: cover; }
.collection-film span { position: absolute; inset: 45% 0 auto; display: block; padding: 8px 2px; font-size: 10px; font-weight: 500; letter-spacing: .04em; color: white; text-align: center; text-transform: uppercase; text-decoration: none; background: #0b0c0e65; opacity: 0; transition: opacity .25s; white-space: nowrap; }
.work-collection[data-expanded="true"] .collection-film span { opacity: 1; }
.work-collection[data-expanded="true"] .collection-film { left: calc(var(--film-index) * 100% / 3); width: calc(100% / 3); border-right: 1px solid #ffffff30; }
.work-collection[data-expanded="true"] .collection-film:hover, .work-collection .collection-film:focus-visible { z-index: 5; outline: 2px solid var(--accent, #1355ff); }
.collection-toggle { position: absolute; top: 6px; right: 6px; z-index: 10; min-height: 44px; display: flex; align-items: center; gap: 10px; padding: 6px 10px; font-size: 9px; letter-spacing: .1em; background: #0b0c0e60; color: white; border: 1px solid #ffffff25; border-radius: 2px; backdrop-filter: blur(12px); }
.collection-plus { font-size: 16px; line-height: 1; }
.work-collection[data-expanded="true"] .collection-count { display: none; }
.work-collection[data-expanded="true"] .collection-toggle { width: 44px; justify-content: center; }
.work-collection[data-expanded="true"] .collection-plus { transform: rotate(45deg); }
.work-collection .work-badge { min-height: 16px; }
.work-collection .work-badge img { height: 16px; }
@media (max-width: 400px) {
  .work-mosaic .work-collection[data-expanded="true"] .work-media { aspect-ratio: 16 / 12; }
  .collection-film span { font-size: 9px; letter-spacing: 0; padding-inline: 0; }
}
@media (prefers-reduced-motion: reduce) { .collection-film { transition: none; } }
.work-mosaic {
  grid-template-columns: repeat(3, minmax(0, 1fr));
  grid-auto-rows: auto;
  gap: 8px;
  align-items: stretch;
}
@media (min-width: 641px) and (max-width: 900px) {
  .work-mosaic { grid-template-columns: repeat(2, minmax(0, 1fr)); grid-auto-rows: auto; }
}
@media (max-width: 640px), (horizontal-viewport-segments: 2) {
  .work-mosaic { grid-template-columns: minmax(0, 1fr); grid-auto-rows: auto; }
  .work-mosaic .work-media { height: auto; aspect-ratio: 16 / 10; }
  .work-mosaic .work-meta { padding: 16px; }
}
@media (max-width: 640px) {
  .work-mosaic > .work-card { content-visibility: auto; contain-intrinsic-block-size: auto calc((100vw - 2 * var(--gutter)) * .625); }
  .work-mosaic > .work-collection[data-expanded="true"] { content-visibility: visible; }
}