<style>
/*код подходит для блоков категории «Магазин»*/
.js-product-img:hover { 
        border-radius: 300px; /*закруглить углы на 300px — до формы круга*/
        --smooth-corners: 3;  /*со сглаживанием 3*/
        transition: border-radius 0.5s ease-out; /*за полсекунды*/
    }

.js-product-img {
       border-radius: 15px; /*вернуться к закруглению 15px*/
       transition: border-radius 0.5s ease-out;  /*за полсекунды*/
   }

/*кусочек кода, чтобы картинка в поп-апе не закруглялась*/
.t-slds__bgimg:hover { 
      border-radius: 15px;
   }
</style>

<style>
/*код подходит для блоков категории «Потоки»*/

.t-feed__post-bgimg:hover { 
        border-radius: 50px; /*закруглить углы на 50px*/
        --smooth-corners: 3; /*со сглаживанием 3*/
        transition: border-radius 0.2s ease-out; /*за 0.2 секунды*/
    }

.t-feed__post-bgimg {
       border-radius: 15px; /*вернуться к закруглению 15px*/
       transition: border-radius 0.2s ease-out; /*за 0.2 секунды*/
    }
</style>

<style>
/*код подходит для шейпов в Zero Block, не забудьте добавить им класс*/

<style>
.shape .tn-atom:hover {
        border-radius: 20px !important; /*закруглить углы на 20px у второго и третьего шейпов*/
        transition: border-radius 0.5s !important; /*за 0.5 секунд*/
        --smooth-corners: 3; /*со сглаживанием 3*/
    }
    
.shape .tn-atom {
        transition: border-radius 0.5s ease-out !important; /*за 0.5 секунд прийти к начальному состоянию*/
    }
    
 /*если хотим не скруглить, а «раскруглить» углы*/

 .shape-4 .tn-atom:hover, .shape-1 a:hover {
        border-radius: 0px !important; /*сделать острые углы у первого и четвертого шейпа*/
        transition: border-radius 0.5s !important; /*за 0.5 секунд*/
    }

.shape-4 .tn-atom, .shape-1 .tn-atom {
    border-radius: 20px; /*изначальное состояние — скругленные углы на 20px*/
    --smooth-corners: 3; /*сглаживание 3*/
    transition: border-radius 0.5s !important; /*за 0.5 секунд*/
}

/*закруглить углы на 50px*/
        --smooth-corners: 3; /*со сглаживанием 3*/
        transition: border-radius 0.2s ease-out; /*за 0.2 секунды*/
    
</style>

<style>
/*закругляем углы у аккордеона, блок TX15N2*/
.t668__wrapper:hover { 
        border-radius: 50px; /*закруглить углы на 50px*/
        --smooth-corners: 3; /*со сглаживанием 3*/
        transition: border-radius 0.2s ease-out; /*за 0.2 секунды*/
    }

.t668__wrapper {
       border-radius: 15px; /*вернуться к закруглению 15px*/
       transition: border-radius 0.2s ease-out; /*за 0.2 секунды*/
    }
</style>

<style>
/*закругляем углы у кнопок, блок SM103*/
.t1036__btn:hover { 
        border-radius: 50px; /*закруглить углы на 50px*/
        --smooth-corners: 3; /*со сглаживанием 3*/
        transition: border-radius 0.2s ease-out; /*за 0.2 секунды*/
    }

.t1036__btn {
       border-radius: 15px; /*вернуться к закруглению 15px*/
       transition: border-radius 0.2s ease-out; /*за 0.2 секунды*/
    }
</style>