/* Shared by the homepage and comparison B. Desktop layout: 164px + border. */
.static-logo-section {
  padding: 28px 0;
  background: #fff;
  border-bottom: 1px solid var(--line);
}
.static-logo-row {
  display: flex;
  justify-content: center;
  align-items: center;
  /* Equal gaps between the measured artwork, rather than equal-width cells. */
  gap: 60px;
  width: min(1160px, calc(100% - 80px));
  margin: 0 auto;
  padding: 0;
  list-style: none;
}
.static-logo-row li {
  display: flex;
  flex: 0 0 auto;
  align-items: center;
  justify-content: center;
  min-width: 0;
  height: 48px;
}
.static-secondary-row {
  margin-top: 20px;
}
.static-secondary-row li { height: 40px; }

/*
 * Center and size the visible artwork, excluding the file's white/clear margins.
 * Bounds are in source-image pixels; --logo-width is an optical adjustment.
 * Original artwork, aspect ratios, colors, and taglines stay intact.
 * No clipping: even antialiased pixels outside the measured bounds are retained.
 */
.logo-art {
  position: relative;
  display: block;
  flex: none;
  width: var(--logo-width);
  height: calc(var(--logo-width) * var(--art-h) / var(--art-w));
}
.logo-art img {
  position: absolute;
  width: calc(100% * var(--canvas-w) / var(--art-w));
  max-width: none;
  height: auto;
  left: calc(-100% * var(--art-x) / var(--art-w));
  top: calc(-100% * var(--art-y) / var(--art-h));
}
.logo-art--eizo { --logo-width: 110px; --canvas-w: 1200; --art-x: 27; --art-y: 2; --art-w: 1146; --art-h: 450; }
.logo-art--suzuki { --logo-width: 136px; --canvas-w: 940; --art-x: 17; --art-y: 11; --art-w: 907; --art-h: 174; }
.logo-art--epson { --logo-width: 114px; --canvas-w: 568; --art-x: 0; --art-y: 0; --art-w: 567; --art-h: 138; }
.logo-art--denso { --logo-width: 120px; --canvas-w: 836.4; --art-x: 31; --art-y: 22; --art-w: 774; --art-h: 293; }
.logo-art--kawasaki { --logo-width: 152px; --canvas-w: 400; --art-x: 0; --art-y: 10; --art-w: 400; --art-h: 86; }
.logo-art--mikuni { --logo-width: 104px; --canvas-w: 400; --art-x: 0; --art-y: 0; --art-w: 400; --art-h: 133; }
.logo-art--shinmei { --logo-width: 156px; --canvas-w: 400; --art-x: 3; --art-y: 8; --art-w: 394; --art-h: 88; }
.logo-art--snm { --logo-width: 212px; --canvas-w: 665; --art-x: 0; --art-y: 0; --art-w: 664; --art-h: 76; }
.logo-art--iko { --logo-width: 184px; --canvas-w: 461; --art-x: 2; --art-y: 24; --art-w: 457; --art-h: 43; }
.logo-art--kito { --logo-width: 114px; --canvas-w: 221; --art-x: 1; --art-y: 17; --art-w: 220; --art-h: 42; }
.logo-art--tamron { --logo-width: 134px; --canvas-w: 400; --art-x: 24; --art-y: 8; --art-w: 352; --art-h: 56; }
.logo-art--kawamura { --logo-width: 88px; --canvas-w: 913; --art-x: 5; --art-y: 7; --art-w: 907; --art-h: 387; }

/* Align current logo arrangements with the 1120px concept layout. */
.static-logo-section--twelve .static-logo-row,
.static-logo-section--eleven .static-logo-row {
  width: min(1120px, calc(100% - 80px));
  justify-content: space-between;
  gap: 0;
}

/* Center the five-logo lower row with the same artwork gaps as the six above. */
.static-logo-section--eleven .static-secondary-row {
  justify-content: center;
  column-gap: max(24px, calc((100% - 736px) / 5));
}