cssfish

не "с паддингами и маржинами", а "ширина+ бордер+паддинг"
используют в фреймворках для всего подряд, чтоб юзеры, не знающие css, мозг не парили лишний раз.
стоит ли делать - дело ваше.

дык делаешь блок поверх всей карусели и кладешь текст туда.
absolute & z-index в помощь

например так:
-левая статична, ширина ~ 75% от общей
- правая поверх нее, (отступ слева точно меряем до нижней точки, можно в %), далее skew и transform-origin: 0 100%
- картинку/фон внутри правой обратным skew с transform-origin нижним
- ну и overflow само собой на контейнер
все.

каждый набор
<img src="/img/1.png"><p>Текст 1</p><p>Текст 2</p>
заверните в див и его уже инлайн-блоком используйте

судя по коду, это не svg. там png в base64, завернутый в svg - в общем, толку мало от него

названия к бэму не относятся, называйте как хотите. бэм предполагает только соглашение об именовании элементов и модификаторов (разделители)

обычным методом - применить к ним стили

<circle cx="70" cy="95" r="50" style="stroke: black; fill: none" />

олдскул метод
https://jsfiddle.net/g49su6bo/

это общая проблема, неспособность концентрироваться на одной задаче.
справиться - удалять отвлекающие факторы, как ни банально. отключить инет, убрать все вкладки кроме рабочей.
причина тут такова, что комфортно очень и на волевых не выедешь. мозг знает, что есть чаек и труба,чего напрягаться-то? ))

анимируйте scale для контейнера, с фоном в cover вы ничего не наанимируете.

тут можно без скрипта вообще, корневой обертке изначально дать overflow:hidden и не парить мозг

ну так и рисуйте исходя из стандартного 1920*1080.
картинка ваша фоновая в режим cover пойдет, а то что в центре нормальный верстальщик соответственно и спозиционирует.

что за наркомания? дайте ему посмотреть или сделайте демку, да.
ясное дело, что размеры на устройствах отличаются, но диз имхо под ретиной понимает что-то не то

upd: короче смешалось в кучу все. вы про ретину, диз вам про масштабирование "от шрифта".
на "телефоне с hdpi" мельче, чем на iphone5, потому что на телефоне (напр nexus7) может быть 600px (логических) в ширину, а на айфоне этом их - 320. В 600 входит поболее чем в 320, а трамбуется все это дело в "лопаты" примерно равного размера (чтоб в ладонь влезло, условно).

в общем, не валите все в одну кучу.

Насколько помню, прикол там в том, что нет однозначного события - что мол, загружено 100%!
Есть всякие canplay, которые только рапортуют, что что можно показывать (закешил достаточно).
Есть всякие буферы (которых может быть несколько - если например потыкали мышкой по таймлайну) - и грузиться они могут параллельно.
Так что приходится либо думать, как они, либо извращаться, сверять например duration и buffered...

1. сделать блок 1-к-1 без всяких cover
2. наложить огонь
3. берем размер экрана (или блоку куда это запихаем), смотрим соотношение сторон.
4. масштабируем блок чтоб входил по нужной стороне (scale) и центрируем (позиционированием)
5. лишнее должна зарезать обертка с overflow

короче говоря - эмулируем cover олдскульными методами, но задачу решаем ))

версия portable?
в каком порядке ставили?
через менеджер или руками?