.vn-clients{
    --vn-bg:#0a0e1a;
    --vn-card:#10162a;
    --vn-line: rgba(148,163,184,.18);
    --vn-heading:#f5f7fa;
    --vn-muted:#8b96ac;
    --vn-accent:#f2a71b;
    --vn-gap:1.25rem;
    --vn-logo-w:168px;
    --vn-logo-h:88px;
  }

  .vn-clients{
    background:var(--vn-bg);
    padding:5rem 0 5.5rem;
    overflow:hidden;
  }
  .vn-clients__inner{
    max-width:1180px;
    margin:0 auto;
    padding:0 1.5rem;
    text-align:center;
  }
  .vn-eyebrow{
    display:inline-flex;
    align-items:center;
    gap:.55rem;
    color:var(--vn-accent);
    font-size:.75rem;
    font-weight:600;
    letter-spacing:.14em;
    text-transform:uppercase;
    margin:0 0 1rem;
  }
  .vn-eyebrow::before{
    content:"";
    width:6px; height:6px;
    border-radius:50%;
    background:var(--vn-accent);
  }
  .vn-clients h2{
    color:var(--vn-heading);
    font-size:clamp(1.75rem, 1vw + 1.5rem, 2.25rem);
    font-weight:700;
    margin:0 0 .75rem;
    line-height:1.2;
  }
  .vn-clients p.vn-sub{
    color:var(--vn-muted);
    max-width:600px;
    margin:0 auto 3rem;
    font-size:1rem;
    line-height:1.6;
  }

  .vn-row{
    position:relative;
    overflow:hidden;
    -webkit-mask-image:linear-gradient(to right, transparent 0, #000 8%, #000 92%, transparent 100%);
    mask-image:linear-gradient(to right, transparent 0, #000 8%, #000 92%, transparent 100%);
  }
  .vn-row + .vn-row{ margin-top:1.25rem; }

  .vn-track{
    display:flex;
    align-items:center;
    width:max-content;
    gap:var(--vn-gap);
    animation:vn-scroll-left 48s linear infinite;
  }
  .vn-row--reverse .vn-track{
    animation-name:vn-scroll-right;
    animation-duration:58s;
  }
  .vn-row:hover .vn-track{ animation-play-state:paused; }

  @keyframes vn-scroll-left{
    from{ transform:translateX(0); }
    to{ transform:translateX(-50%); }
  }
  @keyframes vn-scroll-right{
    from{ transform:translateX(-50%); }
    to{ transform:translateX(0); }
  }

  .logo-item{
    position:relative;
    flex:0 0 auto;
    width:var(--vn-logo-w);
    height:var(--vn-logo-h);
    display:flex;
    align-items:center;
    justify-content:center;
    background:var(--vn-card);
    border:1px solid var(--vn-line);
    border-radius:14px;
    transition:border-color .25s ease, transform .25s ease;
  }
  .logo-item:hover{
    border-color:var(--vn-accent);
    transform:translateY(-3px);
  }
  .logo-item img{
    position:relative;
    z-index:1;
    max-width:66%;
    max-height:50%;
    object-fit:contain;
    filter:brightness(0) invert(1) opacity(.5);
    transition:filter .25s ease;
  }
  .logo-item:hover img{
    filter:none;
  }
  .logo-fallback{
    position:absolute;
    inset:0;
    display:flex;
    align-items:center;
    justify-content:center;
    font-weight:700;
    letter-spacing:.02em;
    font-size:.85rem;
    color:var(--vn-muted);
    transition:color .25s ease;
  }
  .logo-item:hover .logo-fallback{ color:var(--vn-accent); }

  .sr-only{
    position:absolute; width:1px; height:1px; padding:0; margin:-1px;
    overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0;
  }

  @media (max-width:640px){
    .vn-clients{ --vn-logo-w:126px; --vn-logo-h:66px; --vn-gap:.9rem; }
    .vn-clients{ padding:3.5rem 0 4rem; }
  }

  @media (prefers-reduced-motion: reduce){
    .vn-track{ animation:none; flex-wrap:wrap; justify-content:center; width:auto; row-gap:1rem; }
    .vn-row{ mask-image:none; -webkit-mask-image:none; overflow:visible; }
    .vn-row + .vn-row{ margin-top:0; }
  }
/* Seamless groups maintain identical widths, including the trailing gap. */
.vn-clients{position:relative;border-top:1px solid #5795df25;border-bottom:1px solid #5795df25;background:radial-gradient(ellipse at 50% 0%,#183c652c,transparent 65%),#070f20;scroll-margin-top:35px}
.vn-clients__inner{max-width:1380px}.vn-track{gap:0}.vn-group{display:flex;align-items:center;gap:var(--vn-gap);padding-right:var(--vn-gap);flex-shrink:0}.vn-row{padding:8px 0}.vn-row:focus-within .vn-track{animation-play-state:paused}.vn-clients .logo-item{background:linear-gradient(135deg,#17253d,#0c192b);border-color:#6b9edc32;box-shadow:inset 0 1px 0 #b9d8ff08}.vn-clients .logo-item img{width:auto;height:auto;max-width:78%;max-height:64%;filter:brightness(0) invert(1) opacity(.6)}.vn-clients .logo-item:hover{border-color:#f2a71b;box-shadow:0 0 22px #ffbd0016}.vn-clients .logo-item:hover img{filter:none}.vn-clients .logo-item--opaque img{filter:grayscale(1) opacity(.62)}.vn-clients .logo-item--text span{font-size:14px;line-height:1.4;color:#aabbd2;font-weight:600}.vn-clients .logo-item--text:hover span{color:#f2a71b}.vn-clients__controls{display:flex;justify-content:center;margin-top:22px}.vn-clients__pause{background:transparent;color:#9fb4d1;border:1px solid #5b81b04d;border-radius:5px;font-size:12px;padding:9px 15px;cursor:pointer}.vn-clients__pause:hover{color:#ffd165;border-color:#c58b29}.vn-clients[data-paused="true"] .vn-track{animation-play-state:paused}.vn-clients .vn-sub{color:#97aac7}.vn-clients .vn-eyebrow{color:#f2a71b}.vn-clients h2{letter-spacing:-1px}
@media(prefers-reduced-motion:reduce){.vn-track{display:block}.vn-group{width:100%;padding:0;flex-wrap:wrap;justify-content:center;margin-bottom:var(--vn-gap)}.vn-group[aria-hidden="true"]{display:none}.vn-clients__controls{display:none}.vn-clients .logo-item img{filter:none}}
