.fmrPrimaruButton:hover,
.navbar .nav-link::after {
	background-color: var(--primary-400);
	background-color: var(--primary-400)
}

.heroOrangeTitle,
.heroTitle {
	font-size: 55px;
	font-family: "Bebas Neue", sans-serif;
	text-transform: uppercase;
	letter-spacing: 4px;
	line-height: 1.2
}

.mega-menu,
.navbar .nav-link::after {
	left: 50%;
	transform: translateX(-50%)
}

* {
	margin: 0;
	padding: 0;
	box-sizing: border-box;
	font-family: Poppins, sans-serif
}

:root {
	--bg-color: #ffffff;
	--text-color: #191919;
	--primary-500: #d66b00;
	--primary-400: #f9943b;
	--primary-300: #ffb76b;
	--primary-200: #ffd4a6;
	--primary-100: #fff1e6;
	--primary-50: rgb(255, 250, 246);
	--secondary-color: #00a693;
	--secondary-hover-bg-color: #33b8a9;
	--secondary1-color: rgb(79, 70, 229, 0.1);
	--accent-color: #606060;
	--border-color: #e0e0e0;
	--card-bg: #f4f3fb;
	--shadow-color: rgba(0, 0, 0, 0.1);
	--input-text: #999999;
	--color-red: #fb3748;
	--color-red-light: #fb37481a;
	--color-yellow: #dfb400;
	--color-yellow-light: rgba(255, 219, 67, 0.1);
	--color-green: #1fc16b;
	--color-green-light: #e6fbf0;
	--color-grey: #999999;
	--color-neutral-50: #fafafa;
	--color-neutral-100: #f5f5f5;
	--color-neutral-200: #eeeeee;
	--color-neutral-300: #ffffff;
	--color-neutral-400: #f8f8f8;
	--color-neutral-500: #e4e4e4;
	--color-neutral-600: #cccccc;
	--color-neutral-700: #bbbbbb;
	--color-neutral-800: #777777;
	--color-neutral-900: #333333;
	--color-neutral-950: #050202
}

body {
	background-color: var(--primary-50)
}

.navMainContainer {
	position: sticky;
	top: 0;
	z-index: 999
}

.navbarContainer {
	background: linear-gradient(95.32deg , #8893D2 -7.73%, #C9A7E2 30.54%);
	backdrop-filter: blur(10px);
	-webkit-backdrop-filter: blur(10px);
	padding: 10px 10px;
	border-radius: 0px;
	border: 1px solid rgba(255, 255, 255, .2)
}

.headerLogo {
	max-width: 180px
}

.navbar .nav-link {
	position: relative;
	font-size: 16px;
	color: var(--primary-50);
	font-weight: 400;
	padding-bottom: 5px
}

.navbar .nav-link::after {
	content: "";
	position: absolute;
	bottom: 0;
	width: 0;
	height: 3px;
	transition: width .3s;
	content: none !important
}

.navbar .nav-link.active::after,
.navbar .nav-link:hover::after {
	width: 50%
}

.fmrPrimaruButton {
	background: linear-gradient(95.32deg , #8893D2 -7.73%, #C9A7E2 30.54%);
	color: var(--bg-color)
}

.fmrPrimaruButton:hover {
	font-size: 16px;
	background-color: var(--primary-500);
	color: var(--bg-color)
	border-radius: 20px;
	transform: translateY(-2px);
	box-shadow: 0 4px 12px rgba(230, 124, 32, .4)
}

.bannerContainer {
	background-image: url("../images/home/heroBackground.svg");
	background-position: right;
	background-repeat: no-repeat;
	background-size: contain
}

.heroTitle {
	color: var(--color-neutral-900)
}

.heroOrangeTitle {
	color: var(--primary-400)
}

.subText,
.subWords {
	margin-top: 5px;
	letter-spacing: .2px
}

.heroSubText {
	font-size: 24px;
	color: var(--color-neutral-800)
}

.heroFormWrapper {
	background: #fff;
	padding: 30px;
	border-radius: 20px;
	position: relative;
	z-index: 2;
	color: var(--color-neutral-900)
}

.heroFormWrapper .form-label {
	font-weight: 500;
	font-size: 14px;
	color: var(--color-neutral-900)
}

.heroFormWrapper .form-control {
	border-radius: 12px;
	border: 1px solid var(--border-color);
	padding: 10px 14px;
	font-size: 15px
}

.heroFormWrapper .form-control:focus {
	border-color: var(--primary-400);
	box-shadow: 0 0 6px rgba(249, 148, 59, .3)
}

.fmrPrimaruButton {
	background-color: var(--primary-500);
	font-size: 16px;
	font-weight: 500;
	color: var(--bg-color);
	border-radius: 30px;
	padding: 12px 28px;
	border: none;
	transition: .3s
}

.bannerFormLabel {
	font-size: 14px !important;
	color: var(--color-neutral-900) !important
}

.footerContainer {
	background: linear-gradient(95.32deg , #8893D2 -7.73%, #C9A7E2 30.54%)
}

.custom-toast {
	border-radius: 10px;
	padding: .75rem 1rem;
	display: flex;
	align-items: center;
	justify-content: space-between;
	font-size: .95rem;
	box-shadow: 0 4px 12px rgba(0, 0, 0, .15);
	border: none
}

.toast-success {
	background-color: #e6ffed;
	color: #057a55;
	border-left: 5px solid #28a745
}

.toast-warning {
	background-color: #fff8e1;
	color: #8d6e00;
	border-left: 5px solid #ffc107
}

.toast-error {
	background-color: #ffecec;
	color: #d32f2f;
	border-left: 5px solid #dc3545
}

.toast-link {
	font-weight: 500;
	text-decoration: none
}

.toast-success .toast-link {
	color: #057a55
}

.toast-warning .toast-link {
	color: #8d6e00
}

.toast-error .toast-link {
	color: #d32f2f
}

.toast .btn-close {
	font-size: .65rem;
	width: .75rem;
	height: .75rem;
	padding: .25rem;
	margin-left: 10px;
	opacity: .7
}

.toast .btn-close:hover {
	opacity: 1
}

.heroOrangeText,
.mandatory {
	color: var(--primary-400)
}

.error,
.is-invalid {
	font-size: 11px;
	color: var(--color-red)
}

.whatsapp-float {
	position: fixed;
	bottom: 20px;
	right: 20px;
	z-index: 9999;
	background-color: #25d366;
	border: 1px solid var(--color-neutral-900);
	border-radius: 50%;
	padding: 5px;
	box-shadow: 4px 5px 10px rgba(0, 0, 0, .4);
	transition: transform .3s;
	cursor: pointer
}

.whatsapp-float img {
	width: 40px;
	height: 40px
}

.whatsapp-float:hover {
	transform: scale(1.1)
}

.whatsapp-popup {
	position: fixed;
	bottom: 90px;
	right: 20px;
	width: 280px;
	background: #fff;
	border-radius: 10px;
	border: 1px solid #ccc;
	box-shadow: 4px 5px 15px rgba(0, 0, 0, .2);
	padding: 15px;
	display: none;
	z-index: 10000
}

.whatsapp-popup::after {
	content: "";
	position: absolute;
	bottom: -12px;
	right: 20px;
	border-width: 15px 15px 0;
	border-style: solid;
	border-color: #fff transparent transparent;
	filter: drop-shadow(0px 2px 2px rgba(0, 0, 0, .15))
}

.whatsapp-popup .popup-content {
	text-align: center
}

.whatsapp-popup p {
	font-size: 14px;
	margin-bottom: 15px;
	color: #333
}

.whatsapp-popup .chat-btn {
	display: inline-flex;
	align-items: center;
	background: #000;
	color: #fff;
	padding: 8px 12px;
	border-radius: 5px;
	text-decoration: none;
	font-size: 14px;
	transition: .3s
}

.whatsapp-popup .chat-btn:hover {
	background: #25d366
}

.mega-menu {
	width: 500px;
	max-width: 90vw;
	background: #fff;
	border-radius: 15px;
	top: 100%;
	position: absolute;
	z-index: 1000
}

.dropdown-card {
	border-radius: 10px;
	padding: 8px 10px;
	transition: .3s ease-in-out
}

.dropdown-card:hover {
	background: #fff6ef;
	transform: translateY(-2px)
}

.service-icon {
	width: 40px;
	height: 40px;
	object-fit: contain;
	border-radius: 6px
}

@media (max-width:768px) {
	.mega-menu {
		width: 100%;
		left: 0;
		transform: none;
		border-radius: 0;
		position: static;
		padding: 15px;
		box-shadow: none
	}
}

.arrow-btn,
.carousel-arrow {
	position: absolute;
	cursor: pointer
}

.subWords {
	font-size: 18px;
	color: var(--color-neutral-800)
}

.subText {
	font-size: 16px;
	text-align: start
}

.product-carousel {
	border-radius: 30px;
	overflow: hidden;
	padding: 20px
}

.product-card {
	border: none;
	border-radius: 20px;
	overflow: hidden
}

.product-link {
	text-decoration: none;
	color: inherit
}

.carousel-arrow {
	top: 50%;
	transform: translateY(-50%);
	z-index: 1000
}

.custom-prev {
	left: -1px
}

.custom-next {
	right: -1px
}

.arrow-btn {
	display: inline-block;
	background-color: #e0e4e9ab;
	border-radius: 50%;
	line-height: 40px;
	text-align: center;
	top: 40%;
	z-index: 10;
	font-size: 35px;
	background: #ff7a00;
	width: 45px;
	height: 45px;
	color: #fff;
	display: flex;
	align-items: center;
	justify-content: center;
	box-shadow: 0 2px 8px rgb(0 0 0 / 30%)
}

.owl-stage-outer {
	padding: 10px 0
}

.serviceText {
	font-size: 18px;
	font-weight: 500;
	text-align: center;
	line-height: 1.2;
	color: var(--color-neutral-900)
}