/* A2Z VFX Custom Styles */

/* Statistics hover effect */
.stat-item {
	transition: all 0.3s ease;
	cursor: default;
}

.stat-item:hover {
	transform: translateY(-10px);
}

/* Services Section Improvements */
#services .section-title h3 {
	font-family: 'Poppins', sans-serif;
	letter-spacing: -0.02em;
}

#services .section-title h2 {
	font-family: 'Poppins', sans-serif;
	font-weight: 500;
}

#services .service-card {
	background: #ffffff;
	padding: 40px 30px;
	border-radius: 15px;
	box-shadow: 0 5px 25px rgba(0, 0, 0, 0.08);
	height: 100%;
	text-align: center;
	transition: all 0.3s ease;
	border: 1px solid transparent;
}

#services .service-card:hover {
	transform: translateY(-8px);
	box-shadow: 0 15px 40px rgba(0, 0, 0, 0.12);
	border-color: #f9ba1f;
}

#services .service-icon-wrapper {
	transition: transform 0.3s ease;
}

#services .service-card:hover .service-icon-wrapper {
	transform: scale(1.05);
}

#services .service-card h2 {
	font-family: 'Poppins', sans-serif;
	font-weight: 600;
}

@media screen and (max-width: 768px) {
	#services .section-title h3 {
		font-size: 36px !important;
	}

	#services .section-title h2 {
		font-size: 26px !important;
	}

	#services .service-card {
		margin-bottom: 30px;
	}
}

/* Contact Section Improvements */
.contact-card {
	cursor: pointer;
}

.contact-card:hover {
	transform: translateY(-10px);
	box-shadow: 0 15px 40px rgba(0, 0, 0, 0.15) !important;
}

.contact-card:hover .contact-icon-wrapper {
	transform: scale(1.1) rotate(5deg);
	box-shadow: 0 8px 30px rgba(0, 0, 0, 0.2) !important;
}

.contact-instagram:hover {
	border-top-color: #E4405F !important;
}

.contact-linkedin:hover {
	border-top-color: #0077B5 !important;
}

.contact-whatsapp:hover {
	border-top-color: #25D366 !important;
}

.contact-email:hover {
	border-top-color: #f9ba1f !important;
}

.contact-card:hover h3 {
	color: #1a1a1a !important;
}

@media screen and (max-width: 768px) {
	#team .section-title h3 {
		font-size: 36px !important;
	}

	.contact-card {
		margin-bottom: 25px;
	}
}

/* Enhanced Services Section Styling */
.service-card {
	cursor: pointer;
}

.service-card:hover {
	transform: translateY(-12px) scale(1.02);
	box-shadow: 0 20px 50px rgba(0, 0, 0, 0.15) !important;
}

.service-card:hover .service-icon-wrapper {
	transform: scale(1.15) rotate(5deg);
}

.service-roto:hover {
	border-top-color: #6366F1 !important;
	box-shadow: 0 20px 50px rgba(99, 102, 241, 0.25) !important;
}

.service-paint:hover {
	border-top-color: #10B981 !important;
	box-shadow: 0 20px 50px rgba(16, 185, 129, 0.25) !important;
}

.service-compositing:hover {
	border-top-color: #f9ba1f !important;
	box-shadow: 0 20px 50px rgba(249, 186, 31, 0.25) !important;
}

.service-card:hover>div:first-child {
	transform: scale(1.5);
	opacity: 0.15;
}

@media screen and (max-width: 768px) {
	#services .section-title h3 {
		font-size: 42px !important;
	}

	.service-card {
		margin-bottom: 30px;
	}
}

/* Enhanced Mission/Vision Section Styling */
.mission-card {
	cursor: pointer;
}

.mission-card:hover {
	transform: translateY(-12px) scale(1.02);
	box-shadow: 0 20px 50px rgba(0, 0, 0, 0.15) !important;
}

.mission-card:hover .mission-icon {
	transform: scale(1.15) rotate(5deg);
}

.mission-mission:hover {
	border-top-color: #EF4444 !important;
	box-shadow: 0 20px 50px rgba(239, 68, 68, 0.25) !important;
}

.mission-vision:hover {
	border-top-color: #3B82F6 !important;
	box-shadow: 0 20px 50px rgba(59, 130, 246, 0.25) !important;
}

.mission-motto:hover {
	border-top-color: #f9ba1f !important;
	box-shadow: 0 20px 50px rgba(249, 186, 31, 0.25) !important;
}

.mission-card:hover>div:first-child {
	transform: scale(1.5);
	opacity: 0.15;
}

@media screen and (max-width: 768px) {
	#mission-vision .section-title h2 {
		font-size: 42px !important;
	}

	.mission-card {
		margin-bottom: 30px;
	}
}

/* Enhanced Behind The Scenes Section Styling */
.usp-card {
	cursor: pointer;
}

.usp-card:hover {
	transform: translateY(-12px) scale(1.02);
	box-shadow: 0 20px 50px rgba(0, 0, 0, 0.15) !important;
}

.usp-card:hover .usp-icon {
	transform: scale(1.15) rotate(5deg);
}

.usp-team:hover {
	border-top-color: #8B5CF6 !important;
	box-shadow: 0 20px 50px rgba(139, 92, 246, 0.25) !important;
}

.usp-pipelines:hover {
	border-top-color: #EC4899 !important;
	box-shadow: 0 20px 50px rgba(236, 72, 153, 0.25) !important;
}

.usp-quality:hover {
	border-top-color: #14B8A6 !important;
	box-shadow: 0 20px 50px rgba(20, 184, 166, 0.25) !important;
}

.usp-card:hover>div:first-child {
	transform: scale(1.5);
	opacity: 0.15;
}

@media screen and (max-width: 768px) {
	#behind-scenes h2 {
		font-size: 42px !important;
	}

	.usp-card {
		margin-bottom: 30px;
	}
}

/* Enhanced Why Choose A2Z VFX Section Styling */
.usp-feature-card {
	cursor: pointer;
}

.usp-feature-card:hover {
	transform: translateY(-12px) scale(1.02);
	box-shadow: 0 20px 50px rgba(0, 0, 0, 0.15) !important;
}

.usp-feature-card:hover .feature-icon {
	transform: scale(1.15) rotate(5deg);
}

.feature-delivery:hover {
	border-top-color: #F59E0B !important;
	box-shadow: 0 20px 50px rgba(245, 158, 11, 0.25) !important;
}

.feature-budget:hover {
	border-top-color: #10B981 !important;
	box-shadow: 0 20px 50px rgba(16, 185, 129, 0.25) !important;
}

.feature-quality:hover {
	border-top-color: #3B82F6 !important;
	box-shadow: 0 20px 50px rgba(59, 130, 246, 0.25) !important;
}

.feature-support:hover {
	border-top-color: #8B5CF6 !important;
	box-shadow: 0 20px 50px rgba(139, 92, 246, 0.25) !important;
}

.usp-feature-card:hover>div:first-child {
	transform: scale(1.5);
	opacity: 0.15;
}

@media screen and (max-width: 768px) {
	#usp-showcase h2 {
		font-size: 42px !important;
	}

	.usp-feature-card {
		margin-bottom: 30px;
	}
}

/* Mission/Vision Section */
#mission-vision .mission-card {
	padding: 45px 35px;
	background: #ffffff;
	border-radius: 15px;
	box-shadow: 0 5px 25px rgba(0, 0, 0, 0.08);
	height: 100%;
	border-top: 4px solid #f9ba1f;
	transition: all 0.3s ease;
}

#mission-vision .mission-card:hover {
	transform: translateY(-8px);
	box-shadow: 0 15px 40px rgba(0, 0, 0, 0.12);
}

#mission-vision .mission-icon {
	width: 90px;
	height: 90px;
	background: linear-gradient(135deg, #f9ba1f 0%, #ffd54f 100%);
	border-radius: 50%;
	display: flex;
	align-items: center;
	justify-content: center;
	margin: 0 auto 30px;
	box-shadow: 0 5px 20px rgba(249, 186, 31, 0.3);
	transition: transform 0.3s ease;
}

#mission-vision .mission-card:hover .mission-icon {
	transform: scale(1.1);
}

#mission-vision .mission-card h2 {
	font-family: 'Poppins', sans-serif;
	font-weight: 600;
}

@media screen and (max-width: 768px) {
	#mission-vision h2 {
		font-size: 36px !important;
	}

	#mission-vision .mission-card {
		margin-bottom: 30px;
	}
}

/* Remove hover effects from About Section */
#about .message-box:hover {
	transform: none;
	box-shadow: none !important;
}

/* Behind The Scenes / USP Section */
#behind-scenes {
	background: #f8f9fa;
}

#behind-scenes .usp-card {
	background: #ffffff;
	padding: 40px 30px;
	border-radius: 15px;
	box-shadow: 0 5px 25px rgba(0, 0, 0, 0.08);
	height: 100%;
	text-align: center;
	transition: all 0.3s ease;
	border: 1px solid transparent;
}

#behind-scenes .usp-card:hover {
	transform: translateY(-5px);
	box-shadow: 0 10px 35px rgba(0, 0, 0, 0.12);
	border-color: #f9ba1f;
}

#behind-scenes .usp-icon {
	width: 80px;
	height: 80px;
	background: linear-gradient(135deg, #f9ba1f 0%, #ffd54f 100%);
	border-radius: 50%;
	display: flex;
	align-items: center;
	justify-content: center;
	margin: 0 auto 25px;
	transition: transform 0.3s ease;
}

#behind-scenes .usp-card:hover .usp-icon {
	transform: scale(1.1);
}

#behind-scenes video {
	width: 100%;
	height: auto;
	display: block;
}

@media screen and (max-width: 768px) {
	#behind-scenes h2 {
		font-size: 36px !important;
	}

	#behind-scenes h3 {
		font-size: 28px !important;
	}

	#behind-scenes .usp-card {
		margin-bottom: 30px;
	}
}

/* USP Showcase Section */
#usp-showcase .usp-feature-card {
	background: #ffffff;
	padding: 35px 25px;
	border-radius: 15px;
	box-shadow: 0 5px 25px rgba(0, 0, 0, 0.08);
	height: 100%;
	text-align: center;
	border-top: 4px solid #f9ba1f;
	transition: all 0.3s ease;
}

#usp-showcase .usp-feature-card:hover {
	transform: translateY(-5px);
	box-shadow: 0 10px 35px rgba(0, 0, 0, 0.12);
}

#usp-showcase .feature-icon {
	margin-bottom: 20px;
	transition: transform 0.3s ease;
}

#usp-showcase .usp-feature-card:hover .feature-icon {
	transform: scale(1.1);
}

#usp-showcase video {
	width: 100%;
	height: auto;
	display: block;
}

@media screen and (max-width: 768px) {
	#usp-showcase h2 {
		font-size: 36px !important;
	}

	#usp-showcase h3 {
		font-size: 28px !important;
	}

	#usp-showcase .usp-feature-card {
		margin-bottom: 30px;
	}
}

/* About Section Improvements */
#about .message-box {
	padding: 20px 0;
}

#about .message-box h2 {
	margin-bottom: 20px;
}

#about .message-box p {
	margin-bottom: 20px;
	font-size: 17px;
	line-height: 1.8;
	color: #555555;
}

#about .right-box-pro {
	border-radius: 10px;
	overflow: hidden;
}

#about video {
	width: 100%;
	height: auto;
	display: block;
	border-radius: 10px;
}

@media screen and (max-width: 768px) {
	#about .message-box {
		padding-right: 0;
		margin-bottom: 40px;
	}

	#about .message-box p {
		font-size: 16px;
	}
}

/* Smooth transitions */
* {
	transition: transform 0.3s ease, box-shadow 0.3s ease;
}

/* Gallery Section Improvements */
#gallery .section-title h3 {
	font-family: 'Poppins', sans-serif;
	letter-spacing: -0.02em;
}

#gallery .filter-button-group {
	margin: 20px 0;
}

#gallery .filter-button-group button {
	font-family: 'Poppins', sans-serif;
	font-weight: 500;
	letter-spacing: 0.5px;
	transition: all 0.3s ease;
}

#gallery .filter-button-group button.active {
	background: #f9ba1f;
	color: #ffffff;
	box-shadow: 0 4px 15px rgba(249, 186, 31, 0.3);
}

#gallery .filter-button-group button:hover {
	background: #333333;
	color: #ffffff;
	transform: translateY(-2px);
	box-shadow: 0 4px 15px rgba(0, 0, 0, 0.2);
}

#gallery .gallery-single {
	border: 3px solid #f9ba1f;
	border-radius: 10px;
	overflow: hidden;
}

#gallery .gallery-single img {
	transition: transform 0.4s ease;
}

#gallery .gallery-single:hover img {
	transform: scale(1.05);
	filter: grayscale(0%);
}

@media screen and (max-width: 768px) {
	#gallery .section-title h3 {
		font-size: 36px !important;
	}

	#gallery .filter-button-group button {
		padding: 10px 25px;
		font-size: 13px;
		margin: 5px;
	}
}

/* Typography Enhancements */
body {
	font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, sans-serif;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
}

h1,
h2,
h3,
h4,
h5,
h6 {
	font-family: 'Poppins', sans-serif;
	font-weight: 600;
	letter-spacing: -0.02em;
}

p,
span,
a,
li,
td,
th {
	font-family: 'Inter', sans-serif;
}

/* Improve readability */
p {
	line-height: 1.7;
	color: #555555;
}

/* Button typography */
.btn,
.hover-effect-new,
button {
	font-family: 'Poppins', sans-serif;
	font-weight: 500;
	letter-spacing: 0.5px;
}

/* White buttons in dark sections */
.section.db .hover-effect-new {
	color: #ffffff !important;
	border-color: #ffffff !important;
}

.section.db .hover-effect-new span {
	color: #ffffff !important;
}

.section.db .hover-effect-new:hover {
	color: #ffffff !important;
	border-color: #f9ba1f !important;
}

.section.db .hover-effect-new:hover span {
	color: #ffffff !important;
}

/* Slider Watermark */
.slider-watermark {
	position: absolute;
	bottom: 30px;
	right: 30px;
	z-index: 100;
	opacity: 0.4;
	transition: opacity 0.3s ease;
	pointer-events: none;
}

.slider-watermark:hover {
	opacity: 0.7;
}

.slider-watermark img {
	max-width: 100px;
	height: auto;
	filter: drop-shadow(0 2px 4px rgba(0, 0, 0, 0.3));
}

@media screen and (max-width: 768px) {
	.slider-watermark {
		bottom: 20px;
		right: 20px;
	}

	.slider-watermark img {
		max-width: 120px;
	}
}

@media screen and (max-width: 480px) {
	.slider-watermark {
		bottom: 15px;
		right: 15px;
	}

	.slider-watermark img {
		max-width: 100px;
	}
}

/* Navigation Menu Font Styling */
.menu__link {
	font-family: 'Poppins', sans-serif;
	font-weight: 500;
	letter-spacing: 0.5px;
}

.menu__brand .logo {
	font-family: 'Poppins', sans-serif;
}

@media screen and (max-width: 768px) {
	.menu__link {
		font-size: 24px;
		font-weight: 500;
	}
}

/* About Us Page Specific Styles */
.service-container {
	-webkit-transition: all 0.5s ease;
	transition: all 0.5s ease;
}

.service-container .icon {
	margin-top: 5%;
	font-size: 38px;
	-webkit-transition: all 0.5s ease;
	transition: all 0.5s ease;
}

.service-container .number-icon .icon-2 {
	height: 70px;
	width: 70px;
	line-height: 80px;
	border-radius: 64% 36% 55% 45% / 76% 72% 28% 24% !important;
	border-color: #f89d36 !important;
	-webkit-transition: all 0.5s ease;
	transition: all 0.5s ease;
}

.service-container .number-icon .icon-2 i {
	font-size: 30px;
}

.service-container .number-icon .number {
	position: absolute;
	top: 0;
	right: 70px;
	left: 0;
	height: 35px;
	width: 35px;
	margin: 0 auto;
	-webkit-transition: all 0.5s ease;
	transition: all 0.5s ease;
}

.service-container .number-icon .number span {
	line-height: 30px;
}

.service-container .content .number {
	font-size: 40px;
	color: #dee2e6;
}

.service-container .content .title {
	-webkit-transition: all 0.5s ease;
	transition: all 0.5s ease;
}

.service-container.hover-bg {
	-webkit-transition: all 0.5s ease;
	transition: all 0.5s ease;
}

.service-container.hover-bg .smooth-icon {
	position: absolute;
	bottom: -40px;
	right: -20px;
	font-size: 60px;
	color: #f8f9fa;
	-webkit-transition: all 0.8s ease;
	transition: all 0.8s ease;
}

.service-container.hover-bg:hover {
	background-color: #f89d36;
}

.service-container.hover-bg:hover .content .title {
	color: #ffffff !important;
}

.service-container.hover-bg:hover .content .serv-pera {
	color: #fafafb !important;
}

.service-container.hover-bg:hover .smooth-icon {
	font-size: 100px;
	opacity: 0.2;
	bottom: -20px;
	right: 10px;
}

.service-container:hover {
	background-color: #ffffff;
	-webkit-box-shadow: 0 10px 25px rgba(47, 60, 78, 0.15) !important;
	box-shadow: 0 10px 25px rgba(47, 60, 78, 0.15) !important;
}

.service-container:hover .icon {
	color: #f89d36;
	-webkit-animation: mover 1s infinite alternate;
	animation: mover 1s infinite alternate;
}

.service-container:hover .number-icon .icon-2 {
	background-color: #f89d36;
	border-radius: 50% !important;
}

.service-container:hover .number-icon .icon-2 i {
	color: #ffffff !important;
}

.service-container:hover .number-icon .number {
	color: #ffffff;
	background: #f89d36 !important;
	border-color: #ffffff !important;
}

.service-container:hover .content .title {
	color: #f89d36;
}

.service-container a:hover,
.service-container a .title:hover {
	color: #f89d36 !important;
}

@-webkit-keyframes mover {
	0% {
		-webkit-transform: translateY(0);
		transform: translateY(0);
	}

	100% {
		-webkit-transform: translateY(-15px);
		transform: translateY(-15px);
	}
}

@keyframes mover {
	0% {
		-webkit-transform: translateY(0);
		transform: translateY(0);
	}

	100% {
		-webkit-transform: translateY(-15px);
		transform: translateY(-15px);
	}
}

.service-wrapper {
	-webkit-transition: all 0.5s ease;
	transition: all 0.5s ease;
}

.service-wrapper .icon {
	width: 60px;
	height: 60px;
	line-height: 45px;
	-webkit-transition: all 0.5s ease;
	transition: all 0.5s ease;
}

.service-wrapper .content .title {
	-webkit-transition: all 0.5s ease;
	transition: all 0.5s ease;
	font-weight: 500;
	font-family: 'Poppins', sans-serif;
}

.service-wrapper .big-icon {
	position: absolute;
	right: 0;
	bottom: 0;
	opacity: 0.05;
	-webkit-transition: all 0.5s ease;
	transition: all 0.5s ease;
}

.service-wrapper:hover {
	-webkit-box-shadow: 0 10px 25px rgba(47, 60, 78, 0.15) !important;
	box-shadow: 0 10px 25px rgba(47, 60, 78, 0.15) !important;
	background: #ffffff;
	-webkit-transform: translateY(-8px);
	transform: translateY(-8px);
	border-color: transparent !important;
}

.service-wrapper:hover .icon {
	background: #f9ba1f !important;
	color: #ffffff !important;
}

.service-wrapper:hover .big-icon {
	z-index: -1;
	opacity: 0.1;
	font-size: 160px;
}

.text-custom {
	color: #f9ba1f !important;
}

.uim-svg {
	display: inline-block;
	height: 1em;
	vertical-align: -0.125em;
	font-size: inherit;
	fill: var(--uim-color, currentColor);
}

/* Services Page Styles */
.feature {
	width: 100%;
	padding: 50px 0 50px;
}

.feature .headings {
	text-align: center;
	width: 100%;
	padding: 20px 0 20px;
}

.feature .headings h2 {
	font-size: 32px;
	font-weight: 400;
}

.feature .headings h2 span {
	color: #117ec3;
}

.feature .headings h6 {
	letter-spacing: 0.5px;
	font-weight: 300;
	font-size: 14px;
	padding: 8px 0 8px;
}

.feature-main {
	width: 100%;
	border-bottom: 2px solid transparent;
	background-color: #f9f9f9;
	padding-bottom: 20px;
}

.cover:before {
	content: "";
	position: absolute;
	left: 0;
	top: 0;
	width: 100%;
	height: 100%;
	box-shadow: 0px 0px 0px 250px rgba(0, 0, 0, 0.65) inset;
	transition: 0.7s ease 0s;
}

.feature-main:hover .cover:before {
	box-shadow: none;
}

.feature .feature-box {
	width: 100%;
	height: auto;
	position: relative;
}

.feature .feature-box img {
	width: 100%;
	height: auto;
}

.feature .feature-head {
	text-align: center;
	padding: 10px 15px;
	border-top: none;
}

.feature .feature-head h3 {
	font-size: 16px;
	color: #333;
	font-weight: 600;
	font-family: 'Poppins', sans-serif;
}

.feature .feature-head p {
	color: #999;
	letter-spacing: 0.4px;
	line-height: 1.7;
	margin: 20px 0 20px;
	font-family: 'Inter', sans-serif;
}

.feature .feature-head a {
	color: #000;
	font-size: 13px;
	padding: 10px 20px;
	border-radius: 5px;
	display: inline-block;
	transition: 0.5s ease 0s;
}

.feature .feature-head i {
	margin-left: 5px;
}

.feature-main:hover {
	border-bottom: 2px solid #117ec3;
}

.feature-main:hover .feature-head a {
	background-color: #117ec3;
	color: #fff;
	text-decoration: none;
}

@media all and (max-width: 767px) {
	.feature-main {
		margin-bottom: 15px;
	}
}

.service-wrapper {
	transition: all 0.5s ease;
}

.service-wrapper .icon {
	width: 60px;
	height: 60px;
	line-height: 45px;
	transition: all 0.5s ease;
}

.service-wrapper .content .title {
	transition: all 0.5s ease;
	font-weight: 500;
	font-family: 'Poppins', sans-serif;
}

.service-wrapper .big-icon {
	position: absolute;
	right: 0;
	bottom: 0;
	opacity: 0.05;
	transition: all 0.5s ease;
}

.service-wrapper:hover {
	box-shadow: 0 10px 25px rgba(47, 60, 78, 0.15) !important;
	background: #ffffff;
	transform: translateY(-8px);
	border-color: transparent !important;
}

.service-wrapper:hover .icon {
	background: #f9ba1f !important;
	color: #ffffff !important;
}

.service-wrapper:hover .big-icon {
	z-index: -1;
	opacity: 0.1;
	font-size: 160px;
}

/* Image Slider Styles */
.scrool-container {
	display: grid;
	place-content: center;
	position: relative;
	overflow: hidden;
	--position: 50%;
}

.image-container {
	max-width: 800px;
	max-height: 90vh;
}

.slider-image {
	width: 100%;
	height: 100%;
	object-fit: cover;
	object-position: left;
}

.image-before {
	position: absolute;
	inset: 0;
	width: var(--position);
}

.slider {
	position: absolute;
	inset: 0;
	cursor: pointer;
	opacity: 0;
	width: 100%;
	height: 100%;
}

.slider:focus-visible~.slider-button {
	outline: 5px solid black;
	outline-offset: 3px;
}

.slider-line {
	position: absolute;
	inset: 0;
	width: 0.2rem;
	height: 100%;
	background-color: #fff;
	left: var(--position);
	transform: translateX(-50%);
	pointer-events: none;
}

.slider-button {
	position: absolute;
	background-color: #fff;
	color: black;
	padding: 0.5rem;
	border-radius: 100vw;
	display: grid;
	place-items: center;
	top: 50%;
	left: var(--position);
	transform: translate(-50%, -50%);
	pointer-events: none;
	box-shadow: 1px 1px 1px hsl(0, 50%, 2%, 0.5);
}

.text-desc {
	color: #2c2c2c;
	font-weight: 400;
	font-size: 15px;
	line-height: 33px;
	margin: 0;
	font-family: 'Inter', sans-serif;
}

@keyframes fadeInLeft {
	from {
		opacity: 0;
		transform: translateX(-50px);
	}
	to {
		opacity: 1;
		transform: translateX(0);
	}
}

.animate__fadeInLeft {
	animation-name: fadeInLeft;
	animation-duration: 3s;
}