Варлам Ерофеич

В приведенном примере это просто позиционированная картинка
https://rarible.com/public/7deac157de95faddd820.png

Codepen

.cart-finished-house{
    bottom: 15%;
    transition: bottom easy 0.5s;
}

.cart-finished-house:hover{
    bottom: 1%;
    box-shadow: 0 .5rem 1rem rgba(0,0,0,.15)!important;
}

Школьнику главное не пить алкоголь, не курить и хорошо учиться. Это самое важное, самое главное, на чем нужно сфокусироваться.
Это ваша самая крутая, самая выгодная инвестиция. Сохранив мозг здоровым и умным, вы сможете опережать своих сверстников во взрослой жизни. У вас будет выше зарплата. Вы дольше и лучше проживете.
Например, вы чуточку умнее своих коллег. Вместо 50т.р вы будете получать 60т.р. И тогда каждый год вы сможете дополнительно иметь 120т.р., т.е. раз в год покупать самый-самый новый iPhone просто так.

Можно. Используй @keyframes для смены изображений.
Вот пример.

Анимация анимации рознь
Есть сложные анимации , где пытаются оживить то что в нативной техники анимации SMIL не возможно сделать и тогда применяют уже всякие приёмчики на подобии Рисуют в Люстре и сохраняют как AI и открывают в Adobe After Effects в который заранее устанавливают Bodymovin и тот генерирует уже просто json файл где на выходе мы можем получить вот такие анимации

Если же касается просто Smil то особо напрягаться не стоит лишь бы было одинаковое количество точек и эти точки равномерно куда распихать , как правило хватает обычного Inkscape

Бывает щас Gsap который пока халявный но это до поры до времени
Есть AnimeJs который тоже не плохо справляется
так же много всяких плагинов на js которые именно делают анимацию ..
на youtube кучу примеров и уроков по любой технологии

Так же есть сообщества типа Toster и stackoverlow (рекомендую англоязычное сообщество) где есть энтузиасты готовы рассказать что и как нажать что бы эта плюшка заработала

Но главное понимать что конкретно надо сделать

Чтобы к элементам SVG применялись стили и прочие DOM-манипуляции, SVG должен быть включен в DOM.
Это делается либо непосредственно выводом его в код страницы, либо вставкой внешнего файла, но не через теги img / object, а через JS-библиотеку типа такой: keith-wood.name/svg.html

Хак вам уже посоветовали, а я добавлю, что даже если бы CSS мог влиять на содержимое object, ваш код не работал бы в любом случае. Вы ведь пытаетесь изменить свойства object.big и object.small, что возможно только относительно их размера. А для изменения свойств фигур, селектор должен был бы выглядеть как .small svg * или . small rect, например. Потому что свойства в SVG, один чёрт, не наследуются.

Вот:
Плагин1
Плагин2

Нет. Это conic-gradient, но у него с поддержкой пока печально.

Вот почитайте
https://blog.logrocket.com/new-in-chrome-69-buildi...