/* ============================================================
   Nejat Not Found (404) Widget
   ============================================================ */

.nejat-not-found {
	min-height: 100vh;
	display: flex;
	justify-content: center;
	align-items: center;
	overflow: hidden;
	position: relative;
	/* Full-bleed out of the Elementor column */
	width: 100vw;
	margin-left: -50vw;
	margin-right: -50vw;
	left: 50%;
	right: 50%;
}

.nejat-not-found__inner {
	text-align: center;
	padding: 2rem var(--nejat-gutter);
	position: relative;
	z-index: 1;
}

/* ── Error code ─────────────────────────────────────────── */

.nejat-not-found__error-code {
	font-size: clamp(80px, 15vw, 150px);
	font-weight: 900;
	color: #1a1a1a;
	margin: 0 0 1rem;
	line-height: 1;
	animation: nejat-nf-float 6s ease-in-out infinite;
	transition: transform 0.3s ease;
}

.nejat-not-found__error-code:hover {
	transform: scale(1.1);
}

/* ── Message ────────────────────────────────────────────── */

.nejat-not-found__message {
	font-size: clamp(18px, 2.5vw, 24px);
	color: #1a1a1a;
	margin-bottom: 2rem;
	animation: nejat-nf-fade-in-up 0.8s ease-out 0.2s both;
}

/* ── Paper-plane icon ───────────────────────────────────── */

.nejat-not-found__icon {
	width: 120px;
	height: 120px;
	margin: 2rem auto;
	cursor: pointer;
	animation: nejat-nf-wobble 3s ease-in-out infinite;
	transition: all 0.3s ease;
	filter: drop-shadow(0 10px 15px rgba(0, 0, 0, 0.12));
}

.nejat-not-found__icon svg {
	width: 7em;
	height: 7em;
	stroke: #1a1a1a; /* override HTML presentation attribute */
}

.nejat-not-found__icon:hover {
	transform: scale(1.1) rotate(-10deg);
	filter: drop-shadow(0 15px 20px rgba(0, 0, 0, 0.18));
}

/* ── CTA button — matches .nejat-top-nav__cta-btn ───────── */

.nejat-not-found__cta {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	background: transparent;
	color: #ffffff;
	text-decoration: none;
	font-size: 15px;
	font-weight: 600;
	padding: 14px 28px;
	border-radius: var(--nejat-radius);
	white-space: nowrap;
	box-shadow: 0 2px 8px rgba(0, 0, 0, 0.15);
	position: relative;
	isolation: isolate;
	overflow: hidden;
	transform: translateZ(0);
	animation: nejat-nf-fade-in-up 0.8s ease-out 0.4s both;
}

/* Dark fill layer */
.nejat-not-found__cta::before {
	content: '';
	position: absolute;
	inset: 0;
	background: #1a1a1a;
	border-radius: inherit;
	z-index: -1;
}

/* Teal circle expands from center on hover */
.nejat-not-found__cta::after {
	content: '';
	position: absolute;
	left: 50%;
	top: 50%;
	width: 400px;
	height: 400px;
	background: #4ab3c8;
	border-radius: 50%;
	transform: translate(-50%, -50%) scale(0);
	transition: transform 0.55s ease;
	pointer-events: none;
	z-index: -1;
	will-change: transform;
}

.nejat-not-found__cta:hover::after {
	transform: translate(-50%, -50%) scale(1);
}

.nejat-not-found__cta:hover {
	color: #ffffff;
	text-decoration: none;
	box-shadow: 0 4px 14px rgba(0, 0, 0, 0.2);
}

/* ── Particles / wind lines (created by JS) ─────────────── */

.nejat-not-found__particles {
	position: absolute;
	inset: 0;
	pointer-events: none;
}

.nejat-not-found__particle {
	position: absolute;
	background: #4ab3c8;
	border-radius: 50%;
	opacity: 0.6;
}

.nejat-not-found__wind-line {
	position: absolute;
	height: 2px;
	background: linear-gradient(90deg, transparent, rgba(74, 179, 200, 0.2), transparent);
	animation: nejat-nf-wind-move 8s linear infinite;
	transform-origin: left center;
}

/* ── Keyframes ──────────────────────────────────────────── */

@keyframes nejat-nf-float {
	0%, 100% { transform: translateY(0); }
	50%       { transform: translateY(-20px); }
}

@keyframes nejat-nf-wobble {
	0%, 100% { transform: rotate(-3deg); }
	50%       { transform: rotate(3deg); }
}

@keyframes nejat-nf-fade-in-up {
	from { opacity: 0; transform: translateY(20px); }
	to   { opacity: 1; transform: translateY(0); }
}

@keyframes nejat-nf-wind-move {
	from { transform: translateX(-100%) scaleX(1); }
	to   { transform: translateX(100vw) scaleX(0.2); }
}

@keyframes nejat-nf-burst {
	from { opacity: 1; transform: translate(-50%, -50%) scale(0); }
	to   { opacity: 0; transform: translate(-50%, -50%) scale(2); }
}

/* ── Responsive ─────────────────────────────────────────── */

@media (max-width: 768px) {
	.nejat-not-found__icon {
		width: 80px;
		height: 80px;
	}
}