/* VAV textile final owner v18
   Scope: Assortment / Turnkey / Clients / Proof / Brief / Contacts only. */

:root{
  --vav-light-knit:#f1f0eb;
  --vav-dark-knit:#080909;
  --vav-light-knit-size:1200px;
  --vav-dark-knit-size:1200px;
}

/* Shared light textile: Assortment + Turnkey use the SAME master and scale. */
.assortment-section,
.services-section,
.services-section[data-vav-sequence]{
  position:relative!important;
  isolation:isolate!important;
  background:var(--vav-light-knit)!important;
  border:0!important;
}
.assortment-section{margin-bottom:0!important}
.assortment-section + .services-section{margin-top:-2px!important}

/* Assortment: preserve current crop; tile to fill wide desktop gutters. */
.assortment-section::before{
  content:""!important;
  display:block!important;
  position:absolute!important;
  inset:0!important;
  z-index:0!important;
  pointer-events:none!important;
  background-image:url("./production-assets/PA-050_TEXTILE_ASSORTMENT_ENV_MASTER.webp")!important;
  background-position:center top!important;
  background-size:var(--vav-light-knit-size) auto!important;
  background-repeat:repeat!important;
  opacity:.50!important;
  transform:none!important;
  filter:none!important;
}
.assortment-section>*{position:relative!important;z-index:1!important}
.assortment-section .preview-copy .eyebrow,
.assortment-section .preview-copy [data-preview-title],
.assortment-section .preview-copy [data-preview-heading],
.assortment-section .preview-copy h3,
.assortment-section .preview-copy p,
.assortment-section .preview-copy>div{display:none!important}
.button>span,.nav-cta>span,.preview-open>span{display:none!important}

/* Turnkey: same PA-050, same scale. It lives on the sticky stage, therefore
   the textile itself does not crawl while the service sequence advances. */
.services-section::before,
.services-section[data-vav-sequence]::before{
  content:none!important;
  display:none!important;
}
.services-section[data-vav-sequence] .services-stage{
  isolation:isolate!important;
  background:var(--vav-light-knit)!important;
}
.services-section[data-vav-sequence] .services-stage::before{
  content:""!important;
  display:block!important;
  position:absolute!important;
  inset:0!important;
  z-index:0!important;
  pointer-events:none!important;
  background-image:url("./production-assets/PA-050_TEXTILE_ASSORTMENT_ENV_MASTER.webp")!important;
  background-position:center top!important;
  background-size:var(--vav-light-knit-size) auto!important;
  background-repeat:repeat!important;
  opacity:.50!important;
  transform:none!important;
  filter:none!important;
  will-change:auto!important;
}
.services-section[data-vav-sequence] .services-stage>*{
  position:relative;
  z-index:1;
}

/* Restore service renders above the textile. */
.services-section[data-vav-sequence] .services-media{
  display:block!important;
  visibility:visible!important;
  opacity:1!important;
  z-index:4!important;
  overflow:visible!important;
}
.services-section[data-vav-sequence] .services-media img{
  display:block!important;
  visibility:visible!important;
  max-width:none!important;
  object-fit:contain!important;
  mix-blend-mode:normal!important;
  filter:drop-shadow(0 28px 40px rgba(0,0,0,.13))!important;
}
.services-section[data-vav-sequence] .services-media .sequence-service-layer{
  position:absolute!important;
  left:55%!important;
  top:55%!important;
  width:min(64vw,920px)!important;
  height:78%!important;
  transform:translate(-50%,-50%)!important;
  opacity:0!important;
  transition:opacity .42s ease!important;
}
.services-section[data-vav-sequence] .services-media .sequence-service-layer.is-visible{
  opacity:1!important;
}

/* Remove every legacy active plate / rail. */
.services-section .services-list{
  border:0!important;
  background:transparent!important;
}
.services-section .services-list article,
.services-section .services-list article.is-active{
  position:relative!important;
  background:transparent!important;
  background-color:transparent!important;
  background-image:none!important;
  box-shadow:none!important;
  filter:none!important;
  transform:none!important;
  border:0!important;
  outline:0!important;
}
.services-section .services-list article::before,
.services-section .services-list article::after,
.services-section .services-list article.is-active::before,
.services-section .services-list article.is-active::after{
  content:none!important;
  display:none!important;
}
.services-section .services-list article.is-active>h3,
.services-section .services-list article.is-active>p,
.services-section .services-list article.is-active .service-title-base,
.services-section .services-list article.is-active .service-title-thread{
  background:transparent!important;
  background-image:none!important;
  box-shadow:none!important;
}

/* Active point: CODE/UI. Final material is a dense satin circle based on the
   approved black embroidered-dot reference; number remains live DOM text. */
.services-section .services-list article{
  position:relative!important;
  padding-left:60px!important;
}
.services-section .services-list article>span{
  position:absolute!important;
  display:grid!important;
  place-items:center!important;
  left:8px!important;
  top:50%!important;
  width:40px!important;
  height:40px!important;
  margin:0!important;
  padding:0!important;
  transform:translateY(-50%)!important;
  border:1px solid rgba(9,9,9,.28)!important;
  border-radius:50%!important;
  background:transparent!important;
  box-shadow:none!important;
  color:rgba(9,9,9,.56)!important;
  opacity:1!important;
  overflow:visible!important;
  font-size:10px!important;
  line-height:1!important;
}
.services-section .services-list article.is-active>span{
  border-color:transparent!important;
  background:transparent!important;
  box-shadow:none!important;
  color:#fff!important;
  text-shadow:0 1px 1px rgba(0,0,0,.30)!important;
}
.services-section .services-list article>span::before,
.services-section .services-list article>span::after{
  content:none!important;
  display:none!important;
}
.service-stitch-canvas{
  position:absolute!important;
  inset:-3px!important;
  width:46px!important;
  height:46px!important;
  z-index:0!important;
  pointer-events:none!important;
}
.service-num-label{
  position:relative!important;
  z-index:2!important;
  color:inherit!important;
  font:inherit!important;
  line-height:1!important;
}
.service-title-thread{display:none!important}

@media(min-width:901px){
  .services-section[data-vav-sequence] .services-list{
    width:min(400px,30vw)!important;
  }
  .services-section[data-vav-sequence] .services-list article{
    min-height:64px!important;
    padding:12px 12px 12px 62px!important;
  }
  .services-section[data-vav-sequence] .services-list article h3{
    margin:0!important;
    font-size:clamp(18px,1.5vw,23px)!important;
    line-height:1.03!important;
  }
}

/* Clients: one plane, black approved logos, moving track. */
.clients-section{
  position:relative!important;
  isolation:isolate!important;
  overflow:hidden!important;
  margin:0!important;
  padding:16px 0 12px!important;
  border:0!important;
  background:var(--vav-light-knit)!important;
}
.clients-section::before{
  content:""!important;
  display:block!important;
  position:absolute!important;
  inset:0!important;
  z-index:0!important;
  pointer-events:none!important;
  background-image:url("./production-assets/PA-050_TEXTILE_ASSORTMENT_ENV_MASTER.webp")!important;
  background-position:center!important;
  background-size:var(--vav-light-knit-size) auto!important;
  background-repeat:repeat!important;
  opacity:.26!important;
}
.clients-section>*{position:relative!important;z-index:1!important}
.clients-title{
  width:min(calc(100% - 48px),var(--vav-max))!important;
  margin:0 auto 8px!important;
  padding:0!important;
  background:transparent!important;
  color:rgba(9,9,9,.72)!important;
  font-size:11px!important;
  line-height:1!important;
  letter-spacing:.18em!important;
  text-transform:uppercase!important;
}
.clients-row{
  width:100%!important;
  max-width:none!important;
  height:78px!important;
  min-height:78px!important;
  margin:0!important;
  padding:0!important;
  overflow:hidden!important;
  background:transparent!important;
  -webkit-mask-image:none!important;
  mask-image:none!important;
}
.clients-knit-track{
  display:flex!important;
  align-items:center!important;
  width:max-content!important;
  height:78px!important;
  margin:0!important;
  padding:0!important;
  animation:vavClientStrip 24s linear infinite!important;
  will-change:transform!important;
}
.clients-knit-track img{
  display:block!important;
  flex:none!important;
  width:auto!important;
  height:78px!important;
  max-width:none!important;
  margin:0!important;
  padding:0!important;
  object-fit:contain!important;
  opacity:1!important;
  filter:none!important;
  mix-blend-mode:normal!important;
}
@keyframes vavClientStrip{to{transform:translate3d(-50%,0,0)}}

/* Closing scene: same dark knit on Proof / Brief / Contacts.
   No fixed attachment, no narrow shell background, no detached backdrop. */
.closing-textile-backdrop{display:none!important}
.proof-dark.shell,
.proof-dark,
.brief-section,
footer#contacts{
  position:relative!important;
  isolation:isolate!important;
  box-sizing:border-box!important;
  margin:0!important;
  border:0!important;
  background-color:var(--vav-dark-knit)!important;
  background-image:
    linear-gradient(rgba(5,6,6,.70),rgba(5,6,6,.70)),
    url("./production-assets/PA-053_TEXTILE_CONTACTS_ENV_MASTER.webp")!important;
  background-position:center top!important;
  background-size:var(--vav-dark-knit-size) auto!important;
  background-repeat:repeat!important;
  background-attachment:scroll!important;
  color:#fff!important;
}
.proof-dark.shell,
.proof-dark{
  width:100%!important;
  max-width:none!important;
  margin-left:0!important;
  margin-right:0!important;
}
.proof-dark::before,.proof-dark::after,
.brief-section::before,.brief-section::after,
footer#contacts::before,footer#contacts::after{
  content:none!important;
  display:none!important;
}
.proof-dark>*,
.brief-section>*,
footer#contacts>*{
  position:relative!important;
  z-index:1!important;
}
footer#contacts .footer-bg{display:none!important}

/* Remove generated scene numbering from the final three blocks. */
.proof-label,
.proof-label-number,
.proof-label-desktop,
.proof-label-mobile,
.brief-copy>.eyebrow,
footer#contacts .contacts-grid .eyebrow,
.scene-number{
  display:none!important;
}

/* Proof alignment. */
.proof-dark{
  padding:28px max(24px,calc((100vw - var(--vav-max))/2))!important;
  display:grid!important;
  grid-template-columns:repeat(4,minmax(0,1fr))!important;
  align-items:stretch!important;
  gap:0!important;
}
.proof-dark article{
  min-width:0!important;
  min-height:128px!important;
  padding:22px 28px!important;
  display:flex!important;
  flex-direction:column!important;
  justify-content:center!important;
  align-items:flex-start!important;
  gap:10px!important;
  border:0!important;
}
.proof-dark article::before,.proof-dark article::after{content:none!important;display:none!important}
.proof-dark strong{
  display:block!important;
  margin:0!important;
  color:#fff!important;
  font-size:clamp(36px,3vw,54px)!important;
  line-height:.9!important;
  white-space:nowrap!important;
}
.proof-dark span{
  display:block!important;
  margin:0!important;
  color:rgba(255,255,255,.64)!important;
  font-size:10px!important;
  line-height:1.25!important;
}

/* Brief composition. */
.brief-section{
  padding:72px 0 82px!important;
  overflow:hidden!important;
}
.brief-grid{
  width:min(calc(100% - 96px),1240px)!important;
  margin-inline:auto!important;
  display:grid!important;
  grid-template-columns:minmax(360px,.82fr) minmax(560px,1.18fr)!important;
  gap:78px!important;
  align-items:start!important;
}
.brief-copy{
  align-self:start!important;
  padding-top:24px!important;
}
.brief-copy h2{
  margin:0 0 18px!important;
  color:#fff!important;
  font-size:clamp(62px,5vw,82px)!important;
  line-height:.88!important;
}
.brief-copy .brief-intro{
  max-width:360px!important;
  margin:0!important;
  color:rgba(255,255,255,.68)!important;
  font-size:14px!important;
  line-height:1.35!important;
}
.brief-form{
  width:100%!important;
  max-width:680px!important;
  margin:0!important;
  justify-self:end!important;
  align-self:start!important;
}

/* Contacts: fit to content, no dark dead tail. */
footer#contacts{
  min-height:0!important;
  padding:58px 0 22px!important;
  overflow:hidden!important;
}
footer#contacts .contacts-grid{
  width:min(calc(100% - 96px),1240px)!important;
  margin-inline:auto!important;
  padding:0 0 38px!important;
}
footer#contacts .footer-grid{
  width:min(calc(100% - 96px),1240px)!important;
  margin-inline:auto!important;
}

/* Mobile: retain RF geometry, only fix materials / marker / closing scale. */
@media(max-width:900px){
  :root{
    --vav-light-knit-size:1200px;
    --vav-dark-knit-size:900px;
  }

  .assortment-section .preview-copy{
    display:block!important;
    position:absolute!important;
    z-index:20!important;
    left:auto!important;
    right:6%!important;
    top:auto!important;
    bottom:7.5%!important;
    width:auto!important;
    transform:none!important;
    pointer-events:none!important;
    text-align:right!important;
  }
  .assortment-section .preview-open{
    display:inline-flex!important;
    pointer-events:auto!important;
    min-height:50px!important;
    padding:0 20px!important;
    border-radius:999px!important;
    white-space:nowrap!important;
  }
  .assortment-section .wheel-back{
    position:absolute!important;
    left:0!important;
    top:0!important;
  }

  .services-section[data-vav-sequence] .services-stage::before{
    background-position:center top!important;
    background-size:var(--vav-light-knit-size) auto!important;
    opacity:.50!important;
  }
  .services-section[data-vav-sequence] .services-media{
    display:block!important;
    visibility:visible!important;
    opacity:1!important;
    z-index:3!important;
  }
  .services-section[data-vav-sequence] .services-media .sequence-service-layer{
    left:57%!important;
    top:56%!important;
    width:112%!important;
    height:86%!important;
  }
  .services-section .services-list article{
    padding-left:50px!important;
  }
  .services-section .services-list article>span{
    left:5px!important;
    width:36px!important;
    height:36px!important;
  }
  .service-stitch-canvas{
    inset:-3px!important;
    width:42px!important;
    height:42px!important;
  }

  .clients-section{padding:14px 0 10px!important}
  .clients-title{
    width:calc(100% - 28px)!important;
    margin-bottom:7px!important;
    font-size:9px!important;
  }
  .clients-row,.clients-knit-track{
    height:68px!important;
    min-height:68px!important;
  }
  .clients-knit-track img{height:68px!important}

  .proof-dark{
    padding:0 14px!important;
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
  }
  .proof-dark article{
    min-height:106px!important;
    padding:18px!important;
  }
  .proof-dark strong{
    font-size:clamp(30px,9vw,42px)!important;
    white-space:normal!important;
  }

  .brief-section{padding:50px 0 56px!important}
  .brief-grid{
    width:calc(100% - 28px)!important;
    grid-template-columns:1fr!important;
    gap:28px!important;
  }
  .brief-copy{padding-top:0!important}
  .brief-copy h2{font-size:clamp(48px,12vw,62px)!important}
  .brief-form{max-width:none!important;justify-self:stretch!important}

  footer#contacts{padding:32px 0 16px!important}
  footer#contacts .contacts-grid,
  footer#contacts .footer-grid{
    width:calc(100% - 28px)!important;
  }
}

@media(prefers-reduced-motion:reduce){
  .clients-knit-track{animation:none!important;transform:none!important}
}


/* v19 — mobile recovery from 00:50 live screenshots. */
@media(max-width:900px){

  /* SERVICES HEADING: keep the whole title below the floating nav. */
  .services-section[data-vav-sequence] .services-stage>.section-head{
    display:block!important;
    visibility:visible!important;
    opacity:1!important;
    z-index:15!important;
    left:18px!important;
    right:18px!important;
    top:16svh!important;
    width:auto!important;
    max-width:none!important;
    margin:0!important;
  }
  .services-section[data-vav-sequence] .services-stage>.section-head h2{
    display:block!important;
    max-width:350px!important;
    margin:0!important;
    color:#111!important;
    opacity:1!important;
    font-size:clamp(38px,10.4vw,48px)!important;
    line-height:.91!important;
  }
  .services-section[data-vav-sequence] .services-stage>.section-head>p:last-child{
    display:none!important;
  }

  /* Keep the product render clear of the recovered heading. */
  .services-section[data-vav-sequence] .services-media{
    left:12px!important;
    right:12px!important;
    top:28%!important;
    bottom:auto!important;
    height:45%!important;
    z-index:3!important;
  }
  .services-section[data-vav-sequence] .services-media .sequence-service-layer{
    left:50%!important;
    top:50%!important;
    width:108%!important;
    height:100%!important;
    transform:translate(-50%,-50%)!important;
  }

  /* Timeline: old pseudo-dot is disabled. The real DOM span becomes the node,
     so the active state can show the satin embroidery canvas. */
  .services-section[data-vav-sequence] .services-list{
    left:14px!important;
    right:14px!important;
    bottom:7%!important;
    width:auto!important;
    height:72px!important;
    min-height:72px!important;
    padding:0!important;
    display:flex!important;
    align-items:flex-end!important;
    gap:0!important;
    overflow:visible!important;
    border:0!important;
    border-radius:0!important;
    background:transparent!important;
    box-shadow:none!important;
  }
  .services-section[data-vav-sequence] .services-list::before{
    content:""!important;
    display:block!important;
    position:absolute!important;
    left:10%!important;
    right:10%!important;
    top:52px!important;
    width:auto!important;
    height:1px!important;
    background:rgba(9,9,9,.22)!important;
  }
  .services-section[data-vav-sequence] .services-list article{
    position:relative!important;
    flex:1 1 0!important;
    min-width:0!important;
    width:auto!important;
    height:62px!important;
    min-height:62px!important;
    max-height:62px!important;
    padding:0!important;
    margin:0!important;
    overflow:visible!important;
    background:transparent!important;
    border:0!important;
    border-radius:0!important;
    box-shadow:none!important;
    transform:none!important;
    opacity:1!important;
  }
  .services-section[data-vav-sequence] .services-list article::before,
  .services-section[data-vav-sequence] .services-list article::after{
    content:none!important;
    display:none!important;
  }

  /* inactive = small empty node; active = embroidered dot with live number */
  .services-section[data-vav-sequence] .services-list article>span{
    display:grid!important;
    place-items:center!important;
    position:absolute!important;
    z-index:4!important;
    left:50%!important;
    top:52px!important;
    width:10px!important;
    height:10px!important;
    min-width:10px!important;
    min-height:10px!important;
    margin:0!important;
    padding:0!important;
    transform:translate(-50%,-50%)!important;
    border:1px solid rgba(9,9,9,.48)!important;
    border-radius:50%!important;
    background:var(--vav-light-knit)!important;
    box-shadow:none!important;
    color:transparent!important;
    opacity:1!important;
    overflow:visible!important;
    transition:width .34s cubic-bezier(.16,1,.3,1),height .34s cubic-bezier(.16,1,.3,1),border-color .2s ease,background .2s ease!important;
  }
  .services-section[data-vav-sequence] .services-list article.is-active>span{
    width:36px!important;
    height:36px!important;
    min-width:36px!important;
    min-height:36px!important;
    border-color:transparent!important;
    background:transparent!important;
    color:#fff!important;
  }
  .services-section[data-vav-sequence] .service-stitch-canvas{
    display:block!important;
    position:absolute!important;
    left:50%!important;
    top:50%!important;
    width:42px!important;
    height:42px!important;
    transform:translate(-50%,-50%)!important;
    z-index:0!important;
    pointer-events:none!important;
  }
  .services-section[data-vav-sequence] .service-num-label{
    display:block!important;
    position:relative!important;
    z-index:2!important;
    color:inherit!important;
    font:inherit!important;
    line-height:1!important;
  }
  .services-section[data-vav-sequence] .services-list article h3{
    display:block!important;
    position:absolute!important;
    left:50%!important;
    right:auto!important;
    top:4px!important;
    width:max-content!important;
    max-width:138px!important;
    margin:0!important;
    padding:0!important;
    transform:translateX(-50%) translateY(4px)!important;
    opacity:0!important;
    color:#111!important;
    font-size:11.5px!important;
    line-height:1.05!important;
    font-weight:650!important;
    text-align:center!important;
    white-space:normal!important;
    background:transparent!important;
    box-shadow:none!important;
    transition:opacity .18s ease,transform .3s cubic-bezier(.16,1,.3,1)!important;
  }
  .services-section[data-vav-sequence] .services-list article.is-active h3{
    opacity:1!important;
    transform:translateX(-50%) translateY(0)!important;
  }
  .services-section[data-vav-sequence] .services-list article:first-child h3{
    left:0!important;
    transform:translateX(0) translateY(4px)!important;
    text-align:left!important;
  }
  .services-section[data-vav-sequence] .services-list article:first-child.is-active h3{
    transform:translateX(0) translateY(0)!important;
  }
  .services-section[data-vav-sequence] .services-list article:last-child h3{
    left:auto!important;
    right:0!important;
    transform:translateX(0) translateY(4px)!important;
    text-align:right!important;
  }
  .services-section[data-vav-sequence] .services-list article:last-child.is-active h3{
    transform:translateX(0) translateY(0)!important;
  }
  .services-section[data-vav-sequence] .services-list article p{
    display:none!important;
  }

  /* CLIENTS: same light knit plane; PA-054 blends into it instead of looking
     like a separate rectangular banner. */
  .clients-section{
    min-height:92px!important;
    height:92px!important;
    padding:0!important;
    background:var(--vav-light-knit)!important;
    overflow:hidden!important;
  }
  .clients-section::before{
    background-image:url("./production-assets/PA-050_TEXTILE_ASSORTMENT_ENV_MASTER.webp")!important;
    background-size:var(--vav-light-knit-size) auto!important;
    background-position:center!important;
    background-repeat:repeat!important;
    opacity:.32!important;
  }
  .clients-title{
    position:absolute!important;
    z-index:4!important;
    left:18px!important;
    top:12px!important;
    width:auto!important;
    margin:0!important;
    padding:0!important;
    color:rgba(9,9,9,.72)!important;
    font-size:9px!important;
    letter-spacing:.18em!important;
    background:transparent!important;
    pointer-events:none!important;
  }
  .clients-row{
    position:absolute!important;
    inset:0!important;
    width:calc(100% + 24px)!important;
    height:92px!important;
    min-height:92px!important;
    margin:0 0 0 -12px!important;
    padding:25px 0 0!important;
    overflow:hidden!important;
    background:transparent!important;
  }
  .clients-knit-track{
    height:62px!important;
    min-height:62px!important;
    animation-duration:24s!important;
  }
  .clients-knit-track img{
    height:62px!important;
    opacity:1!important;
    filter:contrast(1.24) brightness(.90)!important;
    mix-blend-mode:multiply!important;
  }
}

@media(max-width:420px){
  .services-section[data-vav-sequence] .services-stage>.section-head{
    top:15.5svh!important;
  }
  .services-section[data-vav-sequence] .services-stage>.section-head h2{
    font-size:clamp(36px,10vw,44px)!important;
  }
  .services-section[data-vav-sequence] .services-list{
    left:12px!important;
    right:12px!important;
  }
  .services-section[data-vav-sequence] .services-list article h3{
    font-size:10.5px!important;
    max-width:112px!important;
  }
}


/* v20 — mobile spacing/timeline/client fixes from 01:17–01:21 screenshots. */

/* Service active point no longer carries a number on any viewport. */
.service-num-label{display:none!important}

@media(max-width:900px){

  /* 1. PRODUCTION: sticky scene must not hide the heading behind the floating nav. */
  .production-section[data-vav-sequence] .production-head{
    top:20.5svh!important;
  }
  .production-section[data-vav-sequence] .production-head h2{
    margin-top:0!important;
  }

  /* Production timeline: no connecting line, no halo / circle-in-circle, no number. */
  .production-section[data-vav-sequence] .flow-menu::before{
    content:none!important;
    display:none!important;
  }
  .production-section[data-vav-sequence] .flow-item .flow-static,
  .production-section[data-vav-sequence] .flow-item .flow-number,
  .production-section[data-vav-sequence] .flow-item .flow-marquee{
    display:none!important;
  }
  .production-section[data-vav-sequence] .flow-item::before{
    width:10px!important;
    height:10px!important;
    border:1px solid rgba(255,255,255,.72)!important;
    background:#090a0a!important;
    box-shadow:none!important;
  }
  .production-section[data-vav-sequence] .flow-item.is-active::before{
    width:18px!important;
    height:18px!important;
    border:0!important;
    background:#fff!important;
    box-shadow:none!important;
  }

  /* 2 + 3. ASSORTMENT: CTA higher, remove bottom seam and shorten the dead tail. */
  .assortment-section{
    height:93svh!important;
    min-height:93svh!important;
    max-height:none!important;
    padding-bottom:0!important;
    border-bottom:0!important;
    box-shadow:none!important;
  }
  .assortment-browser{
    height:93svh!important;
    min-height:700px!important;
    border-bottom:0!important;
    box-shadow:none!important;
  }
  .assortment-section::after,
  .assortment-browser::after,
  .assortment-preview::after,
  .wheel-panel::after{
    content:none!important;
    display:none!important;
  }
  .assortment-section .preview-copy{
    top:auto!important;
    bottom:14.5%!important;
  }
  .assortment-section .preview-open{
    min-height:50px!important;
  }

  /* Start the next scene closer to Assortment. */
  .services-section[data-vav-sequence] .services-stage>.section-head{
    top:12.5svh!important;
  }

  /* 4. SERVICES TIMELINE: independent points only. */
  .services-section[data-vav-sequence] .services-list::before{
    content:none!important;
    display:none!important;
  }
  .services-section[data-vav-sequence] .services-list article>span{
    width:10px!important;
    height:10px!important;
    min-width:10px!important;
    min-height:10px!important;
    border:1px solid rgba(9,9,9,.46)!important;
    background:transparent!important;
    box-shadow:none!important;
    color:transparent!important;
  }
  .services-section[data-vav-sequence] .services-list article.is-active>span{
    width:32px!important;
    height:32px!important;
    min-width:32px!important;
    min-height:32px!important;
    border:0!important;
    background:transparent!important;
    box-shadow:none!important;
    color:transparent!important;
  }
  .services-section[data-vav-sequence] .service-stitch-canvas{
    width:34px!important;
    height:34px!important;
    inset:auto!important;
    left:50%!important;
    top:50%!important;
    transform:translate(-50%,-50%)!important;
  }

  /* 5. Keep the final Logистика label inside the viewport. */
  .services-section[data-vav-sequence] .services-list article:last-child h3{
    left:auto!important;
    right:0!important;
    width:82px!important;
    max-width:82px!important;
    transform:translateY(4px)!important;
    text-align:right!important;
    white-space:nowrap!important;
  }
  .services-section[data-vav-sequence] .services-list article:last-child.is-active h3{
    transform:translateY(0)!important;
  }

  /* 6. CLIENTS: fixed title + uninterrupted moving logos on one visual plane. */
  .clients-section{
    height:88px!important;
    min-height:88px!important;
    margin:0!important;
    padding:0!important;
    border:0!important;
    background:#f2f0e9!important;
  }
  .clients-section::before{
    background-image:url("./production-assets/PA-050_TEXTILE_ASSORTMENT_ENV_MASTER.webp")!important;
    background-size:var(--vav-light-knit-size) auto!important;
    background-position:center!important;
    background-repeat:repeat!important;
    opacity:.22!important;
  }
  .clients-title{
    position:absolute!important;
    z-index:5!important;
    left:18px!important;
    top:11px!important;
    width:auto!important;
    margin:0!important;
    padding:0!important;
    background:transparent!important;
    pointer-events:none!important;
  }
  .clients-row{
    position:absolute!important;
    inset:0!important;
    width:100%!important;
    height:88px!important;
    min-height:88px!important;
    margin:0!important;
    padding:24px 0 0!important;
    overflow:hidden!important;
    background:transparent!important;
  }
  .clients-knit-track{
    display:flex!important;
    width:max-content!important;
    height:64px!important;
    min-height:64px!important;
    gap:0!important;
    animation:vavClientStrip 24s linear infinite!important;
  }
  .clients-knit-track img{
    height:64px!important;
    width:auto!important;
    flex:none!important;
    margin:0 -1px 0 0!important;
    opacity:.98!important;
    filter:contrast(1.46) brightness(1.04)!important;
    mix-blend-mode:multiply!important;
  }

  .clients-section + .cases-section{
    margin-top:-1px!important;
    border-top:0!important;
  }
}

/* Four identical masters = no empty tail. One cycle advances exactly one master. */
@keyframes vavClientStrip{
  to{transform:translate3d(-25%,0,0)}
}


/* v21 — mobile QA corrections from 01:36–01:37 screenshots. */
@media(max-width:900px){

  /* PRODUCTION: undo the overcorrection. Title sits safely below nav but above image. */
  .production-section[data-vav-sequence] .production-head{
    top:14.5svh!important;
  }
  .production-section[data-vav-sequence] .production-head .eyebrow,
  .production-section[data-vav-sequence] .production-copy>span{
    display:none!important;
  }

  /* Production nav: labels closer to dots, no DOM number can leak into active dot. */
  .production-section[data-vav-sequence] .flow-item>span,
  .production-section[data-vav-sequence] .flow-item .flow-number,
  .production-section[data-vav-sequence] .flow-item .flow-static,
  .production-section[data-vav-sequence] .flow-item .flow-marquee{
    display:none!important;
  }
  .production-section[data-vav-sequence] .flow-item::after{
    top:18px!important;
  }

  /* ASSORTMENT -> SERVICES: remove the remaining dead vertical tail. */
  .assortment-section{
    height:84svh!important;
    min-height:84svh!important;
  }
  .assortment-browser{
    height:84svh!important;
    min-height:660px!important;
  }
  .assortment-section .preview-copy{
    bottom:11%!important;
  }

  /* SERVICES title has no numbered eyebrow; active labels sit closer to nodes. */
  .services-section[data-vav-sequence] .services-stage>.section-head{
    top:10.5svh!important;
  }
  .services-section[data-vav-sequence] .services-stage>.section-head .eyebrow{
    display:none!important;
  }
  .services-section[data-vav-sequence] .services-list article h3{
    top:25px!important;
    font-size:10.5px!important;
  }
  .services-section[data-vav-sequence] .services-list article:first-child h3{
    top:25px!important;
  }

  /* No number in embroidered active node, ever. */
  .services-section[data-vav-sequence] .service-num-label{
    display:none!important;
  }

  /* Last label stays fully inside the viewport. */
  .services-section[data-vav-sequence] .services-list article:last-child h3{
    left:auto!important;
    right:4px!important;
    top:25px!important;
    width:max-content!important;
    max-width:none!important;
    font-size:10.5px!important;
    transform:translateY(4px)!important;
    text-align:right!important;
    white-space:nowrap!important;
  }
  .services-section[data-vav-sequence] .services-list article:last-child.is-active h3{
    transform:translateY(0)!important;
  }

  /* CLIENTS: PA-054 itself is the single moving substrate.
     Title is fixed on top; there is no second knit/background layer. */
  .clients-section{
    position:relative!important;
    height:108px!important;
    min-height:108px!important;
    margin:0!important;
    padding:0!important;
    overflow:hidden!important;
    border:0!important;
    background:#f4f2eb!important;
  }
  .clients-section::before{
    content:none!important;
    display:none!important;
  }
  .clients-title{
    position:absolute!important;
    z-index:6!important;
    left:18px!important;
    top:12px!important;
    width:auto!important;
    margin:0!important;
    padding:0!important;
    color:#202020!important;
    font-size:9px!important;
    line-height:1!important;
    letter-spacing:.18em!important;
    text-transform:uppercase!important;
    background:transparent!important;
    pointer-events:none!important;
  }
  .clients-row{
    position:absolute!important;
    z-index:1!important;
    inset:0!important;
    width:100%!important;
    height:108px!important;
    min-height:108px!important;
    margin:0!important;
    padding:0!important;
    overflow:hidden!important;
    background:transparent!important;
    -webkit-mask-image:none!important;
    mask-image:none!important;
  }
  .clients-knit-track{
    display:flex!important;
    align-items:stretch!important;
    width:max-content!important;
    height:108px!important;
    min-height:108px!important;
    margin:0!important;
    padding:0!important;
    gap:0!important;
    animation:vavClientStrip 25s linear infinite!important;
    will-change:transform!important;
  }
  .clients-knit-track img{
    display:block!important;
    flex:0 0 618px!important;
    width:618px!important;
    height:108px!important;
    max-width:none!important;
    margin:0 -1px 0 0!important;
    padding:0!important;
    object-fit:fill!important;
    opacity:1!important;
    filter:none!important;
    mix-blend-mode:normal!important;
  }

  /* Cases touch the client strip; no white separator. */
  .clients-section + .cases-section{
    margin-top:-1px!important;
    padding-top:0!important;
    border-top:0!important;
  }
}

@media(max-width:420px){
  .production-section[data-vav-sequence] .production-head{
    top:14svh!important;
  }
  .assortment-section,
  .assortment-browser{
    height:83svh!important;
    min-height:650px!important;
  }
}


/* v22 — mobile service label geometry, true single client substrate,
   and Safari bottom-surface integration. */

html,body{
  min-height:100%!important;
}

@media(max-width:900px){

  /* SERVICES: all labels are centered on their own node.
     No edge-specific first/last positioning. */
  .services-section[data-vav-sequence] .services-list{
    left:34px!important;
    right:34px!important;
  }
  .services-section[data-vav-sequence] .services-list article h3,
  .services-section[data-vav-sequence] .services-list article:first-child h3,
  .services-section[data-vav-sequence] .services-list article:last-child h3{
    display:block!important;
    position:absolute!important;
    left:50%!important;
    right:auto!important;
    top:auto!important;
    bottom:18px!important;
    width:98px!important;
    max-width:98px!important;
    margin:0!important;
    padding:0!important;
    transform:translateX(-50%) translateY(3px)!important;
    text-align:center!important;
    white-space:normal!important;
    font-size:10.5px!important;
    line-height:1.02!important;
    opacity:0!important;
  }
  .services-section[data-vav-sequence] .services-list article.is-active h3,
  .services-section[data-vav-sequence] .services-list article:first-child.is-active h3,
  .services-section[data-vav-sequence] .services-list article:last-child.is-active h3{
    transform:translateX(-50%) translateY(0)!important;
    opacity:1!important;
  }

  /* Inactive node = one clean small ring only.
     Canvas is physically absent, so no second ghost ring can remain. */
  .services-section[data-vav-sequence] .services-list article:not(.is-active)>span{
    width:10px!important;
    height:10px!important;
    min-width:10px!important;
    min-height:10px!important;
    border:1px solid rgba(9,9,9,.50)!important;
    background:transparent!important;
    box-shadow:none!important;
  }
  .services-section[data-vav-sequence] .services-list article:not(.is-active) .service-stitch-canvas{
    display:none!important;
  }
  .services-section[data-vav-sequence] .services-list article.is-active>span{
    width:32px!important;
    height:32px!important;
    min-width:32px!important;
    min-height:32px!important;
    border:0!important;
    box-shadow:none!important;
  }
  .services-section[data-vav-sequence] .service-num-label{
    display:none!important;
    visibility:hidden!important;
    font-size:0!important;
    color:transparent!important;
  }

  /* Production numbering must not leak from DOM into the active point/card. */
  .production-section[data-vav-sequence] [data-production-number],
  .production-section[data-vav-sequence] .flow-number{
    display:none!important;
    visibility:hidden!important;
    font-size:0!important;
    color:transparent!important;
  }
  .production-section[data-vav-sequence] .flow-item::before{
    color:transparent!important;
    font-size:0!important;
    text-indent:-999px!important;
  }

  /* CLIENTS: PA-054 is literally the only visible substrate.
     Fixed title overlays it; the strip itself moves continuously. */
  .clients-section{
    position:relative!important;
    height:106px!important;
    min-height:106px!important;
    margin:0!important;
    padding:0!important;
    overflow:hidden!important;
    border:0!important;
    background:#f3f1ea!important;
  }
  .clients-section::before,
  .clients-section::after{
    content:none!important;
    display:none!important;
  }
  .clients-title{
    position:absolute!important;
    z-index:10!important;
    left:18px!important;
    top:12px!important;
    width:auto!important;
    margin:0!important;
    padding:0!important;
    color:#161616!important;
    font-size:9px!important;
    line-height:1!important;
    letter-spacing:.18em!important;
    text-transform:uppercase!important;
    background:transparent!important;
    pointer-events:none!important;
  }
  .clients-row{
    position:absolute!important;
    z-index:1!important;
    inset:0!important;
    width:100%!important;
    height:106px!important;
    min-height:106px!important;
    margin:0!important;
    padding:0!important;
    overflow:hidden!important;
    background:transparent!important;
    -webkit-mask-image:none!important;
    mask-image:none!important;
  }
  .clients-knit-track{
    display:flex!important;
    align-items:stretch!important;
    width:max-content!important;
    height:106px!important;
    min-height:106px!important;
    margin:0!important;
    padding:0!important;
    gap:0!important;
    animation:vavClientStrip 26s linear infinite!important;
    will-change:transform!important;
  }
  .clients-knit-track img{
    display:block!important;
    flex:0 0 650px!important;
    width:650px!important;
    height:106px!important;
    max-width:none!important;
    margin:0 -1px 0 0!important;
    padding:0!important;
    object-fit:fill!important;
    opacity:1!important;
    filter:none!important;
    mix-blend-mode:normal!important;
  }

  .clients-section + .cases-section{
    margin-top:-1px!important;
    border-top:0!important;
  }
}


/* v23 — final mobile service label centering + remove legacy ghost nodes,
   detach Cases from Clients, and stop page-managed Safari bottom surface. */
@media(max-width:900px){

  /* Kill the legacy pseudo-node from review6 with matching/higher specificity. */
  .services-section[data-vav-sequence] .services-list article::before,
  .services-section[data-vav-sequence] .services-list article.is-active::before,
  .services-section[data-vav-sequence] .services-list article::after,
  .services-section[data-vav-sequence] .services-list article.is-active::after{
    content:none!important;
    display:none!important;
    width:0!important;
    height:0!important;
    border:0!important;
    box-shadow:none!important;
    background:none!important;
  }

  /* Only the real DOM span is the node. */
  .services-section[data-vav-sequence] .services-list{
    left:58px!important;
    right:58px!important;
  }
  .services-section[data-vav-sequence] .services-list article>span{
    left:50%!important;
    top:52px!important;
    transform:translate(-50%,-50%)!important;
  }

  /* Every active label is centered over its own point.
     First/last get no special edge alignment. */
  .services-section[data-vav-sequence] .services-list article h3,
  .services-section[data-vav-sequence] .services-list article:first-child h3,
  .services-section[data-vav-sequence] .services-list article:last-child h3{
    left:50%!important;
    right:auto!important;
    top:auto!important;
    bottom:34px!important;
    width:124px!important;
    max-width:124px!important;
    margin:0!important;
    padding:0!important;
    transform:translateX(-50%) translateY(3px)!important;
    text-align:center!important;
    white-space:normal!important;
    line-height:1.02!important;
    font-size:10.5px!important;
  }
  .services-section[data-vav-sequence] .services-list article.is-active h3,
  .services-section[data-vav-sequence] .services-list article:first-child.is-active h3,
  .services-section[data-vav-sequence] .services-list article:last-child.is-active h3{
    transform:translateX(-50%) translateY(0)!important;
  }
  .services-section[data-vav-sequence] .services-list article:last-child h3{
    white-space:nowrap!important;
  }

  /* Inactive state = exactly one small ring, nothing behind it. */
  .services-section[data-vav-sequence] .services-list article:not(.is-active)>span{
    width:10px!important;
    height:10px!important;
    min-width:10px!important;
    min-height:10px!important;
    border:1px solid rgba(9,9,9,.52)!important;
    background:transparent!important;
    box-shadow:none!important;
    outline:0!important;
  }
  .services-section[data-vav-sequence] .services-list article:not(.is-active)>span::before,
  .services-section[data-vav-sequence] .services-list article:not(.is-active)>span::after{
    content:none!important;
    display:none!important;
  }
  .services-section[data-vav-sequence] .services-list article:not(.is-active) .service-stitch-canvas{
    display:none!important;
    opacity:0!important;
  }

  /* Detach Cases from Clients with intentional light breathing room. */
  .clients-section{
    margin-bottom:18px!important;
  }
  .clients-section + .cases-section{
    margin-top:0!important;
    border-top:0!important;
  }
}


/* v24 — desktop services rail cleanup + unified moving client substrate. */
@media(min-width:901px){

  /* SERVICES: remove the old vertical rail and every active plaque. */
  .services-section[data-vav-sequence] .services-list{
    border:0!important;
    border-left:0!important;
    border-right:0!important;
    border-top:0!important;
    border-bottom:0!important;
    background:transparent!important;
    box-shadow:none!important;
  }
  .services-section[data-vav-sequence] .services-list::before,
  .services-section[data-vav-sequence] .services-list::after{
    content:none!important;
    display:none!important;
  }
  .services-section[data-vav-sequence] .services-list article,
  .services-section[data-vav-sequence] .services-list article.is-active{
    display:flex!important;
    align-items:center!important;
    justify-content:flex-start!important;
    gap:22px!important;
    min-height:104px!important;
    height:104px!important;
    padding:0!important;
    margin:0!important;
    opacity:1!important;
    transform:none!important;
    border:0!important;
    outline:0!important;
    background:transparent!important;
    background-color:transparent!important;
    background-image:none!important;
    box-shadow:none!important;
    -webkit-backdrop-filter:none!important;
    backdrop-filter:none!important;
  }
  .services-section[data-vav-sequence] .services-list article::before,
  .services-section[data-vav-sequence] .services-list article::after,
  .services-section[data-vav-sequence] .services-list article.is-active::before,
  .services-section[data-vav-sequence] .services-list article.is-active::after{
    content:none!important;
    display:none!important;
  }

  /* Circle and text share the exact same row center. */
  .services-section[data-vav-sequence] .services-list article>span{
    position:relative!important;
    left:auto!important;
    top:auto!important;
    flex:0 0 44px!important;
    width:44px!important;
    height:44px!important;
    margin:0!important;
    transform:none!important;
    align-self:center!important;
  }
  .services-section[data-vav-sequence] .services-list article:not(.is-active)>span{
    width:44px!important;
    height:44px!important;
    border:1px solid rgba(9,9,9,.18)!important;
    background:transparent!important;
    box-shadow:none!important;
  }
  .services-section[data-vav-sequence] .services-list article:not(.is-active) .service-stitch-canvas{
    display:none!important;
  }
  .services-section[data-vav-sequence] .services-list article.is-active>span{
    border:0!important;
    background:transparent!important;
    box-shadow:none!important;
  }
  .services-section[data-vav-sequence] .services-list article h3,
  .services-section[data-vav-sequence] .services-list article.is-active h3{
    position:relative!important;
    left:auto!important;
    right:auto!important;
    top:auto!important;
    bottom:auto!important;
    width:auto!important;
    max-width:300px!important;
    margin:0!important;
    padding:0!important;
    transform:none!important;
    align-self:center!important;
    text-align:left!important;
    color:#111!important;
    background:transparent!important;
    background-image:none!important;
    box-shadow:none!important;
    line-height:1!important;
  }

  /* CLIENTS: PA-054 is one full-height moving plane.
     "НАШИ КЛИЕНТЫ" stays fixed on top of that same plane. */
  .clients-section{
    position:relative!important;
    isolation:isolate!important;
    height:118px!important;
    min-height:118px!important;
    margin:0!important;
    padding:0!important;
    overflow:hidden!important;
    border:0!important;
    background:#f2f0e9!important;
  }
  .clients-section::before,
  .clients-section::after{
    content:none!important;
    display:none!important;
  }
  .clients-title{
    position:absolute!important;
    z-index:5!important;
    left:max(24px,calc((100vw - var(--vav-max))/2))!important;
    top:18px!important;
    width:auto!important;
    margin:0!important;
    padding:0!important;
    color:#171717!important;
    background:transparent!important;
    pointer-events:none!important;
  }
  .clients-row{
    position:absolute!important;
    z-index:1!important;
    inset:0!important;
    width:100%!important;
    max-width:none!important;
    height:118px!important;
    min-height:118px!important;
    margin:0!important;
    padding:0!important;
    overflow:hidden!important;
    background:transparent!important;
    -webkit-mask-image:none!important;
    mask-image:none!important;
  }
  .clients-knit-track{
    display:flex!important;
    align-items:stretch!important;
    width:max-content!important;
    height:118px!important;
    min-height:118px!important;
    margin:0!important;
    padding:0!important;
    gap:0!important;
    animation:vavClientStrip 26s linear infinite!important;
    will-change:transform!important;
  }
  .clients-knit-track img{
    display:block!important;
    flex:0 0 auto!important;
    width:auto!important;
    height:118px!important;
    max-width:none!important;
    margin:0 -1px 0 0!important;
    padding:0!important;
    object-fit:fill!important;
    opacity:1!important;
    filter:none!important;
    mix-blend-mode:normal!important;
  }
}


/* v25 — remove overlapping Cases subtitle. */
.cases-section .section-head>p:last-child{
  display:none!important;
}


/* v26 — real VAV clients: code-built monochrome wordmark rail.
   Title is static. No raster strip, no pauses, no gaps between loops. */
.clients-section{
  position:relative!important;
  isolation:isolate!important;
  overflow:hidden!important;
  margin:0!important;
  border:0!important;
  background:var(--vav-light-knit)!important;
}
.clients-section::before{
  content:""!important;
  display:block!important;
  position:absolute!important;
  inset:0!important;
  z-index:0!important;
  pointer-events:none!important;
  background-image:url("./production-assets/PA-050_TEXTILE_ASSORTMENT_ENV_MASTER.webp")!important;
  background-position:center!important;
  background-size:var(--vav-light-knit-size) auto!important;
  background-repeat:repeat!important;
  opacity:.22!important;
}
.clients-section>*{position:relative!important;z-index:1!important}
.clients-title{
  position:absolute!important;
  z-index:5!important;
  left:max(24px,calc((100vw - var(--vav-max))/2))!important;
  top:16px!important;
  width:auto!important;
  margin:0!important;
  padding:0!important;
  color:#121212!important;
  background:transparent!important;
  font-size:11px!important;
  line-height:1!important;
  letter-spacing:.18em!important;
  text-transform:uppercase!important;
  pointer-events:none!important;
}
.clients-row{
  position:relative!important;
  width:100%!important;
  max-width:none!important;
  height:126px!important;
  min-height:126px!important;
  margin:0!important;
  padding:42px 0 0!important;
  overflow:hidden!important;
  background:transparent!important;
  -webkit-mask-image:none!important;
  mask-image:none!important;
}
.clients-knit-track{display:none!important}
.clients-real-track{
  display:flex!important;
  align-items:center!important;
  width:max-content!important;
  height:72px!important;
  margin:0!important;
  padding:0!important;
  will-change:transform!important;
  animation:vavRealClients 34s linear infinite!important;
}
.client-logo-group{
  display:flex!important;
  align-items:center!important;
  flex:none!important;
  gap:48px!important;
  padding-right:48px!important;
}
.client-logo{
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  flex:none!important;
  height:52px!important;
  color:#0b0b0b!important;
  white-space:nowrap!important;
  line-height:.9!important;
  text-rendering:geometricPrecision;
  -webkit-font-smoothing:antialiased;
}
.client-logo-main{display:block!important}
.client-logo-sub{
  display:block!important;
  margin-top:3px!important;
  font-size:8px!important;
  line-height:1!important;
  letter-spacing:.13em!important;
  text-align:center!important;
}
.client-logo--azbuka{
  font-family:Georgia,"Times New Roman",serif!important;
  font-size:21px!important;
  font-weight:700!important;
  letter-spacing:-.03em!important;
}
.client-logo--rzd{
  font-size:31px!important;
  font-weight:900!important;
  letter-spacing:-.07em!important;
  transform:scaleX(1.08)!important;
}
.client-logo--sunlight{
  font-size:22px!important;
  font-weight:800!important;
  letter-spacing:.08em!important;
}
.client-logo--okko{
  font-size:29px!important;
  font-weight:900!important;
  letter-spacing:-.08em!important;
}
.client-logo--xfit{
  font-size:27px!important;
  font-weight:900!important;
  font-style:italic!important;
  letter-spacing:-.04em!important;
}
.client-logo--agrotech{
  font-size:21px!important;
  font-weight:800!important;
  letter-spacing:.035em!important;
}
.client-logo--ozon{
  font-size:29px!important;
  font-weight:900!important;
  letter-spacing:-.055em!important;
}
.client-logo--mybusiness{
  flex-direction:column!important;
  align-items:center!important;
  font-size:18px!important;
  font-weight:900!important;
  letter-spacing:.01em!important;
}
.client-logo--x5{
  font-size:29px!important;
  font-weight:900!important;
  letter-spacing:-.055em!important;
}
.client-logo--raif{
  font-size:20px!important;
  font-weight:800!important;
  letter-spacing:-.025em!important;
}
.client-logo--lenta{
  font-size:25px!important;
  font-weight:900!important;
  letter-spacing:.02em!important;
}
.client-logo--infalve{
  font-size:22px!important;
  font-weight:800!important;
  letter-spacing:.09em!important;
}
.client-logo--rbc{
  font-size:30px!important;
  font-weight:900!important;
  letter-spacing:-.04em!important;
}
@keyframes vavRealClients{
  to{transform:translate3d(-33.333333%,0,0)}
}

@media(max-width:900px){
  .clients-section{
    height:104px!important;
    min-height:104px!important;
  }
  .clients-title{
    left:18px!important;
    top:12px!important;
    font-size:9px!important;
  }
  .clients-row{
    height:104px!important;
    min-height:104px!important;
    padding-top:32px!important;
  }
  .clients-real-track{
    height:66px!important;
    animation-duration:30s!important;
  }
  .client-logo-group{
    gap:34px!important;
    padding-right:34px!important;
  }
  .client-logo{
    height:44px!important;
    transform-origin:center center!important;
  }
  .client-logo--azbuka{font-size:17px!important}
  .client-logo--rzd{font-size:25px!important}
  .client-logo--sunlight{font-size:18px!important}
  .client-logo--okko{font-size:23px!important}
  .client-logo--xfit{font-size:22px!important}
  .client-logo--agrotech{font-size:17px!important}
  .client-logo--ozon{font-size:23px!important}
  .client-logo--mybusiness{font-size:15px!important}
  .client-logo--x5{font-size:23px!important}
  .client-logo--raif{font-size:16px!important}
  .client-logo--lenta{font-size:20px!important}
  .client-logo--infalve{font-size:18px!important}
  .client-logo--rbc{font-size:24px!important}
  .client-logo-sub{font-size:6.5px!important}
}

@media(prefers-reduced-motion:reduce){
  .clients-real-track{animation:none!important}
}