/* ======================================
   ROCKET BACK TO TOP – CINEMATIC
   Nechev | phpBB Bulgaria
====================================== */

#rocket-top {
	position: fixed;
	right: 28px;
	bottom: 40px;

	width: 48px;
	height: 82px;

	background: url('./images/rocket.png') center/contain no-repeat;

	z-index: 9999;
	cursor: pointer;

	opacity: 0;
	transform: translateY(20px) scale(0.9);
	pointer-events: none;

	transition:
		opacity .6s ease,
		transform .6s cubic-bezier(.25,.8,.25,1);
}

/* === Showing up === */
#rocket-top.show {
	opacity: 1;
	transform: translateY(0) scale(1);
	pointer-events: auto;
}

/* Hover */
#rocket-top:hover {
	filter: drop-shadow(0 0 14px rgba(255,120,0,.9));
	transform: scale(1.08);
}

/* ===============================
   IDLE FLOAT 
================================ */
#rocket-top.show:not(.fly) {
	animation: rocket-float 1.8s ease-in-out infinite;
}

@keyframes rocket-float {
	0%   { transform: translateY(0) scale(1); }
	50%  { transform: translateY(-10px) scale(1); }
	100% { transform: translateY(0) scale(1); }
}

/* ===============================
   FIRE 
================================ */
#rocket-top::after {
	content: '';
	position: absolute;
	left: 50%;
	bottom: -26px;
	transform: translateX(-50%);
	width: 18px;
	height: 28px;

	background: radial-gradient(circle, #ffff00 0%, #ff9900 40%, #ff0000 75%);
	border-radius: 50%;

	opacity: 0;
}

/* Active fire */
#rocket-top.fly::after {
	opacity: 1;
	animation: flame-flicker .12s infinite alternate;
}

@keyframes flame-flicker {
	from { height: 20px; }
	to   { height: 34px; }
}

/* ===============================
   LAUNCH 
================================ */
#rocket-top.fly {
	animation: rocket-launch 1s ease-in forwards;
	pointer-events: none;
}

@keyframes rocket-launch {
	to {
		transform: translateY(-140vh) scale(0.9);
		opacity: 0;
	}
}