.divider {
	position: relative;
	height: 100vh;
	background-color: var(--color-black);
	overflow: hidden;
}

.divider__text {
	position: absolute;
	top: 8vh; /* от высоты вьюпорта, не от фиксированного rem — не «уезжает» за экран на невысоких окнах */
	left: 50%;
	width: 221.8rem;
	transform: translateX(-50%);
	display: flex;
	flex-direction: column;
}

.divider__line {
	height: 24rem;
	font-family: var(--font-family-base);
	font-size: 24rem;
	line-height: 1;
	font-weight: 700;
	letter-spacing: 0;
	text-align: center;
	color: var(--color-accent);
	mix-blend-mode: plus-lighter;
}

.divider__letter {
	display: inline-block;
}

.divider__helicopter {
	position: absolute;
	top: calc(8vh + 10.65rem); /* центр вертолёта = центр 2-й строки текста ("вертолёты"):
	                              8vh (top текста) + 24rem (1-я строка) + 12rem (центр 2-й) − 25.35rem (половина высоты вертолёта) */
	left: 50%;
	width: 79.1rem;
	height: 50.7rem;
	transform: translateX(-50%);
	display: flex;
	align-items: center;
	justify-content: center;
	z-index: 1;
}

.divider__helicopter-image {
	width: 50.7rem;
	height: 79.1rem;
	max-width: none;
}

@media (max-width: 1360px) {
	.divider__line {
		height: 12.8rem;
		font-size: 12.8rem;
	}

	.divider__text {
		top: 8vh;
		width: 118.2933rem;
	}

	.divider__helicopter {
		top: calc(8vh + 5.7rem); /* центр = центр 2-й строки: 8vh + 12.8rem + 6.4rem − 13.5rem */
		width: 42.2rem;
		height: 27rem;
		transform: translateX(-50%);
	}

	.divider__helicopter-image {
		width: 27rem;
		height: 42.2rem;
	}
}

@media (min-width: 481px) and (max-width: 1360px) {
	.divider__text {
		top: 50%;
		transform: translate(-50%, -50%);
	}

	.divider__helicopter {
		top: 50%;
		transform: translate(-50%, -50%);
	}
}

@media (max-width: 480px) {
	/* Фиксированная 100vh, не auto+min-height — секция теперь пинится (pin+scrub
	   GSAP, см. divider-scroll.js), для scroll-trigger нужна предсказуемая высота
	   триггера, а не «столько, сколько влезло». */
	.divider {
		height: 100vh;
	}

	.divider__line {
		height: 3.6rem;
		font-size: 3.6rem;
	}

	.divider__text {
		top: 6rem;
		left: 0;
		width: 100%;
		transform: none;
		padding-inline: var(--side-padding-mobile);
	}

	/* top — центрирует не контейнер, а САМУ КАРТИНКУ (визуальный вертолёт) в
	   свободном месте под текстом: искомый top картинки = text_bottom(16.8rem) +
	   (100vh − text_bottom − высота_картинки(36.3rem))/2 = 50vh − 9.75rem. Но
	   .divider__helicopter-image (36.3rem) выше своего контейнера (22.2rem) и
	   центрируется В НЁМ через align-items:center — значит картинка физически
	   выступает за верх контейнера на (36.3−22.2)/2 = 7.05rem. Чтобы ВИДИМАЯ
	   картинка оказалась на посчитанной высоте, контейнеру нужно на 7.05rem
	   больше: 50vh − 9.75rem + 7.05rem = 50vh − 2.7rem. Первая версия формулы
	   не учитывала этот сдвиг и центрировала контейнер, а не картинку — вертолёт
	   стоял на ~76px выше, чем должен, отступ снизу оставался заметно больше
	   отступа сверху.

	   Размер — по Figma-спеке (дев-инспектор, bounding box повёрнутого кадра
	   ≈363×222 при опорной ширине 360 — раз кадр в развороте на ~90°, «в покое»
	   портретный размер ≈222×363, т.е. примерно ×1.5 к тому, что было). Контейнер —
	   те же размеры, что у картинки, но местами width/height (тот же приём, что и
	   на десктопе/таблете: даёт вращающемуся изображению место при любом угле
	   поворота, не привязано к какому-то одному состоянию анимации). */
	.divider__helicopter {
		top: calc(50vh - 2.7rem);
		width: 36.3rem;
		height: 22.2rem;
		transform: translateX(-50%);
	}

	.divider__helicopter-image {
		width: 22.2rem;
		height: 36.3rem;
	}
}