.carousel-logos::-webkit-scrollbar
 {
     width: 0
 }

/* Кнопки-логотипы */
.carousel-logo-btn
{
    width: var(--size, 30px);
    height: var(--size, 30px);
    border-radius: 50%;
    background: #FFF;
    border: none;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 12px 0;
    transition: all 1s ease;
    cursor: pointer;
}

.carousel-logo-btn.active::before
{
    content: '';
    inset: -6px;
    position: absolute;
    border-radius: 50%;
    border: 1px solid #000;
}

.carousel-logo-btn.active img
{
    opacity: 1;
    filter: none
}

[data-framer-name="cms-carousel-2"]
{
    position: relative !important;
    width: 100% !important;
    min-height: 450px !important;
    right: -160px;
}

[data-framer-name="cms-slide-2"]
{
    position: absolute !important;
    inset: 0 !important;
    opacity: 0 !important;
    pointer-events: none !important;
    transition: opacity .5s ease !important;
}

[data-framer-name="cms-slide-2"].active
{
    position: relative !important;
    opacity: 1 !important;
    pointer-events: auto !important;
    z-index: 2 !important;
}

.carousel-logo-btn
{
    position: absolute;
    transform: translate(-50%, -50%);
    transition: all .5s ease;
}

.carousel-logos::-webkit-scrollbar
{
    width: 0
}

.framer-194ry1k
{
    height: 428px
}

.framer-7JDQ7 .framer-1ullhlt, .framer-7JDQ7 .framer-1xkj70p
{
    width: 837px !important
}
/* Слайд — два столбца рядом */
[data-framer-name="cms-slide-2"]{
    display:flex !important;
    align-items:center !important;
    gap:40px !important;
}

/* Опционально: выравнивание текста у "текстовой" колонки */
[data-framer-name="cms-slide-2"] > * { text-align: left; }
[data-framer-name="cms-slide-2"].reverse > * { text-align: right; }
[data-framer-name="cms-slide-2"].reverse
> .framer-aen6oq {
    justify-content: space-between !important;
}

[data-framer-name="cms-slide-2"].reverse
> .framer-aen6oq
> .ssr-variant
> .framer-19y9uoq {
    /* твои стили */
    order: 2 !important;
}


@media only screen and (max-width: 1400px) {
    .carousel-logos {
        left: -520px;
    }
    .framer-7JDQ7 .framer-1i0k6kr, .framer-7JDQ7 .framer-8x1qva {
        max-width: 818px;
    }
    [data-framer-name="cms-carousel-2"]
    {
        right: -148px;
    }
}

@media only screen and (max-width: 1380px) {
    [data-framer-name="cms-carousel-2"]
    {
        right: 0;
    }

    .carousel-logos {
        left: 0;
        top: 68px;
    }
}

@media only screen and (min-width: 810px) {

    @keyframes come-in {
        from {
            transform: translateY(20%)
        }
    }

    [data-framer-name="cms-slide-2"].active
    {
        animation: come-in .8s
    }

    [data-framer-name="cms-carousel-2"]
    {
        position: relative;
        z-index: 1;
    }

    [data-framer-name="cms-carousel-2"]::before
    {
        content: '';
        width: 808px;
        aspect-ratio: 836/588;
        position: absolute;
        top: 50%;
        left: 50%;
        transform: translate(-50%, -50%);
        background-image: url("https://framerusercontent.com/images/jxT2n8FMCeGtQ58rmi96SEsQAPs.svg?width=836&height=588");
        background-position: center center;
        background-repeat: no-repeat;
        background-size: cover;
        z-index: 0;
    }
}

@media only screen and (max-width: 809px) {
    [data-framer-name="cms-slide-2"].reverse
    > .framer-aen6oq {
        justify-content: start !important;
    }

    [data-framer-name="cms-slide-2"].reverse
    > .framer-aen6oq
    > .ssr-variant
    > .framer-19y9uoq {
        /* твои стили */
        order: initial !important;
    }
}

 /* === DESKTOP: логотипы слева в 2 колонки + стрелки === */
 @media (min-width: 1381px) {

     .carousel-logo-btn img {
         width: 70%;
         filter: grayscale(1);
         opacity: .55;
         transition: .25s ease;
     }

     .carousel-logo-btn.active img {
         filter: none;
         opacity: 1;
     }

     /* убираем "кольцо" вокруг активной (оно было под круг) */
     .carousel-logo-btn.active::before {
         content: none !important;
     }

     .carousel-nav button {
         width: 42px;
         height: 42px;
         border-radius: 999px;
         border: 1px solid rgba(0,0,0,0.08);
         background: rgba(255,255,255,0.9);
         box-shadow: 0 8px 18px rgba(0,0,0,0.08);
         cursor: pointer;
         display:flex;
         align-items:center;
         justify-content:center;
     }

     .carousel-nav button:hover {
         transform: translateY(-1px);
     }
 }
 .carousel-nav{
     left: 0 !important;
     z-index: 10000 !important;
 }

 /* Панель слева: 2 колонки × 9 рядов = 18 видимых */
 @media (min-width: 1381px){
     .carousel-logos{
         position:absolute;
         top:59%;
         left:140px;
         transform:translateY(-50%);
         width:292px;
         height:512px;
         padding-top:18px;
         padding-left:18px;
         overflow:hidden;
         z-index:9999;
     }

     /* внутренняя "лента", которую крутим */
     .carousel-logos-inner{
         display:grid;
         grid-template-columns: repeat(2, 1fr);
         gap:12px;
         will-change: transform;
     }

     .carousel-logo-btn{
         position:relative !important;
         left:auto !important;
         top:auto !important;
         transform:none !important;
         width:126px;
         height:52px;
         border-radius:10px;
         padding:10px;
         background: rgba(255, 255, 255, 0.80);
         box-shadow: 6.76px 16.64px 5.2px 0 rgba(55, 40, 77, 0.00), 4.16px 10.92px 4.68px 0 rgba(55, 40, 77, 0.01), 2.6px 6.24px 3.64px 0 rgba(55, 40, 77, 0.05), 1.04px 2.6px 3.12px 0 rgba(55, 40, 77, 0.09), 0.52px 0.52px 1.56px 0 rgba(55, 40, 77, 0.10);         cursor:pointer;
         transition:.25s ease;
     }

     .carousel-logo-btn{
         will-change: transform;
         transform-origin: center;
         backface-visibility: hidden;
         transform: translateZ(0) scale(.9);
         transition: transform .3s ease, opacity .3s ease;
     }


     .carousel-logo-btn img{
         width:70%;
         height:auto;
         object-fit:contain;
         filter:grayscale(1);
         opacity:.55;
         transition:.25s ease;
     }

     .carousel-logo-btn.active{
         opacity:1;
         background: #fff;
         box-shadow: 10.4px 67.08px 19.24px 0 rgba(0, 0, 0, 0.00), 6.76px 43.16px 17.16px 0 rgba(0, 0, 0, 0.01), 3.64px 24.44px 14.56px 0 rgba(0, 0, 0, 0.05), 1.56px 10.92px 10.92px 0 rgba(0, 0, 0, 0.09), 0.52px 2.6px 6.24px 0 rgba(0, 0, 0, 0.10);
     }
     .carousel-logo-btn.active img{
         filter:none;
         opacity:1;
     }
     .carousel-logo-btn.active::before{ content:none !important; }

     .carousel-nav button{
         width:42px;height:42px;
         border-radius:999px;
         border:1px solid rgba(0,0,0,.08);
         background:rgba(255,255,255,.9);
         box-shadow:0 8px 18px rgba(0,0,0,.08);
         cursor:pointer;
         display:flex;align-items:center;justify-content:center;
     }
 }
 .carousel-nav{
     position: absolute !important;     /* чтобы точно не резалось контейнерами */
     left: 96px !important;
     top: 59% !important;
     transform: translateY(-50%) !important;
     z-index: 2147483647 !important;
     display: flex !important;
     flex-direction: column !important;
     gap: 14px !important;
 }

 @media (min-width: 1381px){
     .carousel-logo-btn.edge{
         opacity: 0.3 !important;
         background: rgba(255, 255, 255, 0.80) !important;
     }
 }
 /* чтобы логотипы никогда не вылезали */
 .carousel-logo-btn{
     overflow: hidden;          /* обрезаем всё, что вылезло */
 }

 .carousel-logo-btn img{
     width: auto !important;    /* убираем фикс 70% */
     height: auto !important;

     max-width: 85% !important; /* ограничиваем по ширине */
     max-height: 70% !important;/* и по высоте (ключевое!) */

     object-fit: contain;
     display: block;
 }

 /* контейнер должен быть relative */
 [data-framer-name="cms-carousel-2"]{
     position: relative !important;
 }

 /* контейнер прогресса (белая капсула) */
 .carousel-progress{
     position: absolute;
     right: 261px;               /* как выносили */
     top: 45%;
     transform: translateY(-50%);

     width: 22px;                /* ширина белой капсулы */
     height: 106px;              /* высота */
     border-radius: 999px;
     background: #fff;

     box-shadow: 0 10px 24px rgba(0,0,0,0.06);
     z-index: 999999;
 }

 /* серая дорожка */
 .carousel-progress::before{
     content:"";
     position:absolute;
     left: 50%;
     top: 8px;
     transform: translateX(-50%);

     width: 6px;                /* толщина дорожки */
     height: calc(100% - 16px);  /* отступы сверху/снизу */
     border-radius: 999px;
     background: rgba(0,0,0,0.10);
 }

 .carousel-progress__thumb{
     position:absolute;
     left: 50%;
     top: 20px;                 /* старт сверху дорожки */
     transform: translateX(-50%);

     width: 6px;
     height: 0;                 /* старт с 0 */
     border-radius: 999px;
     background: #0b0b0b;
     z-index: 2;
 }


 [data-framer-name="cms-carousel-2"]{
     position: relative !important;
     overflow: visible !important; /* ✅ иначе right:-32px обрежется */
 }

 /* делаем slide flex-контейнером */
 [data-framer-name="cms-slide-2"]{
     display: flex !important;
     align-items: center !important;
     gap: 40px;
 }

 /* по умолчанию */
 [data-framer-name="cms-slide-2"] .framer-1wjmfzr{
     order: 1; /* картинка */
 }

 [data-framer-name="cms-slide-2"] .framer-y98pss{
     order: 2; /* контент */
 }

 /* reverse карточка */
 [data-framer-name="cms-slide-2"].reverse .framer-1wjmfzr{
     order: 2;
 }

 [data-framer-name="cms-slide-2"].reverse .framer-y98pss{
     order: 1;
 }

 @media (max-width: 1380px){

     /* slide становится колонкой */
     [data-framer-name="cms-slide-2"]{
         flex-direction: column !important;
         gap: 24px; /* можешь уменьшить */
     }

     /* убираем reverse */
     [data-framer-name="cms-slide-2"].reverse .framer-1wjmfzr{
         order: initial !important;
     }

     [data-framer-name="cms-slide-2"].reverse .framer-y98pss{
         order: initial !important;
     }

     .carousel-progress{
         display: none !important;
     }

 }

 @media (max-width:1380px){
     .carousel-mobile-logos{
         display:flex;
         overflow-x:auto;
         -webkit-overflow-scrolling: touch;
         scroll-snap-type: x mandatory;
         padding: 6px 16px 18px;
         justify-content:flex-start;
         gap: 12px;
     }
     .carousel-mobile-logos::-webkit-scrollbar{ height:0; }

     .carousel-mobile-logo{
         flex: 0 0 auto;
         scroll-snap-align: center;
         height: 52px;
         width: 126px;
         padding: 10px 18px;
         border:none;
         border-radius: 10px;
         background:#fff;
         box-shadow: 0 10px 8px rgba(0,0,0,0.10);
         display:flex;
         align-items:center;
         justify-content:center;
         opacity:.45;
         /*transform: scale(.9);*/
         transition: .25s ease;
     }

     .carousel-mobile-logo img{
         height: 22px;
         width:auto;
         max-width: 100%;
         object-fit: contain;
         filter: grayscale(1);
         opacity: .7;
     }

     .carousel-mobile-logo.active{
         opacity:1;
     }
     .carousel-mobile-logo.active img{
         filter:none;
         opacity:1;
     }

     .carousel-mobile-logos{
         display:flex;
         overflow-x:auto;
         -webkit-overflow-scrolling: touch;

         /* 🔥 убираем scrollbar */
         scrollbar-width: none;          /* Firefox */
         -ms-overflow-style: none;       /* IE/Edge */
     }

     .carousel-mobile-logos::-webkit-scrollbar{
         display: none;                  /* Chrome / Safari */
         height: 0;
     }
 }

 @media (max-width:1380px){

     /* ВАЖНО: не center, а старт, чтобы была прокрутка */
     .carousel-mobile-logos{
         display:flex;
         flex-wrap: nowrap !important;
         justify-content: flex-start !important;
         overflow-x: auto !important;
         overflow-y: hidden !important;

         padding: 6px 16px 18px;
         width: 100% !important;
         max-width: 100% !important;

         -webkit-overflow-scrolling: touch;

         /* убрать полоску */
         scrollbar-width: none;
         -ms-overflow-style: none;
     }

     .carousel-mobile-logos::-webkit-scrollbar{
         display:none;
         height:0;
     }

     /* чтобы элементы не сжимались и не “прятались” */
     .carousel-mobile-logo{
         flex: 0 0 auto !important;
         white-space: nowrap;
     }

     /* очень частая причина “вижу только часть” — родитель режет */
     [data-framer-name="cms-carousel-2"]{
         overflow: visible !important;
     }
 }

 /* контейнер вертикальных логотипов (desktop) */
 .carousel-logos{
     overflow: hidden; /* важно */
     -webkit-mask-image: linear-gradient(
             to bottom,
             transparent 0px,
             #000 28px,
             #000 calc(100% - 28px),
             transparent 100%
     );
     mask-image: linear-gradient(
             to bottom,
             transparent 0px,
             #000 28px,
             #000 calc(100% - 28px),
             transparent 100%
     );
 }

 .carousel-logos{
     -webkit-mask-image: linear-gradient(
             to bottom,
             transparent 0%,
             black 12%,
             black 88%,
             transparent 100%
     );
     mask-image: linear-gradient(
             to bottom,
             transparent 0%,
             black 12%,
             black 88%,
             transparent 100%
     );
 }