/* ----------------------------------------------------------------------------------------
* Author        : Awaiken
* Template Name : Labrix - Laboratory & Science Research HTML Template
* File          : CSS File
* Version       : 1.0
* ---------------------------------------------------------------------------------------- */
/* INDEX
----------------------------------------------------------------------------------------
01. Global Variables
02. General css
03. Header css
04. Hero css
05. Scrolling Ticker css
06. About Us css
07. Our Services css
08. Why Choose Us css
09. What We Do css
10. Case Study css
11. Intro Video css
12. How It Work css
13. Our Pricing css
14. Our FAQs css
15. Our Testimonials css
16. Our Blog css
17. Footer css
18. About Us Page css
19. Services Page css
20. Service Single css
21. Blog Archive css
22. Blog Single css
23. Case Study Page css
24. Case Study Single css
25. Team Page css
26. Team Single css
27. Pricing Page css
28. Testimonials Page css
29. Image Gallery css
30. Video Gallery css
31. FAQs Page css
32. Contact Us Page css
33. 404 Error Page css
34. Responsive css
-------------------------------------------------------------------------------------- */

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

:root{
	--primary-color				: #0A2540;
	--secondary-color			: #00B4D8;
	--bg-color					: #F8F8F8;
	--text-color				: #45566A;
	--accent-color				: #90E0EF;
	--white-color				: #FFFFFF;
	--divider-color				: #172C451A;
	--dark-divider-color		: #FFFFFF1A;
	--error-color				: rgb(230, 87, 87);
	--default-font				: "Manrope", sans-serif;
	--accent-font				: "Sora", sans-serif;
}

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

body{
	position: relative;
	font-family: var(--default-font);
	font-size: 16px;
	font-weight: 500;
	line-height: 1em;
	color: var(--text-color);
	background: var(--bg-color);
}

::-webkit-scrollbar-track{
	background-color: var(--secondary-color);
	border-left: 1px solid var(--secondary-color);
}
::-webkit-scrollbar{
	width: 7px;
	background-color: var(--secondary-color);
}
::-webkit-scrollbar-thumb{
	background: var(--primary-color);
}

::selection{
	color: var(--primary-color);
	background-color: var(--accent-color);
	filter: invert(1);
}

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

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

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{
	position: relative;
    display: inline-block;
    background: #01caff;
	border-radius: 10px;
	font-family: var(--accent-font);
    font-size: 14px;
    font-weight: 700;
    line-height: 1em;
    text-transform: capitalize;
    color: #0a2540;
    border: none;
    padding: 17px 50px 17px 20px;
    overflow: hidden;
	transition: all 0.4s ease-in-out;
    z-index: 0;
}

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

.btn-default::before{
	content: '';
	position: absolute;
	top: 50%;
    right: 20px;
	width: 20px;
	height: 20px;
	background-image: url('../images/arrow-primary.svg');
	background-repeat: no-repeat;
    background-position: center center;
    background-size: cover;
	transform: translateY(-50%);
	transition: all 0.4s ease-in-out;
	z-index: 1;
}

.btn-default:hover::before{
	transform: translateY(-50%) rotate(45deg);
	filter: brightness(0) invert(1);
}

.btn-default::after{
	content: '';
	position: absolute;
	left: 0;
	bottom: 0%;
	width: 102%;
	height: 100%;
	background-color: var(--primary-color);
	transition: all 0.5s ease-in-out;
	z-index: -1;
	transform: skewY(9.3deg) scaleY(0);
}

.btn-default:hover::after{
	transform: skewY(0deg) scaleY(2);
}

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

.btn-default.btn-highlighted:hover::before{
	filter: none;
}

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

.btn-default.btn-border{
	background: transparent;
	color: var(--white-color);
	border: 1px solid var(--white-color);
	padding: 16px 50px 16px 20px;
}

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

.btn-default.btn-border::before{
	background-image: url('../images/arrow-white.svg');
}

.btn-default.btn-border:hover:before{
	filter: brightness(0) invert(0);
}

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

.readmore-btn{
	position: relative;
	font-family: var(--accent-font);
	font-size: 16px;
	font-weight: 600;
	line-height: normal;
	text-transform: capitalize;
	color: var(--primary-color);
	padding-right: 26px;
}

.readmore-btn::before{
	content: '';
    position: absolute;
    top: 0;
    right: 0;
	background-image: url('../images/arrow-primary.svg');
	background-repeat: no-repeat;
	background-size: cover;
	width: 20px;
	height: 20px;
    transition: all 0.3s ease-in-out;
}

.readmore-btn:hover::before{
	transform: rotate(45deg);
}

.cb-cursor:before{
	background: var(--accent-color);
}

.preloader{
	position: fixed;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	z-index: 1000;
	background: var(--primary-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(--accent-color) transparent var(--accent-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);
	}
}

.bg-section{
	width: 100%;
	max-width: 1820px;
	background-color: var(--secondary-color);
	border-radius: 20px;
	margin: 0 auto;
}

.dark-section{
	background-color: var(--primary-color);
}

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

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

.section-row .section-title.section-title-center{
	width: 100%;
	max-width: 700px;
	margin: 0 auto;
	text-align: center;
}

.section-btn{
	text-align: right;
}

.section-content-btn .section-btn{
	margin-top: 30px;
	text-align: left;
}

.section-title-content p{
	margin-bottom: 20px;
}

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

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

.section-title h3{
	position: relative;
	display: inline-block;
	border: 1px solid var(--divider-color);
	border-radius: 100px;
	font-size: 14px;
    font-weight: 500;
	text-transform: capitalize;
    color: var(--primary-color);
	padding: 8px 16px 8px 32px;
    margin-bottom: 10px;
}

.section-title h3::before{
	content: '';
	position: absolute;
	left: 16px;
	top: 50%;
	transform: translateY(-50%);
	background: var(--accent-color);
	border-radius: 50%;
	width: 6px;
	height: 6px;
}

.section-title h1{
	font-size: 45px;
	font-weight: 400;
	line-height: 1.2em;
	letter-spacing: -0.02em;
	margin-bottom: 0;
	cursor: none;
}

.section-title h2{
	font-size: 46px;
	font-weight: 400;
	line-height: 1.2em;
	letter-spacing: -0.02em;
	margin-bottom: 0;
	cursor: none;
}

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

.bg-section .section-title h3{
	border-color: var(--primary-color);
}

.bg-section .section-title h3::before{
	background: var(--primary-color);
}

.dark-section .section-title h3,
.dark-section .section-title h1,
.dark-section .section-title h2,
.dark-section .section-title p,
.dark-section .section-title-content p{
	color: var(--white-color);
}

.dark-section .section-title h3{
	border-color: var(--dark-divider-color);
}

.dark-section .section-title h3::before{
	background: var(--accent-color);
}

.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		 ****/
/************************************/

header.main-header{
	position: absolute;
    top: 0;
    width: 100%;
    border-bottom: 1px solid var(--dark-divider-color);
    z-index: 100;
}

header.main-header .header-sticky{
	position: relative;
	top: 0;
	width: 100%;
	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(--dark-divider-color);
	padding: 0 15px;
}

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

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

.main-menu .nav-menu-wrapper{
	flex: 1;
	text-align: center;
	margin: 0 1.042vw;
}

.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-size: 16px;
	font-weight: 500;
	line-height: 1.2em;
	padding: 14px 10px !important;
	color: var(--white-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);
}

/* Base Dropdown */
.main-menu ul ul {
    visibility: hidden;
    opacity: 0;
    transform: translateY(8px);
    padding: 6px 0;
    margin: 0;
    list-style: none;
    width: 320px;
    border-radius: 10px;
    position: absolute;
    left: 0;
    top: 100%;
    background: var(--accent-color); /* No color change */
    transition: all 0.25s ease;
    text-align: left;
    box-shadow: 0 6px 20px rgba(0,0,0,0.08);
}

/* First Child */
.main-menu ul li.submenu:first-child ul {
    width: 235px;
}

/* Right Side Submenu */
.main-menu ul ul ul {
    left: 100%;
    top: 0;
}

/* Dropdown Items */
.main-menu ul ul li {
    padding: 10px 16px;
    position: relative;
}

/* Separator Between Items */
.main-menu ul ul li + li {
    border-top: 1px solid #008cb1; /* light 1px line */
    margin-top: 4px;
    padding-top: 10px;
}

/* Show on Hover */
.main-menu ul li:hover > ul {
    visibility: visible;
    opacity: 1;
    transform: translateY(0);
}


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

.main-menu ul li.submenu ul li.submenu > a:after{
    content: '\f105';
    float: right;
}

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

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

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

.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: 0;
	display: flex;
	align-items: center;
	justify-content: center;
	width: 28px;
	height: 32px;
	margin: 0;
	border-radius: 6px;
}

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

.slicknav_icon .slicknav_icon-bar:first-child{
	margin-top: 0 !important;
}

.slicknav_icon .slicknav_icon-bar:last-child{
	margin-bottom: 0 !important;
}

.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-size: 16px;
	font-weight: 500;
	text-transform: capitalize;
	padding: 7px 20px;
	color: var(--primary-color);
	line-height: normal;
	margin: 0;
	border-radius: 0 !important;
	transition: all 0.3s ease-in-out;
}

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

.slicknav_menu ul ul li a{
    padding: 7px 20px 7px 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(--primary-color);
	position: absolute;
	right: 15px;
	top: 50%;
	transform: translateY(-50%);
	transition: all 0.3s ease-out;
}

.slicknav_open > a .slicknav_arrow:after{
    transform: translateY(-50%) rotate(-180deg);
	color: var(--text-color);
}

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

.hero{
	position: relative;
	background: url('../images/hero-bg.jpg') no-repeat;
	background-position: center center;
	background-size: cover;
	padding: 250px 0 190px;
}

.hero::before{
	content: '';
    display: block;
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
	background: linear-gradient(270deg, rgba(23, 44, 69, 0.00) 0%, rgba(23, 44, 69, 0.80) 60.83%);
    width: 100%;
    height: 100%;
    z-index: 1;
}

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

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

.hero.hero-slider-layout{
	background: none;
	padding: 0;
}

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

.hero.hero-slider-layout .hero-slide::before{
	content: '';
    display: block;
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    background: linear-gradient(270deg, rgba(23, 44, 69, 0.00) 0%, rgba(23, 44, 69, 0.80) 60.83%);
    width: 100%;
    height: 100%;
    z-index: 1;
}

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

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

.hero.hero-slider-layout .hero-pagination{
	position: absolute;
    bottom: 30px;
	text-align: center;
	z-index: 2;
}

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

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

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

.hero-content .section-title p{
	max-width: 730px;
}

.hero-btn{
	display: flex;
	flex-wrap: wrap;
	gap: 15px 40px;
}

.hero-body{
	display: flex;
	flex-wrap: wrap;
	gap: 20px 40px;
	border-top: 1px solid var(--dark-divider-color);
	margin-top: 40px;
	padding-top: 40px;
}

.hero-experience-box{
	width: 24%;
	display: flex;
	align-items: center;
	gap: 10px;
}

.hero-experience-box h2{
	width: 80px;
	font-size: 46px;
	color: var(--white-color);
}

.hero-experience-box p{
	color: var(--white-color);
	margin: 0;
}

.satisfy-client-box{
	display: flex;
	flex-wrap: wrap;
    align-items: center;
    gap: 20px;
}

.satisfy-client-images{
	display: inline-flex;
	align-items: center;
}

.satisfy-client-image{
	position: relative;
    display: inline-block;
    margin-left: -18px;
	z-index: 1;
}

.satisfy-client-image:first-child{
	margin: 0;
}

.satisfy-client-image figure{
	display: block;
	width: 50px;
	height: 50px;
	border: 1px solid var(--white-color);
	border-radius: 50%;
}

.satisfy-client-image img{
    width: 100%;
	border-radius: 50%;
}

.satisfy-client-image.add-more{
	width: 50px;
	height: 50px;
	background-color: var(--accent-color);
	border: 1px solid var(--white-color);
	border-radius: 50%;
	display: flex;
	justify-content: center;
	align-items: center;
}

.satisfy-client-image.add-more p{
	font-family: var(--accent-font);
	font-size: 14px;
	font-weight: 600;
	color: var(--primary-color);
	margin: 0;
}

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

.satisfy-client-content h3{
	font-size: 16px;
	font-weight: 600;
	color: var(--white-color);
}

.hero-video-circle{
	text-align: right;
}

.hero-video-circle a{
	display: inline-block;
	border-radius: 50%;
	cursor: none;
}

.hero-video-circle img{
	width: 100%;
	max-width: 120px;
	border-radius: 50%;
	animation: infiniterotate 20s infinite linear;
}

@keyframes infiniterotate{
    from{
        transform: rotate(0deg);
      }
    to{
        transform: rotate(360deg);
    }
}

.hero-video-circle a:hover img{
	animation-play-state: paused;
}

/************************************/
/***   05. Scrolling Ticker css   ***/
/************************************/

.our-scrolling-ticker{
	position: relative;
	background-color: var(--secondary-color);
	padding: 25px 0;
	z-index: 1;
}

.scrolling-ticker-box{
	--gap: 30px;
	position: relative;
	display: flex;
	overflow: hidden;
	user-select: none;
	gap: var(--gap);
	align-items: center;
}

.scrolling-content{
	flex-shrink: 0;
	display: flex;
	gap: var(--gap);
	min-width: 100%;
	animation: scroll 40s linear infinite;
}

.scrolling-content span{
	display: inline-block;
	font-family: var(--accent-font);
	font-size: 28px;
	font-weight: 600;
	line-height: 1.2em;
	text-transform: capitalize;
	color: var(--primary-color);
}

.scrolling-content span img{
	width: 100%;
	max-width: 30px;
	margin-right: 30px;
}

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

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

/************************************/
/*** 	   06. About Us css 	  ***/
/************************************/

.about-us{
	background-image: url('../images/section-bg-shape-1.png');
    background-repeat: no-repeat;
    background-position: right -40px bottom 100px;
    background-size: auto;
	padding: 100px 0;
}

.about-us .section-row .section-title{
	margin-right: 15px;
}

.customer-rating-box{
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	margin-top: 30px;
}

.customer-rating-content{
	border-right: 1px solid var(--divider-color);
	margin-right: 40px;
	padding-right: 40px;
}

.customer-rating-star{
	margin-bottom: 15px;
}

.customer-rating-star i{
	color: var(--accent-color);
	font-size: 16px;
}

.customer-rating-content h3{
	font-size: 20px;
	margin-bottom: 10px;
}

.customer-rating-content p{
	margin: 0;
}

.customer-rating-images{
	background: var(--white-color);
	box-shadow: 0px 0px 20px 0px rgba(23, 44, 69, 0.10);
	border-radius: 100px;
	padding: 10px;
}

.customer-rating-images .satisfy-client-image{
	margin-left: -10px;
}

.customer-rating-images .satisfy-client-image:first-child{
	margin-left: 0;
}

.customer-rating-images .satisfy-client-image.add-more,
.customer-rating-images .satisfy-client-image figure{
	width: 40px;
	height: 40px;
}

.about-us-boxes{
	display: flex;
	flex-wrap: wrap;
	gap: 30px;
}

.about-image-content-box-1{
	position: relative;
	width: calc(25% - 20px);
}

.about-image{
	position: relative;
	height: 100%;
	border-radius: 20px;
	overflow: hidden;
}

.about-image::before{
	content: '';
	position: absolute;
	top: 0;
	bottom: 0;
	left: 0;
	right: 0;
	background: linear-gradient(180deg, rgba(23, 44, 69, 0.00) 39.29%, var(--primary-color) 100%);
	width: 100%;	
	height: 100%;
}

.about-image figure{
	display: block;
	height: 100%;
}

.about-image img{
	width: 100%;
	height: 100%;
	aspect-ratio: 1 / 0.741;
	object-fit: cover;
}

.about-image-content{
	position: absolute;
	bottom: 40px;
	left: 40px;
	right: 40px;
	z-index: 2;
}

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

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

.video-play-button a:after{
	animation-delay: .3s;
}

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

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

.about-video-title{
	margin-top: 30px;
}

.about-video-title h3{
	font-size: 20px;
	color: var(--white-color);
}

.about-counter-box{
	width: calc(34% - 20px);
	background: var(--primary-color);
	border-radius: 20px;
	display: flex;
	flex-wrap: wrap;
	flex-direction: column;
	justify-content: space-between;
	padding: 40px;
}

.about-counter-title{
	display: flex;
	align-items: center;
	gap: 10px;
	border-bottom: 1px solid var(--dark-divider-color);
	margin-bottom: 30px;
	padding-bottom: 30px;
}

.about-counter-title h2{
	width: 95px;
	font-size: 46px;
	color: var(--white-color);
}

.about-counter-title h3{
	font-size: 18px;
	color: var(--white-color);
}

.about-counter-content ul{
	padding: 0 0 0 20px;
	margin: 0 0 15px 0;
}

.about-counter-content ul li{
	color: var(--white-color);
	margin-bottom: 10px;
}

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

.about-counter-content p{
	color: var(--white-color);
	margin-bottom: 20px;
}

.about-counter-content .readmore-btn{
	color: var(--white-color);
}

.about-counter-content .readmore-btn::before{
	background-image: url('../images/arrow-white.svg');
}

.about-image-content-box-2{
	position: relative;
	width: calc(41% - 20px);
}

.about-image-content ul{
	list-style: none;
	padding: 0;
	margin: 0;
	display: flex;
	flex-wrap: wrap;
	gap: 15px;
}

.about-image-content ul li{
	display: inline-block;
	font-size: 14px;
	color: var(--white-color);
	border: 1px solid var(--dark-divider-color);
	background: var(--dark-divider-color);
	backdrop-filter: blur(7px);
	-webkit-backdrop-filter: blur(7px);
	border-radius: 30px;
	padding: 7px 20px;
	transition: all 0.4s ease-in-out;
}

.about-image-content ul li:hover{
	background: var(--accent-color);
	color: var(--primary-color);
}

/************************************/
/*** 	 07. Our Services css	  ***/
/************************************/

.our-services{
	padding: 100px 0;
}

.service-item{
	position: relative;
	background: var(--white-color);
	border-radius: 20px;
	aspect-ratio: 1 / 1.15;
	height: calc(100% - 30px);
	margin-bottom: 30px;
	padding: 40px 35px;
	overflow: hidden;
}

.service-item:before{
	content: '';
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	background: var(--white-color);
	border-radius: 20px;
	width: 100%;
	height: 100%;
	transition: all 0.5s ease-in-out;
	z-index: 1;
}

.service-item.active::before,
.service-item:hover::before{
	transform: translate(100%, -100%);
}

.service-image{
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	opacity: 0;
	transition: all 0.4s ease-in-out;
}

.service-item.active .service-image,
.service-item:hover .service-image{
	opacity: 1;
}

.service-image::after{
	content: '';
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	background: linear-gradient(180deg, rgba(23, 44, 69, 0.00) 39.29%, var(--primary-color) 100%);
	width: 100%;
	height: 100%;	
}

.service-image img{
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.service-body{
	position: relative;
	height: 100%;
	display: flex;
	flex-wrap: wrap;
	flex-direction: column;
	justify-content: space-between;
    z-index: 2;
}

.service-body-header{
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: space-between;
	gap: 10px;
	margin-bottom: 30px;
}

.service-body .icon-box{
	width: 50px;
	height: 50px;
	display: flex;
	justify-content: center;
	align-items: center;
	background: var(--accent-color);
	border-radius: 50%;
}

.service-body .icon-box img{
	width: 100%;
	max-width: 24px;
}

.service-readmore-btn{
	position: absolute;
	top: 5px;
	right: 0px;
	transform: translate(-100%, 100%) rotate(90deg);
	opacity: 0;
	visibility: hidden;
	transition: all 0.4s ease-in-out;
	z-index: 1;
}

.service-item.active .service-readmore-btn,
.service-item:hover .service-readmore-btn{
	transform: translate(0, 0) rotate(0);
	opacity: 1;
	visibility: visible;
}

.service-readmore-btn a{
	background: var(--primary-color);
	border-radius: 50%;
	display: flex;
	align-items: center;
	justify-content: center;
	width: 40px;
	height: 40px;
}

.service-readmore-btn a img{
	max-width: 20px;
	transition: all 0.4s ease-in-out;
}

.service-readmore-btn a:hover img{
	transform: rotate(45deg);
}

.service-content h3{
	font-size: 20px;
	margin-bottom: 10px;
	transition: all 0.4s ease-in-out;
}

.service-content h3 a{
	color: inherit;
}

.service-content p{
	margin-bottom: 0;
	transition: all 0.4s ease-in-out;
}

.service-item.active .service-content h3,
.service-item:hover .service-content h3,
.service-item.active .service-content p,
.service-item:hover .service-content p{
	color: var(--white-color);
}

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

.section-footer-text p{
	margin: 0;
}

.section-footer-text p span{
	display: inline-block;
	font-size: 14px;
	line-height: 1.1em;
	color: var(--white-color);
	background: var(--primary-color);
	border-radius: 4px;
	padding: 4px 12px;
	margin-right: 10px;
}

.section-footer-text p a{
	font-weight: 600;
	color: var(--primary-color);
	text-decoration: underline;
	transition: all 0.3s ease-in-out;
}

.section-footer-text p a:hover{
	color: var(--white-color);
}

/************************************/
/*** 	 08. Why Choose Us css	  ***/
/************************************/

.why-choose-us{
	background-image: url('../images/section-bg-shape-2.png');
    background-repeat: no-repeat;
    background-position: left -60px bottom 100px;
    background-size: auto;
	padding: 100px 0;
}

.why-choose-image-box{
	position: relative;
	margin-right: 15px;
}

.why-choose-image figure{
	display: block;
	border-radius: 20px;
}

.why-choose-image figure img{
	width: 100%;
	aspect-ratio: 1 / 1.16;
	object-fit: cover;
	border-radius: 20px;
}

.why-choose-image-box .satisfy-client-box{
	position: absolute;
	bottom: 30px;
	left: 30px;
	display: block;
	background: var(--dark-divider-color);
	border: 1px solid var(--dark-divider-color);
	backdrop-filter: blur(25px);
	-webkit-backdrop-filter: blur(25px);
	border-radius: 10px;
	padding: 25px;
}

.why-choose-image-box .satisfy-client-box .satisfy-client-content{
	margin-top: 20px;
}

.why-choose-image-box .satisfy-client-box .satisfy-client-content h3{
	font-size: 18px;
	font-weight: 600;
	color: var(--primary-color);
}

.why-choose-body{
	display: flex;
	flex-wrap: wrap;
	gap: 30px 40px;
}

.why-choose-item-box{
	width: calc(60% - 20px);
}

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

.why-choose-item:last-child{
	border-bottom: none;
	padding-bottom: 0;
	margin-bottom: 0;
}

.why-choose-item-header{
	width: 50%;
	display: flex;
	align-items: center;
}

.why-choose-item-header .icon-box{
	position: relative;
	height: 50px;
	width: 50px;
	display: flex;
	justify-content: center;
	align-items: center;
	background-color: var(--accent-color);
	border-radius: 50%;
	margin-right: 15px;
}

.why-choose-item-header .icon-box::before{
	content: '';
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	width: 100%;
	height: 100%;
	background-color: var(--primary-color);
	border-radius: 50%;
	transform: scale(0);
	transition: all 0.4s ease-in-out;
	z-index: 0;
}

.why-choose-item:hover .why-choose-item-header .icon-box::before{
	transform: scale(1);
}

.why-choose-item-header .icon-box img{
	position: relative;
	width: 100%;
	max-width: 24px;
	transition: all 0.4s ease-in-out;
	z-index: 1;
}

.why-choose-item:hover .why-choose-item-header .icon-box img{
	filter: brightness(0) invert(1);
}

.why-choose-item-title{
	width: calc(100% - 65px);
}

.why-choose-item-title h3{
	font-size: 18px;
	line-height: 1.3em;
}

.why-choose-item-content{
	width: calc(50% - 15px);
	border-left: 1px solid var(--divider-color);
	padding-left: 15px;
	margin-left: 15px;
}

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

.why-choose-body-image{
	width: calc(40% - 20px);
}

.why-choose-btn{
	margin-top: 60px;
}

.why-choose-body-image figure{
	display: block;
	border-radius: 20px;
}

.why-choose-body-image img{
	width: 100%; 
	aspect-ratio: 1 / 1.01;
	object-fit: cover;
	border-radius: 20px;
}

/************************************/
/*** 	  09. What We Do css	  ***/
/************************************/

.what-we-do{
	background-image: url('../images/section-bg-shape-3.png');
    background-repeat: no-repeat;
    background-position: right -20px bottom -10px;
    background-size: auto;
	padding: 100px 0;
}

.what-we-contant{
	margin-right: 15px;
}

.what-we-counter-box{
	max-width: 300px;
	margin-top: 60px;
}

.what-we-counter-box h2{
	font-size: 80px;
    line-height: 1em;
    font-weight: 600;
    color: var(--primary-color);
    background: var(--accent-color);
    background-clip: text;
    -webkit-background-clip: text;
    -webkit-text-stroke: 2px transparent;
	border-bottom: 1px solid var(--dark-divider-color);
	padding-bottom: 20px;
	margin-bottom: 20px;
}

.what-we-counter-box h3{
	font-size: 20px;
	color: var(--white-color);
	margin-bottom: 5px;
}

.what-we-counter-box p{
	color: var(--white-color);
	margin: 0;
}

.what-we-item{
	display: flex;
	flex-wrap: wrap;
	border-bottom: 1px solid var(--dark-divider-color);
	margin-bottom: 40px;
	padding-bottom: 40px;
}

.what-we-item:last-child{
	border-bottom: none;
	padding-bottom: 0;
	margin-bottom: 0;
}

.what-we-item .icon-box{
	position: relative;
	height: 50px;
	width: 50px;
	display: flex;
	justify-content: center;
	align-items: center;
	background-color: var(--accent-color);
	border-radius: 50%;
	margin-right: 20px;
}

.what-we-item .icon-box::before{
	content: '';
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	width: 100%;
	height: 100%;
	background-color: var(--white-color);
	border-radius: 50%;
	transform: scale(0);
	transition: all 0.4s ease-in-out;
	z-index: 0;
}

.what-we-item:hover .icon-box::before{
	transform: scale(1);
}

.what-we-item .icon-box img{
	position: relative;
	width: 100%;
	max-width: 24px;
	z-index: 1;
}

.what-we-content{
	width: calc(100% - 70px);
}

.what-we-content h3{
	font-size: 20px;
	color: var(--white-color);
	margin-bottom: 10px;
}

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

/************************************/
/*** 	  10. Case Study css	  ***/
/************************************/

.case-study{
	background-image: url('../images/section-bg-shape-2.png');
    background-repeat: no-repeat;
    background-position: right -20px bottom 120px;
    background-size: auto;
	padding: 100px 0 60px;
}

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

.case-study-image{
	position: relative;
	border-radius: 20px;
	margin-bottom: 20px;
	overflow: hidden;
}

.case-study-image::before{
	content: '';
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
	transform: scale(0);
    background: var(--primary-color);
	border-radius: 20px;
	opacity: 40%;
    width: 100%;
    height: 100%;
	transition: all 0.4s ease-in-out;
    z-index: 1;
}

.case-study-item:hover .case-study-image::before{
	transform: scale(1);
}

.case-study-image figure{
	display: block;
}

.case-study-image figure img{
	width: 100%;
	aspect-ratio: 1 / 0.77;
	object-fit: cover;
	border-radius: 20px;
	transition: all 0.4s ease-in-out;
}

.case-study-item:hover .case-study-image figure img{
	transform: scale(1.1);
}

.case-study-btn{
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%) scale(0);
	opacity: 0;
	visibility: hidden;
	transition: all 0.4s ease-in-out;
	z-index: 1;
}

.case-study-item:hover .case-study-btn{
	opacity: 1;
	visibility: visible;
	transform: translate(-50%, -50%) scale(1);
}

.case-study-btn a{
	background: var(--accent-color);
	border-radius: 50%;
	width: 50px;
	height: 50px;
	display: flex;
	align-items: center;
	justify-content: center;
	transition: 0.4s ease-in-out;
}

.case-study-btn a:hover{
	background: var(--white-color);
}

.case-study-btn a img{
	width: 100%;
	max-width: 24px;
	transition: 0.4s ease-in-out;
}

.case-study-btn a:hover img{
	transform: rotate(45deg);
}

.case-study-content h2{
	font-size: 20px;
	line-height: 1.4em;
}

.case-study-content h2 a{
	color: inherit;
}

/************************************/
/*** 	  11. Intro Video css	  ***/
/************************************/

.intro-video{
	position: relative;
	overflow: hidden;
}

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

.intro-video-box{
    position: relative;
	text-align: center;
	align-content: center;
    height: 800px;
}

.intro-video-box{
	position: relative;
}

.intro-video-image{
	position: absolute;
    top: 0;
    left: 0;
	right: 0;
	bottom: 0;
	width: 100%;
	height: 100%;
}

.intro-video-image::before{
	content: '';
	position: absolute;
	top: 0;
	bottom: 0;
	left: 0;
	right: 0;
	background: var(--primary-color);
	opacity: 60%;
	width: 100%;
	height: 100%;
}

.intro-video-image figure{
	width: 100%;
	height: 100%;
	display: block;
    border-radius: 20px;
}

.intro-video-image img{
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.video-play-border-button{
	position: relative;
    z-index: 1;
}

.video-play-border-button a{
	position: relative;
	background: transparent;
	border: 1px solid var(--white-color);
	border-radius: 100%;
	width: 100px;
	height: 100px;
	color: var(--white-color);
	text-transform: uppercase;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	cursor: none;
	transition: all 0.4s ease-in-out;
}

.video-play-border-button a:hover{
	font-size: 20px;
	letter-spacing: 0.05em;
}

/************************************/
/*** 	 12. How It Work css	  ***/
/************************************/

.how-it-work{
	background-image: url('../images/section-bg-shape-4.png');
    background-repeat: no-repeat;
    background-position: left -30px bottom 100px;
    background-size: auto;
	padding: 100px 0;
}

.how-work-image-box{
	position: relative;
	margin-right: 15px;
}

.how-work-image figure{
	display: block;
	border-radius: 20px;
}

.how-work-image figure img{
	width: 100%;
	aspect-ratio: 1 / 1.257;
	object-fit: cover;
	border-radius: 20px;
}

.how-work-image-box .satisfy-client-box{
    position: absolute;
    bottom: 40px;
    left: 40px;
    display: block;
	width: 290px;
    background: var(--dark-divider-color);
    backdrop-filter: blur(25px);
    -webkit-backdrop-filter: blur(25px);
    border-radius: 20px;
    padding: 25px;
	z-index: 1;
}

.how-work-image-box .satisfy-client-box .satisfy-client-content{
	margin-top: 40px;
}

.how-work-image-box .satisfy-client-box .satisfy-client-content h3{
	font-size: 20px;
	color: var(--primary-color);
	margin-bottom: 10px;
}

.how-work-image-box .satisfy-client-box .satisfy-client-content p{
	color: var(--primary-color);
}

.work-steps-item{
	display: flex;
	align-items: start;
	flex-wrap: wrap;
	border-bottom: 1px solid var(--divider-color);
	margin-bottom: 40px;
	padding-bottom: 40px;
}

.work-steps-item:last-child{
	border-bottom: none;
	padding-bottom: 0;
	margin-bottom: 0;
}

.work-step-no{
	display: inline-block;
	background: var(--accent-color);
	border-radius: 6px;
	padding: 7px 16px;
	margin-right: 25px;
	transition: all 0.4s ease-in-out;
}

.work-steps-item:hover .work-step-no{
	background: var(--primary-color);
}

.work-step-no h3{
	font-family: var(--default-font);
	font-size: 16px;
	font-weight: 500;
	transition: all 0.4s ease-in-out;
}

.work-steps-item:hover .work-step-no h3{
	color: var(--white-color);
}

.work-step-content{
	width: calc(100% - 125px);
}

.work-step-content h3{
	font-size: 20px;
	margin-bottom: 10px;
}

.work-step-content p{
	margin: 0;
}

/************************************/
/*** 	  13. Our Pricing css	  ***/
/************************************/

.our-pricing{
	background-image: url('../images/section-bg-shape-5.png');
	background-repeat: no-repeat;
	background-position: bottom -20px left -20px;
	background-size: auto;
	padding: 100px 0;
}

.our-pricing-content{
	position: sticky;
	top: 50px;
	margin-right: 20px;
}

.our-pricing-btn .btn-default{
	background: var(--white-color);
}

.pricing-item{
	background: var(--white-color);
	border-radius: 20px;
	margin-bottom: 30px;
	padding: 40px;
}

.pricing-item:last-child{
	margin-bottom: 0;
}

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

.pricing-header h3{
	font-size: 20px;
}

.pricing-body{
	display: flex;
	flex-wrap: wrap;
	gap: 30px;
}

.pricing-content{
	width: calc(55% - 15px);
}

.pricing-list{
	width: calc(45% - 15px);
}

.pricing-price{
	margin-bottom: 40px;
}

.pricing-price h2{
	font-size: 34px;
	margin-bottom: 20px;
}

.pricing-price h2 sub{
	font-size: 20px;
	text-transform: capitalize;
	bottom: 0;
}

.pricing-price p{
	margin-bottom: 0;
}

.pricing-list ul{
	list-style: disc;
	margin: 0;
	padding: 0 0 0 20px;
}

.pricing-list ul li{
	margin-bottom: 20px;
	line-height: 1.5em;
}

.pricing-list ul li:last-child{
	margin-bottom: 0;
}

.pricing-list ul li::marker{
	color: var(--primary-color);
}

/************************************/
/*** 	   14. Our FAQs css 	  ***/
/************************************/

.our-faqs{
	background-image: url('../images/section-bg-shape-2.png');
    background-position: right -20px bottom 130px;
    background-repeat: no-repeat;
    background-size: auto;
	padding: 100px 0;
}

.faqs-content{
	position: sticky;
	top: 50px;
}

.faq-accordion{
	background: var(--secondary-color);
	border-radius: 20px;
	margin-left: 20px;
	padding: 40px;
}

.faq-accordion .accordion-item{
    border-bottom: 1px solid var(--divider-color);
    margin-bottom: 30px;
    padding-bottom: 30px;
}

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

.faq-accordion .accordion-header .accordion-button{
    font-size: 18px;
    font-weight: 500;
    line-height: 1.2em;
    color: #ffffff;
    padding-right: 25px;
    transition: all 0.3s ease-in-out;
}

.faq-accordion .accordion-button:not(.collapsed){
    padding-bottom: 20px;
}

.faq-accordion .accordion-item .accordion-button::after,
.faq-accordion .accordion-item .accordion-button.collapsed::after{
	content: '\2b';
	font-family: "FontAwesome";
	position: absolute;
	right: 0;
	top: 0;
	transform: rotate(45deg);
	font-size: 18px;
	font-weight: 400;
    line-height: normal;
    color: #ffffff;
	transition: all 0.4s ease-in-out;
}

.faq-accordion .accordion-item .accordion-button.collapsed::after{
	transform: rotate(0deg);
}

.faq-accordion .accordion-item .accordion-body{
    padding-right: 25px;
}

.faq-accordion .accordion-item:last-child .accordion-body{
    padding-bottom: 0;
}

.faq-accordion .accordion-item .accordion-body p{
    margin-bottom: 15px;
}

.faq-accordion .accordion-item .accordion-body p:last-child{
    margin-bottom: 0;
}

/************************************/
/***   15. Our Testimonials css	  ***/
/************************************/

.our-testimonials{
	padding: 100px 0;
}

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

.testimonial-item{
	display: flex;
	flex-wrap: wrap;
	border-radius: 20px;
	overflow: hidden;
}

.author-image{
	position: relative;
	width: 42%;
}

.author-image figure{
	display: block;
	height: 100%;
}

.author-image figure::before{
	content: '';
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	background: var(--primary-color);
	opacity: 40%;
	width: 100%;
	height: 100%;
	z-index: 1;
}

.author-image figure img{
	width: 100%;
	height: 100%;
	object-fit: cover;
	aspect-ratio: 1 / 1.28;
	transition: all 0.4s ease-in-out;
}

.testimonial-item:hover .author-image figure img{
	transform: scale(1.1);
}

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

.testimonial-content{
	width: 58%;
	background: var(--white-color);
	align-content: center;
	padding: 30px;
}

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

.testimonial-quote img{
	width: 100%;
	max-width: 32px;
}

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

.testimonial-info p{
	margin-bottom: 0;
}

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

.author-content p{
	margin-bottom: 0;
}

.testimonial-pagination{
	text-align: center;
	margin-top: 60px;
}

.testimonial-pagination .swiper-pagination-bullet{
	position: relative;
    height: 10px;
    width: 10px;
    background: var(--dark-divider-color);
	border-radius: 100px;
    margin: 0 3px;
    opacity: 1;
    transition: all 0.4s ease-in-out;
}

.testimonial-pagination .swiper-pagination-bullet-active{
    width: 30px;
    background-color: var(--white-color);
}

/************************************/
/*** 	 	16. Our Blog css	  ***/
/************************************/

.our-blog{
	position: relative;
	padding: 100px 0 70px;
	z-index: 1;
}

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

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

.post-featured-image a{
    cursor: none;
    display: block;
	border-radius: 20px;
    overflow: hidden;
}

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

.post-featured-image img{
	width: 100%;
    aspect-ratio: 1 / 0.71;
    object-fit: cover;
    transition: all 0.5s ease-in-out;
}

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

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

.post-item-content h2{
    font-size: 18px;
	line-height: 1.4em;
}

.post-item-content h2 a{
	display: inline-block;
    color: inherit;
}

/************************************/
/*** 	 	17. Footer css		  ***/
/************************************/

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

.about-footer{
	margin-right: 30px;
}

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

.footer-logo img{
	width: 100%;
	max-width: 130px;
}

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

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

.footer-newsletter-box h3{
	font-size: 20px;
	color: var(--white-color);
	margin-bottom: 20px;
}

.footer-newsletter-form .form-group{
	position: relative;
    display: flex;
	align-items: center;
	margin-bottom: 20px;
}

.footer-newsletter-form .form-group:last-child{
	margin-bottom: 0;
}

.footer-newsletter-form .form-group .form-control{
	width: 100%;
	font-size: 14px;
	font-weight: 400;
	line-height: 1.2em;
	color: var(--white-color);
	background: transparent;
	border: none;
	border-bottom: 1px solid var(--dark-divider-color);
	border-radius: 0;
	outline: none;
	box-shadow: none;
	padding: 8px 40px 18px 0;
}

.footer-newsletter-form .form-group .form-control::placeholder{
	color: var(--white-color);
}

.footer-newsletter-form .form-group .newsletter-btn{
	position: absolute;
    top: 0;
    right: 0;
	width: 30px;
	height: 30px;
    background: var(--accent-color);
	border: none;
	border-radius: 4px;
    padding: 0;
	transition: all 0.3s ease-in-out;
}

.footer-newsletter-form .form-group .newsletter-btn:hover{
	background: var(--white-color);
}

.footer-newsletter-form .form-group .newsletter-btn img{
	width: 18px;
	transition: all 0.3s ease-in-out;
}

.footer-newsletter-form .form-group .newsletter-btn:hover img{
    transform: rotate(45deg);
}

.footer-newsletter-form .form-group input[type="checkbox" i]{
	width: 20px;
	height: 20px;
	box-shadow: none;
	margin-right: 10px;
}

.footer-newsletter-form .form-group .form-label{
	font-size: 14px;
	color: var(--white-color);
	margin: 0;
}

.footer-newsletter-form .form-group .form-label a{
	color: inherit;
	font-weight: 600;
	text-decoration: underline;
	transition: all 0.3s ease-in-out;
}

.footer-newsletter-form .form-group .form-label a:hover{
	color: var(--accent-color);
}

.footer-links-box{
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	gap: 20px;
	margin: 0 1.563vw;
}

.footer-links h3{
    font-size: 20px;
    color: var(--white-color);
    text-transform: capitalize;
    margin-bottom: 20px;
}

.footer-links ul{
    list-style: disc;
    margin: 0;
    padding-left: 20px;
}

.footer-links ul li{
    color: var(--white-color);
	line-height: 1.5em;
	text-transform: capitalize;
	margin-bottom: 15px;
}

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

.footer-links ul li::marker{
    color: var(--accent-color);
	transition: all 0.3s ease-in-out;
}

.footer-links ul li:hover::marker{
	color: var(--white-color);
}

.footer-links ul li a{
	color: inherit;
	transition: all 0.3s ease-in-out;
}

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

.footer-working-hour-box ul{
	list-style: none;
	padding: 0;
}

.footer-working-hour-box ul li{
	display: flex;
	justify-content: space-between;
	gap: 10px;
}

.footer-copyright-text{
	text-align: center;
	border-top: 1px solid var(--dark-divider-color);
	margin-top: 60px;
	padding: 40px 0 60px;
}

.footer-copyright-text p{
	color: var(--white-color);
	margin-bottom: 0;
}

/************************************/
/*** 	 18. About Us Page css	  ***/
/************************************/

.page-header{
    position: relative;
    background: url('../images/page-header-bg.jpg') no-repeat;
    background-position: center center;
    background-size: cover;
	padding: 225px 0 115px;
    overflow: hidden;
}

.page-header::before{
   content: '';
    position: absolute;
    top: 0;
    right: 0;
	bottom: 0;
	left: 0;
    background: linear-gradient(270deg, rgba(23, 44, 69, 0.80) 0%, rgba(23, 44, 69, 0.80) 60.83%);
	height: 100%;
	width: 100%;
}

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

.page-header-box h1{
	display: inline-block;
	font-size: 60px;
	font-weight: 400;
	color: var(--white-color);
	cursor: none;
    margin-bottom: 10px;
}

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

.page-header-box ol li.breadcrumb-item{
	font-size: 16px;
	font-weight: 500;
	line-height: 1.5em;
	text-transform: capitalize;
	color: var(--white-color);
}

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

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

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

.our-approach{
	padding: 100px 0;
}

.approach-image{
	height: 100%;
	margin-right: 15px;
}

.approach-image figure{
	display: block;
	height: 100%;
	border-radius: 20px;
}

.approach-image img{
	width: 100%;
	height: 100%;
	aspect-ratio: 1 / 1.061;	
	object-fit: cover;
	border-radius: 20px;
}

.approach-content{
	background-color: var(--white-color);
	border-radius: 20px;
	padding: 40px;
}

.mission-vision-list{
	display: flex;
	flex-wrap: wrap;
	gap: 30px;
	margin-bottom: 40px;
}

.mission-vision-item{
	width: calc(50% - 15px);
}

.mission-vision-item .icon-box{
	position: relative;
	width: 50px;
	height: 50px;
	background-color: var(--accent-color);
	border-radius: 50%;
	display: flex;
	align-items: center;
	justify-content: center;
	margin-bottom: 40px;
}

.mission-vision-item .icon-box:before{
	content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: var(--primary-color);
    border-radius: 50%;
    width: 100%;
    height: 100%;
    transform: scale(0);
    transition: all 0.4s ease-in-out;
}

.mission-vision-item:hover .icon-box:before{
	transform: scale(1);
}

.mission-vision-item .icon-box img{
	position: relative;
	width: 100%;
	max-width: 24px;
	transition: all 0.4s ease-in-out;
	z-index: 1;
}

.mission-vision-item:hover .icon-box img{
	filter: brightness(0) invert(1);
}

.mission-vision-content h3{
	font-size: 20px;
	text-transform: capitalize;
	margin-bottom: 15px;
}

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

.our-core-value{
	background-image: url('../images/section-bg-shape-6.png');
    background-repeat: no-repeat;
    background-position: right -20px top 100px;
    background-size: auto;
	padding: 100px 0;
}

.value-image-box-1{
	padding-right: 80px;
}

.value-image-box-1 figure{
	display: block;
	border-radius: 20px;
}

.value-image-box-1 img{
	width: 100%;
	aspect-ratio: 1/0.528;
	object-fit: cover;
	border-radius: 20px;
}

.value-image-box-2{
	display: flex;
	align-items: end;
}

.about-experience-box{
	width: 220px;
	background-color: var(--primary-color);
	border-radius: 20px;
	padding: 30px;
	margin: 20px 20px 0 0;
}

.about-experience-box .icon-box{
	position: relative;
	width: 60px;
	height: 60px;
	background-color: var(--accent-color);
	border-radius: 50%;
	display: flex;
	align-items: center;
	justify-content: center;
	margin-bottom: 20px;
}

.about-experience-box .icon-box:before{
	content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: var(--white-color);
    border-radius: 50%;
    width: 100%;
    height: 100%;
    transform: scale(0);
    transition: all 0.4s ease-in-out;
}

.about-experience-box:hover .icon-box:before{
	transform: scale(1);
}

.about-experience-box .icon-box img{
	position: relative;
	width: 100%;
	max-width: 30px;
	z-index: 1;
}

.experience-box-content h2{
	color: var(--white-color);
	font-size: 46px;
	margin-bottom: 5px;
}

.experience-box-content p{
	color: var(--white-color);
	font-weight: 500;
	text-transform: capitalize;
	margin: 0;
}

.value-img-2{
	width: calc(100% - 240px);
	margin-top: -120px;
}

.value-img-2 figure{
	border: 10px solid var(--white-color);
	border-radius: 20px;
}

.value-img-2 img{
    width: 100%;
	aspect-ratio: 1 / 0.905;
    object-fit: cover;
}

.core-value-content{
	margin-left: 15px;
}

.our-experiment-item{
	border-bottom: 1px solid var(--divider-color);
	margin-bottom: 40px;
	padding-bottom: 40px;
}

.our-experiment-item:last-child{
	margin-bottom: 0px;
	padding-bottom: 0px;
	border-bottom: none;
}

.our-experiment-item h3{
	position: relative;
	font-size: 20px;
	text-transform: capitalize;
	padding-left: 30px;
	margin-bottom: 15px;
}

.our-experiment-item h3:before{
	content: '\f058';
    font-family: 'Font Awesome 6 Free';
    position: absolute;
    font-weight: 900;
    font-size: 18px;
    color: var(--primary-color);
    top: 0;
    left: 0;
}

.our-experiment-item p{
	margin: 0;
}

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

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

.team-image{
	position: relative;
	margin-bottom: 20px;
}

.team-image a,
.team-image figure{
	display: block;
	cursor: none;
	border-radius: 20px;
	overflow: hidden;
}

.team-image img{
    width: 100%;
	aspect-ratio: 1 / 1.356;
    object-fit: cover;
	transition: all 0.4s ease-in-out;
}

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

.team-social-icon{
	position: absolute;
	right: 40px;
	bottom: 0;
	left: 40px;
	opacity: 0;
	visibility: hidden;
	transition: all 0.4s ease-in-out;
	z-index: 1;
}

.team-item:hover .team-social-icon{
	bottom: 40px;
	opacity: 1;
	visibility: visible;
}

.team-social-icon ul{
	list-style: none;
	margin: 0;
	padding: 0;
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: center;
	gap: 15px;
}

.team-social-icon ul li a{
	width: 36px;
	height: 36px;
	background: var(--primary-color);
	color: var(--white-color);
	border-radius: 50%;
	display: flex;
	align-items: center;
	justify-content: center;
	cursor: pointer;
	transition: all 0.4s ease-in-out;
}

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

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

.team-content{
	text-align: center;
}

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

.team-content h3 a{
	color: inherit;
}

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

/************************************/
/*** 	 19. Services Page css	  ***/
/************************************/

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

/************************************/
/*** 	 20. Service Single css	  ***/
/************************************/

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

.page-single-sidebar{
	position: sticky;
	top: 30px;
	margin-right: 15px;
}

.page-category-list{
	border-radius: 20px;
    margin-bottom: 60px;
	overflow: hidden;
}

.page-category-list h3{
    font-size: 20px;
    color: var(--white-color);
    text-transform: capitalize;
	background: var(--primary-color);
    padding: 25px 40px;
}

.page-category-list ul{
	background: var(--white-color);
    list-style: none;
    margin: 0;
    padding: 30px 40px;
}

.page-category-list ul li{
	line-height: 1.5em;
	font-weight: 500;
    border-bottom: 1px solid var(--divider-color);
    padding-bottom: 20px;
    margin-bottom: 20px;
}

.page-category-list ul li:last-child{
    margin: 0;
    padding: 0;
    border-bottom: none;
}

.page-category-list ul li a{
    position: relative;
    display: block;
    text-transform: capitalize;
    color: var(--text-color);
    padding-right: 25px;
    transition: all 0.4s ease-in-out;
}

.page-category-list ul li:hover a{
    color: var(--primary-color);
}

.page-category-list ul li a::before{
	content: '';
    position: absolute;
    top: 2px;
    right: 0;
	background: url('../images/arrow-primary.svg') no-repeat;
	background-size: cover;
	background-position: right center;
    width: 20px;
    height: 20px;
	transition: all 0.4s ease-in-out;
}

.page-category-list ul li a:hover::before{
	transform: rotate(45deg);
}

.sidebar-cta-box{
	position: relative;
	background: url('../images/sidebar-cta-bg.jpg') no-repeat;
	background-position: center center;
	background-size: cover;
	border-radius: 20px;    
	padding: 40px;
    overflow: hidden;
}

.sidebar-cta-box:before{
	content: '';
	position: absolute;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
    background: var(--primary-color);
	opacity: 60%;
	width: 100%;
	height: 100%;
	z-index: 0;
}

.sidebar-cta-logo,
.sidebar-cta-content{
	position: relative;
	z-index: 1;
}

.sidebar-cta-logo{
	margin-bottom: 70px;
}

.sidebar-cta-logo img{
	width: 100%;
	max-width: 130px;
}

.sidebar-cta-content P{
	color: var(--white-color);
	margin-bottom: 20px;
}

.page-single-image{
    margin-bottom: 40px;
}

.page-single-image figure{
    display: block;
    border-radius: 20px;
}

.page-single-image img{
    width: 100%;
    aspect-ratio: 1 / 0.581;
    object-fit: cover;
    border-radius: 20px;
}

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

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

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

.service-entry h2{
	font-size: 46px;
    font-weight: 400;
    letter-spacing: -0.02em;
	margin-bottom: 20px;
}

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

.service-entry ul li{
	position: relative;
	line-height: 1.5em;
	padding-left: 30px;
	margin-bottom: 15px;
}

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

.service-entry ul li::before{
	content: '\f058';
	font-family: 'Font Awesome 6 Free';
	position: absolute;
	top: 0;
	left: 0;
	font-size: 18px;
	font-weight: 900;
	color: var(--primary-color);
}

.service-discover-box,
.service-result-box,
.service-partnership-box{
	margin-top: 60px;
}

.service-discover-list{
	margin-top: 40px;
}

.service-discover-list ul{
	display: flex;
	flex-wrap: wrap;
	gap: 30px;
}

.service-discover-list ul li{
	width: calc(50% - 15px);
	background: var(--white-color);
	border: 1px solid var(--divider-color);
	border-radius: 20px;
	padding: 20px 15px 20px 45px;
	margin: 0;
}

.service-discover-list ul li::before{
	top: 20px;
	left: 20px;
}

.service-discover-image-content{
	display: flex;
	flex-wrap: wrap;
	gap: 30px;
	margin-top: 40px;
}

.service-discover-image,
.service-discover-content{
	width: calc(50% - 15px);
}

.service-discover-image figure{
	display: block;
	border-radius: 20px;
}

.service-discover-image img{
	width: 100%;
	aspect-ratio: 1 / 0.68;
	object-fit: cover;
	border-radius: 20px;
}

.service-result-box ul{
	margin-top: 40px;
}

.service-result-list{
	background: var(--secondary-color);
	border-radius: 20px;
	margin-top: 40px;
	padding: 40px;
}

.service-result-item{
	display: flex;
	border-bottom: 1px solid var(--divider-color);
	margin-bottom: 40px;
	padding-bottom: 40px;
}	

.service-result-item:last-child{
	border-bottom: none;
	margin-bottom: 0;
	padding-bottom: 0;
}

.service-result-item .icon-box{
	position: relative;
	width: 60px;
	height: 60px;
	background: var(--primary-color);
	border-radius: 50%;
	display: flex;
	justify-content: center;
	align-items: center;
	margin-right: 20px;
	overflow: hidden;
	transition: all 0.4s ease-in-out;
}

.service-result-item:hover .icon-box{
	background: var(--white-color);
}

.service-result-item .icon-box img{
	width: 100%;
	max-width: 30px;
	transition: all 0.4s ease-in-out;
}

.service-result-item:hover .icon-box img{
	filter: brightness(0) invert(0);
}

.service-result-content{
	width: calc(100% - 80px);
}

.service-result-content h3{
	font-size: 20px;
	margin-bottom: 10px;
}

.service-result-content p{
	margin-bottom: 0;
}

.service-partnership-content{
	margin-top: 40px;
}

.service-partnership-content .our-experiment-item{
	margin-bottom: 30px;
	padding: 0;
	border: none;
}

.service-partnership-image{
	margin-top: 40px;
}

.service-partnership-image figure{
	display: block;
	border-radius: 20px;
}

.service-partnership-image img{
	width: 100%;
	aspect-ratio: 1 / 0.395;
	object-fit: cover;
	border-radius: 20px;
}

.page-single-faqs .faq-accordion{
	margin: 0;
}

/************************************/
/*** 	 21. Blog Archive css	  ***/
/************************************/

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

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

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

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

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

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

/************************************/
/*** 	  22. Blog Single css	  ***/
/************************************/

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

.post-single-meta{
	margin-top: 5px;
}

.post-single-meta ol li{
	font-size: 18px;
	color: var(--white-color);
	margin-right: 15px;
}

.post-single-meta ol li:last-child{
	margin-right: 0;
}

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

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

.post-image figure{
	display: block;	
	border-radius: 20px;
	overflow: hidden;
}

.post-image img{
	width: 100%;
	aspect-ratio: 1 / 0.50;
	object-fit: cover;
	border-radius: 20px;
}

.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{
	font-weight: 600;
	line-height: 1.2em;
	margin: 0 0 0.435em;
}

.post-entry h1{
	font-size: 60px;
    font-weight: 400;
    letter-spacing: -0.02em;
}

.post-entry h2{
	font-size: 46px;
    font-weight: 400;
    letter-spacing: -0.02em;
}

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

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

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

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

.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: 600;
}

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

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

.post-entry ol li,
.post-entry ul li{
    position: relative;
	font-size: 16px;
    font-weight: 500;
    line-height: 1.6em;
    color: var(--text-color);
    margin-bottom: 15px;
}

.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: url('../images/icon-blockquote.svg'), var(--secondary-color);
	background-repeat: no-repeat;
	background-position: 30px 30px;
    background-size: 45px;
	border-radius: 20px;
    padding: 30px 30px 30px 90px;
    margin-bottom: 30px;
}

.post-entry blockquote p{
	font-size: 20px;
	font-weight: 700;
	line-height: 1.4em;
	color: var(--primary-color);
}

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

.tag-links{
	font-family: var(--accent-font);
    font-size: 20px;
	font-weight: 500;
    text-transform: capitalize;
	color: var(--primary-color);
	display: inline-flex;
	align-items: center;
	flex-wrap: wrap;
	gap: 15px;
}

.post-tags .tag-links a{
    display: inline-block;
	font-family: var(--default-font);
    font-size: 16px;
    font-weight: 700;
    text-transform: capitalize;
    line-height: 1em;
	background: var(--accent-color);
    color: var(--primary-color);
	border-radius: 10px;
    padding: 12px 20px;
	transition: all 0.3s ease-in-out;
}

.post-tags .tag-links a:hover{
	background: var(--primary-color);
	color: var(--accent-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;
    text-align: center;
	background: var(--accent-color);
    color: var(--primary-color);
	border-radius: 10px;
    width: 40px;
    height: 40px;
    transition: all 0.3s ease-in-out;
}

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

.post-social-sharing ul li a i{
    font-size: 18px;
    color: inherit;
}

/************************************/
/*** 	23. Case Study Page css	  ***/
/************************************/

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

/************************************/
/***   24. Case Study Single css  ***/
/************************************/

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

.case-study-category-list ul li{
	display: flex;
	width: 100%;
	justify-content: space-between;
	color: var(--primary-color);
	font-weight: 500;
}

.case-study-category-list ul li span{
	width: 68%;
	color: var(--text-color);
	font-weight: 400;
}

.case-study-entry{
    margin-bottom: 60px;
}

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

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

.case-study-entry h2{
	font-size: 46px;
    font-weight: 400;
    letter-spacing: -0.02em;
	margin-bottom: 20px;
}

.case-study-entry ul{
    list-style: none;
    margin: 0;
    padding: 0;
}

.case-study-entry ul li{
	position: relative;
	line-height: 1.5em;
	padding-left: 30px;
	margin-bottom: 15px;
}

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

.case-study-entry ul li::before{
	content: '\f058';
	font-family: 'Font Awesome 6 Free';
	position: absolute;
	top: 0;
	left: 0;
	font-size: 18px;
	font-weight: 900;
	color: var(--primary-color);
}

.empowering-agriculture-box,
.field-trials-box,
.shaping-future-box{
	margin-top: 60px;
}

.empowering-box-list{
	margin-top: 40px;
}

.empowering-box{
	background: var(--secondary-color);
	border-radius: 20px;
	margin-bottom: 40px;
	padding: 40px;
}

.empowering-box:last-child{
	margin-bottom: 0;
}

.empowering-item{
	display: flex;
	margin-bottom: 40px;
}

.empowering-item .icon-box{
	margin-right: 20px;
}

.empowering-item .icon-box img{
	width: 100%;
	max-width: 60px;
}

.empowering-item-content{
	width: calc(100% - 80px);
}

.empowering-item-content h3{
	font-size: 20px;
	margin-bottom: 10px;
}

.field-trials-step-list{
	display: flex;
	flex-wrap: wrap;
	gap: 40px 30px;
	margin-top: 40px;
}

.field-trials-step-item{
	width: calc(50% - 15px);
	display: flex;
}

.field-trials-step-no{
	position: relative;
	width: 60px;
	height: 60px;
	display: flex;
	justify-content: center;
	align-items: center;
	background: var(--secondary-color);
	border-radius: 50%;
	margin-right: 20px;
}

.field-trials-step-no::before{
	content: '';
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	width: 100%;
	height: 100%;
	background-color: var(--primary-color);
	border-radius: 50%;
	transform: scale(0);
	transition: all 0.4s ease-in-out;
	z-index: 0;
}

.field-trials-step-item:hover .field-trials-step-no::before{
	transform: scale(1);
}

.field-trials-step-no h3{
	position: relative;
	font-size: 24px;
	transition: all 0.3s ease-in-out;
	z-index: 1;
}

.field-trials-step-item:hover .field-trials-step-no h3{
	color: var(--white-color);
}

.field-trials-content{
	width: calc(100% - 80px);
}

.field-trials-content h3{
	font-size: 20px;
	border-bottom: 1px solid var(--divider-color);
	margin-bottom: 20px;
	padding-bottom: 20px;
}

.shaping-future-image-content{
	background: var(--white-color);
	border: 1px solid var(--divider-color);
	border-radius: 20px;
	display: flex;
	flex-wrap: wrap;
	gap: 30px;
	padding: 40px;
	margin-top: 40px;
}

.shaping-future-content,
.shaping-future-image{
	width: calc(50% - 15px);
}

.shaping-future-item{
	display: flex;
	margin-top: 30px;
}

.shaping-future-item h3{
	width: calc(48% - 15px);
	font-size: 20px;
	border-right: 1px solid var(--divider-color);
	margin-right: 15px;
	padding-right: 15px;
}

.shaping-future-item p{
	width: 52%;
}

.shaping-future-image figure{
	display: block;
	border-radius: 20px;
}

.shaping-future-image img{
	width: 100%;
	aspect-ratio: 1 / 0.795;
	object-fit: cover;
	border-radius: 20px;
}

/************************************/
/*** 	   25. Team Page css	  ***/
/************************************/

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

/************************************/
/*** 	 26. Team Single css	  ***/
/************************************/

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

.team-about-box,
.team-member-skill-box{
	margin-bottom: 60px;
}

.team-about-box{
	display: flex;
	flex-wrap: wrap;
	gap: 30px 60px;
}

.team-single-image,
.team-about-content{
	width: calc(50% - 30px);
}

.team-single-image figure{
	display: block;
	height: 100%;
	border-radius: 20px;
}

.team-single-image img{
	width: 100%;
	height: 100%;
	aspect-ratio: 1 / 0.98;
	object-fit: cover;
	border-radius: 20px;
}

.team-about-content{
	background: var(--white-color);
	border: 1px solid var(--divider-color);
	border-radius: 20px;
	padding: 40px;
}

.member-social-list{
	margin-bottom: 40px;
}

.member-social-list ul{
	list-style: none;
	margin: 0;
	padding: 0;
	display: flex;
	flex-wrap: wrap;
	gap: 10px 15px;
}

.member-social-list ul li a{
	width: 40px;
	height: 40px;
	color: var(--primary-color);
	border: 1px solid var(--primary-color);
	border-radius: 50%;
	display: flex;
	align-items: center;
	justify-content: center;
	transition: all 0.4s ease-in-out;
}

.member-social-list ul li a:hover{
	background: var(--primary-color);
	color: var(--accent-color);
}

.member-social-list ul li a i{
	color: inherit;
	font-size: 20px;
}

.team-contact-item{
	display: flex;
	margin-bottom: 30px;
}

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

.team-contact-item .icon-box{
	position: relative;
	height: 60px;
	width: 60px;
	background-color: var(--accent-color);
	border-radius: 50%;
	display: flex;
	align-items: center;
	justify-content: center;
	margin-right: 25px;
}

.team-contact-item .icon-box::before{
	content: '';
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	background-color: var(--primary-color);
	border-radius: 50%;
	width: 100%;
	height: 100%;
	transform: scale(0);
	transition: all 0.4s ease-in-out;
}

.team-contact-item:hover .icon-box::before{
	transform: scale(1);
}

.team-contact-item .icon-box img{
	position: relative;
	width: 100%;
	max-width: 30px;
	transition: all 0.4s ease-in-out;
	z-index: 1;
}

.team-contact-item:hover .icon-box img{
	filter: brightness(0) invert(1);
}

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

.team-contact-content p{
	text-transform: capitalize;
	margin-bottom: 5px;
}

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

.team-member-skill-box,
.team-member-contact-box{
	background: var(--white-color);
	border: 1px solid var(--divider-color);
	display: flex;
	flex-wrap: wrap;
	gap: 30px 140px;
	border-radius: 20px;
	padding: 40px;
}

.team-skill-content{
	width: calc(45% - 70px);
}

.team-skill-content .section-title{
	margin-bottom: 0;
}

.team-skill-list{
	width: calc(55% - 70px);
}

.skills-progress-bar{
	margin-bottom: 30px;
}

.skills-progress-bar:last-child{
	margin-bottom: 0px;
}

.skills-progress-bar .skill-data{
	display: flex;
    justify-content: space-between;
    margin-bottom: 20px;
}

.skills-progress-bar .skill-data .skill-title,
.skills-progress-bar .skill-data .skill-no{
	line-height: normal;
	font-weight: 500;
	text-transform: capitalize;
}

.skills-progress-bar .skillbar .skill-progress{
	position: relative;
	width: 100%;
	height: 16px;
	background: var(--secondary-color);
	border-radius: 100px;
    overflow: hidden;
}

.skills-progress-bar .skillbar .skill-progress .count-bar{
	position: absolute;
	top: 0;
	left: 0;
	bottom: 0;
	background: var(--primary-color);
	border-radius: 100px;
}

.team-member-contact-box{
	gap: 30px;
}

.team-member-contact-info{
	width: calc(42% - 15px);
}

.team-member-contact-info .section-title{
	position: sticky;
	margin-bottom: 0;
	top: 50px;
}

.team-member-contact-box .contact-us-form{
	width: calc(58% - 15px);
	border-radius: 20px;
}

/************************************/
/*** 	 27. Pricing Page css	  ***/
/************************************/

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

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

.page-pricing .pricing-item .pricing-content,
.page-pricing .pricing-item .pricing-list{
	width: 100%;
}

/************************************/
/***   28. Testimonials Page css  ***/
/************************************/

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

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

/************************************/
/*** 	 29. Image Gallery css	  ***/
/************************************/

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

.page-gallery-box .photo-gallery{
	height: calc(100% - 30px);
	margin-bottom: 30px;
}

.page-gallery-box .photo-gallery a{
	cursor: none;
}

.page-gallery-box .photo-gallery figure{
	display: block;
	border-radius: 20px;
}

.page-gallery-box .photo-gallery img{
	width: 100%;
	aspect-ratio: 1 / 0.829;
	object-fit: cover;
	border-radius: 20px;
}

/************************************/
/*** 	 30. Video Gallery css	  ***/
/************************************/

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

.video-gallery-image{
	height: calc(100% - 30px);
	margin-bottom: 30px;
	overflow: hidden;
}

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

.video-gallery-image a::before{
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: var(--primary-color);
	border-radius: 20px;
    opacity: 0%;
    visibility: hidden;
    width: 100%;
    height: 100%;
    z-index: 1;
    transform: scale(0);
    transition: all 0.4s ease-in-out;
}

.video-gallery-image:hover a::before{
    opacity: 40%;
    visibility: visible;
    transform: scale(1);
}

.video-gallery-image a::after{
    content: '\f04b';
	font-family: 'FontAwesome';
    position: absolute;
    top: 50%;
    left: 50%;
    right: 0;
    transform: translate(-50%, -50%);
	font-size: 20px;
	background: var(--accent-color);
	color: var(--primary-color);
    border-radius: 50%;
    height: 60px;
    width: 60px;
	display: flex;
	align-items: center;
	justify-content: center;
    opacity: 0;
    visibility: hidden;
    transition: all 0.5s ease-in-out;
    z-index: 1;
}

.video-gallery-image:hover a::after{
    opacity: 1;
    visibility: visible;
}

.video-gallery-image img{
	width: 100%;
	aspect-ratio: 1 / 0.829;
	object-fit: cover;
	border-radius: 20px;
}

/************************************/
/*** 	  31. FAQs Page css 	  ***/
/************************************/

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

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

.page-faqs .page-faq-accordion:last-child{
    margin-bottom: 0px;
}

/************************************/
/***    32. Contact Us Page css	  ***/
/************************************/

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

.contact-us-box{
	display: flex;
	flex-wrap: wrap;
	gap: 30px;
	background-color: var(--secondary-color);
	border-radius: 20px;
	padding: 40px;
}

.contact-us-content{
	width: calc(50% - 15px);
	background-color: var(--white-color);
	border-radius: 20px;
	padding: 40px;
}

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

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

.contact-info-item .icon-box{
	position: relative;
	height: 60px;
	width: 60px;
	background-color: var(--accent-color);
	border-radius: 50%;
	display: flex;
	align-items: center;
	justify-content: center;
	margin-right: 25px;
}

.contact-info-item .icon-box::before{
	content: '';
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	background-color: var(--primary-color);
	border-radius: 50%;
	width: 100%;
	height: 100%;
	transform: scale(0);
	transition: all 0.4s ease-in-out;
}

.contact-info-item:hover .icon-box::before{
	transform: scale(1);
}

.contact-info-item .icon-box img{
	position: relative;
	width: 100%;
	max-width: 30px;
	transition: all 0.4s ease-in-out;
	z-index: 1;
}

.contact-info-item:hover .icon-box img{
	filter: brightness(0) invert(1);
}

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

.contact-item-content p{
	text-transform: capitalize;
	margin-bottom: 5px;
}

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

.contact-item-content h3 a{
	color: inherit;
	transition: all 0.3s ease-in-out;
}

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

.contact-us-image{
	position: relative;
	width: calc(50% - 15px);
}

.contact-us-img{
	height: 100%;
}

.contact-us-img figure{
	height: 100%;
	display: block;
	border-radius: 20px;
}

.contact-us-img img{
	width: 100%;
	height: 100%;
	aspect-ratio: 1 / 1.24;
	object-fit: cover;
	border-radius: 20px;
}

.working-hours-box{
	position: absolute;
	bottom: 30px;
	left: 30px;
	background-color: var(--dark-divider-color);
	border: 1px solid var(--dark-divider-color);
	border-radius: 20px;
	padding: 30px;
	backdrop-filter: blur(7px);
    -webkit-backdrop-filter: blur(7px);
	z-index: 1;
}

.working-hours-header{
	margin-bottom: 30px;
}

.working-hours-header h3{
	color: var(--white-color);
	font-size: 20px;
	text-transform: capitalize;
}

.working-hours-body ul{
	list-style: none;
	margin: 0;
	padding: 0;
}

.working-hours-body ul li{
	font-size: 16px;
	color: var(--white-color);
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 10px 70px;
	margin-bottom: 20px;
}

.working-hours-body ul li:last-child{
	margin-bottom: 0;
}

.contact-form-map{
	padding: 50px 0 100px;
}

.contact-form-box{
	display: flex;
	flex-wrap: wrap;
	border-radius: 20px;
	overflow: hidden;
}

.contact-form-box .contact-us-form,
.google-map{
	width: 50%;
}

.contact-us-form{
	background-color: var(--primary-color);
	padding: 40px;
}

.contact-us-form .section-title h2,
.contact-us-form .section-title p{
	color: var(--white-color);
}

.contact-form form .form-control{
    font-size: 16px;
    font-weight: 400;
    line-height: 1.5em;
    color: var(--text-color);
    background-color: var(--white-color);
    border: none;
    border-radius: 20px;
    padding: 18px 20px;
    outline: none;
    box-shadow: none;
}

.contact-form form .form-control::placeholder{
    color: var(--text-color);
}

.contact-form form .btn-default{
    width: 100%;
	padding: 17px;
}

.contact-form form .btn-default::before{
    display: none;
}

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

/************************************/
/*** 	 33. 404 Error Page css	  ***/
/************************************/

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

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

.error-page-image img{
	width: 100%;
	max-width: 50%;
}

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

.error-page-content .section-title{
	margin-bottom: 15px;
}

/************************************/
/***      34. Responsive css      ***/
/************************************/


@media only screen and (max-width: 1820px){
	
	.bg-section{
		max-width: calc(100% - 40px);
		margin: 0 20px;
	}

	.hero-content-box .section-title{
		margin-right: 0;
	}

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


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

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

@media only screen and (max-width: 991px){
	
	.btn-default{
		padding: 15px 40px 15px 15px;
	}
	
	.btn-default::before{
		right: 15px;
		width: 18px;
        height: 18px;
	}

	.btn-default.btn-border{
		padding: 14px 40px 14px 15px;
	}
	
	.navbar{
		padding: 20px 0;
	}
	
	.slicknav_nav li,
	.slicknav_nav ul{
        display: block;
    }

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

	.bg-section{
		max-width: 100%;
		border-radius: 0;
		margin: 0;
	}
	
	.section-row{
		margin-bottom: 40px;
	}

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

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

	.section-title h3{
		padding: 6px 14px 6px 26px;
	}

	.section-title h3::before{
		left: 14px;
	}

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

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

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

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

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

	.hero{
		padding: 170px 0 80px;
	}

	.hero.hero-slider-layout .hero-slide{
		padding: 170px 0 80px;
	}

	.hero-video-circle{
		display: none;
	}

	.hero-body{
		margin-top: 30px;
		padding-top: 30px;
	}

	.hero-experience-box h2{
		width: 65px;
		font-size: 36px;
	}

	.our-scrolling-ticker{
		padding: 20px 0;
	}

	.scrolling-ticker-box{
		--gap: 20px;
	}

	.scrolling-content span{
		font-size: 24px;
	}

	.scrolling-content span img{
		max-width: 26px;
		margin-right: 20px;
	}

	.about-us{
		background-size: 140px auto;
		background-position: right -10px bottom 50px;
		padding: 50px 0;
	}

	.about-us .section-row .section-title{
		margin-right: 0px;
	}

	.customer-rating-content{
		margin-right: 30px;
		padding-right: 30px;
	}

	.about-image-content-box-1{
		width: calc(50% - 15px);
	}

	.about-image-content-box-2{
		width: 100%;
	}

	.about-image-content-box-2 .about-image img{
		aspect-ratio: 1 / 0.5;
	}

	.about-image-content{
		bottom: 30px;
		left: 30px;
		right: 30px;
	}

	.about-counter-box{
		width: calc(50% - 15px);
		padding: 30px;
	}

	.about-counter-title h2{
		width: 85px;
		font-size: 36px;
	}

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

	.service-item{
		aspect-ratio: 1 / 1.03;
		padding: 30px;
	}

	.section-footer-text{
		margin-top: 10px;
	}

	.why-choose-us{
		background-size: 140px auto;
		background-position: left -40px bottom 50px;
		padding: 50px 0;
	}

	.why-choose-image-box{
		margin: 0 0 30px;
	}

	.why-choose-image figure img{
		aspect-ratio: 1 / 0.8;
	}

	.why-choose-image-box .satisfy-client-box{
		bottom: 20px;
		left: 20px;
		padding: 20px;
	}

	.what-we-do{
		background-size: 140px auto;
		background-position: right -20px bottom -10px;
		padding: 50px 0;
	}

	.what-we-contant{
		margin: 0 0 30px;
	}

	.what-we-counter-box{
		max-width: 300px;
		margin-top: 30px;
	}

	.what-we-counter-box h2{
		font-size: 60px;
		margin-bottom: 10px;
		padding-bottom: 10px;
	}

	.what-we-item{
		margin-bottom: 30px;
		padding-bottom: 30px;
	}

	.case-study{
		background-size: 140px auto;
		background-position: right -20px bottom 50px;
		padding: 50px 0 20px;
	}

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

	.case-study-image{
		margin-bottom: 15px;
	}

	.case-study-content h2{
		font-size: 18px;
	}

	.intro-video-box{
		height: 500px;
	}

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

	.video-play-border-button a:hover{
		font-size: 18px;
	}

	.how-it-work{
		background-size: 130px auto;
		background-position: left -20px bottom 0;
		padding: 50px 0;
	}

	.how-work-image-box{
		margin: 0 0 30px;
	}

	.how-work-image figure img{
		aspect-ratio: 1 / 0.8;
	}

	.how-work-image-box .satisfy-client-box{
		bottom: 30px;
		left: 30px;
		width: 290px;
		padding: 20px;
	}

	.how-work-image-box .satisfy-client-box .satisfy-client-content{
		margin-top: 30px;
	}

	.work-steps-item{
		margin-bottom: 30px;
		padding-bottom: 30px;
	}

	.our-pricing{
		background-size: 140px auto;
		background-position: left -10px bottom -10px;
		padding: 50px 0;
	}

	.our-pricing-content{
		position: initial;
		margin: 0 0 30px;
	}

	.pricing-item{
		padding: 30px;
	}

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

	.pricing-price{
		margin-bottom: 30px;
	}

	.pricing-price h2{
		font-size: 28px;
		margin-bottom: 15px;
	}

	.pricing-price h2 sub{
		font-size: 18px;
	}

	.pricing-list ul li{
		margin-bottom: 15px;
	}

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

	.faqs-content{
		position: initial;
		margin: 0 0 30px;
	}

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

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

	.faq-accordion .accordion-button:not(.collapsed){
		padding-bottom: 15px;
	}

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

	.author-image figure img{
		aspect-ratio: 1 / 0.99;
	}

	.testimonial-content{
		padding: 20px;
	}

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

	.testimonial-pagination{
		margin-top: 20px;
	}

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

	.post-featured-image{
		margin-bottom: 15px;
	}

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

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

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

	.about-footer-content{
		margin-bottom: 20px;
	}

	.footer-newsletter-form .form-group{
		margin-bottom: 15px;
	}
	
	.footer-links-box{
		margin: 0;
	}

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

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

	.footer-copyright-text{
		margin-top: 30px;
		padding: 30px 0;
	}

	.page-header{
		padding: 170px 0 80px;
	}

	.page-header-box h1{
		font-size: 45px;
		margin-bottom: 5px;
	}

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

	.approach-image{
		height: auto;
		margin-right: 0;
		margin-bottom: 30px;
	}

	.approach-image img{
		height: auto;
		aspect-ratio: 1 / 0.7;
	}

	.approach-content{
		padding: 30px;
	}

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

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

	.mission-vision-content h3{
		margin-bottom: 10px;
	}

	.our-core-value{
		background-size: 100px auto;
		background-position: right -10px top 50px;
		padding: 50px 0;
	}

	.core-value-image{
		max-width: 80%;
        margin: 0 auto;
		margin-bottom: 30px;
	}

	.about-experience-box{
		padding: 20px;
	}

	.experience-box-content h2{
		font-size: 36px;
	}

	.core-value-content{
		margin-left: 0px;
	}

	.our-experiment-item{
	    margin-bottom: 30px;
	    padding-bottom: 30px;
	}

	.our-experiment-item h3{
		padding-left: 25px;
		margin-bottom: 10px;
	}

	.our-experiment-item h3:before{
		font-size: 16px;
	}

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

	.team-image img{
		aspect-ratio: 1 / 1.1;
	}

	.team-social-icon{
    	right: 30px;
    	left: 30px;
	}

	.team-item:hover .team-social-icon{
    	bottom: 30px;
	}

	.team-image{
		margin-bottom: 15px;
	}

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

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

	.page-single-sidebar{
		position: initial;
		margin: 0 0 30px;
	}

	.page-category-list{
		margin-bottom: 30px;
	}

	.page-category-list h3,
	.page-category-list ul{
		padding: 15px 30px;
	}

	.page-category-list ul li{
		margin-bottom: 15px;
		padding-bottom: 15px;
	}

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

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

	.page-single-image{
		margin-bottom: 30px;
	}

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

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

	.service-entry h2{
		font-size: 36px;
		margin-bottom: 15px;
	}

	.service-entry ul li{
		padding-left: 25px;
		margin-bottom: 10px;
	}

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

	.service-discover-box,
	.service-result-box,
	.service-partnership-box{
		margin-top: 40px;
	}

	.service-discover-list{
		margin-top: 30px;
	}

	.service-discover-list ul{
		gap: 20px;
	}

	.service-discover-list ul li{
		width: calc(50% - 10px);
		font-size: 14px;
		border-radius: 12px;
		padding: 12px 12px 12px 35px;
		margin-bottom: 0;
	}

	.service-discover-list ul li::before{
		top: 14px;
		left: 12px;
	}

	.service-discover-image-content{
		gap: 20px;
		margin-top: 30px;
	}

	.service-discover-image,
	.service-discover-content{
		width: calc(50% - 10px);
	}

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

	.service-discover-content .why-choose-item:last-child{
		margin-bottom: 0;
		padding: 0;
	}

	.service-discover-content .why-choose-item .why-choose-item-content p{
		font-size: 14px;
	}

	.service-result-box ul{
		margin-top: 30px;
	}

	.service-result-list{
		margin-top: 30px;
		padding: 30px;
	}

	.service-result-item{
		margin-bottom: 30px;
		padding-bottom: 30px;
	}

	.service-partnership-content .our-experiment-item{
		margin-bottom: 20px;
	}

	.service-partnership-image{
		margin-top: 30px;
	}

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

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

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

	.page-single-post{
		padding: 50px 0;
    }
    
    .post-image{
        margin-bottom: 20px;
    }
    
    .post-entry h1,
    .post-entry h2,
    .post-entry h3,
    .post-entry h4,
    .post-entry h5,
    .post-entry h6{
        margin: 0 0 0.42em;
    }
    
    .post-entry h2{
        font-size: 36px;
    }
    
    .post-entry p{
        margin-bottom: 15px;
    }
    
    .post-entry ol li,
    .post-entry ul li{
        margin-bottom: 10px;
    }
    
    .post-entry blockquote{
        background-position: 20px 20px;
        background-size: 40px;
        padding: 20px 20px 20px 70px;
        margin-bottom: 20px;
    }
    
    .post-entry blockquote p{
        font-size: 18px;
    }
    
    .post-tags{
        margin-bottom: 20px;
    }

	.tag-links{
		gap: 10px;
	}
    
    .post-tags .tag-links a{
        padding: 10px 15px;
    }
    
    .post-social-sharing ul{
        text-align: left;
    }

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

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

	.case-study-entry{
		margin-bottom: 40px;
	}

	.case-study-entry p{
		margin-bottom: 15px;
	}

	.case-study-entry h2{
		font-size: 36px;
		margin-bottom: 15px;
	}

	.case-study-entry ul li{
		padding-left: 25px;
		margin-bottom: 10px;
	}

	.case-study-entry ul li::before{
		font-size: 16px;
	}

	.empowering-agriculture-box,
	.field-trials-box,
	.shaping-future-box{
		margin-top: 40px;
	}

	.empowering-box-list{
		margin-top: 30px;
	}

	.empowering-box{
		padding: 30px;
		margin-bottom: 30px;
	}

	.empowering-item{
		margin-bottom: 30px;
	}

	.empowering-item .icon-box{
		margin-right: 15px;
	}

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

	.empowering-item-content{
		width: calc(100% - 65px);
	}

	.field-trials-step-list{
		gap: 30px;
		margin-top: 30px;
	}

	.field-trials-step-no{
		height: 50px;
		width: 50px;
		margin-right: 15px;
	}

	.field-trials-step-no h3{
		font-size: 20px;
	}

	.field-trials-content{
		width: calc(100% - 65px);
	}

	.field-trials-content h3{
		font-size: 18px;
		margin-bottom: 10px;
		padding-bottom: 10px;
	}

	.shaping-future-image-content{
		margin-top: 30px;
		padding: 30px;
	}

	.shaping-future-item{
		margin-top: 20px;
	}

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

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

	.team-about-box,
	.team-member-skill-box{
		margin-bottom: 40px;
	}

	.team-single-image,
	.team-about-content{
		width: 100%;
	}

	.team-single-image img{
		height: auto;
		aspect-ratio: 1 / 0.85;
	}

	.team-about-content{
		padding: 30px;
	}

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

	.team-contact-item .icon-box{
		width: 50px;
		height: 50px;
		margin-right: 15px;
	}

	.team-contact-item .icon-box img{
		max-width: 24px;
	}

	.team-contact-content{
		width: calc(100% - 65px);
	}

	.team-member-skill-box,
	.team-member-contact-box{
		gap: 30px;
		padding: 30px;
	}

	.team-skill-content,
	.team-skill-list{
		width: 100%;
	}

	.skills-progress-bar{
		margin-bottom: 20px;
	}

	.skills-progress-bar .skill-data{
		margin-bottom: 15px;
	}

	.team-member-contact-info,
	.team-member-contact-box .contact-us-form{
		width: 100%;
	}

	.team-member-contact-info .section-title{
		position: initial;
	}

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

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

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

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

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

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

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

	.contact-us-box{
		padding: 30px;
	}

	.contact-us-content,
	.contact-us-image{
		width: 100%;
	}

	.contact-us-content{
		padding: 30px;
	}

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

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

	.contact-item-content{
		width: calc(100% - 75px);
	}

	.contact-us-img img{
		aspect-ratio: 1 / 0.9;
	}

	.working-hours-box{
		bottom: 20px;
		left: 20px;
		padding: 20px;
	}

	.working-hours-header{
		margin-bottom: 20px;
	}

	.contact-form-map{
		padding: 25px 0 50px;
	}

	.contact-form-box .contact-us-form,
	.google-map{
		width: 100%;
	}

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

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

	.contact-form form .btn-default{
		padding: 15px;
	}

	.google-map iframe{
		height: 450px;
	}

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

	.error-page-image img{
		max-width: 80%;
	}
}

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

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

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

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

	.hero-btn{
		gap: 15px;
	}

	.hero-experience-box{
		width: 100%;
	}

	.hero-experience-box h2{
        width: 50px;
        font-size: 26px;
    }

	.satisfy-client-box{
		gap: 10px;
	}

	.satisfy-client-image figure{
		width: 45px;
		height: 45px;
	}

	.our-scrolling-ticker{
		padding: 15px 0;
	}

	.scrolling-ticker-box{
        --gap: 15px;
    }

	.scrolling-content span{
        font-size: 20px;
    }

	.scrolling-content span img{
        max-width: 22px;
        margin-right: 15px;
    }

	.customer-rating-box{
		align-items: start;
		justify-content: space-between;
		gap: 10px;
	}

	.customer-rating-content{
		border-right: none;
        margin-right: 0px;
        padding-right: 0px;
    }

	.customer-rating-content h3{
		font-size: 18px;
		margin-bottom: 5px;
	}

	.customer-rating-content p{
		font-size: 14px;
	}

	.customer-rating-images{
		padding: 6px;
	}

	.about-us-boxes{
		gap: 20px;
	}

	.about-image-content-box-1{
        width: 100%;
    }

	.about-image-content{
        bottom: 20px;
        left: 20px;
        right: 20px;
    }

	.about-video-title h3{
		font-size: 18px;
	}

	.about-counter-box{
		width: 100%;
		padding: 20px;
	}

	.about-counter-title{
		margin-bottom: 20px;
		padding-bottom: 20px;
	}

	.about-counter-title h2{
        width: 65px;
        font-size: 26px;
    }

	.about-image-content-box-2 .about-image img{
        aspect-ratio: 1 / 0.741;
    }

	.about-image-content ul{
		gap: 10px;
	}

	.about-image-content ul li{
		font-size: 12px;
		padding: 5px 15px;
	}

	.service-content h3{
		font-size: 18px;
		margin-bottom: 6px;
	}

	.why-choose-image figure img{
        aspect-ratio: 1 / 1.1;
    }

	.why-choose-image-box .satisfy-client-box .satisfy-client-content{
		margin-top: 10px;
	}

	.why-choose-image-box .satisfy-client-box .satisfy-client-content h3{
		font-size: 16px;
	}

	.why-choose-item-box{
		width: 100%;
	}

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

	.why-choose-item-header .icon-box{
		width: 45px;
		height: 45px;
		margin-right: 10px;
	}

	.why-choose-item-title{
		width: calc(100% - 55px);
	}

	.why-choose-item-title h3{
		font-size: 16px;
	}

	.why-choose-item-content{
		width: calc(50% - 10px);
		padding-left: 10px;
		margin-left: 10px;
	}

	.why-choose-item-content p{
		font-size: 14px;
	}

	.why-choose-btn{
		margin-top: 30px;
	}

	.why-choose-body-image{
		width: 100%;
	}

	.why-choose-body-image img{
		aspect-ratio: 1 / 0.8;
	}

	.what-we-counter-box{
		max-width: 100%;
	}

	.what-we-counter-box h2{
		font-size: 40px;
	}

	.what-we-counter-box h3{
		font-size: 18px;
	}

	.what-we-item{
        margin-bottom: 20px;
        padding-bottom: 20px;
    }

	.what-we-item .icon-box{
		margin-right: 10px;
	}

	.what-we-content{
		width: calc(100% - 60px);
	}

	.what-we-content h3{
		font-size: 18px;
	}

	.what-we-content p{
		font-size: 14px;
	}

	.intro-video-box{
        height: 300px;
    }

	.how-work-image figure img{
        aspect-ratio: 1 / 1.1;
    }

	.how-work-image-box .satisfy-client-box{
        bottom: 20px;
        left: 20px;
        padding: 15px;
    }

	.how-work-image-box .satisfy-client-box .satisfy-client-content{
        margin-top: 20px;
    }

	.how-work-image-box .satisfy-client-box .satisfy-client-content h3{
		font-size: 18px;
	}

	.how-work-image-box .satisfy-client-box .satisfy-client-content p{
		font-size: 14px;
	}

	.work-steps-item{
		display: block;
        margin-bottom: 20px;
        padding-bottom: 20px;
    }

	.work-step-no{
		margin: 0 0 15px;
	}

	.work-step-content{
		width: 100%;
	}

	.work-step-content h3{
		font-size: 18px;
		margin-bottom: 5px;
	}

	.pricing-item{
		padding: 20px;
	}

	.pricing-header{
        margin-bottom: 15px;
        padding-bottom: 15px;
    }

	.pricing-header h3{
		font-size: 18px;
	}

	.pricing-body{
		gap: 20px;
	}

	.pricing-content,
	.pricing-list{
		width: 100%;
	}

	.pricing-price{
        margin-bottom: 20px;
    }

	.pricing-price h2{
		font-size: 22px;
		margin-bottom: 10px;
	}

	.pricing-price h2 sub{
		font-size: 14px;
	}

	.pricing-list ul li{
		margin-bottom: 10px;
	}

	.faq-accordion{
		padding: 20px;
	}

	.faq-accordion .accordion-button:not(.collapsed){
		padding-bottom: 10px;
	}

	.faq-accordion .accordion-item .accordion-body{
		padding: 0;
	}

	.faq-accordion .accordion-item .accordion-body p{
		font-size: 14px;
	}

	.author-image,
	.testimonial-content{
		width: 100%;
	}

	.author-image figure,
	.author-image figure img{
		height: auto;
	}

	.testimonial-quote{
        margin-bottom: 15px;
    }

	.testimonial-info{
		margin-bottom: 15px;
		padding-bottom: 15px;
	}

	.author-content h3{
		font-size: 18px;
		margin-bottom: 5px;
	}

	.about-footer{
        margin: 0 0 30px;
    }

	.footer-newsletter-box h3{
		font-size: 18px;
		margin-bottom: 15px;
	}

	.footer-links-box{
		gap: 0;
	}

	.footer-links{
		width: 100%;
		margin-bottom: 30px;
	}

	.footer-links h3{
		font-size: 18px;
	}

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

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

	.approach-image img{
        aspect-ratio: 1 / 0.9;
    }

	.approach-content{
		padding: 30px 20px;
	}

	.mission-vision-item{
		width: 100%;
	}

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

	.mission-vision-content h3{
		font-size: 18px;
        margin-bottom: 5px;
    }

	.core-value-image{
		max-width: 100%;
	}

	.value-image-box-1{
		padding-right: 0;
	}

	.value-image-box-2{
		margin-top: 10px;
		align-items: start;
	}

	.about-experience-box{
		width: 145px;
        padding: 12px;
		margin: 5px 10px 0 0;
    }

	.about-experience-box .icon-box{
		width: 50px;
		height: 50px;
		margin-bottom: 10px;
	}

	.about-experience-box .icon-box img{
		max-width: 26px;
	}

	.experience-box-content h2{
		font-size: 26px;
	}

	.experience-box-content p{
		font-size: 14px;
	}

	.value-img-2{
		width: calc(100% - 155px);
		margin-top: 0px;
	}

	.value-img-2 figure{
		border-width: 5px;
	}

	.our-experiment-item{
        margin-bottom: 20px;
        padding-bottom: 20px;
    }

	.our-experiment-item h3{
		font-size: 18px;
	}

	.team-content h3{
		font-size: 18px;
	}

	.page-category-list h3,
	.page-category-list ul,
	.sidebar-cta-box{
        padding: 20px;
    }

	.page-category-list h3{
		font-size: 18px;
	}

	.page-single-image{
        margin-bottom: 20px;
    }

	.service-entry h2{
		font-size: 26px;
	}

	.service-discover-list ul{
		gap: 10px;
	}

	.service-discover-list ul li{
		width: 100%;
		padding: 8px 12px 8px 35px;
	}
	
	.service-discover-list ul li::before{
		top: 10px;
	}

	.service-discover-image,
	.service-discover-content{
		width: 100%;
	}

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

	.service-result-item{
        margin-bottom: 20px;
        padding-bottom: 20px;
    }
	
	.service-result-item .icon-box{
		width: 50px;
		height: 50px;
		margin-right: 15px;
	}

	.service-result-item .icon-box img{
		max-width: 26px;
	}

	.service-result-content{
		width: calc(100% - 65px);
	}

	.service-result-content h3{
		font-size: 18px;
		margin-bottom: 5px;
	}

	.service-result-content p{
		font-size: 14px;
	}

	.service-partnership-image{
		margin-top: 20px;
	}

	.service-partnership-image img{
		aspect-ratio: 1 / 0.54;
	}

	.post-single-meta ol li{
        font-size: 16px;
    }
    
    .post-single-meta ol li i{
        font-size: 16px;
    }
    
    .post-image img{
        aspect-ratio: 1 / 0.7;
    }
    
    .post-entry blockquote{
        background-position: 15px 15px;
        padding: 60px 15px 15px 15px;
    }
    
    .post-entry blockquote p{
        font-size: 16px;
    }
    
    .post-entry h2{
        font-size: 26px;
    }

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

	.case-study-entry h2{
		font-size: 26px;
	}

	.empowering-box{
		padding: 20px;
	}

	.empowering-item{
        margin-bottom: 20px;
    }

	.empowering-item-content h3{
		font-size: 18px;
		margin-bottom: 5px;
	}

	.field-trials-step-item{
		width: 100%;
	}

	.shaping-future-image-content{
		padding: 20px;
	}

	.shaping-future-content,
	.shaping-future-image{
		width: 100%;
	}

	.shaping-future-item h3{
		width: calc(45% - 5px);
		font-size: 18px;
		margin-right: 5px;
		padding-right: 5px;
	}

	.shaping-future-item p{
		width: 56%;
	}

	.team-single-image img{
		aspect-ratio: 1 / 1.2;
	}

	.team-about-content{
		padding: 20px;
	}

	.member-social-list{
		margin-bottom: 20px;
	}

	.team-contact-content h3{
		font-size: 18px;
	}

	.team-member-skill-box,
	.team-member-contact-box{
		padding: 20px;
	}

	.contact-us-box{
        padding: 20px;
    }

	.contact-us-content{
        padding: 20px;
    }

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

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

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

	.contact-item-content{
        width: calc(100% - 65px);
    }

	.contact-item-content h3{
		font-size: 18px;
	}

	.contact-us-img img{
        aspect-ratio: 1 / 1.1;
    }

	.working-hours-header h3{
		font-size: 18px;
	}

	.working-hours-box{
        bottom: 15px;
        left: 15px;
        padding: 15px;
    }

	.working-hours-body ul li{
		font-size: 14px;
		gap: 10px 20px;
		margin-bottom: 10px;
	}

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

	.google-map iframe{
		height: 350px;
	}
}

<script>
  jQuery(function($){
    $("#heroVideo").YTPlayer();
  });
</script>
/* --- Force hero to NOT use any background image --- */
.hero,
.hero.dark-section,
.hero.parallaxie,
.hero.dark-section.parallaxie,
.hero.hero-with-video {
  background: none !important;
  background-image: none !important;
}

/* --- Hero video layout & overlay --- */
.hero-with-video {
  position: relative;
  overflow: hidden;
  min-height: 620px;                /* reserve space so video is visible */
}
.hero-with-video::before {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(to right, rgba(0,0,0,0.55) 35%, rgba(0,0,0,0.25) 70%, rgba(0,0,0,0) 100%);
  z-index: 1;
}
.hero-with-video .container { position: relative; z-index: 2; }

/* YTPlayer wrapper should fully cover the hero */
.hero-with-video .mbYTP_wrapper {
  position: absolute !important;
  top: 0 !important; left: 0 !important;
  width: 100% !important; height: 100% !important;
  z-index: 0 !important;
  pointer-events: none;
}
.hero-with-video #heroVideo {
  position: absolute !important;
  inset: 0;
  z-index: 0 !important;
}

/* Rotating text badge (unchanged) */
.rotating-badge{ position:relative;width:180px;height:180px;margin-left:auto;z-index:2; }
.rotating-text{ width:100%;height:100%;fill:#fff;letter-spacing:2px;font-size:14px;font-weight:600;text-transform:uppercase;animation:spin 14s linear infinite;opacity:.9; }
@keyframes spin { to { transform: rotate(360deg); } }

/* ================================
   About section (clean + aligned)
   ================================ */

/* Align heading (left) and paragraph (right) to the same top baseline */
.about-us .section-row {
  align-items: flex-start;            /* keeps H2 and paragraph starting at same height */
}

/* Tighten heading spacing */
.about-us .section-title h3 {
  margin-bottom: 8px;
}
.about-us .section-title h2 {
  margin: 0 0 6px 0;
  line-height: 1.15;
}

/* Right column paragraph */
.about-us .section-title-content p {
  text-align: justify;
  margin: 2px 0 0 0;                 /* small nudge so it aligns visually with H2 */
  color: var(--text-color);
  font-size: 1rem;
  line-height: 1.75;
}

/* Stars row with divider and padding */
.satisfaction-stars {
  margin-top: 14px;                   /* space after paragraph */
  padding-top: 12px;                  /* space above stars text */
  border-top: 1px solid rgba(23, 44, 69, 0.12); /* subtle separator */
}

/* Stars line */
.satisfaction-stars .stars {
  margin-bottom: 8px;                 /* gap between stars and label */
}
.satisfaction-stars .stars i {
  color: #FFD700;                     /* golden stars */
  font-size: 1.2rem;
  margin-right: 4px;
}

/* Label under stars */
.satisfaction-stars h4 {
  margin: 0;
  font-weight: 700;
  font-size: 1.05rem;
  color: #16324a;                     /* dark, readable */
  letter-spacing: 0.2px;
}

/* ----------------
   Responsive tweaks
   ---------------- */
@media (max-width: 991.98px) {
  .about-us .section-row {
    align-items: stretch;             /* allow natural stacking on tablet/mobile */
  }
  .about-us .section-title h2 {
    margin-bottom: 10px;
    line-height: 1.2;
  }
  .about-us .section-title-content p {
    margin-top: 6px;
  }
  .satisfaction-stars {
    margin-top: 16px;
    padding-top: 10px;
  }
}
/* Footer rhythm & polish */
.main-footer .about-footer-content p {
  margin: 12px 0 0;
  line-height: 1.7;
}
.main-footer .footer-contacts a { white-space: nowrap; }

.main-footer .footer-links h3 {
  margin-bottom: 12px;
  color: var(--secondary-color);
}
.main-footer .footer-links ul {
  margin: 0; padding: 0; list-style: none;
}
.main-footer .footer-links ul li {
  margin: 6px 0;
}
.main-footer .footer-links ul li a {
  text-decoration: none;
}
.main-footer .footer-links ul li a:hover {
  text-decoration: underline;
}

.footer-working-hour-box ul { list-style: none; margin: 0; padding: 0; }
.footer-working-hour-box ul li {
  display: flex; justify-content: space-between;
  padding: 4px 0;
}

/* subtle top divider above the copyright line */
.footer-divider {
  height: 1px;
  margin: 18px 0 12px;
  background: linear-gradient(
    to right,
    rgba(65,127,199,0.35),
    rgba(112,182,49,0.35)
  );
  border-radius: 1px;
}

.footer-copyright-text {
  text-align: center;
  padding-bottom: 6px;
}
.footer-copyright-text .sep {
  margin: 0 8px;
  opacity: 0.75;
}

/* Pure white text everywhere */
.section-footer-text p {
  color: #fff;
  font-size: 15px;
}
.section-footer-text p a.footer-btn-white {
  color: #fff;
  font-weight: 600;
  text-decoration: underline;
}
.section-footer-text p a.footer-btn-white:hover {
  color: #fff !important;
  text-decoration: none;
}

/* Golden blinking PLUS */
.blinking-plus {
  color: #FFD700; /* golden */
  font-weight: 700;
  animation: blink 1.5s infinite;
}

@keyframes blink {
  0%, 50%, 100% { opacity: 1; }
  25%, 75% { opacity: 0.2; }
}
.faq-dark {
  background-color: #172C45; /* dark navy from your theme */
  color: #ffffff;            /* white text */
  border-radius: 8px;        /* optional for smooth look */
  padding: 25px;             /* spacing inside */
}
.faq-dark .accordion-button {
  background: transparent;
  color: #ffffff;
}
.faq-dark .accordion-body {
  color: #f1f1f1; /* slightly lighter for readability */
}

.our-faqs.light-section {
  background: #ffffff;
  padding: 80px 0 140px;   /* extra bottom space to separate from footer */
  border-top: 1px solid #e6e6e6;
}
footer { margin-top: 0; }  /* ensures footer doesn’t pull upward */

/* =========================================================
   GUIDELINES SECTION — LAYOUT & SPACING
   ========================================================= */
.guidelines-section {
  padding: 80px 0 120px;          /* clear top/bottom spacing */
  background: #f9fafb !important; /* light background so cards pop */
  border-top: 1px solid #eaeaea;  /* subtle divider from previous section */
}

/* Headings & intro in guidelines intro block */
.guidelines-section .section-title h3,
.guidelines-section .section-title h2 {
  color: #0c3858;
}
.guidelines-section .section-title-content p {
  color: #444;
}

/* =========================================================
   GUIDELINE CARDS — Static, Corporate Boxes
   ========================================================= */
.guideline-card {
  background: #0c3858;                              /* theme box */
  border-radius: 12px;
  padding: 45px 30px;
  color: #fff;
  border: 1px solid rgba(255, 255, 255, 0.15);
  text-align: center;
  display: flex;
  flex-direction: column;
  justify-content: space-between;                   /* equal height */
  height: 100%;
  /* No hover effects for the box — static corporate look */
}

.guideline-card .icon i {
  font-size: 36px;
  color: #fff;
  margin-bottom: 15px;
}
.guideline-card h3 {
  font-size: 22px;
  font-weight: 600;
  color: #fff;
  margin-bottom: 12px;
}
.guideline-card p  {
  color: #fff;
  font-size: 15px;
  line-height: 1.6;
  margin-bottom: 25px;
}

/* =========================================================
   GUIDELINE BUTTON — White outline with arrow shift on hover
   ========================================================= */
.btn-guideline {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border: 1px solid #fff;
  color: #fff;
  padding: 10px 22px;
  border-radius: 50px;
  text-decoration: none;
  font-size: 15px;
  transition: all 0.3s ease;
}
.btn-guideline i { transition: transform 0.3s ease; }
.btn-guideline:hover {
  background: #fff;
  color: #0c3858;
  text-decoration: none;
}
.btn-guideline:hover i { transform: translateX(4px); }

/* =========================================================
   RESPONSIVE POLISH
   ========================================================= */
@media (max-width: 991px) {
  .guideline-card { padding: 35px 25px; }
}
@media (max-width: 575px) {
  .guideline-card { padding: 30px 20px; }
}
/* ===== Blog Social Sharing Buttons ===== */
.post-social-sharing ul {
  display: flex;
  justify-content: flex-end;
  gap: 10px;
  list-style: none;
  padding: 0;
  margin: 0;
}

.post-social-sharing ul li a {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 38px;
  height: 38px;
  border-radius: 50%;
  border: 1px solid #0c3858;
  color: #0c3858;
  transition: all 0.3s ease;
  font-size: 15px;
}

.post-social-sharing ul li a:hover {
  background-color: #0c3858;
  color: #fff;
  transform: translateY(-3px);
}
.service-discover-image img {
  height: 600px;
  width: auto;
  object-fit: cover;
  object-position: center top;
  display: block;
  margin: 0 auto;
}

.corporate-info-box ul li::before {
    content: '✔';
    position: absolute;
    left: 0;
    color: #0a2540;
    font-weight: bold;
}

@media(max-width:768px){
    .corporate-about-row {
        flex-direction: column;
        gap:20px;
    }

    .corporate-image-box img,
    .corporate-info-box {
        max-width:100%;
        width:100%;
        height:auto;
    }
}
/* Highlight active navigation link */
.main-header .navbar-nav .nav-link.active {
  color: #00b4d8 !important;  /* or your theme’s accent color */
  font-weight: 600;
  position: relative;
}

/* Optional underline or accent indicator */
.main-header .navbar-nav .nav-link.active::after {
  content: "";
  position: absolute;
  left: 0;
  bottom: -5px;
  width: 100%;
  height: 2px;
  background-color: #00b4d8; /* same accent color */
  border-radius: 1px;
}
.why-choose-item {
  background: #fff;
  border: 1px solid #e5e7eb;
  border-radius: 1rem;
  padding: 1.75rem;
  transition: all 0.3s ease;
}
.why-choose-item:hover {
  box-shadow: 0 10px 25px rgba(0,0,0,0.07);
  transform: translateY(-3px);
}
.why-choose-item .icon-box {
  width: 70px;
  height: 70px;
  border-radius: 50%;
  background: #eef5ff;
  display: flex;
  align-items: center;
  justify-content: center;
}
.why-choose-item .icon-box i {
  font-size: 30px;
  color: #0c2e4e;
}
.why-choose-item-title {
  font-weight: 600;
  font-size: 1.1rem;
  color: #0c2e4e;
}
.why-choose-item-content {
  font-size: 0.98rem;
  line-height: 1.6;
  color: #444;
}
/* Mission / Vision / Values Styling */
.mission-vision-item {
  background: #fff;
  border: 1px solid #e5e7eb;
  border-radius: 1rem;
  padding: 2rem;
  height: 100%;
  transition: all 0.3s ease;
}
.mission-vision-item:hover {
  box-shadow: 0 8px 24px rgba(0,0,0,0.08);
  transform: translateY(-5px);
}

/* Icon circle */
.icon-circle {
  width: 100px;
  height: 100px;
  border-radius: 50%;
  background: #eef5ff;
  display: flex;
  align-items: center;
  justify-content: center;
  margin: 0 auto 1rem;
}
.icon-circle i {
  font-size: 48px;
  color: #0c2e4e;
}

/* Titles and text */
.mission-vision-item h3 {
  font-weight: 600;
  font-size: 1.25rem;
  color: #0c2e4e;
  margin-bottom: 0.75rem;
}
.mission-vision-item p {
  font-size: 0.98rem;
  color: #444;
  line-height: 1.6;
}

/* Responsive */
@media (max-width: 767.98px) {
  .icon-circle {
    width: 80px;
    height: 80px;
  }
  .icon-circle i {
    font-size: 36px;
  }
  .mission-vision-item {
    padding: 1.5rem;
  }
}
/* === TRAINING PAGE LAYOUT NORMALIZER === */
.training-page .section-padding{padding-top:80px;padding-bottom:80px;}
@media (max-width:991.98px){.training-page .section-padding{padding-top:60px;padding-bottom:60px;}}

/* Gutters: slightly tighter & consistent */
.training-page .row.g-4{ --bs-gutter-x:1.25rem; --bs-gutter-y:1.25rem; }

/* Card system (applies to all the boxes on this page) */
.training-page .info-card,
.training-page .contact-info-item{
  display:flex; flex-direction:column; justify-content:flex-start; align-items:center;
  text-align:center; height:100%;
  border:1px solid #e5e7eb; border-radius:1rem; background:#fff; padding:1.5rem;
  transition:box-shadow .3s ease, transform .3s ease;
}
.training-page .info-card:hover,
.training-page .contact-info-item:hover{ box-shadow:0 10px 30px rgba(0,0,0,.08); transform:translateY(-3px); }

/* Icon circle */
.training-page .icon-box{
  width:80px;height:80px;border-radius:50%;background:#eef5ff;
  display:flex;align-items:center;justify-content:center;margin:0 auto 1rem;
}
.training-page .icon-box i{ font-size:36px; color:#0c2e4e; line-height:1; }

/* Titles + copy inside cards */
.training-page .info-card h4,
.training-page .contact-info-item h4{font-size:1.1rem;font-weight:600;color:#0c2e4e;margin-bottom:.5rem;}
.training-page .info-card p,
.training-page .contact-info-item p{color:#444;margin:0;}
.training-page .info-card ul{padding-left:0;margin:0;list-style:none;}
.training-page .bullet-list{list-style:none;padding-left:0;margin:0;}
.training-page .bullet-list li{position:relative;padding-left:1.2rem;margin:.5rem 0;}
.training-page .bullet-list li::before{content:"•";position:absolute;left:0;color:#0c2e4e;font-weight:700;}

/* Hero image polish */
.training-page .image-anime img{width:100%;height:auto;display:block;border-radius:12px;}

/* Scope to the services section only */
.service-discover-content .why-choose-item-header {
  display: flex;
  align-items: center;
  gap: 12px;
}

/* Lock icon container to a square and prevent stretch */
.service-discover-content .icon-box {
  width: 52px;
  height: 52px;
  flex: 0 0 52px;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 8px;
  overflow: hidden; /* avoids odd edges on SVG/PNG */
}

/* Keep icons perfectly proportioned */
.service-discover-content .icon-box img {
  width: 100%;
  height: 100%;            /* fill the box */
  object-fit: contain;     /* but never distort */
  aspect-ratio: 1 / 1;     /* keep it square across browsers */
}

/* Let the title shrink in the flex row instead of pushing into other content */
.service-discover-content .why-choose-item-title {
  min-width: 0;            /* critical for preventing overflow in flex layouts */
}

.service-discover-content .why-choose-item-title h3 {
  margin: 0;
  line-height: 1.25;
  overflow-wrap: break-word;    /* break long words if needed */
  word-break: break-word;
}

/* Give the paragraph breathing room and prevent overlaps */
.service-discover-content .why-choose-item-content {
  margin-top: 10px;
}

.service-discover-content .why-choose-item-content p {
  margin: 0;
  line-height: 1.6;
}

/* If a global img rule is forcing distortion, hard-override just for service icons */
@media all {
  .service-discover-content .icon-box img {
    height: auto !important;    /* uncomment if you still see distortion */
    max-height: 100%;
  }
}

/* In case the reveal/figure stacking overlaps the content on some screens */
.service-discover-image figure,
.service-discover-image-content,
.service-discover-content {
  position: relative;
  z-index: 0;
}
/* Make service headings smaller but still fully visible */
.service-discover-content .why-choose-item-title h3 {
  font-size: 12px;      /* slightly smaller for one-line look */
  line-height: 1.3;
  white-space: normal;  /* allow wrapping normally */
  overflow: visible;    /* show full text */
}
/* Make service detail text smaller and tidy */
.service-discover-content .why-choose-item-content p {
  font-size: 12px;      /* try 13–15px depending on readability */
  line-height: 1.6;
  margin: 0;
}
/* --- Prevent the last service box from being cut off --- */

/* Let the containers grow and show their children fully */
.service-discover-image-content,
.service-discover-content {
  overflow: visible !important;
  height: auto !important;
  max-height: none !important;
}

/* Give the list a little breathing room at the bottom */
.service-discover-content {
  padding-bottom: 16px;
}

/* Ensure the last card isn't clipped by margin-collapsing */
.service-discover-content .why-choose-item:last-child {
  margin-bottom: 0;
  padding-bottom: 8px;
}

/* WOW/animate elements can be clipped if a parent hides overflow */
.why-choose-item.wow {
  will-change: transform, opacity; /* smoother + helps avoid fractional clipping */
}

/* If any global CSS forces fixed heights on cards, neutralize here */
.service-discover-content .why-choose-item,
.service-discover-content .why-choose-item-content {
  height: auto !important;
  max-height: none !important;
  overflow: visible;
}

/* ============================
   JOB CARDS – CORPORATE STYLE
   ============================ */

/* Equal gaps between columns */
#jobCards {
  row-gap: 24px;
}

/* Make all cards equal height */
#jobCards > [class*="col-"] {
  display: flex;
}

#jobCards .job-card {
  display: flex;
  flex-direction: column;
  flex: 1 1 auto;
  width: 100%;
  border-radius: 14px;
  background: #ffffff;
  border: 1px solid rgba(10, 37, 64, 0.08);
  box-shadow: 0 14px 32px rgba(10, 37, 64, 0.18);
  overflow: hidden;
  transition: transform 0.25s ease, box-shadow 0.25s ease;
}

#jobCards .job-card:hover {
  transform: translateY(-4px);
  box-shadow: 0 18px 40px rgba(10, 37, 64, 0.22);
}

/* ============================
   HEADER (IMAGE + ICON + PILL)
   ============================ */

#jobCards .job-card-header {
  position: relative;
  width: 100%;
  height: 190px;
  overflow: visible; /* so the icon can sit partly over the body */
}

#jobCards .job-card-image {
  width: 100%;
  height: 100%;
  margin: 0;
}

#jobCards .job-card-image img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

/* Round icon – not cut anywhere */
#jobCards .job-card-icon {
  position: absolute;
  bottom: -26px;        /* sits across header/body, still inside card */
  left: 20px;
  width: 56px;
  height: 56px;
  border-radius: 50%;
  background: #0a2540;  /* icon background */
  color: #ffffff;       /* icon color */
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 22px;
  box-shadow: 0 6px 16px rgba(0, 0, 0, 0.25);
  z-index: 2;
}

/* Category pill (you can recolor variants if you like) */
#jobCards .job-card-pill {
  position: absolute;
  top: 16px;
  right: 16px;
  padding: 6px 14px;
  font-size: 0.75rem;
  font-weight: 600;
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.96);
  color: #0a2540;
  border: 1px solid rgba(10, 37, 64, 0.1);
  backdrop-filter: blur(4px);
}

#jobCards .job-card-pill--research { }
#jobCards .job-card-pill--clinical { }
#jobCards .job-card-pill--regulatory { }

/* ============================
   BODY
   ============================ */

#jobCards .job-card-body {
  padding: 40px 20px 18px; /* extra top padding to make room for icon */
  flex: 1;
}

#jobCards .job-card-title {
  font-size: 1.1rem;
  margin: 0 0 4px;
  font-weight: 600;
  color: #0a2540;
}

#jobCards .job-card-title a {
  color: inherit;
  text-decoration: none;
}

#jobCards .job-card-title a:hover {
  text-decoration: underline;
}

#jobCards .job-card-meta {
  font-size: 0.9rem;
  color: rgba(10, 37, 64, 0.75);
  margin-bottom: 10px;
  display: flex;
  align-items: center;
  gap: 6px;
}

#jobCards .job-meta-divider {
  opacity: 0.6;
}

/* Highlights */
#jobCards .job-card-highlights {
  list-style: none;
  padding: 0;
  margin: 8px 0 0;
}

#jobCards .job-card-highlights li {
  font-size: 0.93rem;
  color: rgba(10, 37, 64, 0.9);
  margin-bottom: 6px;
  padding-left: 18px;
  position: relative;
}

#jobCards .job-card-highlights li::before {
  content: "•";
  position: absolute;
  left: 0;
  top: 0;
  color: rgba(10, 37, 64, 0.75);
}

/* ============================
   FOOTER & BUTTONS
   ============================ */

#jobCards .job-card-footer {
  padding: 16px 20px 20px;
  display: flex;
  gap: 10px;
  border-top: 1px solid rgba(10, 37, 64, 0.06);
}

/* Main button – dark background, white text */
#jobCards .btn-primary {
  flex: 1;
  padding: 9px 16px;
  font-size: 0.9rem;
  border-radius: 6px;
  font-weight: 600;
  text-decoration: none;
  text-align: center;
  background: #0a2540;
  color: #ffffff;
  border: 1px solid #0a2540;
  transition: background 0.2s ease, color 0.2s ease, box-shadow 0.2s ease, transform 0.1s ease;
}

#jobCards .btn-primary:hover {
  background: #0d3157;
  color: #ffffff;
  box-shadow: 0 6px 16px rgba(10, 37, 64, 0.35);
  transform: translateY(-1px);
}

/* Secondary button – white background, dark text */
#jobCards .btn-secondary {
  padding: 9px 16px;
  font-size: 0.9rem;
  border-radius: 6px;
  font-weight: 600;
  text-decoration: none;
  text-align: center;
  background: #ffffff;
  color: #0a2540;
  border: 1px solid #0a2540;
  transition: background 0.2s ease, color 0.2s ease, box-shadow 0.2s ease, transform 0.1s ease;
}

#jobCards .btn-secondary:hover {
  background: #f4f6f8;
  color: #0a2540;
  box-shadow: 0 6px 16px rgba(10, 37, 64, 0.2);
  transform: translateY(-1px);
}
/* =========================================
   PARTNERS SECTION – CORPORATE STYLES START
   ========================================= */

.partners-section {
  padding: 60px 0;
  background: #f5f7fa;
}

/* Section heading */
.partners-section .section-heading {
  max-width: 720px;
  margin: 0 auto 32px;
}

.partners-section .section-eyebrow {
  text-transform: uppercase;
  letter-spacing: 0.12em;
  font-size: 0.8rem;
  font-weight: 600;
  color: #0a2540;
  margin-bottom: 6px;
}

.partners-section .section-title {
  font-size: 2rem;
  font-weight: 700;
  color: #0a2540;
  margin-bottom: 10px;
}

.partners-section .section-subtitle {
  font-size: 0.98rem;
  color: rgba(10, 37, 64, 0.8);
  margin: 0;
}

/* Grid spacing */
.partners-grid {
  row-gap: 24px;
}

/* Equal height columns */
.partners-grid > [class*="col-"] {
  display: flex;
}

/* Partner card base */
.partner-card {
  display: flex;
  flex-direction: column;
  flex: 1 1 auto;
  background: #ffffff;
  border-radius: 14px;
  border: 1px solid rgba(10, 37, 64, 0.08);
  box-shadow: 0 14px 32px rgba(10, 37, 64, 0.16);
  padding: 20px 20px 18px;
  transition: transform 0.25s ease, box-shadow 0.25s ease;
}

.partner-card:hover {
  transform: translateY(-4px);
  box-shadow: 0 18px 40px rgba(10, 37, 64, 0.24);
}

/* Header (logo + badge) */
.partner-card-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 16px;
}

.partner-logo {
  margin: 0;
  flex-shrink: 0;
  max-width: 48%;
}

.partner-logo img {
  max-width: 100%;
  max-height: 150px;
  object-fit: contain;
  display: block;
}

/* Badge */
.partner-badge {
  font-size: 0.75rem;
  font-weight: 600;
  padding: 6px 12px;
  border-radius: 999px;
  background: #0a2540;
  color: #ffffff;
  white-space: nowrap;
}

/* Body */
.partner-card-body {
  flex: 1;
}

.partner-name {
  font-size: 1.05rem;
  font-weight: 600;
  color: #0a2540;
  margin: 0 0 6px;
}

.partner-intro {
  font-size: 0.94rem;
  color: rgba(10, 37, 64, 0.85);
  margin: 0 0 12px;
}

/* Meta info (locations, focus, etc.) */
.partner-meta {
  display: flex;
  flex-direction: column;
  gap: 6px;
}

.partner-meta-item {
  display: flex;
  align-items: flex-start;
  gap: 6px;
  font-size: 0.9rem;
  color: rgba(10, 37, 64, 0.9);
}

.partner-meta-item i {
  margin-top: 2px;
  color: #0a2540;
  font-size: 0.92rem;
  flex-shrink: 0;
}

.partner-meta-label {
  font-weight: 600;
}

.partner-meta-value {
  font-weight: 400;
}

/* Footer + button */
.partner-card-footer {
  margin-top: 16px;
  padding-top: 10px;
  border-top: 1px solid rgba(10, 37, 64, 0.06);
  display: flex;
  justify-content: flex-start;
}

/* Reuse corporate button style (secondary variant) */
.partners-section .btn.btn-secondary {
  padding: 9px 18px;
  font-size: 0.9rem;
  border-radius: 6px;
  font-weight: 600;
  text-decoration: none;
  text-align: center;
  background: #ffffff;
  color: #0a2540;
  border: 1px solid #0a2540;
  transition: background 0.2s ease, color 0.2s ease,
              box-shadow 0.2s ease, transform 0.1s ease;
}

.partners-section .btn.btn-secondary:hover {
  background: #f4f6f8;
  color: #0a2540;
  box-shadow: 0 6px 16px rgba(10, 37, 64, 0.24);
  transform: translateY(-1px);
}

/* Small screen tweaks */
@media (max-width: 575.98px) {
  .partner-card {
    padding: 16px 16px 14px;
  }

  .partner-card-header {
    flex-direction: column;
    align-items: flex-start;
  }

  .partner-logo {
    max-width: 70%;
  }

  .partner-badge {
    align-self: flex-start;
  }
}

/* =======================================
   PARTNERS SECTION – CORPORATE STYLES END
   ======================================= */
/* ============================================================
   VISION & MISSION STRIP – DARK CORPORATE STYLES START
   ============================================================ */

/* Merge visually with hero */
.hero + .vision-mission-strip {
  margin-top: 0;
}

/* Dark background strip */
.vision-mission-strip {
  background: #0a2540;
  color: #ffffff;
  padding-bottom: 32px; /* space before next section */
}

/* Layout wrapper */
.vm-wrapper {
  display: flex;
  flex-direction: column;
}

/* Header area – with 20px padding above and below */
.vm-header {
  min-height: 100px;
  padding-top: 20px;
  padding-bottom: 20px;
  display: flex;
  justify-content: center;
  align-items: center;
}

/* Buttons row – centered */
.vm-tab-row {
  display: flex;
  justify-content: center;
  align-items: center; /* ensures perfect vertical alignment */
  gap: 14px;
  flex-wrap: wrap;
}

/* Buttons – your .btn-default.btn-border but reformatted for strip */
.vision-mission-strip .btn-default.btn-border.vm-toggle-btn {
  display: flex;
  justify-content: center;
  align-items: center;
  width: 300px;            /* fixed size as requested */
  max-width: 100%;
  padding: 10px 24px;
  border-radius: 999px;
  border-width: 1px;
  border-color: #ffffff;  /* white outline */
  background: transparent;
  color: #ffffff;          /* white text */
  font-weight: 600;
  font-size: 0.95rem;
  text-decoration: none;
  cursor: pointer;
  transition:
    background 0.2s ease,
    color 0.2s ease,
    box-shadow 0.2s ease,
    transform 0.1s ease;
}

/* Hover state – keep text visible */
.vision-mission-strip .btn-default.btn-border.vm-toggle-btn:hover {
  background: rgba(255, 255, 255, 0.20); /* transparent white */
  color: #ffffff;                         /* text stays visible */
  box-shadow: 0 6px 16px rgba(0, 0, 0, 0.45);
  transform: translateY(-1px);
}

/* Active (clicked/open) state */
.vision-mission-strip .btn-default.btn-border.vm-toggle-btn.active {
  background: #ffffff;
  color: #0a2540;
  box-shadow: 0 6px 16px rgba(0, 0, 0, 0.45);
}

/* Collapses wrapper */
.vm-collapses {
  overflow: visible;
  margin-top: 4px;
}

/* Collapsible block (hidden by default) */
.vm-collapse {
  overflow: hidden;
  max-height: 0;
  opacity: 0;
  transition:
    max-height 0.35s ease,
    opacity 0.25s ease,
    margin-top 0.25s ease,
    margin-bottom 0.25s ease;
}

/* When JS adds .open */
.vm-collapse.open {
  opacity: 1;
  margin-top: 10px;
  margin-bottom: 12px; /* adds spacing before next section */
}

/* Inner panel – transparent with white text + white outline */
.vm-panel-inner {
  background: transparent;
  color: #ffffff;
  border-radius: 16px;
  border: 1px solid rgba(255, 255, 255, 0.6);
  padding: 14px 18px 16px;
  text-shadow: 0 1px 2px rgba(0, 0, 0, 0.45);
}

/* Title & text */
.vm-panel-title {
  font-size: 1rem;
  font-weight: 600;
  margin-bottom: 6px;
  color: #ffffff;
}

.vm-panel-inner p {
  margin: 0 0 8px;
  font-size: 0.95rem;
  color: #ffffff;
}

/* List styling inside drop panel */
.vm-list {
  margin: 0;
  padding-left: 18px;
}

.vm-list li {
  font-size: 0.93rem;
  color: #ffffff;
  margin-bottom: 4px;
}

/* Responsive tweaks */
@media (max-width: 767.98px) {
  .vm-header {
    padding-top: 20px;
    padding-bottom: 20px;
  }

  /* Buttons become full width on mobile */
  .vision-mission-strip .btn-default.btn-border.vm-toggle-btn {
    width: 100%;
  }

  .vm-panel-inner {
    padding: 12px 14px 14px;
  }
}

/* ==========================================================
   VISION & MISSION STRIP – DARK CORPORATE STYLES END
   ========================================================== */
/* ============================================================
   VISION & MISSION STRIP – DARK CORPORATE STYLES START
   ============================================================ */

/* Directly under hero */
.hero + .vision-mission-strip {
  margin-top: 0;
}

/* Dark background strip */
.vision-mission-strip {
  background: #0a2540;
  color: #ffffff;
  padding: 0; /* we'll control spacing via header + collapses */
}

/* Layout wrapper */
.vm-wrapper {
  display: flex;
  flex-direction: column;
}

/* Header: equal spacing above and below buttons */
.vm-header {
  padding-top: 20px;
  padding-bottom: 5px;
  display: flex;
  justify-content: center;
  align-items: center;
}

/* Buttons row – centered */
.vm-tab-row {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 20px;
  flex-wrap: wrap;
}

/* BUTTONS
   Use your .btn-default.btn-border but force our behavior here */
.vision-mission-strip .btn-default.btn-border.vm-toggle-btn {
  display: flex !important;
  justify-content: center !important;
  align-items: center !important;

  width: 450px;               /* wider than before */
  max-width: 100%;
  padding: 15px 15px !important;
  border-radius: 999px !important;

  border-width: 2px !important;
  border-style: solid !important;
  border-color: #ffffff !important;

  background: transparent !important;
  color: #ffffff !important;

  font-weight: 600 !important;
  font-size: 0.95rem !important;
  text-decoration: none !important;
  cursor: pointer;

  transition:
    background 0.2s ease,
    color 0.2s ease,
    box-shadow 0.2s ease,
    transform 0.1s ease;
}

/* HOVER: keep text white, background only slightly tinted */
.vision-mission-strip .btn-default.btn-border.vm-toggle-btn:hover {
  background: rgba(255, 255, 255, 0.20) !important; /* NOT full white */
  color: #0a2540 !important;                         /* force text white */
  border-color: #ffffff !important;
  box-shadow: 0 6px 16px rgba(0, 0, 0, 0.45);
  transform: translateY(-1px);
}

/* ACTIVE (clicked/open): white background, dark text */
.vision-mission-strip .btn-default.btn-border.vm-toggle-btn.active {
  background: #ffffff !important;
  color: #0a2540 !important;
  border-color: #ffffff !important;
  box-shadow: 0 6px 16px rgba(0, 0, 0, 0.45);
}

/* Collapses wrapper – provide bottom space so outline doesn't touch next section */
.vm-collapses {
  overflow: visible;
  margin-top: 4px;
  margin-bottom: 24px; /* extra breathing room before next section */
}

/* Collapsible block (hidden by default) */
.vm-collapse {
  overflow: hidden;
  max-height: 0;
  opacity: 0;
  transition:
    max-height 0.35s ease,
    opacity 0.25s ease,
    margin-top 0.25s ease,
    margin-bottom 0.25s ease;
}

/* When JS adds .open */
.vm-collapse.open {
  opacity: 1;
  margin-top: 10px;
  margin-bottom: 12px;
}

/* Inner panel – transparent bg, white text, white outline
   + 200px margin from both sides on wide screens */
.vm-panel-inner {
  background: transparent;
  color: #ffffff;
  border-radius: 16px;
  border: 1px solid rgba(255, 255, 255, 0.6);
  padding: 14px 18px 16px;
  text-shadow: 0 1px 2px rgba(0, 0, 0, 0.45);

  /* 200px margin left & right */
  margin-left: 200px;
  margin-right: 200px;
  margin-bottom: 20px;
}

/* Title & text */
.vm-panel-title {
  font-size: 2rem;
  font-weight: 600;
  margin-bottom: 5px;
  color: #ffffff;
}

.vm-panel-inner p {
  margin: 0 0 8px;
  font-size: 1rem;
  color: #ffffff;
}

/* List styling */
.vm-list {
  margin: 0;
  padding-left: 30px;
}

.vm-list li {
  font-size: 0.93rem;
  color: #ffffff;
  margin-bottom: 4px;
}

/* =========================
   RESPONSIVE ADJUSTMENTS
   ========================= */

@media (max-width: 1199.98px) {
  /* Relax side margins on smaller screens so text doesn't get squeezed */
  .vm-panel-inner {
    margin-left: 40px;
    margin-right: 40px;
  }
}

@media (max-width: 767.98px) {
  .vm-header {
    padding-top: 20px;
    padding-bottom: 20px;
  }

  /* Buttons full width on mobile */
  .vision-mission-strip .btn-default.btn-border.vm-toggle-btn {
    width: 100%;
  }

  .vm-panel-inner {
    margin-left: 16px;
    margin-right: 16px;
    padding: 12px 14px 14px;
  }
}

/* ==========================================================
   VISION & MISSION STRIP – DARK CORPORATE STYLES END
   ========================================================== */
/* =====================================================
   SCHOLARSHIPS SECTION – CORPORATE STYLES START
   ===================================================== */

.scholarships-section {
  padding: 70px 0;
  background: #f5f7fa;
}

.scholarships-card {
  background: #ffffff;
  border-radius: 18px;
  padding: 28px 26px 26px;
  border: 1px solid rgba(10, 37, 64, 0.08);
  box-shadow: 0 18px 40px rgba(10, 37, 64, 0.12);
}

/* Top badge row */
.scholarships-badge {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 12px;
}

.scholarships-badge span:first-child {
  font-size: 0.9rem;
  font-weight: 600;
  letter-spacing: 0.12em;
  color: #0a2540;
  text-transform: uppercase;
}

.scholarships-status {
  font-size: 0.78rem;
  font-weight: 600;
  padding: 4px 10px;
  border-radius: 999px;
  background: rgba(10, 37, 64, 0.06);
  color: #0a2540;
}

/* Title & intro */
.scholarships-title {
  font-size: 1.6rem;
  font-weight: 700;
  color: #0a2540;
  margin-bottom: 10px;
}

.scholarships-intro {
  font-size: 0.97rem;
  color: rgba(10, 37, 64, 0.9);
  margin-bottom: 14px;
}

/* Highlight block */
.scholarships-highlight {
  border-left: 3px solid #0a2540;
  padding-left: 14px;
  margin-bottom: 14px;
}

.scholarships-highlight p {
  margin: 0;
  font-size: 0.95rem;
  color: rgba(10, 37, 64, 0.9);
}

/* Footer note */
.scholarships-footer-note {
  font-size: 0.9rem;
  color: rgba(10, 37, 64, 0.75);
  margin: 0;
}

/* ============================
   3 COMING SOON CARDS
   ============================ */

.scholarships-coming-card {
  height: 180px;
  background: #ffffff;
  border-radius: 18px;
  border: 1px solid rgba(10, 37, 64, 0.08);
  box-shadow: 0 18px 40px rgba(10, 37, 64, 0.12);
  display: flex;
  justify-content: center;
  align-items: center;
}

.scholarships-coming-card p {
  font-size: 1.4rem;
  font-weight: 700;
  color: #0a2540;
  opacity: 0.7;
  letter-spacing: 0.5px;
}

/* Responsive adjustments */
@media (max-width: 767.98px) {
  .scholarships-card {
    padding: 22px 18px 20px;
  }
  .scholarships-title {
    font-size: 1.4rem;
  }
  .scholarships-coming-card {
    height: 160px;
  }
}

/* ===================================================
   SCHOLARSHIPS SECTION – CORPORATE STYLES END
   =================================================== */
/* ============================================================
   CORPORATE FOOTER STYLES – ARIBA & MAC (FINAL VERSION)
   ============================================================ */

/* Footer Base */
.main-footer {
  background: #0a2540;
  padding: 60px 0 20px;
  color: #ffffff;
  position: relative;
}

/* ------------ Equal Column Width for 1st & 2nd Columns ------------ */
@media (min-width: 992px) {
  .main-footer .col-lg-4.col-md-12,
  .main-footer .col-lg-4.col-md-6:nth-child(2) {
    flex: 0 0 33.333%;
    max-width: 33.333%;
  }
}

/* ------------ Equal Height Column Separator Lines ------------ */
.main-footer .row {
  align-items: stretch;
}

.main-footer .row > div {
  position: relative;
  padding-right: 30px;
}

.main-footer .row > div:not(:last-child)::after {
  content: "";
  position: absolute;
  top: 0;
  right: 0;
  width: 1px;
  height: 100%; /* full equal height */
  background: rgba(255, 255, 255, 0.12);
}

@media (max-width: 991.98px) {
  .main-footer .row > div::after {
    display: none;
  }
}

/* ------------ Bigger Corporate Logo ------------ */
.footer-logo-lg img {
  width: 240px;
  max-width: 100%;
  filter: brightness(1.1);
}

/* ------------ About Text ------------ */
.about-footer-content p {
  color: rgba(255, 255, 255, 0.85);
  font-size: 0.95rem;
  line-height: 1.6;
  margin-bottom: 10px;
}

.footer-contacts a {
  color: #00b4d8;
  font-weight: 600;
  text-decoration: none;
}

.footer-contacts a:hover {
  color: #ffffff;
}

/* ============================================================
   CENTERED SOCIAL ICONS (your .footer-social block)
   ============================================================ */

.main-footer .footer-social {
  text-align: center;
  margin-bottom: 20px;
}

.main-footer .footer-social ul {
  padding-left: 0;
  margin: 0;
}

.main-footer .footer-social ul li {
  display: inline-block;
  margin: 0 6px;
}

.main-footer .footer-social ul li a {
  display: inline-flex;
  justify-content: center;
  align-items: center;
  width: 44px;
  height: 44px;
  border-radius: 50%;
  font-size: 18px;
  border: 1px solid rgba(255, 255, 255, 0.3);
  color: #ffffff;
  transition: 0.3s ease;
}

.main-footer .footer-social ul li a:hover {
  background: #ffffff;
  color: #0a2540;
  border-color: #ffffff;
  transform: translateY(-3px) scale(1.05);
}

/* ============================================================
   FOOTER TITLES & SERVICES LIST
   ============================================================ */

.footer-links h3,
.footer-offices h3 {
  font-size: 1.15rem;
  font-weight: 700;
  margin-bottom: 14px;
  letter-spacing: 0.3px;
  color: #ffffff;
}

.footer-services-list,
.footer-bottom-links {
  padding: 0;
  margin: 0;
  list-style: none;
}

.footer-services-list li {
  margin-bottom: 8px;
}

.footer-services-list a {
  color: rgba(255, 255, 255, 0.72);
  text-decoration: none;
  transition: 0.25s ease;
}

.footer-services-list a:hover {
  color: #ffffff;
  padding-left: 4px;
}

/* ============================================================
   OFFICE ICONS + ADDRESSES (corporate monochrome)
   ============================================================ */

.footer-office h4 {
  font-size: 1rem;
  font-weight: 600;
  margin-bottom: 6px;
  color: #ffffff;
  display: flex;
  align-items: center;
  gap: 6px;
}

/* Location icon style */
.main-footer .footer-office h4 .office-icon {
  font-size: 17px;
  color: #ffffff;
  opacity: 0.65;
  margin-right: 6px;
  display: inline-block;
}

.footer-office p {
  margin: 0 0 14px;
  font-size: 0.92rem;
  line-height: 1.5;
  color: rgba(255, 255, 255, 0.82);
}

/* ============================================================
   DIVIDER ABOVE BOTTOM LINKS
   ============================================================ */

.footer-divider {
  height: 1px;
  background: rgba(255, 255, 255, 0.15);
  margin: 32px 0 20px;
}

/* ============================================================
   BOTTOM LINKS
   ============================================================ */

.footer-bottom-links li {
  margin: 0 10px;
}

.footer-bottom-links a {
  color: rgba(255, 255, 255, 0.65);
  text-decoration: none;
  transition: 0.25s ease;
}

.footer-bottom-links a:hover {
  color: #ffffff !important;
}

/* ============================================================
   BOTTOM COPYRIGHT / CREDIT
   ============================================================ */

.footer-bottom p {
  font-size: 0.9rem;
  color: rgba(255, 255, 255, 0.75);
}

.footer-bottom a {
  color: #00b4d8;
  text-decoration: none;
}

.footer-bottom a:hover {
  color: #ffffff;
}

/* ============================================================
   END FINAL FOOTER STYLES
   ============================================================ */
/* ============================================
   WHY CHOOSE SECTION – CORPORATE FIXES START
   ============================================ */

/* Layout of each item */
.why-choose-item {
  background: #ffffff;
  border-radius: 14px;
  padding: 16px 18px;
  box-shadow: 0 12px 30px rgba(10, 37, 64, 0.08);
}

/* Header: icon + title aligned */
.why-choose-item-header {
  display: flex;
  align-items: center;
  gap: 14px;
  margin-bottom: 8px;
}

/* Circle icon – fix oval issue */
.why-choose-item .icon-box {
  width: 56px;               /* same width & height = circle */
  height: 56px;
  border-radius: 50%;
  background: #90e0ef;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;            /* don’t squash */
  padding: 0;                /* prevent oval from extra padding */
}

.why-choose-item .icon-box img {
  max-width: 60%;
  max-height: 60%;
  object-fit: contain;
  display: block;
}

/* Title styling – consistent line-height */
.why-choose-item-title {
  font-size: 1rem;
  font-weight: 600;
  color: #0a2540;
  line-height: 1.3;
}

.why-choose-item-title p {
  margin: 0;                 /* remove default p margin */
}

/* Smaller paragraph text */
.why-choose-item-content p {
  font-size: 0.92rem;        /* slightly smaller */
  line-height: 1.55;
  color: rgba(10, 37, 64, 0.9);
  margin: 0;
}

/* Button spacing under items */
.why-choose-btn {
  margin-top: 18px;
}

/* Responsive tweaks */
@media (max-width: 767.98px) {
  .why-choose-item {
    padding: 14px 14px;
  }

  .why-choose-item-header {
    gap: 10px;
  }

  .why-choose-item .icon-box {
    width: 50px;
    height: 50px;
  }
}

/* ==========================================
   WHY CHOOSE SECTION – CORPORATE FIXES END
   ========================================== */
/* ============================================
   Mission / Vision Cards ONLY
   ============================================ */

/* Wrapper spacing (left/right + bottom gap) */
.mission-vision-list {
  margin: 0 40px 60px !important;  /* bottom 60px so next section doesn't touch */
}

/* Card layout */
.mv-card {
  background: #ffffff;
  border-radius: 16px;
  padding: 18px 20px 20px;
  box-shadow: 0 14px 32px rgba(10, 37, 64, 0.10);
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  height: 100%;
}

.mv-card h3 {
  font-size: 1.1rem;
  font-weight: 700;
  margin-bottom: 10px;
  color: #0a2540;
}

/* Icon circle – dark corporate */
.mv-card .icon-circle {
  width: 64px;
  height: 64px;
  border-radius: 50%;
  margin: 0 auto 10px;
  display: flex;
  align-items: center;
  justify-content: center;
  background: #0a2540;
  border: 1px solid #0a2540;
  box-shadow: 0 10px 24px rgba(0, 0, 0, 0.25);
}

.mv-card .icon-circle i {
  font-size: 24px;
  color: #ffffff;
}

/* Text inside cards */
.mv-card p {
  font-size: 0.94rem;
  line-height: 1.6;
  color: rgba(10, 37, 64, 0.9);
  margin-bottom: 8px;
}

/* Bullet list */
.mv-card .mv-list {
  list-style: disc;
  text-align: left;
  margin: 4px 0 0;
  padding-left: 20px;
}

.mv-card .mv-list li {
  font-size: 0.9rem;
  color: rgba(10, 37, 64, 0.9);
  margin-bottom: 4px;
}

/* Responsive */
@media (max-width: 767.98px) {
  .mission-vision-list {
    margin: 0 12px 50px !important;   /* tighter sides on mobile, still bottom gap */
  }

  .mv-card {
    padding: 16px 16px 18px;
  }
}



/* ============================================================
   							FINAL CHANGES 
   ============================================================ */

.index-image-class1 {
  min-height: 400px !important; /* Sets the minimum height to 400 pixels */
  width: auto; /* Allows the width to adjust proportionally */
}


.team_bullet  ul, li {
  margin: 0;
  padding-right: 0;
}

.team_bullet  ul {
  margin-left: -1.1em; /* Indents the entire list */
	
}

.team_bullet  ul li::marker {
  font-size: 0.8em; /* Adjust this value to your desired size */
}

.team_bullet li {
  line-height: 1.5; /* Adjust this value as needed (e.g., 1.2 for tighter, 2 for looser) */
}


.career_bullet ul, li {
  margin: 0;
  padding-right: 0;
}

.career_bullet ul {
  margin-left: -1.1em; /* Indents the entire list */
	
}

.career_bullet ul li::marker {
  font-size: 0.8em; /* Adjust this value to your desired size */
}

.career_bullet li {
  line-height: 1.5; /* Adjust this value as needed (e.g., 1.2 for tighter, 2 for looser) */
}

.faq_answer{
  color: #313136;;
}




.why-choose-service {
  background: #fff;
  border: 1px solid #e5e7eb;
  border-radius: 1rem;
  padding: 1rem;
  transition: all 0.3s ease;
}


.why-choose-service:hover {
  box-shadow: 0 10px 25px rgba(0,0,0,0.07);
  transform: translateY(-3px);
}


.why-choose-service .icon-box {
  width: 70px;
  height: 70px;
  border-radius: 50%;
  background: #eef5ff;
  display: flex;
  align-items: center;
  justify-content: center;
}


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

.why-choose-service:last-child{
	border-bottom: none;
	padding-bottom: 0;
	margin-bottom: 0;
}

.why-choose-service-header{	
	display: flex;
	align-items: center;
}

.why-choose-service-header .icon-box{
	position: relative;
	height: 50px;
	width: 50px;
	display: flex;
	justify-content: center;
	align-items: center;
	background-color: var(--accent-color);
	border-radius: 50%;
	margin-right: 15px;
}

.why-choose-service-header .icon-box::before{
	content: '';
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	width: 100%;
	height: 100%;
	background-color: var(--primary-color);
	border-radius: 50%;
	transform: scale(0);
	transition: all 0.4s ease-in-out;
	z-index: 0;
}

.why-choose-service:hover .why-choose-service-header .icon-box::before{
	transform: scale(1);
}

.why-choose-service-header .icon-box img{
	position: relative;
	width: 100%;
	max-width: 24px;
	transition: all 0.4s ease-in-out;
	z-index: 1;
}

.why-choose-service:hover .why-choose-service-header .icon-box img{
	filter: brightness(0) invert(1);
}

.why-choose-service-title{
	width: calc(100% - 65px);
}

.why-choose-service-title h3{
	font-size: 18px;
	line-height: 1.3em;
	margin-bottom: 0.5em;
}

.why-choose-service-content{
	width: calc(100% - 55px);
	border-left: 1px solid var(--divider-color);	
	margin-left: 25px;	
	padding-left: 18px;
	padding-bottom: 0px;
}

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


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



.service-discover-content .why-choose-service .why-choose-service-content p{
	font-size: 14px;
}



/* =====================================================
   				TRAINING SECTION 
   ===================================================== */

.training-section {
  padding: 70px 0;
  background: #f5f7fa;
}

.training-card {
  background: #ffffff;
  border-radius: 18px;
  padding: 28px 26px 26px;
  border: 1px solid rgba(10, 37, 64, 0.08);
  box-shadow: 0 18px 40px rgba(10, 37, 64, 0.12);
  margin-top: 3.5em;

}

/* Top badge row */
.training-badge {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 12px;
}

.training-badge span:first-child {
  font-size: 0.9rem;
  font-weight: 600;
  letter-spacing: 0.12em;
  color: #0a2540;
  text-transform: uppercase;
}

.training-status {
  font-size: 0.78rem;
  font-weight: 600;
  padding: 4px 10px;
  border-radius: 999px;
  background: rgba(10, 37, 64, 0.06);
  color: #0a2540;
}

/* Title & intro */
.training-title {
  font-size: 2.8rem;
  font-weight: 400;
  color: #0a2540;
  margin-bottom: 10px;
}

.training-content {
  font-size: 0.97rem;
  color: rgba(10, 37, 64, 0.9);
  margin-bottom: 14px;
}

/* =====================================================
                    APPLY MODAL STYLES - START
   ===================================================== */

/* Make modal narrower */
#applyModal .modal-dialog {
  max-width: 600px; /* adjust if you want even narrower */
}

/* Card style & rounded corners */
#applyModal .apply-modal {
  border-radius: 18px;
  overflow: hidden;
  border: 0;
}

/* Header area with blue background + tagline */
#applyModal .apply-modal__header {
  background: #0a2540;
  color: #ffffff;
  border-bottom: none;
  padding: 1.5rem 1.75rem;
}

#applyModal .modal-title {
  font-weight: 600;
}

#applyModal .modal-subtitle {
  font-size: 0.9rem;
  opacity: 0.85;
}

/* Close button visible on dark header */
#applyModal .btn-close.btn-close-white {
  filter: invert(1);
}

/* Form controls styling */
#applyModal .form-control,
#applyModal textarea {
  border-radius: 0.5rem;
  border-color: #e1e5ee;
}

#applyModal .form-control:focus,
#applyModal textarea:focus {
  border-color: #01caff;
  box-shadow: 0 0 0 0.15rem rgba(1, 202, 255, 0.25);
}

/* Submit button - uses your theme colors */
#applyModal .apply-modal__submit {
  background: #01caff;
  border: none;
  color: #0a2540;
  font-weight: 600;
  padding: 0.9rem 2rem; /* FIX: more padding prevents overlap */
  border-radius: 50px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.6rem; /* FIX: spacing between icon + text */
  text-transform: none;
  font-size: 1rem;
  white-space: nowrap; /* FIX: no text breaking */
}
/* Remove theme icon from this button only */
#applyModal .apply-modal__submit::before {
  content: none !important;
}


#applyModal .apply-modal__submit:hover {
  filter: brightness(0.95);
}
/* Centered Heading Styles */
#applyModal .apply-heading {
  font-size: 1.75rem;
  font-weight: 700;
  color: #ffffff;
}

#applyModal .apply-subheading {
  font-size: 1rem;
  color: #dbe8f5;
  font-weight: 400;
}

/* =====================================================
                    APPLY MODAL STYLES - END
   ===================================================== */
/* =====================================================
                   TEAM ABOUT SECTION 
   ===================================================== */

.team-about-box {
  display: flex;
  gap: 40px;
  align-items: flex-start;
}

/* Equal-width columns */
.team-single-image,
.team-about-content {
  flex: 1;
}

/* Desktop sticky image */
.team-single-image {
  max-width: 50%;
}

@media (min-width: 992px) {
  .team-single-image {
    position: sticky;
    top: 120px; /* adjust as needed */
  }
}

/* -------- Corporate Image Styling -------- */

.team-single-image figure {
  border-radius: 20px;
  overflow: hidden;
  border: 1px solid #e6e6e6;
  box-shadow: 0 8px 25px rgba(0,0,0,0.08);
  transition: transform 0.3s ease, box-shadow 0.3s ease;
  
  /* Fixed height for desktop image box */
  width: 100%;
  height: 750px;
}

/* Optional hover effect */
.team-single-image figure:hover {
  transform: translateY(-4px);
  box-shadow: 0 12px 35px rgba(0,0,0,0.12);
}

/* Image fills the box, no distortion */
.team-single-image img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
}

/* Text column */
.team-about-content {
  max-width: 50%;
}

/* =====================================================
                TEAM ABOUT SECTION (RESPONSIVE FIX)
   ===================================================== */

/* Mobile layout fix — prevent overlap */
@media (max-width: 991.98px) {

  .team-about-box {
    flex-direction: column;
    gap: 25px;
  }

  /* Disable sticky on mobile */
  .team-single-image {
    max-width: 100%;
    position: static !important;
  }

  /* Remove fixed height — let image scale naturally */
  .team-single-image figure {
    height: auto !important;
    border-radius: 15px;
  }

  .team-single-image img {
    width: 100%;
    height: auto !important;
    object-fit: cover;
  }

  .team-about-content {
    max-width: 100%;
  }
}

/* =====================================================
                 TEAM ABOUT SECTION - END 
   ===================================================== */

/* =====================================================
            WHAT WE DO SECTION - BG IMAGE FIX
   ===================================================== */

/* Remove old backgrounds coming from theme */
.what-we-do.bg-section.dark-section {
    background: none !important;
}

/* Apply new background image */
.what-we-do {
    position: relative;
    border-radius: 20px; /* rounded corners */
    overflow: hidden;   /* ensures rounded corners visible */
}

.what-we-do::before {
    content: "";
    position: absolute;
    inset: 0;
    background-image: url("../images/ariba-lab.jpg"); /* FIXED PATH */
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    z-index: 1;
}


/* Dark overlay */
.what-we-do::after {
    content: "";
    position: absolute;
    inset: 0;
    background: #0a2540;
    opacity: 0.70;
    z-index: 2;
}

/* Keep all content above bg + overlay */
.what-we-do .container {
    position: relative;
    z-index: 3;
}

/* =====================================================
            WHAT WE DO SECTION - BG IMAGE FIX END
   ===================================================== */