/* A stationary project index keeps every brand visible and clickable. */
.brand-strip { padding: 48px 24px 28px; border-bottom: 1px solid var(--line); background: var(--paper); }
.brand-strip-heading { max-width: 1480px; margin: 0 auto 32px; }
.brand-strip-heading h2 { max-width: 850px; margin: 0; font-size: clamp(24px, 3vw, 42px); font-weight: 500; line-height: 1.18; letter-spacing: -.035em; text-wrap: balance; }
.brand-strip-set { max-width: 1480px; display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); list-style: none; padding: 0; margin: auto; }
.brand-strip-set li { min-width: 0; }
.brand-strip-set a { position: relative; min-height: 136px; display: flex; flex-direction: column; justify-content: center; align-items: center; padding: 24px 16px; color: var(--ink); text-decoration: none; border-top: 1px solid var(--line); transition: background .2s; }
.brand-strip-set img { width: 80%; max-width: 190px; height: 54px; object-fit: contain; filter: grayscale(1) brightness(0); opacity: .77; transition: opacity .2s, transform .2s; }
.brand-strip-set a:hover, .brand-strip-set a:focus-visible { background: rgba(0,0,0,.035); }
.brand-strip-set a:focus-visible { outline: 2px solid #000; outline-offset: -2px; }
.brand-strip-set a:hover img, .brand-strip-set a:focus-visible img { opacity: 1; transform: translateY(-4px); }
.brand-strip-note { font-size: 11px; color: #000; text-align: center; margin: 20px 0 0; }
@media (max-width: 760px) { .brand-strip-set { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@media (max-width: 480px) { .brand-strip { padding: 32px 20px 24px; } .brand-strip-heading { margin-bottom: 24px; } .brand-strip-set { grid-template-columns: repeat(2, minmax(0, 1fr)); } .brand-strip-set a { min-height: 124px; padding-inline: 12px; } }
@media (prefers-reduced-motion: reduce) { .brand-strip-set a, .brand-strip-set img { transition: none; } .brand-strip-set a:hover img, .brand-strip-set a:focus-visible img { transform: none; } }

.brand-strip-set .brand-disney-logo { filter: grayscale(1); mix-blend-mode: multiply; }

/* Continuous logo reel; pause while a visitor interacts with a project link. */
.brand-strip { padding: 24px 0; overflow: hidden; }
.brand-strip-window { overflow: hidden; }
.brand-strip-track { display: flex; width: max-content; }
.brand-strip-set { display: flex; max-width: none; margin: 0; flex: none; }
.brand-strip-set li { width: clamp(180px, 20vw, 360px); flex: none; }
.brand-strip-set a { min-height: 100px; border-top: 0; }
.brand-strip-note { margin: 16px 24px 0; font-size: 11px; font-weight: 500; letter-spacing: .08em; }
.brand-strip.is-ready .brand-strip-track { animation: brand-drift 42s linear infinite; }
.brand-strip:hover .brand-strip-track, .brand-strip:focus-within .brand-strip-track, .brand-strip.is-offscreen .brand-strip-track { animation-play-state: paused; }
@keyframes brand-drift { to { transform: translateX(-50%); } }
@media (prefers-reduced-motion: reduce) {
  .brand-strip.is-ready .brand-strip-track { animation: none; width: 100%; }
  .brand-strip-set { width: 100%; flex-wrap: wrap; justify-content: center; }
  .brand-strip-set[aria-hidden] { display: none; }
}

.brand-strip-set .brand-ohio-lottery { filter: grayscale(1); height: 46px; }

.brand-strip-set li { position: relative; }
.brand-strip-set li::after { content: ''; position: absolute; right: -2px; top: 50%; width: 4px; height: 4px; border-radius: 50%; background: var(--accent); opacity: 1; transform: translateY(-50%); pointer-events: none; }

.brand-strip-set img { opacity: 1; }
.brand-strip-set .brand-ohio-lottery { mix-blend-mode: multiply; }

.brand-strip-set .brand-craftsman { filter: grayscale(1) brightness(.7) contrast(10); mix-blend-mode: multiply; height: 64px; }
