.gallery-navigation { position: relative; max-width: 1440px; margin-inline: auto; }
.gallery-main { --u: min(1px, calc(100vw / 1440)); position: relative; width: min(100%, 1440px); height: calc(1024 * var(--u)); margin-inline: auto; background: #fff; }
.gallery-card { position: absolute; top: calc(85 * var(--u)); width: calc(453 * var(--u)); margin: 0; cursor: auto; }
.gallery-card--midis { left: calc(30 * var(--u)); }
.gallery-card--reader { left: calc(494 * var(--u)); }
.gallery-card--varicose, .gallery-card--lovers { left: calc(957 * var(--u)); }
.gallery-card--lovers { top: calc(629 * var(--u)); }
.gallery-card--digital-banner { left: calc(494 * var(--u)); top: calc(461 * var(--u)); }
.gallery-card--digital-banner .gallery-media { aspect-ratio: 1; position: relative; background: linear-gradient(to bottom, #f50, #f00); }
.gallery-card--digital-banner .gallery-media::before { content: ""; position: absolute; inset: 0 0 auto; height: 62.9139%; background: rgb(217 217 217 / 10%); }
.gallery-card--digital-banner figcaption { text-transform: uppercase; }
.gallery-card--digital-banner .portfolio-chip[data-chip="motion"] { --chip-width: 81; }
.gallery-card--digital-banner .portfolio-chip[data-chip="campaign"] { --chip-width: 99; }
.gallery-card.gallery-card--digital-banner .portfolio-tags { left: calc(3 * var(--u)); top: calc(27 * var(--u)); }
.gallery-card--digital-banner figcaption > span:first-child { position: relative; left: calc(1 * var(--u)); }
.gallery-card--digital-banner .gallery-year { width: calc(45 * var(--u)); }
.gallery-media { width: 100%; overflow: hidden; }
.gallery-card--midis .gallery-media { aspect-ratio: 453 / 600; }
.gallery-card--reader .gallery-media, .gallery-card--lovers .gallery-media { aspect-ratio: 453 / 285; }
.gallery-card--varicose .gallery-media { aspect-ratio: 1; }
.gallery-media video { display: block; width: 100%; height: 100%; object-fit: cover; object-position: center center; pointer-events: none; }
.gallery-media--banner video, .gallery-media--banner .gallery-banner-poster { position: absolute; width: 90.0662%; height: auto; aspect-ratio: 2 / 1; top: 50%; left: 50%; transform: translate(-50%, -50%); object-fit: contain; }
.gallery-media--banner video { opacity: 0; }
.gallery-media--banner.is-playing video { opacity: 1; }
@media (prefers-reduced-motion: reduce) { .gallery-media--banner.is-playing video { opacity: 0; } }
.gallery-card figcaption { position: relative; display: flex; align-items: flex-start; justify-content: space-between; gap: calc(8 * var(--u)); margin-top: calc(18 * var(--u)); font-size: calc(15 * var(--u)); line-height: calc(24 * var(--u)); font-weight: 400; letter-spacing: -.02em; text-box-trim: trim-both; text-box-edge: cap alphabetic; }
.gallery-card figcaption > span:first-child { min-width: 0; }
.gallery-card:not(.gallery-card--midis) figcaption { margin-top: calc(19 * var(--u)); }
.gallery-card--reader figcaption, .gallery-card--lovers figcaption { line-height: calc(16 * var(--u)); }
.gallery-year { flex-shrink: 0; width: calc(48 * var(--u)); color: rgb(0 0 0 / 50%); white-space: nowrap; }
.gallery-card--midis figcaption > span:first-child { position: relative; left: calc(-2 * var(--u)); }
.gallery-card .portfolio-tags { position: absolute; left: 0; top: calc(24 * var(--u)); }
.gallery-card--midis .portfolio-tags, .gallery-card--varicose .portfolio-tags { top: calc(27 * var(--u)); }
.gallery-mobile-break { display: none; }
.gallery-mobile-navigation { display: none; }
@media (max-width: 767px) {
  .gallery-navigation .site-header { display: none; }
  .gallery-mobile-navigation { display: block; position: absolute; top: 0; left: 0; width: 100%; overflow: visible; transform: none; }
  .gallery-mobile-navigation .menu-toggle { left: auto; right: 9px; }
  .gallery-mobile-navigation .mobile-menu { width: 100%; }
  .gallery-main { --u: calc(100vw / 390); height: calc(738 * var(--u)); }
  .gallery-card { width: calc(181.29879760742188 * var(--u)); }
  .gallery-card--midis { left: calc(11 * var(--u)); }
  .gallery-card--reader { left: calc(196.701171875 * var(--u)); }
  .gallery-card--varicose { top: calc(256 * var(--u)); left: calc(197 * var(--u)); width: calc(179.6565704345703 * var(--u)); }
  .gallery-card--lovers { top: calc(375 * var(--u)); left: calc(9.9295654296875 * var(--u)); width: calc(181.72703552246094 * var(--u)); }
  .gallery-card--digital-banner { top: calc(497 * var(--u)); left: calc(198 * var(--u)); width: calc(179 * var(--u)); }
  .gallery-card--digital-banner .portfolio-chip[data-chip="motion"] { --chip-width: 43.90666580200195; }
  .gallery-card--digital-banner .portfolio-chip[data-chip="campaign"] { --chip-width: 53.90666580200195; }
  .gallery-card--midis .gallery-media { height: calc(240.130859375 * var(--u)); }
  .gallery-card--reader .gallery-media { height: calc(114.0621566772461 * var(--u)); }
  .gallery-card--lovers .gallery-media { height: calc(114.3315658569336 * var(--u)); }
  .gallery-main .gallery-card figcaption { display: block; width: 100%; margin-top: calc(7.2041015625 * var(--u)); font-size: calc(8 * var(--u)); line-height: calc(9 * var(--u)); }
  .gallery-main .gallery-card figcaption > span:first-child { display: block; white-space: nowrap; }
  .gallery-main .gallery-card--midis figcaption > span:first-child { left: calc(.4002685546875 * var(--u)); }
  .gallery-main .gallery-card--reader figcaption { margin-top: calc(7.6043472290039 * var(--u)); }
  .gallery-main .gallery-card--varicose figcaption { margin-top: calc(7.5353240966797 * var(--u)); }
  .gallery-main .gallery-card--lovers figcaption { margin-top: calc(7.6225357055664 * var(--u)); }
  .gallery-main .gallery-card--digital-banner figcaption { margin-top: calc(12 * var(--u)); }
  .gallery-main .gallery-card--digital-banner figcaption > span:first-child { left: 0; }
  .gallery-main .gallery-year { position: absolute; top: 0; left: calc(155 * var(--u)); width: calc(26 * var(--u)); font-size: calc(8 * var(--u)); line-height: calc(6.418614387512207 * var(--u)); }
  .gallery-main .gallery-card--midis .gallery-year { left: calc(156 * var(--u)); }
  .gallery-main .gallery-card--reader .gallery-year { left: calc(155.298828125 * var(--u)); }
  .gallery-main .gallery-card--lovers .gallery-year { left: calc(156.0704345703125 * var(--u)); }
  .gallery-main .gallery-card--digital-banner .gallery-year { left: calc(156.07 * var(--u)); }
  .gallery-main .gallery-card .portfolio-tags { top: calc(22.80810546875 * var(--u)); }
  .gallery-main .gallery-card--midis .portfolio-tags { top: calc(13.6650390625 * var(--u)); left: calc(-1 * var(--u)); }
  .gallery-main .gallery-card--reader .portfolio-tags { top: calc(22.33349609375 * var(--u)); left: calc(.298828125 * var(--u)); }
  .gallery-main .gallery-card--lovers .portfolio-tags { top: calc(23.0458984375 * var(--u)); left: calc(.0704345703125 * var(--u)); }
  .gallery-main .gallery-card--digital-banner .portfolio-tags { top: calc(14.0458984375 * var(--u)); left: calc(.0704345703125 * var(--u)); }
  .gallery-mobile-break { display: inline; }
}
