/*homepage padding */
.client-area {
	padding-top: 50px;
	padding-bottom: 50px;
}
.project-area {
	padding-top: 70px;
	padding-bottom: 60px;
}
.feature-area {
	padding: 60px 0;
}
/*service pages*/
.company-service-area {
	padding-top: 50px !important;
}
.about-service3-area { 
	padding: 60px 0 !important;
}
.how-we-do-details-area {
	padding-bottom: 60px;
}
.blog-details-area {
	padding-top: 60px; 
}

/* =================================================
SERVICE PAGE CSS (23-02-2026)
================================================= */

.new-release-hero-img-area {
	padding: 80px 0 0 0;
}

/* =================================================
BUTTON CSS (02-11-25)
================================================= */

/* Blog center button */
.center-btn-wrapper {
	text-align: center;
	margin-top: 20px;
}

.center-btn {
	display: inline-block;
	background-color: #1351d8;
	color: #fff;
	padding: 12px 30px;
	border-radius: 30px;
	text-decoration: none;
	transition: background-color 0.3s ease, color 0.3s ease;
}

.center-btn:hover {
	background-color: #000000;
	color: #fff;
}

/* =================================================
FEATURE HOME SECTION
================================================= */

/* Arrow default white */
.feature-right .feature-content .theme-btn i {
	color: #ffffff;
	transition: color 0.3s ease;
}

/* Arrow hover */
.feature-right .feature-content .theme-btn:hover i {
	color: #000000;
}

/* Button background */
.feature-right .feature-content .theme-btn::before,
.feature-right .feature-content .theme-btn::after {
	background: #ffffff;
}

/* Button position */
.feature-right .feature-content {
	position: relative;
}

.feature-right .feature-content .theme-btn {
	position: absolute;
	right: 20px;
	width: 55px;
	height: 48px;
	line-height: 35px;
}
.mobile-contact{
	display:none !important;
}
/* =================================================
PROJECT SECTION
================================================= */

.project-item .project-item-inner h2 a {
	color: #fff !important;
}

/* =================================================
TESTIMONIAL / FAQ
================================================= */

.testimonial-item .platform-name {
	background: #fff;
	width: 150px;
}

.faq-items-box .faq-col .faq-box:last-child {
	margin-bottom: 20px;
}

/* =================================================
HERO SECTION FIXES
================================================= */

.hero-service-about .hero-service-about-body p {
	border-bottom: none;
}

/* sufi 14-11-25 */
.hero-company-boxes {
	border-bottom: none;
}

/* =================================================
GLOBAL RESPONSIVE FIXES
================================================= */

/* Make media responsive */
img,
video,
iframe {
	max-width: 100%;
	height: auto;
}

/* Prevent horizontal scroll */
body,
html {
	overflow-x: hidden !important;
}

/* Prevent section overflow */
section,
.section_wrapper,
.content-wrapper {
	width: 100%;
	max-width: 100%;
}

/* =================================================
RESPONSIVE TYPOGRAPHY
================================================= */

@media (max-width: 992px) {

	h1 { font-size: 30px; }
	h2 { font-size: 25px; }
	h3 { font-size: 20px; }

	p,
	li,
	a,
	span {
		font-size: 16px;
	}

	.container,
	.custom-container,
	.section_wrapper {
		padding: 0 20px;
	}
}


/* =================================================
LARGE SCREEN RESPONSIVE
================================================= */

@media (max-width: 1920px) {

	.hero-section-wrap:not(.hero-home2) .hero-section-content-wrap {
		padding-top: 50px !important;
	}
	.hero-empowerment-area {
		padding-top: 50px !important;
	}
}

@media (max-width: 1700px) {

	.hero-company-boxes {
		padding-bottom: 50px;
	}
	/* sufi 09-11-25 */
	.cta-area {
		padding-bottom: 120px;
	}
	.hero-portfolio-wrap .hero-portfolio-body {
		padding-bottom: 50px !important;
	}
	.contact-area2 {
		padding-bottom: 50px !important;
	}
	/*05-03-26 home page css*/
	.homepage .how-we-do-area {
		padding-top: 50px !important;
	}
	.homepage .service-area {
		padding-top: 70px !important;
		padding-bottom: 70px !important;
	}
	.case-studio-area {
		padding-top: 50px !important;
		padding-bottom: 50px !important;
	}
	.feature3-area, .service-area, .pricing-table-area, .career-area, .feature3-style-2, .about-service7-area, .cta-area, .cta-area2, .about-area {
		padding-top: 60px !important;
		padding-bottom: 60px !important;
	}
	.solution-page .company-service-area, .client-area-2, .feature-page .service-area, .faq-style-2-area, .our-team-4-area, .career-area, .company-service-area, .portfolio-details-page .cta-area, .about-service7-area, .feature3-area, .our-team-2-area, .our-team-area, .testimonial-area {
		padding-bottom: 60px !important;
	}
	.news-area, .contact-area {
		padding: 60px 0 !important; 
	}
	/*about page */
	.hero-company-boxes {
		padding-bottom: 0px !important;
	}
	.our-team-2-area {
		padding-top: 60px !important;
	}
	.hero-career-wrap .hero-section-content-wrap {
		padding: 50px 0 !important;
	}
	/*contact page*/
	.hero-portfolio-wrap .hero-section-content-wrap,  {
		padding-bottom: 50px !important;
	}
	.hero-company-boxes {
		padding-bottom: 0 !important;
	}
	/*service  pages*/
	.about-service7-area .about-service7-body {
		padding: 40px 50px !important;
	}
	/*partner page*/
	.partner-service-area .partner-service-inner {
		padding-top: 65px  !important;
	}
	.cta-area {
		padding-top: 50px !important;
	}
	.testimonial-area {
        padding-top: 0 !important;
    }
	.blog-details-header-area .blog-details-header-content-body {
		padding: 60px 0 !important;
	}

}


@media (max-width: 1345px){
	.about-area .custom-row{
		align-items: center !important;
	}
	.about-area .left-content ul{
		display: flex;
		gap: 25px;
		list-style: none;
		flex-wrap: nowrap;
	}
	.about-area .left-content ul li + li{
		margin-top: 0 !important;
	}

}
/* =================================================
TABLET RESPONSIVE
================================================= */

@media (max-width: 1200px) {

	.new-release-hero-img-area {
		padding-top: 50px !important;
	}

	.client-area {
		padding-bottom: 50px !important;
		padding-top: 50px !important;
	}
	.how-we-do-area .how-we-do-left-content{
		width:auto !important;
		flex-direction:row !important;
	}
	.how-we-do-area .custom-row {
		gap: 15px !important;
	}
	.company-service-area {
		padding: 50px 0 180px 0;
	}

	.contact-area .contact-experience,
	.contact-area .contact-infos{
		width: 48% !important;
	}

}
/* =================================================
HEADER RESPONSIVE
================================================= */

@media (max-width: 991px) {

	.header-area .custom-row,
	.header-bar-body,
	.header-left,
	.header-right {
		flex-wrap: wrap;
	}

	.header-left,
	.header-right {
		width: 100%;
		justify-content: center !important;
		text-align: center;
	}


}

/* =================================================
BLOG / CONTACT MOBILE
================================================= */

@media (max-width: 768px) {

	.blog-details-pagination {
		flex-direction: column;
		gap: 15px;
	}

	.blog-details-pagination a {
		width: 100%;
		text-align: center;
	}

	.center-btn-wrapper {
		margin-bottom: 10px;
	}

	.contact-map-wrap h4 {
		top: 0 !important;
		right: 0 !important;
	}
	.case-studio-area .case-studio .case-studio-tabs {
		justify-content: left !important;
		gap: 4px;
	}
	.header-area .header-left {
		gap: 59% !important;
	}
	/*home page */
	.hero-empowerment-area .custom-row {
		padding-bottom: 50px !important;
	}
	.case-studio-area .case-studio .case-studio-tab-content .case-studio-body .right {
		max-width: 730px !important;
	}
	.feature-content{
		display: flex;
		align-items: center;
		justify-content: space-between;
		flex-wrap: wrap;
	}

	.feature-content ul{
		display: flex;
		flex-direction: column;
	}

	.feature-content .news-content{
		margin-left: auto;
	}

	.contact-area .contact-experience,
	.contact-area .contact-infos {
		width: 48% !important;
	}
}
/* =================================================
BUTTON RESPONSIVE
================================================= */

@media (max-width: 600px) {

	.theme-btn,
	button,
	input[type="submit"] {
		font-size: 14px;
		padding: 8px 14px;
	}
}

/* =================================================
SMALL MOBILE
================================================= */

@media (max-width: 585px) {

	.testimonial-item h1 {
		font-size: 19px !important;
	}
	.header-area .header-left {
		gap: 22% !important;


	}
	.header-bar .header-bar-body {
		gap: 10px !important;
	}
	.hero-empowerment-area {
		padding-top: 50px !important;
	}
	.contact-area .contact-experience,
	.contact-area .contact-infos  {
		width: 100% !important;
	}
	.how-we-do-area .how-we-do-left-content {
		flex-direction: column !important;
	}
	/*servive pages */
	.how-we-do-details-area {
		padding-bottom: 50px !important;
	}
	.blog-details-area{
		padding-top: 50px !important;
	}
	
}


@media (max-width: 390px) {

	.hero-service-wrap .hero-section-content-wrap {
		padding-bottom: 50px !important;
	}

	.client-area {
		padding-top: 0px;
		padding-bottom: 10px;
	}
	.header-area .header-left {
		gap: 11% !important;
	}
}

@media (max-width: 320px) {
	.header-left-right .theme-btn{
		display:none;
	}
	.header-area .header-left {
		gap: 36% !important;
	}
	.mobile-contact{
		display:block !important;
		text-align: left;
		margin-top: 5px;
	}
	.mobile-contact .theme-btn{
		color:#ffffff !important;
	}

	.mobile-contact .theme-btn:hover{
		color:#ffffff !important;
	}
	.feature-right .feature-content .theme-btn {
		    position: relative !important; 
	}

}