/* ----------------------------------------------------------------------------------------
* Author        : Awaiken
* Template Name : Builtup - Construction HTML Template
* File          : CSS File
* Version       : 1.0
* ---------------------------------------------------------------------------------------- */
/* INDEX
----------------------------------------------------------------------------------------
01. Global Variables
02. General css
03. Header css
04. Hero css
05. About Us css
06. Our Services css
07. Why Choose Us css
08. Our Project css
09. Our CTA css
10. Our Testimonial css
11. Our Faqs css
12. Latest News css
13. Our Contact Us css
14. Footer css
15. About us Page css
16. Services Page css
17. Service Single css
18. Blog Archive css
19. Blog Single css
20. Project Page css
21. Project Single css
22. Team Page css  
23. Contact us Page css
24.	FAQs Page css
25. 404 Page css
26. Responsive css
-------------------------------------------------------------------------------------- */

/************************************/
/*** 	 01. Global Variables	  ***/
/************************************/	

:root{
	--primary-color			: #EE0000;
	--secondary-color		: #E9F7FE;
	--text-color			: #667282;
	--accent-color			: #515860;
	--white-color			: #FFFFFF;
	--divider-color			: #12223B30;
	--dark-divider-color	: #FFFFFF20;
	--overlay-color			: #00000066;
	--error-color			: rgb(230, 87, 87);
	--default-font			: "DM Sans", sans-serif;
	--accent-font			: "Manrope", sans-serif;
}

/************************************/
/*** 	   02. General css		  ***/
/************************************/

body{
	font-family: var(--default-font);
	font-size: 18px;
	font-weight: 400;
	line-height: 1.6em;
	color: var(--text-color);
	background-color: var(--white-color);
}

p{
	line-height: 1.6em;
	margin-bottom: 1.4em;
}

h1,
h2,
h3,
h4,
h5,
h6{
	margin :0;
	font-family: var(--accent-font);
	font-weight: 800;
	color: var(--primary-color);
	line-height: 1.3em;
}

figure{
	margin: 0;
}

img{
	max-width: 100%;
}

a{
	text-decoration: none;
}

a:hover{
	text-decoration: none;
	outline: 0;
}

a:focus{
	text-decoration: none;
	outline: 0;
}

html,
body{
	width: 100%;
	overflow-x: clip;
}

.container{
	max-width: 1300px;
}

.container,
.container-fluid,
.container-lg,
.container-md,
.container-sm,
.container-xl,
.container-xxl{
    padding-right: 15px;
    padding-left: 15px;
}

.image-anime{
	position: relative;
	overflow: hidden;
}

.image-anime:after{
	content: "";
	position: absolute;
    width: 200%;
    height: 0%;
    left: 50%;
    top: 50%;
    background-color: rgba(255,255,255,.3);
    transform: translate(-50%,-50%) rotate(-45deg);
    z-index: 1;
}

.image-anime:hover:after{
    height: 250%;
    transition: all 600ms linear;
    background-color: transparent;
}

.reveal{
	position: relative;
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    visibility: hidden;
    overflow: hidden;
}

.reveal img{
    height: 100%;
    width: 100%;
    -o-object-fit: cover;
    object-fit: cover;
    -webkit-transform-origin: left;
    transform-origin: left;
}

.row{
    margin-right: -15px;
    margin-left: -15px;
}

.row > *{
	padding-right: 15px;
	padding-left: 15px;
}

.row.no-gutters{
    margin-right: 0px;
    margin-left: 0px;
}

.row.no-gutters > *{
    padding-right: 0px;
    padding-left: 0px;
}

.btn-default{
	display: inline-block;
	font-family: var(--accent-font);
	font-size: 18px;
	font-weight: 800;
	line-height: 1.3em;
	text-transform: capitalize;
	color: var(--white-color);
	background: var(--primary-color);
	border-radius: 12px;
	padding: 20px 60px 20px 30px;
	border: none;
	transition: 0.5s ease-in-out;
	position: relative;
	overflow: hidden;
	z-index: 1;
}

.btn-default:hover{
	background: transparent;
}

.btn-default::before{
	content: '';
	position: absolute;
	top: 50%;
	right: 0;
	bottom: 0;
	background-image: url("../images/arrow.svg");
	background-repeat: no-repeat;
	background-position: center center;
	width: 24px;
	height: 24px;
	transform: translate(-30px, -50%);
	transition: 0.4s ease-in-out;
}

.btn-default::after{ 
	content: '';
    display: block;
    position: absolute;
	top: 0;
    left: 0;
    bottom: 0;
	width: 0;
	height: 106%;
    background: var(--accent-color);
	border-radius: 12px;
    transition: 0.4s ease-in-out;
	z-index: -1;
}

.btn-default:hover:before{
    transform: translate(-27px, -50%);
}

.btn-default:hover::after{
	width: 106%;
}

.btn-default.btn-highlighted{
	background-color: transparent;
	border: 1px solid var(--white-color);
	color: var(--white-color);
	padding: 19px 60px 19px 30px;
}

.btn-default.btn-highlighted:hover{
	border-color: var(--accent-color);
}

.btn-default.btn-highlighted::after{
	background-color: var(--accent-color);
}

.btn-large{
	font-size: 20px;
	padding: 20px 65px 20px 30px;
}

#magic-cursor{
	position: absolute;
    width: 10px !important;
    height: 10px !important;
    pointer-events: none;
    z-index: 1000000;
}

#ball{
	position: fixed;
	display: block;
	left: 0;
	top: 0;
	transform: translate(-50%, -50%);
	width: 8px !important;
	height: 8px !important;
	background: var(--accent-color);
	margin: 0;
	border-radius: 50%;
	pointer-events: none;
	opacity:1 !important;
}

.preloader{
	position: fixed;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	z-index: 1000;
	background-color: var(--accent-color);
	display: flex;
	align-items: center;
	justify-content: center;
}

.loading-container,
.loading{
	height: 100px;
	position: relative;
	width: 100px;
	border-radius: 100%;
}

.loading-container{
	margin: 40px auto;
}

.loading{
	border: 1px solid transparent;
	border-color: transparent var(--white-color) transparent var(--white-color);
	animation: rotate-loading 1.5s linear 0s infinite normal;
	transform-origin: 50% 50%;
}

.loading-container:hover .loading,
.loading-container .loading{
	transition: all 0.5s ease-in-out;
}

#loading-icon{
	position: absolute;
	top: 50%;
	left: 50%;
	max-width: 66px;
	transform: translate(-50%, -50%);
}

@keyframes rotate-loading{
	0%{
		transform: rotate(0deg);
	}

	100%{
		transform: rotate(360deg);
	}
}

.light-bg-section{
	margin: 0 25px;
}

.section-row{
	margin-bottom: 60px;
}

.section-row .section-title{
	text-align: center;
	margin-bottom: 0;
}

.section-row .section-title p{
	width: 100%;
	max-width: 850px;
	margin: 0 auto;
	margin-top: 30px;
}

.section-btn{
	line-height: 0.8em;
}

.section-title{
	margin-bottom: 40px;
}

.section-title h1{
	font-size: 70px;
	font-weight: 800;
	line-height: 1.1em;
	letter-spacing: -0.03em;
	margin-bottom: 0;
	cursor: none;
}

.section-title h2{
	font-size: 56px;
	font-weight: 800;
	line-height: 1.1em;
	letter-spacing: -0.03em;
	margin-bottom: 0;
	cursor: none;
}

.section-title h3{
	color: var(--accent-color);
	font-size: 16px;
    font-weight:bold;
	line-height: 1.1em;
	letter-spacing: 0.13em;
    text-transform: uppercase;
    margin-bottom: 20px;
}

.section-title p{
	margin-top: 30px;
	margin-bottom: 0;
}

.section-title-content{
	margin-top: 30px;
}

.section-title-content p{
	margin: 0;
}

.help-block.with-errors ul{
	margin: 0;
	text-align: left;
}

.help-block.with-errors ul li{
	color: var(--error-color);
	font-weight: 500;
	font-size: 14px;
}

/************************************/
/**** 	   03. Header css		 ****/
/************************************/



.navbar-brand img{
	width:250px;
	height:120px;
}

  /* Force the header to stand completely above everything else */
    /* header.main-header {
        position: fixed;
        top: 0;
        left: 0;
        width: 100%;
        z-index: 9999;
        background-color: rgb(232, 230, 230) !important; 
        backdrop-filter: blur(5px);
        box-shadow: 0 2px 10px rgba(0,0,0,0.1);
        transition: all 0.3s ease-in-out;
    } */

    /* Prevent the hero content from getting cut off or hidden behind the fixed header */
    .hero.hero-slider {
        margin-top: 90px; /* Adjust this value to exactly match your header's rendered height */
    }

    /* Optional adjustment for smoother design integration */
    .header-sticky {
        padding: 10px 0;
    }

/* header.main-header{
	background-color: transparent;
	border-bottom: 1px solid var(--dark-divider-color);
	position: relative;
	z-index: 100;
} */

header.main-header .header-sticky{
	position: relative;
	top: 0;
	z-index: 100;
}

header.main-header .header-sticky.hide{
	transform: translateY(-100%);
	transition: transform 0.3s ease-in-out;
	border-radius: 0;
}

header.main-header .header-sticky.active{
	position: fixed;
	top: 0;
	left: 0;
	right: 0;
	border-radius: 0;
    transform: translateY(0);
	background: var(--primary-color);
	border-bottom: 1px solid var(--divider-color);
	backdrop-filter: blur(30px);
}

.navbar{
	padding: 0px 30px;
	align-items: center;
}

.navbar-brand{
	padding: 0;
	margin: 0;
}

.main-menu .nav-menu-wrapper{
	flex: 1;
	text-align: center;
}

.main-menu .nav-menu-wrapper > ul{
	align-items: center;
	display: inline-flex;
}

.main-menu ul li{
	margin: 0 5px;
	position: relative;
}

.main-menu ul li a{
	font-family: var(--accent-font);
	font-size: 16px;
	font-weight: 500;
	padding: 4px !important;
	color: var(--primary-color);
	text-transform: capitalize;
	transition: all 0.3s ease-in-out;
}

.main-menu ul li.submenu > a:after{
	content: '\f107';
	font-family: 'FontAwesome';
	font-weight: 900;
	font-size: 14px;
	margin-left: 8px;
}

.main-menu ul li a:hover,
.main-menu ul li a:focus{
	color: var(--accent-color);
}

.main-menu ul ul{
	visibility: hidden;
	opacity: 0;
	transform: scaleY(0.8);
	transform-origin: top;
	padding: 0;
	margin: 0;
	list-style: none;
	width: 210px;
	border-radius: 15px;
	position: absolute;
	left: 0;
	top: 100%;
	overflow: hidden;
	background-color: var(--accent-color);
	transition: all 0.3s ease-in-out;
	text-align: left;
}

.main-menu ul ul ul{
	left: 100%;
	top: 0;
	text-align: left;
}

.main-menu ul ul li{
	margin: 0;
	padding: 0;
}

.main-menu ul ul li a{
	color: var(--white-color);
	padding: 8px 20px !important;
	transition: all 0.3s ease-in-out;
}

.main-menu ul li:hover > ul{
	visibility: visible;
	opacity: 1;
	transform: scaleY(1);
    padding: 5px 0;
}

.main-menu ul ul li a:hover{
	color: var(--primary-color);
	background-color: transparent;
	padding: 8px 20px 8px 23px !important;
}

.header-btn .btn-default{
	padding: 20px 30px;
}

.header-btn .btn-default:hover{
	color: var(--primary-color);
}

.header-btn .btn-default::before{
	display: none;
}

.header-btn .btn-default::after{
	background: var(--white-color);
}

.main-menu ul li.highlighted-menu{
    display: none;
}

.responsive-menu,
.navbar-toggle{
	display: none;
}

.responsive-menu{
	top: 0;
	position: relative;
}

.slicknav_btn{
	background: var(--accent-color);
	padding: 6px 0 0;
	width: 38px;
	height: 38px;
	margin: 0;
	border-radius: 6px;
}

.slicknav_icon .slicknav_icon-bar{
	display: block;
	width: 100%;
	height: 3px;
	width: 22px;
	background-color: var(--white-color);
	border-radius: 6px;
	margin: 4px auto !important;
	transition: all 0.1s ease-in-out;
}

.navbar-toggle a.slicknav_btn.slicknav_open .slicknav_icon span.slicknav_icon-bar:nth-child(1){
    transform: rotate(-45deg) translate(-5px, 5px);
}

.navbar-toggle a.slicknav_btn.slicknav_open .slicknav_icon span.slicknav_icon-bar:nth-child(2){
    opacity: 0;
}

.navbar-toggle a.slicknav_btn.slicknav_open .slicknav_icon span.slicknav_icon-bar:nth-child(3){
    transform: rotate(45deg) translate(-5px, -5px);
}

.slicknav_menu{
	position: absolute;
    width: 100%;
	padding: 0;
	background: var(--accent-color);
}

.slicknav_menu ul{
	margin: 5px 0;
}

.slicknav_menu ul ul{
	margin: 0;
}

.slicknav_nav .slicknav_row,
.slicknav_nav li a{
	position: relative;
	font-family: var(--accent-font);
	font-size: 16px;
	font-weight: 500;
	text-transform: capitalize;
	padding: 10px 20px;
	color: var(--white-color);
	line-height: normal;
	margin: 0;
	border-radius: 0 !important;
	transition: all 0.3s ease-in-out;
}

.slicknav_nav a:hover,
.slicknav_nav .slicknav_row:hover{
	background-color: transparent;
	color: var(--primary-color);
}

.slicknav_menu ul ul li a{
    padding: 10px 20px 10px 30px;
}

.slicknav_arrow{
	font-size: 0 !important;
}

.slicknav_arrow:after{
	content: '\f107';
	font-family: 'FontAwesome';
	font-weight: 900;
	font-size: 12px;
	margin-left: 8px;
	color: var(--white-color);
	position: absolute;
	right: 15px;
    top: 15px;
	transition: all 0.3s ease-out;
}

.slicknav_open > a .slicknav_arrow:after{
    transform: rotate(-180deg);
	color: var(--primary-color);
}

/************************************/
/***        04. Hero css	      ***/
/************************************/

.hero.bg-section {
    margin: 0 20px;
    margin-top: 153px;
    overflow: hidden;
    
    /* Forces beautiful curves on all 4 corners */
    border-radius: 40px; 
    -webkit-border-radius: 40px; /* Ensures support for Safari/iOS devices */
    
    /* Correct placement for background properties */
    /* background-image: url("../images/hero-bg.jpg"); */
    background-repeat: no-repeat;
    background-position: center center;
    background-size: cover;
    
    padding: 200px 0;
    position: relative;
}
.hero.bg-section:before{
	content: '';
	display: block;
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	background: var(--overlay-color);
	z-index: 1;
}

.hero.bg-section.hero-slider{
	text-align: center;
	background: none;
	padding: 0;
}

.hero-slider-layout .hero-slide{
	position: relative;
    padding: 200px 0 200px;
}

.hero.hero-slider:before{
	display: none ;
}

.hero.hero-slider .hero-slider-layout{
	position: relative;
	z-index: 2;
}

.hero-slider-layout .hero-slide::before{
	content: '';
	position: absolute;
	background: linear-gradient(180deg, rgba(14, 13, 27, 0) 0%, rgba(14, 13, 27, 0.55) 40.5%);
	background-repeat: no-repeat;
	background-position: center center;
	top: 0;
	bottom: 0;
	right: 0;
	left: 0;
	width: 100%;
	height: 100%;
	z-index: 1;
}

.hero.hero-slider .hero-slider-layout .hero-slide .hero-slider-image{
	position: absolute;
	top: 0;
	right: 0;
	left: 0;
	bottom: 0;
}

.hero.hero-slider .hero-slider-layout .hero-slide .hero-slider-image img{
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.hero.hero-slider .hero-slider-layout .hero-slide .hero-content{
	position: relative;
	z-index: 2;
	width: 100%;
	max-width: 930px;
	margin: 0 auto;
}

.hero-slider-layout .swiper-pagination{
	z-index: 2;
    bottom: 100px;
}

.hero-slider-layout .swiper-pagination .swiper-pagination-bullet{
    width: 15px;
    height: 15px;
    background: var(--white-color);
    opacity: 1;
    transition: all 0.3s ease-in-out;
    margin: 0 5px;
}

.hero-slider-layout .swiper-pagination .swiper-pagination-bullet-active{
    background-color: var(--accent-color);
}

.hero-video .hero-bg-video{
	position: absolute;
	top: 0;
	right: 0;
	left: 0;
	bottom: 0;
}

.hero-video .hero-bg-video video{
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.hero-video .hero-bg-video{
	position: absolute;
	top: 0;
	right: 0;
	left: 0;
	bottom: 0;
}

.hero-video .hero-bg-video video{
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.hero-content{
	position: relative;
	width: 100%;
	max-width: 920px;
	margin:  0 auto;
	text-align: center;
	z-index: 1;
}

.hero-content .section-title h1{
	color: var(--white-color);
}

.hero-content .section-title p{
	font-size: 22px;
	color: var(--white-color);
}

.hero-content-body .btn-default.btn-highlighted{
	margin-left: 30px;
}

/************************************/
/***       05. About Us css	      ***/
/************************************/

.about-us{
	padding: 40px 0;
}

.about-content{
	margin-left: 95px;
}

.about-content-body{
	margin-bottom: 50px;
}

.about-content-body ul{
	background-color: var(--secondary-color);
	border-radius: 20px;
	padding: 30px;
	margin: 0;
	list-style: none;
}

.about-content-body ul li{
	position: relative;
	font-size: 20px;
	color: var(--primary-color);
	font-weight: 500;
    padding-left: 30px;
    margin-bottom: 15px;
}

.about-content-body ul li:last-child{
	margin-bottom: 0;
}

.about-content-body ul li:before{
    content: '\f058';
    font-family: 'Font Awesome 5 Free';
    font-weight: 900;
    font-size: 20px;
    color: var(--accent-color);
    display: inline-block;
    line-height: normal;
    position: absolute;
    top: 4px;
    left: 0;
}

.about-content-footer{
	display: flex;
	align-items: center;
}

.about-footer-btn{
	line-height: 0.8em;
}

.about-contact-support{
	display: flex;
	align-items: center;
	margin-left: 30px;
}

.about-contact-support .icon-box{
	margin-right: 20px;
}

.about-contact-support .icon-box img{
	max-width: 40px;
}

.about-support-content{
	width: calc(100% - 60px);
}

.about-support-content p{
	font-family: var(--accent-font);
	font-size: 16px;
	margin-bottom: 5px;
}

.about-support-content h3{
	font-size: 24px;
}

/************************************/
/***     06. Our Services css	  ***/
/************************************/

.our-service{
	background: var(--secondary-color) url("../images/our-service-bg.png") no-repeat;
    background-position: right top;
    background-size: auto;
	padding: 100px 0 70px;
}

.service-item{
	position: relative;
    overflow: hidden;
    text-align: center;
	height: calc(100% - 30px);
	margin-bottom: 30px;
	transition: all 0.4s ease-in-out;
}

.service-image{
	overflow: hidden;
	border-radius: 40px;
}

.service-image a{
	position: relative;
	cursor: none;
	display: block;
}

.service-item .service-image a::before{
	content: "";
    position: absolute;
    top: 0;
    bottom: 0;
    right: 0;
    left: 0;
	background: linear-gradient(180deg, rgba(217, 217, 217, 0) 0%, rgba(217, 217, 217, 0) 13.02%, rgba(0, 0, 0, 0.51) 42.5%, rgba(0, 0, 0, 0.63) 70%, #000000 100%);
	border-radius: 40px;
    background-repeat: no-repeat;
    background-position: center center;
	z-index: 1;
	transition: all 0.4s ease-in-out;
}

.service-image img{
	width: 100%;
	border-radius: 40px;
	aspect-ratio: 1 / 1.2;
	object-fit: cover;
    transition: all 0.4s ease-in-out;
}

.service-item:hover .service-image img{
    transform: scale(1.1);
}

.service-body{
    position: absolute;
    bottom: 10px;
    right: 40px;
    left: 40px;
	text-align: left;
    z-index: 2;
	transform: translateY(70%);
    transition: all 0.5s ease-in-out;
}

.service-item:hover .service-body{
	transform: translateY(0%);
	bottom: 20px;
}

.service-body-title h3{
	font-size: 24px;
	font-weight: 700;
	color: var(--white-color);
	text-transform: capitalize;
	margin-bottom: 20px;
}

.service-content{
	opacity: 0;
    overflow: hidden;
    transition: all 0.4s ease-in-out;
}

.service-item:hover .service-content{
	opacity: 1;
}

.service-content p{
	color: var(--white-color);
}

.service-content-footer .readmore-btn{
	position: relative;
	font-family: var(--accent-font);
	font-size: 18px;
	font-weight: 700;
	text-transform: capitalize;
	color: var(--accent-color);
	padding-right: 30px;
	transition: 0.4s ease-in-out;
}

.service-content-footer .readmore-btn:hover{
	color: var(--white-color);
}

.service-content-footer .readmore-btn::after{
	content: '';
    position: absolute;
    top: 1px;
    right: 0;
    bottom: 0;
    background-image: url("../images/readmore-arrow.svg");
    background-repeat: no-repeat;
    background-position: center center;
    width: 24px;
    height: 24px;
    transition: 0.4s ease-in-out;
}

.service-content-footer .readmore-btn:hover::after{
	filter: brightness(0) invert(1);
	right: -4px;
}

.service-footer-btn{
	text-align: center;
	margin-top: 30px;
}

/************************************/
/***     07. Why Choose Us css    ***/
/************************************/

.why-choose-us{
	padding: 100px 0 70px;
}

.why-choose-item{
	border: 1px solid var(--divider-color);
	border-radius: 40px;
	height: calc(100% - 30px);
	margin-bottom: 30px;
	padding: 30px;
}

.why-choose-item .icon-box{
	margin-bottom: 30px;
}

.why-choose-item .icon-box img{
	max-width: 70px;
}

.why-choose-content{
	border-bottom: 1px solid var(--divider-color);
	margin-bottom: 30px;
	padding-bottom: 30px;
}

.why-choose-content h3{
	font-size: 24px;
	font-weight: 700;
	text-transform: capitalize;
	margin-bottom: 30px;
}

.why-choose-content p{
	margin: 0;
}

.why-choose-counter h3{
	font-size: 56px;
	letter-spacing: -0.03em;
	line-height: 1.1em;
	margin-bottom: 5px;
}

.why-choose-counter p{
	text-transform: capitalize;
	margin: 0;
}

.why-choose-image{
	height: calc(100% - 30px);
	margin-bottom: 30px;
}

.why-choose-image figure,
.why-choose-image img{
	height: 100%;
	border-radius: 40px;
}

.why-choose-image:hover img{
	filter: grayscale(80%);
}

/************************************/
/***     08. Our Projects css     ***/
/************************************/

.our-projects{
	background: var(--secondary-color) url("../images/our-projects-bg.png") no-repeat;
    background-position: left bottom;
    background-size: auto;
	padding: 100px 0;
}

.project-item{
	position: relative;
    overflow: hidden;
    text-align: center;
	height: calc(100% - 30px);
	margin-bottom: 30px;
	transition: all 0.4s ease-in-out;
}

.project-image{
	overflow: hidden;
	border-radius: 40px;
}

.project-image a{
	position: relative;
	cursor: none;
	display: block;
}

.project-item .project-image a::before{
	content: "";
    position: absolute;
    top: 0;
    bottom: 0;
    right: 0;
    left: 0;
	background: linear-gradient(180deg, rgba(217, 217, 217, 0) 0%, rgba(217, 217, 217, 0) 13.02%, rgba(0, 0, 0, 0.51) 42.5%, rgba(0, 0, 0, 0.63) 70%, #000000 100%);
	border-radius: 40px;
    background-repeat: no-repeat;
    background-position: center center;
	z-index: 1;
	transition: all 0.4s ease-in-out;
}

.project-image img{
	width: 100%;
	border-radius: 40px;
	aspect-ratio: 1 / 1.2;
	object-fit: cover;
    transition: all 0.4s ease-in-out;
}

.project-item:hover .service-image img{
    transform: scale(1.1);
}

.project-body{
    position: absolute;
    bottom: 10px;
    right: 40px;
    left: 40px;
	text-align: left;
    z-index: 2;
	transform: translateY(75%);
    transition: all 0.5s ease-in-out;
}

.project-item:hover .project-body{
	transform: translateY(0%);
	bottom: 20px;
}

.project-body-title h3{
	font-size: 24px;
	font-weight: 700;
	color: var(--white-color);
	text-transform: capitalize;
	margin-bottom: 150px;
}

.project-content{
	opacity: 0;
    overflow: hidden;
    transition: all 0.4s ease-in-out;
}

.project-item:hover .project-content{
	opacity: 1;
}

.project-content p{
	color: var(--white-color);
}

.project-content-footer .readmore-btn{
	position: relative;
	font-family: var(--accent-font);
	font-size: 18px;
	font-weight: 700;
	text-transform: capitalize;
	color: var(--accent-color);
	padding-right: 30px;
	transition: 0.4s ease-in-out;
}

.project-content-footer .readmore-btn:hover{
	color: var(--white-color);
}

.project-content-footer .readmore-btn::after{
	content: '';
    position: absolute;
    top: 1px;
    right: 0;
    bottom: 0;
    background-image: url("../images/readmore-arrow.svg");
    background-repeat: no-repeat;
    background-position: center center;
    width: 24px;
    height: 24px;
    transition: 0.4s ease-in-out;
}

.project-content-footer .readmore-btn:hover::after{
	filter: brightness(0) invert(1);
	right: -4px;
}

.project-footer-btn{
	text-align: center;
	margin-top: 30px;
}

/************************************/
/***     09. Our Cta Box css      ***/
/************************************/

.cta-box{
	position: relative;
	background: var(--primary-color) url("../images/cta-box-bg.png") no-repeat;
	background-position: right bottom;
	background-size: auto;
	padding: 100px 0;
}

.cta-box .section-title h2{
	color: var(--white-color);
}

.cta-box .section-title p{
	color: var(--white-color);
}

.cta-box-image{
	position: absolute;
	bottom: 0;
	text-align: end;
}

.section-btn .btn-default{
	border: 2px solid transparent;
}

.section-btn .btn-default:hover{
	border: 2px solid var(--white-color);
}

/************************************/
/***   10. Our Testiminial css    ***/
/************************************/

.our-testimonial{
	padding: 40px 0;
}

.testimonial-slider .swiper-wrapper{
	cursor: none;
}

.testimonial-item{
	border: 1px solid var(--divider-color);
	border-radius: 40px;
	padding: 30px;
}

.testimonial-header{
	border-bottom: 1px solid var(--divider-color);
	margin-bottom: 30px;
	padding-bottom: 30px;
}

.testimonial-rating{
	margin-bottom: 30px;
}

.testimonial-rating i{
	font-size: 20px;
	color: var(--accent-color);
}

.testimonial-content p{
	margin: 0;
}

.testimonial-body{
	display: flex;
	align-items: center;
}

.author-image{
	margin-right: 20px;
}

.author-image img{
	width: 65px;
	height: 65px;
	border-radius: 50%;
}

.author-content{
	width: calc(100% - 85px);
}

.author-content h3{
	font-size: 24px;
	text-transform: capitalize;
	margin-bottom: 5px;
}

.author-content p{
	text-transform: capitalize;
	margin: 0;
}

.testimonial-slider .swiper-pagination{
	position: relative;
	text-align: center;
	bottom: 0px;
	margin-top: 30px;
}

.testimonial-slider .swiper-pagination .swiper-pagination-bullet{
	height: 12px;
	width: 12px;
	border-radius: 50%;
	background-color: var(--accent-color);
	opacity: 1;
	margin: 0px 6px;
}

.testimonial-slider .swiper-pagination .swiper-pagination-bullet-active{
	background-color: var(--primary-color);
	opacity: 1;
}


/************************************/
/***      11. Our FAQs  css       ***/
/************************************/

.our-faqs{
	background: var(--secondary-color) url("../images/our-faqs-bg.png") no-repeat;
	background-position: right bottom;
	background-size: auto;
	padding: 40px 0;
}

.our-faqs-images{
	position: relative;
}

.our-faqs-bulitup{
	position: absolute;
	top: 50%;
	bottom: 0;
	left: 50%;
	right: 0;
	transform: translate(-50%, -50%);
	background-color: var(--white-color);
	border-radius: 50%;
	width: 100px;
	height: 100px;
	display: flex;
	align-items: center;
	justify-content: center;
}

.our-faqs-bulitup img{
	max-width: 50px;
}

.our-faqs-images .row:first-child{
	margin-bottom: 30px;
}

.faqs-img-2 img,
.faqs-img-1 img{
	border-radius: 40px;
}

.faq-accordion{
	margin-left: 30px;
}

.faq-accordion .accordion-item{
	position: relative;
	background: none;
	border-bottom: 1px solid var(--white-color);
	padding-bottom: 20px;
	margin-bottom: 20px;
}

.faq-accordion .accordion-item:last-child{
	border: none;
	margin-bottom: 0;
	padding-bottom: 0;
}

.faq-accordion .accordion-item .accordion-button{
	font-size: 24px;
	font-weight: 700;
	border: none;
	box-shadow: none;
	padding: 10px 40px 10px 10px;
	position: relative;
	transition: all 0.3s ease-in-out;
}

.faq-accordion .accordion-button:not(.collapsed){
    color: var(--accent-color);
}

.faq-accordion .accordion-item .accordion-button::after,
.faq-accordion .accordion-item .accordion-button.collapsed::after{
	content: '';
	position: absolute;
	right: 0;
	top: 50%;
	bottom: auto;
	transform: translate(0px, -50%) rotate(-90deg);
	background-image: url("../images/long-arrow.svg");
	background-repeat: no-repeat;
	background-position: right center;
	background-size: auto;
	display: flex;
	align-items: center;
	justify-content: center;
	width: 32px;
	height: 32px;
	padding: 0;
	transition: all 0.3s ease-in-out;
}

.faq-accordion .accordion-item .accordion-button.collapsed::after{
	transform: translate(0px, -50%) rotate(0deg);
}

.faq-accordion .accordion-item .accordion-collapse .accordion-body{
	padding: 10px 40px 10px 10px;
}

.faq-accordion .accordion-item .accordion-collapse .accordion-body p{
	margin: 0;
}

/************************************/
/***     12. Latest News css	  ***/
/************************************/

.our-blog{
	padding: 100px 0 70px;
}

.blog-item{
	border: 1px solid var(--divider-color);
	border-radius: 40px;
	height: calc(100% - 30px);
    margin-bottom: 30px;
}

.post-featured-image{
	overflow: hidden;
	border-radius: 40px 40px 0 0;
}

.post-featured-image a{
	display: block;
	cursor: none;
}

.post-featured-image img{
	aspect-ratio: 1/0.65;
	object-fit: cover;
	border-radius: 40px 40px 0 0;
	transition: all 0.5s ease-out;
}

.blog-item:hover .post-featured-image img{
	transform: scale(1.1);
}

.post-item-content{
	padding: 30px;
}

.post-item-body{
	margin-bottom: 20px;
}

.post-item-body h2{
	font-size: 24px;
	font-weight: 700;
}

.post-item-body h2 a{
	color: inherit;
}

.post-item-footer .readmore-btn{
	position: relative;
    font-family: var(--accent-font);
    font-size: 18px;
    font-weight: 700;
    text-transform: capitalize;
    color: var(--accent-color);
    padding-right: 30px;
    transition: 0.3s ease-in-out;
}

.post-item-footer .readmore-btn::after{
    content: '';
    position: absolute;
    top: 1px;
    right: 0;
    bottom: 0;
    background-image: url("../images/readmore-arrow.svg");
    background-repeat: no-repeat;
    background-position: center center;
    width: 24px;
    height: 24px;
    transition: 0.3s ease-in-out;
}

.post-item-footer .readmore-btn:hover::after{
    right: -3px;
}

/************************************/
/***      13. Contact Us Css	  ***/
/************************************/

.contact-us{
	background: var(--secondary-color) url("../images/contact-us-bg.png") no-repeat;
	background-position: center center;
	background-size: cover;
	padding: 100px 0;
}

.contact-sidebar{
	background: var(--primary-color);
	border-radius: 40px;
	text-align: center;
	padding: 40px 40px 0;
	transition: all 0.3s ease-in-out;
}

.contact-info{
	margin-bottom: 30px;
}

.contact-info .icon-box{
	margin-bottom: 20px;
}

.contact-info .icon-box img{
	max-width: 40px;
}

.contact-info-content p{
	color: var(--white-color);
	opacity: 64%;
	text-transform: capitalize;
	margin-bottom: 5px;
}

.contact-info-content h3{
	font-size: 24px;
	font-weight: 700;
	color: var(--white-color);
}

.contact-info-image{
	width: 100%;
	max-width: 190px;
	margin: 0 auto;
}

.contact-sidebar .contact-info-image img{
    filter: grayscale(0%);
    transition: all 0.3s ease-in-out;
}

.contact-sidebar:hover .contact-info-image img{
	filter: grayscale(80%);
}

.contact-form{
	background-color: var(--white-color);
	border-radius: 40px;
	padding: 50px;
}

.contact-form .form-control{
	padding: 15px;
	background-color: transparent;
	color: var(--primary-color);
	box-shadow: none;
	border: none;
	border-bottom: 1px solid var(--divider-color);
	border-radius: 0;
}

.contact-form .form-control::placeholder{
	color: var(--primary-color);
	opacity: 20%;
	text-transform: capitalize;
}

/************************************/
/***    	14. Footer css		  ***/
/************************************/

.main-footer{
	background: var(--accent-color);
	padding: 40px 0;
}

.footer-logo{
	margin-bottom: 40px;
}

.footer-content p{
	color: var(--white-color);
	margin: 0;
}

.footer-links h3{
	font-size: 24px;
	font-weight: 700;
	color: white;
	text-transform: capitalize;
	margin-bottom: 40px;
}

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

.footer-links ul li{
	position: relative;
	text-transform: capitalize;
    padding-left: 30px;
    margin-bottom: 10px;
}

/* .footer-links ul li:before{
    content: '';
    position: absolute;
    top: 3px;
    left: 0;
    background-image: url("../images/readmore-arrow.svg");
    background-repeat: no-repeat;
    background-position: center center;
    width: 20px;
    height: 20px;
    transition: 0.3s ease-in-out;
} */
/* Color and Layout for the Circle Arrow Icons */
.footer-links ul li a i {
    color: #EE0000;        /* The premium golden-orange tint */
    margin-right: 12px;    /* Spaces the text away from the icon */
    font-size: 16px;       /* Keeps the icon proportioned perfectly with the text */
    vertical-align: middle;
    transition: all 0.3s ease;
}

/* Optional premium hover animation */
.footer-links ul li a:hover i {
    color: #ffffff;        /* Swaps to crisp white on hover */
    transform: scale(1.1); /* Subtle premium pop effect */
}


.footer-links ul li:last-child{
	margin-bottom: 0;
}

.footer-links ul li a{
	color: var(--white-color) !important;
	transition: all 0.3s ease-in-out;
}

.footer-links ul li:hover a{
	color: var(--primary-color);
}

.footer-contact-box .footer-info-box{
	position: relative;
    padding-left: 40px;
    margin-bottom:5px;
}
/* Keeps the box on a single line */
.footer-info-box.contact-inline {
    display: flex;
    align-items: center;
    white-space: nowrap;
}

/* Enforces pure white text links */
.footer-white-link {
    color: #ffffff !important;
    text-decoration: none;
    transition: color 0.3s ease;
}

/* Subtle change to your theme gold when hovering over a number */
.footer-white-link:hover {
    color: #EE0000 !important; 
}

/* Spaces out the separator bar between the numbers */
.phone-separator {
    color: #ffffff;
    opacity: 0.4;
    margin: 0 10px;
}
.footer-contact-box .footer-info-box:last-child{
	margin-bottom: 0;
}

.footer-info-box .icon-box{
	position: absolute;
    top: 0;
    left: 0;
}

.footer-info-box .icon-box img{
	max-width: 26px;
}

.footer-info-box p{
	color: var(--white-color);
	margin: 0;
}

.footer-copyright{
	margin-top: 30px;
	padding: 20px 0;
	border-top: 1px solid var(--dark-divider-color);
	border-bottom: 1px solid var(--dark-divider-color);
}

.footer-copyright-text p{
	color: var(--white-color);
	margin: 0;
	font-size: 15px;
}

.footer-copyright .footer-social-links ul{
	list-style: none;
	margin: 0;
	padding: 0;
	text-align: end;
}

.footer-copyright .footer-social-links ul li{
	display: inline-block;
	margin-right: 10px;
}

.footer-copyright .footer-social-links ul li:last-child{
	margin-right: 0;
}

.footer-copyright .footer-social-links ul li a{
	background-color: transparent;
	color: white;
	border: 2px solid white;
    height: 36px;
    width: 36px;
    border-radius: 100%;
    text-align: center;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: all 0.3s ease-in-out;
}
/* Target the icons specifically inside the footer contact box */
.footer-contact-box .icon-box i {
    color: #EE0000 !important; /* Replace this hex code with your premium brand theme color */
}
/* Base Style for Footer Icons */
.main-footer .icon-box i,
.main-footer .footer-links ul li a i {
    color: #EE0000; /* Your premium theme color */
    transition: all 0.3s ease-in-out;
}

/* Subtle Hover Effect for Link Icons */
.main-footer .footer-links ul li a:hover i {
    color: #ffffff; /* Turns white or transitions when the link is hovered */
    transform: translateX(3px); /* Smooth slight nudge animation */
}
.footer-copyright .footer-social-links ul li a i{
	font-size: 18px;
}

.footer-copyright .footer-social-links ul li a:hover{
	border-color: var(--white-color);
	color: var(--white-color);
}

/************************************/
/***    15. About us Page css	  ***/
/************************************/

.page-header{
	margin: 0 40px;
	overflow: hidden;
	border-radius: 40px;
	background: url('../images/Allimages/breadcurumb.jpeg') no-repeat center center;
	background-size: cover;
	padding: 100px;
	position: relative;
	margin-top:153px;
}

.page-header:before{
	content: '';
	display: block;
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	background: var(--primary-color);
	opacity: 60%;
	border-radius: 40px;
	z-index: 1;
}

.page-header-box{
	position: relative;
	text-align: center;
	z-index: 1;
}

.page-header-box h1{
	font-size: 56px;
	color: var(--white-color);
	margin-bottom: 30px;
	line-height: 1.1em;
	letter-spacing: -0.03em;
}

.page-header-box ol{
	margin: 0;
	padding: 0;
	justify-content: center;
}

.page-header-box ol li.breadcrumb-item{
	color: var(--white-color);
	font-family: var(--accent-font);
	font-size: 24px;
	font-weight: 700;
	text-transform: capitalize;
}

.page-header-box ol li.breadcrumb-item a{
    color: inherit;
}

.page-header-box ol li.breadcrumb-item.active{
	color: var(--accent-color);
}

.page-header-box ol .breadcrumb-item+.breadcrumb-item::before{
    color: var(--white-color);
}

.page-about-us{
	padding: 100px 0;
}

.about-us-content{
	margin-left: 95px;
}

.about-us-content-body{
	margin-bottom: 50px;
}

.about-us-content-body ul{
	background-color: var(--secondary-color);
    border-radius: 20px;
    padding: 30px;
    margin: 0;
    list-style: none;
}

.about-us-content-body ul li{
	position: relative;
    font-size: 20px;
    color: var(--primary-color);
    font-weight: 500;
    padding-left: 30px;
    margin-bottom: 15px;
}

.about-us-content-body ul li:last-child{
	margin-bottom: 0;
}

.about-us-content-body ul li:before{
    content: '\f058';
    font-family: 'Font Awesome 5 Free';
    font-weight: 900;
    font-size: 20px;
    color: var(--accent-color);
    display: inline-block;
    line-height: normal;
    position: absolute;
    top: 4px;
    left: 0;
}

.about-us-content-footer{
	display: flex;
	align-items: center;
}

.about-us-footer-btn{
	line-height: 0.8em;
}

.about-us-contact-support{
	display: flex;
	align-items: center;
	margin-left: 30px;
}

.about-us-contact-support .icon-box{
	margin-right: 20px;
}

.about-us-contact-support .icon-box img{
	max-width: 40px;
}

.about-us-support-content{
	width: calc(100% - 60px);
}

.about-us-support-content p{
	font-family: var(--accent-font);
	font-size: 16px;
	margin-bottom: 5px;
}

.about-us-support-content h3{
	font-size: 24px;
}

.our-company-history{
	padding: 100px 0;
	background: var(--secondary-color);
}

.company-history-image{
	position: relative;
}

.company-history-img{
	text-align: left;
}

.company-history-img img{
	border-radius: 40px;
}

.company-experience{
	position: absolute;
	width: 100%;
	max-width: 225px;
	text-align: center;
	bottom: 20%;
	right: 0;
	background-color: var(--white-color);
	border-radius: 40px;
	padding: 40px;
	animation: expmoveobject 3s infinite linear alternate;
}

@keyframes expmoveobject{
	50%{
		right: 50px;
	}
}

.company-experience-content h3{
	font-size: 56px;
}

.company-experience-content p{
	margin: 0;
	text-transform: capitalize;
}

.company-history-body p:last-child{
	margin-bottom: 0;
}

.our-mission-vision{
	padding: 100px 0;
}

.mission-vision-item{
	padding: 30px;
	border: 1px solid var(--divider-color);
	border-radius: 40px;
}

.mission-vision-item .icon-box{
	margin-bottom: 30px;
}

.mission-vision-item .mission-vision-content h3{
	font-size: 24px;
	text-transform: capitalize;
	margin-bottom: 30px;
}

.mission-vision-item .mission-vision-content p{
	margin: 0;
}

.intro-video .container-fluid{
	padding: 0;
}

.intro-video-box{
    position: relative;
	z-index: 1;
    overflow: hidden;
	cursor: none;
}

.intro-video-box .video-image img{
	width: 100%;
	filter: brightness(30%);
	aspect-ratio: 1/0.33;
	object-fit: cover;
	transition: all 0.5s ease-in-out;
}

.intro-video-box:hover .video-image img{
    transform: scale(1.1);
}

.intro-video-box .video-image a{
	cursor: none;
	position: relative;
	z-index: 1;
}

/* .video-play-button{
	background: var(--white-color);
	height: 110px;
	width: 110px;
	position: absolute;
	top: 50%;
	left: 50%;
	display: flex;
	align-items: center;
	justify-content: center;
	border-radius: 100%;
	z-index: 2;
	transform: translate(-50%, -50%);
}

.video-play-button a{
	position: relative;
	background-color: var(--accent-color);
	width: 60px;
	height: 60px;
	display: flex;
	align-items: center;
	justify-content: center;
	border-radius: 100%;
	cursor: none;
} */

.video-play-button{
    position: absolute;
    top: 50%;
    left: 50%;
    z-index: 2;
    transform: translate(-50%, -50%);
}

.video-play-button a{
	position: relative;
	background-color: var(--white-color);
	border-radius: 100%;
	width: 100px;
	height: 100px;
	display: flex;
	align-items: center;
	justify-content: center;
	cursor: none;
}

.video-play-button a:before{
	content: '';
	position: absolute;
	top: -30%;
	left: -30%;
	width: 160%;
	height: 160%;
	border: 50px solid var(--white-color);
	border-radius: 50%;
	transform: scale(0.6);
	z-index: -1;
	animation: border-zooming 1.2s infinite linear;
}

.video-play-button a:after{
	content: '';
	position: absolute;
	top: -30%;
	left: -30%;
	width: 160%;
	height: 160%;
	border: 50px solid var(--white-color);
	border-radius: 50%;
	transform: scale(0.6);
	z-index: -1;
	animation: border-zooming 1.2s infinite linear;
	animation-delay: .3s;
}

@keyframes border-zooming{
	100%{
		transform: scale(1);
		opacity: 0;
	}
}

.video-play-button a i{
	font-size: 30px;
	color: var(--accent-color);
}

.what-we-do{
	padding: 40px 0;
	background: var(--secondary-color);
}

.what-we-do .section-title{
	width: 100%;
	max-width: 900px;
	margin: 0 auto;
}

.company-counter-item{
	background: var(--primary-color);
	padding: 50px 30px;
	text-align: center;
	border-radius: 40px;
}

.company-counter-item .company-counter-content h3{
	color: var(--white-color);
	font-size: 56px;
	letter-spacing: -0.03em;
	line-height: 1.1em;
	margin-bottom: 15px;
}

.company-counter-item .company-counter-content p{
	color: var(--white-color);
	opacity: 64%;
	text-transform: capitalize;
	margin: 0;
}

.our-team{
	padding: 100px 0 70px;
}

.team-member-item{
	border: 1px solid var(--divider-color);
	border-radius: 40px;
	height: calc(100% - 30px);
	margin-bottom: 30px;
	overflow: hidden;
}

.team-member-item .team-image img{
	border-radius: 40px 40px 0 0;
	transition: all 0.5s ease-in-out;
}

.team-member-item:hover .team-image img{
	transform: scale(1.1);
}

.team-body{
	padding: 30px;
}

.team-content{
	margin-bottom: 20px;
}

.team-content h3{
	font-size: 24px;
	text-transform: capitalize;
	margin-bottom: 5px;
}

.team-content p{
	text-transform: capitalize;
	margin: 0;
}

.team-social-icon ul{
	padding: 0;
	margin: 0;
}

.team-social-icon ul li{
	display: inline-block;
	margin-right: 5px;
}

.team-social-icon ul li:last-child{
	margin-right: 0;
}

.team-social-icon ul li a{
	color: var(--primary-color);
	height: 36px;
	width: 36px;
	display: flex;
	align-items: center;
	justify-content: center;
	border: 2px solid var(--primary-color);
	border-radius: 100%;
	transition: all 0.3s ease-in-out;
}

.team-social-icon ul li a:hover{
	color: var(--accent-color);
	border-color: var(--accent-color);
}

.team-social-icon ul li a i{
    font-size: 18px;
}

/************************************/
/***    16. Services Page css	  ***/
/************************************/

.page-service{
	padding: 100px 0 70px;
}

/************************************/
/***    17. Service Single css	  ***/
/************************************/

.page-service-single{
	padding: 100px 0;
}

.service-sidebar{
	padding-right: 50px;
	position: sticky;
	top: 20px;
}

.service-categories-list{
	border: 1px solid var(--divider-color);
	border-radius: 40px;
	padding: 30px;
	margin-bottom: 30px;
}

.service-categories-list h3{
	font-size: 24px;
	text-transform: capitalize;
	margin-bottom: 30px;
}

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

.service-categories-list ul li{
	margin-bottom: 20px;
	padding: 0 0 20px 30px;
	border-bottom: 1px solid var(--divider-color);
	position: relative;
}

.service-categories-list ul li:last-child{
	margin-bottom: 0px;
	padding-bottom: 0;
	border-bottom: none;
}

.service-categories-list ul li:before{
	content: '';
    position: absolute;
    top: 3px;
    left: 0;
    background: url('../images/readmore-arrow.svg') no-repeat center center;
    width: 20px;
    height: 20px;
}

.service-categories-list ul li a{
	display: block;
	color: var(--primary-color);
	text-transform: capitalize;
	transition: 0.3s ease-in-out;
}

.service-categories-list ul li a:hover{
	color: var(--accent-color);
}

.sidebar-cta-box{
	background: url('../images/service-sidebar-cta-bg.png') no-repeat top right, var(--primary-color);
	background-size: auto;
	border-radius: 40px;
	padding: 30px;
	text-align: center;
}

.sidebar-cta-box .cta-content{
	margin-bottom: 40px;
}

.sidebar-cta-box .cta-content h3{
	font-size: 24px;
	color: var(--white-color);
	text-transform: capitalize;
	margin-bottom: 30px;
}

.sidebar-cta-box .cta-content p{
	color: var(--white-color);
	margin: 0;
}
 
.cta-contact-info{
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: center;
	flex-direction: column;
}

.cta-contact-info .cta-contact-item{
	display: flex;
	align-items: center;
	background: var(--white-color);
	padding: 8px 12px;
	border-radius: 99px;
	margin-bottom: 20px;
}

.cta-contact-info .cta-contact-item:last-child{
	margin-bottom: 0;
}

.cta-contact-info .cta-contact-item .icon-box{
	display: flex;
	align-items: center;
	justify-content: center;
	min-height: 37px;
	min-width: 37px;
	background: var(--accent-color);
	border-radius: 50%;
	margin-right: 10px;
}
 
.cta-contact-info .cta-contact-item .cta-contact-content{
	width: calc(100% - 47px);
}

.cta-contact-info .cta-contact-item .cta-contact-content p{
	margin: 0;
}

.cta-contact-info .cta-contact-item .cta-contact-content p a{
	color: var(--primary-color);
	transition: all 0.3s ease-in-out;
}

.cta-contact-info .cta-contact-item:hover .cta-contact-content p a{
	color: var(--accent-color);
}

.service-images-slider{
	margin-bottom: 30px;
}

.service-image-item figure,
.service-image-item img{
	border-radius: 40px;
	overflow: hidden;
	aspect-ratio: 1 / 0.7;
    object-fit: cover;
}

.service-images-slider .swiper-arrow-prev,
.service-images-slider .swiper-arrow-next{
	display: flex;
	align-items: center;
	justify-content: center;
	position: absolute;
	top: 50%;
	z-index: 1;
	transform: translateY(-50%);
}

.service-images-slider .swiper-arrow-prev{
	left: 20px;
}

.service-images-slider .swiper-arrow-next{
	right: 20px;
}

.service-images-slider .swiper-arrow-prev:before,
.service-images-slider .swiper-arrow-next:before{
	content: '';
	background: url('../images/icon-arrow-left.svg') no-repeat center left;
	background-size: 100% auto;
	height: 33px;
	width: 33px;
}

.service-images-slider .swiper-arrow-next:before{
	background: url('../images/icon-arrow-right.svg') no-repeat center left;
	background-size: 100% auto;
	height: 33px;
	width: 33px;
}

.service-single-content p{
	margin-bottom: 30px;
}

.service-single-content p:last-child{
	margin-bottom: 0;
}

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

.service-entry ul{
	list-style: none;
	margin: 0;
	padding: 0;
	display: flex;
	flex-wrap: wrap;
	gap: 20px;
}

.service-entry ul li{
	position: relative;
    width: calc(50% - 10px);
	color: var(--primary-color);
	font-weight: 500;
	padding-left: 30px;
	text-transform: capitalize;
}

.service-entry ul li:before{
	content: '\f058';
    font-family: 'Font Awesome 5 Free';
    font-weight: 900;
    font-size: 18px;
    color: var(--accent-color);
    display: inline-block;
    line-height: normal;
    position: absolute;
    top: 4px;
    left: 0;
}

.service-sustainable .service-sustainable-img-1 figure,
.service-sustainable .service-sustainable-img-2 figure{
	display: block;
}


.service-sustainable .service-sustainable-img-1 img,
.service-sustainable .service-sustainable-img-2 img{
	border-radius: 40px;
}

.service-sustainable-content{
	margin-top: 30px;
}

.service-sustainable-content h3{
	font-size: 24px;
	margin-bottom: 30px;
}

.service-benefit{
	padding: 100px 0 70px;
	background: url('../images/service-benefit-bg.jpg') no-repeat center center;
	background-size: cover;
	position: relative;
}

.service-benefit::before{
	content: '';
    display: block;
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: var(--primary-color);
    opacity: 70%;
    z-index: 0;
}

.service-benefit .service-benefit-item{
	background: var(--white-color);
	padding: 30px;
	border: 1px solid var(--divider-color);
	border-radius: 40px;
	height: calc(100% - 30px);
	margin-bottom: 30px;
	position: relative;
	z-index: 1;
}

.service-benefit-item .icon-box{
	margin-bottom: 30px;
}

.service-benefit-item .service-benefit-content h3{
	font-size: 24px;
	text-transform: capitalize;
	margin-bottom: 30px;
}

.service-benefit-item .service-benefit-content p{
	color: var(--text-color);
	margin: 0;
}

.working-process{
	padding: 100px 0 70px;
}

.working-process-item{
	padding: 30px;
	border: 1px solid var(--divider-color);
	border-radius: 40px;
	height: calc(100% - 30px);
	margin-bottom: 30px;
}

.working-process-item .step-number{
	margin-bottom: 30px;
}

.working-process-item .step-number h2{
	font-size: 40px;
	color: var(--accent-color);
}

.working-process-item .working-process-content h3{
	font-size: 24px;
	margin-bottom: 30px;
	text-transform: capitalize;
}


.working-process-item .working-process-content p{
	color: var(--text-color);
	margin: 0;
}

/************************************/
/***    18. Blog Archive css	  ***/
/************************************/

.page-blog{
	padding: 100px 0;
}

.page-blog .blog-item{
	height: calc(100% - 40px);
	margin-bottom: 40px;
}

.post-pagination{
    margin-top: 30px;
    text-align: center;
}

.post-pagination ul{
    justify-content: center;
    padding: 0;
    margin: 0;
}

.post-pagination ul li a,
.post-pagination ul li span{
    display: flex;
    text-decoration: none;
    justify-content: center;
    align-items: center;
    background: transparent;
    color: var(--primary-color);
	border: 1px solid var(--accent-color);
    width: 40px;
    height: 40px;
    margin: 0 5px;
    border-radius: 50%;
    font-weight: 700;
	line-height: 1em;
    transition: all 0.3s ease-in-out;
}

.post-pagination ul li.active a, 
.post-pagination ul li a:hover{
    background: var(--accent-color);
	color: var(--white-color);
}

/************************************/
/***     19. Blog Single css	  ***/
/************************************/

.page-single-post{
	padding: 100px 0;
}

.post-single-meta ol li i{
    font-size: 22px;
    color: var(--accent-color);
    margin-right: 5px;
}

.post-image{
	position: relative;
	margin-bottom: 30px;
}

.post-image figure{
	display: block;
}

.post-image figure,
.post-image img{
	aspect-ratio: 1 / 0.50;
	object-fit: cover;
	border-radius: 40px;
}

.post-content{
	width: 100%;
	max-width: 1100px;
	margin: 0 auto;
}

.post-entry{
	border-bottom: 1px solid var(--divider-color);
	padding-bottom: 30px;
    margin-bottom: 30px;
}

.post-entry:after{
    content: '';
    display: block;
    clear: both;
}

.post-entry a{
    color: var(--accent-color);
}

.post-entry h1,
.post-entry h2,
.post-entry h3,
.post-entry h4,
.post-entry h5,
.post-entry h6{
	margin: 0 0 0.6em;
}

.post-entry h1{
	font-size: 56px;
}

.post-entry h2{
	font-size: 46px;
}

.post-entry h3{
	font-size: 40px;
}

.post-entry h4{
	font-size: 30px;
}

.post-entry h5{
	font-size: 24px;
}

.post-entry h6{
	font-size: 18px;
}

.post-entry p{
	margin-bottom: 20px;
}

.post-entry p:last-child{
	margin-bottom: 0;
}

.post-entry p strong{
	color: var(--primary-color);
	font-size: 18px;
	font-weight: 700;
}

.post-entry ol{
    margin: 0 0 30px;
}

.post-entry ol li{
    margin-bottom: 20px;
    font-size: 18px;
    font-weight: 700;
    color: var(--text-color);
}

.post-entry ul{
	padding: 0;
	margin: 20px 0 20px;
	padding-left: 20px;
}

.post-entry ul li{
	font-size: 18px;
    font-weight: 500;
    color: var(--primary-color);
    position: relative;
    margin-bottom: 18px;
}

.post-entry ul li:last-child{
	margin-bottom: 0;
}

.post-entry ul ul,
.post-entry ul ol,
.post-entry ol ol,
.post-entry ol ul{
    margin-top: 20px;
    margin-bottom: 0;
}

.post-entry ul ul li:last-child,
.post-entry ul ol li:last-child,
.post-entry ol ol li:last-child,
.post-entry ol ul li:last-child{
    margin-bottom: 0;
}

.post-entry blockquote{
	background: var(--secondary-color) url('../images/icon-blockquote.svg') no-repeat 40px 46px;
	background-size: 45px;
	border-radius: 16px;
	padding: 40px 40px 40px 110px;
	margin-bottom: 30px;
}

.post-entry blockquote p{
	color: var(--primary-color);
	font-size: 22px;
	font-weight: 600;
}

.post-entry blockquote p:last-child{
	margin-bottom: 0;
}

.tag-links{
	font-size: 24px;
	font-weight: 700;
	color: var(--primary-color);
	display: inline-block;
}

.post-tags .tag-links a{
    display: inline-block;
    font-size: 18px;
    font-weight: 700;
    text-transform: capitalize;
    background-color: var(--accent-color);
    color: var(--white-color);
	border-radius: 10px;
    padding: 8px 20px;
    margin-left: 10px;
    margin-bottom: 10px;
	transition: all 0.3s ease-in-out;
}

.post-tags .tag-links a:hover{
	background: var(--primary-color);
}

.post-social-sharing{
    text-align: right;
}

.post-social-sharing ul{
    list-style: none;
    padding: 0;
    margin: 0;
}

.post-social-sharing ul li{
    display: inline-block;
    margin-right: 10px;
}

.post-social-sharing ul li:last-child{
	margin-right: 0;
}

.post-social-sharing ul li a{
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    text-align: center;
	background-color: var(--accent-color);
    color: var(--white-color);
    width: 38px;
    height: 38px;
    transition: all 0.3s ease-in-out;
}

.post-social-sharing ul li:hover a{
	background-color: var(--primary-color);
}

.post-social-sharing ul li a i{
    font-size: 18px;
    color: inherit;
    transition: all 0.3s ease-in-out;
}

.post-social-sharing ul li:hover a i{
    color: var(--secondry-color);
}

/************************************/
/***     20. Project Page css  	  ***/
/************************************/

.page-project{
	padding: 100px 0;
}

/************************************/
/***    21. Project Single css    ***/
/************************************/

.page-project-single{
	padding: 100px 0;
}

.project-single-content{
	margin-right: 20px;
}

.project-featured-image{
	margin-bottom: 30px;
}

.project-featured-image figure{
	display: block;
}

.project-featured-image img{
	border-radius: 40px;
	aspect-ratio: 1/ 0.6;
	object-fit: cover;
}

.project-details-content{
	margin-bottom: 40px;
}

.project-details-title{
	margin-bottom: 30px;
}

.project-details-content p{
	margin-bottom: 30px;
}

.project-details-title h3{
	font-size: 24px;
	font-weight: 700;
}

.project-details-content ul{
    padding: 0;
    margin: 0;
    list-style: none;
	display: flex;
	flex-wrap: wrap;
    gap: 20px;
}

.project-details-content ul li{
    position: relative;
    font-weight: 500;
	color: var(--primary-color);
	width: calc(50% - 10px);
    padding-left: 30px;
}

.project-details-content ul li:before{
    content: '\f058';
    font-family: 'Font Awesome 5 Free';
    font-weight: 900;
    font-size: 20px;
    color: var(--accent-color);
    display: inline-block;
    line-height: normal;
    position: absolute;
    top: 4px;
    left: 0;
}

.project-gallery-title{
	margin-bottom: 30px;
}

.project-gallery-title h2{
	font-size: 24px;
	font-weight: 700;
	text-transform: capitalize;
}

.project-gallery-items .project-gallery-item img{
	width: 100%;
	aspect-ratio: 1 / 1;
	object-fit: cover;
	border-radius: 40px;
}

.project-sidebar{
	position: sticky;
	top: 20px;
}

.project-info-box{
	border: 1px solid var(--divider-color);
	border-radius: 40px;
	padding: 30px;
}

.project-info-item{
	display: flex;
	align-items: center;
	border-bottom: 1px solid var(--divider-color);
	margin-bottom: 20px;
	padding-bottom: 20px;
}

.project-info-item:last-child{
	margin-bottom: 0;
	padding-bottom: 0;
	border: none;
}

.project-info-item .icon-box{
	margin-right: 10px;
}

.project-info-item .icon-box img{
	max-width: 40px;
}

.project-info-content{
	width: calc(100% - 50px);
}

.project-info-content p{
	text-transform: capitalize;
	margin-bottom: 5px;
}

.project-info-content h3{
	font-size: 18px;
	font-weight: 700;
	line-height: 1.1em;
	text-transform: capitalize;
}

/************************************/
/***     22. Team Page css  	  ***/
/************************************/

.page-team{
	padding: 100px 0 70px;
}

/************************************/
/***    23. Contact us Page css   ***/
/************************************/

.contact-information{
	padding: 100px 0 70px;
}

.contact-sidebar.page-contact-sidebar{
	transition: all 0.3s ease-in-out;
}

.contact-info-item{
	border: 1px solid var(--divider-color);
	border-radius: 40px;
	height: calc(100% - 30px);
	margin-bottom: 30px;
	padding: 30px;
}

.contact-info-item .icon-box{
	margin-bottom: 30px;
}

.contact-info-item .icon-box img{
	max-width: 50px;
}

.contact-info-body h3{
	font-size: 24px;
	font-weight: 700;
	text-transform: capitalize;
	margin-bottom: 20px;
}

.contact-info-body p{
	margin-bottom: 5px;
}

.contact-info-body p:last-child{
	margin-bottom: 0;
}

.contact-us.page-contact-us{
	background: var(--secondary-color);
}

.contact-social-list{
	margin-bottom: 100px;
}

.contact-social-list h3{
	font-size: 24px;
	font-weight: 700;
	color: var(--white-color);
	text-transform: capitalize;
	margin-bottom: 30px;
}

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

.contact-social-list ul li{
	display: inline-block;
    margin-right: 10px;
	transition: all 0.3s ease-in-out;
}

.contact-social-list ul li:last-child{
	margin-right: 0;
}

.contact-social-list ul li a{
	background-color: transparent;
    color: var(--accent-color);
    border: 2px solid var(--accent-color);
    height: 36px;
    width: 36px;
    border-radius: 100%;
    text-align: center;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: all 0.3s ease-in-out;
}

.contact-sidebar.page-contact-sidebar .contact-social-list ul li:hover a{
	border-color: var(--white-color);
    color: var(--white-color);
}

.contact-social-list ul li a i{
	font-size: 18px;
}

.contact-sidebar.page-contact-sidebar .contact-info-image{
	width: 100%;
	max-width: 100%;
	text-align: center;
}

.contact-sidebar.page-contact-sidebar .contact-info-image img{
	width: 100%;
	filter: grayscale(0%);
	transition: all 0.3s ease-in-out;
}

.contact-sidebar.page-contact-sidebar:hover .contact-info-image img{
	filter: grayscale(80%);
}

.google-map .container-fluid{
	padding: 0;
}

.google-map-iframe,
.google-map-iframe iframe{
	width: 100%;
	height: 600px;
}

/************************************/
/***      24. FAQs Page css       ***/
/************************************/

.page-faq{
	padding: 100px 0;
}

.faq-sidebar{
	position: sticky;
	top: 20px;
}

.faq-category-box{
	border: 1px solid var(--divider-color);
	border-radius: 40px;
	padding: 30px;
}

.faq-category-box ul{
	list-style: none;
	margin: 0;
	padding: 0;
}

.faq-category-box ul li{
	margin-bottom: 20px;
	padding: 0 0 20px 35px;
	border-bottom: 1px solid var(--divider-color);
	position: relative;
}

.faq-category-box ul li:last-child{
	margin-bottom: 0px;
	padding: 0 0 0px 35px;
	border-bottom: none;
}

.faq-category-box ul li:before{
	content: '';
    position: absolute;
    top: 3px;
    left: 0;
    background: url('../images/readmore-arrow.svg') no-repeat center center;
    width: 20px;
    height: 20px;
}

.faq-category-box ul li a{
	display: block;
	color: var(--primary-color);
	text-transform: capitalize;
	transition: 0.3s ease-in-out;
}

.faq-category-box ul li:hover a{
	color: var(--accent-color);
}

.page-faq .faq-section{
	margin-bottom: 60px;
}

.page-faq .faq-section:last-child{
	margin-bottom: 0;
}

.faq-section .faq-accordion{
	margin: 0;
}

.faq-section .faq-accordion .accordion-item{
	position: relative;
	background: none;
	border-bottom: 1px solid var(--divider-color);
	padding-bottom: 20px;
	margin-bottom: 20px;
}

.faq-section .faq-accordion .accordion-item:last-child{
	margin-bottom: 0;
	padding-bottom: 0;
	border: none;
}

.faq-section .faq-accordion .accordion-item .accordion-button{
	font-size: 24px;
	font-weight: 700;
	border: none;
	box-shadow: none;
	padding: 10px 40px 10px 10px;
	position: relative;
	transition: all 0.3s ease-in-out;
}

.faq-section .faq-accordion .accordion-button:not(.collapsed){
    color: var(--accent-color);
}

.faq-section  .faq-accordion .accordion-item .accordion-button::after,
.faq-section .faq-accordion .accordion-item .accordion-button.collapsed::after{
	content: '';
	position: absolute;
	right: 0;
	top: 50%;
	bottom: auto;
	transform: translate(0px, -50%) rotate(-90deg);
	background-image: url("../images/long-arrow.svg");
	background-repeat: no-repeat;
	background-position: right center;
	background-size: auto;
	display: flex;
	align-items: center;
	justify-content: center;
	width: 32px;
	height: 32px;
	padding: 0;
	transition: all 0.3s ease-in-out;
}

.faq-section .faq-accordion .accordion-item .accordion-button.collapsed::after{
	transform: translate(0px, -50%) rotate(0deg);
}

.faq-section .faq-accordion .accordion-item .accordion-collapse .accordion-body{
	padding: 10px 40px 10px 10px;
}

.faq-section .faq-accordion .accordion-item .accordion-collapse .accordion-body p{
	margin: 0;
}

/************************************/
/***       25. 404 Page css       ***/
/************************************/

.error-page{
	padding: 100px 0;
}

.error-page-image{
	text-align: center;
	margin-bottom: 60px;
}

.error-page .error-page-content{
	text-align: center;
}

.error-page-content-heading{
	margin-bottom: 30px;
}

.error-page-content-heading h2{
	font-size: 56px;
}

.error-page-content-heading h2 span{
	color: var(--accent-color);
}
 
/************************************/
/***     26. responsive css       ***/
/************************************/

@media only screen and (max-width: 1024px){

	/* .navbar{
        padding: 20px 0px;
    } */
	
	.main-menu ul li{
		margin-left: 0;
	}
}

@media only screen and (max-width: 991px){

	#magic-cursor{
        display: none !important;
    }

    .slicknav_nav li, .slicknav_nav ul{
        display: block;
    }

	.responsive-menu,
    .navbar-toggle{
        display: block;
    }

	.light-bg-section{
		margin: 0;
	}

	.section-row{
		margin-bottom: 40px;
	}

	.section-title{
		margin-bottom: 30px;
	}

	.section-title h1{
		font-size: 40px;
	}

	.section-title h2{
		font-size: 46px;
	}

	.section-title h3{
		margin-bottom: 15px;
	}

	.section-row .section-title p{
		max-width: 100%;
	}

	.section-title p{
		margin-top: 15px;
	}

	.section-btn{
		margin-top: 15px;
	}

	.btn-default{
		font-size: 16px;
		padding: 18px 55px 18px 25px;
	}

	.btn-default::before{
		transform: translate(-25px, -50%);
	}

	.btn-default:hover:before{
		transform: translate(-22px, -50%);
	}

	.btn-default.btn-highlighted{
		padding: 17px 55px 17px 25px;
	}

	.btn-large{
		font-size: 18px;
		padding: 18px 55px 18px 20px;
	}

	header.main-header{
		margin: 0px;
	}

	/* .navbar{
		padding: 20px 0px;
	} */

	.hero.bg-section{
		margin: 0 0px;
		margin-top: 123px;
		padding: 200px 0 100px;
		border-radius: 0;
	}

	.hero-slider-layout .hero-slide{
		padding: 200px 0 100px;
	}

	.hero-slider-layout .swiper-pagination{
		bottom: 50px;
	}

	.hero-content .section-title p{
		font-size: 20px;
	}

	.about-us{
		padding: 50px 0;
	}

	.about-image{
		/* text-align: center; */
		margin-bottom: 30px;
	}
.cta-box-image{
	max-width:300px !important;
	height: 300px !important;
}
.arc-enq-image-section{
	min-height: 400px !important;
	width:400px !important;
} 
	.about-content{
		margin-left: 0px;
	}

	.about-content-body ul{		
		padding: 20px;
	}

	.about-content-body ul li{
		font-size: 18px;
		margin-bottom: 10px;
	}

	.about-content-body ul li:before{
		font-size: 18px;
	}

	.about-content-body{
		margin-bottom: 30px;
	}

	.about-support-content p{
		margin-bottom: 0px;
	}

	.about-support-content h3{
		font-size: 22px;
	}

	.our-service{
		background-size: 50% auto;
		padding: 50px 0;
	}

	.service-body{
		right: 20px;
		left: 20px;
	}

	.service-body-title h3{
		font-size: 22px;
		margin-bottom: 15px;
	}

	.service-content p{
		margin-bottom: 15px;
	}

	.why-choose-us{
		padding: 50px 0 20px;
	}

	.why-choose-item{
		padding: 30px 20px;
	}

	.why-choose-item .icon-box{
		margin-bottom: 20px;
	}
	
	.why-choose-item .icon-box img{
		max-width: 60px;
	}

	.why-choose-content{
		margin-bottom: 20px;
		padding-bottom: 20px;
	}

	.why-choose-content h3{
		font-size: 22px;
		margin-bottom: 20px;
	}

	.why-choose-counter h3{
		font-size: 46px;
	}

	.our-projects{
		background-size: 50% auto;
		padding: 50px 0;
	}

	.project-body{
		right: 20px;
		left: 20px;
	}

	.project-body-title h3{
		font-size: 22px;
		margin-bottom: 105px;
	}

	.project-content p{
		margin-bottom: 15px;
	}

	.cta-box{
		background-size: 80% auto;
		padding: 50px 0;
	}

	.cta-box-image{
		right: 0;
	}

	.cta-box-image img{
		width: 300px;
	}

	.our-testimonial{
		padding: 50px 0;
	}

	.testimonial-item{
		padding: 20px;
	}

	.testimonial-rating{
		margin-bottom: 20px;
	}

	.testimonial-rating i{
		font-size: 18px;
	}

	.testimonial-header{
		margin-bottom: 20px;
		padding-bottom: 20px;
	}

	.author-content h3{
		font-size: 22px;
	}

	.our-faqs{
		background-size: 50% auto;
		padding: 50px 0;
	}

	.our-faqs-images{
		width: 100%;
		max-width: 565px;
		margin: 0 auto;
		margin-bottom: 30px;
	}

	.faq-accordion{
		margin-left: 0px;
	}

	.faq-accordion .accordion-item .accordion-button{
		font-size: 22px;
		padding: 10px 40px 10px 10px;
	}

	.faq-accordion .accordion-item{
		padding-bottom: 10px;
		margin-bottom: 10px;
	}

	.faq-accordion .accordion-item .accordion-button::after,
	.faq-accordion .accordion-item .accordion-button.collapsed::after{
		background-size: contain;
		width: 26px;
		height: 26px;
	}

	.our-blog{
		padding: 50px 0 20px;
	}

	.post-item-content{
		padding: 30px 20px;
	}

	.post-item-body h2{
		font-size: 22px;
	}

	.contact-us{
		background-size: auto;
		padding: 50px 0;
	}

	.contact-sidebar{
		padding: 30px 20px 0;
	}

	.contact-info .icon-box{
		margin-bottom: 15px;
	}

	.contact-info-content h3{
		font-size: 22px;
	}

	.contact-form{
		padding: 30px;
	}

	.contact-form .form-control{
		padding: 12px;
	}

	.main-footer{
		padding: 50px 0;
	}

	.about-footer{
		margin-bottom: 40px;
	}

	.footer-logo{
		margin-bottom: 30px;
	}

	.footer-logo img{
		max-width: 250px;
	}

	.footer-links h3{
		font-size: 22px;
		margin-bottom: 30px;
	}

	.footer-contact-box .footer-info-box{
		margin-bottom: 20px;
	}

	.footer-copyright{
		margin-top: 60px;
		padding: 15px 0;
	}

	.page-header{
		margin: 0 0;
		border-radius: 0;
		padding: 170px 0 80px;
		margin-top: -90px;
	}

	.page-header:before{
		border-radius: 0px;
	}

	.page-header-box h1{
		font-size: 46px;
		margin-bottom: 20px;
	}

	.page-header-box ol li.breadcrumb-item{
		font-size: 20px;
	}

	.page-about-us{
		padding: 50px 0;
	}

	.about-us-image{
		text-align: center;
		margin-bottom: 30px;
	}

	.about-us-content{
		margin-left: 0px;
	}

	.about-us-content-body ul{		
		padding: 20px;
	}

	.about-us-content-body ul li{
		font-size: 18px;
        margin-bottom: 10px;
	}

	.about-us-content-body ul li:before{
		font-size: 18px;
	}

	.about-us-content-body{
		margin-bottom: 30px;
	}

	.about-us-support-content h3{
		font-size: 22px;
	}
	
	.our-company-history{
		padding: 50px 0;
	}	

	.company-history-image{
		margin-bottom: 30px;
	}

	.company-history-img{
		text-align: center;
	}

	.company-experience{
		max-width: 175px;
		padding: 30px;
	}

	.company-experience-content h3{
		font-size: 46px;
	}
	
	.our-mission-vision{
		padding: 50px 0 20px;
	}

	.mission-vision-item .icon-box{
		margin-bottom: 20px;
	}

	.mission-vision-item .icon-box img{
		max-width: 60px;
	}

	.mission-vision-item .mission-vision-content h3{
		font-size: 22px;
		margin-bottom: 20px;
	}

	.mission-vision-item{
		height: calc(100% - 30px);
		margin-bottom: 30px;
	}
	
	.intro-video-box .video-image img{
		aspect-ratio: 1/0.55;
	}

	.video-play-button a{
		width: 70px;
		height: 70px;
	}

	.video-play-button a i{
		font-size: 26px;
	}
	
	.what-we-do{
		padding: 50px 0 20px;
	}

	.what-we-do .section-title{
		max-width: 100%;
	}

	.company-counter-item{
		height: calc(100% - 30px);
		margin-bottom: 30px;
		padding: 40px 20px;
	}

	.company-counter-item .company-counter-content h3{
		font-size: 46px;
	}
	
	.our-team{
		padding: 50px 0 20px;
	}

	.team-content{
		margin-bottom: 15px;
	}
	
	.team-content h3{
		font-size: 22px;
		margin-bottom: 5px;
	}

	.page-service{
		padding: 50px 0 20px;
	}
	
	.page-service-single{
		padding: 50px 0;
	}

	.service-sidebar{
		padding-right: 0;
		margin-bottom: 30px;
	}

	.service-categories-list{
		padding: 20px;
	}

	.service-categories-list h3{
		font-size: 22px;
		margin-bottom: 20px;
	}

	.service-categories-list ul li{
		margin-bottom: 15px;
		padding: 0 0 15px 25px;
	}

	.sidebar-cta-box{
		padding: 20px;
	}

	.sidebar-cta-box .cta-content h3{
		font-size: 22px;
		margin-bottom: 20px;
	}

	.sidebar-cta-box .cta-content{
		margin-bottom: 30px;
	}

	.service-single-content p{
		margin-bottom: 20px;
	}

	.service-sustainable-content h3{
		font-size: 22px;
		margin-bottom: 20px;
	}

	.service-benefit{
		padding: 50px 0 20px;
	}

	.service-benefit .service-benefit-item{
		padding: 20px;
	}

	.service-benefit-item .icon-box{
		margin-bottom: 20px;
	}

	.service-benefit-item .icon-box img{
		max-width: 60px;
	}

	.service-benefit-item .service-benefit-content h3{
		font-size: 22px;
		margin-bottom: 20px;
	}

	.working-process{
		padding: 50px 0 20px;
	}

	.working-process-item{
		padding: 20px;
	}

	.working-process-item .step-number{
		margin-bottom: 20px;
	}

	.working-process-item .step-number h2{
		font-size: 32px;
	}

	.working-process-item .working-process-content h3{
		font-size: 22px;
		margin-bottom: 20px;
	}

	.page-blog{
		padding: 50px 0;
	}

	.page-blog .blog-item{
		height: calc(100% - 30px);
		margin-bottom: 30px;
	}

	.post-pagination{
		margin-top: 10px;
	}

	.post-single-meta ol li i{
		font-size: 20px;
	}

	.page-single-post{
		padding: 50px 0;
	}

	.post-image{
		margin-bottom: 20px;
	}

	.post-entry blockquote{
		background: var(--secondary-color) url("../images/icon-blockquote.svg") no-repeat 30px 36px;
		background-size: 45px;
		padding: 30px 30px 30px 90px;
		margin-bottom: 20px;
	}

	.post-entry blockquote p{
		font-size: 18px;
	}

	.post-entry h2{
		font-size: 36px;
	}

	.post-entry ul li{
		font-size: 16px;
	}

	.post-tag-links{
		padding: 0 0px;
	}

	.post-tags{
		margin-bottom: 10px;
	}

	.post-social-sharing ul{
		text-align: left;
	}

	.post-tags .tag-links a{
		font-size: 16px;
		padding: 8px 15px;
	}

	.page-project{
		padding: 50px 0;
	}

	.page-project-single{
		padding: 50px 0;
	}

	.project-single-content{
		margin-right: 0px;
		margin-bottom: 40px;
	}

	.project-details-content p{
		margin-bottom: 20px;
	}

	.project-details-title{
		margin-bottom: 20px;
	}

	.project-details-title h3{
		font-size: 22px;
	}

	.project-details-content{
		margin-bottom: 30px;
	}

	.project-gallery-title h2{
		font-size: 22px;
	}

	.project-info-box{
		padding: 20px;
	}

	.page-team{
		padding: 50px 0 20px;
	}

	.contact-information{
		padding: 50px 0 20px;
	}

	.contact-info-item{
		padding: 20px;
		width:350px;
	}

	.contact-info-item .icon-box{
		margin-bottom: 20px;
	}

	.contact-info-item .icon-box img{
		max-width: 40px;
	}

	.contact-info-body h3{
		font-size: 22px;
		margin-bottom: 15px;
	}

	.google-map-iframe,
	.google-map-iframe iframe{
		height: 400px;
	}
	
	.page-faq{
		padding: 50px 0;
	}

	.faq-sidebar{
		margin-bottom: 30px;
	}

	.faq-category-box{
		padding: 20px;
	}

	.faq-category-box ul li{
		margin-bottom: 15px;
		padding: 0 0 15px 35px;
	}

	.page-faq .faq-section{
		margin-bottom: 40px;
	}

	.faq-section .faq-accordion .accordion-item{
        padding-bottom: 10px;
        margin-bottom: 10px;
    }

	.faq-section .faq-accordion .accordion-item .accordion-button{
        font-size: 22px;
        padding: 10px 40px 10px 10px;
    }

	.faq-section .faq-accordion .accordion-item .accordion-button::after,
	.faq-section .faq-accordion .accordion-item .accordion-button.collapsed::after{
		background-size: contain;
		width: 26px;
		height: 26px;
	}

	.error-page{
		padding: 50px 0;
	}
	
	.error-page-image{
		margin-bottom: 30px;
	}

	.error-page-content-heading{
		margin-bottom: 20px;
	}
	
	.error-page-content-heading h2{
		font-size: 46px;
	}
	.contact-grid{
		display: grid;
		grid-template-columns: repeat(2,1fr);
	}
}

@media only screen and (max-width: 767px){
	.contact-grid{
		display: grid;
		grid-template-columns: 1fr;
	}
	.arc-custom-calc-table td{font-size: 17px !important;}
	.kjc-section-header h2{font-size: 25px !important;}
	.navbar-brand img{
		width:220px;
		height:100px;
	}

	body{
		font-size: 16px;
	}

	.section-row{
        margin-bottom: 30px;
    }

	.section-title h1{
		font-size: 30px;
	}

	.section-title h2{
		font-size: 30px;
	}

	.section-title h3{
		font-size: 14px;
		margin-bottom: 10px;
	}

	.btn-default{
        padding: 16px 50px 16px 20px;
    }

	.btn-default::before{
        transform: translate(-20px, -50%);
    }

	.btn-default:hover:before{
        transform: translate(-17px, -50%);
    }

	.btn-default.btn-highlighted{
        padding: 15px 50px 15px 20px;
    }

	.btn-large{
        font-size: 16px;
        padding: 18px 50px 18px 20px;
    }

	.hero.bg-section{
        padding: 160px 0 60px;
    }

	.hero-slider-layout .hero-slide{
		padding: 160px 0 100px;
	}

	.hero-content .section-title p{
        font-size: 18px;
    }

	.hero-content-body .btn-default.btn-highlighted{
		margin-left: 0px;
		margin-top: 10px;
	}

	.about-content-body ul{
        padding: 15px;
    }

	.about-content-body ul li{
        font-size: 16px;
		padding-left: 25px;
    }

	.about-content-body ul li:before{
        font-size: 16px;
    }

	.about-content-footer{
		display: block;
	}

	.about-contact-support{
		margin-left: 0px;
		margin-top: 15px;
	}

	.about-contact-support .icon-box{
		margin-right: 15px;
	}

	.about-contact-support .icon-box img{
		max-width: 35px;
	}

	.about-support-content{
		width: calc(100% - 50px);
	}

	.about-support-content h3{
        font-size: 20px;
    }

	.service-body-title h3{
		font-size: 20px;
	}

	.service-footer-btn{
		margin-top: 10px;
	}

	.why-choose-item{
        padding: 20px;
    }

	.why-choose-item .icon-box{
        margin-bottom: 15px;
    }

	.why-choose-content h3{
        font-size: 20px;
        margin-bottom: 15px;
    }

	.why-choose-content{
        margin-bottom: 15px;
        padding-bottom: 15px;
    }

	.why-choose-counter h3{
        font-size: 36px;
    }

	.project-body-title h3{
		font-size: 20px;
	}

	.project-footer-btn{
		margin-top: 10px;
	}

	.cta-box-image img{
		width: 150px;
	}

	.testimonial-rating i{
        font-size: 16px;
    }

	.faqs-img-2 img{
		width: 140px;
	} 

	.author-content h3{
        font-size: 20px;
    }

	.faq-accordion .accordion-item .accordion-button{
        font-size: 18px;
		line-height: 1.2em;
        padding: 10px 35px 10px 0px;
    }

	.faq-accordion .accordion-item .accordion-collapse .accordion-body{
		padding: 10px 35px 10px 0px;
	}

	.post-item-body h2{
		font-size: 20px;
	}

	.contact-sidebar{
		margin-bottom: 30px;
	}

	.contact-info .icon-box{
        margin-bottom: 10px;
    }

	.contact-info .icon-box img{
		max-width: 30px;
	}

	.contact-info-content h3{
        font-size: 20px;
    }

	.contact-form{
        padding: 30px 20px;
    }

	.footer-logo{
        margin-bottom: 20px;
    }

	.footer-logo img{
        max-width: 220px;
    }
.arc-pkg-section-title{
	font-size: 25px !important;
}
	.footer-links{
		margin-bottom: 40px;
	}

	.main-footer .col-12:last-child .footer-links{
		margin-bottom: 0;
	}

	.footer-links h3{
        font-size: 20px;
        margin-bottom: 20px;
    }

	.footer-links ul li{
		margin-bottom: 15px;
	}

	.footer-copyright{
        margin-top: 40px;
		text-align: center
    }

	.footer-copyright-text{
		margin-bottom: 10px;
	}

	.footer-copyright .footer-social-links ul{
		text-align: center;
	}

	.page-header{
		padding: 150px 0 60px;
	}

	.page-header-box h1{
		font-size: 36px;
	}

	.page-header-box ol li.breadcrumb-item{
		font-size: 16px;
	}

	.about-us-content-body ul{
        padding: 15px;
    }

	.about-us-content-body ul li{
        font-size: 16px;
        margin-bottom: 15px;
        padding-left: 25px;
    }

	.about-us-content-body ul li:before{
        font-size: 16px;
    }

	.about-us-content-footer{
		display: block;
	}

	.about-us-contact-support{
		margin-left: 0px;
		margin-top: 15px;
	}

	.about-us-contact-support .icon-box{
		margin-right: 15px;
	}

	.about-us-contact-support .icon-box img{
		max-width: 35px;
	}

	.about-us-support-content{
		width: calc(100% - 50px);
	}

	.about-us-support-content h3{
        font-size: 20px;
    }

	.company-history-image{
		padding-bottom: 50px;
	}
	
	.company-experience{
		padding: 15px;
		bottom: 0;
		right: 110px;
	}

	.company-experience-content h3{
		font-size: 36px;
	}
	
	.mission-vision-item{
		padding: 20px;
	}

	.mission-vision-item .icon-box{
		margin-bottom: 15px;
	}
	
	.mission-vision-item .mission-vision-content h3{
		font-size: 20px;
		margin-bottom: 15px;
	}
	
	.company-counter-item{
		padding: 30px 20px;
	}

	.company-counter-item .company-counter-content h3{
		font-size: 36px;
	}
	
	.team-body{
		padding: 20px;
	}
	
	.team-content h3{
		font-size: 20px;
	}

	.service-categories-list h3{
        font-size: 20px;
        margin-bottom: 15px;
    }

	.sidebar-cta-box .cta-content h3{
        font-size: 20px;
        margin-bottom: 15px;
    }

	.service-entry ul li{
		width: 100%;
	}

	.service-sustainable-img-1{
		margin-bottom: 30px;
	}

	.service-sustainable-content h3{
        font-size: 20px;
        margin-bottom: 15px;
    }

	.service-benefit-item .icon-box{
		margin-bottom: 15px;
	}

	.service-benefit-item .service-benefit-content h3{
		font-size: 20px;
		margin-bottom: 15px;
	}

	.working-process-item .step-number{
		margin-bottom: 15px;
	}

	.working-process-item .step-number h2{
		font-size: 24px;
	}
	
	.working-process-item .working-process-content h3{
		font-size: 20px;
		margin-bottom: 15px;
	}

	.post-single-meta ol li i{
        font-size: 18px;
    }

	.post-image figure,
	.post-image img{
		aspect-ratio: 1 / 0.70;
	}

	.post-entry blockquote{
		background: var(--secondary-color) url('../images/icon-blockquote.svg') no-repeat 20px 20px;
		background-size: 35px;
		padding: 55px 20px 20px 20px;
	}
	
	.post-entry h2{
		font-size: 30px;
	}

	.tag-links{
		font-size: 20px;
	}

	.project-single-content{
        margin-bottom: 30px;
    }

	.project-featured-image{
		margin-bottom: 20px;
	}

	.project-details-title h3{
        font-size: 20px;
    }

	.project-details-content ul{
		display: block;
	}

	.project-details-content ul li{
		width: 100%;
		margin-bottom: 15px;
		padding-left: 25px;
	}

	.project-details-content ul li:last-child{
		margin-bottom: 0;
	}

	.project-details-content ul li:before{
		font-size: 18px;
	}

	.project-gallery-title h2{
        font-size: 20px;
    }

	.project-gallery-item{
		margin-bottom: 20px;
	}

	.contact-sidebar.page-contact-sidebar{
		margin-bottom: 0;
		margin-top: 30px;
	}

	.contact-info-item .icon-box img{
        max-width: 40px;
    }

	.contact-social-list{
		margin-bottom: 30px;
	}

	.contact-info-body h3{
        font-size: 20px;
    }

	.contact-social-list h3{
		font-size: 22px;
		margin-bottom: 20px;
	}

	.google-map-iframe,
	.google-map-iframe iframe{
        height: 350px;
    }
	
	.faq-section .faq-accordion .accordion-item .accordion-button{
		font-size: 20px;
		padding: 10px 35px 10px 0px;
	}

	.faq-section .faq-accordion .accordion-item .accordion-collapse .accordion-body{
		padding: 10px 35px 10px 0px;
	}

	.error-page-content-heading h2{
		font-size: 36px;
	}
	.kjc-current-price{
		font-size: 25px !important;
	}
}

/* packages */


/* Pricing Section Container Setup */
.kjc-pricing-section {
    padding: 40px 20px;
    background-color: #f8f9fa;
    font-family: 'Poppins', sans-serif;
}

.kjc-container {
    max-width: 1200px;
    margin: 0 auto;
}

/* Section Main Heading Styles */
.kjc-section-header {
    text-align: center;
    margin-bottom: 60px;
}

.kjc-section-header h2 {
    font-size: 32px;
    color: #1a1a1a;
    text-transform: uppercase;
    font-weight: 700;
    letter-spacing: 1px;
    margin-bottom: 15px;
}

.kjc-header-line {
    width: 80px;
    height: 4px;
    background: #e60000;
    margin: 0 auto;
    border-radius: 2px;
}

/* Responsive Grid Engine Layout */
.kjc-pricing-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
    gap: 30px;
    padding: 10px;
}

/* Modernized Custom Pricing Card Core */
.kjc-price-card {
    background: #ffffff;
    border-radius: 16px;
    overflow: hidden;
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.05);
    transition: all 0.4s cubic-bezier(0.165, 0.84, 0.44, 1);
    position: relative;
    border: 1px solid rgba(0, 0, 0, 0.03);
}

.kjc-price-card:hover {
    transform: translateY(-10px);
    box-shadow: 0 20px 40px rgba(230, 0, 0, 0.12);
    border-color: rgba(230, 0, 0, 0.2);
}

/* Sleek Angled Ribbon Header Layout */
.kjc-card-badge {
    background: linear-gradient(135deg, #ff1a1a 0%, #b30000 100%);
    color: #ffffff;
    text-align: center;
    padding: 25px 10px;
    font-size: 22px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 1.5px;
    clip-path: polygon(0 0, 100% 0, 100% 85%, 0% 100%);
}

.kjc-card-body {
    padding: 30px 25px;
    text-align: center;
}

/* Promotional Dynamic Label */
.kjc-offer-tag {
    display: inline-block;
    color: #e60000;
    font-size: 14px;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    margin-bottom: 20px;
    background: rgba(230, 0, 0, 0.06);
    padding: 4px 12px;
    border-radius: 50px;
}

/* Core Price Typographic Hierarchy */
.kjc-current-price {
    font-size: 48px;
    font-weight: 800;
    color: #1a1a1a;
    line-height: 1;
    margin-bottom: 10px;
    display: flex;
    align-items: flex-start;
    justify-content: center;
}

.kjc-currency {
    font-size: 26px;
    font-weight: 600;
    margin-top: 4px;
    margin-right: 2px;
}

.kjc-unit {
    font-size: 15px;
    color: #777777;
    font-weight: 400;
    align-self: flex-end;
    margin-left: 4px;
    margin-bottom: 8px;
}

/* Original Discounted Price Cross-out Structure */
.kjc-old-price {
    color: #999999;
    font-size: 16px;
    margin-bottom: 35px;
    font-weight: 500;
}

.kjc-old-price del {
    color: #cc0000;
    font-weight: 600;
    margin-right: 2px;
}

/* Refined Premium Call to Action Button */
.kjc-btn-action {
    display: block;
    width: 100%;
    padding: 14px 20px;
    color: #e60000;
    border: 2px solid #e60000;
    border-radius: 50px;
    text-decoration: none;
    font-weight: 600;
    font-size: 15px;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    transition: all 0.3s ease;
}

.kjc-price-card:hover .kjc-btn-action {
    background: linear-gradient(135deg, #ff1a1a 0%, #b30000 100%);
    color: #ffffff;
    border-color: transparent;
    box-shadow: 0 5px 15px rgba(230, 0, 0, 0.3);
}


/* our start */


.stat-neo-section {
            background: linear-gradient(135deg, #f76060 0%, #f3f4f6 100%);
            padding: 80px 20px;
            font-family: 'Plus Jakarta Sans', sans-serif;
            display: flex;
            flex-direction: column;
            align-items: center;
            justify-content: center;
            min-height: auto;
            overflow: hidden;
            position: relative;
        }

        /* Subtle background glow elements */
        .stat-neo-section::before {
            content: '';
            position: absolute;
            width: 300px;
            height: 300px;
            border-radius: 50%;
            filter: blur(100px);
            top: -50px;
            left: -50px;
        }

        .stat-neo-section-title {
            color: #ffffff;
            font-size: 14px;
            font-weight: 800;
            text-transform: uppercase;
            letter-spacing: 4px;
            margin-bottom: 50px;
            position: relative;
            color: #ff3333;
            text-shadow: 0 0 10px rgba(255, 51, 51, 0.3);
        }

        .stat-neo-grid {
            display: grid;
            grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
            gap: 30px;
            width: 100%;
            max-width: 1200px;
            position: relative;
            z-index: 2;
        }

        /* Premium Glassmorphism Card Design */
        .stat-neo-card {
            background: rgba(255, 255, 255, 0.03);
            border: 1px solid rgba(255, 255, 255, 0.08);
            border-radius: 20px;
            padding: 40px 30px;
            text-align: center;
            backdrop-filter: blur(12px);
            -webkit-backdrop-filter: blur(12px);
            transition: all 0.4s cubic-bezier(0.165, 0.84, 0.44, 1);
            position: relative;
        }

        /* Interactive Hover Effect */
        .stat-neo-card:hover {
            transform: translateY(-10px);
            background: rgba(255, 255, 255, 0.06);
            border-color: rgba(230, 0, 0, 0.4);
            box-shadow: 0 20px 40px rgba(0, 0, 0, 0.4), 0 0 30px rgba(230, 0, 0, 0.1);
        }

        /* Bottom accent line that expands on hover */
        .stat-neo-card::after {
            content: '';
            position: absolute;
            bottom: 0;
            left: 50%;
            width: 0;
            height: 4px;
            background: #ff1a1a;
            border-radius: 2px;
            transition: all 0.4s ease;
            transform: translateX(-50%);
            box-shadow: 0 0 15px #ff1a1a;
        }

        .stat-neo-card:hover::after {
            width: 40%;
        }

        /* Huge bold typography for numbers */
        .stat-neo-number {
            font-size: 52px;
            font-weight: 800;
            color: #ffffff;
            line-height: 1;
            margin-bottom: 12px;
            letter-spacing: -1px;
            background: linear-gradient(180deg, #575757 30%, #ea3d3d 100%);
            -webkit-background-clip: text;
            -webkit-text-fill-color: transparent;
        }

        /* Clean modern styling for labels */
        .stat-neo-label {
            color: black;
            font-size: 13px;
            font-weight: 600;
            text-transform: uppercase;
            letter-spacing: 1.5px;
            transition: color 0.3s ease;
        }

        .stat-neo-card:hover .stat-neo-label {
            color: #ffffff;
        }

        /* Responsive adjustments */
        @media (max-width: 768px) {
            .stat-neo-section {
                padding: 60px 15px;
            }
            .stat-neo-number {
                font-size: 42px;
            }
        }

		/* Unique color for the developer link */
.footer-copyright-text .developer-link {
    color: #e93737; /* Distinct brand accent color */
    text-decoration: none;
    font-weight: bold;
    margin-left: 4px;
    transition: color 0.3s ease-in-out;
}

/* Hover style to cleanly swap to crisp white */
.footer-copyright-text .developer-link:hover {
    color: #ffffff;
}

/* header */
.main-header{
position: fixed;
 top: 0;
  left: 0;
  width: 100%;
   z-index: 9999;
   background: #ffffff; 
   box-shadow: 0px 2px 10px rgba(0,0,0,0.1);
}

/* breadcurum */
/* ==========================================================================
   Page Header Banner Styles
   ========================================================================== */
.page-header-box {
    text-align: center;
 
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
}

/* Heading Styling */
.page-header-box h1.text-anime-style-3 {
    font-size: 46px;
    font-weight: 700;
    color: white;
    margin: 0 0 15px 0;
    text-transform: capitalize;
    letter-spacing: -0.5px;
    line-height: 1.2;
}

/* 1-Line Description Styling */
.page-header-box p {
    max-width: 800px;
    font-size: 20px !important; /* Matches your layout requirement */
    color: white !important;
    margin-top: 10px !important;
    line-height: 1.6;
    margin-bottom: 0;
    font-weight: 400;
}

/* ==========================================================================
   Responsive Media Queries (Mobile & Tablet Optimization)
   ========================================================================== */
@media (max-width: 991px) {
    .page-header-box {
        padding: 80px 20px;
    }
    .page-header-box h1.text-anime-style-3 {
        font-size: 38px;
    }
    .page-header-box p {
        font-size: 16px !important;
    }
}

@media (max-width: 575px) {
    .page-header-box {
        padding: 50px 15px;
		margin-top: 40px;
    }
    .page-header-box h1.text-anime-style-3 {
        font-size: 32px;
    }
    .page-header-box p {
        font-size: 15px !important;
        line-height: 1.5;
    }
}

/* packges */
/* ==========================================================================
   Luxury 4-Card Matrix & Bold Screenshot-Style Table Sheet Setup
   ========================================================================== */
:root {
    --primary-color: #EE0000;
    --text-color: #667282;
    --dark-surface: #1E2530;
    --card-bg: #FFFFFF;
    --border-color: #D2DCE6;
}

.arc-packages-master-section {
    background-color: #F8FAFC;
    padding: 80px 0;
    font-family: 'Inter', system-ui, sans-serif;
}

.arc-pkg-container {
    max-width: 1320px;
    margin: 0 auto;
    padding: 0 20px;
}

.arc-pkg-section-header {
    text-align: center;
    margin-bottom: 50px;
}

.arc-pkg-section-title {
    font-size: 38px;
    font-weight: 800;
    color: var(--dark-surface);
}

/* 4 Column Premium Grid Matrix setup */
.arc-packages-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 24px;
    align-items: start;
    margin-bottom: 70px;
}
/* Apply this to your card container to align the footer buttons */
.arc-price-card {
    display: flex;
    flex-direction: column;
    justify-content: space-between; /* Pushes the header, body, and footer apart */
    height: 100%; /* Ensures all cards stretch to the same maximum height in a row */
}

/* This makes sure the accordion body section takes up all available middle space */
.arc-card-body-accordions {
    flex-grow: 1; 
}

/* Keeps the footer firmly locked to the very bottom */
.arc-card-footer {
    margin-top: auto; 
    width: 100%;
}
/* Package Card Blocks Structure Styling */
.arc-price-card {
    background: var(--card-bg);
    border-radius: 16px;
    border: 1px solid var(--border-color);
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.03);
    transition: transform 0.3s cubic-bezier(0.16, 1, 0.3, 1), box-shadow 0.3s ease;
    overflow: hidden;
    display: flex;
    flex-direction: column;
}

.arc-price-card:hover {
    transform: translateY(-8px);
    box-shadow: 0 25px 50px rgba(238, 0, 0, 0.08);
    border-color: var(--primary-color);
}

.arc-featured-package {
    border-top: 5px solid var(--primary-color);
}

/* Active Highlight state for selected rate configuration via Javascript */
.arc-price-card.arc-selected-package-active {
    border: 3px solid var(--primary-color);
    box-shadow: 0 25px 60px rgba(238, 0, 0, 0.15);
}

.arc-card-header {
    background: #FFFBFB;
    padding: 32px 24px;
    text-align: center;
    border-bottom: 1px solid var(--border-color);
}

.arc-package-name {
    font-size: 16px;
    font-weight: 700;
    letter-spacing: 1px;
    color: var(--dark-surface);
    margin: 0 0 12px 0;
}

.arc-pkg-strike {
    font-size: 14px;
    text-decoration: line-through;
    color: #A3AED0;
    display: block;
    margin-bottom: 2px;
}

.arc-pkg-rate {
    font-size: 34px;
    font-weight: 800;
    color: var(--primary-color);
}

.arc-pkg-rate small {
    font-size: 14px;
    font-weight: 500;
    color: var(--text-color);
}

/* Dropdown Accordion Elements Components styling */
.arc-card-body-accordions {
    padding: 15px;
    background: #FFFFFF;
}

.arc-accordion-item {
    border-bottom: 1px solid #E6ECF4;
}

.arc-accordion-item:last-child {
    border-bottom: none;
}

.arc-accordion-trigger {
    width: 100%;
    background: none;
    border: none;
    padding: 18px 10px;
    text-align: left;
    font-size: 15px;
    font-weight: 600;
    color: var(--dark-surface);
    display: flex;
    justify-content: space-between;
    align-items: center;
    cursor: pointer;
}

.arc-accordion-trigger:hover {
    color: var(--primary-color);
}

.arc-accordion-panel {
    max-height: 0;
    overflow: hidden;
    transition: max-height 0.3s cubic-bezier(0.16, 1, 0.3, 1);
    background: #F8FAFC;
    border-radius: 6px;
}

.arc-accordion-panel ul {
    list-style: none;
    padding: 15px 12px;
    margin: 0;
}

.arc-accordion-panel ul li {
    font-size: 14px;
    line-height: 1.6;
    color: var(--text-color);
    margin-bottom: 10px;
    position: relative;
    padding-left: 14px;
}

.arc-accordion-panel ul li::before {
    content: "•";
    color: var(--primary-color);
    position: absolute;
    left: 0;
    font-weight: bold;
}

.arc-accordion-panel ul li.arc-alert-li {
    color: #1A202C;
    font-weight: 600;
    border-top: 1px dotted #CBD5E1;
    margin-top: 12px;
    padding-top: 10px;
}

.arc-placeholder-info {
    font-size: 14px;
    color: #A3AED0;
    text-align: center;
    padding: 50px 10px;
}

.arc-card-footer {
    padding: 20px 15px 25px 15px;
}

.arc-action-btn {
    width: 100%;
    background: var(--dark-surface);
    color: #FFFFFF;
    border: none;
    padding: 16px 10px;
    font-size: 12px;
    font-weight: 700;
    letter-spacing: 0.5px;
    border-radius: 8px;
    cursor: pointer;
    transition: background-color 0.2s ease;
}

.arc-price-card:hover .arc-action-btn {
    background: var(--primary-color);
}

/* ==========================================================================
   TABLE WORKSPACE CALCULATOR BOX SECTION (Bold, Scaled Up Font Sizes)
   ========================================================================== */
.arc-calc-table-section {
    padding-top: 40px;
    background-color: #ffffff;
    border-top: 2px dashed #E2E8F0;
}

.arc-table-main-header {
    text-align: center;
    margin-bottom: 35px;
}

.arc-table-main-header h2 {
    background-color: #EE0000;
    color: #ffffff;
    display: inline-block;
    padding: 16px 50px;
    font-size: 26px; /* High visibility bold header font layout scaling */
    font-weight: 800;
    letter-spacing: 1px;
    margin: 0 0 15px 0;
    border-radius: 4px;
    width: 100%;
}

.arc-table-main-header p {
    font-size: 20px;
    color: #111111;
    font-weight: 600;
    margin: 0;
}

.arc-responsive-calc-wrapper {
    width: 100%;
    overflow-x: auto;
    border: 1px solid #CBD5E1;
    border-radius: 4px;
}

.arc-custom-calc-table {
    width: 100%;
    border-collapse: collapse;
    background: #ffffff;
    min-width: 1000px;
}

.arc-custom-calc-table th {
    background-color: #EE0000;
    color: #ffffff;
    font-size: 20px; /* Big header font layout typography mapping */
    font-weight: 700;
    padding: 22px 18px;
    text-align: left;
    border-right: 1px solid #ffffff;
}

.arc-custom-calc-table th:last-child {
    border-right: none;
}

.arc-custom-calc-table td {
    padding: 22px 18px;
    border-bottom: 1px solid #CBD5E1;
    border-right: 1px solid #CBD5E1;
    font-size: 19px; /* Highly visible text elements text line font size adjustment */
    color: #1A202C;
    vertical-align: middle;
}

.arc-center-text {
    text-align: center;
    font-weight: 600;
}

.arc-right-text {
    text-align: right;
    font-weight: 800;
    color: #000000;
    font-size: 20px !important;
    padding-right: 35px !important;
}

.arc-work-title-cell {
    font-weight: 500;
    line-height: 1.5;
}

.arc-unit-cell {
    color: var(--text-color);
}

.arc-rate-cell {
    font-weight: 700;
    color: #000000;
}

/* Distinct dynamic rate row flash indicator color class trigger rule */
.arc-rate-highlight-active {
    background-color: rgba(238, 0, 0, 0.05);
    font-weight: 800 !important;
    color: var(--primary-color) !important;
}

.arc-cost-display-cell {
    text-align: right;
    font-weight: 700;
    color: #000000;
    padding-right: 30px !important;
}

/* Standard Box Fields styling to match layout inputs from screenshot dimensions */
.arc-custom-calc-table input[type="number"] {
    width: 100%;
    max-width: 280px;
    padding: 14px 16px;
    border: 1px solid #E2A0A0;
    border-radius: 4px;
    font-size: 18px;
    font-weight: 600;
    color: #000000;
    outline: none;
    box-sizing: border-box;
}

.arc-custom-calc-table input[type="number"]:focus {
    border-color: #EE0000;
    box-shadow: 0 0 0 3px rgba(238, 0, 0, 0.08);
}

.arc-table-split-inputs {
    display: flex;
    gap: 12px;
    max-width: 280px;
}

.arc-table-split-inputs input {
    flex: 1;
    width: 50% !important;
}

/* Custom In-Table Note Text Row Component Layout block styling */
.arc-table-note-row-tr td {
    background: #FFF8F8;
    color: #1A202C;
    font-size: 16px !important;
    line-height: 1.6;
    padding: 20px;
}

/* Output Total Cost Panel Row */
.arc-table-total-row {
    background-color: #F8FAFC;
}

.arc-table-total-row td {
    border-top: 3px solid #EE0000;
    padding: 26px 18px;
}

.arc-grand-total-cell {
    font-size: 26px !important; /* Huge highlighted text metric value representation */
    font-weight: 900 !important;
    color: var(--primary-color) !important;
    text-align: right;
    padding-right: 30px !important;
}

/* Structural Breakpoint Grid Query overrides */
@media (max-width: 1300px) {
    .arc-packages-grid { grid-template-columns: repeat(2, 1fr); gap: 20px; }
}
@media (max-width: 680px) {
    .arc-packages-grid { grid-template-columns: 1fr; }
}


/* gallery */

/* Gallery Layout Setup */
.arc-gal-container {
    max-width: 1200px;
    margin: 40px auto;
    padding: 0 20px;
    font-family: 'Segoe UI', Roboto, sans-serif;
}

.arc-gal-header-wrap {
    text-align: center;
    margin-bottom: 35px;
}

.arc-gal-main-title {
    font-size: 2rem;
    color: #111;
    text-transform: uppercase;
    letter-spacing: 1px;
    margin-bottom: 8px;
}

.arc-gal-subtitle {
    color: #666;
    font-size: 1rem;
}

/* 4-Column Grid System flex execution */
.arc-gal-grid-row {
    display: flex;
    flex-wrap: wrap;
    gap: 20px;
}

/* Default state: 4 columns on desktop screens (100% - total gaps / 4) */
.arc-gal-card-item {
    flex: 1 1 calc(25% - 15px);
    min-width: 250px;
    cursor: pointer;
}

/* Beautiful Curvature matching your blueprint references */
.arc-gal-image-inner {
    position: relative;
    border-radius: 28px; /* Clean premium curved corners */
    overflow: hidden;
    height: 380px; /* Uniform height aspect layout */
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.12);
    transition: transform 0.3s ease, box-shadow 0.3s ease;
}

.arc-gal-image-inner:hover {
    transform: translateY(-5px);
    box-shadow: 0 12px 30px rgba(0, 0, 0, 0.2);
}

.arc-gal-img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
    transition: transform 0.4s ease;
}

.arc-gal-image-inner:hover .arc-gal-img {
    transform: scale(1.05);
}

/* Integrated Linear Shadow Text Overlay Layer */
.arc-gal-overlay-layer {
    position: absolute;
    inset: 0;
    background: linear-gradient(to top, rgba(0, 0, 0, 0.85) 0%, rgba(0, 0, 0, 0.3) 40%, transparent 100%);
    display: flex;
    align-items: flex-end;
    padding: 25px;
}

.arc-gal-card-title {
    color: #ffffff;
    font-size: 1.25rem;
    font-weight: 600;
    margin: 0;
    letter-spacing: 0.5px;
}

/* ==========================================================================
   IMAGE PREVIEW MODAL LIGHTBOX SYSTEM
   ========================================================================== */
.arc-gal-modal-overlay {
    display: none; /* Invisible default initialization state */
    position: fixed;
    z-index: 99999; 
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.9);
    backdrop-filter: blur(5px);
    align-items: center;
    justify-content: center;
    opacity: 0;
    transition: opacity 0.3s ease;
}

.arc-gal-modal-overlay.arc-gal-active {
    display: flex;
    opacity: 1;
}

.arc-gal-modal-content-wrapper {
    position: relative;
    max-width: 85%;
    max-height: 80%;
    text-align: center;
}

.arc-gal-modal-content-wrapper img {
    max-width: 100%;
    max-height: 75vh;
    border-radius: 12px;
    object-fit: contain;
    border: 3px solid rgba(255, 255, 255, 0.2);
}

.arc-gal-modal-caption {
    margin-top: 15px;
    color: #fff;
    font-size: 1.2rem;
    letter-spacing: 1px;
}

.arc-gal-modal-close {
    position: absolute;
    top: 25px;
    right: 35px;
    color: #fff;
    font-size: 40px;
    font-weight: bold;
    cursor: pointer;
    transition: color 0.2s ease;
}

.arc-gal-modal-close:hover {
    color: #ff4d4d;
}

/* Responsive Scaling rules for smaller tablet view ports */
@media (max-width: 992px) {
    .arc-gal-card-item {
        flex: 1 1 calc(50% - 10px); /* Adjusts perfectly to 2 columns */
    }
}

/* Responsive adjustment for Mobile screens */
@media (max-width: 576px) {
    .arc-gal-card-item {
        flex: 1 1 100%; /* Becomes single file layout stacked vertically */
    }
    .arc-gal-image-inner {
        height: 320px;
    }
}
/* career */

/* Container Box Sizing Context */
.arc-car-form-wrapper {
    max-width: 950px;
    margin: 40px auto;
    background: #ffffff;
    border-radius: 8px;
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.15);
    overflow: hidden;
    font-family: 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
}

/* Crimson Header Strip Layout */
.arc-car-form-header {
    background-color: #e11d1d; /* Matches signature red banner */
    padding: 15px 25px;
}

.arc-car-form-header h2 {
    color: #ffffff;
    margin: 0;
    font-size: 1.35rem;
    font-weight: 700;
    letter-spacing: 0.5px;
}

/* Form Matrix Grid Elements */
.arc-car-form-body {
    padding: 30px 25px;
    display: flex;
    flex-direction: column;
    gap: 20px;
}

.arc-car-form-row {
    display: flex;
    gap: 20px;
}

.arc-car-form-group {
    flex: 1;
    display: flex;
    flex-direction: column;
    gap: 6px;
}

.arc-car-full-width {
    width: 100%;
}

/* Label & Typography settings */
.arc-car-form-group label {
    font-size: 0.95rem;
    color: #333333;
    font-weight: 500;
}

.arc-car-required {
    color: #e11d1d;
}

/* Input Fields Interactive Aesthetics */
.arc-car-form-body input[type="text"],
.arc-car-form-body input[type="email"],
.arc-car-form-body input[type="tel"],
.arc-car-form-body select,
.arc-car-form-body textarea {
    width: 100%;
    padding: 10px 12px;
    border: 1px solid #dcdcdc;
    border-radius: 4px;
    font-size: 0.95rem;
    color: #444444;
    background-color: #ffffff;
    box-sizing: border-box;
    transition: border-color 0.2s ease, box-shadow 0.2s ease;
}

/* Focus and Active States */
.arc-car-form-body input:focus,
.arc-car-form-body select:focus,
.arc-car-form-body textarea:focus {
    outline: none;
    border-color: #e11d1d;
    box-shadow: 0 0 0 3px rgba(225, 29, 29, 0.1);
}

/* Custom Styled File Input Context */
.arc-car-file-input-wrapper input[type="file"] {
    padding: 8px;
    background: #fafafa;
    border: 1px dashed #cccccc;
    width: 100%;
    border-radius: 4px;
    cursor: pointer;
}

/* Footer Alignments */
.arc-car-form-footer {
    display: flex;
    justify-content: flex-end;
    margin-top: 10px;
}

/* Clean Custom Right-Aligned Crimson Button */
.arc-car-submit-btn {
    background-color: #b31d1d; /* Solid matching block finish */
    color: #ffffff;
    border: none;
    padding: 12px 30px;
    font-size: 0.95rem;
    font-weight: 600;
    border-radius: 4px;
    cursor: pointer;
    box-shadow: 0 4px 10px rgba(179, 29, 29, 0.2);
    transition: background-color 0.2s ease, transform 0.1s ease;
}

.arc-car-submit-btn:hover {
    background-color: #941313;
}

.arc-car-submit-btn:disabled {
    background-color: #cccccc;
    cursor: not-allowed;
    box-shadow: none;
}

/* Responsive Adaptive Setup for Tablets/Mobiles */
@media (max-width: 600px) {
    .arc-car-form-row {
        flex-direction: column;
        gap: 20px;
    }
    .arc-car-form-body {
        padding: 20px 15px;
    }
}

/* contact form */
/* Unique CSS Stylesheet to avoid any layout clashes */
        .arc-enq-container {
            display: flex;
            max-width: 1200px;
            margin: 40px auto;
            background: #ffffff;
            border-radius: 8px;
            box-shadow: 0 4px 15px rgba(0, 0, 0, 0.1);
            overflow: hidden;
            font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
        }

        /* Left Side Image Section */
        .arc-enq-image-section {
            flex: 1;
            background-image: url('../images/Allimages/omr-1.jpeg'); /* Inga unga image URL-ah mathikoonga */
            background-size: cover;
            background-position: center;
            min-height: 450px;
        }

        /* Right Side Form Section */
        .arc-enq-form-section {
            flex: 1;
            padding: 40px;
            display: flex;
            flex-direction: column;
            justify-content: center;
        }

        .arc-enq-title {
            font-size: 24px;
            font-weight: bold;
            color: #111111;
            margin-bottom: 24px;
            text-transform: uppercase;
            letter-spacing: 0.5px;
        }

        .arc-enq-group {
            margin-bottom: 18px;
        }

        .arc-enq-label {
            display: block;
            font-size: 15px;
            color: #333333;
            margin-bottom: 8px;
        }

        .arc-enq-input, 
        .arc-enq-select, 
        .arc-enq-textarea {
            width: 100%;
            padding: 10px 12px;
            border: 1px solid #ecc9c9; /* Match light red/pinkish border from image */
            border-radius: 4px;
            font-size: 14px;
            color: #333333;
            box-sizing: border-box;
            outline: none;
            transition: border-color 0.3s ease;
        }

        .arc-enq-input:focus, 
        .arc-enq-select:focus, 
        .arc-enq-textarea:focus {
            border-color: #a82323; /* Darker red on focus */
        }

        .arc-enq-textarea {
            height: 120px;
            resize: vertical;
        }

        .arc-enq-btn-container {
            display: flex;
            justify-content: flex-end;
            margin-top: 10px;
        }

        .arc-enq-submit-btn {
            background-color: #a82323; /* Match dark red button from image */
            color: #ffffff;
            border: none;
            padding: 12px 24px;
            font-size: 14px;
            font-weight: 600;
            text-transform: uppercase;
            border-radius: 4px;
            cursor: pointer;
            box-shadow: 0 4px 6px rgba(0, 0, 0, 0.15);
            transition: background-color 0.3s ease;
        }

        .arc-enq-submit-btn:hover {
            background-color: #8c1c1c;
        }

        /* Responsive Design for Mobile Devices */
        @media (max-width: 768px) {
            .arc-enq-container {
                flex-direction: column;
                margin: 20px;
            }
            .arc-enq-image-section {
                min-height: 200px;
            }
            .arc-enq-form-section {
                padding: 25px;
            }
        }


		/* cta */

		/* Container Box */
.cta-box-image {
    width: 100%;       /* Unga grid structural grid layout-ku flexible-ah set aagum */
    max-width: 500px;  /* Image romba perusa aagama irukka limit (Unga preference ketha maari mathikalam) */
    height: 470px;     /* Intha height form-oda height-க்கு nalla match aagum */
}

/* Figure Tag Reset */
.cta-box-image figure {
    width: 100%;
    height: 100%;
    margin: 0;         /* Default browser margin-ah remove panna */
    padding: 0;
    overflow: hidden;  /* Image border-ah vittu veliya varama irukka */
}

/* Actual Image Styling */
.cta-box-image figure img {
    width: 100%;
    height: 100%;
    object-fit: cover; /* Ithuthaan romba mukkiyam! Image stretch aagama perfect-ah crop panni set pannum */
    display: block;
}