:root {
	
	/* Brand Colors */
	--color-primary: #D71F26; 
	--color-secondary: #0A0C0E;
	--color-white: #FFFFFF;
	
	/* Font Families */
  	--font-primary: 'Kollektif', sans-serif;
  	--font-secondary: 'Manrope', sans-serif;
	
}
.fw-100{font-weight: 100 !important;}
.fw-200{font-weight: 200 !important;}
.fw-300{font-weight: 300 !important;}
.fw-400{font-weight: 400 !important;}
.fw-500{font-weight: 500 !important;}
.fw-600{font-weight: 600 !important;}
.fw-700{font-weight: 700 !important;}
.fw-800{font-weight: 800 !important;}
.fw-900{font-weight: 900 !important;}

body{
	background-color: var(--color-secondary) !important;
}

h1{
	font-family: var(--font-primary) !important;
	font-weight: 700;
	font-size: 55px;
	line-height: 100%;
}

h2{
	font-family: var(--font-primary) !important;
	font-weight: 700;
	font-size: 40px;
	line-height: 100%;
}

h3, .h3{
	font-family: var(--font-primary);
	font-weight: 400;
	font-size: 30px;
	line-height: 100%;
}

h4{
	font-family: var(--font-secondary);
	font-weight: bold;
	font-size: 25px;
	line-height: 100%;
}

p{
	font-family: var(--font-secondary) !important;
	color: var(--color-white);
	font-size: 16px;
	line-height: 1.3rem;
	opacity: 0.8;
	font-weight: 400;
}

h3.subHeading{
	font-family: var(--font-primary);
	font-weight: normal;
	font-size: 20px;
}
@media screen and (max-width:767px){
	h1{
		font-size: 40px;
		line-height: 100%;
	}

	h2{
		font-size: 28px;
		line-height: 100%;
	}

	h3, .h3{
		font-size: 24px;
		line-height: 100%;
	}

	h4{
		font-size: 20px;
		line-height: 100%;
	}

	p{
		font-size: 16px;
		line-height: 1.3rem;
	}

	h3.subHeading{
		font-family: var(--font-primary);
		font-weight: normal;
		font-size: 20px;
	}
}

.primary-color{
	color: var(--color-primary);
}

.btn-primary{
	background-color: var(--color-primary); 
	color: var(--color-white);
	font-size: 16px;
	line-height: 100%;
	border-color: var(--color-primary);
	padding: 16px 40px;
	width: 280px;
	text-align: center;
}
.btn-primary:hover,
.btn-primary:focus,
.btn-primary:active,
.btn-primary:focus-visible{
	background-color: var(--color-white);
	color: var(--color-primary);
	border-color: transparent;
}

.btn-primary.button-box{
	display: flex;
	justify-content: center;
	align-items: center;
	align-content: center;
	gap: 10px;
}

.button-box .btn-icon {
  	display: inline-block;
  	width: 23px;
  	height: 18px;
  	background-image: url('../../assets/images/button-arrow.svg');
  	background-size: contain;
  	background-repeat: no-repeat;
  	background-position: center;
  	transition: transform 0.3s ease;
}

.btn-primary:hover .btn-icon,
.btn-primary:focus .btn-icon,
.btn-primary:active .btn-icon,
.btn-primary:focus-visible .btn-icon{
  	background-image: url('../../assets/images/arrow-button-red.svg');
  	transition: transform 0.3s ease;
}

.btn-secondary.button-box{
	width: 263px;
	background-color: var(--color-white);
	color: #000000;
	padding: 16px 40px;
	display: flex;
    justify-content: center;
    align-items: center;
    align-content: center;
    gap: 10px;
	font-size: 16px;
	line-height: 100%;
	border-color: var(--color-white);
}
.btn-secondary.button-box .btn-icon{
	background-image: url('../../assets/images/inner-service-pages/dark_right_arrow.svg');
}
.btn-secondary.button-box:hover{
	background-color: var(--color-secondary);
	color: var(--color-white);
}
.btn-secondary.button-box:hover .btn-icon{
	background-image: url('../../assets/images/button-arrow.svg');
}


/* Inner Banner Brand Service Marquee Begins */
.brand-service-banner-marquee {
  	overflow: hidden;
  	padding: 10px 0;
  	position: relative;
}

.brand-service-banner-marquee .marquee-track {
  	display: flex;
	gap: 7rem;
  	width: max-content;
  	animation: scroll-left 50s linear infinite;
}

.brand-service-banner-marquee .marquee-slide {
  	flex: 0 0 auto;
}

@keyframes scroll-left {
  	0% {
    	transform: translateX(0%);
  	}
  	100% {
    	transform: translateX(-50%);
  	}
}

/* Inner Banner Brand Service Marquee Ends */
.testimonial-content .client-info {
    display: none !important;
}
