/* orgs.css — the organisations he has worked with, on /experience under Aghigh (2026-09-19).
   Two-way marquee of logos on white cards; paused on hover; still and scrollable under
   reduced motion; hidden in print. Moved from home.css when the section left the home page. */
@keyframes orgs-marquee { from { transform: translateX(0); } to { transform: translateX(-100%); } }
#worked-with .sec-head > div { margin-inline-start: 50px; }
.logo-strip--orgs {
  direction: ltr; display: flex; overflow: hidden; gap: 0;
  -webkit-mask-image: linear-gradient(90deg, transparent, #000 8%, #000 92%, transparent);
          mask-image: linear-gradient(90deg, transparent, #000 8%, #000 92%, transparent);
}
.logo-strip--orgs ul {
  display: flex; align-items: center; gap: 14px; margin: 0; padding: 6px 7px; list-style: none; flex-shrink: 0;
  animation: orgs-marquee 90s linear infinite;
}
.logo-strip--orgs.rev ul { animation-direction: reverse; animation-duration: 100s; }
.logo-strip--orgs:hover ul { animation-play-state: paused; }
.logo-strip--orgs li {
  display: grid; place-items: center; width: 164px; height: 92px; flex: 0 0 auto;
  border-radius: 14px; background: #fff; border: 1px solid rgba(0, 0, 0, .06);
  transition: transform .35s cubic-bezier(.2, .8, .2, 1), box-shadow .35s cubic-bezier(.2, .8, .2, 1);
}
.logo-strip--orgs li:hover { transform: translateY(-3px); box-shadow: 0 10px 24px -14px rgba(0, 0, 0, .5); }
.logo-strip--orgs img { max-width: 132px; max-height: 62px; width: auto; height: auto; object-fit: contain;
  filter: grayscale(.35); opacity: .92; transition: filter .35s, opacity .35s; }
.logo-strip--orgs li:hover img { filter: none; opacity: 1; }
@media (max-width: 779px) { #worked-with .sec-head > div { margin-inline-start: 0; } }
@media (prefers-reduced-motion: reduce) {
  .logo-strip--orgs { overflow-x: auto; }
  .logo-strip--orgs ul { animation: none; }
  .logo-strip--orgs ul + ul { display: none; }
}
@media print { #worked-with { display: none; } }