@import url('https://fonts.googleapis.com/css2?family=Poppins:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap');:root{--primary: #121212;--secondary: #555555;--border: rgba(18, 18, 18, 0.08);--theme: #121212;--black: #121212;--black-2: #555555;--white: #FFFFFF;--white-2: #999999;--action: #FFCD4D}@media only screen and (max-width: 767px){.pb-40{padding-bottom:30px}}.pb-45{padding-bottom:45px}@media only screen and (max-width: 767px){.pb-45{padding-bottom:30px}}.pb-50{padding-bottom:50px}@media only screen and (max-width: 767px){.pb-50{padding-bottom:30px}}@media only screen and (max-width: 767px){.pb-200{padding-bottom:100px}}.pt-10{padding-top:10px}.pt-15{padding-top:15px}.pt-20{padding-top:20px}.pt-25{padding-top:25px}.pt-30{padding-top:30px}@media only screen and (max-width: 767px){.pt-30{padding-top:25px}}.pt-35{padding-top:35px}@media only screen and (max-width: 767px){.pt-35{padding-top:30px}}.pt-40{padding-top:40px}@media only screen and (max-width: 767px){.pt-40{padding-top:30px}}.pt-150{padding-top:150px}@media only screen and (max-width: 1399px){.pt-150{padding-top:120px}}@media only screen and (max-width: 1199px){.pt-150{padding-top:100px}}@media only screen and (max-width: 991px){.pt-150{padding-top:90px}}@media only screen and (max-width: 767px){.pt-150{padding-top:60px}}
.pb-10{
	padding-bottom:10px
}
.pb-15{
	padding-bottom:15px
}
.pb-20{
	padding-bottom:20px
}
.pb-25{
	padding-bottom:25px
}
.pb-30{
	padding-bottom:30px
}
@media only screen and (max-width: 767px){
	.pb-30{
		padding-bottom:25px
	}
}
.pb-35{
	padding-bottom:35px
}
@media only screen and (max-width: 767px){
	.pb-35{
		padding-bottom:30px
	}
}
.pb-40{
	padding-bottom:40px
}
.pb-55{
	padding-bottom:55px
}
@media only screen and (max-width: 991px){
	.pb-55{
		padding-bottom:40px
	}
}
@media only screen and (max-width: 767px){
	.pb-55{
		padding-bottom:30px
	}
}
.pb-60{
	padding-bottom:60px
}
@media only screen and (max-width: 991px){
	.pb-60{
		padding-bottom:40px}
	}
@media only screen and (max-width: 767px){
	.pb-60{
		padding-bottom:30px
	}
}
.pb-65{
	padding-bottom:65px
}
@media only screen and (max-width: 991px){
	.pb-65{
		padding-bottom:40px
	}
}
@media only screen and (max-width: 767px){
	.pb-65{
		padding-bottom:30px
	}
}
.pb-70{
	padding-bottom:70px
}
@media only screen and (max-width: 991px){
	.pb-70{
		padding-bottom:50px
	}
}
@media only screen and (max-width: 767px){
	.pb-70{
		padding-bottom:35px
	}
}
.pb-75{
	padding-bottom:75px
}
@media only screen and (max-width: 991px){
	.pb-75{
		padding-bottom:50px
	}
}
@media only screen and (max-width: 767px){
	.pb-75{
		padding-bottom:35px
	}
}
.pb-80{
	padding-bottom:80px
}
@media only screen and (max-width: 991px){
	.pb-80{
		padding-bottom:50px
	}
}
@media only screen and (max-width: 767px){
	.pb-80{
		padding-bottom:35px
	}
}
.pb-85{
	padding-bottom:85px
}
@media only screen and (max-width: 991px){
	.pb-85{
		padding-bottom:60px
	}
}
@media only screen and (max-width: 767px){
	.pb-85{
		padding-bottom:35px
	}
}
.pb-90{
	padding-bottom:90px
}
@media only screen and (max-width: 1199px)
{
	.pb-90{
		padding-bottom:70px
	}
}
@media only screen and (max-width: 991px){
	.pb-90{
		padding-bottom:60px
	}
}
@media only screen and (max-width: 767px){
	.pb-90{
		padding-bottom:40px
	}
}
.pb-95{
	padding-bottom:95px
}
@media only screen and (max-width: 1199px){
	.pb-95{
		padding-bottom:70px
	}
}
@media only screen and (max-width: 991px){
	.pb-95{
		padding-bottom:60px
	}
}
@media only screen and (max-width: 767px){
	.pb-95{
		padding-bottom:40px
	}
}
.pb-100{
	padding-bottom:100px
}
@media only screen and (max-width: 991px){
	.pb-100{
		padding-bottom:90px
	}
}
@media only screen and (max-width: 767px){
	.pb-100{
		padding-bottom:60px
	}
}
.pb-105{
	padding-bottom:105px
}
@media only screen and (max-width: 991px){
	.pb-105{
		padding-bottom:90px
	}
}
@media only screen and (max-width: 767px){
	.pb-105{
		padding-bottom:60px
	}
}
.pb-110{
	padding-bottom:110px
}
@media only screen and (max-width: 1399px){
	.pb-110{
		padding-bottom:120px
	}
}
@media only screen and (max-width: 1199px){
	.pb-110{
		padding-bottom:100px
	}
}
@media only screen and (max-width: 991px){
	.pb-110{
		padding-bottom:90px
	}
}
@media only screen and (max-width: 767px){
	.pb-110{
		padding-bottom:60px
	}
}
.pb-115{
	padding-bottom:115px
}
@media only screen and (max-width: 1399px){
	.pb-115{
		padding-bottom:120px
	}
}
@media only screen and (max-width: 1199px){
	.pb-115{
		padding-bottom:100px
	}
}
@media only screen and (max-width: 991px){
	.pb-115{
		padding-bottom:90px
	}
}
@media only screen and (max-width: 767px){
	.pb-115{
		padding-bottom:60px
	}
}
.pb-120{
	padding-bottom:120px
}
@media only screen and (max-width: 1399px){
	.pb-120{
		padding-bottom:120px
	}
}
@media only screen and (max-width: 1199px){
	.pb-120{
		padding-bottom:100px
	}
}
@media only screen and (max-width: 991px){
	.pb-120{
		padding-bottom:90px
	}
}
@media only screen and (max-width: 767px){
	.pb-120{
		padding-bottom:60px
	}
}
.pb-125{
	padding-bottom:125px
}
@media only screen and (max-width: 1399px){
	.pb-125{
		padding-bottom:120px
	}
}
@media only screen and (max-width: 1199px){
	.pb-125{
		padding-bottom:100px
	}
}
@media only screen and (max-width: 991px){
	.pb-125{
		padding-bottom:90px
	}
}
@media only screen and (max-width: 767px){
	.pb-125{
		padding-bottom:60px
	}
}
.pb-130{
	padding-bottom:130px
}
@media only screen and (max-width: 1399px){
	.pb-130{
		padding-bottom:120px
	}
}
@media only screen and (max-width: 1199px){
	.pb-130{
		padding-bottom:100px
	}
}
@media only screen and (max-width: 991px){
	.pb-130{
		padding-bottom:90px
	}
}
@media only screen and (max-width: 767px){
	.pb-130{
		padding-bottom:60px
	}
}
.pb-135{
	padding-bottom:135px
}
@media only screen and (max-width: 1399px){
	.pb-135{
		padding-bottom:120px
	}
}
@media only screen and (max-width: 1199px){
	.pb-135{
		padding-bottom:100px
	}
}
@media only screen and (max-width: 991px){
	.pb-135{
		padding-bottom:90px
	}
}
@media only screen and (max-width: 767px){
	.pb-135{
		padding-bottom:60px
	}
}
.pb-140{
	padding-bottom:140px
}
@media only screen and (max-width: 1399px){
	.pb-140{
		padding-bottom:120px
	}
}
@media only screen and (max-width: 1199px){
	.pb-140{
		padding-bottom:100px
	}
}
@media only screen and (max-width: 991px){
	.pb-140{
		padding-bottom:90px
	}
}
@media only screen and (max-width: 767px){
	.pb-140{
		padding-bottom:60px
	}
}
.pb-145{
	padding-bottom:145px
}
@media only screen and (max-width: 1399px){
	.pb-145{
		padding-bottom:120px
	}
}
@media only screen and (max-width: 1199px){
	.pb-145{
		padding-bottom:100px
	}
}
@media only screen and (max-width: 991px){
	.pb-145{
		padding-bottom:90px
	}
}
@media only screen and (max-width: 767px){
	.pb-145{
		padding-bottom:60px
	}
}
.pb-150{
	padding-bottom:150px
}
@media only screen and (max-width: 1399px){
	.pb-150{
		padding-bottom:120px
	}
}
@media only screen and (max-width: 1199px){
	.pb-150{
		padding-bottom:100px
	}
}
@media only screen and (max-width: 991px){
	.pb-150{
		padding-bottom:90px
	}
}
@media only screen and (max-width: 767px){
	.pb-150{
		padding-bottom:60px
	}
}
.pb-160{
	padding-bottom:160px
}
@media only screen and (max-width: 1399px){
	.pb-160{
		padding-bottom:120px
	}
}
@media only screen and (max-width: 1199px){
	.pb-160{
		padding-bottom:100px
	}
}
@media only screen and (max-width: 991px){
	.pb-160{
		padding-bottom:90px
	}
}
@media only screen and (max-width: 767px){
	.pb-160{
		padding-bottom:60px
	}
}
.pb-170{
	padding-bottom:170px
}
@media only screen and (max-width: 1399px){
	.pb-170{
		padding-bottom:120px
	}
}
@media only screen and (max-width: 1199px){
	.pb-170{
		padding-bottom:100px
	}
}
@media only screen and (max-width: 991px){
	.pb-170{
		padding-bottom:90px
	}
}
@media only screen and (max-width: 767px){
	.pb-170{
		padding-bottom:60px
	}
}
.pb-180{
	padding-bottom:180px
}
@media only screen and (max-width: 1399px){
	.pb-180{
		padding-bottom:120px
	}
}
@media only screen and (max-width: 1199px){
	.pb-180{
		padding-bottom:100px
	}
}
@media only screen and (max-width: 991px){
	.pb-180{
		padding-bottom:90px
	}
}
@media only screen and (max-width: 767px){
	.pb-180{
		padding-bottom:60px
	}
}
.pb-190{
	padding-bottom:190px
}
@media only screen and (max-width: 1199px){
	.pb-190{
		padding-bottom:150px
	}
}
@media only screen and (max-width: 991px){
	.pb-190{
		padding-bottom:120px
	}
}
@media only screen and (max-width: 767px){
	.pb-190{
		padding-bottom:100px
	}
}
.pb-200{
	padding-bottom:200px
}
@media only screen and (max-width: 1199px){
	.pb-200{
		padding-bottom:150px
	}
}
@media only screen and (max-width: 991px){
	.pb-200{
		padding-bottom:120px
	}
}
.pt-45{
	padding-top:45px
}
@media only screen and (max-width: 767px){
	.pt-45{
		padding-top:30px
	}
}
.pt-50{
	padding-top:50px
}
@media only screen and (max-width: 767px){
	.pt-50{
		padding-top:30px
	}
}
.pt-55{
	padding-top:55px
}
@media only screen and (max-width: 991px){
	.pt-55{
		padding-top:40px
	}
}
@media only screen and (max-width: 767px){
	.pt-55{
		padding-top:30px
	}
}
.pt-60{
	padding-top:60px
}
@media only screen and (max-width: 991px){
	.pt-60{
		padding-top:40px
	}
}
@media only screen and (max-width: 767px){
	.pt-60{
		padding-top:30px
	}
}
.ptf-60{
	padding-top:60px
}
.pt-65{
	padding-top:65px
}
@media only screen and (max-width: 991px){
	.pt-65{
		padding-top:40px
	}
}
@media only screen and (max-width: 767px){
	.pt-65{
		padding-top:30px
	}
}
.pt-70{
	padding-top:70px
}
@media only screen and (max-width: 991px){
	.pt-70{
		padding-top:50px
	}
}
@media only screen and (max-width: 767px){
	.pt-70{
		padding-top:35px
	}
}
.pt-75{
	padding-top:75px
}
@media only screen and (max-width: 991px){
	.pt-75{
		padding-top:50px
	}
}
@media only screen and (max-width: 767px){
	.pt-75{
		padding-top:35px
	}
}
.pt-80{
	padding-top:80px
}
@media only screen and (max-width: 991px){
	.pt-80{
		padding-top:50px
	}
}
@media only screen and (max-width: 767px){
	.pt-80{
		padding-top:35px
	}
}
.pt-85{
	padding-top:85px
}
@media only screen and (max-width: 991px){
	.pt-85{
		padding-top:60px
	}
}
@media only screen and (max-width: 767px){
	.pt-85{
		padding-top:35px
	}
}
.pt-90{
	padding-top:90px
}
@media only screen and (max-width: 1199px){
	.pt-90{
		padding-top:70px
	}
}
@media only screen and (max-width: 991px){
	.pt-90{
		padding-top:60px
	}
}
@media only screen and (max-width: 767px){
	.pt-90{
		padding-top:40px
	}
}
.pt-95{
	padding-top:95px
}
@media only screen and (max-width: 1199px){
	.pt-95{
		padding-top:70px
	}
}
@media only screen and (max-width: 991px){
	.pt-95{
		padding-top:60px
	}
}
@media only screen and (max-width: 767px){
	.pt-95{
		padding-top:40px
	}
}
.pt-100{
	padding-top:100px
}
@media only screen and (max-width: 991px){
	.pt-100{
		padding-top:90px
	}
}
@media only screen and (max-width: 767px){
	.pt-100{
		padding-top:60px
	}
}
.pt-105{
	padding-top:105px
}
@media only screen and (max-width: 991px){
	.pt-105{
		padding-top:90px
	}
}
@media only screen and (max-width: 767px){
	.pt-105{
		padding-top:60px
	}
}
.pt-110{
	padding-top:110px
}
@media only screen and (max-width: 1399px){
	.pt-110{
		padding-top:120px
	}
}
@media only screen and (max-width: 1199px){
	.pt-110{
		padding-top:100px
	}
}
@media only screen and (max-width: 991px){
	.pt-110{
		padding-top:90px
	}
}
@media only screen and (max-width: 767px){
	.pt-110{
		padding-top:60px
	}
}
.pt-115{
	padding-top:115px
}
@media only screen and (max-width: 1399px){
	.pt-115{
		padding-top:120px
	}
}
@media only screen and (max-width: 1199px){
	.pt-115{
		padding-top:100px
	}
}
@media only screen and (max-width: 991px){
	.pt-115
	{
		padding-top:90px
	}
}
@media only screen and (max-width: 767px){
	.pt-115{
		padding-top:60px
	}
}
.pt-120{
	padding-top:120px
}
@media only screen and (max-width: 1399px){
	.pt-120{
		padding-top:120px
	}
}
@media only screen and (max-width: 1199px){
	.pt-120{
		padding-top:100px
	}
}
@media only screen and (max-width: 991px){
	.pt-120{
		padding-top:90px
	}
}
@media only screen and (max-width: 767px){
	.pt-120{
		padding-top:60px
	}
}
.pt-125{
	padding-top:125px
}
@media only screen and (max-width: 1399px){
	.pt-125{
		padding-top:120px
	}
}
@media only screen and (max-width: 1199px){
	.pt-125{
		padding-top:100px
	}
}
@media only screen and (max-width: 991px){
	.pt-125{
		padding-top:90px
	}
}
@media only screen and (max-width: 767px){
	.pt-125{
		padding-top:60px
	}
}
.pt-130{
	padding-top:130px
}
@media only screen and (max-width: 1399px){
	.pt-130{
		padding-top:120px
	}
}
@media only screen and (max-width: 1199px){
	.pt-130{
		padding-top:100px
	}
}
@media only screen and (max-width: 991px){
	.pt-130{
		padding-top:90px
	}
}
@media only screen and (max-width: 767px){
	.pt-130{
		padding-top:60px
	}
}
.pt-135{
	padding-top:135px
}
@media only screen and (max-width: 1399px){
	.pt-135{
		padding-top:120px
	}
}
@media only screen and (max-width: 1199px){
	.pt-135{
		padding-top:100px
	}
}
@media only screen and (max-width: 991px){
	.pt-135{
		padding-top:90px
	}
}
@media only screen and (max-width: 767px){
	.pt-135{
		padding-top:60px
	}
}
.pt-140{
	padding-top:140px
}
@media only screen and (max-width: 1399px){
	.pt-140{
		padding-top:120px
	}
}
@media only screen and (max-width: 1199px){
	.pt-140{
		padding-top:100px
	}
}
@media only screen and (max-width: 991px){
	.pt-140{
		padding-top:90px
	}
}
@media only screen and (max-width: 767px){
	.pt-140{
		padding-top:60px
	}
}
.pt-145{
	padding-top:145px
}
@media only screen and (max-width: 1399px){
	.pt-145{
		padding-top:120px
	}
}
@media only screen and (max-width: 1199px){
	.pt-145{
		padding-top:100px
	}
}
@media only screen and (max-width: 991px){
	.pt-145{
		padding-top:90px
	}
}
@media only screen and (max-width: 767px){
	.pt-145{
		padding-top:60px
	}
}
.mt-100{
	margin-top:100px
}
@media only screen and (max-width: 991px){
	.mt-100{
		margin-top:90px
	}
}
@media only screen and (max-width: 767px){
	.mt-100{
		margin-top:60px
	}
}
@media only screen and (max-width: 767px){
	.sm-pb-30{
		padding-bottom:30px
	}
}
@media only screen and (max-width: 767px){
	.sm-pb-40{
		padding-bottom:40px
	}
}
.mbm-1{
	margin-bottom:-1px
}
:root{
	--font_Poppin: "Poppins", sans-serif;
	--font_awesome: "Font Awesome 6 Free"
}
*{
	margin:0;
	padding:0
}
body{
	font-family:var(--font_Poppin);
	line-height:1;
	overflow-x: hidden;
}
html{
	scroll-behavior:smooth
}
h1,h2,h3,h4,h5,h6{
	padding:0;
	margin:0;
	color:var(--primary)
}
ul,ol{
	padding:0;
	margin:0
}
li{
	list-style:none
}
a{
	text-decoration:none;
	transition:all .3s;
	color:inherit
}
a:hover{
	color:var(--primary)
}
button{
	background-color:rgba(0,0,0,0);
	border:0
}
p{
	padding:0;
	margin:0;
	line-height:1.41;
	font-weight:400;
	font-size:18px;
	color:var(--secondary)
}
strong{
	font-weight:500
}
video,iframe,img{
	margin:0;
	padding:0
}
img{
	max-width:100%
}
.medium{
	font-weight:600
}
.bold{
	font-weight:700
}
@media only screen and (max-width: 767px){
	.g-0{padding-right:15px;
		padding-left:15px
	}
	.row.g-0{
		padding-right:0;
		padding-left:0
	}
	br{
		display:none
	}
}
	main{
		display:inline-block;
		width:100%
	}
	h1{
		font-size:48px
	}
	h2{
		font-size:36px
	}
	h3{
		font-size:32px
	}
	h4{
		font-size:24px
	}
	h5{
		font-size:20px
	}
	h6{
		font-size:18px}

:root{
	--font_Poppin: "Poppins", sans-serif;
}
.font-heading-Poppin-regular h1,.font-heading-P-regular h2,.font-heading-Poppin-regular h3,.font-heading-Poppin-regular h4,.font-heading-Poppin-regular h5,.font-heading-Poppin-regular h6{font-family:var(--font_Poppin);font-weight:400;line-height:1}.wc-btn-play.light{color:var(--white)}.wc-btn-play.light:hover{color:var(--white)}.wc-btn-play.dark{color:#ffffff}.wc-btn-play.dark:hover{color:#ffffff}.show-light{display:inline-block}.dark .show-light{display:none}
.show-dark{display:none}.list-plus li::before{content:"+";position:absolute;inset-inline-start:0;top:-10px;font-size:30px;font-weight:300;line-height:1}
.list-plus li:not(:last-child){margin-bottom:10px}.pos-center{position:absolute;top:50%;left:50%;transform:translate(-50%, -50%);z-index:1}.wcf__toggle_switcher.style-2 .after_label:after{transform:translatex(-100%)}.wcf__toggle_switcher.style-2 .slide-toggle-btn{gap:0;border-radius:60px}
html{
	--container-max-widths: 1320px
}
@media only screen and (max-width: 1399px){
	html{
		--container-max-widths: 1140px
	}
}
@media only screen and (max-width: 1199px){
	html{
		--container-max-widths: 960px
	}
}
@media only screen and (max-width: 991px){
	html{
		--container-max-widths: 720px}}@media only screen and (max-width: 767px){html{--container-max-widths: 540px}}body{background-color:#f5f5f5;color:var(--secondary)}
.dark body{
	background-color:#121212
}
.body-wrapper{
	background-color:var(--white);
	overflow:hidden
}
.img_anim_reveal{
	visibility:hidden;
	overflow:hidden
}
.img_anim_reveal img{
	-o-object-fit:cover;
	object-fit:cover;
	transform-origin:left
}
.anim-reveal{
	overflow:hidden
}
.anim-reveal-line{
	overflow:hidden
}
.color-white{
	color:var(--white)
}
.vertically-center{
	height:100%;
	display:flex;
	flex-direction:column;
	justify-content:center
}
.text-indent-40{
	text-indent:40px
}
.text-indent-50{
	text-indent:50px
}
header{
	margin-bottom:-1px;
	z-index:100
}
section{
	margin-bottom:-1px
}
.line-divider-sm{
	height:.5px;
	background-color:var(--black-9)
}
.dark .line-divider-sm{
	background-color:#e9e9e9
}
.admin-bar header,.admin-bar .body-wrapper{
	margin-top:32px
}
.swiper,.swiper-container{
	direction:ltr
}
.container-preloader{
	align-items:center;
	cursor:none;
	display:flex;
	height:100%;
	justify-content:center;
	position:fixed;
	left:0;
	top:0;
	width:100%;
	z-index:900
}
.container-preloader .animation-preloader{
	position:absolute;
	z-index:100
}
.container-preloader .animation-preloader .spinner{
	animation:spinner 1s infinite linear;
	border-radius:50%;
	height:9em;
	width:9em;
	border:10px solid var(--white);
	border-top-color:var(--primary);
	margin:0 auto 3.5em auto
}
@media only screen and (max-width: 767px){
	.container-preloader .animation-preloader .spinner{
		margin:0 auto .2em auto
	}
}
.container-preloader .animation-preloader .txt-loading{
	font:bold 5em "Montserrat",sans-serif;
	text-align:center;
	-webkit-user-select:none;
	-moz-user-select:none;
	user-select:none
}
.container-preloader .animation-preloader .txt-loading .characters{
	color:var(--white);
	position:relative;
	display:inline-block
}
.dark .container-preloader .animation-preloader .txt-loading .characters{
	color:rgba(0,0,0,.2)
}
@media only screen and (max-width: 767px){
	.container-preloader .animation-preloader .txt-loading .characters{
		font-size:50px
	}
}
.container-preloader .animation-preloader .txt-loading .characters:before{
	color:var(--primary);
	content:attr(data-text);
	animation:characters 4s infinite;
	left:0;
	top:0;
	opacity:0;
	position:absolute;
	transform:rotateY(-90deg)
}
.container-preloader .animation-preloader .txt-loading .characters:nth-child(2):before{
	animation-delay:.2s
}
.container-preloader .animation-preloader .txt-loading .characters:nth-child(3):before{
	animation-delay:.4s
}
.container-preloader .animation-preloader .txt-loading .characters:nth-child(4):before{
	animation-delay:.6s
}
.container-preloader .animation-preloader .txt-loading .characters:nth-child(5):before{
	animation-delay:.8s
}
.container-preloader .animation-preloader .txt-loading .characters:nth-child(6):before{
	animation-delay:1s
}
.container-preloader .loader-section{
	background-color:var(--black);
	height:100%;
	position:fixed;
	top:0;
	width:calc(50% + 1px)
}
.dark .container-preloader .loader-section{
	background-color:var(--white)
}
.container-preloader .loader-section.section-left{
	left:0
}
.container-preloader .loader-section.section-right{
	right:0
}
.loaded .animation-preloader{
	opacity:0;
	transition:.3s ease-out
}
.loaded .loader-section.section-left{
	transform:translateX(-101%);
	transition:.7s .3s all cubic-bezier(0.1, 0.1, 0.1, 1)
}
.loaded .loader-section.section-right{
	transform:translateX(101%);
	transition:.7s .3s all cubic-bezier(0.1, 0.1, 0.1, 1)
}
.scroll__down{
	display:flex;
	gap:20px;
	align-items:center
}
.scroll__down p{
	font-weight:500;
	font-size:14px;
	line-height:1.9;
	text-transform:uppercase;
	color:var(--white)
}
.scroll__down span{
	width:66px;
	height:106px;
	border:1px solid var(--black-6);
	display:flex;
	align-items:center;
	justify-content:center;
	border-radius:89px
}
.scroll__down span i{
	color:var(--white)
}
.scroll__down-wrapper{
	height:425px;
	display:flex;
	align-items:center;
	justify-content:center
}
@media only screen and (max-width: 1399px){
	.scroll__down-wrapper{
		height:380px
	}
}
@media only screen and (max-width: 1199px){
	.scroll__down-wrapper{
		height:350px
	}
}
@media only screen and (max-width: 767px){
	.scroll__down-wrapper{
		height:auto;padding:40px 0
	}
}
.scroll-top{
	width:50px;
	height:50px;
	position:fixed;
	right:15px;
	bottom:0px;'
	z-index:9999;
	background:var(--white);
	border-radius:100px;
	mix-blend-mode:exclusion;
	opacity:0;
	visibility:hidden;
	transition:all .5s
}
.scroll-top.showed{
	opacity:1;
	visibility:visible;
	bottom:20px
}
.go-top-writer{
	width:105px;
	font-size:16px;
	cursor:pointer;
	text-align:left;
	color:var(--white);
	background-image:url(../imgs/writer/go-top.webp);
	background-position:right center;
	background-repeat:no-repeat;
	right:16%;
	visibility:hidden;
	opacity:0;
	z-index:9;
	transition:all .5s
}
.dark .go-top-writer{
	color:var(--black);
	background-image:url(../imgs/writer/go-top-light.webp)
}
.go-top-writer:hover{
	color:var(--primary)
}
.go-top-writer.showed{
	opacity:1;
	visibility:visible;
	bottom:20px
}
@media only screen and (max-width: 767px){
	.go-top-writer br{
		display:block
	}
}
.progress-wrap{
	position:fixed;
	right:20px;
	bottom:20px;
	height:46px;
	width:46px;
	cursor:pointer;
	display:block;
	border-radius:50px;
	z-index:99;
	opacity:0;
	visibility:hidden;
	transform:translateY(15px);
	transition:all 200ms linear
}
.progress-wrap.active-progress{
	opacity:1;
	visibility:visible;
	transform:translateY(0)
}
.progress-wrap::after{
	position:absolute;
	content:"\f106";
	font:var(--fa-font-solid);
	text-align:center;
	line-height:46px;
	font-size:20px;
	color:var(--black);
	left:0;
	top:0;
	height:46px;
	width:46px;
	cursor:pointer;
	display:block;
	z-index:1;
	transition:all 200ms linear;
	border-radius:50px
}
.progress-wrap svg path{
	fill:var(--black-6)
}
.progress-wrap svg.progress-circle path{
	fill:var(--white);
	stroke:var(--theme);
	stroke-width:5;
	box-sizing:border-box;
	transition:all 200ms linear
}
.light .scroll__down p{
	color:var(--black)
}
.light .scroll__down span{
	border-color:var(--white-3)
}
.light .scroll__down span i{
	color:var(--black)
}
.light.go-top-writer{
	color:var(--black);
	background-color:rgba(0,0,0,0);
	background-image:url(../imgs/writer/go-top-light.webp)
}
.light.progress-wrap{
	margin:0;
	background-color:rgba(0,0,0,0)
}
.light.progress-wrap svg path{
	fill:var(--black)
}
.light.progress-wrap::after{
	color:var(--white)
}
.b-radius{
	border-radius:12px
}
.wc-btn{
	display:inline-flex;
	transition:all .3s
}
.wc-btn-border:hover{
	color:var(--white)
}
.dark .wc-btn-border{
	color:#ffffff;
	border-color:var(--black)
}
.dark .wc-btn-border:hover{
	color:#ffffff
}
.wc-btn-primary{
	padding:21px 30px;
	font-weight:700;
	font-size:16px;
	line-height:1;
	color:#ffffff;
	background-color:var(--primary);
	border:1px solid var(--primary);
	border-radius:15px;
	text-transform:capitalize;
	transition:all .3s;
	display:inline-flex;
	align-items:center;
	justify-content:center;
	overflow:hidden;
	z-index:1;gap:30px;white-space:nowrap;}.dark .wc-btn-primary{color:#ffffff;}@media only screen and (max-width: 991px){.wc-btn-primary{padding:16px 25px;background-color:#2B81C3;}}.wc-btn-circle{text-align:center;width:70px;height:70px;font-weight:500;font-size:16px;line-height:1.5;color:#ffffff;border-radius:100%;display:flex;gap:10px;align-items:center;justify-content:center;background-color:#2B81C3;}@media only screen and (max-width: 1199px){.wc-btn-circle{width:50px;height:50px;background-color:#2B81C3;}}.wc-btn-circle:hover{background-color:#2B81C3;color:#ffffff}.wc-btn-link i{transform:rotate(-45deg);transition:all .3s}.wc-btn-link:hover{color:var(--primary)}.wc-btn-link:hover i{transform:rotate(0);color:var(--primary)}.wc-btn-group{display:flex;width:-moz-fit-content;width:fit-content}.wc-btn-group>*:nth-child(1){transform:scale3d(0.5, 0.5, 1);margin-inline-end:-40px}.wc-btn-group>*:nth-child(2){transform:scale3d(1, 1, 1)}.wc-btn-group>*:nth-child(3){transform:scale3d(1, 1, 1);margin-inline-start:0}.wc-btn-circle{background-color:var(--theme);width:40px;height:40px;font-size:14px}.wc-btn-circle:hover{background-color:var(--theme)}.wc-btn-circle i{transform:rotate(-45deg)}.wc-btn-primary{font-size:14px;font-weight:400;text-transform:uppercase;background-color:var(--theme);border-color:rgba(0,0,0,0);color:#ffffff;padding:0 22px;border-radius:40px}.wc-btn-group:hover>*:nth-child(1){transform:scale3d(1, 1, 1);margin-inline-end:0}.wc-btn-group:hover>*:nth-child(2){transform:scale3d(1, 1, 1)}.wc-btn-group:hover>*:nth-child(3){transform:scale3d(0.5, 0.5, 1);margin-inline-start:-40px}.main-menu.menu-dark>ul>li>a{color:var(--black)}.main-menu.menu-light>ul>li>a{color:var(--white)}.main-menu>ul{display:flex}.main-menu>ul>li:hover>a{color:var(--primary)}.main-menu>ul>li:hover>ul{opacity:1;pointer-events:all;inset-inline-start:0}.main-menu>ul>li:hover>ul.dp-menu li:hover>ul{opacity:1;pointer-events:all;inset-inline-start:100%;visibility:visible}.main-menu li{position:relative}.main-menu li a{display:flex;align-items:center;font-weight:400;font-size:16px;line-height:1;color:var(--primary);padding:37px 15px;text-transform:uppercase}.main-menu ul.dp-menu{background-color:#232529;padding:18px 0px;width:240px;position:absolute;inset-inline-start:10px;opacity:0;pointer-events:none;z-index:10;transition:all .5s}.main-menu ul.dp-menu ul{background:#232529;padding:18px 0px;width:230px;position:absolute;inset-inline-start:calc(100% + 10px);top:0;opacity:0;z-index:10;transition:all .5s;visibility:hidden}.main-menu ul.dp-menu li{position:relative;padding:0 25px}.main-menu ul.dp-menu li:hover>a{color:var(--white);background-color:rgba(0,0,0,0)}.main-menu ul.dp-menu li:hover>ul{opacity:1;transform:none !important;pointer-events:all}.main-menu ul.dp-menu li a{font-size:16px;font-weight:500;color:#999;padding:10px 0;background-color:rgba(0,0,0,0);border-radius:8px;text-transform:capitalize}.main-menu ul.dp-menu li a:hover{letter-spacing:.5px}.main-menu ul.dp-menu li a:after{transform:rotate(-90deg);margin-left:auto}.main-menu ul.dp-menu.col-2{-moz-column-count:2;column-count:2;width:500px}.main-menu .has-mega-menu{position:static}.main-menu li.menu-item-has-children>a:after{font-family:var(--font_awesome);margin-inline-start:5px;font-weight:600;font-size:14px}.main-menu .mega-menu{background-color:var(--black);padding:30px 50px;width:100%;position:absolute;left:10px;display:grid;grid-template-columns:repeat(4, 1fr);-moz-column-gap:50px;column-gap:50px;justify-content:center;overflow:hidden;opacity:0;pointer-events:none;z-index:10;transition:all .5s}@media only screen and (max-width: 1399px){.main-menu .mega-menu{-moz-column-gap:30px;column-gap:30px}}.main-menu .mega-menu li:has(ul)>a:after{content:""}.main-menu .mega-menu li a{font-size:16px;font-weight:500;color:#999;height:40px;padding:0 20px;display:flex;align-items:center;gap:8px;background:var(--black);border-radius:8px;overflow:hidden}.main-menu .mega-menu li a:hover{color:var(--white);background:#2c2c2f}.main-menu .mega-menu .title{font-weight:600;color:var(--white);text-transform:uppercase;border-bottom:1px solid #333337;padding-bottom:20px;margin-bottom:20px;pointer-events:none;border-radius:0}.main-menu .mega-style-2{padding:0 15%;gap:0;grid-template-columns:repeat(2, 1fr)}.main-menu .mega-style-2 .title{height:70px;padding-bottom:0;margin-bottom:0;position:relative;overflow:visible;padding-left:30px}.main-menu .mega-style-2 .title:after{position:absolute;content:"";width:5000px;height:1px;background-color:#333337;bottom:-1px;left:50%;transform:translateX(-50%)}.main-menu .mega-style-2>li:not(:first-child){border-left:1px solid #333337}.main-menu .mega-style-2 ul{-moz-column-count:2;column-count:2;position:relative;padding:20px 0}.main-menu .mega-style-2 ul:after{position:absolute;content:"";width:1px;height:700px;background-color:#333337;top:0;left:50%;z-index:1}.main-menu .mega-style-2 ul li a{padding-left:30px}.main-menu .mega-style-3{padding:0 0 0 20px;gap:0;grid-template-columns:repeat(3, 1fr)}.main-menu .mega-style-3 .title{height:70px;padding-bottom:0;margin-bottom:0;position:relative;overflow:visible;padding-left:30px}.main-menu .mega-style-3 .title:after{position:absolute;content:"";width:5000px;height:1px;background-color:#333337;bottom:-1px;left:50%;transform:translateX(-50%)}.main-menu .mega-style-3>li:not(:first-child){border-left:1px solid #333337}.main-menu .mega-style-3>li:last-child{border:none;width:36vw}@media only screen and (max-width: 1399px){.main-menu .mega-style-3>li:last-child{width:32vw}}.main-menu .mega-style-3 ul{-moz-column-count:2;column-count:2;position:relative;padding:20px 0;-moz-column-gap:0;column-gap:0}.main-menu .mega-style-3 ul:after{position:absolute;content:"";width:1px;height:700px;background-color:#333337;top:0;left:50%;z-index:1}.main-menu .mega-style-3 ul li{margin:0 10px}.main-menu .mega-style-3 ul li a{padding-left:20px}.main-menu .mega-grid-6{grid-template-columns:repeat(6, 1fr)}.main-menu .mega-grid-2{grid-template-columns:repeat(2, 1fr);row-gap:60px}.main-menu .list-3-column ul{display:grid;grid-template-columns:repeat(3, 1fr);-moz-column-gap:50px;column-gap:50px}@media only screen and (max-width: 1399px){.main-menu .list-3-column ul{-moz-column-gap:30px;column-gap:30px}}.main-menu .span-first-item ul li:first-child{grid-column:1/-1;-moz-column-span:all;column-span:all}.main-menu .new{font-size:10px;font-weight:600;background:#ffa38e;color:var(--black);padding:3px 7px;line-height:1;border-radius:2px;margin-inline-start:8px;display:inline-block}
/* Base styles for the header */
/* ============================= */
/* ✅ HEADER AREA */
/* ============================= */

.header-area {
  position: fixed;
  top: 0;
  inset-inline-start: 0;
  inset-inline-end: 0;
  width: 100%;
  background-color: white;
  box-sizing: border-box;
  z-index: 999;
}

@media (min-width: 1400px) {
  .header-area .container {
    max-width: 1850px;
  }
}

/* Header inner layout */
.header-area .header-area__inner {
  display: flex;
  align-items: center;
  gap: 20px;
  position: relative;
  height: 100px;
  border-bottom: 1px solid var(--border);
}

@media only screen and (max-width: 1919px) {
  .header-area .header-area__inner {
    height: 80px;
  }
}

@media only screen and (max-width: 430px) {
  .header-area .header-area__inner {
    height: 55px;
  }
}

.header-area .header-area__inner > *:nth-child(1) {
  margin-inline-end: auto;
}

@media (max-width: 575px) {
  .header-area .header__meta {
    display: none;
  }
}

/* ============================= */
/* ✅ LOGO RESPONSIVE SIZE */
/* ============================= */

.header__logo {
  display: flex;
  align-items: center;
}

.header__logo img {
  height: 80px;
  width: auto;
  max-width: 150px;
  object-fit: contain;
  transition: all 0.3s ease;
}

/* Large screens (≥1600px) */
@media (min-width: 1600px) {
  .header__logo img {
    max-width: 200px;
    height: 100px;
  }
}

/* Medium (992–1599px) */
@media (max-width: 1599px) and (min-width: 992px) {
  .header__logo img {
    max-width: 150px;
    height: 80px;
  }
}

/* Tablets ≤991px */
@media (max-width: 991px) {
  .header__logo {
    justify-content: center;
  }
  .header__logo img {
    max-width: 120px;
    height: 50px;
  }
}

/* Phones ≤575px */
@media (max-width: 575px) {
  .header__logo img {
    max-width: 110px;
    height: 45px;
  }
}

/* Small phones ≤400px */
@media (max-width: 400px) {
  .header__logo img {
    max-width: 90px;
    height: 38px;
  }
}

/* Fluid container */
.header-area .container {
  padding: 0 20px;
  max-width: 100%;
  box-sizing: border-box;
}

/* ============================= */
/* ✅ HERO BANNER (Improved spacing) */
/* ============================= */

.hero-banner {
  position: relative;
  margin-top: 90px;
  z-index: 1;
  overflow: hidden;
  height: 90vh;
}

/* Surface Pro / large tablets */
@media (max-width: 1368px) and (min-width: 1025px) {
  .hero-banner {
    margin-top: 85px;
    height: 80vh;
    margin-bottom: -350px;
  }
}

/* iPad Pro / iPad Mini */
@media (max-width: 1024px) and (min-width: 768px) {
  .hero-banner {
    margin-top: 80px;
    height: 70vh;
    margin-bottom: -300px;
  }
}

/* Surface Duo / large phones */
@media (max-width: 767px) and (min-width: 540px) {
  .hero-banner {
    margin-top: 75px;
    height: 65vh;
    margin-bottom: -260px;
  }
}

/* iPhone 14 Pro Max / regular phones */
@media (max-width: 576px) {
  .hero-banner {
    margin-top: 80px;
    height: 55vh;
    margin-bottom: -280px;
  }
}

/* iPhone SE */
@media (max-width: 414px) {
  .hero-banner {
    margin-top: 70px;
    height: 50vh;
    margin-bottom: -220px;
  }
}

@media (max-width: 375px) {
  .hero-banner {
    margin-top: 65px;
    height: 48vh;
    margin-bottom: -200px;
  }
}

/* Very small phones */
@media (max-width: 360px) {
  .hero-banner {
    margin-top: 60px;
    height: 45vh;
    margin-bottom: -180px;
  }
}

/* Extra wide screens */
@media (min-width: 1800px) {
  .container.large {
    max-width: 1750px;
  }
}

/* ============================= */
/* ✅ HERO AREA (balanced spacing) */
/* ============================= */

.hero-area-inner {
  position: relative;
  z-index: 1;
  padding-top: 60px;
  padding-bottom: 60px;
}

/* Surface Pro / iPad Pro */
@media (max-width: 1368px) and (min-width: 1025px) {
  .hero-area-inner {
    padding-top: 80px;
    padding-bottom: 80px;
  }
}

/* iPad Mini / Surface Duo */
@media (max-width: 1024px) and (min-width: 540px) {
  .hero-area-inner {
    padding-top: 150px;
    padding-bottom: 70px;
  }
}

/* iPhone SE */
@media (max-width: 414px) {
  .hero-area-inner {
    padding-top: 55px;
    padding-bottom: 55px;
  }
}
/* iPhone SE */
@media (max-width: 820px) {
  .hero-area-inner {
    padding-top: 30px;
    padding-bottom: 30px;
  }
}

/* Hero subtitle & title */
.hero-area .section-subtitle {
  font-size: 20px;
  text-transform: uppercase;
  font-family: var(--font_Poppin);
  color: var(--primary);
  font-weight: 500;
  display: inline-flex;
  gap: 15px;
  align-items: center;
}

@media only screen and (max-width: 1199px) {
  .hero-area .section-subtitle {
    font-size: 16px;
  }
  .hero-area .section-subtitle img {
    height: 10px;
  }
}

.hero-area .section-title {
  font-size: 70px;
  line-height: .92;
  font-weight: 300;
}

@media only screen and (max-width: 1919px),
       only screen and (max-width: 1199px) {
  .hero-area .section-title {
    font-size: 50px;
  }
}

@media only screen and (max-width: 991px) {
  .hero-area .section-title {
    font-size: 40px;
  }
}

@media only screen and (max-width: 767px) {
  .hero-area .section-title {
    font-size: 30px;
  }
}

.hero-area .section-content {
  display: grid;
  gap: 30px 60px;
  grid-template-columns: auto 380px;
}

@media only screen and (max-width: 991px) {
  .hero-area .section-content {
    grid-template-columns: auto 340px;
  }
}

@media only screen and (max-width: 767px) {
  .hero-area .section-content {
    grid-template-columns: auto;
  }
}

.hero-area .section-content .title-wrapper {
  margin-top: 33px;
}

.hero-area .section-content .text-wrapper {
  margin-top: 59px;
}

@media only screen and (max-width: 1919px) {
  .hero-area .section-content .text-wrapper {
    margin-top: 39px;
  }
}

.hero-area .section-content .btn-wrapper {
  margin-top: 33px;
}
@media (prefers-color-scheme: dark) {
	.header__logo .show-dark {
		display: inline;
	}
}
@media (max-width: 1024px) {
	.header-area .header-area__inner {align-items: center !important; /* ensures logo is vertically centered */height: 90px !important;        /* gives enough height to contain logo */}.header__logo {display: flex;align-items: center;}.header__logo img {width: 160px !important;height: auto !important;object-fit: contain;margin-top: 0 !important;margin-bottom: 0 !important;}}@media (min-width: 1024px) and (max-width: 1366px) {.header-area .header-area__inner {align-items: center !important;height: 95px !important;}.header__logo {display: flex;align-items: center;justify-content: flex-start;}.header__logo img {width: 180px !important;height: auto !important;object-fit: contain !important;margin: 0 !important;}}.about-area{}.dark .about-area{}.about-area-inner{padding-top:130px;padding-bottom:143px}@media only screen and (max-width: 1919px){.about-area-inner{padding-top:100px;padding-bottom:113px}}@media only screen and (max-width: 767px){.about-area-inner{padding-top:60px;padding-bottom:63px}}@media only screen and (max-width: 767px){.about-area .text-wrapper .text{margin-inline-start:0;max-width:100%}}.tools-area{background-color:#2B81C3;color: #000000;}.dark .tools-area{background-color:#1b1b1b}.tools-area-inner{padding-top:211px;display:flex;gap:40px 80px;justify-content:space-between;}@media only screen and (max-width: 1919px){.tools-area-inner{padding-top:181px}}@media only screen and (max-width: 1199px){.tools-area-inner{padding-top:101px}}@media only screen and (max-width: 767px){.tools-area-inner{flex-direction:column}}.tools-area .section-content{max-width:557px}.tools-area .section-content .text{max-width:360px}.tools-area .section-thumb{margin-top:-61px}@media only screen and (max-width: 1199px){.tools-area .section-thumb{margin-top:0}}.clients-area { padding-top: 130px; } @media only screen and (max-width: 1919px) { .clients-area { padding-top: 100px; } } .clients-area .section-header { text-align: center; } .clients-area .section-title-wrapper { display: flex; justify-content: center; } .clients-area .section-title { max-width: 940px; margin: 0 auto; } .clients-area .clients-wrapper-box { margin-top: 64px; } @media only screen and (max-width: 1399px) { .clients-area .clients-wrapper-box { margin-top: 44px; } } @media only screen and (max-width: 1199px) { .clients-area .clients-wrapper-box { margin-top: 34px; } }.clients-area .clients-wrapper { display: grid; grid-template-columns: repeat(5, 1fr); border-top: 1px solid var(--border); border-inline-start: 1px solid var(--border); } @media only screen and (max-width: 767px) { .clients-area .clients-wrapper { grid-template-columns: repeat(4, 1fr); } } @media (max-width: 575px) { .clients-area .clients-wrapper { grid-template-columns: repeat(2, 1fr); } } /* Client Box */ .clients-area .client-box { height: 170px; padding: 20px; border-inline-end: 1px solid var(--border); border-bottom: 1px solid var(--border); display: inline-flex; justify-content: center; align-items: center; perspective: 1000px; /* for 3D effect */ } @media only screen and (max-width: 1919px) { .clients-area .client-box { height: 150px; } } @media only screen and (max-width: 1199px) { .clients-area .client-box { height: 120px; } } @media only screen and (max-width: 767px) { .clients-area .client-box { height: 100px; } } /* Flip Animation (runs once per hover) */ .client-rotate { display: inline-block; } @keyframes flipOnce { 0% { transform: rotateY(0deg); } 100% { transform: rotateY(360deg); } } .client-rotate img { max-height: 100%; max-width: 100%; object-fit: contain; backface-visibility: visible; /* always visible while flipping */ } /*footers area start*/ .footers-area{ background-color:#121212; } .dark .footers-area{ background-color:#1b1b1b } .footers-area-inner{ padding-top:103px; position:relative; z-index:1 } @media only screen and (max-width: 1919px){ .footers-area-inner{ padding-top:73px } } .copyright-area .footers-nav-list a{ font-size:16px; color:var(--white) } .copyright-area .footers-nav-list a:hover{ color:var(--white-2) } .footers-area{background-color:var(--black);padding:0 45px;border-radius:20px}.dark .footers-area{background-color:#1c1c1c}@media only screen and (max-width: 991px){.footers-area{padding:0 15px}}.footers-area-inner{display:grid;gap:80px 50px;grid-template-columns:365px 190px 190px 385px;justify-content:space-between;overflow:hidden;padding-top:130px;padding-bottom:130px}@media only screen and (max-width: 1919px){.footers-area-inner{padding-top:100px;padding-bottom:100px;grid-template-columns:265px 190px 190px 385px}}@media only screen and (max-width: 1399px){.footers-area-inner{padding-top:80px;padding-bottom:80px;grid-template-columns:225px 160px 160px 305px}}@media only screen and (max-width: 1199px){.footers-area-inner{padding-top:60px;padding-bottom:60px;gap:50px 60px;grid-template-columns:auto auto auto}}@media only screen and (max-width: 767px){.footers-area-inner{grid-template-columns:auto auto}}@media(max-width: 575px){.footers-area-inner{grid-template-columns:auto}}.footers-area .footers-area-inner>*{min-width:130px}@media only screen and (max-width: 1199px){.footers-area .footers-area-inner>*.newsletter{grid-column:span 2}}@media only screen and (max-width: 767px){.footers-area .footers-area-inner>*.newsletter{order:1}}@media(max-width: 575px){.footers-area .footers-area-inner>*.newsletter{grid-column:auto}}.footers-area .footers-logo img{max-height:42px}@media only screen and (max-width: 1199px){.footers-area .footers-logo img{max-height:34px}}.footers-area .info-text{max-width:270px;margin-top:26px;color:var(--white-2)}.footers-area .footers-widget-wrapper .title{color:var(--white);font-size:24px;font-weight:500;line-height:.73}@media only screen and (max-width: 1399px){.footers-area .footers-widget-wrapper .title{font-size:24px}}@media only screen and (max-width: 1199px){.footers-area .footers-widget-wrapper .title{font-size:22px}}.footers-area .footers-nav-list{margin-top:27px}.footers-area .footers-nav-list li{font-size:18px;line-height:30px;color:var(--white-2)}.footers-area .footers-nav-list li a:hover{color:var(--white)}.footers-area .footers-nav-list li .location{margin-bottom:22px;display:inline-block}.footers-area .social-links{display:flex;gap:20px;margin-top:56px}@media only screen and (max-width: 1199px){.footers-area .social-links{margin-top:36px}}.footers-area .social-links li{line-height:1}.footers-area .social-links li a{color:var(--white-2)}.footers-area .social-links li a:hover{color:var(--white)}.footers-area .newsletter-text{margin-top:29px}.footers-area .newsletter-text .text{color:var(--white-2)}.subscribe-form .input-field .icon{color:var(--white-2)}.subscribe-form .policy-field{margin-top:20px}.subscribe-form .policy-field label{font-size:14px;margin-inline-start:6px}.subscribe-form .policy-field label span{color:var(--primary);font-weight:500} .copyright-area-inner{border-top:1px solid rgba(255,255,255,.08);padding:32px 0;position:relative}@media only screen and (max-width: 1399px){.copyright-area-inner{padding:22px 0}}.copyright-area .copyright-text .text{text-align:center;font-weight:500;color:var(--white-2)}.copyright-area .copyright-text .text a{color:var(--white)} .about-area-1 .thumbs{ width:100%; aspect-ratio:100/118; position:relative; max-width:610px } .about-area-1 .thumbs img{ border-radius:5px } .about-area-1 .thumbs .img-1{ width:49%; position:absolute; top:9%; inset-inline-start:0 } .about-area-1 .thumbs .img-2{ position:absolute; inset-inline-end:0; top:0; width:41% } .about-area-1 .thumbs .img-3{ position:absolute; bottom:0; inset-inline-start:26%; width:59% } .about-area-1 .about-area-inner{ display:grid; gap:50px 60px; grid-template-columns:610px 444px; justify-content:space-between; align-items:center } @media only screen and (max-width: 1399px){ .about-area-1 .about-area-inner{ grid-template-columns:510px 444px } } @media only screen and (max-width: 1199px){ .about-area-1 .about-area-inner{ grid-template-columns:410px 400px } } @media only screen and (max-width: 991px){ .about-area-1 .about-area-inner{ grid-template-columns:1fr } } .about-area-1 .section-content .text-wrapper{ margin-top:33px } @media only screen and (max-width: 1199px){ .about-area-1 .section-content .text-wrapper{ margin-top:23px } } .about-area-1 .section-content .btn-wrapper{ margin-top:43px; display:flex; gap:30px; align-items:center } @media only screen and (max-width: 1199px){ .about-area-1 .section-content .btn-wrapper{ margin-top:33px } } .about-area-1 .experience-box{ margin-top:55px } @media only screen and (max-width: 1199px){ .about-area-1 .experience-box{ margin-top:35px } } .about-area-1 .experience-box .number{ font-size:100px; font-weight:500; display:flex; align-items:flex-start } @media only screen and (max-width: 1199px){ .about-area-1 .experience-box .number{ font-size:70px } } .about-area-1 .experience-box .number i{ font-size:18px; margin-top:12px; margin-inline-start:9px } @media only screen and (max-width: 1199px){ .about-area-1 .experience-box .number i{ margin-top:10px } } .about-area-1 .experience-box .info{ font-size:18px; line-height:1.2; max-width:180px; font-weight:600; margin-top:10px }.carousel-area .carousels-wrapper{display:grid;gap:10px}.carousel-slider-active .swiper-slide{width:auto}.carousel-slider-active .swiper-wrapper{transition-timing-function:linear}.carousel-box{position:relative;max-width:880px}@media only screen and (max-width: 1919px){.carousel-box{max-width:780px}}@media only screen and (max-width: 1399px){.carousel-box{max-width:680px}}@media only screen and (max-width: 1199px){.carousel-box{max-width:580px}}@media only screen and (max-width: 991px){.carousel-box{max-width:480px}}@media only screen and (max-width: 767px){.carousel-box{max-width:380px}}.carousel-box:hover .content{opacity:1;visibility:visible}.carousel-box .content{position:absolute;width:100%;height:100%;top:0;inset-inline-start:0;background-color:rgba(255,255,255,.9);display:flex;flex-direction:column;justify-content:end;padding:45px 45px 50px;opacity:0;visibility:hidden;transition:all .5s;direction:ltr}.carousel-box .icon{position:absolute;inset-inline-end:45px;top:45px}.carousel-box .title{font-size:30px;text-transform:uppercase;color:var(--black)}.carousel-box .meta{font-size:14px;display:inline-block;margin-top:8px;color:var(--black-2)} :root{--theme: #2B81C3}.section-title{font-size:60px}@media only screen and (max-width: 1919px){.section-title{font-size:55px}}@media only screen and (max-width: 1199px){.section-title{font-size:46px}}@media only screen and (max-width: 991px){.section-title{font-size:40px}}@media only screen and (max-width: 767px){.section-title{font-size:35px}}.section-title span{font-weight:700} .section-spacing{padding-top:150px;padding-bottom:150px}@media only screen and (max-width: 1919px){.section-spacing{padding-top:120px;padding-bottom:120px}}@media only screen and (max-width: 1399px){.section-spacing{padding-top:100px;padding-bottom:100px}}@media only screen and (max-width: 1199px){.section-spacing{padding-top:60px;padding-bottom:60px}}.section-spacing-top{padding-top:150px}@media only screen and (max-width: 1919px){.section-spacing-top{padding-top:120px}}@media only screen and (max-width: 1399px){.section-spacing-top{padding-top:100px}}@media only screen and (max-width: 1199px){.section-spacing-top{padding-top:60px}}.section-spacing-bottom{padding-bottom:150px}@media only screen and (max-width: 1919px){.section-spacing-bottom{padding-bottom:120px}}@media only screen and (max-width: 1399px){.section-spacing-bottom{padding-bottom:100px}}@media only screen and (max-width: 1199px){.section-spacing-bottom{padding-bottom:60px}} /* ================================ Global Appearance Section ================================== */ .globe-sec { padding: 100px 0; /* section spacing */ } .globe-sec .section-header { text-align: center; margin-bottom: 50px; } .globe-sec .section-title { font-size: 70px; line-height: 1; display: inline-block; position: relative; } @media only screen and (max-width: 1199px) { .globe-sec .section-title { font-size: 50px; } } @media only screen and (max-width: 991px) { .globe-sec .section-title { font-size: 40px; } } @media only screen and (max-width: 767px) { .globe-sec .section-title { font-size: 35px; } } /* ================================ Intro Content (paragraphs) ================================== */ .globe-sec .works-wrapper { display: grid; gap: 90px 50px; grid-template-columns: repeat(2, 1fr); } @media only screen and (max-width: 1199px) { .globe-sec .works-wrapper { gap: 40px 30px; } } @media (max-width: 575px) { .globe-sec .works-wrapper { grid-template-columns: repeat(1, 1fr); } } .globe-sec .works-wrapper .content { grid-column: span 2; text-align: center; max-width: 900px; margin: 0 auto; } .globe-sec .works-wrapper .content p.text { font-size: 16px; line-height: 1.7; color: #1a202c; margin-bottom: 20px; } /* ================================ Globe Wrapper (map + hotspots) ================================== */ .globe-wrapper { grid-column: span 2; position: relative; padding: 0 0 35px; max-width: 1000px; margin: 0 auto; } .world-globe { width: 100%; } .hotspots { position: absolute; top: 0; right: 0; bottom: 0; left: 0; } .point { border-radius: 100%; cursor: pointer; position: absolute; display: flex; justify-content: center; align-items: center; width: 40px; height: 40px; transform: translate(-50%, -50%); } .point:hover { z-index: 9; } .point .dot img { width: 20px; height: 20px; } .tooltip-wrapper { background-color: #fff; padding: 0; min-width: 180px; justify-content: center; align-items: center; position: absolute; bottom: 55px; z-index: 1; border-radius: 8px; box-shadow: 6px 4px 14px 10px #10182814; opacity: 0; max-height: 0; transition: 0.5s ease-in-out; overflow: hidden; display: flex; flex-direction: column; text-align: center; } .point:hover .tooltip-wrapper { max-height: 1000px; opacity: 1; min-width: 180px; padding: 12px; overflow: initial; } .tooltip-wrapper img { width: 20px; height: 20px; } .tooltip-wrapper h2 { font-size: 18px; margin-top: 9px; color: #23457b; font-weight: 500; } .tooltip-wrapper h3 { font-size: 15px; color: #6f6f6f; } .tooltip-wrapper::after { content: ""; width: 0; height: 0; border-style: solid; border-width: 12px 9.5px 0; border-color: #fff transparent transparent; bottom: -12px; position: absolute; } /* Example hotspot positioning (adjust as needed) */ /* America (North + South combined, somewhere central in USA) */ .point-america { top: 45%; /* vertical positioning */ left: 25%; /* horizontal positioning */ } /* Europe (center around Germany/France) */ .point-europe { top: 38%; left: 48%; } /* Middle East (roughly Saudi Arabia region) */ .point-middleeast { top: 52%; left: 58%; } /* Africa (around central Africa) */ .point-africa { top: 65%; left: 50%; } /* Asia (China/India region) */ .point-asia { top: 50%; left: 70%; } /* ================================ Contact List (below globe) ================================== */ /*.contact-list { grid-column: span 2; display: flex; justify-content: space-between; gap: 30px; margin-top: 40px; } .contact-item { flex: 1; text-align: center; } .contact-item h4 { color: #76511c; font-weight: 600; font-size: 24px; } .contact-item p { color: #18181b; font-weight: 400; font-size: 16px; margin-bottom: 15px; } .contact-item a { color: #000; text-decoration: none; font-weight: 600; width: fit-content; margin: 0 auto; } @media (max-width: 767px) { .contact-list { flex-direction: column; align-items: center; } .contact-item { width: 100%; } } */ .events-area .section-header .shape{margin-top:37px;margin-inline-start:110px}@media only screen and (max-width: 767px){.events-area .section-header .shape{margin-top:27px;margin-inline-start:0}} /*.dir-rtl .events-area .section-header .shape img{transform:rotateY(180deg)}*/.events-area .events-wrapper{display:grid;gap:40px 40px;grid-template-columns:repeat(4, 1fr)}@media only screen and (max-width: 1199px){.events-area .events-wrapper{gap:40px 20px}}@media only screen and (max-width: 991px){.events-area .events-wrapper{grid-template-columns:repeat(2, 1fr)}}@media(max-width: 575px){.events-area .events-wrapper{grid-template-columns:repeat(1, 1fr)}}.events-area .events-item-area{padding-inline-start:50px;padding-inline-end:50px}@media only screen and (max-width: 767px){.events-area .events-item-area{padding-inline-start:15px;padding-inline-end:15px}}.events-area .events-wrapper-box{margin-top:70px;position:relative;z-index:1}@media only screen and (max-width: 1399px){.events-area .events-wrapper-box{margin-top:50px}}.events-area .events-wrapper-box .shape-1{position:absolute;width:200px;inset-inline-end:9%;top:-130px;z-index:1}@media only screen and (max-width: 1919px){.events-area .events-wrapper-box .shape-1{width:130px;inset-inline-end:-1%;top:-90px}}@media only screen and (max-width: 991px){.events-area .events-wrapper-box .shape-1{display:none}}.events-box:hover .thumb img{transform:scale(1.1)}.events-box .thumb{overflow:hidden}.events-box .thumb img{width:100%;transition:all .5s}.events-box .content{margin-top:24px}.events-box .name{font-size:24px;font-weight:500;line-height:1}@media only screen and (max-width: 1399px){.events-box .name{font-size:22px}}.events-box .post{font-size:16px;line-height:1;margin-top:10px;margin-bottom:28px}@media only screen and (max-width: 1199px){.events-box .post{margin-bottom:23px}}.events-box .wc-btn-circle{width:30px;height:30px;background-color:var(--white);color:var(--black);border:1px solid rgba(18,18,18,.15);font-size:14px}.dark .events-box .wc-btn-circle{background-color:var(--black);color:var(--white);border-color:rgba(255,255,255,.15)}.events-box .wc-btn-circle i{transform:none}.events-box .wc-btn-primary{font-size:12px;font-weight:400;padding:0 11px;background-color:var(--white);color:var(--black);border:1px solid rgba(18,18,18,.15);border-radius:30px}.dark .events-box .wc-btn-primary{background-color:var(--black);color:var(--white);border-color:rgba(255,255,255,.15)}.events-box .wc-btn-group{display:flex;width:-moz-fit-content;width:fit-content}.events-box .wc-btn-group>*:nth-child(3){transform:scale3d(0.5, 0.5, 1);margin-inline-start:-30px}.events-box .wc-btn-group>*:nth-child(2){transform:scale3d(1, 1, 1)}.events-box .wc-btn-group>*:nth-child(1){transform:scale3d(1, 1, 1);margin-inline-end:0}.events-box .wc-btn-group:hover>*:nth-child(3){transform:scale3d(1, 1, 1);margin-inline-start:0}.events-box .wc-btn-group:hover>*:nth-child(2){transform:scale3d(1, 1, 1)}.events-box .wc-btn-group:hover>*:nth-child(1){transform:scale3d(0.5, 0.5, 1);margin-inline-end:-30px} .events-area .section-header { text-align: center; /* centers text inside */ max-width: 900px; /* optional: keeps lines comfortable */ margin: 0 auto; /* centers the whole block */ } /*health area*/ .health-area .thumbs{ width:100%; aspect-ratio:100/118; position:relative; max-width:610px } .health-area .thumbs img{ border-radius:5px } .health-area .thumbs .img-1{ width:100%; position:absolute; top:9%; inset-inline-start:0; height: 80%; } .health-area .health-area-inner{ display:grid; gap:50px 60px; grid-template-columns:444px 610px; justify-content:space-between; align-items:center } @media only screen and (max-width: 1399px){ .health-area .health-area-inner{ grid-template-columns:510px 444px } } @media only screen and (max-width: 1199px){ .health-area .health-area-inner{ grid-template-columns:410px 400px } } @media only screen and (max-width: 991px){ .health-area .health-area-inner{ grid-template-columns:1fr } } .health-area .section-content .text-wrapper{ margin-top:33px } .health-area .section-content .title-wrapper{ text-decoration: none; } @media only screen and (max-width: 1199px){ .health-area .section-content .text-wrapper{ margin-top:23px } } .health-area .section-content .btn-wrapper{ margin-top:43px; display:flex; gap:30px; align-items:center } @media only screen and (max-width: 1199px){ .health-area .section-content .btn-wrapper{ margin-top:33px } } .health-area .experience-box{ margin-top:55px } @media only screen and (max-width: 1199px){ .health-area .experience-box{ margin-top:35px } } .health-area .experience-box .number{ font-size:100px; font-weight:500; display:flex; align-items:flex-start } @media only screen and (max-width: 1199px){ .health-area .experience-box .number{ font-size:70px } } .health-area .experience-box .number i{ font-size:18px; margin-top:12px; margin-inline-start:9px } @media only screen and (max-width: 1199px){ .health-area .experience-box .number i{ margin-top:10px } } .health-area .experience-box .info{ font-size:18px; line-height:1.2; max-width:180px; font-weight:600; margin-top:10px } /*sustainability area*/ .sustainability-area .thumbs{ width:100%; aspect-ratio:100/118; position:relative; max-width:610px } .sustainability-area .thumbs img{ border-radius:5px } .sustainability-area .thumbs .img-1{ width:100%; position:absolute; top:9%; inset-inline-start:0; height: 80%; } .sustainability-area .sustainability-area-inner{ display:grid; gap:50px 60px; grid-template-columns:610px 444px; justify-content:space-between; align-items:center } @media only screen and (max-width: 1399px){ .sustainability-area .sustainability-area-inner{ grid-template-columns:510px 444px } } @media only screen and (max-width: 1199px){ .sustainability-area .sustainability-area-inner{ grid-template-columns:410px 400px } } @media only screen and (max-width: 991px){ .sustainability-area .sustainability-area-inner{ grid-template-columns:1fr } } .sustainability-area .section-content .text-wrapper{ margin-top:33px } .sustainability-area .section-content .title-wrapper{ text-decoration: none; } @media only screen and (max-width: 1199px){ .sustainability-area .section-content .text-wrapper{ margin-top:23px } } .sustainability-area .section-content .btn-wrapper{ margin-top:43px; display:flex; gap:30px; align-items:center } @media only screen and (max-width: 1199px){ .sustainability-area .section-content .btn-wrapper{ margin-top:33px } } .sustainability-area .experience-box{ margin-top:55px } @media only screen and (max-width: 1199px){ .sustainability-area .experience-box{ margin-top:35px } } .sustainability-area .experience-box .number{ font-size:100px; font-weight:500; display:flex; align-items:flex-start } @media only screen and (max-width: 1199px){ .sustainability-area .experience-box .number{ font-size:70px } } .sustainability-area .experience-box .number i{ font-size:18px; margin-top:12px; margin-inline-start:9px } @media only screen and (max-width: 1199px){ .sustainability-area .experience-box .number i{ margin-top:10px } } .sustainability-area .experience-box .info{ font-size:18px; line-height:1.2; max-width:180px; font-weight:600; margin-top:10px } /* ============================================== WHAT WE DO SECTION — CROPPING FIXED ============================================== */ .what-we-do { margin-top: 80px; position: relative; overflow: visible; } .what-we-do-inner { display: grid; grid-template-columns: 51% 1fr; align-items: stretch; } @media (max-width: 1919px) { .what-we-do-inner { grid-template-columns: 55% 1fr; } } @media (max-width: 1199px) { .what-we-do-inner { grid-template-columns: 1fr; } } /* ========== THUMB (RIGHT SIDE IMAGE) ========== */ .what-we-do .thumb { position: relative; overflow: visible; /* ensure image and shape visible */ } .what-we-do .thumb::after { content: ""; position: absolute; inset: 0; background-image: url("../imgs/shape/img-s-51.webp"); background-size: cover; background-position: center; background-repeat: no-repeat; opacity: 0.4; pointer-events: none; } .what-we-do .thumb img { display: block; width: 100%; height: auto; /* critical fix */ object-fit: cover; } /* ========== CONTENT (LEFT SIDE) ========== */ .what-we-do .section-content { position: relative; z-index: 1; padding: 100px 60px; color: var(--white); background: transparent; overflow: visible; } @media (max-width: 1399px) { .what-we-do .section-content { padding: 80px 50px; } } @media (max-width: 1199px) { .what-we-do .section-content { padding: 60px 40px; } } @media (max-width: 767px) { .what-we-do .section-content { padding: 50px 30px 80px; /* extra bottom padding to prevent cut-off */ } } /* ========== BACKGROUND IMAGE ========== */ .what-we-do .section-content .bg { position: absolute; inset: 0; z-index: -1; pointer-events: none; } .what-we-do .section-content .bg img { width: 100%; height: 100%; object-fit: cover; object-position: center; } /* ========== TEXT STYLES ========== */ .what-we-do .section-content .section-title { font-size: 70px; line-height: 0.95; color: #fff; margin-bottom: 30px; } @media (max-width: 991px) { .what-we-do .section-content .section-title { font-size: 55px; } } @media (max-width: 575px) { .what-we-do .section-content .section-title { font-size: 38px; } } .what-we-do .section-content .text-wrapper { margin-top: 20px; } .what-we-do .section-content .text { font-size: 18px; line-height: 1.6; color: #fff; margin-bottom: 20px; } @media (max-width: 575px) { .what-we-do .section-content .text { font-size: 16px; } } /* ========== GRID & ALIGN FIXES ========== */ @media (max-width: 1199px) { .what-we-do-inner { align-items: start; } .what-we-do .thumb, .what-we-do .section-content { overflow: visible; } .what-we-do .thumb img { height: auto; } } 
		/* Feature Area */
.feature-area {
  padding: 80px 0;
}

.feature-area .section-title {
  max-width: 730px;
  margin-inline: auto;
  text-align: center;
}

.features-wrapper {
  display: grid;
  gap: 30px;
  grid-template-columns: repeat(3, 1fr); /* 3 columns by default */
  margin-top: 50px;
}

.feature-box {
  padding: 20px;
  text-align: center;
}

.feature-box .thumb {
  margin-bottom: 20px;
  perspective: 1000px; /* Enables 3D look */
}

.feature-box .rotate img {
  width: 80px;
  height: 80px;
  display: inline-block;
  backface-visibility: visible;
}

/* Flip once on hover */
.feature-box:hover .rotate img {
  animation: flipOnce 1s ease-in-out;
}

@keyframes flipOnce {
  0% {
    transform: rotateY(0deg);
  }
  100% {
    transform: rotateY(360deg);
  }
}

.feature-box .content {
  margin-top: 15px;
}

.feature-box .text {
  font-size: 16px;
  line-height: 1.6;
}

/* Responsive Grid Layout */

/* For large screens (desktops) */
@media (min-width: 1200px) {
  .features-wrapper {
    grid-template-columns: repeat(3, 1fr); /* 3 columns */
  }
}

/* For medium screens (tablets) */
@media (max-width: 1199px) and (min-width: 768px) {
  .features-wrapper {
    grid-template-columns: repeat(2, 1fr); /* 2 columns */
  }
}

/* For small screens (mobile landscape) */
@media (max-width: 767px) and (min-width: 576px) {
  .features-wrapper {
    grid-template-columns: 1fr; /* 1 column */
  }
}

/* For very small screens (mobile portrait) */
@media (max-width: 575px) {
  .features-wrapper {
    grid-template-columns: 1fr; /* 1 column */
  }
}

		.customer-care-area .section-title { 
			max-width: 730px; 
			margin-inline: auto;
			text-align: center; 
		} 
		.customer-care-wrapper-box {
			margin-top: 73px;
		} 
		.customer-care-wrapper {
			display: grid;
			grid-template-columns: repeat(3, 1fr);
			gap: 40px;
		}
		@media (max-width: 991px) {
			.customer-care-wrapper {
				grid-template-columns: repeat(2, 1fr);
			}
		}
		@media (max-width: 575px) { 
			.customer-care-wrapper { 
				grid-template-columns: 1fr; 
			} 
		} 
		.customer-care-box { padding: 20px; text-align: center; } .customer-care-box .thumb { perspective: 1000px; display: inline-block; } .customer-care-box .thumb img { width: 80px; height: 80px; display: inline-block; backface-visibility: visible; transition: transform 1s ease-in-out; } .customer-care-box:hover .thumb img { animation: flipOnce 1s ease-in-out; } @keyframes flipOnce { 0% { transform: rotateY(0deg); } 100% { transform: rotateY(360deg); } } .customer-care-box .content { margin-top: 20px; } .customer-care-box .title { font-size: 24px; font-weight: 600; } .customer-care-box .text { margin-top: 12px; font-size: 16px; line-height: 1.6; } .skill-area .section-title{ max-width:660px } .skill-area .section-header{ display:grid; gap:20px 60px; grid-template-columns:auto auto; justify-content:space-between } @media only screen and (max-width: 991px){.skill-area .section-header{grid-template-columns:auto}}.skill-area .section-header .text{max-width:300px}.skill-area .skills-wrapper-box{margin-top:59px}.skill-area .skills-wrapper{display:grid;gap:40px 60px;grid-template-columns:420px auto;justify-content:space-between}@media only screen and (max-width: 991px){.skill-area .skills-wrapper{grid-template-columns:auto}}.skill-area .skills-wrapper .nav{border-inline-start:1px solid #ececec;padding-inline-start:18px;margin-inline-start:1px}.skill-area .skills-wrapper .nav .nav-link{background-color:rgba(0,0,0,0);position:relative;padding:0;text-align:start;padding-top:18px}.skill-area .skills-wrapper .nav .nav-link.active:before{position:absolute;content:"";width:3px;height:100%;background-color:var(--theme);top:0;inset-inline-start:-20px}.skill-area .skills-wrapper .nav .nav-link.active .icon{background-color:var(--theme)}.skill-area .skills-wrapper .nav li:not(:first-child){margin-top:20px} .skill-thumb{padding-top:45px;padding-inline-start:80px;position:relative} .skill-thumb .small-image{position:absolute;top:0;inset-inline-start:0;max-width:740px;margin-inline-start:auto}.skill-nav{display:flex;gap:20px;align-items:flex-start;position:relative}.skill-nav .icon{width:65px;height:65px;background-color:rgba(18,18,18,.0196078431);display:inline-flex;justify-content:center;align-items:center;min-width:65px;border-radius:50%}.skill-nav .title{font-size:36px;line-height:.88;text-transform:uppercase;padding-top:19px}@media only screen and (max-width: 1199px){.skill-nav .title{font-size:30px;padding-top:0}}@media only screen and (max-width: 991px){.skill-nav .title{font-size:24px}}.skill-nav .text{margin-top:8px}.enterprise-area .section-header{text-align:center}.enterprise-area .section-header .text{font-size:21px}.enterprise-area .expertise-wrapper-box{margin-top:64px}@media only screen and (max-width: 1399px){.enterprise-area .expertise-wrapper-box{margin-top:44px}}@media only screen and (max-width: 1199px){.enterprise-area .expertise-wrapper-box{margin-top:34px}}.enterprise-area .expertise-wrapper{display:flex;justify-content:space-between}@media only screen and (max-width: 767px){.enterprise-area .expertise-wrapper{flex-wrap:wrap;justify-content:center}}.enterprise-area .expertise-wrapper>*:not(:first-child){margin-inline-start:-100px}@media only screen and (max-width: 767px){.enterprise-area .expertise-wrapper>*:not(:first-child){margin-inline-start:0}}.expertise-box{width:300px;height:300px;border:1px solid #ececec;border-radius:100%;display:flex;justify-content:center;align-items:center;flex-direction:column}.dark .expertise-box{border-color:#252525}@media only screen and (max-width: 1399px){.expertise-box{width:250px;height:250px}}@media only screen and (max-width: 1199px){.expertise-box{width:200px;height:200px}}@media only screen and (max-width: 991px){.expertise-box{width:160px;height:160px}}.expertise-box .icon img{max-height:100px}@media only screen and (max-width: 1399px){.expertise-box .icon img{max-height:90px}}@media only screen and (max-width: 1199px){.expertise-box .icon img{max-height:70px}}@media only screen and (max-width: 991px){.expertise-box .icon img{max-height:50px}}.expertise-box .name{font-size:26px;margin-top:32px;line-height:1}@media only screen and (max-width: 1399px){.expertise-box .name{font-size:24px;margin-top:17px}}@media only screen and (max-width: 991px){.expertise-box .name{font-size:20px}} /*.work-area [dir=rtl]{direction:rtl}*/ .work-area .works-wrapper{display:grid;gap:10px}.work-slider-active .swiper-slide{width:auto}.work-slider-active .swiper-wrapper{transition-timing-function:linear}.work-box{position:relative;max-width:880px}@media only screen and (max-width: 1919px){.work-box{max-width:780px}}@media only screen and (max-width: 1399px){.work-box{max-width:680px}}@media only screen and (max-width: 1199px){.work-box{max-width:580px}}@media only screen and (max-width: 991px){.work-box{max-width:480px}}@media only screen and (max-width: 767px){.work-box{max-width:380px}}.work-box:hover .content{opacity:1;visibility:visible}.work-box .content{position:absolute;width:100%;height:100%;top:0;inset-inline-start:0;background-color:rgba(255,255,255,.9);display:flex;flex-direction:column;justify-content:end;padding:45px 45px 50px;opacity:0;visibility:hidden;transition:all .5s;direction:ltr}.work-box .icon{position:absolute;inset-inline-end:45px;top:45px}.work-box .title{font-size:30px;text-transform:uppercase;color:var(--black)}.work-box .meta{font-size:14px;display:inline-block;margin-top:8px;color:var(--black-2)}.service-area .section-title{max-width:740px;margin-inline:auto}@media only screen and (max-width: 1919px){.service-area .section-title{max-width:630px}}@media only screen and (max-width: 1199px){.service-area .section-title{max-width:460px}}@media only screen and (max-width: 991px){.service-area .section-title{max-width:460px;margin:0}}.service-area .section-header .text{max-width:300px;margin-inline-start:580px}@media only screen and (max-width: 1399px){.service-area .section-header .text{margin-inline-start:520px}}@media only screen and (max-width: 1199px){.service-area .section-header .text{margin-inline-start:430px}}@media only screen and (max-width: 991px){.service-area .section-header .text{max-width:460px;margin:0}}.service-area .section-header .text-wrapper{margin-top:22px}@media only screen and (max-width: 1199px){.service-area .section-header .text-wrapper{margin-top:12px}}.service-area .section-header .section-title-wrapper{position:relative}.service-area .section-header .section-title-wrapper .shape-1{position:absolute;width:93px;top:-60px;inset-inline-start:43%;z-index:99}@media only screen and (max-width: 1199px){.service-area .section-header .section-title-wrapper .shape-1{display:none}}.service-area .services-wrapper-box{margin-top:73px}@media only screen and (max-width: 1919px){.service-area .services-wrapper-box{margin-top:53px}}@media only screen and (max-width: 1199px){.service-area .services-wrapper-box{margin-top:33px}}.service-box{border-bottom:1px solid #ececec;padding:44px 0;display:grid;gap:20px 60px;grid-template-columns:160px 1fr 100px}.dark .service-box{border-color:#252525}@media only screen and (max-width: 1199px){.service-box{padding:24px 0;grid-template-columns:100px 1fr 100px}}@media only screen and (max-width: 767px){.service-box{grid-template-columns:auto}}.service-box:first-child{border-top:1px solid #ececec}.dark .service-box:first-child{border-color:#252525}.service-box .number{font-size:30px;font-family:var(--font_teko);font-weight:600;color:var(--primary)}@media only screen and (max-width: 1199px){.service-box .number{font-size:22px}}.service-box .title{font-size:36px;text-transform:uppercase;line-height:.88}@media only screen and (max-width: 1199px){.service-box .title{font-size:26px}}.service-box .text{max-width:340px}.service-box .customer-care-list{margin-top:18px}.service-box .customer-care-list li{font-size:18px;line-height:1.41;color:var(--primary)} 
		/*ceo area*/ 
		.ceo-area .thumbs{ 
			width:100%; 
			aspect-ratio:100/118; 
			position:relative; 
			max-width:610px 
		} 
		.ceo-area .thumbs img{ 
			border-radius:5px 
		} 
		.ceo-area .thumbs .img-1{ 
			width:80%; 
			position:absolute; 
			top:9%; 
			inset-inline-start:0 
		} 
		.ceo-area .thumbs .img-2{ 
			position:absolute; 
			inset-inline-end:0; 
			top:0; 
			width:41% 
		} 
		.ceo-area .thumbs .img-3{ 
			position:absolute; 
			bottom:0; 
			inset-inline-start:26%; 
			width:59% 
		} 
		.ceo-area .ceo-area-inner{ 
			display:grid; 
			gap:50px 60px;
			grid-template-columns:444px 610px; 
			justify-content:space-between; 
			align-items:center 
		} 
		@media only screen and (max-width: 1399px){ 
			.ceo-area .ceo-area-inner{ 
				grid-template-columns:510px 444px 
			} 
		} 
		@media only screen and (max-width: 1199px){ 
			.ceo-area .ceo-area-inner{ 
				grid-template-columns:410px 400px 
			} 
		} 
		@media only screen and (max-width: 991px){ 
			.ceo-area .ceo-area-inner{ 
				grid-template-columns:1fr 
			} 
		} 
		.ceo-area .section-content .text-wrapper{ 
			margin-top:33px 
		} 
		.ceo-area .section-content .title-wrapper{ 
			text-decoration: none; 
		} 
		@media only screen and (max-width: 1199px){ 
			.ceo-area .section-content .text-wrapper{ 
				margin-top:23px 
			} 
		} 
		.ceo-area .section-content .btn-wrapper{ 
			margin-top:43px; 
			display:flex; 
			gap:30px; 
			align-items:center 
		} 
		@media only screen and (max-width: 1199px){ 
			.ceo-area .section-content .btn-wrapper{ 
				margin-top:33px 
			} 
		} 
		.ceo-area .experience-box{ 
			margin-top:55px 
		} 
		@media only screen and (max-width: 1199px){ 
			.ceo-area .experience-box{ 
				margin-top:35px 
			} 
		} 
		.ceo-area .experience-box .number{ 
			font-size:100px; 
			font-weight:500; 
			display:flex; 
			align-items:flex-start 
		} 
		@media only screen and (max-width: 1199px){ 
			.ceo-area .experience-box .number{ 
				font-size:70px 
			} 
		} 
		.ceo-area .experience-box .number i{ 
			font-size:18px; 
			margin-top:12px; 
			margin-inline-start:9px 
		} 
		@media only screen and (max-width: 1199px){ 
			.ceo-area .experience-box .number i{ 
				margin-top:10px 
			} 
		} 
		.ceo-area .experience-box .info{ 
			font-size:18px; 
			line-height:1.2; 
			max-width:180px; 
			font-weight:600; 
			margin-top:10px 
		}
		/* ✅ Center CEO images on mobile screens */
@media only screen and (max-width: 991px) {
  .ceo-area .thumbs {
    display: flex;
    justify-content: center;
    align-items: center;
    max-width: 100%;
    margin: 0 auto;
  }

  .ceo-area .thumbs img {
    position: relative !important;
    width: 80% !important;
    height: auto;
    left: 0;
    right: 0;
    margin: 0 auto;
  }

  .ceo-area .thumbs .img-1,
  .ceo-area .thumbs .img-2,
  .ceo-area .thumbs .img-3 {
    position: relative;
    inset: unset;
    display: block;
    margin: 10px auto;
  }
}

		.service-details-area{ 
			padding-top:150px 
		} 
		@media only screen and (max-width: 1399px){ 
			.service-details-area{ 
				padding-top:80px 
			} 
		} 
		.service-details-area .thumb-main{ 
			position:relative 
		} 
		.service-details-area .thumb-main img{ 
			width:100% 
		} 
		.service-details-area .thumb-main .hero-social{ writing-mode:vertical-lr; display:flex; gap:20px; align-items:center; position:absolute; left:-210px; bottom:-180px } /*.dir-rtl .service-details-area .thumb-main .hero-social{ justify-content:flex-end }*/ @media only screen and (max-width: 1919px){ .service-details-area .thumb-main .hero-social{ left:30px; bottom:30px; background-color:var(--white); padding:20px 10px } } @media only screen and (max-width: 991px){ .service-details-area .thumb-main .hero-social{ writing-mode:initial; padding:10px 20px } } @media only screen and (max-width: 767px){ .service-details-area .thumb-main .hero-social{ left:10px; bottom:10px } } .service-details-area .thumb-main .hero-social .title{ position:relative; padding-inline-end:80px; display:inline-block; font-size:14px; color:var(--primary); text-transform:uppercase } @media only screen and (max-width: 1919px){ .service-details-area .thumb-main .hero-social .title{ color:var(--black) } } .service-details-area .thumb-main .hero-social .title:before{ position:absolute; content:""; width:1px; height:60px; background-color:var(--border); bottom:0; left:50%; transform:translateX(-50%) } /*.dir-rtl .service-details-area .thumb-main .hero-social .title:before{ top:0; bottom:auto }*/ @media only screen and (max-width: 991px){ .service-details-area .thumb-main .hero-social .title:before{ width:60px; height:1px; inset-inline-end:0; top:50%; transform:translateY(-50%) } } .service-details-area .thumb-main .hero-social .hero-social-links{ display:flex; gap:25px } .service-details-area .thumb-main .hero-social .hero-social-links a{ color:var(--primary) } @media only screen and (max-width: 1919px){ .service-details-area .thumb-main .hero-social .hero-social-links a{ color:var(--black) } } .service-details-area .thumb-main .hero-social .hero-social-links a:hover{ color:var(--secondary) } .service-details-area .thumb-main .hero-social .hero-social-links a i{ font-size:16px } .service-details-area .section-title-box{ display:grid; gap:20px 60px; grid-template-columns:1fr 520px; align-items:center; margin-top:46px } .service-details-area .title { font-size: 28px; /* set one size for all */ line-height: 1.3; /* balanced spacing */ } .service-details-area .section-title-box .title h1,h2,h3,h4,h5{ font-size: 32px; } @media only screen and (max-width: 1199px){ .service-details-area .section-title-box{ grid-template-columns:1fr 460px } } @media only screen and (max-width: 991px){ .service-details-area .section-title-box{ grid-template-columns:1fr } } .service-details-area .section-title-box .feature-list{ display:grid; gap:10px 50px; grid-template-columns:auto auto; justify-content:space-between } @media only screen and (max-width: 991px){ .service-details-area .section-title-box .feature-list{ justify-content:flex-start } } @media(max-width: 575px){ .service-details-area .section-title-box .feature-list{ grid-template-columns:auto } } .service-details-area .section-title-box .feature-list li{ color:var(--primary) } .service-details-area .section-title-box .feature-list li:not(:first-child){ margin-top:10px } .service-details-area .section-title-box .feature-list li:before{ content:"+"; margin-inline-end:13px } .service-details-area .text-wrapper{ margin-top:27px } .service-details-area .text-wrapper .text:not(:first-child){ margin-top:23px } .service-details-area .steps-wrapper-box{ border-top:1px solid var(--border); margin-top:66px } @media only screen and (max-width: 991px){ .service-details-area .steps-wrapper-box{ border-top:0 } } .service-details-area .working-steps{ display:grid; gap:40px 30px; grid-template-columns:repeat(4, 1fr) } @media only screen and (max-width: 991px){ .service-details-area .working-steps{ grid-template-columns:repeat(2, 1fr) } } @media(max-width: 575px){ .service-details-area .working-steps{ grid-template-columns:repeat(1, 1fr) } } .service-details-area .working-step{ padding-top:50px; position:relative } @media only screen and (max-width: 991px){ .service-details-area .working-step{ padding-top:20px; border-top:1px solid var(--border) } } .service-details-area .working-step:before{ position:absolute; content:""; width:7px;height:7px; background-color:var(--primary); border-radius:50%; top:-4px; inset-inline-start:0 } .service-details-area .working-step .title{ font-size:22px; line-height:1.29 } .service-details-area .working-step .text{ margin-top:15px } .service-details-area .thumb-gallery{ margin-top:53px; display:grid; gap:30px; grid-template-columns:repeat(3, 1fr) } @media only screen and (max-width: 991px){ .service-details-area .thumb-gallery{ gap:10px } } @media(max-width: 575px){ .service-details-area .thumb-gallery{ grid-template-columns:repeat(2, 1fr) } } .features-area-1 .section-title{ max-width:750px; text-indent:35px; margin-top:-10px } @media(min-width: 992px){ .features-area-1 .section-title{ font-size:36px } } @media only screen and (max-width: 767px){ .features-area-1 .section-title{ text-indent:0 } } .features-area-1 .section-content{ margin-top:90px; display:grid; gap:20px 60px; grid-template-columns:auto 960px; justify-content:space-between } @media only screen and (max-width: 1919px){ .features-area-1 .section-content{ margin-top:60px } } @media only screen and (max-width: 1399px){ .features-area-1 .section-content{ grid-template-columns:auto 920px } } @media only screen and (max-width: 1199px){ .features-area-1 .section-content{ grid-template-columns:1fr; margin-top:30px } } @media only screen and (max-width: 1199px){ .features-area-1 .section-content .shape{ display:none } } /*.dir-rtl .features-area-1 .section-content .shape img{ transform:rotateY(180deg) }*/ .features-area-1 .section-content .thumb{ position:relative } .features-area-1 .section-content .thumb .main-image{ border-radius:0 0 300px 0 } /*.dir-rtl .features-area-1 .section-content .thumb .main-image{ border-radius:0 0 0 300px }*/ @media only screen and (max-width: 991px){ .features-area-1 .section-content .thumb .main-image{ border-radius:0 } } .features-area-1 .section-content .thumb .shape-1{ position:absolute; inset-inline-end:17px; bottom:-20px } /*.dir-rtl .features-area-1 .section-content .thumb .shape-1 img{ transform:rotateY(180deg) }*/ .features-area-1 .section-content .text-wrapper{ margin-top:60px; display:grid; gap:23px 80px; grid-template-columns:1fr 1fr } @media only screen and (max-width: 1399px){ .features-area-1 .section-content .text-wrapper{ margin-top:40px } } @media only screen and (max-width: 991px){ .features-area-1 .section-content .text-wrapper{ grid-template-columns:1fr } } /*# sourceMappingURL=master-service-details.css.map */ .production-area .section-title{max-width:370px}@media(min-width: 992px){.production-area .section-title{font-size:36px}}.production-area .section-content{display:grid;gap:40px 60px;grid-template-columns:550px 550px;align-items:center;justify-content:space-between}@media only screen and (max-width: 1199px){.production-area .section-content{grid-template-columns:420px 460px}}@media only screen and (max-width: 991px){.production-area .section-content{grid-template-columns:auto}}.production-area .accordion-wrapper{margin-top:27px}.production-area .accordion .accordion-button{font-size:18px;line-height:1;color:var(--primary);padding-top:18px;padding-bottom:18px;padding-inline-start:0;padding-inline-end:0;background-color:rgba(0,0,0,0);box-shadow:none;text-align:start;font-weight:500}@media only screen and (max-width: 1199px){.production-area .accordion .accordion-button{font-size:18px}}.production-area .accordion .accordion-button .section-subtitle{font-size:12px;font-weight:700;color:var(--primary);text-transform:uppercase;padding:8px 16px;display:inline-block;border-radius:10px;background-color:var(--white)}@media only screen and (max-width: 1199px){.production-area .accordion .accordion-button br{display:none}}.production-area .accordion .accordion-button::after{content:"+";color:var(--primary);background-image:none;line-height:1;width:auto;height:auto;font-size:25px;margin-inline-start:50px;margin-inline-start:auto;margin-inline-end:0}.production-area .accordion .accordion-button:not(.collapsed){pointer-events:none}.production-area .accordion .accordion-button:not(.collapsed)::after{content:"-"}.production-area .accordion .accordion-item{border-bottom:1px solid var(--border);background-color:rgba(0,0,0,0);border-radius:0px}.production-area .accordion .accordion-item:not(:first-child){margin-top:0px}.production-area .accordion .accordion-item:first-child{border-top:1px solid var(--border)}.production-area .accordion .accordion-body{font-size:18px;line-height:1.44;padding-inline-start:0px;padding-inline-end:0px;padding-bottom:24px;padding-top:0;color:var(--secondary)}@media only screen and (max-width: 991px){.production-area .accordion .accordion-body{padding-bottom:23px}}.production-area .thumb{position:relative}.production-area .thumb img{width:100%;height:100%;-o-object-fit:cover;object-fit:cover} .career-area{background-color:var(--black)}.dark .career-area{background-color:#171717}.career-area-inner{padding-top:218px}@media only screen and (max-width: 1919px){.career-area-inner{padding-top:178px}}@media only screen and (max-width: 1399px){.career-area-inner{padding-top:158px}}@media only screen and (max-width: 1199px){.career-area-inner{padding-top:128px}}.career-area .section-title{color:var(--white);max-width:1100px}@media only screen and (max-width: 1919px){.career-area .section-title{max-width:900px}}@media only screen and (max-width: 1399px){.career-area .section-title{max-width:800px}}@media only screen and (max-width: 1199px){.career-area .section-title{max-width:700px}}.career-area .section-title .shape-1{height:80px}@media only screen and (max-width: 1399px){.career-area .section-title .shape-1{height:70px}}@media only screen and (max-width: 1199px){.career-area .section-title .shape-1{height:60px}}@media only screen and (max-width: 991px){.career-area .section-title .shape-1{height:50px}}@media only screen and (max-width: 767px){.career-area .section-title .shape-1{display:none}}.career-area .section-content .text{max-width:350px;color:var(--white-2)}.career-area .section-content .section-subtitle{font-size:16px;line-height:1;display:inline-block;text-transform:uppercase;color:var(--white)}.career-area .section-content .section-subtitle.has-right-line{padding-inline-end:100px}.career-area .section-content .section-subtitle.has-right-line:after{width:80px}.career-area .section-content .text-box{display:grid;gap:20px 70px;grid-template-columns:auto 1fr;margin-top:44px;margin-inline-start:156px}@media only screen and (max-width: 1399px){.career-area .section-content .text-box{margin-top:34px}}@media only screen and (max-width: 1199px){.career-area .section-content .text-box{margin-top:24px}}@media only screen and (max-width: 991px){.career-area .section-content .text-box{grid-template-columns:auto}}@media only screen and (max-width: 767px){.career-area .section-content .text-box{margin-inline-start:0}}.career-area .section-content .subtitle-wrapper{margin-top:4px}.career-area .section-content .thumb{margin-top:64px}@media only screen and (max-width: 1919px){.career-area .section-content .thumb{margin-top:44px}}@media only screen and (max-width: 1199px){.career-area .section-content .thumb{margin-top:34px}} .career-area .section-content { text-align: center; /* Center align heading and text */ } .career-area .section-title { margin: 0 auto; /* Center heading block */ text-align: center; } .career-area .section-content .text-box { margin: 44px auto 0 auto; display: block; max-width: 900px; /* increased from 700px */ } .career-area .section-content .text { margin: 0 auto; text-align: center; max-width: 900px; /* increased from 350px */ } .community-area .section-title{ max-width:750px; margin-top:-10px; margin-inline:auto; text-align:center } @media(min-width: 992px){ .community-area .section-title{ font-size:36px } } .community-area .section-content .text{ font-size:18px; line-height:1.27; max-width:850px; margin-inline:auto; text-align:center } @media only screen and (max-width: 1199px){ .community-area .section-content .text{ font-size:18px } } .community-area .section-content .text-wrapper{ margin-top:23px } .community-area .gallery-wrapper-box{} @media only screen and (max-width: 1399px){ .community-area .gallery-wrapper-box{ } } @media only screen and (max-width: 1199px){ .community-area .gallery-wrapper-box{ } } .community-area .gallery-wrapper { display: flex; justify-content: center; /* centers horizontally */ align-items: center; /* centers vertically if needed */ flex-wrap: wrap; /* keeps spacing between items */ } @media only screen and (max-width: 767px) { .community-area .gallery-wrapper { gap: 10px; justify-content: center; /* still center on mobile */ } } .community-area .gallery-wrapper>*:nth-child(1){ margin-top:140px } @media only screen and (max-width: 1399px){ .community-area .gallery-wrapper>*:nth-child(1){ margin-top:120px } } @media only screen and (max-width: 1199px){ .community-area .gallery-wrapper>*:nth-child(1){ margin-top:30px } } .community-area .gallery-wrapper>*:nth-child(3){ margin-top:70px } .community-area .gallery-wrapper>*>*:not(:first-child){ margin-top:30px } @media only screen and (max-width: 767px){ .community-area .gallery-wrapper>*>*:not(:first-child){ margin-top:10px } } .roles-area{background-color:var(--black)}.dark .roles-area{background-color:#171717}.roles-area .section-title{color:var(--white)}.roles-area .roles-wrapper-box{margin-top:57px}@media only screen and (max-width: 1399px){.roles-area .roles-wrapper-box{margin-top:47px}}@media only screen and (max-width: 1199px){.roles-area .roles-wrapper-box{margin-top:37px}}.roles-area .role-item{border-bottom:1px solid #2c2c2c;display:grid;gap:20px 40px;grid-template-columns:60px 1fr 1fr auto;padding:45px 0;align-items:center}@media only screen and (max-width: 1919px){.roles-area .role-item{padding:35px 0}}@media only screen and (max-width: 1199px){.roles-area .role-item{padding:25px 0;grid-template-columns:30px 1fr 1fr auto}}@media only screen and (max-width: 767px){.roles-area .role-item{grid-template-columns:30px 1fr 1fr}}@media(max-width: 575px){.roles-area .role-item{grid-template-columns:30px 1fr}}.roles-area .role-item:hover .icon{opacity:1}.roles-area .role-item:first-child{border-top:1px solid #2c2c2c}.roles-area .role-item .serial{font-size:24px;line-height:1;color:var(--white-2)}@media only screen and (max-width: 1199px){.roles-area .role-item .serial{font-size:18px}}.roles-area .role-item .title{font-size:36px;color:var(--white)}@media only screen and (max-width: 1919px){.roles-area .role-item .title{font-size:30px}}@media only screen and (max-width: 1199px){.roles-area .role-item .title{font-size:24px}}.roles-area .role-item .positions{font-size:24px;color:var(--white-2)}@media only screen and (max-width: 1199px){.roles-area .role-item .positions{font-size:18px}}@media(max-width: 575px){.roles-area .role-item .positions{grid-column:2}}.roles-area .role-item .icon{opacity:.4;transition:all .5s}@media only screen and (max-width: 767px){.roles-area .role-item .icon{display:none}} /* ============================== PROCESS AREA (Centered Layout) ============================== */ .process-area { background-color: var(--white); padding: 120px 0; text-align: center; } .dark .process-area { background-color: #171717; } /* ----- Section Heading ----- */ .process-area .section-header { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 20px; margin-bottom: 80px; text-align: center; } .process-area .section-subtitle { font-size: 16px; text-transform: uppercase; color: var(--primary-color); letter-spacing: 1px; } .process-area .section-title { font-size: 48px; font-weight: 700; max-width: 900px; color: var(--black); margin: 0 auto; line-height: 1.2; } .dark .process-area .section-title { color: var(--white); } .process-area .section-text { max-width: 750px; color: var(--text-color); margin: 10px auto 0; font-size: 18px; line-height: 1.8; } .dark .process-area .section-text { color: var(--white-2); } /* ----- Process Boxes Grid ----- */ .process-area .process-wrapper-box { margin-top: 80px; } .process-area .process-wrapper { display: grid; gap: 60px; grid-template-columns: repeat(4, 1fr); justify-content: center; align-items: start; } @media (max-width: 991px) { .process-area .process-wrapper { grid-template-columns: repeat(2, 1fr); gap: 40px; } } @media (max-width: 575px) { .process-area .process-wrapper { grid-template-columns: 1fr; } } /* ----- Process Box ----- */ .process-box { text-align: center; transition: transform 0.3s ease-in-out; } .process-box .thumb { display: flex; justify-content: center; align-items: center; } .process-box .thumb img { height: 60px; transition: transform 1s ease-in-out; transform-style: preserve-3d; backface-visibility: visible; } .process-box:hover .thumb img { transform: rotateY(360deg); } .process-box .content { margin-top: 25px; } .process-box .title { font-size: 22px; font-weight: 600; margin-top: 10px; color: var(--black); } .dark .process-box .title { color: var(--white); } .process-box p { color: var(--text-color); font-size: 16px; margin-top: 8px; line-height: 1.6; } .dark .process-box p { color: var(--white-2); } /* ----- Optional Fade-Up Animation ----- */ @keyframes fadeUp { from { opacity: 0; transform: translateY(40px); } to { opacity: 1; transform: translateY(0); } } .process-area.animate .section-header, .process-area.animate .process-wrapper { opacity: 0; animation: fadeUp 1s ease-out forwards; } .process-area.animate .process-wrapper { animation-delay: 0.3s; } /* ============================ Offcanvas main area ============================ */ .offcanvas-3__area { background: var(--primary); position: fixed; width: 100%; height: 100%; padding: 50px; z-index: 100000; overflow: hidden; left: 0%; opacity: 0; visibility: hidden; transform: perspective(359px) rotateY(50deg); transition: all 0.8s ease; } .offcanvas-3__inner { display: grid; grid-template-columns: 340px 1fr; height: 100%; } @media only screen and (max-width: 991px){ .offcanvas-3__inner { grid-template-columns: 260px 1fr; } } @media only screen and (max-width: 767px){ .offcanvas-3__inner { overflow-y: scroll; display: flex; flex-direction: column; } } /* ============================ Overlay ============================ */ .offcanvas-overlay { position: fixed; inset: 0; background: rgba(0,0,0,0.5); opacity: 0; visibility: hidden; transition: 0.3s; z-index: 99999; } .offcanvas-overlay.show { opacity: 1; visibility: visible; } /* ============================ Offcanvas Meta & Social ============================ */ .offcanvas-3__meta-wrapper { display: flex; flex-direction: column; gap: 50px; justify-content: space-between; } .offcanvas-3__meta li { font-size: 18px; line-height: 20px; color: var(--white); text-transform: uppercase; } .offcanvas-3__meta li:not(:last-child) { margin-bottom: 19px; } .offcanvas-3__meta li a:hover { color: var(--secondary); } .offcanvas-3__social .title { font-size: 18px; font-weight: 600; line-height: 20px; color: var(--white); text-transform: uppercase; margin-bottom: 10px; } .offcanvas-3__social-links { display: flex; gap: 20px; } .offcanvas-3__social-links a { font-size: 18px; color: var(--white); } .offcanvas-3__social-links a:hover { color: var(--secondary); } /* ============================ Menu styles ============================ */ .offcanvas-3__menu-wrapper { display: flex; align-items: flex-end; overflow-y: hidden; } .offcanvas-3__menu { position: relative; width: 100%; height: 100%; overflow-y: scroll; overflow-x: hidden; } .offcanvas-3__menu ul { position: relative; } .offcanvas-3__menu li { padding-left: 58px; position: relative; } @media only screen and (max-width: 767px){ .offcanvas-3__menu li { padding-left: 0; } } /* Main menu links */ .offcanvas-3__menu li a { font-size: 5vh; /* reduced font size */ color: var(--secondary); text-transform: uppercase; line-height: 1.1; position: relative; transition: all .5s cubic-bezier(0, 0, 0.23, 1); text-decoration: none; } @media only screen and (max-width: 991px){ .offcanvas-3__menu li a { font-size: 2.5vh; color: rgba(255,255,255,0.7); } } .offcanvas-3__menu li a:hover { color: #fff; letter-spacing: 1.5px; } /* Dropdown submenu */ .offcanvas-3__menu li ul.dropdown { display: none; list-style: none; padding-left: 20px; margin-top: 10px; } .offcanvas-3__menu li ul.dropdown li { margin-bottom: 15px; } .offcanvas-3__menu li ul.dropdown li a { font-size: 2vh; color: #fff; text-transform: capitalize; } .offcanvas-3__menu li ul.dropdown.open { display: block; } /* ============================ Close button ============================ */ .close-button { width: 70px; height: 70px; border-radius: 100%; background-color: var(--black-2); position: relative; border: 1px solid #333337; transition: all .5s; } .close-button:hover { background-color: var(--secondary); } .close-button span { width: 26px; height: 1px; display: inline-block; background-color: var(--white); position: absolute; left: 50%; top: 50%; transition: all .5s; } .close-button span:first-child { transform: translateX(-50%) rotate(45deg); } .close-button span:last-child { transform: translateX(-50%) rotate(-45deg); } /*contact us*/ .contact-area .section-title { max-width: 850px; } .contact-area .section-header { display: grid; gap: 20px 60px; grid-template-columns: 1fr auto; } @media only screen and (max-width: 991px) { .contact-area .section-header { grid-template-columns: 1fr; } } .contact-area .contact-formwrap { display: grid; gap: 50px 30px; grid-template-columns: repeat(2, 1fr); } @media only screen and (max-width: 767px) { .contact-area .contact-formwrap { grid-template-columns: repeat(1, 1fr); gap: 10px 30px; } } .contact-area .contact-formwrap .messages { grid-column: span 2; } @media only screen and (max-width: 767px) { .contact-area .contact-formwrap .messages { grid-column: auto; } } .contact-area .contact-formfield input { width: 100%; height: 40px; border: none; border-bottom: 1px solid var(--border); outline: none; background-color: rgba(0,0,0,0); transition: all .5s; } .contact-area .contact-formfield input:focus { border-color: var(--primary); } .contact-area .submit-btn { margin-top: 60px; } @media only screen and (max-width: 767px) { .contact-area .submit-btn { margin-top: 20px; } .contact-area .contact-list { align-items: flex-start; /* left align items */ text-align: left; /* left align text */ } .contact-area .contact-list li { justify-content: flex-start; /* ensures icon + text start from left */ } .contact-area .contact-list li a { text-align: left; /* email link left aligned */ } } .contact-area .section-content { display: grid; gap: 40px 60px; grid-template-columns: 1fr 740px; margin-top: 112px; } @media only screen and (max-width: 1919px) { .contact-area .section-content { margin-top: 72px; } } @media only screen and (max-width: 1399px) { .contact-area .section-content { grid-template-columns: 1fr 640px; } } @media only screen and (max-width: 1199px) { .contact-area .section-content { grid-template-columns: 1fr 600px; margin-top: 42px; } } @media only screen and (max-width: 991px) { .contact-area .section-content { grid-template-columns: 1fr; } } /* CONTACT LIST */ .contact-area .contact-list { margin-top: 26px; padding: 0; list-style: none; display: flex; flex-direction: column; /* force vertical stack */ gap: 18px; /* space between items */ } .contact-area .contact-list li { font-size: 18px; line-height: 26px; display: flex; align-items: center; gap: 14px; /* space between icon and text */ color: var(--white-2); } .contact-area .contact-list li a { text-decoration: none; color: inherit; transition: color 0.3s; } .contact-area .contact-list li a:hover { color: var(--primary); } /* ICON STYLE → round badges */ .contact-area .contact-list li i { background: #2B81C3; color: #fff; font-size: 16px; width: 36px; height: 36px; border-radius: 50%; display: flex; align-items: center; justify-content: center; flex-shrink: 0; transition: background 0.3s, transform 0.3s; } .contact-area .contact-list li i:hover { background: var(--secondary); /* optional hover color */ transform: scale(1.1); } .faq-area .accordion .accordion-button{font-size:24px;line-height:1;color:var(--primary);padding-top:24px;padding-bottom:18px;padding-inline-start:0;padding-inline-end:0;background-color:rgba(0,0,0,0);box-shadow:none;text-align:start;font-weight:400}@media only screen and (max-width: 1399px){.faq-area .accordion .accordion-button{font-size:22px}}@media only screen and (max-width: 1199px){.faq-area .accordion .accordion-button{font-size:20px}}@media only screen and (max-width: 767px){.faq-area .accordion .accordion-button{line-height:1.2}}.faq-area .accordion .accordion-button::after{content:"+";color:var(--primary);background-image:none;line-height:1;width:auto;height:auto;font-size:25px;margin-inline-start:50px;margin-inline-start:auto;margin-inline-end:0}.faq-area .accordion .accordion-button:not(.collapsed){pointer-events:none}.faq-area .accordion .accordion-button:not(.collapsed)::after{content:"-"}.faq-area .accordion .accordion-item{border-bottom:1px solid var(--border);background-color:rgba(0,0,0,0);border-radius:0px}.faq-area .accordion .accordion-item:not(:first-child){margin-top:0px}.faq-area .accordion .accordion-item:first-child{border-top:1px solid var(--border)}.faq-area .accordion .accordion-body{font-size:18px;line-height:1.44;padding-inline-start:0px;padding-inline-end:0px;padding-bottom:24px;padding-top:0;color:var(--secondary)}@media only screen and (max-width: 991px){.faq-area .accordion .accordion-body{padding-bottom:23px}}.faq-area .accordion-wrapper{margin-top:93px}@media only screen and (max-width: 1919px){.faq-area .accordion-wrapper{margin-top:73px}}@media only screen and (max-width: 1399px){.faq-area .accordion-wrapper{margin-top:53px}}@media only screen and (max-width: 1199px){.faq-area .accordion-wrapper{margin-top:43px}}/*# sourceMappingURL=master-faq.css.map */ /* ----------------------------- FAQ Accordion Styling ------------------------------ */ /* Remove default Bootstrap arrow */ .accordion-button::after { display: none !important; } /* Custom + / – icon before or after text */ .accordion-button::before { content: '+'; font-size: 24px; font-weight: 600; color: var(--primary, #007bff); margin-right: 12px; transition: all 0.3s ease; } /* When accordion is open */ .accordion-button:not(.collapsed)::before { content: '–'; color: var(--primary, #007bff); } /* Accordion button base styling */ .accordion-button { background: transparent !important; border: none !important; outline: none !important; box-shadow: none !important; font-size: 18px; font-weight: 500; color: #222; padding: 18px 0; text-align: left; display: flex; align-items: center; justify-content: flex-start; transition: color 0.3s ease; } /* Hover and active color change */ .accordion-button:hover { color: var(--primary, #007bff); } /* When expanded */ .accordion-button:not(.collapsed) { color: var(--primary, #007bff); } /* Accordion item */ .accordion-item { background: transparent !important; border: none !important; border-bottom: 1px solid rgba(0, 0, 0, 0.08); border-radius: 0 !important; margin-bottom: 10px; transition: all 0.3s ease; } /* Remove top border from first item if desired */ .accordion-item:first-child { border-top: 1px solid rgba(0, 0, 0, 0.08); } /* Accordion body text */ .accordion-body { padding: 0 0 18px 36px; color: #555; font-size: 16px; line-height: 1.6; } /* Remove focus glow */ .accordion-button:focus { box-shadow: none !important; outline: none !important; } /* Optional – adjust container spacing */ .faq-area { padding: 100px 0; } .faq-area .section-header { margin-bottom: 50px; } .faq-area .section-title { font-size: 36px; font-weight: 600; color: #111; } /* Responsive tweaks */ @media (max-width: 991px) { .accordion-button { font-size: 17px; } .accordion-body { font-size: 15px; padding-left: 28px; } .faq-area .section-title { font-size: 28px; } } @media (max-width: 575px) { .accordion-button { font-size: 16px; } .accordion-body { padding-left: 24px; } } /* Modal Background Overlay */ .modal-backdrop.show { opacity: 0.65; background: rgba(0, 0, 0, 0.6); } /* Modal Content - Polani Theme */ .catalogue-modal-content { background: rgba(255, 255, 255, 0.96) url("assets/imgs/patterns/fabric-texture.png") repeat; /* optional texture */ backdrop-filter: blur(14px); border-radius: 20px; border: none; padding: 2rem; box-shadow: 0 10px 40px rgba(0, 0, 0, 0.25); animation: modalFadeIn 0.5s ease forwards; font-family: "Poppins", sans-serif; } /* Smooth animation */ @keyframes modalFadeIn { from { transform: scale(0.95); opacity: 0; } to { transform: scale(1); opacity: 1; } } /* Modal Title */ #catalogueModalLabel { color: #2b81c3; font-size: 1.6rem; letter-spacing: 0.5px; } /* Input Group with Icons */ .input-with-icon .input-group-text { background-color: #f7f9fc; border: 1px solid #dcdcdc; border-right: none; color: #2b81c3; font-size: 1rem; display: flex; align-items: center; justify-content: center; border-top-left-radius: 12px; border-bottom-left-radius: 12px; } .catalogue-form .form-control { border-radius: 0 12px 12px 0; border: 1px solid #dcdcdc; padding: 10px 14px; transition: all 0.3s ease; } .catalogue-form .form-control:focus { border-color: #2b81c3; box-shadow: 0 0 0 4px rgba(43, 129, 195, 0.15); } /* Labels */ .catalogue-form .form-label { font-weight: 600; color: #333; margin-bottom: 6px; } /* Submit Button */ .catalogue-btn { background: linear-gradient(135deg, #2b81c3, #1a5b8e); border: none; border-radius: 50px; color: #fff; font-weight: 600; letter-spacing: 0.4px; transition: all 0.3s ease; box-shadow: 0 4px 14px rgba(43, 129, 195, 0.35); } .catalogue-btn:hover { transform: translateY(-2px); box-shadow: 0 8px 20px rgba(43, 129, 195, 0.45); } /* Responsive */ @media (max-width: 576px) { .catalogue-modal-content { padding: 1.5rem; } #catalogueModalLabel { font-size: 1.3rem; } } /* ------------------------------- Achievements Section (Polani Theme) -------------------------------- */ /*.achievements-section { background-color: #2B81C3; color: #ffffff; text-align: center; padding: 100px 20px 200px; font-family: 'Poppins', sans-serif; position: relative; overflow: visible; margin-top:150px; } .achievements-section::before { content: ""; position: absolute; inset: 0; background: radial-gradient(circle at 30% 20%, rgba(255,255,255,0.08) 0%, transparent 70%), radial-gradient(circle at 70% 80%, rgba(255,255,255,0.06) 0%, transparent 70%); z-index: 0; } .achievements-section * { position: relative; z-index: 1; } .achievements-grid { display: flex; flex-wrap: wrap; justify-content: center; gap: 60px; margin-bottom: 70px; } .stat h2 { font-size: 2.4rem; font-weight: 700; margin-bottom: 6px; } .stat p { font-size: 1rem; opacity: 0.9; margin: 0; } .cta-wrapper { text-align: center; margin-top: 40px; } .cta-btn { display: inline-flex; align-items: center; justify-content: center; background: #ffffff; color: #2B81C3; padding: 15px 38px; border-radius: 50px; font-weight: 600; letter-spacing: 0.4px; text-decoration: none; transition: all 0.3s ease; font-size: 0.95rem; box-shadow: 0 8px 20px rgba(0,0,0,0.2); } .cta-btn i { margin-left: 10px; transition: transform 0.3s ease; } .cta-btn:hover { background: #f5f9ff; transform: translateY(-4px); box-shadow: 0 10px 25px rgba(0,0,0,0.25); } .cta-btn:hover i { transform: translateX(4px); } .review-bar { background: #ffffff; color: #000; padding: 40px 60px; border-radius: 10px; display: flex; align-items: center; justify-content: center; gap: 35px; box-shadow: 0 12px 35px rgba(0, 0, 0, 0.15); max-width: 700px; margin: -100px auto 0; position: relative; z-index: 10; transition: all 0.3s ease; } .review-bar:hover { margin-top: -105px; box-shadow: 0 18px 45px rgba(0, 0, 0, 0.25); } .divider { width: 1px; height: 35px; background-color: rgba(0, 0, 0, 0.2); } .review-img { height: 60px; object-fit: contain; } .review-text { font-weight: 500; color: #333; font-size: 1.05rem; white-space: nowrap; } .review-text .highlight { color: #2B81C3; font-weight: 600; } .floating-winner { position: absolute; top: 0; right: 0; transform: translate(50%, -50%); z-index: 50; } .floating-winner .winner-img { height: 300px; object-fit: contain; box-shadow: 0 8px 20px rgba(0,0,0,0.15); } @media (max-width: 767px) { .achievements-grid { flex-direction: column; gap: 30px; } .cta-wrapper { margin-top: 25px; } .review-bar { margin: 20px auto 0; padding: 20px 25px; flex-direction: column; text-align: center; gap: 15px; } .divider { display: none; } .review-img { height: 45px; } .floating-winner { position: relative; top: auto; right: auto; transform: none; margin: 20px auto 0; display: flex; justify-content: center; } .floating-winner .winner-img { height: 120px; } .stat h2 { font-size: 2rem; } .stat p { font-size: 0.95rem; } } @media (min-width: 768px) and (max-width: 839px) { .achievements-grid { gap: 35px; } .cta-wrapper { margin-top: 25px; } .review-bar { margin-top: -80px; padding: 30px 45px; } .floating-winner .winner-img { height: 180px; } } @media (min-width: 840px) and (max-width: 991px) { .achievements-grid { gap: 40px; } .cta-wrapper { margin-top: 30px; } .review-bar { margin-top: -85px; padding: 32px 50px; } .floating-winner .winner-img { height: 200px; } } @media (min-width: 850px) and (max-width: 899px) { .achievements-grid { gap: 42px; } .cta-wrapper { margin-top: 30px; } .review-bar { margin-top: -88px; padding: 33px 52px; } .floating-winner .winner-img { height: 210px; } } @media (min-width: 992px) and (max-width: 1199px) { .achievements-grid { gap: 50px; } .cta-wrapper { margin-top: 35px; } .review-bar { margin-top: -95px; padding: 36px 55px; } .floating-winner .winner-img { height: 250px; } } @media (min-width: 1200px) and (max-width: 1399px) { .achievements-grid { gap: 55px; } .cta-wrapper { margin-top: 40px; } .review-bar { margin-top: -100px; padding: 38px 58px; } .floating-winner .winner-img { height: 280px; } } @media (min-width: 1400px) and (max-width: 1919px) { .achievements-grid { gap: 60px; } .cta-wrapper { margin-top: 45px; } .review-bar { margin-top: -105px; padding: 40px 60px; } .floating-winner .winner-img { height: 300px; } } @media (min-width: 1920px) { .achievements-grid { gap: 70px; } .cta-wrapper { margin-top: 50px; } .review-bar { margin-top: -110px; padding: 45px 65px; } .floating-winner .winner-img { height: 350px; } }--> /* =========================== Hero Banner / Carousel =========================== */ 
		/* ============================= */
/* ✅ Responsive Hero Banner Fix */
/* ============================= */

.hero-banner {
  position: relative;
  margin-top: 90px;     /* Default for desktop */
  z-index: 1;
  overflow: hidden;
  height: 90vh;         /* Default height */
}

/* Large tablets / small laptops */
@media (max-width: 1200px) {
  .hero-banner {
    margin-top: 80px;
    height: 80vh;
  }
}

/* Tablets */
@media (max-width: 992px) {
  .hero-banner {
    margin-top: 75px;
    height: 70vh;
    /*margin-bottom: -420px;*/ /* Reduced from -550px */
  }
}

/* Small tablets / large phones */
@media (max-width: 768px) {
  .hero-banner {
    margin-top: 70px;
    height: 60vh;
    /*margin-bottom: -320px;*/ /* Reduced for smoother layout */
  }
}

/* Phones (including iPhone 14 Pro Max ~430 px) */
@media (max-width: 576px) {
  .hero-banner {
    margin-top: 80px;   /* ✅ Keep this (looks good on iPhone 14 Pro Max) */
    height: 55vh;       /* Slightly taller for better hero coverage */
    /*margin-bottom: -280px;*/
  }
}

/* Small phones (~414 px and below) */
@media (max-width: 414px) {
  .hero-banner {
    margin-top: 70px;
    height: 50vh;
    /*margin-bottom: -220px;*/
  }
}

/* Very small phones (~360 px and below) */
@media (max-width: 360px) {
  .hero-banner {
    margin-top: 60px;
    height: 45vh;
    /*margin-bottom: -180px;*/
  }
}

/* Ultra-wide desktops */
@media (min-width: 1800px) {
  .container.large {
    /*max-width: 1750px;*/
  }
}
 
		 /* -------------------------------------------------- Blog Details Area -------------------------------------------------- */ .event-details-area-inner { padding-top: 217px; } @media (max-width: 1919px) { .event-details-area-inner { padding-top: 147px; } } @media (max-width: 1199px) { .event-details-area-inner { padding-top: 127px; } } /* -------------------------------------------------- Section Header -------------------------------------------------- */ .event-details-area .section-header { text-align: center; /* Center align title */ } .event-details-area .section-header .meta-box { margin-top: 31px; margin-bottom: 97px; } @media (max-width: 1919px) { .event-details-area .section-header .meta-box { margin-bottom: 77px; } } @media (max-width: 1199px) { .event-details-area .section-header .meta-box { margin-bottom: 57px; } } .event-details-area .section-header .meta-box ul { display: flex; gap: 30px 0; } @media (max-width: 575px) { .event-details-area .section-header .meta-box ul { display: grid; grid-template-columns: auto auto; } } .event-details-area .section-header .meta-box ul li:not(:first-child) { padding-inline-start: 30px; border-inline-start: 1px solid var(--border); margin-inline-start: 30px; } @media (max-width: 575px) { .event-details-area .section-header .meta-box ul li:not(:first-child) { padding-inline-start: 0; border-inline-start: 0; margin-inline-start: 0; } } .event-details-area .section-header .meta-box .number { font-size: 30px; color: var(--primary); font-family: var(--font_beatricetrial); line-height: 1; } @media (max-width: 1199px) { .event-details-area .section-header .meta-box .number { font-size: 26px; } } @media (max-width: 767px) { .event-details-area .section-header .meta-box .number { font-size: 20px; } } .event-details-area .section-header .meta-box .text { font-size: 18px; line-height: 1.4; margin-top: 9px; } /* -------------------------------------------------- Layout Structure -------------------------------------------------- */ .event-details-area .eventdetails__wrapper { margin-top: 100px; display: grid; grid-template-columns: 80px 850px; gap: 30px 140px; } @media (max-width: 1199px) { .event-details-area .eventdetails__wrapper { grid-template-columns: 80px 1fr; gap: 30px 60px; margin-top: 80px; } } @media (max-width: 991px) { .event-details-area .eventdetails__wrapper { grid-template-columns: 1fr; margin-top: 60px; } } /* -------------------------------------------------- Text Wrapper -------------------------------------------------- */ .event-details-area .text-wrapper .text { max-width: 900px; margin: 0 auto; text-align: center; font-size: 18px; line-height: 1.7; color: var(--black); } .event-details-area .text-wrapper .text:not(:first-child) { margin-top: 25px; } /* -------------------------------------------------- Headings Inside Content -------------------------------------------------- */ .event-details-area h1.section-title, .event-details-area h2.section-title, .event-details-area h3.section-title, .event-details-area h4.section-title, .event-details-area h5.section-title { text-align: center; margin: 0 auto; line-height: 1.3; font-weight: 600; margin-bottom: 10px; /* ↓ reduced from 20px to 10px */ } /* -------------------------------------------------- Image & Media -------------------------------------------------- */ .event-details-area .thumb { margin-top: 20px; /* ↓ reduced from 34px to 20px */ overflow: hidden; } .event-details-area .thumb img { width: 100%; transition: transform 0.5s ease; } .event-details-area .thumb img:hover { transform: scale(1.05); } /* -------------------------------------------------- Content Block -------------------------------------------------- */ .event-details-area .content-block { margin-top: 50px; } @media (max-width: 991px) { .event-details-area .content-block { margin-top: 30px; } } .event-details-area .content-block .content-title { font-size: 30px; line-height: 1.2; margin-bottom: 22px; text-align: center; } @media (max-width: 991px) { .event-details-area .content-block .content-title { font-size: 24px; margin-bottom: 12px; } } /* -------------------------------------------------- Blog List (Related Articles) -------------------------------------------------- */ /*.event-area { text-align: center; } .event-area .events-wrapper { display: grid; gap: 45px; grid-template-columns: repeat(3, 1fr); } @media (max-width: 991px) { .event-area .events-wrapper { grid-template-columns: repeat(2, 1fr); } } @media (max-width: 575px) { .event-area .events-wrapper { grid-template-columns: 1fr; } } .event-area .event-box { transition: all 0.5s ease; } .event-area .event-box:hover .content { border-color: var(--primary); } .event-area .event-box .thumb img { width: 100%; } .event-area .event-box .content { padding: 25px 0; border-bottom: 1px solid var(--border); display: grid; grid-template-columns: 68px 1fr auto; gap: 10px; transition: all 0.5s; } .event-area .event-box .number { font-size: 18px; line-height: 1; } .event-area .event-box .title { font-size: 24px; line-height: 1.25; } @media (max-width: 1199px) { .event-area .event-box .title { font-size: 20px; } } .event-area .event-box .icon i { font-size: 20px; color: var(--primary); transform: rotate(-45deg); }*/ .blog-details-area-inner{ padding-top:217px } @media only screen and (max-width: 1919px){ .blog-details-area-inner{ padding-top:147px } } @media only screen and (max-width: 1199px){ .blog-details-area-inner{ padding-top:127px } } @media only screen and (max-width: 991px){ .blog-details-area-inner{ padding-top:127px } } .blog-details-area .section-header .meta-box{ margin-top:31px; margin-bottom:97px } @media only screen and (max-width: 1919px){ .blog-details-area .section-header .meta-box{ margin-bottom:77px } } @media only screen and (max-width: 1199px){ .blog-details-area .section-header .meta-box{ margin-bottom:57px } } .blog-details-area .section-header .meta-box ul{ display:flex; gap:30px 0 } @media(max-width: 575px){ .blog-details-area .section-header .meta-box ul{ display:grid; grid-template-columns:auto auto } } .blog-details-area .section-header .meta-box ul li:not(:first-child){ padding-inline-start:30px; border-inline-start:1px solid var(--border); margin-inline-start:30px } @media(max-width: 575px){ .blog-details-area .section-header .meta-box ul li:not(:first-child){ padding-inline-start:0px; border-inline-start:0; margin-inline-start:0px } } .blog-details-area .section-header .meta-box .number{ font-size:30px; color:var(--primary); line-height:1; display:inline-block; } @media only screen and (max-width: 1199px){ .blog-details-area .section-header .meta-box .number{ font-size:26px } } @media only screen and (max-width: 767px){ .blog-details-area .section-header .meta-box .number{ font-size:20px } } .blog-details-area .section-header .meta-box .text{ font-size:18px; line-height:1; margin-top:9px } .blog-details-area .blogdetails-overview{ display:flex; gap:20px; flex-direction:column; max-width:80px; border-inline-end:1px solid var(--border) } @media only screen and (max-width: 991px){ .blog-details-area .blogdetails-overview{ flex-direction:row; border-bottom:1px solid var(--border); border-inline-end:0; display:inline-flex; max-width:100% } } .blog-details-area .blogdetails-overview li{ text-align:center; position:relative; line-height:1.1 } .blog-details-area .blogdetails-overview li i{ display:block; padding-bottom:3px; color:var(--primary) } .blog-details-area .blogdetails-overview li span{ font-weight:400;font-size:12px; line-height:1; color:var(--primary) } .blog-details-area .blogdetails-overview li a{ color:var(--primary) } .blog-details-area .blogdetails-overview li:first-child{ margin-bottom:30px } @media only screen and (max-width: 991px){ .blog-details-area .blogdetails-overview li:first-child{ margin-bottom:10px; border-inline-end:1px solid var(--border); padding-inline-end:20px } } .blog-details-area .blogdetails-overview li:first-child::before{ content:""; position:absolute; inset-inline-end:0; bottom:-25px; width:80px; height:1px; background:var(--border) } @media only screen and (max-width: 991px){ .blog-details-area .blogdetails-overview li:first-child::before{ display:none } } .blog-details-area .blogdetails__wrapper{ margin-top:100px; display:grid; gap:30px 140px; grid-template-columns:80px 850px } @media only screen and (max-width: 1199px){ .blog-details-area .blogdetails__wrapper{ gap:30px 60px; grid-template-columns:80px 1fr; margin-top:80px } } @media only screen and (max-width: 991px){ .blog-details-area .blogdetails__wrapper{ grid-template-columns:1fr; margin-top:60px } } .blog-details-area .blog-details-quote{ background-color:var(--primary); padding:35px 45px; display:grid; gap:20px 45px; grid-template-columns:60px 1fr; position:relative; z-index:1; margin-bottom:60px } .dark .blog-details-area .blog-details-quote{ background-color:#171717 } @media only screen and (max-width: 1399px){ .blog-details-area .blog-details-quote{ margin-bottom:40px } } @media only screen and (max-width: 991px){ .blog-details-area .blog-details-quote{ grid-template-columns:1fr; padding:25px 25px } } .blog-details-area .blog-details-quote .shape-1{ position:absolute; inset-inline-end:45px; bottom:35px; z-index:-1 } @media only screen and (max-width: 991px){ .blog-details-area .blog-details-quote .icon{ display:none } } .blog-details-area .blog-details-quote .text{ font-size:27px; line-height:1.11; color:var(--white); font-family:var(--font_beatricetrial) } @media only screen and (max-width: 991px){ .blog-details-area .blog-details-quote .text{ font-size:23px } } .blog-details-area .blog-details-quote .name{ font-size:14px; line-height:1; display:-webkit-inline-box;margin-top:30px; color:var(--white) } .blog-details-area .text-wrapper .text:not(:first-child){ margin-top:25px } .blog-details-area .thumb{ margin-top:34px } .blog-details-area .content-block{ margin-top:50px } @media only screen and (max-width: 991px){ .blog-details-area .content-block{ margin-top:30px } } .blog-details-area .content-block .content-title{ font-size:30px; line-height:1.2; margin-bottom:22px } @media only screen and (max-width: 991px){ .blog-details-area .content-block .content-title{ margin-bottom:12px } } .blog-details-area .details-service{ margin-top:21px } .blog-details-area .details-service li{ font-size:18px; line-height:1.66; color:var(--primary) } .blog-details-area .details-service li span{ margin-inline-end:10px } .blog-details-area .tagswrap{ margin-top:30px } .blog-details-area .tags{ display:flex } .blog-details-area .tags span{ color:var(--primary); margin-inline-end:5px } .blog-details-area .tags a{ text-decoration:underline } .blog-details-area .contact-formwrap{ display:grid; gap:50px 30px; grid-template-columns:repeat(2, 1fr) } @media only screen and (max-width: 767px){ .blog-details-area .contact-formwrap{ grid-template-columns:repeat(1, 1fr) } } .blog-details-area .contact-formwrap .messages{ grid-column:span 2 } @media only screen and (max-width: 767px){ .blog-details-area .contact-formwrap .messages{ grid-column:auto } } .blog-details-area .contact-formfield input{ width:100%; height:40px; border:none; border-bottom:1px solid var(--border); outline:none; background-color:rgba(0,0,0,0); transition:all .5s } .blog-details-area .contact-formfield input:focus{ border-color:var(--primary) } .blog-details-area .contact-wrap{ margin-top:53px } @media only screen and (max-width: 1399px){ .blog-details-area .contact-wrap{ margin-top:43px } } @media only screen and (max-width: 1199px){ .blog-details-area .contact-wrap{ margin-top:23px } } .blog-details-area .submit-btn{ margin-top:60px } .blog-area .blogs-wrapper-box{ margin-top:47px } @media only screen and (max-width: 1399px){ .blog-area .blogs-wrapper-box{ margin-top:27px } } .blog-area .blogs-wrapper{ display:grid; gap:45px 45px; grid-template-columns:repeat(3, 1fr) } @media only screen and (max-width: 1199px){ .blog-area .blogs-wrapper{ gap:40px 35px } } @media only screen and (max-width: 991px){ .blog-area .blogs-wrapper{ grid-template-columns:repeat(2, 1fr) } } @media(max-width: 575px){ .blog-area .blogs-wrapper{ grid-template-columns:repeat(1, 1fr) } } .blog-area .blog-box:hover .icon{ transform:none; opacity:1 } .blog-area .blog-box:hover .content{ border-color:var(--primary) } .blog-area .blog-box .thumb img{ width:100% } .blog-area .blog-box .content{ padding-top:25px; padding-bottom:23px; border-bottom:1px solid var(--border); display:grid; gap:10px; grid-template-columns:68px 1fr auto; transition:all .5s } @media only screen and (max-width: 1199px){ .blog-area .blog-box .content{ grid-template-columns:38px 1fr auto; padding-top:20px; padding-bottom:13px } } .blog-area .blog-box .number{ font-size:18px; line-height:1 } .blog-area .blog-box .title{ font-size:24px; line-height:1.25 } @media only screen and (max-width: 1199px){ .blog-area .blog-box .title{ font-size:20px } } .blog-area .blog-box .icon{ transform:translate(-10px, 10px); opacity:0; transition:all .5s } @media only screen and (max-width: 767px){ .blog-area .blog-box .icon{ display:none } } .blog-area .blog-box .icon i{ font-size:20px; color:var(--primary); transform:rotate(-45deg) } /* --- Blog Details List Style --- */ .blog-details-area .details-service ul { list-style-type: disc; /* or circle / square / decimal */ padding-left: 25px; /* space for bullet visibility */ margin-top: 10px; margin-bottom: 10px; } .blog-details-area .details-service ul li { margin-bottom: 8px; line-height: 1.7; color: var(--primary); font-size: 18px; } .blog-details-area .details-service ul li b { color: var(--black); } /*terry towel page css*/ @media(min-width: 1900px){.container.large{max-width:1850px}} .terry-towel-area-1 .section-title{ max-width:330px } .terry-towel-area-1 .section-header{ display:grid; gap:20px 60px; grid-template-columns:auto auto auto; align-items:center; justify-content:space-between } @media only screen and (max-width: 991px){ .terry-towel-area-1 .section-header{ grid-template-columns:1fr 1fr; gap:20px 40px } } @media only screen and (max-width: 767px){ .terry-towel-area-1 .section-header{ grid-template-columns:1fr } } .terry-towel-area-1 .section-header .text{ max-width:450px } .terry-towel-area-1 .nav-icon{ width:70px; height:70px; font-size:20px; border:1px solid var(--border); border-radius:50%; display:flex; justify-content:center; align-items:center; transition:all .5s; color:var(--primary) } @media only screen and (max-width: 1919px){ .terry-towel-area-1 .nav-icon{ width:60px; height:60px; font-size:16px } } .terry-towel-area-1 .nav-icon:hover{ background-color:var(--theme); color:var(--black); border-color:rgba(0,0,0,0) } .dark .terry-towel-area-1 .nav-icon:hover{ color:var(--black) } .terry-towel-area-1 .slider-nav{ display:flex; gap:20px } .dir-rtl .terry-towel-area-1 .slider-nav{ flex-direction:row-reverse } @media only screen and (max-width: 991px){ .terry-towel-area-1 .slider-nav{ display:none } } .terry-towel-area-1 .terry-towels-wrapper-box{ margin-top:90px } @media only screen and (max-width: 1919px){ .terry-towel-area-1 .terry-towels-wrapper-box{ margin-top:70px } } @media only screen and (max-width: 1399px){ .terry-towel-area-1 .terry-towels-wrapper-box{ margin-top:50px } } .terry-towel-area-1 .terry-towels-wrapper-box .swiper{ margin:-30px; padding:30px } @media only screen and (max-width: 991px){ .terry-towel-area-1 .terry-towels-wrapper-box .swiper{ margin:0; padding:0 } } .terry-towel-box-1{ display:inline-block; position:relative } .terry-towel-box-1:hover .thumb{ transform:scale(1.09) } @media only screen and (max-width: 991px){ .terry-towel-box-1:hover .thumb{ transform:none } } .terry-towel-box-1:hover .wc-btn-circle{ margin-bottom:0; opacity:1 } .terry-towel-box-1 .thumb{ position:relative; border-radius:5px; overflow:hidden; transition:all .5s } .terry-towel-box-1 .thumb:after{ position:absolute; content:""; width:100%; height:100%; background-image:linear-gradient(180deg, rgba(18, 18, 18, 0) 38.85%, #121212 100%); top:0; inset-inline-start:0 } .terry-towel-box-1 .thumb img{ width:100%; height:100%; -o-object-fit:cover; object-fit:cover } .terry-towel-box-1 .tag{ font-size:14px; text-transform:uppercase; line-height:1;display:inline-block;padding:10px 15px;border-radius:5px;background-color:rgba(255,255,255,.35);color:var(--black)}.terry-towel-box-1 .meta{position:absolute;top:0px;inset-inline-start:0px;margin:40px}@media only screen and (max-width: 1919px){.terry-towel-box-1.meta{margin:30px}}.terry-towel-box-1 .title{font-size:24px;line-height:1.25;font-weight:600;color:var(--white)}@media only screen and (max-width: 1919px){.terry-towel-box-1 .title{font-size:22px}}.terry-towel-box-1 .title a:hover{color:var(--white)}.terry-towel-box-1 .content{position:absolute;bottom:0;inset-inline-start:0;margin:40px;overflow:hidden}@media only screen and (max-width: 1919px){.terry-towel-box-1 .content{margin:30px}}.terry-towel-box-1 .wc-btn-circle{margin-top:28px;width:60px;height:60px;background-color:var(--theme);color:var(--black);margin-bottom:-88px;opacity:0;transition:all .5s}@media only screen and (max-width: 991px){.terry-towel-box-1 .wc-btn-circle{margin-bottom:0;opacity:1}}.terry-towel-box-1 .wc-btn-circle i{transform:rotate(-45deg)}.product-detail-area .section-subtitle{ font-size:16px; text-transform:uppercase; color:var(--primary); } .product-detail-area .section-title-wrapper{ display:grid; gap:30px 60px; } @media only screen and (max-width: 1399px){ .product-detail-area .section-title-wrapper{ grid-template-columns:1fr 740px } } @media only screen and (max-width: 1199px){ .product-detail-area .section-title-wrapper{ grid-template-columns:1fr 600px } } @media only screen and (max-width: 991px){ .product-detail-area .section-title-wrapper{ grid-template-columns:1fr } } .product-area .section-content{ margin-top:61px } .product-area .section-content .title{ font-size:36px; line-height:1 } .product-area .section-content .text-wrapper{ margin-top:33px } .product-area .results-wrapper-box{ margin-top:43px } .product-area .results-wrapper{ border-top:1px solid var(--border); display:grid; grid-template-columns:repeat(4, 1fr) } @media only screen and (max-width: 767px){ .product-area .results-wrapper{ border-top:0; grid-template-columns:repeat(1, 1fr) } } .product-area .result-box{ padding:46px 45px 13px } @media only screen and (max-width: 1399px){ .product-area .result-box{ padding:26px 25px 13px } } @media only screen and (max-width: 767px){ .product-area .result-box{ border-top:1px solid var(--border); padding:26px 0px 23px } } .product-area .result-box:not(:first-child){ border-inline-start:1px solid var(--border) } @media only screen and (max-width: 767px){ .product-area .result-box:not(:first-child){ border-inline-start:0 } } .product-area .result-box .text{ font-size:16px; line-height:24px; margin-top:29px } @media only screen and (max-width: 991px){ .product-area .result-box .text{ margin-top:14px } } .product-area .result-box .number{ font-size:42px; font-weight:600; color:var(--primary) } @media only screen and (max-width: 1399px){ .product-area .result-box .number{ font-size:32px } } /* ------------------------------ Project Area 1 --------------------------------*/ .project-area-1 .section-title { max-width: 330px; } /* Section Header Grid (Default) */ .project-area-1 .section-header { display: grid; gap: 20px 60px; grid-template-columns: auto auto auto; align-items: center; justify-content: space-between; } /* Tablet View */ @media only screen and (max-width: 991px) { .project-area-1 .section-header { grid-template-columns: 1fr 1fr; gap: 20px 40px; } } /* Mobile View */ @media only screen and (max-width: 767px) { .project-area-1 .section-header { grid-template-columns: 1fr; } } /* Text Block */ .project-area-1 .section-header .text { max-width: 450px; } /* Navigation Icons */ .project-area-1 .nav-icon { width: 70px; height: 70px; font-size: 20px; border: 1px solid var(--border); border-radius: 50%; display: flex; justify-content: center; align-items: center; transition: all 0.5s; color: var(--primary); } @media only screen and (max-width: 1919px) { .project-area-1 .nav-icon { width: 60px; height: 60px; font-size: 16px; } } .project-area-1 .nav-icon:hover { background-color: var(--theme); color: var(--black); border-color: rgba(0, 0, 0, 0); } .dark .project-area-1 .nav-icon:hover { color: var(--black); } /* Slider Navigation */ .project-area-1 .slider-nav { display: flex; gap: 20px; } .dir-rtl .project-area-1 .slider-nav { flex-direction: row-reverse; } @media only screen and (max-width: 991px) { .project-area-1 .slider-nav { display: none; } } /* Project Wrapper Box */ .project-area-1 .projects-wrapper-box { margin-top: 90px; } @media only screen and (max-width: 1919px) { .project-area-1 .projects-wrapper-box { margin-top: 70px; } } @media only screen and (max-width: 1399px) { .project-area-1 .projects-wrapper-box { margin-top: 50px; } } /* Swiper Wrapper */ .project-area-1 .projects-wrapper-box .swiper { margin: -30px; padding: 30px; } @media only screen and (max-width: 991px) { .project-area-1 .projects-wrapper-box .swiper { margin: 0; padding: 0; } } /* Project Box */ .project-box-1 { display: inline-block; position: relative; } .project-box-1:hover .thumb { transform: scale(1.09); } @media only screen and (max-width: 991px) { .project-box-1:hover .thumb { transform: none; } } .project-box-1:hover .wc-btn-circle { margin-bottom: 0; opacity: 1; } /* Thumbnail */ .project-box-1 .thumb { position: relative; border-radius: 5px; overflow: hidden; transition: all 0.5s; } .project-box-1 .thumb:after { position: absolute; content: ""; width: 100%; height: 100%; background-image: linear-gradient(180deg, rgba(18, 18, 18, 0) 38.85%, #121212 100%); top: 0; inset-inline-start: 0; } .project-box-1 .thumb img { width: 100%; height: 100%; object-fit: cover; } /* Meta Info */ .project-box-1 .tag { font-size: 14px; text-transform: uppercase; line-height: 1; display: inline-block; padding: 10px 15px; border-radius: 5px; background-color: rgba(255, 255, 255, 0.35); color: var(--black); } .project-box-1 .meta { position: absolute; top: 0; inset-inline-start: 0; margin: 40px; } @media only screen and (max-width: 1919px) { .project-box-1 .meta { margin: 30px; } } /* Project Title */ .project-box-1 .title { font-size: 24px; line-height: 1.25; font-weight: 600; color: var(--white); } @media only screen and (max-width: 1919px) { .project-box-1 .title { font-size: 22px; } } .project-box-1 .title a:hover { color: var(--white); } /* Project Content */ .project-box-1 .content { position: absolute; bottom: 0; inset-inline-start: 0; margin: 40px; overflow: hidden; } @media only screen and (max-width: 1919px) { .project-box-1 .content { margin: 30px; } } /* Circle Button */ .project-box-1 .wc-btn-circle { margin-top: 28px; width: 60px; height: 60px; background-color: var(--theme); color: var(--black); margin-bottom: -88px; opacity: 0; transition: all 0.5s; } @media only screen and (max-width: 991px) { .project-box-1 .wc-btn-circle { margin-bottom: 0; opacity: 1; } } .project-box-1 .wc-btn-circle i { transform: rotate(-45deg); } /* ------------------------------ ALIGNMENT FIX (Match Events Area) --------------------------------*/ .project-area-1 .section-header { text-align: center; /* Center all text */ justify-content: center; /* Center items in grid */ grid-template-columns: 1fr; /* Single centered column */ margin: 0 auto; max-width: 1100px; } .project-area-1 .section-title { text-align: center; margin: 0 auto 20px; max-width: 800px; /* increased from 330px */ } .project-area-1 .section-header .text { text-align: center; margin: 0 auto; max-width: 900px; } /* Responsive: keep centered layout on smaller screens */ @media only screen and (max-width: 991px) { .project-area-1 .section-header { grid-template-columns: 1fr; } } /* Move navigation arrows to top-left side by side */ .project-area-1 .slider-nav { position: absolute; /* inside the section */ top: 0; /* stick to top of slider area */ left: 0; /* align with left edge */ display: flex; align-items: center; gap: 12px; /* space between arrows */ z-index: 10; /* make sure they're visible */ padding: 20px 0; /* adjust spacing from top */ } /* Optional: adjust if inside a container */ .project-area-1 { position: relative; /* this keeps arrows inside this section */ } /* Icon style */ .project-area-1 .slider-nav .nav-icon { width: 60px; height: 60px; font-size: 18px; border: 1px solid var(--border); border-radius: 50%; display: flex; justify-content: center; align-items: center; background-color: #fff; color: var(--primary); transition: all 0.3s ease; cursor: pointer; } .project-area-1 .slider-nav .nav-icon:hover { background-color: var(--theme); color: var(--black); border-color: transparent; } /* Mobile view: center below text */ @media only screen and (max-width: 991px) { .project-area-1 .slider-nav { position: static; justify-content: center; margin-top: 20px; } } /* Center the Explore button group */ .project-area-1 .btn-wrapper { display: flex; justify-content: center; /* centers horizontally */ align-items: center; /* vertically aligns if needed */ margin-top: 30px; /* space above buttons */ } .skill-area .section-title{ max-width:660px } .skill-area .section-header{ display:grid; gap:20px 60px; grid-template-columns:auto auto; justify-content:space-between } @media only screen and (max-width: 991px){ .skill-area .section-header{ grid-template-columns:auto } } .skill-area .section-header .text{ max-width:300px } .skill-area .skills-wrapper-box{ margin-top:59px } .skill-area .skills-wrapper{ display:grid; gap:40px 60px; grid-template-columns:420px auto; justify-content:space-between } @media only screen and (max-width: 991px){ .skill-area .skills-wrapper{ grid-template-columns:auto } } .skill-area .skills-wrapper .nav{ border-inline-start:1px solid #ececec; padding-inline-start:18px; margin-inline-start:1px } .skill-area .skills-wrapper .nav .nav-link{ background-color:rgba(0,0,0,0); position:relative; padding:0; text-align:start; padding-top:18px } .skill-area .skills-wrapper .nav .nav-link.active:before{ position:absolute; content:""; width:3px; height:100%; background-color:var(--theme); top:0; inset-inline-start:-20px } .skill-area .skills-wrapper .nav .nav-link.active .icon{ background-color:var(--theme) } .skill-area .skills-wrapper .nav li:not(:first-child){ margin-top:20px } .skill-thumb{ padding-top:45px; padding-inline-start:80px; position:relative } .skill-thumb .small-image{ position:absolute; top:0; inset-inline-start:0; max-width:740px; margin-inline-start:auto } .skill-nav{ display:flex; gap:20px; align-items:flex-start; position:relative } .skill-nav .icon{ width:65px; height:65px; background-color:rgba(18,18,18,.0196078431); display:inline-flex; justify-content:center; align-items:center; min-width:65px; border-radius:50% } .skill-nav .title{ font-size:25px; line-height:.88; text-transform:uppercase; padding-top:19px } @media only screen and (max-width: 1199px){ .skill-nav .title{ font-size:30px; padding-top:0 } } @media only screen and (max-width: 991px){ .skill-nav .title{ font-size:24px } } .skill-nav .text{ margin-top:8px } .report-area .section-title{ max-width:580px; margin-inline:auto } .report-area .section-header{ text-align:center } .report-area .section-content-box{ margin-top:82px } @media only screen and (max-width: 1919px){ .report-area .section-content-box{ margin-top:72px } } @media only screen and (max-width: 1399px){ .report-area .section-content-box{ margin-top:52px } } .report-area .section-content{ display:grid; gap:40px 60px; grid-template-columns:1fr 340px; justify-content:space-between } @media only screen and (max-width: 1399px){ .report-area .section-content{ grid-template-columns:1fr 290px } } @media only screen and (max-width: 1199px){ .report-area .section-content{ grid-template-columns:1fr 270px } }@media only screen and (max-width: 991px){.report-area .section-content{grid-template-columns:1fr}}.report-area .report-graph{max-width:860px}.report-area .satisfaction-box .number{font-size:150px;font-weight:400;display:flex;align-items:flex-start;line-height:.75}@media only screen and (max-width: 1399px){.report-area .satisfaction-box .number{font-size:200px}}@media only screen and (max-width: 1199px){.report-area .satisfaction-box .number{font-size:180px}}@media only screen and (max-width: 767px){.report-area .satisfaction-box .number{font-size:150px}}@media(max-width: 575px){.report-area .satisfaction-box .number{font-size:100px}}.report-area .satisfaction-box .number .icon{font-size:30px;margin-inline-start:2px;font-weight:500}@media(max-width: 575px){.report-area .satisfaction-box .number .icon{font-size:20px}}.report-area .satisfaction-box .info{font-size:22px;line-height:1.23;color:var(--secondary);font-weight:400;margin-top:42px}@media only screen and (max-width: 1199px){.report-area .satisfaction-box .info{margin-top:22px;font-size:18px}}.report-area .satisfaction-box .info span{color:var(--primary)}.report-area .satisfaction-box .info br{display:block}.features-area-1{padding-top:120px;padding-bottom:113px;color:#000000;}@media only screen and (max-width: 1919px){.features-area-1{padding-top:90px;padding-bottom:83px}}.features-wrapper-1{display:grid;gap:60px 60px;grid-template-columns:repeat(4, 300px);justify-content:space-between}@media only screen and (max-width: 1199px){.features-wrapper-1{grid-template-columns:repeat(2, 240px)}}@media only screen and (max-width: 991px){.features-wrapper-1{grid-template-columns:repeat(2, 310px)}}@media only screen and (max-width: 767px){.features-wrapper-1{grid-template-columns:repeat(1, 1fr)}}.feature-box .title{font-size:26px;line-height:1.1;color:#ffffff}.feature-box .title span{font-weight:700}.feature-box .content{margin-top:44px}@media only screen and (max-width: 767px){.feature-box .content{margin-top:30px}}.feature-box .text{color:#000000;margin-top:28px} /* ============================ Polanitex Universal Modal (Square Image) ============================ */ .modal-dialog { margin: 0 auto; } /* Core modal shape */ .modal-custom { width: 90vw; height: 90vw; /* Square ratio */ max-width: 550px; max-height: 550px; border: none; border-radius: 12px; overflow: hidden; box-shadow: 0 5px 30px rgba(0, 0, 0, 0.25); position: relative; } /* Image fill */ .newsletter-modal img { width: 100%; height: 100%; object-fit: cover; display: block; } /* ========================= Close Button (CSS “X”) ========================= */ .close-btn { position: absolute; top: 12px; right: 12px; width: 40px; height: 40px; background: #0056A6; border: none; border-radius: 50%; cursor: pointer; z-index: 10; transition: background 0.3s ease, transform 0.3s ease; } .close-btn:hover { background: #003f7b; transform: rotate(90deg); } .close-btn::before, .close-btn::after { content: ""; position: absolute; top: 50%; left: 50%; width: 60%; height: 2px; background: #fff; transform-origin: center; } .close-btn::before { transform: translate(-50%, -50%) rotate(45deg); } .close-btn::after { transform: translate(-50%, -50%) rotate(-45deg); } /* ========================= Responsive Scaling ========================= */ /* Desktop & Laptop */ @media (min-width: 992px) { .modal-custom { width: 500px; height: 500px; } } /* Tablets (iPad, Surface Pro, Zenbook Fold) */ @media (min-width: 768px) and (max-width: 991px) { .modal-custom { width: 70vw; height: 70vw; max-width: 480px; max-height: 480px; } .close-btn { width: 36px; height: 36px; } } /* Mobile phones */ @media (max-width: 767px) { .modal-custom { width: 85vw; height: 85vw; max-width: none; max-height: none; border-radius: 10px; }.close-btn { width: 32px; height: 32px; top: 10px; right: 10px; } .close-btn::before, .close-btn::after { width: 55%; } } /* Smart displays / landscape tablets (Nest Hub, Hub Max) */ @media (max-width: 1280px) and (orientation: landscape) { .modal-custom { width: 60vw; height: 60vw; max-width: 450px; max-height: 450px; } } /* Ultra-wide foldables */ @media (min-aspect-ratio: 21/9) { .modal-custom { width: 50vw; height: 50vw; } } /* Safety */ .modal { overflow-y: auto; }
  .close-btn {
    width: 32px;
    height: 32px;
    top: 10px;
    right: 10px;
  }

  .close-btn::before,
  .close-btn::after {
    width: 55%;
  }
}

/* Smart displays / landscape tablets (Nest Hub, Hub Max) */
@media (max-width: 1280px) and (orientation: landscape) {
  .modal-custom {
    width: 60vw;
    height: 60vw;
    max-width: 450px;
    max-height: 450px;
  }
}

/* Ultra-wide foldables */
@media (min-aspect-ratio: 21/9) {
  .modal-custom {
    width: 50vw;
    height: 50vw;
  }
}

/* Safety */
.modal {
  overflow-y: auto;
}