/* import fonts here */

@import url('https://fonts.googleapis.com/css2?family=Inter:ital,opsz,wght@0,14..32,100..900;1,14..32,100..900&family=Manrope:wght@200..800&family=Montserrat:ital,wght@0,100..900;1,100..900&family=Mulish:ital,wght@0,200..1000;1,200..1000&family=Poppins:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&family=Roboto:ital,wght@0,100..900;1,100..900&family=Urbanist:ital,wght@0,100..900;1,100..900&display=swap');

/* font from file */

@font-face {
	font-family: 'Lufga';
	src: url('../fonts/Lufga-Black.woff2') format('woff2'),
		url('../fonts/Lufga-Black.woff') format('woff');
	font-weight: 900;
	font-style: normal;
	font-display: swap;
}

@font-face {
	font-family: 'Lufga';
	src: url('../fonts/Lufga-BlackItalic.woff2') format('woff2'),
		url('../fonts/Lufga-BlackItalic.woff') format('woff');
	font-weight: 900;
	font-style: italic;
	font-display: swap;
}

@font-face {
	font-family: 'Lufga';
	src: url('../fonts/Lufga-ExtraLight.woff2') format('woff2'),
		url('../fonts/Lufga-ExtraLight.woff') format('woff');
	font-weight: 200;
	font-style: normal;
	font-display: swap;
}

@font-face {
	font-family: 'Lufga';
	src: url('../fonts/Lufga-ExtraLightItalic.woff2') format('woff2'),
		url('../fonts/Lufga-ExtraLightItalic.woff') format('woff');
	font-weight: 200;
	font-style: italic;
	font-display: swap;
}

@font-face {
	font-family: 'Lufga';
	src: url('../fonts/Lufga-ExtraBold.woff2') format('woff2'),
		url('../fonts/Lufga-ExtraBold.woff') format('woff');
	font-weight: bold;
	font-style: normal;
	font-display: swap;
}

@font-face {
	font-family: 'Lufga';
	src: url('../fonts/Lufga-BoldItalic.woff2') format('woff2'),
		url('../fonts/Lufga-BoldItalic.woff') format('woff');
	font-weight: bold;
	font-style: italic;
	font-display: swap;
}

@font-face {
	font-family: 'Lufga';
	src: url('../fonts/Lufga-ExtraBoldItalic.woff2') format('woff2'),
		url('../fonts/Lufga-ExtraBoldItalic.woff') format('woff');
	font-weight: bold;
	font-style: italic;
	font-display: swap;
}

@font-face {
	font-family: 'Lufga';
	src: url('../fonts/Lufga-Bold.woff2') format('woff2'),
		url('../fonts/Lufga-Bold.woff') format('woff');
	font-weight: bold;
	font-style: normal;
	font-display: swap;
}

@font-face {
	font-family: 'Lufga';
	src: url('../fonts/Lufga-Light.woff2') format('woff2'),
		url('../fonts/Lufga-Light.woff') format('woff');
	font-weight: 300;
	font-style: normal;
	font-display: swap;
}

@font-face {
	font-family: 'Lufga';
	src: url('../fonts/Lufga-MediumItalic.woff2') format('woff2'),
		url('../fonts/Lufga-MediumItalic.woff') format('woff');
	font-weight: 500;
	font-style: italic;
	font-display: swap;
}

@font-face {
	font-family: 'Lufga';
	src: url('../fonts/Lufga-Italic.woff2') format('woff2'),
		url('../fonts/Lufga-Italic.woff') format('woff');
	font-weight: normal;
	font-style: italic;
	font-display: swap;
}

@font-face {
	font-family: 'Lufga';
	src: url('../fonts/Lufga-Regular.woff2') format('woff2'),
		url('../fonts/Lufga-Regular.woff') format('woff');
	font-weight: normal;
	font-style: normal;
	font-display: swap;
}

@font-face {
	font-family: 'Lufga';
	src: url('../fonts/Lufga-Medium.woff2') format('woff2'),
		url('../fonts/Lufga-Medium.woff') format('woff');
	font-weight: 500;
	font-style: normal;
	font-display: swap;
}

@font-face {
	font-family: 'Lufga';
	src: url('../fonts/Lufga-LightItalic.woff2') format('woff2'),
		url('../fonts/Lufga-LightItalic.woff') format('woff');
	font-weight: 300;
	font-style: italic;
	font-display: swap;
}

@font-face {
	font-family: 'Lufga';
	src: url('../fonts/Lufga-SemiBoldItalic.woff2') format('woff2'),
		url('../fonts/Lufga-SemiBoldItalic.woff') format('woff');
	font-weight: 600;
	font-style: italic;
	font-display: swap;
}

@font-face {
	font-family: 'Lufga';
	src: url('../fonts/Lufga-ThinItalic.woff2') format('woff2'),
		url('../fonts/Lufga-ThinItalic.woff') format('woff');
	font-weight: 100;
	font-style: italic;
	font-display: swap;
}

@font-face {
	font-family: 'Lufga';
	src: url('../fonts/Lufga-Thin.woff2') format('woff2'),
		url('../fonts/Lufga-Thin.woff') format('woff');
	font-weight: 100;
	font-style: normal;
	font-display: swap;
}

@font-face {
	font-family: 'Lufga';
	src: url('../fonts/Lufga-SemiBold.woff2') format('woff2'),
		url('../fonts/Lufga-SemiBold.woff') format('woff');
	font-weight: 600;
	font-style: normal;
	font-display: swap;
}

@font-face {
	font-family: 'Power Grotesk';
	src: url('../fonts/PowerGrotesk-Regular.woff2') format('woff2'),
		url('../fonts/PowerGrotesk-Regular.woff') format('woff');
	font-weight: normal;
	font-style: normal;
	font-display: swap;
}

@font-face {
	font-family: 'Power Grotesk';
	src: url('../fonts/PowerGrotesk-Regular.woff2') format('woff2'),
		url('../fonts/PowerGrotesk-Regular.woff') format('woff');
	font-weight: normal;
	font-style: normal;
	font-display: swap;
}


/* font from file */



/* import fonts here */



/* basic css*/

:root {
	--bg-color: #171717;
	--white: #fff;
	--orange-400: #FD853A;
	--orange-500: #FB6514;
	--gray-25: #FCFCFD;
	--gray-50: #F9FAFB;
	--gray-700: #344054;
	--california-50: #FFFBEA;
	--black: #000;
	--monserrat: "Montserrat", sans-serif;
	--inter: "Inter", sans-serif;
	--roboto: "Roboto", sans-serif;
	--poppins: "Poppins", sans-serif;
	--manrope: "Manrope", sans-serif;
	--mulish: "Mulish", sans-serif;
	--lufga: 'Lufga';
	--power-grotesk: 'Power Grotesk';
	--urbanist: "Urbanist", sans-serif;
	--transition: .5s;
}

* {
	box-sizing: border-box;
}

body {
	font-family: 'Lufga';
	color: var(--white);
}

h1,
h2,
h3,
h4,
h5,
h6 {
	margin: 0;
}

p {
	margin: 0;
}

a {
	text-decoration: none;
	display: inline-flex;
	transition: var(--transition);
}

input,
textarea {
	outline: none;
}

input::focus,
textarea::focus {
	outline: none;
}

ul {
	margin: 0;
	padding: 0;
	list-style: none;
}

img {
	max-width: 100%;
	height: auto;
	display: block;
}

.container {
	max-width: 1350px;
	margin-inline: auto;
}

.container__custom1 {
	max-width: 1496px;
	padding-inline: 15px;
	margin-inline: auto;
}

.container__custom2 {
	max-width: 1590px;
	padding-inline: 15px;
	margin-inline: auto;
}

.theme__btn {
	padding: 20px 40px;
	border-radius: 60px;
	background: var(--orange-400);
	color: var(--white);
	font-size: 20px;
	font-weight: 700;
	line-height: normal;
	letter-spacing: -0.3px;
	transition: var(--transition);
	border: 1px solid transparent;
	display: inline-flex;
	align-items: center;
	gap: 10px;
}

.banner__text a {
	margin-inline: 10px;
}

.theme__btn:hover {
	background: transparent;
	border-color: var(--orange-400);
	color: var(--orange-400);
}

/* basic css */

/* Preloader Styles */
.loading-screen {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: #fff; /* Background color */
    display: flex;
    justify-content: center;
    align-items: center;
    z-index: 9999;
    opacity: 1;
    transition: opacity 0.5s ease, display 0.5s ease;
}

.loading-logo {
    width: 150px; /* Adjust based on your logo size */
    height: auto;
}


/* header area start here */

header {
	position: fixed;
	left: 0;
	right: 0;
	top: 30px;
	z-index: 99;
}

.header__flex {
	border-radius: 50px;
	background: linear-gradient(180deg, #000 0%, #1E0D05 100%), rgba(255, 255, 255, 0.10);
	padding: 15px 38px 15px 20px;
	position: relative;
	overflow: hidden;
}



.header__menu ul {
	gap: 21px;
}

.header__logo {
	position: relative;
	z-index: 2;
}

.header__menu ul li a {
	color: var(--white);
	font-family: var(--monserrat);
	font-size: 18px;
	font-weight: 700;
	line-height: normal;
	position: relative;
	z-index: 2;
}

.header__menu ul li a.active {
	color: #FF7E21;
}

.header__menu ul li a:hover {
	color: #FF7E21;
}

/* header area end here */



/* hero area start here */

.hero__area {
	background: linear-gradient(180deg, #000 0%, #1E0D05 100%);
	padding-bottom: 103px;
}

.hero__content {
	margin-top: 188px;
	position: relative;
	z-index: 2;
}

.hero__side__menu {
	position: absolute;
	top: 190px;
	left: 68px;
}

.hero__side__menu ul {
	display: flex;
	flex-direction: column-reverse;
}

.hero__side__menu ul li a {
	color: var(--white);
	font-family: var(--roboto);
	font-size: 14px;
	font-weight: 700;
	line-height: normal;
	letter-spacing: 0.56px;
	text-transform: uppercase;
	writing-mode: vertical-rl;
	margin-bottom: 139px;
	text-orientation: mixed;
	transform: rotate(180deg);
}

.hero__side__menu ul li a:hover {
	color: #FF7E21;
}

.hero__text {
	width: 46.5%;
}

.hero__wrapper {
	width: 46.5%;
}

.hero__text h1 {
	color: var(--white);
	font-family: var(--inter);
	font-size: 81.735px;
	font-weight: 700;
	line-height: 81.735px;
	text-transform: capitalize;
	margin-bottom: 43px;
}

.hero__text p {
	color: #D1D5DB;
	font-family: var(--inter);
	font-size: 27.245px;
	font-weight: 400;
	line-height: 40px;
	text-transform: lowercase;
	margin-bottom: 60px;
}

.hero__user__number span {
	color: #ECECEC;
	font-family: var(--poppins);
	font-size: 47.11px;
	font-weight: 700;
	line-height: normal;
	margin-left: 11px;
}

.hero__text__user .hero__user__image a {
	border-radius: 62.919px;
	border: 2.247px solid #111;
	background: url(<path-to-image>) lightgray 50% / cover no-repeat;
}

.hero__user__image a:nth-child(2) {
	margin-left: -12px;
}

.hero__user__image a:nth-child(3) {
	margin-left: -12px;
}

.hero__user__status span {
	display: flex;
	align-items: center;
	color: #828282;
	font-family: var(--poppins);
	font-size: 24px;
	font-weight: 700;
	line-height: normal;
	gap: 10px;
	margin-top: 15px;
}

.hero__user__status span svg {
	border-radius: 100px;
	animation: shadow linear 2s infinite;
}

@keyframes shadow {
	0% {
		box-shadow: 0 0 0 0 transparent;
	}

	50% {
		box-shadow: 0 0 30px 10px #CEFF06;
	}

	100% {
		box-shadow: 0 0 0 0 transparent;
	}
}

.hero__card__single {
	border-radius: 3.892px;
	border: 0.973px solid rgba(255, 255, 255, 0.70);
	background: rgba(255, 255, 255, 0.45);
	box-shadow: 2.919px 0px 11.676px 0px rgba(32, 145, 255, 0.13);
	backdrop-filter: blur(12.162845611572266px);
	padding: 20px;
}

.hero__card__single .hero__user__image a {
	border-radius: 486.514px;
	border: 3.892px solid #FFFEF5;
}

.hero__card__single .hero__user__number span {
	color: #000A2D;
	font-family: var(--manrope);
	font-size: 23.353px;
	font-weight: 600;
	line-height: normal;
}

.hero__card__single .hero__user__status span {
	color: #000A2D;
	font-family: var(--manrope);
	font-size: 17.514px;
	font-weight: 700;
	line-height: normal;
	margin-block: 12px 6px;
}

.hero__user__rating ul {
	gap: 5px;
}

.hero__card__single .hero__user__rating span {
	color: #636571;
	font-family: var(--manrope);
	font-size: 15.568px;
	font-weight: 700;
	line-height: normal;
	margin: 0;
	margin-left: 16px;
}

.hero__wrapper__card .hero__card__single:nth-child(1) {
	width: 261px;
	position: absolute;
	bottom: 119px;
	left: 0;
}

.hero__wrapper__card .hero__card__single:nth-child(2) {
	width: 200px;
	bottom: 20px;
	position: absolute;
	right: 0;
}

.hero__card__single h1 {
	color: #000A2D;
	font-family: var(--manrope);
	font-size: 27.486px;
	font-weight: 700;
	line-height: normal;
	margin-bottom: 4px;
}

.hero__card__single p {
	color: #333;
	font-family: var(--manrope);
	font-size: 16.625px;
	font-weight: 700;
	line-height: normal;
}

.hero__wrapper__item img {
	width: 100%;
	padding-inline: 70px;
}

.hero__agency__title {
	margin-block: 34px 52px;
}

.hero__agency__button a {
	border-radius: 40px;
	border: 1px solid #564E4A;
	font-family: var(--power-grotesk);
	font-size: 20px;
	font-weight: 300;
	line-height: normal;
	letter-spacing: 0.6px;
	padding: 16px 30px;
	color: #564E4A;
	display: flex;
	align-items: center;
	gap: 10px;
	transition: .3s;
}

.hero__agency__button a:hover {
	border-color: #fff;
	color: #fff;
}

.hero__agency__button a:hover svg path {
	fill: #fff;
}

.hero__agency__button a svg path {
	fill: #564E4A;
	transition: var(--transition);
}

.hero__agency__button {
	gap: 20px;
	width: 44%;
}

.hero__agency__flex .single__hero__agency:first-child {
	border-left: none;
}

.hero__agency__flex .single__hero__agency:last-child {
	border-right: none;
}

.single__hero__agency {
	border-left: 0.5px solid #352923;
	border-right: 0.5px solid #352923;
	width: 25%;
}

.single__hero__agency span {
	background: linear-gradient(93deg, #C4C4C4 4.94%, #FFF 98.78%);
	background-clip: text;
	-webkit-background-clip: text;
	-webkit-text-fill-color: transparent;
	font-family: var(--power-grotesk);
	font-size: 64px;
	font-style: normal;
	font-weight: 700;
	line-height: normal;
	letter-spacing: 1.92px;
	text-transform: uppercase;
	display: inline-flex;
	align-items: center;
	gap: 5px;
	justify-content: center;
	margin-bottom: 20px;
}

.operator__color {
	color: var(--orange-400) !important;
	-webkit-text-fill-color: unset !important;
}

.single__hero__agency span p {
	background: #FF7E21;
	background-clip: text;
	-webkit-background-clip: text;
	-webkit-text-fill-color: transparent;
}

.hero__diagram__bar span {
	background: #4A413C;
	height: 1px;
	width: 100%;
	display: block;
	position: relative;
}

.hero__agency__diagram {
	width: 55%;
}

.hero__diagram__bar {
	width: 87%;
}

.hero__diagram__circle {
	width: 10%;
}

.hero__diagram__bar span::after {
	position: absolute;
	content: '';
	width: 6px;
	height: 6px;
	background: #4A413C;
	border-radius: 10px;
	top: -2px;
	left: -5px;
	top: 50%;
	transform: translateY(-50%);
}

.hero__diagram__bar span::before {
	position: absolute;
	content: '';
	width: 6px;
	height: 6px;
	background: #4A413C;
	border-radius: 10px;
	top: 50%;
	right: -5px;
	transform: translateY(-50%);
}

/* hero area end here */



/* brand marquee start here */

.brand__marquee {
	background: #FB6514;
	padding: 35px 0;
	overflow: hidden;
}

.brand__marquee__content {
	background-color: var(--white);
	transform: rotate(-2deg);
	width: 102%;
	margin-left: -10px;
}

.brand__marquee__item {
	padding-inline: 15px;
	gap: 30px;
}

.brand__marquee__item span {
	color: var(--black);
	font-family: var(--lufga);
	font-size: 48px;
	font-weight: 400;
	line-height: normal;
	letter-spacing: -0.72px;
}

.brand__marquee__track {
	white-space: nowrap;
	animation: slide 50s linear infinite;
}

.brand__marquee__item img {
	width: 33px;
	height: 33px;
	max-width: unset;
	transition: transform 1s;
}

.brand__marquee__item:hover img {
	transform: rotate(360deg);
}

@keyframes slide {
	from {
		transform: translateX(0);
	}

	to {
		transform: translateX(-100%);
	}
}

/* brand marquee end here */



/* about area start here */

.about__area {
	background: #FFE6D4;
	padding-block: 95px 73px;
}

.about__text {
	width: 33.4%;
}

.about__flex {
	width: 57%;
	row-gap: 24px;
}

.single__about {
	width: 48.5%;
	border-radius: 16px;
	border: 1px solid #F3F4F6;
	background: rgba(255, 255, 255, 0.80);
	box-shadow: 0px 4px 6px 0px rgba(0, 0, 0, 0.10), 0px 10px 15px 0px rgba(0, 0, 0, 0.10);
	padding: 33px;
}

.single__about:nth-child(2) span {
	background: #DBEAFE;
	color: #2563EB;
}

.single__about:nth-child(3) span {
	background: #F3E8FF;
	color: #9333EA;
}

.single__about:nth-child(4) span {
	background: #D1FAE5;
	color: #059669;
}

.about__text span {
	color: var(--black);
	font-family: var(--poppins);
	font-size: 11.989px;
	font-style: normal;
	font-weight: 400;
	line-height: 150%;
	letter-spacing: 0.959px;
	text-transform: uppercase;
	margin-bottom: 16px;
	display: block;
	padding-left: 55px;
	position: relative;
}

.about__text h1 {
	color: #211D1C;
	font-family: var(--poppins);
	font-size: 47.957px;
	font-weight: 700;
	line-height: 110%;
	text-transform: capitalize;
	margin-bottom: 30px;
}

.about__text h5 {
	color: var(--black);
	font-family: var(--poppins);
	font-size: 16.485px;
	font-style: normal;
	font-weight: 300;
	line-height: 150%;
	margin-bottom: 27px;
}

.about__text p {
	color: #111319;
	font-family: var(--mulish);
	font-size: 14px;
	font-weight: 400;
	line-height: 170%;
}

.about__text span::after {
	position: absolute;
	content: '';
	left: 0;
	top: 50%;
	background: #A9AFC3;
	width: 45px;
	height: 1px;
	transform: translateY(-50%);
}

.about__text .title__dot {
	display: inline-block;
	width: 8.992px;
	height: 8.992px;
	padding: 0;
	background: #FF7E21;
	border-radius: 100px;
	margin: 0;
	margin-left: -5px;
	animation: bounce 2s infinite cubic-bezier(0.28, 0.84, 0.42, 1);
}

@keyframes bounce {

	0%,
	20%,
	50%,
	80%,
	100% {
		transform: translateY(0%);
	}

	40% {
		transform: translateY(-10px);
	}

	60% {
		transform: translateY(-5px);
	}
}

.about__text .title__dot::after {
	display: none;
}

.single__about h4 {
	color: var(--black);
	font-family: var(--inter);
	font-size: 24px;
	font-weight: 700;
	line-height: normal;
	margin-block: 17px 20px;
}

.single__about p {
	color: #4B5563;
	font-family: var(--inter);
	font-size: 16px;
	font-weight: 400;
	line-height: normal;
	margin-bottom: 25px;
}

.single__about span {
	border: 0px solid #E5E7EB;
	background: #E0E7FF;
	padding: 10px 16px;
	border-radius: 100px;
	color: #4F46E5;
	font-family: var(--inter);
	font-size: 16px;
	font-weight: 400;
	line-height: normal;
	display: inline-block;
}

.single__counter {
	border-radius: 12px;
	border: 1px solid #F3F4F6;
	background: rgba(255, 255, 255, 0.80);
	box-shadow: 0px 10px 15px 0px rgba(0, 0, 0, 0.10);
	padding: 33px;
	width: 20%;
	margin-top: 46px;
}

.single__counter:nth-child(2) span {
	color: #9333EA;
}

.single__counter:nth-child(3) span {
	color: #2563EB;
}

.single__counter:nth-child(4) span {
	color: #059669;
}

.single__counter span {
	color: #4F46E5;
	font-family: var(--inter);
	font-size: 36px;
	font-weight: 700;
	line-height: normal;
	margin-bottom: 8px;
	display: inline-block;
}

.single__counter h4 {
	color: #4B5563;
	font-family: var(--inter);
	font-size: 16px;
	font-weight: 400;
	line-height: normal;
}

/* about area end here */



/* service area start here */

.service__area {
	background: linear-gradient(180deg, #000 0%, #1E0D05 100%);
	padding-block: 200px 190px;
	overflow: hidden;
}

.single__service {
	background: rgba(104, 104, 104, 0.20);
	backdrop-filter: blur(9px);
	margin-inline: 15px;
	border-radius: 40px;
	overflow: hidden;
	border: 2.3px solid #727273;
	text-align: left !important;
}

.single__service:hover img {
	transform: scale(1.1);
}

.single__service__image a {
	display: flex;
}

.service__title {
	margin-bottom: 115px;
	align-items: center;
	position: relative;
	z-index: 2;
}

.service__title h1 {
	color: var(--gray-25);
	font-size: 57.6px;
	font-weight: 500;
	line-height: 100%;
	letter-spacing: -0.864px;
}

.service__title h1 span {
	color: var(--orange-400);
}

.service__title p {
	color: var(--white);
	font-size: 24px;
	font-weight: 500;
	line-height: normal;
	letter-spacing: -0.36px;
	max-width: 691px;
}

.single__service__text h4 {
	color: var(--white);
	font-size: 38.4px;
	font-weight: 500;
	line-height: normal;
	letter-spacing: -0.576px;
	padding: 52px;
	padding-bottom: 27px;
	border-bottom: 2.4px solid #727273;
	margin-bottom: 67px;
}

.service__active .single__service__image img {
	max-width: 100%;
	width: unset !important;
	transition: transform var(--transition) ease-in-out;
}

.service__active .service__arrow {
	position: absolute;
	right: -9px;
	bottom: -15px;
	width: 136px !important;
	height: 136px;
	border: 20px solid #160A04;
	border-radius: 100px;
	background: #1D2939;
	display: flex;
	align-items: center;
	justify-content: center;
	transition: var(--transition);
}

.single__service:hover .service__arrow {
	background: var(--orange-400);
}

.service__arrow svg {
	width: 60px;
}

.service__active .service__arrow::after {
	position: absolute;
	content: '';
	width: 70px;
	height: 70px;
	border-radius: 100px;
	top: -87px;
	right: -11px;
	box-shadow: 30px 35px 0px #1B0C04;
	background: top;
	z-index: 2;
}

.service__active .service__arrow::before {
	position: absolute;
	content: '';
	width: 70px;
	height: 70px;
	border-radius: 100px;
	bottom: -5px;
	left: -89px;
	box-shadow: 30px 30px 0px #1B0C04;
	background: transparent;
	z-index: 2;
}

.owl-dots button {
	width: 18px;
	height: 18px;
	background: #E4E7EC !important;
	border-radius: 100px;
	transition: var(--transition);
}

.owl-dots button.active {
	background: var(--orange-400) !important;
	width: 72.389px;
}

.owl-dots {
	display: flex;
	justify-content: center;
	align-items: center;
	margin-top: 46px;
	gap: 13px;
}

.service__shape1 {
	position: absolute;
	top: 90px;
	left: 0;
	animation: premiumFloat 7s ease-in-out infinite;
}

.service__shape2 {
	position: absolute;
	right: 0;
	bottom: 0;
	animation: premiumFloat 9s ease-in-out infinite;

}

.service__shape3 {
	position: absolute;
	left: 50%;
	transform: translateX(-60%);
	top: 145px;
	animation: premiumFloat 8s ease-in-out infinite;

}

@keyframes premiumFloat {
	0% {
	  transform: translate(0px, 0px) rotate(0deg) scale(1);
	}
	25% {
	  transform: translate(5px, -10px) rotate(2deg) scale(1.03);
	}
	50% {
	  transform: translate(0px, -20px) rotate(0deg) scale(1.05);
	}
	75% {
	  transform: translate(-5px, -10px) rotate(-2deg) scale(1.03);
	}
	100% {
	  transform: translate(0px, 0px) rotate(0deg) scale(1);
	}
  }
/* service area end here */



/* portfolio area start here */

.portfolio__area {
	background: #fff;
	padding-block: 97px;
}

.portfolio__title h1 {
	color: var(--gray-700);
	font-size: 64px;
	font-weight: 600;
	line-height: normal;
	letter-spacing: -0.96px;
}

.portfolio__title h1 span {
	color: var(--orange-400);
	display: block;
}

.portfolio__title {
	margin-bottom: 48px;
}

.portfoliot__image__arrow {
	border-radius: 60px;
	border: 1px solid var(--orange-400);
	display: inline-flex;
	justify-content: center;
	align-items: center;
	width: 64px;
	height: 64px;
	position: absolute;
	top: 10px;
	right: 10px;
}

.portfolio__text a {
	color: #FFFAF5;
	font-size: 30px;
	font-weight: 700;
	line-height: normal;
	letter-spacing: -1.05px;
}

.portfolio__text {
	position: absolute;
	bottom: 0px;
	left: 20px;
	border-radius: 20px;
	right: 20px;
	transition: var(--transition);
	transform: translateY(70px);
}

.portfolio__text p {
	transition: transform var(--transition);
	transform: scaleY(0);
}

.single__portfolio:hover .portfolio__text {
	background: rgba(0, 0, 0, .6);
	padding: 20px;
	bottom: 20px;
	transform: translateY(0);
	backdrop-filter: blur(10px);
}

.single__portfolio .portfoliot__image__arrow {
	transition: background var(--transition);
}

.single__portfolio a {
	display: flex;
}

.single__portfolio:hover .portfoliot__image__arrow {
	background: var(--orange-400);
}

.single__portfolio:hover .portfoliot__image__arrow svg path {
	fill: #fff;
}

.single__portfolio:hover .portfolio__text p {
	transform: scaleY(1);
}

.portfolio__tabs {
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: center;
}

.portfolio__tabs ul {
	gap: 14px;
	padding-block: 48px;
}

.portfolio__tabs ul li button {
	color: #000;
	font-family: var(--inter);
	font-size: 20px;
	font-weight: 400;
	line-height: normal;
	padding: 15px 32px;
	border-radius: 24px;
	background: #F2F4F7 !important;
	border-radius: 100px !important;
	transition: var(--transition);
}

.portfolio__tabs ul li button:hover {
	color: var(--orange-400);
}

.portfolio__tabs ul li button.active {
	color: #000 !important;
}

.port__tabs__content {
	max-width: 742px;
	margin: 0 auto;
}

.port__tabs__content a span {
	border-radius: 60px;
	background: var(--orange-400);
	display: inline-flex;
	height: 58px;
	width: 58px;
	justify-content: center;
	align-items: center;
}

.port__tabs__content a {
	color: var(--gray-700);
	font-family: Lufga;
	font-size: 48px;
	font-style: normal;
	font-weight: 700;
	line-height: normal;
	letter-spacing: -0.72px;
	margin-bottom: 24px;
	display: flex;
	align-items: center;
	justify-content: space-between;
}

.port__tabs__content p {
	color: var(--gray-700);
	font-size: 20px;
	font-weight: 400;
	line-height: normal;
	letter-spacing: -0.3px;
}

/* portfolio area end here */




/* blog area start here */

.blog__post {
	background: linear-gradient(180deg, #000 0%, #1E0D05 100%), #FFF;
	padding-block: 122px;
}

.blog__post__title h1 {
	color: var(--california-50);
	font-size: 48px;
	font-weight: 700;
	letter-spacing: -0.72px;
}

.blog__post__title {
	margin-bottom: 48px;
}

.blog__btn {
	color: var(--black);
	font-family: var(--inter);
	font-size: 20px;
	font-weight: 400;
	line-height: normal;
	background: #fff;
	border-radius: 100px;
	padding: 15px 32px;
	margin-block: 35px;
}

.single__blog__image .star__bottom {
	position: absolute;
	bottom: -20px;
	right: 0px;
	width: 113px;
}

.single__blog__post {
	width: 32%;
}

.single__blog__tags span {
	display: inline-block;
	padding-left: 20px;
	position: relative;
	margin-bottom: 35px;
	color: var(--california-50);
	font-family: var(--inter);
	font-size: 20px;
	font-weight: 400;
	line-height: normal;
}

.single__blog__tags {
	gap: 30px;
}

.single__blog__tags span::after {
	position: absolute;
	left: 0;
	top: 50%;
	transform: translateY(-50%);
	content: '';
	width: 9px;
	height: 9px;
	background: var(--orange-400);
	border-radius: 100px;
}

.single__blog__caption a {
	color: var(--california-50);
	font-size: 32px;
	font-weight: 400;
	line-height: normal;
}

/* blog area end here */



/* testimonial start here */

.testimonial__area {
	padding-block: 139px 70px;
	background: var(--bg-color);
}

.testimonial__title {
	max-width: 890px;
	margin: 0 auto;
}

.testimonial__title h1 {
	color: var(--gray-25);
	font-size: 57.583px;
	font-weight: 500;
	line-height: normal;
	letter-spacing: -0.864px;
	margin-bottom: 16px;
}

.testimonial__title p {
	color: var(--gray-50);
	font-size: 23.993px;
	font-weight: 400;
	line-height: normal;
	letter-spacing: -0.36px;
}

.testimonial__title h1 span {
	color: var(--orange-400);
	display: block;
}

.test__particle {
	position: absolute;
	top: 0;
	right: 35px;
}

.test__star1 {
	position: absolute;
	left: 0;
	bottom: -30px;
}

.test__star2 {
	position: absolute;
	right: -40px;
	top: 50%;
}

.testimonial__active {
	padding-block: 75px 0;
}

.single__testimonial {
	border-radius: 28.792px;
	background: rgba(255, 255, 255, 0.14);
	backdrop-filter: blur(8.397565841674805px);
	padding: 25px;
}

.testimonial__active .owl-dots {
	padding-top: 30px;
}

.test__profile {
	display: flex;
	align-items: center;
	gap: 14px;
}

.test__profile__text a {
	color: var(--gray-25);
	font-family: var(--urbanist);
	font-size: 28.193px;
	font-weight: 700;
	line-height: normal;
	display: block;
}

.test__profile__text span {
	color: var(--gray-25);
	font-family: var(--urbanist);
	font-size: 21.928px;
	font-weight: 400;
	line-height: normal;
}

.test__star {
	padding-block: 15px;
	display: flex;
	align-items: center;
}

.test__star ul li img {
	width: 30px !important;
}

.test__star span {
	color: var(--gray-25);
	font-size: 30.821px;
	font-weight: 500;
	line-height: normal;
	letter-spacing: -0.462px;
	margin-left: 10px;
}

.test__text p {
	color: var(--gray-25);
	font-size: 23.993px;
	font-weight: 400;
	line-height: normal;
	letter-spacing: -0.36px;
}

/* testimonial end here */



/* form area start here */

.form__area {
	background: #fff;
	padding-block: 190px;
}


.form__title h1 {
	color: var(--gray-700);
	font-size: 93.486px;
	font-weight: 600;
	line-height: normal;
	letter-spacing: -1.402px;
	margin-bottom: 40px;
}

.form__title h1 span {
	color: var(--orange-400);
}

.form__content {
	max-width: 1215px;
	margin: 0 auto;
}

.single__input input,
.single__input textarea {
	width: 100%;
	padding: 20px;
	border-radius: 73.036px;
	border: 1.461px solid #E4E7EC;
	backdrop-filter: blur(10.955357551574707px);
	padding-left: 138px;
	height: 115.9px;
	color: var(--black);
	font-family: var(--urbanist);
	font-size: 29.214px;
	font-weight: 500;
	line-height: normal;
	letter-spacing: -0.438px;
	display: flex;
	align-items: center;
}

.single__input input::placeholder,
.single__input textarea::placeholder {
	color: var(--black);
}

.single__input {
	margin-bottom: 31px;
}

.single__input label {
	width: 93px;
	height: 84px;
	border-radius: 73.036px;
	background: #FFEAD5;
	display: flex;
	justify-content: center;
	align-items: center;
	position: absolute;
	left: 20px;
	top: 50%;
	transform: translateY(-50%);
}

.single__achievement {
	width: 31%;
}

.submit__form {
	position: absolute;
	right: 20px;
	top: 50%;
	transform: translateY(-50%);
	font-family: var(--urbanist);
	font-weight: 300;
}

.single__input textarea {
	padding-right: 168px;
	resize: none;
	display: flex;
	align-items: center;
	padding-top: 40px;
}

.single__achievement__text p {
	color: var(--black);
	font-size: 23.371px;
	font-weight: 400;
	line-height: normal;
	letter-spacing: -0.351px;
}

/* form area end here */



/* footer area start here */

footer {
	border-radius: 50px 50px 0px 0px;
	background: #171717;
}

.footer__hire h1 {
	color: var(--gray-25);
	font-size: 76.8px;
	font-weight: 600;
	line-height: normal;
	letter-spacing: -1.152px;
}

.footer__hire a {
	color: var(--white);
	font-size: 30.83px;
	font-weight: 500;
	line-height: normal;
	letter-spacing: -0.462px;
	border-radius: 72px;
	background: var(--orange-400);
	padding: 12px 24px;
	display: flex;
	align-items: center;
	gap: 10px;
	transition: var(--transition);
	border: 1px solid transparent;
}

.footer__hire a:hover {
	background: transparent;
	border-color: var(--orange-400);
}

.footer__hire {
	padding-block: 60px 100px;
}

.footer__text p {
	color: var(--gray-25);
	font-size: 24px;
	font-weight: 400;
	line-height: normal;
	letter-spacing: -0.36px;
	padding-block: 40px;
}

.footer__social ul {
	gap: 6px;
}

.footer__social ul a {
	display: flex;
	align-items: center;
}

.footer__link {
	gap: 24px;
	display: flex;
	flex-direction: column;
}

.single__footer h1 {
	color: var(--orange-400);
	font-size: 24px;
	font-weight: 600;
	line-height: normal;
	letter-spacing: -0.36px;
	margin-bottom: 30px;
}

.footer__link li a {
	color: var(--gray-25);
	font-size: 19.2px;
	font-weight: 400;
	line-height: normal;
	letter-spacing: -0.288px;
	display: inline-block;
}

.footer__link li a:hover {
	color: var(--orange-500);
}

.footer__terms {
	gap: 5px;
}

.footer__credit p {
	color: var(--white);
	font-size: 24px;
	font-weight: 400;
	line-height: normal;
	letter-spacing: -0.36px;
}

.footer__credit a {
	color: var(--white);
	font-size: 24px;
	font-weight: 400;
	line-height: normal;
	letter-spacing: -0.36px;
	transition: var(--transition);
}

.footer__credit a:hover {
	color: var(--orange-500);
}

.footer__social ul a svg path {
	transition: var(--transition);
}

.footer__social ul a:hover svg path {
	fill: var(--orange-500);
}

.footer__mail form input {
	border-radius: 18px;
	background: #FFF;
	padding: 15.6px 16.8px;
	height: 61.2px;
	border: none;
	padding-right: 65px;
	width: 100%;
}

.footer__mail form input::placeholder {
	color: var(--black);
	font-size: 19.2px;
	font-weight: 400;
	line-height: normal;
	letter-spacing: -0.288px;
}

.footer__mail form button {
	border-radius: 0px 16.8px 16.8px 0px;
	background: var(--orange-400);
	border: none;
	padding: 12px 9.6px;
	position: absolute;
	height: 100%;
	bottom: 0;
	right: 0;
}

.footer__main {
	border-top: 1px solid #475467;
	border-bottom: 1px solid #475467;
	padding-block: 68px;
}

.footer__credit {
	padding-block: 58px;
}

.footer__credit {
	padding-block: 58px;
}

.widget1 {
	width: 48.88%;
}

.widget2 {
	width: 8%;
}

.widget3 {
	width: 13%;
}

.widget4 {
	width: 20%;
}

/* footer area end here */




/* page 2 start here */

/* hero2 area start here */

.hero2__area {
	background-image: url(../img/hero-bg1.png);
	background-position: center;
	background-size: cover;
	background-repeat: no-repeat;
	height: 100vh;
	display: flex;
	align-items: center;
}

.hero2__text h1 {
	color: var(--white);
	font-size: 60px;
	font-weight: 700;
	line-height: 60px;
	margin-bottom: 30px;
}

.hero2__text p {
	color: var(--white);
	font-family: var(--inter);
	font-size: 20px;
	font-weight: 400;
	line-height: 30px;
	margin-bottom: 20px;
}

.hero2__text {
	width: 49.8%;
}

.hero2__image {
	width: 48%;
}

/* hero2 area end here */



/* service light area start here */

.service__area.service__light {
	background: #FFE6D4;
	padding-block: 96px 66px;
}

.service__area.service__light .service__title h1 {
	color: var(--black);
}

.service__area.service__light .service__title p {
	color: var(--black);
	font-weight: 400;
	font-family: var(--inter);
}

.service__light .single__service__text h4 {
	color: #000;
}

.service__light .owl-dots button {
	background: #4B5563 !important;
}

.service__light .owl-dots button.active {
	background: var(--orange-400) !important;
}

.service__light .single__service {
	border: 2.3px solid #F0E6DF;
}

.service__light .single__service__text h4 {
	border-bottom: 2.4px solid #F0E6DF;
}

.service__light .service__shape1 {
	left: 0;
}

.service__light .service__shape3 {
	top: 180px;
}

/* service light end start here */



/* portfolio dark start here */

.dark__portfolio {
	background: #171717;
}

.dark__portfolio .portfolio__title h1 {
	color: #fff;
}

.dark__portfolio .port__tabs__content a {
	color: #fff;
}

.dark__portfolio .port__tabs__content p {
	color: #fff;
}

/* portfolio dark end here */



/* insights area start here */

.insights__area {
	padding-block: 97px 38px;
}

.insights__text h1 {
	color: var(--black);
	font-family: var(--inter);
	font-size: 24.14px;
	font-weight: 700;
	line-height: 24.14px;
	margin-bottom: 18px;
}

.insights__text p {
	color: #4B5563;
	font-family: var(--inter);
	font-size: 19.312px;
	font-weight: 400;
	line-height: 19.312px;
	margin-bottom: 30px;
}

.insights__date {
	color: #6B7280;
	font-family: var(--inter);
	font-size: 16.8px;
	font-weight: 400;
	line-height: 16.8px;
	display: flex;
	align-items: center;
	gap: 10px;
	margin-bottom: 27px;
}

.single__insights a {
	display: flex;
}

.insights__text a {
	color: #FF7E21;
	font-family: var(--inter);
	font-size: 19.312px;
	font-weight: 600;
	line-height: 19.312px;
	display: flex;
	align-items: center;
	gap: 10px;
}

.insights__text a svg {
	transition: var(--transition);
}

.insights__text a:hover svg {
	transform: translateX(10px);

}

.insights__button {
	position: absolute;
	color: #FFF;
	font-family: var(--inter);
	font-size: 16.8px;
	font-weight: 400;
	line-height: normal;
	padding: 10px 19px;
	background: var(--orange-400);
	border: none;
	border-radius: 100px;
	top: 20px;
	left: 20px;
	z-index: 2;
}

.single__insights {
	border-radius: 19.312px;
	background: #FFF;
	box-shadow: 0px 4.828px 7.242px 0px rgba(0, 0, 0, 0.10), 0px 12.07px 18.105px 0px rgba(0, 0, 0, 0.10);
	margin-inline: 15px;
}

.single__insights img {
	border-radius: 19px 19px 0 0;
	transition: var(--transition);
}

.insights__image {
	overflow: hidden;
	border-radius: 19px 19px 0 0;
}

.insights__text {
	padding: 28px;
}

.single__insights:hover img {
	transform: scale(1.1);
}

.insights__title h1 {
	color: var(--black);
	font-family: var(--inter);
	font-size: 43.452px;
	font-weight: 700;
	line-height: 43.452px;
}

.insights__title p {
	color: #4B5563;
	font-family: var(--inter);
	font-size: 24px;
	font-weight: 400;
	line-height: 24px;
	margin-top: 28px;
}

.insights__title {
	margin-bottom: 74px;
}

.insights__area .owl-carousel .owl-stage-outer {
	padding-bottom: 45px;
}

.insights__area .owl-dots {
	margin-top: 0;
}

/* insights area end here */



/* banner area start here */

.banner__area {
	background: url(../img/banner1.png) no-repeat center;
	background-size: cover;
	padding-block: 127px 175px;
}

.banner__text h1 {
	color: var(--white);
	font-family: var(--inter);
	font-size: 59.346px;
	font-weight: 700;
	line-height: 59.346px;
	margin-bottom: 36px;
}

.banner__text p {
	color: var(--white);
	font-family: var(--inter);
	font-size: 32.97px;
	font-weight: 400;
	line-height: 32.97px;
	margin-bottom: 72px;
}

.banner__text {
	max-width: 1038px;
	margin: 0 auto;
}

.page2 footer {
	margin-top: -50px;
}

/* banner area end here */

/* page 2 end here */



/* page 3 start here */

.hero__area.hero3 {
	background: #fff;
	padding-bottom: 33px;
	height: 100vh;
}

.hero3 .hero__text {
	width: 53.5%;
}

.hero3 .hero__text h1 {
	color: #000;
}

.hero3 .hero__text p {
	color: #000;
}

.hero__btn {
	gap: 20px;
}

.insignts__main {
	gap: 257px;
}

.insights__main {
	gap: 218.1px;
}

.color-navy-blue {
	color: #4F46E5 !important;
}

.case__area {
	background: #F9FAFB;
	padding-block: 125px;
}

.case__image img {
	border-top-right-radius: 19px;
	border-top-left-radius: 19px;
}

.case__text h4 a {
	color: var(--black);
	font-family: var(--inter);
	font-size: 28.8px;
	font-weight: 700;
	line-height: 28.8px;
	margin-bottom: 28px;
}

.case__text p {
	color: rgba(75, 85, 99, 1);
	font-family: Inter;
	font-size: 19.2px;
	font-style: normal;
	font-weight: 400;
	line-height: 19.2px;
	margin-block: 28px;
}

.case__text a {
	color: #4F46E5;
	font-family: var(--inter);
	font-size: 19.2px;
	font-weight: 600;
	line-height: normal;
	display: flex;
	align-items: center;
	gap: 10px;
}

.case__text a svg {
	transition: var(--transition);
}

.case__text a:hover svg {
	transform: translateX(10px);
}

.single__case {
	width: 32%;
	border-radius: 19.2px;
	border: 0px solid #E5E7EB;
	background: #FFF;
	box-shadow: 0px 4.8px 7.2px 0px rgba(0, 0, 0, 0.10), 0px 12px 18px 0px rgba(0, 0, 0, 0.10);
}

.case__image a {
	display: flex;
}

.case__text {
	padding: 38px;
}

.transparent__btn {
	border-radius: 11961.303px;
	border: 1.196px solid #D1D5DB;
	background: #fff;
	color: #000;
	font-weight: 400;
}

.zero__padding {
	padding: 0 !important;
}

.extra__mt {
	margin-top: 240px;
}

.hero__abosolute {
	position: absolute;
	right: 0;
	top: 160px;
	width: 51%;
	height: 58%;
}

.hero__abosolute img {
	height: 100%;
	width: 100%;
	object-fit: cover;
	object-position: 20% 100%;
}

.blog__post.blog2 {
	background: #171717;
}

.blog__container {
	display: flex;
	flex-direction: column;
	gap: 194px;
}

.insights__area.insights2 .insights__title h1 {
	color: #4B5563;
}

.insights__flex {
	margin-bottom: 60px;
}

.insights__flex .single__insights {
	width: 32%;
	margin: 0;
}

/* service light area start here */

.service__area.service__dark2 {
	background: linear-gradient(180deg, #000 0%, #1E0D05 100%);
	padding-block: 96px 66px;
}

.service__dark2 .service__shape1 {
	left: 0;
}

.service__dark2 .service__shape3 {
	top: 180px;
}

/* service light end start here */


.subscribe__area {
	padding-block: 76px 180px;
}

.subscribe__box {
	background: var(--black);
	border-radius: 19.2px;
	padding: 54px 30px 76px 30px;
}

.subscribe__text h1 {
	color: var(--white);
	text-align: center;
	font-family: var(--manrope);
	font-size: 36px;
	font-weight: 700;
	line-height: normal;
	margin-bottom: 18px;
}

.subscribe__text p {
	color: #D1D5DB;
	font-family: var(--manrope);
	font-size: 19.2px;
	font-weight: 700;
	line-height: normal;
	max-width: 685px;
	margin: 0 auto;
	margin-bottom: 68px;
}

.sub__input input {
	border-radius: 25px;
	background: var(--white);
	border: none;
	width: 504px;
	height: 57px;
	padding: 20px;
	color: var(--black);
	font-family: var(--manrope);
	font-size: 19.2px;
	font-weight: 700;
	line-height: 28.8px;
}

.sub__input {
	display: flex;
	justify-content: center;
	align-items: center;
	gap: 20px;
}

.sub__input button {
	color: var(--white);
	font-family: var(--manrope);
	font-size: 19.2px;
	font-weight: 700;
	line-height: normal;
	border-radius: 25px;
	border: 0px solid #E5E7EB;
	background: #FF7E21;
	padding: 16px 35px;
	transition: .3s;
}

.sub__input button:hover {
	background: var(--white);
	color: var(--orange-400);
}

/* page 3 end here */







.offcanva__open {
	justify-content: center;
	width: 50px;
	height: 50px;
	border: 2px solid #fff;
	border-radius: 100px;
	align-items: center;
	font-size: 25px;
	color: #fff;
	z-index: 2;
}

.offcanva__open:hover {
	color: #fff;
}

.offcanva-close {
	background: transparent;
	border: none;
	font-size: 25px;
	color: #fff;
}

.offcanvas-body {
	padding-top: 90px;
}

.offcanvas-body ul {
	flex-direction: column;
	gap: 16px;
}

.offcanvas-body ul li a {
	font-size: 20px;
	color: #fff;
	transition: .3s;
}

.offcanvas-body ul li a.active {
	color: var(--orange-400);
}

#offcanvasExample {
	background: linear-gradient(180deg, #000 0%, #1E0D05 100%);
	border-right: 1px solid #4A413C;
}

.offcanvas-body ul li a:hover {
	color: var(--orange-400);
}


















/* contact-page-css-start */

.blog__hero {
	min-height: 630px;
	background-size: cover;
	background-position: center;
}

.contact__title {
	max-width: 667px;
	margin: auto;
	margin-bottom: 48px;
	display: flex;
	flex-direction: column;
}

.contact__title span {
	border-radius: 60px;
	background: #FF7E21;
	backdrop-filter: blur(59.999996185302734px);
	padding: 7.2px 14.4px;
	display: inline-block;
	text-align: center;
	margin: auto;
	margin-bottom: 19px;
}

.contact__area {
	padding-top: 240px;
	padding-bottom: 150px;
	background: #F2F4F7;
}

.contact__title h2 {
	color: #393F54;
	font-size: 103.2px;
	font-weight: 500;
	line-height: 120px;
	letter-spacing: 0.444px;
	font-family: Inter;
}

.single__input-flex {
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
}

.single__input-flex .contact__from .single__input {
	width: 32.33%;
}

.contact__from {
	max-width: 921px;
	margin: auto;
}

.contact__from .single__input {
	margin-bottom: 28px;
}

.contact__from .single__input input {
	border-radius: 60px;
	border: 0.6px solid #393F54;
	backdrop-filter: blur(59.999996185302734px);
	padding: 0;
	text-align: center;
	background: transparent;
	height: 65px;
	color: #393F54;
	font-family: Inter;
	font-size: 20.4px;
	font-style: normal;
	font-weight: 500;
	line-height: 26.4px;
	letter-spacing: 0.088px;
}

.contact__from textarea {
	border-radius: 60px;
	border: 1.8px solid #393F54;
	backdrop-filter: blur(59.999996185302734px);
	width: 100%;
	padding: 0;
	text-align: center;
	vertical-align: middle;
	padding: 39px 0px;
	background: transparent;
}

.send__btn button {
	width: 100%;
	height: 65px;
	border-radius: 60px;
	background: #FD853A;
	backdrop-filter: blur(59.999996185302734px);
	border: 0;
	color: #FFF;
	font-weight: 700;
	line-height: 26.4px;
	letter-spacing: 0.088px;
	font-size: 20.4px;
	border: 2px solid transparent;
	transition: var(--transition);
}

.send__btn button:hover {
	background: transparent;
	color: var(--orange-400);
	border-color: var(--orange-400);
}

.contact__why {
	padding-top: 144px;
	padding-bottom: 200px;
}

.contact__why-wraper {
	display: flex;
	flex-wrap: wrap;
	border-radius: 50px;
	background: var(--Gray-100, #F2F4F7);
	padding: 122px 71px;
	align-items: center;
}

.contact__why-content {
	width: 53.4%;
}

.contact__why-img {
	width: 45.9%;
}

.contact__why .container {
	max-width: 1470px;
}

.contact__why-title h3 {
	color: var(--Gray-700, #344054);
	font-family: Lufga;
	font-size: 64px;
	font-style: normal;
	font-weight: 600;
	line-height: 100%;
	letter-spacing: -0.96px;
	margin-bottom: 47px;
}

.contact__why-title h3 span {
	color: #FD853A;
}

.contact__why-title p {
	color: var(--Gray-400, #98A2B3);
	font-family: Lufga;
	font-size: 20px;
	font-style: normal;
	font-weight: 400;
	line-height: normal;
	letter-spacing: -0.3px;
}

.contact__why-title {
	margin-bottom: 47px;
}

.contact__why-flex {
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	margin-bottom: 47px;
}

.contact__why-count {
	width: 49%;
}

.contact__why-count span {
	color: var(--Gray-800, #1D2939);
	font-family: Lufga;
	font-size: 36px;
	font-style: normal;
	font-weight: 500;
	line-height: normal;
	letter-spacing: -0.54px;
	display: block;
	margin-bottom: 10px;
}

.contact__why-count p {
	color: var(--Gray-500, #667085);
	font-family: Lufga;
	font-size: 20px;
	font-style: normal;
	font-weight: 400;
	line-height: normal;
	letter-spacing: -0.3px;
	margin: 0;
}

.contact__why-btn a {
	border-radius: 50px;
	border: 1px solid #151515;
	padding: 33px 59px;
	color: #151515;
	font-family: Lufga;
	font-size: 32px;
	font-style: normal;
	font-weight: 600;
	line-height: normal;
	letter-spacing: -0.48px;
	display: inline-block;
	transition: var(--transition);
}

.contact__why-btn a:hover {
	background: var(--orange-400);
	border-color: var(--orange-400);
	color: var(--white);
}

/* contact-page-css-end */


/* blog-feature-area-start */

.blog__feature {
	padding-top: 52px;
	padding-bottom: 100px;
}

.blog__feature-tab button {
	border-radius: 9999px;
	border: 0px solid #E5E7EB;
	background: #F3F4F6 !important;
	padding: 9px 22px;
	color: #000;
	text-align: center;
	font-family: Manrope;
	font-size: 16px;
	font-style: normal;
	font-weight: 700;
	line-height: normal;
	border-radius: 50px !important;
}

.blog__feature-tab ul {
	margin-right: 17px;
	justify-content: center;
	gap: 17px;
	margin-bottom: 130px !important;
}

.blog__feature-tab button.active {
	border-radius: 9999px;
	border: 0px solid #E5E7EB;
	background: #000 !important;
}

.blog__feature-flex {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: space-between;
}

.blog__feature-content {
	width: 48.5%;
}

.blog__feature-img {
	width: 48.5%;
}

.blog__feature-img {
	overflow: hidden;
	border-radius: 12px;
}

.blog__feature-img img {
	transition: var(--transition);

}

.blog__feature-img:hover img {
	transform: scale(1.1);
}

.blog__feature .container {
	max-width: 1526px;
}

.blog__feature-text span {
	color: #FD853A;
	font-family: Manrope;
	font-size: 19.181px;
	font-style: normal;
	font-weight: 700;
	line-height: 19.181px;
	display: block;
	margin-bottom: 18px;
}

.blog__feature-text h3 {
	color: #000;
	font-family: Manrope;
	font-size: 35.964px;
	font-style: normal;
	font-weight: 700;
	line-height: 35.964px;
	margin-bottom: 20px;
}

.blog__feature-text p {
	color: #4B5563;
	font-family: Manrope;
	font-size: 19.181px;
	font-style: normal;
	font-weight: 700;
	line-height: 19.181px;
	max-width: 677.322px;
}

.blog__feature-text {
	margin-bottom: 40px;
}

.blog__feature-user {
	display: flex;
	flex-wrap: wrap;
}

.blog__feature-user--img {
	margin-right: 9px;
}

.blog__feature-user--text .profile__name {
	color: #000;
	font-family: Manrope;
	font-size: 19.181px;
	font-style: normal;
	font-weight: 700;
	line-height: normal;
}

.blog__feature-user--text p {
	color: #6B7280;
	font-family: Manrope;
	font-size: 16.783px;
	font-style: normal;
	font-weight: 400;
	line-height: normal;
	margin-bottom: 9px;
}

.blog__feature-user--text a {
	color: #000;
	text-align: center;
	font-family: var(--manrope);
	font-size: 19.181px;
	font-style: normal;
	font-weight: 700;
	line-height: normal;
	align-items: center;
	flex-wrap: wrap;
	gap: 16px;
}

.blog__feature-user--text a svg {
	transition: var(--transition);
}

.blog__feature-user--text a:hover svg {
	transform: translateX(10px);
}

/* blog-feature-area-end */



/* blog-bage-css-start */

.blog__card {
	padding: 112px 0;
	background: #F9FAFB;
}

.blog__card--flex {
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
}

.blog__card .container {
	max-width: 1527px;
}

.single__blog-card {
	width: 31.5%;
	border-radius: 14.4px;
	border: 0px solid #E5E7EB;
	background: #FFF;
	box-shadow: 0px 1.2px 2.4px 0px rgba(0, 0, 0, 0.05);
	overflow: hidden;
}

.blog__card-content {
	padding: 28px;
}

.blog__card-text a {
	color: #7C3AED;
	font-family: Manrope;
	font-size: 16.8px;
	font-style: normal;
	font-weight: 700;
	line-height: normal;
	display: block;
	margin-bottom: 15px;
}

.blog__card-text .blog__title__link {
	color: #000;
	font-family: Manrope;
	font-size: 24px;
	font-style: normal;
	font-weight: 700;
	line-height: 24px;
	margin-bottom: 15px;
}

.blog__card-text p {
	color: #4B5563;
	font-family: Manrope;
	font-size: 19.2px;
	font-style: normal;
	font-weight: 700;
	line-height: 19.2px;
}

.blog__card-text {
	margin-bottom: 30px;
}

.blog__card-user--flex {
	display: flex;
	align-items: center;
	justify-content: space-between;
	flex-wrap: wrap;
}

.blog__card-user {
	display: flex;
	align-items: center;
	gap: 14px;
}

.blog__card-user span {
	color: #6B7280;
	font-family: Manrope;
	font-size: 16.8px;
	font-style: normal;
	font-weight: 700;
	line-height: 16.8px;
}

.blog__card-user--flex span {
	color: #6B7280;
	font-family: Manrope;
	font-size: 16.8px;
	font-style: normal;
	font-weight: 700;
	line-height: 16.8px;
}

.blog__have {
	padding-bottom: 150px;
	padding-top: 98px;
}

.blog__have--wrap {
	max-width: 832px;
	margin: auto;
}

.blog__have--title {
	text-align: center;
	margin-bottom: 10px;
}

.blog__have--title h3 {
	color: var(--Gray-700, #344054);
	text-align: center;
	font-family: Lufga;
	font-size: 64px;
	font-style: normal;
	font-weight: 600;
	line-height: normal;
	letter-spacing: -0.96px;
}

.blog__have--title h3 span {
	color: #FD853A;
}

.blog__have--input input {
	border-radius: 50px;
	border: 1px solid var(--Gray-200, #E4E7EC);
	backdrop-filter: blur(7.5px);
	height: 86px;
	width: 100%;
	color: #000;
	font-family: Urbanist;
	font-size: 20px;
	font-style: normal;
	font-weight: 500;
	line-height: normal;
	letter-spacing: -0.3px;
	padding: 0 95px;
}

.blog__have--input {
	position: relative;
	margin-bottom: 10px;
}

.blog__have--input a {
	height: 58px;
	width: 58px;
	border-radius: 50%;
	background: var(--Orange-100, #FFEAD5);
	display: flex;
	align-items: center;
	justify-content: center;
	position: absolute;
	left: 14px;
	top: 50%;
	transform: translateY(-50%);
	z-index: 9;
}

.blog__have--input button {
	padding: 20px 40px;
	border-radius: 60px;
	background: var(--Orange-400, #FD853A);
	border: 0;
	color: #FFF;
	font-family: Urbanist;
	font-size: 20px;
	font-style: normal;
	font-weight: 500;
	line-height: normal;
	letter-spacing: -0.3px;
	position: absolute;
	right: 14px;
	top: 50%;
	transform: translateY(-50%);
}

.blog__have--rev {
	padding: 0 30px;
	display: flex;
	align-items: center;
	justify-content: space-between;
}

.blog__have--rev a {
	color: #000;
	font-family: Lufga;
	font-size: 16px;
	font-style: normal;
	font-weight: 400;
	line-height: normal;
	letter-spacing: -0.24px;
	display: flex;
	align-items: center;
}

/* blog-bage-css-end */



.gradient-border-anim::before {
	content: '';
	width: 100%;
	height: 1570px;
	position: absolute;
	background: conic-gradient(#FF7E21 10deg, #790185 50deg, transparent 64deg);
	animation: borderAnimation 10s linear infinite;
	-webkit-animation: borderAnimation 10s linear infinite;
}

@keyframes borderAnimation {
	0% {
		transform: rotate(0deg) translateX(0%);
		-webkit-transform: rotate(0deg) translateX(0%);
		-moz-transform: rotate(0deg) translateX(0%);
		-ms-transform: rotate(0deg) translateX(0%);
		-o-transform: rotate(0deg) translateX(0%);
	}

	25% {
		transform: rotate(-90deg);
		-webkit-transform: rotate(-90deg);
		-moz-transform: rotate(-90deg);
		-ms-transform: rotate(-90deg);
		-o-transform: rotate(-90deg);
	}

	50% {
		transform: rotate(-180deg);
		-webkit-transform: rotate(-180deg);
		-moz-transform: rotate(-180deg);
		-ms-transform: rotate(-180deg);
		-o-transform: rotate(-180deg);
	}

	75% {
		transform: rotate(-270deg);
		-webkit-transform: rotate(-270deg);
		-moz-transform: rotate(-270deg);
		-ms-transform: rotate(-270deg);
		-o-transform: rotate(-270deg);
	}

	100% {
		transform: rotate(-360deg);
		-webkit-transform: rotate(-360deg);
		-moz-transform: rotate(-360deg);
		-ms-transform: rotate(-360deg);
		-o-transform: rotate(-360deg);
	}
}


.gradient-border-anim::after {
	position: absolute;
	left: 0;
	right: 0;
	width: 99.6%;
	height: 96%;
	background: linear-gradient(180deg, #000 0%, #1E0D05 100%), rgba(255, 255, 255, 0.10);
	top: 0;
	content: '';
	margin: auto;
	border-radius: 1000px;
	bottom: 0;
}