.collaborations {
  padding: 64px 0;
  background: #f5eef3;
  color: #655367;
  scroll-margin-top: var(--site-header-height);
}
.collaborations-heading {
  position: relative;
  width: 90%;
  max-width: 1180px;
  margin: 0 auto 38px;
}
.collaboration-filters { position: absolute; overflow: hidden; pointer-events: none; }
.collaborations-heading p {
  margin: 0 0 14px;
  font: 400 10px/1.5 'Syne', Arial, sans-serif;
  text-transform: uppercase;
  letter-spacing: 0;
  color: #8c7088;
}
.collaborations-heading h2 {
  margin: 0;
  font: 300 48px/1.12 'Cormorant Garamond', Georgia, serif;
  letter-spacing: 0;
  overflow-wrap: anywhere;
}
.collaborations-strip {
  overflow: hidden;
  border-block: 1px solid rgba(119, 91, 114, .12);
  background: rgba(255, 255, 255, .45);
}
.collaborations-list {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  width: 90%;
  max-width: 1180px;
  padding: 0;
  margin: 0 auto;
  list-style: none;
}
.collaborations-list li { min-width: 0; border-inline-start: 1px solid rgba(119, 91, 114, .12); }
.collaborations-list li:last-child { border-inline-end: 1px solid rgba(119, 91, 114, .12); }
.collaborations.is-moving { --collaboration-cell: clamp(230px, 28vw, 360px); }
.is-moving .collaborations-list {
  display: flex;
  width: max-content;
  max-width: none;
  margin: 0;
  direction: ltr;
  animation: collaborations-travel 32s linear infinite;
}
.is-moving .collaborations-list li { flex: 0 0 var(--collaboration-cell); width: var(--collaboration-cell); box-sizing: border-box; }
.is-moving .collaborations-list li:last-child { border-inline-end: 0; }
.is-moving .collaborations-strip:hover .collaborations-list { animation-play-state: paused; }
/* Keep all original links visible and stationary during keyboard navigation. */
.is-moving .collaborations-strip:focus-within .collaborations-list { animation: none; width: 100%; }
.is-moving .collaborations-strip:focus-within li { flex: 1 1 0; width: auto; }
.is-moving .collaborations-strip:focus-within [data-collaboration-copy] { display: none; }
@keyframes collaborations-travel {
  to { transform: translateX(calc(var(--collaboration-cell) * -3)); }
}
.collaborations-list a {
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 146px;
  height: 100%;
  padding: 16px 24px;
  color: #817782;
  text-align: center;
  text-decoration: none;
  overflow-wrap: anywhere;
  letter-spacing: 0;
  transition: color .2s ease, background-color .2s ease;
}
.collaborator-awebo { font: 600 24px/1.2 'Syne', Arial, sans-serif; }
.collaborator-antonio { font: 400 28px/1.1 'Cormorant Garamond', Georgia, serif; }
.collaborator-james { font: 400 20px/1.2 'IBM Plex Sans Condensed', Arial, sans-serif; text-transform: uppercase; }
.collaborator-logo {
  display: block;
  width: 136px;
  max-width: 100%;
  height: 110px;
  object-fit: contain;
}
.collaborator-awebo .collaborator-logo { filter: url('#collaborator-dark-ink'); }
.collaborator-james .collaborator-logo { filter: url('#collaborator-light-ink'); }
.collaborations-list a:hover { color: #59415f; background: rgba(255, 255, 255, .45); }
.collaborations-list a:focus-visible { outline: 2px solid #876881; outline-offset: -5px; }
@media (max-width: 700px) {
  .collaborations { padding: 42px 0; }
  .collaborations.is-moving { --collaboration-cell: 180px; }
  .collaborations-heading { margin-bottom: 26px; }
  .collaborations-heading h2 { font-size: 36px; }
  .collaborations-list a { min-height: 122px; padding: 16px 10px; }
  .collaborator-logo { width: 95px; height: 90px; }
  .collaborator-awebo { font-size: 18px; }
  .collaborator-antonio { font-size: 21px; }
  .collaborator-james { font-size: 16px; }
}
@media (prefers-reduced-motion: reduce) {
  .is-moving .collaborations-list { animation: none; width: 100%; }
  .is-moving .collaborations-list li { flex: 1 1 0; width: auto; }
  .is-moving [data-collaboration-copy] { display: none; }
  .collaborations-list a { transition: none; }
}