/* Neoma Vertical Scroll Reveal v2.0.2 */

.neoma-scroll-widget {
	position: relative;
	width: 100%;
	height: 100vh;
	overflow: hidden;
	box-sizing: border-box;
}

.neoma-scroll-widget *,
.neoma-scroll-widget *::before,
.neoma-scroll-widget *::after {
	box-sizing: border-box;
}

/* ---- 4 corner border brackets ---- */
.neoma-corners i {
	position: absolute;
	width: 80px;
	height: 80px;
	border: 0 solid #fff;
	opacity: 0;
	transition: opacity 1s ease;
	pointer-events: none;
	z-index: 2;
}
.neoma-started .neoma-corners i { opacity: 1; }
.neoma-corners i:nth-child(1) { top: 8%;    left: 4%;  border-width: 1px 0 0 1px; }
.neoma-corners i:nth-child(2) { top: 8%;    right: 4%; border-width: 1px 1px 0 0; }
.neoma-corners i:nth-child(3) { bottom: 6%; left: 4%;  border-width: 0 0 1px 1px; }
.neoma-corners i:nth-child(4) { bottom: 6%; right: 4%; border-width: 0 1px 1px 0; }

/* ---- Moving Reel Track ---- */
.neoma-scroll-images {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	display: flex;
	flex-direction: column;
	align-items: center;
	z-index: 3;
	will-change: transform;
	transition: opacity 0.35s ease;
}

.neoma-stack-img {
	width: 60%;
	height: 60vh;
	margin-bottom: 20px;
	flex-shrink: 0;
	background-size: cover;
	background-position: center;
}

/* ---- Final Zoom/Hero Stage ---- */
.neoma-stage {
	position: absolute;
	left: 50%;
	top: 50%;
	transform: translate(-50%, -50%);
	display: flex;
	flex-direction: column;
	align-items: center;
	z-index: 4;
	opacity: 0;
	visibility: hidden;
	pointer-events: none;
}

.neoma-frame {
	position: relative;
	overflow: visible;
	border-radius: 10px;
	will-change: width, height, border-radius;
}

.neoma-frame-img {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	background-size: cover;
	background-position: center;
	border-radius: inherit;
	overflow: hidden;
}

/* ---- Small Label on image (bottom-right) ---- */
.neoma-label {
	position: absolute;
	right: 16px;
	bottom: 14px;
	font-family: 'Rethink Sans', sans-serif;
	font-size: 12px;
	color: rgba(255, 255, 255, 0.75);
	opacity: 0;
	z-index: 3;
	pointer-events: none;
	transition: opacity 0.5s ease 0.1s;
	white-space: nowrap;
}

/* ---- Heading Image Overlay (overlaps top edge of the expanded hero image) ---- */
.neoma-heading-overlay {
	position: absolute;
	left: 0;
	right: 0;
	width: 100%;
	display: flex;
	justify-content: center;
	z-index: 5;
	opacity: 0;
	pointer-events: none;
	transform: none;
	transition: opacity 0.6s cubic-bezier(0.16, 1, 0.3, 1);
}

.neoma-pos-edge   { top: 0;    transform: translateY(-50%); }
.neoma-pos-top    { top: 6%; }
.neoma-pos-center { top: 50%;  transform: translateY(-50%); }
.neoma-pos-bottom { bottom: 6%; }

.neoma-reveal .neoma-heading-overlay {
	opacity: 1;
}
.neoma-reveal .neoma-pos-edge {
	transform: translateY(-50%);
}
.neoma-reveal .neoma-pos-center {
	transform: translateY(-50%);
}

.neoma-heading-overlay img {
	display: block;
	flex: none;
	width: 100%;
	max-width: none;
	height: auto;
	margin: 0;
}

/* ---- Bottom Caption Text below image ---- */
.neoma-caption {
	font-family: 'Rethink Sans', sans-serif;
	margin: 20px 0 0;
	font-size: 15px;
	line-height: 1.6;
	color: #fff;
	text-align: left;
	opacity: 0;
	transition: opacity 0.6s cubic-bezier(0.16, 1, 0.3, 1) 0.1s;
	max-width: 100%;
	/* Sits below the frame without affecting the frame's vertical centring */
	position: absolute;
	top: 100%;
	left: 0;
}

.neoma-reveal .neoma-caption {
	opacity: 1;
}

.neoma-reveal .neoma-label {
	opacity: 1;
}

/* ---- Responsive ---- */
@media (max-width: 1024px) {
	.neoma-stack-img { width: 75%; }
}
@media (max-width: 767px) {
	.neoma-stack-img { width: 90%; height: 45vh; }
	.neoma-caption { font-size: 13px; margin-top: 14px; }
	.neoma-corners i { width: 36px; height: 36px; }
	.neoma-corners i:nth-child(1),
	.neoma-corners i:nth-child(2) { top: 6%; }
	.neoma-corners i:nth-child(3),
	.neoma-corners i:nth-child(4) { bottom: 4%; }
}

@media (prefers-reduced-motion: reduce) {
	.neoma-heading-overlay,
	.neoma-caption,
	.neoma-label,
	.neoma-scroll-images,
	.neoma-corners i {
		transition: none !important;
	}
}