/* ===============================
   MR PRINT PACK – HERO SECTION
================================ */

.dr1052hero {
	position: relative;
	min-height: 100vh;
	background: linear-gradient(135deg, #0f2027, #203a43, #2c5364);
	display: flex;
	align-items: center;
	overflow: hidden;
	font-family: 'Montserrat', sans-serif;
	perspective: 1600px;
}

/* ===============================
   OVERLAY IMAGE (PRINT TEXTURE)
================================ */

.dr1052hero .hero-overlay {
	position: absolute;
	inset: 0;
	z-index: 0;
	pointer-events: none;
	opacity: 0.22;
	animation: slowZoom 18s ease-in-out infinite alternate;
}

.dr1052hero .hero-overlay img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	transform-origin: center;
}

/* Zoom like printing sheet feed */
@keyframes slowZoom {
	from { transform: scale(1); }
	to   { transform: scale(1.12); }
}

/* ===============================
   GLOW & DEPTH SHADOW
================================ */

.dr1052hero::before {
	content: "";
	position: absolute;
	inset: 0;
	background:
		radial-gradient(circle at top left, rgba(255,183,3,.22), transparent 60%),
		radial-gradient(circle at bottom right, rgba(0,0,0,.7), transparent 70%);
	z-index: 1;
}

/* ===============================
   HERO CONTENT WRAPPER
================================ */

.dr1052hero .hero {
	width: 100%;
	padding: 140px 20px 100px;
	position: relative;
	z-index: 2;
}

.dr1052hero .container {
	max-width: 1200px;
	margin: auto;
}

.dr1052hero .hero-content {
	max-width: 720px;
	transform-style: preserve-3d;
	animation: floatHero 7s ease-in-out infinite;
	will-change: transform;
}

/* Subtle machine-like float */
@keyframes floatHero {
	0%, 100% { transform: translateY(0); }
	50% { transform: translateY(-14px); }
}

/* ===============================
   TEXT LAYERS (3D DEPTH)
================================ */

.dr1052hero h2 {
	font-size: 52px;
	font-weight: 800;
	line-height: 1.2;
	color: #ffffff;
	text-shadow: 0 30px 80px rgba(0,0,0,.85);
	transform: translateZ(70px);
}

.dr1052hero h2 span {
	color: #ffb703;
	text-shadow: 0 0 20px rgba(255,183,3,.85);
}

.dr1052hero p {
	margin: 25px 0 40px;
	font-size: 18px;
	color: #d6d6d6;
	max-width: 620px;
	line-height: 1.6;
	transform: translateZ(40px);
}

/* ===============================
   CTA BUTTON (DIE-CUT FEEL)
================================ */

.dr1052hero .btn {
	display: inline-block;
	padding: 15px 42px;
	border-radius: 42px;
	background: linear-gradient(135deg, #ffb703, #ff7b00);
	color: #000;
	font-weight: 800;
	text-decoration: none;
	letter-spacing: .6px;
	box-shadow: 0 25px 70px rgba(255,183,3,.5);
	transform: translateZ(90px);
	transition: transform .4s ease, box-shadow .4s ease;
}

.dr1052hero .btn:hover {
	transform: translateZ(110px) translateY(-6px) scale(1.05);
	box-shadow: 0 45px 100px rgba(255,183,3,.7);
}

/* ===============================
   MOBILE OPTIMIZATION
================================ */

@media (max-width: 768px) {
	.dr1052hero {
		min-height: auto;
	}

	.dr1052hero h2 {
		font-size: 36px;
	}

	.dr1052hero p {
		font-size: 16px;
	}

	.dr1052hero .hero-content {
		animation: none;
	}

	.dr1052hero .btn {
		padding: 14px 34px;
		font-size: 15px;
	}
}