/* ----------------------------------------------------------------------------------------
* File          : CSS File
* Version       : 1.0
* ---------------------------------------------------------------------------------------- */
/* INDEX
----------------------------------------------------------------------------------------
01. Global Variables
02. General css
03. Header css
04. Hero css
05. About Us css
06. Our Services css
07. Our Expertise css
08. Why Choose Us css
09. Our Case Study css
10. How It work css
11. Our Pricing css
12. Our Testimonials css
13. Our FAQs css
14. Our Book Appintment css
15. Our Blog css
16. Footer css
17. About Us Page css
18. Services Page css
19. Service Single css
20. Blog Archive css
21. Blog Single css
22. Case Study Page css
23. Case Study Single css
24. Team Page css
25. Team Single css
26. Pricing Page css
27. Testimonials Page css
28. Image Gallery css
29. Video Gallery css
30. FAQ's Page css
31. Contact Us Page css
32.	Book Appointment css
33. 404 Error Page css
34. Responsive css
35. Home - Version 2 css
36. Home - Version 3 css
-------------------------------------------------------------------------------------- */



/* #### Generated By: http://font.download #### */

    @font-face {
    font-family: 'Dubai Regular';
    font-style: normal;
    font-weight: normal;
    src: local('Dubai Regular'), url('../fonts/Dubai-Regular.woff') format('woff');
    }
    

    @font-face {
    font-family: 'Dubai Light';
    font-style: normal;
    font-weight: normal;
    src: local('Dubai Light'), url('../fonts/Dubai-Light.woff') format('woff');
    }
    

    @font-face {
    font-family: 'Dubai Medium';
    font-style: normal;
    font-weight: normal;
    src: local('Dubai Medium'), url('../fonts/Dubai-Medium.woff') format('woff');
    }
    

    @font-face {
    font-family: 'Dubai Bold';
    font-style: normal;
    font-weight: normal;
    src: local('Dubai Bold'), url('../fonts/Dubai-Bold.woff') format('woff');
    }


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

:root{
	--primary-color				: #114c5c;
	--secondary-color: #dfc8af;
	--bg-color					: #F7F3F1;
	--text-color				: #555555;
	--accent-color: #114c5c;
	--accent-secondary-color: #15999b;
	--white-color				: #FFFFFF;
	--divider-color				: #2222221A;
	--dark-divider-color		: #FFFFFF1A;
	--error-color				: rgb(230, 87, 87);
	--default-font				: 'Dubai Regular';
	--accent-font				: 'Dubai Medium';
}

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

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

body{
	font-family: var(--default-font);
	font-size: 18px;
	font-weight: 400;
	line-height: 1em;
	color: var(--text-color);
	background: linear-gradient(
270deg, #ffffff 0%, #ffffff 100%);
}

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

::-webkit-scrollbar{
	width: 7px;
	background-color: var(--primary-color);
}

::-webkit-scrollbar-thumb{
	background: var(--accent-secondary-color);
}

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

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

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

figure{
	margin: 0;
}

img{
	max-width: 100%;
}

a{
	text-decoration: none;
}

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

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

.container{
	max-width: 93%;
}

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

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

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

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

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

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

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

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

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

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

.btn-default{
	position: relative;
	display: inline-block;
	font-family: var(--accent-font);
	font-size: 16px;
	font-weight: 500;
	line-height: 1em;
	text-transform: capitalize;
	color: var(--white-color);
	background: var(--accent-color);
	border-radius: 8px;
	padding: 17px 30px;
	border: none;
	overflow: hidden;
	transition: all 0.4s ease-in-out;
	z-index: 1;
	background: linear-gradient(135deg, #0d6477, #18a7b8);
}

.btn-default::before{
	content: '';
	position: ;
    top: 50%;
    right: 5px;
    width: 40px;
    height: 40px;
	background-color: var(--accent-secondary-color);
    background-image: url('../images/arrow-white.svg');
    background-repeat: no-repeat;
    background-position: center center;
    background-size: 14px auto;
	border-radius: 5px;
    transform: translateY(-50%);
	transition: all 0.4s ease-in-out;
}

.btn-default:hover::before{
	background-color: var(--accent-color);
}

.btn-default::after{ 
	content: '';
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    width: 0;
    height: 100%;
    background: var(--accent-secondary-color);
    transition: all 0.4s ease-in-out;
    z-index: -1;
}

.btn-default:hover::after{
	right: auto;
	left: 0;
    width: 100%;
}

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

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

.readmore-btn{
	position: relative;
	display: inline-block;
	font-family: var(--accent-font);
	font-weight: 500;
	line-height: 1em;
	text-transform: capitalize;
	color: var(--white-color);
	padding-right: 22px;
}

.readmore-btn::before{
	content: '';
    position: absolute;
    top: 50%;
    right: 0;
	width: 12px;
	height: 12px;
	transform: translateY(-50%);
	background-image: url('../images/arrow-white.svg');
	background-repeat: no-repeat;
	background-position: center center;
	background-size: 12px auto;
    transition: all 0.4s ease-in-out;
}

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

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

.preloader{
	position: fixed;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	z-index: 1000;
	background: #fff;
	display: flex;
	align-items: center;
	justify-content: center;
}

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

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

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

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

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

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

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

.bg-section .container-fluid{
	padding: 0;
}

.dark-section{
	background-color: #fff;
	background-image: url('../images/dark-section-bg-image.png');
	background-repeat: no-repeat;
	background-position: top center;
	background-size: cover;
}

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

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

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

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

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

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

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

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

.section-sub-heading,
.section-title .section-sub-title{
	position: relative;
	display: inline-block;
	font-size: 14px;
	font-weight: 500;
	text-transform: capitalize;
	line-height: 1em;
	color: var(--primary-color);
	background: #F6F6F6;
	border-radius: 100px;
	padding: 10px 16px 10px 32px;
    margin-bottom: 15px;
	text-transform: uppercase;
	letter-spacing: 1px;
}

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

.section-title h1{
	font-size: 50px;
	line-height: 1.1em;
	letter-spacing: -0.02em;
	margin-bottom: 0;
	cursor: none;
}

.section-title h2{
	font-size: 30px;
	letter-spacing: 0;
	margin-bottom: 0;
	cursor: none;
	text-align: left;
}

.section-title p{
	margin-top: 20px;
	margin-bottom: 0;
	font-size: 18px;
	line-height: 25px;
	letter-spacing: .5px;
	font-weight: 500;
}

.dark-section .section-sub-heading,
.bg-section .section-title .section-sub-title{
	background: var(--bg-color);
}

.dark-section .section-sub-heading,
.dark-section .section-title .section-sub-title{
	background: var(--dark-divider-color);
	backdrop-filter: blur(15px);
    -webkit-backdrop-filter: blur(15px);
	color: var(--white-color);
}

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

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

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

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

header.main-header{
	position: absolute;
	top: 15px;
    left: 15px;
    right: 15px;
	z-index: 100;
}

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

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

header.main-header .header-sticky.active{
	position: fixed;
    top: 0;
    left: 15px;
    right: 15px;
    transform: translateY(0);
    background: var(--primary-color);
    border: 1px solid var(--dark-divider-color);
	border-top: none;
    border-radius: 0 0 20px 20px;
}

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

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

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

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

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

.main-menu ul li a{
	font-size: 16px;
	font-weight: 500;
	line-height: 1.25em;
	padding: 12px 10px !important;
	color: var(--white-color);
	background: transparent;
	border-radius: 0px;
	text-transform: capitalize;
	transition: all 0.3s ease-in-out;
}

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

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

.main-menu ul ul{
	position: absolute;
	left: 0;
	top: 100%;
	transform: scale(1,0.8);
	transform-origin: top;
	width: 235px;
	background: linear-gradient(270deg, var(--bg-color) 0%, var(--secondary-color) 100%);
	border-radius: 20px;
	list-style: none;
	padding: 0;
	margin: 0;
	opacity: 0;
	visibility: hidden;
	transition: all 0.3s ease-in-out;
	text-align: left;
}

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

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

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

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

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

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

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

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

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

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

.slicknav_btn{
	background: var(--accent-color);
	padding: 0;
	display: flex;
	align-items: center;
	justify-content: center;
	width: 38px;
	height: 38px;
	margin: 0;
	border-radius: 6px;
}

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

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

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

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

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

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

.slicknav_menu{
	position: absolute;
    width: 100%;
	padding: 0;
	background: linear-gradient(270deg, var(--bg-color) 0%, var(--secondary-color) 100%);
	border-bottom: 1px solid var(--divider-color);
}

.slicknav_menu ul{
	margin: 5px 0;
}

.slicknav_menu ul ul{
	margin: 0;
}

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

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

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

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

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

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

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

.hero{
    position: relative;
    align-content: end;
	background-image: url('../images/hero-bg-image.jpg');
    border-radius: 20px;
	height: 100vh;
	min-height: 850px;
    align-content: end;
    padding: 230px 0 120px;
    margin: 15px 15px 0 15px;
    overflow: hidden;
}

.hero::before{
	content: '';
	position: absolute;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	background: linear-gradient(180deg, rgba(34, 34, 34, 0.70) 12%, transparent 40.63%), linear-gradient(180deg, transparent 29.87%, rgba(34, 34, 34, 0.80) 81.81%);
	width: 100%;
	height: 100%;
	z-index: 1;
}

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

.hero-content-body{
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 20px 40px;
}

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

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

.satisfy-client-image{
	position: relative;
    display: inline-block;
    margin-left: -14px;
    border: 1px solid var(--white-color);
    border-radius: 50%;
    overflow: hidden;
    z-index: 1;
}

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

.satisfy-client-image figure{
	display: block;
}

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

.satisfy-client-image.add-more{
	width: 42px;
	height: 42px;
	background-color: var(--accent-color);
	display: flex;
	justify-content: center;
	align-items: center;
	transition: all 0.3s ease-in-out;
}

.satisfy-client-image.add-more i{
	font-size: 20px;
	color: var(--white-color);
}

.satisfy-client-image.add-more h2{
	font-size: 14px;
	line-height: 1em;
	color: var(--white-color);
}

.satisfy-client-image.add-more img{
	width: 100%;
	max-width: 16px;
}

.hero-client-content h2{
	font-size: 20px;
	color: var(--white-color);
}

.hero-client-content p{
	color: var(--white-color);
	line-height: normal;
	margin: 5px 0 0;
}

.hero-info-box{
	display: flex;
	flex-direction: column;
	justify-content: space-between;
	gap: 30px;
	border: 1px solid var(--dark-divider-color);
	background: var(--divider-color);
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
	border-radius: 20px;
	min-height: 320px;
	max-width: 330px;
	margin-left: auto;
	padding: 30px;
}

.hero-info-box-header p{
	color: var(--white-color);
	font-weight: 500;
	margin: 0;
}

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

.hero-info-client-review-box .satisfy-client-image figure img{
	max-width: 28px;
}

.hero-info-client-review-box .satisfy-client-image.add-more{
	height: 30px;
	width: 30px;
}

.hero-info-client-review-box .satisfy-client-image.add-more i{
	font-size: 16px;
}

.hero-info-client-review-box .satisfy-client-content{
	width: calc(100% - 98px);
}

.hero-info-client-review-box .satisfy-client-content p{
	color: var(--white-color);
	margin: 0;
	line-height: normal;
}

.hero-info-box-rating{
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 20px;
	border-top: 1px solid var(--dark-divider-color);
	margin-top: 30px;
	padding-top: 30px;
}

.hero-info-box-rating h2{
	color: var(--white-color);
	font-size: 20px;
}

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

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

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

.about-us-image-box{
	display: flex;
	flex-wrap: wrap;
	gap: 30px;
	margin-right: 15px;
}

.about-us-image-box-1{
	width: calc(44% - 15px);
	display: flex;
	flex-direction: column;
}

.about-us-image-box-2{
	width: calc(56% - 15px);
}

.happy-customer-review-box{
	position: relative;
	background: var(--secondary-color);
    padding: 0 30px 30px 0;
    border-radius: 20px 0 20px 0;
	margin-right: -100px;
	z-index: 2;
}

.happy-customer-review-box::before,
.happy-customer-review-box::after{
	content: '';
	position: absolute;
	width: 20px;
    height: 20px;
	mask: url('../images/image-corner-bg-shape.svg');
	-webkit-mask: url('../images/image-corner-bg-shape.svg');
	background-color: var(--secondary-color);
	mask-repeat: no-repeat;
	mask-size: cover;
	z-index: 1;
}

.happy-customer-review-box::before{
	right: -20px;
	left: auto;
}

.happy-customer-review-box::after{
	left: auto;
	right: 50px;
	bottom: -20px;
}

.happy-customer-review-item{
	background-color: #8d7051;
	border-radius: 20px;
	padding: 30px;
}

.happy-customer-review-item .hero-info-rating-star i{
	font-size: 20px;
}

.happy-customer-review-content{
	border-top: 1px solid var(--dark-divider-color);
	margin-top: 20px;
	padding-top: 20px;
}

.happy-customer-review-content p{
	color: var(--white-color);
	margin: 0;
}

.happy-customer-review-item .satisfy-client-images{
	margin-top: 20px;
}

.happy-customer-review-item .satisfy-client-image{
	border-color: var(--primary-color);
}

.happy-customer-review-item .satisfy-client-image.add-more{
	background-color: var(--accent-secondary-color);
}

.happy-customer-review-item .satisfy-client-image.add-more i{
	color: var(--white-color);
}

.about-us-image{
	height: 100%;
}

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

.about-us-image img{
	width: 100%;
	height: 100%;
	border-radius: 20px;
	object-fit: cover;
}

.about-us-image-box-1 .about-us-image img{
	aspect-ratio: 1 / 1.515;
}

.about-us-image-box-2 .about-us-image img{
	aspect-ratio: 1 / 1.971;
}

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

.about-us-item{
	width: calc(50% - 15px);
	display: flex;
	flex-wrap: wrap;
	gap: 15px;
	background-color: #d2feff;
	padding: 16px;
	border-radius: 11px;
	overflow: hidden;
	align-items: center;
	gap: 20px;
	padding: 17px;
	border-radius: 15px;
	background: #ecf8fb;
	border: 1px solid #c7e4ea;
	margin-bottom: 24px;
}

.about-us-item .icon-box{
	position: relative;
	width: 50px;
	height: 50px;
	background: var(--accent-color);
	border-radius: 50%;
	display: flex;
	justify-content: center;
	align-items: center;
	overflow: hidden;
}

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

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

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

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

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

.about-us-item-content p{
	margin: 10px 0 0;
}

.about-us-body{
	margin-top: 40px;
}

.about-us-body-item{
	background-color: var(--white-color);
	border-left: 4px solid var(--accent-color);
	border-radius: 20px;
	margin-bottom: 30px;
	padding: 30px;
}

.about-us-body-item:last-child{
	margin-bottom: 0;
}

.about-us-body-item h3{
	font-size: 16px;
	line-height: 1.6em;
}

.about-us-btn{
	margin-top: 0;
}

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

.our-services{
	background-image: url('../images/our-services-bg-image.png');
	background-position: bottom center;
	background-size: auto;
	padding: 120px 0;
}

.service-item{
	background: var(--dark-divider-color);
    backdrop-filter: blur(30px);
    -webkit-backdrop-filter: blur(30px);
    border-radius: 12px;
	min-height: 500px;
	display: flex;
	flex-direction: column;
	justify-content: space-between;
	gap: 34px;
	height: calc(100% - 30px);
	margin-bottom: 27px;
	padding: 20px;
	transition: all 0.4s ease-in-out;
}

.service-item:hover{
	transform: translateY(-5px);
}

.service-item-header{
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 15px;
}

.service-item-header .icon-box{
	position: relative;
	width: 60px;
	height: 60px;
	background: var(--accent-secondary-color);
	border-radius: 50%;
	display: flex;
	justify-content: center;
	align-items: center;
	overflow: hidden;
}

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

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

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

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

.service-item-title{
	width: calc(100% - 75px);
}

.service-item-title h2{
	font-size: 19px;
	line-height: 1.3em;
	color: var(--white-color);
	font-weight: 500;
}

.service-item-title h2 a{
	color: inherit;
}

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

.service-item-btn{
	border-top: 1px solid var(--dark-divider-color);
	margin-top: 40px;
	padding-top: 40px;
}

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

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

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

.section-footer-text p a{
	color: var(--accent-secondary-color);
	font-weight: 500;
	text-transform: capitalize;
	text-decoration: underline;
	text-underline-offset: 3px;
	transition: all 0.3s ease-in-out;
}

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

.section-footer-text ul{
	width: 100%;
	padding: 0;
	margin: 20px 0 0;
	list-style: none;
}

.section-footer-text ul li{
	display: inline-block;
	font-family: var(--accent-font);
	font-weight: 500;
	line-height: normal;
	color: var(--primary-color);
	margin-right: 10px;
}

.section-footer-text ul li:last-child{
	margin: 0;
}

.section-footer-text ul li i{
	color: var(--accent-secondary-color);
}

.section-footer-text.section-footer-contact{
	display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: center;
    gap: 10px 20px;
}

.section-footer-text.section-footer-contact span{
	width: 30px;
    height: 30px;
    padding: 0;
    display: inline-flex;
    justify-content: center;
	align-items: center;
    margin-right: 10px;
}

.section-footer-text.section-footer-contact span img{
	width: 100%;
	max-width: 16px;
}

.section-footer-text.section-satisfy-img{
	display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: center;
    gap: 10px;
}

.section-footer-text.section-satisfy-img .satisfy-client-image figure img{
	max-width: 30px;
}

.section-footer-text.section-satisfy-img .satisfy-client-image.add-more{
	width: 32px;
	height: 32px;
    margin-left: -10px;
	background: var(--accent-secondary-color);
}

.section-footer-text.section-satisfy-img .satisfy-client-image.add-more img{
	max-width: 18px;
}

.section-footer-text.section-satisfy-img ul{
	margin: 5px 0 0;
}

.dark-section .section-footer-text.section-satisfy-img .satisfy-client-image{
    border-color: var(--white-color);
}

.dark-section .section-footer-text p,
.dark-section .section-footer-text ul li{
	color: var(--white-color);
}

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

/************************************/
/*** 	 07. Our Expertise css 	  ***/
/************************************/

.our-expertise{
	padding: 120px 0;
}

.expertise-body{
	border-top: 1px solid var(--divider-color);
	padding-top: 40px;
}

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

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

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

.skill-data .skill-title,
.skill-data .skill-no{
	font-family: var(--accent-font);
	font-size: 16px;
	font-weight: 500;
	color: var(--primary-color);
}

.skill-progress{
	position: relative;
	background: var(--white-color);
	border-radius: 10px;
	width: 100%;
	height: 6px;
}

.skill-progress .count-bar{
	position: absolute;
	top: 0;
	left: 0;
	bottom: 0;
	background-color: var(--accent-secondary-color);
	border-radius: 10px;
}

.expertise-btn{
	margin-top: 40px;
}

.expertise-image-box{
	display: flex;
	flex-wrap: wrap;
	align-items: end;
	margin-left: 15px;
}

.expertise-image-box-1{
	width: 40%;
	padding-bottom: 100px;
}

.expertise-image-box-2{
	position: relative;
	width: 60%;
	z-index: 2;
}

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

.expertise-image img{
	width: 100%;
	border-radius: 20px;
	object-fit: cover;
}

.expertise-image-box-1 figure{
	margin-right: -250px;
}

.expertise-image-box-1 .expertise-image img{
	aspect-ratio: 1 / 1.045;
}

.expertise-image-box-2 .expertise-image img{
	aspect-ratio: 1 / 0.91;
}

.experience-circle{
	position: relative;
	transform: translate(-65px, 65px);
	z-index: 2;
}

.experience-circle img{
	width: 100%;
	max-width: 130px;
	aspect-ratio: 1 / 1;
	object-fit: cover;
	border-radius: 50%;
	animation: infiniterotate 20s infinite linear;
}

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

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

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

.why-choose-item{
	position: relative;
	border-radius: 20px;
	align-content: end;
	min-height: 450px;
	height: calc(100% - 30px);
	margin-bottom: 30px;
	padding: 25px;
	overflow: hidden;
}

.why-choose-item-image{
	position: absolute;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	height: 100%;
	width: 100%;
}

.why-choose-item-image figure{
	display: block;
	width: 100%;
	height: 100%;
}

.why-choose-item-image img{
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.why-choose-item-content{
	position: relative;
	background-color: var(--white-color);
	border-radius: 20px;
	padding: 30px;
	z-index: 1;
}

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

.why-choose-content-image img{
	width: 100%;
	max-width: 260px;
	aspect-ratio: 1 / 0.57;
    object-fit: cover;
	border-radius: 10px;
}

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

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

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

.why-choose-cta-item{
	position: relative;
	border-radius: 20px;
	height: calc(100% - 30px);
	margin-bottom: 30px;
	padding: 40px;
	overflow: hidden;
}

.why-choose-cta-item-image{
	position: absolute;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	height: 100%;
	width: 100%;
}

.why-choose-cta-item-image figure{
	position: relative;
	display: block;
	height: 100%;
}

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

.why-choose-cta-item-image img{
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.why-choose-cta-body{
	position: relative;
	display: flex;
	flex-direction: column;
	justify-content: space-between;
	text-align: center;
	gap: 40px;
	height: 100%;
	z-index: 1;
}

.why-choose-cta-body .icon-box img{
	width: 100%;
	max-width: 60px;
}

.why-choose-cta-content p{
	font-size: 14px;
	font-weight: 500;
	color: var(--white-color);
	margin: 0 0 10px;
}

.why-choose-cta-content h2{
	font-size: 24px;
	color: var(--white-color);
}

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

.why-choose-slider-box{
    margin-top: 30px;
}

.why-choose-slider-content{
    display: flex;
    align-items: center;
	justify-content: space-between;
	gap: 30px;
	margin-bottom: 40px;
	text-align: center;
}

.why-choose-slider-content hr{
    height: 2px;
	flex-grow: 1;
    color: var(--divider-color);
    opacity: 1;
    margin: 0;
}

.why-choose-slider-content p{
	font-family: var(--accent-font);
	color: var(--primary-color);
    margin-bottom: 0;
}

.why-choose-logo-slider{
	max-width: 750px;
	margin: 0 auto;
}

.why-choose-logo{
	text-align: center;
}

.why-choose-logo img{
	width: 100%;
	max-width: 162px;
	height: 40px;
}

/************************************/
/***    09. Our Case Study css    ***/
/************************************/

.our-case-study{
	padding: 120px 0;
}

.case-study-item{
	position: relative;
	min-height: 500px;
	border-radius: 20px;
	align-content: end;
	height: calc(100% - 30px);
	margin-bottom: 30px;
	padding: 40px;
	overflow: hidden;
}

.case-study-item-image{
	position: absolute;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	width: 100%;
	height: 100%;
}

.case-study-item-image a{
	display: block;
	height: 100%;
	cursor: none;
}

.case-study-item-image a figure{
	position: relative;
	display: block;
	height: 100%;
	overflow: hidden;
}

.case-study-item-image a figure::before{
	content: '';
	position: absolute;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background: linear-gradient(180deg, transparent 50%, rgba(34, 34, 34, 0.90) 86.7%);
	z-index: 1;
}

.case-study-item-image a figure img{
	width: 100%;
	height: 100%;
	object-fit: cover;
	transition: all 0.6s ease-in-out;
}

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

.case-study-item-contant{
	position: relative;
	z-index: 1;
}

.case-study-item-contant ul{
	display: flex;
	flex-wrap: wrap;
	gap: 10px 15px;
	list-style: none;
	margin: 0 0 20px;
	padding: 0;
}

.case-study-item-contant ul li a{
	display: block;
	color: var(--white-color);
	background-color: var(--dark-divider-color);
	border-radius: 100px;
	padding: 9px 16px;
	transition: all 0.4s ease-in-out;
}

.case-study-item-contant ul li a:hover{
	background-color: var(--accent-secondary-color);
}

.case-study-item-contant h2{
	font-size: 20px;
	line-height: 1.4em;
	color: var(--white-color);
}

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

/************************************/
/***      10. How It work css     ***/
/************************************/

.how-it-work{
	padding: 0 0 50px 0;
}

.how-it-work-image{
	height: 100%;
	margin-left: 15px;
}

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

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

.how-work-item-list{
	/*! display: flex; */
	flex-wrap: wrap;
	gap: 40px 60px;
	margin-top: 50px;
	text-align: center;
}

.how-work-item{
	position: relative;
	width: calc(25% - 15px);
}

.how-work-item:before{
	content: '';
	position: absolute;
	top: 0;
	right: -30px;
	bottom: 0;
	width: 1px;
	height: 100%;
	background-color: var(--dark-divider-color);
}

.how-work-item:nth-child(3n + 3):before,
.how-work-item:last-child:before{
	display: none;
}

.how-work-item-header{
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 15px;
	border: solid 1px #ffffff21;
	padding: 15px;
	border-radius: 13px;
	text-align: center;
}

.how-work-item-header .icon-box{
	position: relative;
	width: 60px;
	height: 60px;
	background: var(--accent-secondary-color);
	border-radius: 50%;
	display: flex;
	justify-content: center;
	align-items: center;
	overflow: hidden;
}

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

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

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

.how-work-item:hover .how-work-item-header .icon-box img{
	filter: brightness(0) invert(0);
}

.how-work-item-title{
	width: calc(100% );
	text-align: center;
}

.how-work-item-title p{
	color: var(--white-color);
	font-weight: 500;
	text-transform: uppercase;
	line-height: normal;
	margin-bottom: 10px;
}

.how-work-item-title h3{
	font-size: 20px;
	color: var(--white-color);
}

.how-work-item-body{
	margin-top: 40px;
}

.how-work-item-body p{
	color: var(--white-color);
	margin: 0;
}

/************************************/
/***     11. Our pricing css      ***/
/************************************/

.our-pricing{
	padding: 120px 0;
}

.pricing-item{
	background-color: var(--white-color);
	border-radius: 14px;
	height: calc(100% - 30px);
	margin-bottom: 30px;
	padding: 10px;
}

.pricing-item-content{
	padding: 30px;
	margin-bottom: 10px;
}

.pricing-item-content h2{
	font-size: 20px;
}

.pricing-item-content p{
	margin: 10px 0 0;
}

.pricing-item-body{
	background: linear-gradient(270deg, var(--bg-color) 0%, var(--secondary-color) 100%);
	border-radius: 14px;
	text-align: center;
	padding: 40px;
}

.pricing-item-price h2{
	font-size: 40px;
}

.pricing-item-price p{
	margin: 10px 0 0;
}

.pricing-item-btn{
	margin-top: 30px;
}

.pricing-item-btn .btn-default{
	width: 100%;
	padding: 17px 24px;
}

.pricing-item-btn .btn-default:before{
	display: none;
}

.pricing-item-list{
	margin-top: 10px;
	padding: 30px;
}

.pricing-item-list h3{
	font-size: 16px;
	border-bottom: 1px solid var(--divider-color);
	margin-bottom: 30px;
	padding-bottom: 30px;
}

.pricing-item-list ul{
	list-style: none;
    margin: 0;
    padding: 0;
}

.pricing-item-list ul li{
    position: relative;
    line-height: 1.5em;
    padding-left: 25px;
    margin-bottom: 15px;
}

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

.pricing-item-list ul li::before{
	content: '\f058';
    position: absolute;
    font-family: 'Font Awesome 7 Free';
    font-size: 18px;
    font-weight: 900;
    color: var(--accent-color);
    top: 0;
    left: 0;
}

.pricing-benefit-list{
	margin-top: 30px;
}

.pricing-benefit-list ul{
	list-style: none;
	margin: 0;
	padding: 0;
	display: flex;
	flex-wrap: wrap;
    justify-content: center;
	gap: 20px 50px;
}

.pricing-benefit-list ul li{
	color: var(--primary-color);
    display: inline-flex;
    align-items: center;
}

.pricing-benefit-list ul li img{
	width: 100%;
	max-width: 20px;
	margin-right: 15px;
}

/************************************/
/***   12. Our Testimonials css   ***/
/************************************/

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

.testimonials-image-box{
	position: relative;
	height: 100%;
}

.testimonials-image{
	height: 100%;
}

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

.testimonials-image img{
	width: 100%;
	height: 100%;
	aspect-ratio: 1 / 0.905;
	object-fit: cover;
	border-radius: 14px;
}

.testimonials-review-box{
	position: absolute;
	bottom: 20px;
	left: 20px;
	width: 100%;
	max-width: 280px;
	background-color: var(--white-color);
	border-radius: 14px;
	padding: 15px;
	z-index: 1;
}

.testimonials-review-box-header{
	display: flex;
	align-items: center;
	gap: 15px;
}

.testimonials-review-box-header .icon-box img{
	width: 100%;
	max-width: 40px;
}

.testimonials-review-header-content{
	width: calc(100% - 55px);
	display: flex;
	align-items: center;
}

.testimonials-review-header-content h2{
	font-size: 26px;
	min-width: 70px;
	line-height: 1em;
}

.google-rating-star{
	line-height: normal;
}

.google-rating-star i{
	font-size: 18px;
	color: var(--accent-secondary-color);
}

.testimonials-review-body{
	margin-top: 15px;
}

.testimonials-review-body p{
	margin: 0;
}

.testimonial-slider,
.testimonial-slider .swiper,
.testimonial-item{
	height: 100%;
}

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

.testimonial-item{
	min-height: 375px;
	height: 100%;
	display: flex;
	flex-direction: column;
	justify-content: space-between;
	gap: 30px;
	background: linear-gradient(270deg, var(--bg-color) 0%, var(--secondary-color) 100%);
	border-radius: 14px;
	padding: 40px;
}

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

.testimonial-item-content{
	margin-top: 20px;
}

.testimonial-item-content p{
	font-family: var(--accent-font);
	font-size: 16px;
	font-weight: 500;
	line-height: 1.4em;
	color: var(--primary-color);
	margin: 0;
}

.testimonial-item-author{
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 15px;
	border-top: 1px solid var(--divider-color);
	padding-top: 30px;
}

.testimonial-item-author-image figure{
	display: block;
	border-radius: 50%;
}

.testimonial-item-author-image figure img{
	width: 100%;
	max-width: 50px;
	border-radius: 50%;
}

.testimonial-item-author-content{
	width: calc(100% - 65px);
}

.testimonial-item-author-content h2{
	font-size: 20px;
}

.testimonial-item-author-content p{
	line-height: normal;
	margin: 5px 0 0;
}

.our-testimonials .section-footer-text{
	margin-top: 60px;
}

/************************************/
/***   		13. Our Faqs css      ***/
/************************************/

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

.faqs-content{
	position: sticky;
	top: 30px;
	margin-right: 15px;
}

.faqs-content-list ul{
	list-style: none;
    margin: 0;
    padding: 0;
}

.faqs-content-list ul li{
    position: relative;
    line-height: 1.5em;
    padding-left: 25px;
    margin-bottom: 15px;
}

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

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

.faqs-content-btn{
	margin-top: 40px;
}

.faq-accordion .accordion-item{
    position: relative;
    background: var(--white-color);
    border-radius: 14px;
    margin-bottom: 25px;
    overflow: hidden;
}

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

.faq-accordion .accordion-header .accordion-button{
	font-size: 20px;
    font-weight: 500;
    line-height: 1.333em;
    background: transparent;
    color: var(--primary-color);
    padding: 20px 50px 20px 24px;
    transition: all 0.4s ease-in-out;
	background-color: #f5f4ef;
	border-radius: 7px !important;
}

.faq-accordion .accordion-item .accordion-button::after, 
.faq-accordion .accordion-item .accordion-button.collapsed::after{
   	content: '\f078';
    font-family: 'FontAwesome';
    position: absolute;
    right: 24px;
    top: 50%;
    transform: translateY(-50%);
    font-size: 20px;
    color: var(--accent-color);
	line-height: normal;
    transition: all 0.3s ease-in-out;
}

.faq-accordion .accordion-button:not(.collapsed)::after{
	transform: translateY(-50%) rotate(180deg);
}

.faq-accordion .accordion-item .accordion-body{  
	border-top: 1px solid var(--divider-color);
    padding: 24px;
}

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

/************************************/
/*** 14. Our Book Appintment css  ***/
/************************************/

.our-book-appointment{
	position: relative;
	padding: 120px 0;
	overflow: hidden;
}

.book-appointment-image{
	position: absolute;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	height: 100%;
	width: 100%;
	border-radius: 20px;
	overflow: hidden;
}

.book-appointment-image figure{
	position: relative;
	display: block;
	height: 100%;
}

.book-appointment-image figure:before{
	content: '';
	position: absolute;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	background: linear-gradient(270deg, var(--primary-color) 0%, transparent 68.93%);
	height: 100%;
	width: 100%;
}

.book-appointment-image img{
	width: 100%;
	height: 100%;
	object-fit: cover;
	border-radius: 20px;
}

.book-appointment-form-box{
	position: relative;
	width: 100%;
	max-width: 640px;
	background-color: var(--dark-divider-color);
	backdrop-filter: blur(40px);
    -webkit-backdrop-filter: blur(40px);
	border-radius: 20px;
	padding: 50px;
	margin-left: auto;
	z-index: 1;
}

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

.book-appointment-form .form-control::placeholder{
	color: var(--white-color);
	opacity: 100%;
}

.book-appointment-form select.form-control{
	padding: 18px 30px 18px 20px;
}

.book-appointment-form select option{
	color: var(--text-color);
}

.appointment-form-btn{
	margin-top: 20px;
}

.appointment-form-btn .btn-default{
	width: 100%;
	text-align: center;
	padding: 17px 24px;
}

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

/************************************/
/***       15. Our Blog css       ***/
/************************************/

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

.post-item{
	position: relative;
	min-height: 430px;
	border-radius: 20px;
	align-content: end;
	height: calc(100% - 30px);
	margin-bottom: 0;
	padding: 40px;
	overflow: hidden;
}

.post-item .post-featured-image{
	position: absolute;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	width: 100%;
	height: 100%;
}

.post-item .post-featured-image a, 
.post-item .post-featured-image figure{
	position: relative;
    display: block;
	width: 100%;
	height: 100%;
	border-radius: 20px;
	overflow: hidden;
    cursor: none;
}

.post-item .post-featured-image figure::before{
    content: '';
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
	background: linear-gradient(180deg, transparent 50%, rgba(34, 34, 34, 0.90) 100%);
    height: 100%;
    width: 100%;
    z-index: 1;
}

.post-item .post-featured-image figure img{
	width: 100%;
	height: 100%;
	object-fit: cover;
	border-radius: 20px;
	transition: all 0.6s ease-in-out;
}

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

.post-item .post-item-body{
	position: relative;
	z-index: 1;
}

.post-item .post-item-content h2{
	font-size: 22px;
	color: var(--white-color);
	line-height: -0.6em;
}

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

.post-item .post-item-btn{
	border-top: 1px solid var(--dark-divider-color);
	padding-top: 15px;
	margin-top: 15px;
}

/************************************/
/***        16. Footer css        ***/
/************************************/

.main-footer{
	padding: 120px 0 0;
	margin-bottom: 15px;
}

.footer-header{
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	align-items: center;
	gap: 15px;
	border-bottom: 1px solid var(--dark-divider-color);
	margin-bottom: 80px;
	padding-bottom: 80px;
}

.footer-header .section-title{
	margin-bottom: 0;
}

.footer-newsletter-form{
	width: 100%;
	max-width: 415px;
}

.footer-newsletter-form .form-group{
	display: flex;
	background-color: var(--dark-divider-color);
    backdrop-filter: blur(20px);
    -webkit-backdrop-filter: blur(20px);
	border-radius: 10px;
	padding: 10px;
}

.footer-newsletter-form .form-group .form-control{
	width: calc(100% - 40px);
	font-size: 16px;
	font-weight: 400;
	line-height: 1.5em;
	color: var(--white-color);
	background: transparent;
	border: none;
	border-radius: 0;
	outline: none;
	box-shadow: none;
	padding: 5px 10px;
}

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

.footer-newsletter-form .form-group .newsletter-btn{
	width: 40px;
	height: 40px;
	display: flex;
	justify-content: center;
	align-items: center;
	background-color: var(--accent-secondary-color);
	border: none;
	border-radius: 5px;
	transition: all 0.4s ease-in-out;
}

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

.footer-newsletter-form .form-group .newsletter-btn img{
	width: 100%;
	max-width: 12px;
	transition: all 0.4s ease-in-out;
}

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

.about-footer{
	background: var(--dark-divider-color);
	backdrop-filter: blur(20px);
	-webkit-backdrop-filter: blur(20px);
	border-radius: 10px;
	padding: 40px;
}

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

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

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

.footer-social-links{
	margin-top: 30px;
}

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

.footer-social-links ul li a{
	display: flex;
	justify-content: center;
	align-items: center;
	width: 40px;
	height: 40px;
	border: 1px solid var(--dark-divider-color);
	border-radius: 50%;
	color: var(--white-color);
	transition: all 0.3s ease-in-out;
}

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

.footer-social-links ul li i{
	font-size: 18px;
	color: inherit;
}

.footer-links-box{
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	gap: 30px;
	margin-left: 4.167vw;
}

.footer-links{
	max-width: 38%;
}

.footer-links h2{
	font-size: 20px;
	color: var(--white-color);
	margin-bottom: 25px;
}

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

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

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

.footer-links ul li::marker{
	color: var(--accent-secondary-color);
}

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

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

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

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

/************************************/
/***    17. About Us Page css     ***/
/************************************/

.page-header{
	position: relative;
	/*! background-image: url('../images/page-header-bg.jpg'); */
	background-repeat: no-repeat;
	background-position: center center;
	background-size: cover;
	border-radius: 20px;
	padding: 50px 0 50px;
	margin: 15px 15px 0;
	overflow: hidden;
}

.page-header:before{
	content: '';
	position: absolute;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	height: 100%;
	width: 100%;
	z-index: 1;
}

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

.page-header-box h1{
	display: inline-block;
	font-size: 30px;
	letter-spacing: -0.02em;
	color: #8A6F52;
	margin-bottom: 10px;
	cursor: none;
}

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

.page-header-box ol li.breadcrumb-item{
	font-size: 16px;
	line-height: 1.6em;
    text-transform: capitalize;
	color: #313131;
}

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

.page-header-box ol .breadcrumb-item+.breadcrumb-item::before{
    color: #333;
}

.our-approach{
	padding: 120px 0 0;
	margin-bottom: 250px;
}

.approach-content-box{
	position: relative;
	border-radius: 20px;
	display: flex;
	flex-wrap: wrap;
	align-items: end;
	justify-content: end;
	gap: 30px;
	padding: 50px;
	margin-bottom: -250px;
	overflow: hidden;
}

.approach-image{
	position: absolute;
	top: 0;
	bottom: 0;
	right: 0;
	left: 0;
	width: 100%;
	height: 100%;
	z-index: 0;
}

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

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

.approach-item-list{
	width: 100%;
	max-width: 500px;
	position: relative;
	background-color: var(--white-color);
	border-radius: 20px;
	padding: 40px;
}

.approach-item{
	display: flex;
	flex-wrap: wrap;
	gap: 15px;
	border-bottom: 1px solid var(--divider-color);
	margin-bottom: 40px;
	padding-bottom: 40px;
}

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

.approach-item .icon-box{
	position: relative;
	width: 50px;
	height: 50px;
	background: var(--accent-color);
	border-radius: 50%;
	display: flex;
	justify-content: center;
	align-items: center;
	overflow: hidden;
}

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

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

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

.approach-item-content{
	width: calc(100% - 65px);
}

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

.approach-item-content p{
	margin: 10px 0 0;
}

.our-benefit{
	padding: 120px 0;
}

.benefits-item{
	min-height: 460px;
	display: flex;
	flex-direction: column;
	justify-content: space-between;
	gap: 30px;
	background-color: var(--white-color);
	border-radius: 20px;
	height: calc(100% - 30px);
	margin-bottom: 30px;
	padding: 40px;
}

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

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

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

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

.benefit-item-content h2{
	font-size: 20px;
}

.benefit-item-content p{
	margin: 10px 0 0;
}

.benefit-item-list{
	border-top: 1px solid var(--divider-color);
	padding-top: 30px;
}

.benefit-item-list ul{
	list-style: none;
	margin: 0;
	padding: 0;
}

.benefit-item-list ul li{
	position: relative;
    line-height: 1.5em;
    padding-left: 25px;
    margin-bottom: 15px;
}

.benefit-item-list ul li:last-child{
	margin: 0;
}

.benefit-item-list ul li::before{
	content: '\f058';
    position: absolute;
    font-family: 'Font Awesome 7 Free';
    font-size: 18px;
    font-weight: 900;
    color: var(--accent-color);
    top: 0;
    left: 0;
}

.intro-video{
	position: relative;
	background-image: url('../images/intro-video-bg-image.jpg');
	background-position: center center;
	overflow: hidden;
}

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

.intro-video .container{
	position: relative;
	z-index: 1;
}

.intro-video-body{
	max-width: 700px;
	text-align: center;
	margin: 0 auto;
	padding: 180px 0;
}

.video-play-button a{
	position: relative;
	width: 80px;
	height: 80px;
	background: var(--accent-secondary-color);
	border-radius: 50%;
	display: inline-flex;
	justify-content: center;
	align-items: center;
	cursor: none;
	transition: all 0.4s ease-in-out;
}

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

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

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

.video-play-button a:hover{
	background: var(--white-color);
}

.video-play-button a i{
	position: relative;
	font-size: 30px;
	color: var(--white-color);
	margin-left: 2px;
	transition: all 0.4s ease-in-out;
	z-index: 1;
}

.video-play-button a:hover i{
	color: var(--primary-color);
}

.intro-video-content{
	margin-top: 70px;
}

.intro-video-contact-box{
	background-color: var(--divider-color);
	backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
	padding: 25px 0;
}

.intro-video-contact-content-box{
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: space-between;
	gap: 20px;
}

.intro-video-contact-title{
	max-width: 49%;
}

.intro-video-contact-title h2{
	color: var(--white-color);
	font-size: 30px;
}

.intro-video-contact-list{
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 30px 60px;
	max-width: 49%;
	overflow: hidden;
}

.intro-video-contact-item{
	position: relative;
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 15px;
}

.intro-video-contact-item::before{
	content: '';
	position: absolute;
	top: 0;
	bottom: 0;
	right: -30px;
	background: var(--dark-divider-color);
	width: 1px;
	height: 100%;
}

.intro-video-contact-item:last-child:before{
	display: none;
}

.intro-video-contact-item .icon-box{
	position: relative;
	width: 50px;
	height: 50px;
	background: var(--accent-secondary-color);
	border-radius: 50%;
	display: flex;
	justify-content: center;
	align-items: center;
	overflow: hidden;
}

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

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

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

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

.intro-video-contact-content{
	width: calc(100% - 65px);
}

.intro-video-contact-content p{
	color: var(--white-color);
	line-height: normal;
	margin-bottom: 5px;
}

.intro-video-contact-content h3{
	color: var(--white-color);
	font-size: 20px;
}

.intro-video-contact-content h3 a{
	color: inherit;
	transition: all 0.4s ease-in-out;
}

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

.our-team{
	padding: 120px 0;
}

.team-item{
    /*! position: relative; */
    /*! border-radius: 20px; */
	/*! align-content: end; */
	/*! min-height: 480px; */
    /*! height: calc(100% - 30px); */
    /*! margin-bottom: 30px; */
	padding: 10px 0;
    /*! overflow: hidden; */
}

.team-item-image{
	/*! position: absolute; */
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	height: 100%;
	width: 100%;
	margin-bottom: 25px;
	border-radius: 25px;
}

.team-item-image figure,
.team-item-image a{
	position: relative;
	height: 100%;
	display: block;
	cursor: none;
	overflow: hidden;
	border-radius: 15px;
}

.team-item-image figure:before{
	content: '';
	/*! position: absolute; */
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	height: 100%;
	width: 100%;
	border-radius: 20px;
	/*! background: linear-gradient(180deg, transparent 61.46%, rgba(34, 34, 34, 0.80) 100%); */
	z-index: 1;
}

.team-item-image img{
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: all 0.6s ease-in-out;
    margin-bottom: 0;
}

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

.team-item-body{
	position: relative;
	text-align: center;
	z-index: 1;
	margin-bottom: 15px;
}

.team-item-content h2{
    font-size: 20px;
    color: #114c5c;
}

.team-item-content h2 a{
    color: inherit;
}

.team-item-content p{
    color: #000 !important;
	margin: 4px 0 0;
    \30 : block;
}

.team-social-list{
    height: 0;
    opacity: 0;
    visibility: hidden;
	transform: scaleY(0);
	transform-origin: top;
    transition: all 0.4s ease-in-out;
}

.team-item:hover .team-social-list{
	height: 36px;
    opacity: 1;
    visibility: visible;
	transform: scaleY(1);
	margin-bottom: 30px;
}

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

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

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

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

/************************************/
/***    18. Services Page css     ***/
/************************************/

.page-services{
	padding: 80px 0 80px;
}

.page-services .service-item{
	background-color: var(--white-color);
}

.page-services .service-item-header .icon-box::before{
	background: var(--primary-color);
}

.page-services .service-item:hover .service-item-header .icon-box img{
	filter: none;
}

.page-services .service-item-title h2,
.page-services .readmore-btn{
	color: var(--primary-color);
}

.page-services .service-item-content p{
	color: var(--text-color);
}

.page-services .service-item-btn{
	border-color: var(--divider-color);
}

.page-services .service-item-btn .readmore-btn::before{
	background-image: url('../images/arrow-primary.svg');
}

/************************************/
/***    19. Service Single css    ***/
/************************************/

.page-service-single{
	padding: 50px 0 50px;
	/*! background: linear-gradient(0deg,rgb(255, 255, 255) 0%, rgba(159, 206, 207, 0.2) 50%, rgb(255, 255, 255) 100%); */
	background: linear-gradient(0deg,rgb(255, 255, 255) 0%, rgba(159, 206, 207, 0.2) 50%, rgb(255, 255, 255) 100%);
}

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

.page-category-list{
	background: var(--white-color);
	border-radius: 10px;
    /*! margin-bottom: 60px; */
	overflow: hidden;
	padding: 25px;
	background-color: #f5f4ef;
	min-height: calc(100vh - 52px);
	border-radius: 18px;
	padding: 25px;
	background: linear-gradient(180deg, #15999b 0%, #114c5c 100%);
	color: #fff;
	box-shadow: 0 24px 65px rgba(15, 117, 136, 0.22);
	position: sticky;
	top: 26px;
	overflow: hidden;
	min-height: calc(100vh - 52px);
	border-radius: 20px;
	padding: 30px;
	background: linear-gradient(180deg, #0d6879 0%, #1ca3af 100%);
	color: #fff;
	box-shadow: 0 24px 65px rgba(15, 117, 136, 0.22);
	position: sticky;
	top: 26px;
	overflow: hidden;
}

.page-category-list .page-category-list-title{
	font-size: 22px;
	line-height: normal;
	color: var(--white-color);
	/*! background: #114c5c; */
	padding: 16px 0px;
	border-radius: 8px;
}

.page-category-list ul{
	list-style: none;
	margin: 0;
	padding: 0;
	background-color: transparent;
}

.page-category-list ul li{
	line-height: 1.5em;
    border-bottom: 0;
}

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

.page-category-list ul li a{
    position: relative;
    display: block;
    text-transform: capitalize;
    color: inherit;
    padding-right: 25px;
    transition: all 0.4s ease-in-out;
    padding: 15px;
    margin: 10px 0;
    background-color: #fff;
    border-radius: 8px;
    font-size: 19px;
    color: #333;
    width: 100%;
    border: 0;
    cursor: pointer;
    min-height: 56px;
    border-radius: 9px;
    padding: 0 18px;
    background: rgba(255,255,255,0.10);
    color: rgba(255,255,255,0.92);
    display: flex;
    align-items: center;
    gap: 13px;
    font-size: 18px;
    font-weight: 500;
    text-align: left;
    transition: 0.3s ease;
}

.page-category-list ul li a:hover{
    color: #ffffff;
    background-color: #15999b;
}

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

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

.sidebar-cta-box{
	position: relative;
	border-radius: 20px;
	min-height: 460px;
	align-content: end;
	padding: 10px;
	overflow: hidden;
}

.sidebar-cta-box-image{
	position: absolute;
	top: 0;
	bottom: 0;
	left: 0;
	right: 0;
	width: 100%;
	height: 100%;
}

.sidebar-cta-box-image figure{
	display: block;
	height: 100%;
}

.sidebar-cta-box-image img{
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.sidebar-cta-contact-item-list{
	position: relative;
	background: #FFFFFFBF;
	backdrop-filter: blur(10px);
	-webkit-backdrop-filter: blur(10px);
	border-radius: 10px;
	padding: 20px;
	z-index: 2;
}

.sidebar-cta-contact-item{
	display: flex;
    flex-wrap: wrap;
	align-items: center;
    gap: 15px;
    border-bottom: 1px solid var(--dark-divider-color);
    margin-bottom: 2px;
    padding-bottom: 25px;
}

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

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

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

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

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

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

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

.sidebar-cta-contact-item-content p{
	color: #114C5C;
	margin: 0;
}

.sidebar-cta-contact-item-content h2{
	font-size: 20px;
	color: #114c5c;
	margin: 5px 0 0;
}

.sidebar-cta-contact-item-content h2 a{
	color: inherit;
	transition: all 0.4s ease-in-out;
}

.sidebar-cta-contact-item-content h2 a:hover{
	color: var(--accent-secondary-color);
}

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

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

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

.service-entry{
    margin-bottom: 60px;
    background: rgba(255,255,255,0.72);
    border: 1px solid rgba(202, 230, 236, 0.95);
    border-radius: 20px;
    padding: 34px;
    min-height: calc(100vh - 52px);
    box-shadow: 0 24px 65px rgba(13, 64, 84, 0.08);
    backdrop-filter: blur(16px);
    overflow: hidden;
}

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

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

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

.service-entry p:last-child,
.service-entry h2:last-child,
.service-entry h3:last-child{
	margin: 0;
}

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

.service-entry ul li{
	position: relative;
	width: 100%;
	line-height: 1.5em;
	padding-left: 7px;
	margin-bottom: 10px;
}

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

.service-entry-info-box,
.service-focus-box,
.service-process-box{
	margin-top: 60px;
}

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

.service-benefit-box h3{
	font-size: 30px;
}

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

.service-focus-item{
	display: flex;
	flex-wrap: wrap;
	gap: 30px;
	margin-bottom: 30px;
}

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

.service-focus-image{
	width: calc(39% - 15px);
}

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

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

.service-focus-content-box{
	width: calc(61% - 15px);
	background: var(--white-color);
	align-content: center;
	border-radius: 20px;
	padding: 2.083vw;
}

.service-focus-item-header{
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 15px;
	margin-bottom: 30px;
}

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

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

.service-focus-content-box:hover .service-focus-item-header .icon-box:before{
	transform: scale(1);
}

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

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

.service-process-body-box{
	display: flex;
	flex-wrap: wrap;
	gap: 30px 50px;
	margin-top: 40px;
}

.service-process-item-list{
	width: calc(51% - 25px);
	align-content: center;
}

.service-process-item{
	display: flex;
	flex-wrap: wrap;
	gap: 15px 20px;
	margin-bottom: 40px;
}

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

.service-process-item-no{
	position: relative;
	width: 60px;
	height: 60px;
	background-color: var(--accent-secondary-color);
	border-radius: 50%;
	display: flex;
	align-items: center;
	justify-content: center;
}

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

.service-process-item:hover .service-process-item-no:before{
	transform: scale(1);
}

.service-process-item-no span{
	position: relative;
	font-family: var(--accent-font);
	font-size: 24px;
	font-weight: 500;
	color: var(--white-color);
	z-index: 1;
}

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

.service-process-video-image{
	position: relative;
	width: calc(49% - 25px);
	border-radius: 20px;
	overflow: hidden;
}

.service-process-video-image figure{
	display: block;
	height: 100%;
}

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

.service-process-video-image figure img{
	width: 100%;
	height: 100%;
	aspect-ratio: 1 / 0.925;
	object-fit: cover;
}

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

.service-process-video-image .video-play-button a{
	width: 55px;
	height: 55px;
}

.service-process-video-image .video-play-button a i{
	font-size: 18px;
}

/************************************/
/***     20. Blog Archive css     ***/
/************************************/

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

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

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

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

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

/************************************/
/***      21. Blog Single css     ***/
/************************************/

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

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

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

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

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

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

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

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

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

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

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

.post-entry h1,
.post-entry h2,
.post-entry h3,
.post-entry h4,
.post-entry h5,
.post-entry h6{
	font-family: var(--accent-font);
	font-weight: 500;
	line-height: 1.2em;
	margin: 0 0 0.42em;
}

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

.post-entry blockquote{
	background: var(--accent-color) url('../images/icon-blockquote.svg');
	background-repeat: no-repeat;
	background-position: 30px 30px;
    background-size: 45px;
	border-radius: 20px;
    padding: 30px 30px 30px 90px;
    margin-bottom: 30px;
}

.post-entry blockquote p{
	font-family: var(--accent-font);
	font-size: 20px;
	font-weight: 500;
	line-height: 1.4em;
	color: var(--white-color);
}

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

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

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

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

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

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

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

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

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

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

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

/************************************/
/***   22. Case Study Page css    ***/
/************************************/

.page-case-study{
	padding: 120px 0 90px;
}

/************************************/
/***  23. Case Study Single css   ***/
/************************************/

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

.case-study-category-list ul li{
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	gap: 10px;
}

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

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

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

.case-study-entry h3{
	font-size: 20px;
	margin-bottom: 10px;
}

.case-study-entry p:last-child,
.case-study-entry h2:last-child,
.case-study-entry h3:last-child{
	margin: 0;
}

.case-study-entry ul{
	display: flex;
	flex-wrap: wrap;
	gap: 30px;
	list-style: none;
	padding: 0;
	margin: 0;
}

.case-study-entry ul li{
	position: relative;
	width: calc(50% - 15px);
	line-height: 1.5em;
	padding-left: 25px;
}

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

.case-study-approach-box,
.case-study-results-box,
.case-study-challenge-box{
	margin-top: 60px;
}

.case-study-approach-list{
	margin-top: 40px;
}

.case-study-approach-list ul li{
	border: 1px solid var(--divider-color);
	border-radius: 10px;
	padding: 15px 15px 15px 45px;
}

.case-study-approach-list ul li::before{
	left: 15px;
	top: 15px;
}

.case-study-results-body{
	background: var(--white-color);
	border-radius: 20px;
	margin-top: 40px;
	padding: 40px;
}

.case-study-result-item-list{
	display: flex;
	flex-wrap: wrap;
	gap: 30px;
}

.case-study-result-item{
	width: calc(33.33% - 20px);
}

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

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

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

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

.case-study-result-list{
	border-top: 1px solid var(--divider-color);
	margin-top: 40px;
	padding-top: 40px;
}

.case-study-result-list ul{
	gap: 20px;
}

.case-study-result-list ul li{
	width: calc(33.33% - 13.33px);
}

.case-study-challenge-item-list{
	display: flex;
	flex-wrap: wrap;
	gap: 30px;
	margin-top: 40px;
}

.case-study-challenge-item{
	position: relative;
	width: calc(50% - 15px);
	min-height: 325px;
	align-content: end;
	border-radius: 20px;
	padding: 30px;
	overflow: hidden;
}

.case-study-challenge-image{
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	width: 100%;
	height: 100%;
}

.case-study-challenge-image::before{
	content: '';
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	background: linear-gradient(180deg, transparent 48.45%, rgba(34, 34, 34, 0.80) 100%);
	width: 100%;
	height: 100%;
}

.case-study-challenge-image figure{
	display: block;
	height: 100%;
}

.case-study-challenge-image img{
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.case-study-challenge-item-content{
	position: relative;
	z-index: 1;
}

.case-study-challenge-item-content h3,
.case-study-challenge-item-content p{
	color: var(--white-color);
}

/************************************/
/***      24. Team Page css       ***/
/************************************/

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

/************************************/
/***     25. Team Single css      ***/
/************************************/

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

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

.team-single-image{
	position: relative;
	border-radius: 20px;
	overflow: hidden;
	margin-bottom: 60px;
}

.team-single-image figure{
	position: relative;
	display: block;
}

.team-single-image img{
	width: 100%;
	aspect-ratio: 1 / 1.2;
	object-fit: cover;
}

.member-social-list{
	position: absolute;
	bottom: 30px;
	left: 30px;
	right: 30px;
	z-index: 1;
}

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

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

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

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

.team-member-about,
.team-member-expertise,
.team-member-experience{
	margin-bottom: 60px;
}

.team-contact-list-box{
	background-color: var(--white-color);
	border-radius: 20px;
	padding: 50px;
}

.team-contact-list-box-title{
	margin-bottom: 40px;
}

.team-contact-list-box-title h3{
	font-size: 30px;
}

.team-contact-list-item{
	display: flex;
	flex-wrap: wrap;
	gap: 30px;
	border-bottom: 1px solid var(--divider-color);
	margin-bottom: 40px;
	padding-bottom: 40px;
}

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

.team-contact-item{
	width: calc(50% - 15px);
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 15px;
}

.team-contact-item .icon-box{
	position: relative;
    width: 50px;
    height: 50px;
    display: inline-flex;
    justify-content: center;
    align-items: center;
    background: var(--accent-color);
    border-radius: 100px;
    overflow: hidden;
}

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

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

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

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

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

.team-contact-item-content p{
	margin: 5px 0 0;
}

.member-skill-list .skill-data .skill-title,
.member-skill-list .skill-data .skill-no{
	font-size: 18px;
}

.member-skill-list .skill-progress{
	height: 14px;
}

.member-skill-list .skill-progress .count-bar{
	background-color: var(--accent-color);
}

.member-experience-item-list{
	display: flex;
	flex-wrap: wrap;
	gap: 30px;
}

.member-experience-item{
	width: calc(50% - 15px);
	border: 1px solid var(--divider-color);
	border-radius: 10px;
	padding: 30px;
}

.member-experience-item h3{
	font-size: 20px;
}

.member-experience-item p{
	margin: 10px 0 0;
}

/************************************/
/***     26. Pricing Page css     ***/
/************************************/

.page-pricing{
	padding: 120px 0;
}

/************************************/
/***   27. Testimonials Page css  ***/
/************************************/

.page-testimonials{
	padding: 120px 0 90px;
}

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

/************************************/
/***     28. Image Gallery css    ***/
/************************************/

.page-gallery{
	padding: 120px 0 90px;
}

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

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

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

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

/************************************/
/***    29. Video Gallery css     ***/
/************************************/

.page-video-gallery{
	padding: 120px 0 90px;
}

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

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

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

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

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

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

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

/************************************/
/***      30. FAQ's Page css      ***/
/************************************/

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

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

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

/************************************/
/***   31. Contact Us Page css    ***/
/************************************/

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

.contact-us-content{
	margin-right: 15px;
}

.contact-info-list-title{
	margin-bottom: 50px;
}

.contact-info-list-title h3{
	font-size: 23px;
}

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

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

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

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

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

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

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

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

.contact-info-item-content p{
	line-height: normal;
	margin: 5px 0 0;
}

.contact-info-item-content p a{
	color: inherit;
	transition: all 0.4s ease-in-out;
}

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

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

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

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

.google-map{
	padding: 20px 0 50px;
}

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

.google-map-iframe iframe{
	width: 100%;
    height: 100%;
	filter: grayscale(100%);
    border-radius: 20px;
	transition: all 0.4s ease-in-out;
}

.google-map-iframe iframe:hover{
	filter: grayscale(0%);
}

/************************************/
/***   32. Book Appointment css   ***/
/************************************/

.page-book-appointment{
	padding: 120px 0;
}

.book-appointment-content{
	margin-right: 15px;
}

.working-hour-box{
	max-width: 550px;
}

.working-hour-box h3{
	font-size: 30px;
	margin-bottom: 50px;
}

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

.working-hour-box ul li{
	width: 100%;
	display: flex;
	justify-content: space-between;
	gap: 10px;
	line-height: 1.5em;
	border-bottom: 1px solid var(--divider-color);
	margin-bottom: 25px;
	padding-bottom: 25px;
}

.working-hour-box ul li:last-child{
	margin-bottom: 0px;
	padding-bottom: 0px;
	border-bottom: none;
}

.working-hour-box ul li span{
	font-family: var(--accent-font);
	font-size: 20px;
	font-weight: 500;
	color: var(--primary-color);
}

.page-book-appointment .book-appointment-form-box{
	background-color: var(--white-color);
	max-width: 100%;
}

.book-appointment-form-content{
	margin-bottom: 40px;
}

.book-appointment-form-content p{
	margin: 0;
}

.page-book-appointment .book-appointment-form .form-control{
	background-color: var(--bg-color);
	color: var(--primary-color);
}

.page-book-appointment .book-appointment-form .form-control::placeholder{
	color: var(--text-color);
}

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

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

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

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

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

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

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

@media only screen and (max-width: 1850px){
	
	.bg-section{
		/*! width: calc(100% - 30px); */
	}
}

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

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

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

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

	.hero{
        height: auto;
    }

	.hero-content{
		margin-bottom: 30px;
	}

	.hero-info-box{
		margin-left: 0;
		min-height: auto;
		padding: 20px;
	}

	.about-us-image-box{
		max-width: 740px;
		margin: 0 auto 30px;
	}

	.about-us-image-box-2 .about-us-image img{
		aspect-ratio: 1 / 1.8;
	}

	.service-item{
		gap: 30px;
		padding: 30px;
		min-height: 350px;
	}

	.service-item-btn{
		margin-top: 30px;
		padding-top: 30px;
	}

	.expertise-content{
		margin-bottom: 30px;
	}

	.expertise-image-box{
		max-width: 740px;
		margin: 0 auto;
	}

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

	.why-choose-cta-body{
		gap: 30px;
	}

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

	.why-choose-slider-box{
		margin-top: 10px;
	}

	.why-choose-slider-content{
		margin-bottom: 30px;
	}

	.case-study-item{
		min-height: 420px;
		padding: 30px;
	}

	.how-work-content{
		margin-bottom: 30px;
	}

	.how-it-work-image{
		margin: 0;
		height: auto;
	}

	.how-it-work-image figure,
	.how-it-work-image img{
		height: auto;
	}

	.how-work-item-list{
		gap: 40px;
		margin-top: 60px;
	}

	.how-work-item{
		width: calc(50% - 20px);
	}

	.how-work-item:before{
		right: -20px;
	}

	.how-work-item:nth-child(3n + 3):before{
		display: block;
	}

	.how-work-item:nth-child(2n + 2):before,
	.how-work-item:last-child:before{
		display: none;
	}

	.how-work-item-body{
		margin-top: 20px;
	}

	.pricing-item-content,
	.pricing-item-list{
		padding: 20px;
	}

	.pricing-item-body{
		padding: 30px;
	}

	.pricing-item-list h3{
		margin-bottom: 20px;
		padding-bottom: 20px;
	}

	.testimonial-item{
		padding: 30px;
	}

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

	.faqs-content-btn{
		margin-top: 30px;
	}

	.book-appointment-form-box{
		padding: 30px;
	}

	.post-item{
		padding: 30px;
	}

	.footer-header{
		margin-bottom: 30px;
		padding-bottom: 30px;
	}

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

	.about-footer-content{
		margin-top: 15px;
	}

	.footer-social-links{
		margin-top: 20px;
	}

	.footer-links-box{
		margin: 0;
	}

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

	.approach-content-box,
	.approach-item-list{
		padding: 30px;
	}

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

	.benefits-item{
		padding: 30px;
		min-height: auto;
	}

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

	.intro-video-body{
		padding: 120px 0;
	}

	.intro-video-content{
		margin-top: 50px;
	}

	.intro-video-contact-title{
		max-width: 34%;
	}

	.intro-video-contact-list{
		max-width: 63%;
	}

	.page-single-sidebar{
		margin: 0;
	}

	.page-category-list .page-category-list-title{
		padding: 15px 20px;
	}

	.page-category-list ul{
		padding: 20px;
	}

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

	.sidebar-cta-contact-item-list{
		padding: 15px;
	}

	.sidebar-cta-contact-item{
		gap: 10px;
		margin-bottom: 20px;
		padding-bottom: 20px;
	}

	.sidebar-cta-contact-item .icon-box{
		width: 40px;
		height: 40px;
	}

	.sidebar-cta-contact-item .icon-box img{
		max-width: 20px;
	}
	
	.sidebar-cta-contact-item-content{
		width: calc(100% - 50px);
	}

	.sidebar-cta-contact-item-content h2{
		font-size: 18px;
	}

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

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

	.service-entry ul{
		margin-top: 30px;
	}

	.service-entry-info-box,
	.service-focus-box,
	.service-process-box{
		margin-top: 40px;
	}

	.service-benefit-box{
		margin-top: 30px;
	}

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

	.service-process-body-box{
		gap: 30px;
		margin-top: 30px;
	}

	.service-process-item-list{
		width: calc(54% - 15px);
	}

	.service-process-item{
		margin-bottom: 30px;
	}

	.service-process-video-image{
		width: calc(46% - 15px);
	}

	.case-study-approach-box,
	.case-study-results-box,
	.case-study-challenge-box{
		margin-top: 40px;
	}

	.case-study-approach-list{
		margin-top: 30px;
	}
	
	.case-study-entry ul{
		gap: 15px;
	}

	.case-study-approach-list ul li{
		width: calc(50% - 7.5px);
		padding: 10px 10px 10px 33px;
	}
	
	.case-study-approach-list ul li::before{
		left: 10px;
		top: 10px;
	}
	
	.case-study-results-body{
		margin-top: 30px;
		padding: 30px;
	}

	.case-study-result-item-content h3{
		font-size: 18px;
	}
	
	.case-study-result-list{
		margin-top: 30px;
		padding-top: 30px;
	}

	.case-study-result-list ul li{
		width: calc(50% - 7.5px);
	}

	.case-study-challenge-item-list{
		margin-top: 30px;
	}

	.team-member-about,
	.team-member-expertise,
	.team-member-experience{
		margin-bottom: 40px;
	}

	.team-contact-list-box{
		padding: 30px;
	}

	.team-contact-list-box-title{
		margin-bottom: 30px;
	}

	.team-contact-list-box-title h3{
		font-size: 26px;
	}

	.team-contact-list-item{
		gap: 30px 20px;
		margin-bottom: 30px;
		padding-bottom: 30px;
	}

	.team-contact-item{
		width: calc(50% - 10px);
	}

	.member-experience-item-list{
		gap: 20px;
	}

	.member-experience-item{
		width: calc(50% - 10px);
		padding: 20px;
	}

	.contact-us-content{
		margin: 0 0 30px;
	}

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

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

	.book-appointment-content{
		margin: 0 0 30px;
	}

	.working-hour-box h3{
		margin-bottom: 30px;
	}
}

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

	.bg-section{
		border-radius: 0;
	}

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

	.btn-default::before{
		width: 36px;
		height: 36px;
		background-size: 11px auto;
	}

	header.main-header{
		top: 0px;
		right: 0px;
		left: 0px;
	}

	header.main-header .header-sticky{
		width: 100%;
		border-radius: 0;
	}

	header.main-header .header-sticky.active{
        width: 100%;
        top: 0;
		left: 0;
		right: 0;
		border-right: none;
		border-left: none;
		border-radius: 0;
	}

	.navbar{
		padding: 20px 0;
	}

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

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

	.header-btn{
		display: none;
	}

	.bg-section{
		width: 100%;
		border-radius: 0;
		margin: 0;
	}

	.bg-section .container-fluid{
		padding: 0 15px;
	}

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

	.section-title .section-sub-title{
		padding: 7px 12px 7px 27px;
		margin-bottom: 10px;
	}

	.section-title .section-sub-title::before{
		left: 12px;
	}

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

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

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

	.hero{
		padding: 150px 0 60px;
		margin: 0;
		border-radius: 0;
	}

	.hero-content-body{
		gap: 20px;
	}

	.hero-client-content h2{
		font-size: 18px;
	}

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

	.about-us-body,
	.about-us-btn{
		margin-top: 30px;
	}

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

	.our-services{
		padding: 60px 0;
		background-size: 100% auto;
	}

	.service-item-header .icon-box{
		height: 50px;
		width: 50px;
	}

	.service-item-header .icon-box img{
		max-width: 24px;
	}

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

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

	.our-expertise{
		padding: 60px 0;
	}

	.expertise-body{
		padding-top: 30px;
	}

	.skillbar .skill-data{
		margin-bottom: 15px;
	}

	.expertise-btn{
		margin-top: 30px;
	}

	.experience-circle{
		transform: translate(-55px, 55px);
	}

	.experience-circle img{
		max-width: 110px;
	}

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

	.why-choose-item{
		min-height: 350px;
		padding: 15px;
	}

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

	.why-choose-content-image img{
		max-width: 200px;
	}

	.why-choose-cta-body .icon-box img{
		max-width: 50px;
	}

	.why-choose-cta-content h2{
		font-size: 22px;
	}

	.our-case-study{
		padding: 60px 0;
	}

	.how-it-work{
		padding: 60px 0;
	}

	.how-work-item-header .icon-box{
		width: 50px;
		height: 50px;
	}

	.how-work-item-header .icon-box img{
		max-width: 24px;
	}

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

	.how-work-item-title p{
		margin-bottom: 5px;
	}

	.our-pricing{
		padding: 60px 0;
	}

	.pricing-item-price h2{
		font-size: 34px;
	}

	.pricing-item-btn .btn-default{
		padding: 15px;
	}

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

	.pricing-item-list ul li::before{
		font-size: 16px;
	}

	.pricing-benefit-list{
		margin-top: 10px;
	}

	.pricing-benefit-list ul{
		gap: 15px 30px;
	}

	.pricing-benefit-list ul li img{
		max-width: 18px;
	}

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

	.testimonials-review-header-content h2{
		font-size: 22px;
    	min-width: 60px;
	}

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

	.our-testimonials .section-footer-text{
		margin-top: 40px;
	}

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

	.faqs-content-list ul li{
		margin-bottom: 10px;
	}

	.faqs-content-list ul li:before{
		font-size: 16px;
	}

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

	.faq-accordion .accordion-header .accordion-button{
		padding: 18px 44px 18px 20px;
	}
	
	.faq-accordion .accordion-item .accordion-button::after,
	.faq-accordion .accordion-item .accordion-button.collapsed::after{
		right: 20px;
		font-size: 18px;
	}

	.faq-accordion .accordion-item .accordion-body{
		padding: 18px 20px;
	}

	.our-book-appointment{
		padding: 60px 0;
	}

	.book-appointment-image{
		position: initial;
		height: auto;
		margin-bottom: 30px;
	}

	.book-appointment-image figure,
	.book-appointment-image img{
		height: auto;
	}

	.book-appointment-image img{
		aspect-ratio: 1 / 0.667;
	}

	.book-appointment-form-box{
		max-width: 100%;
	}

	.book-appointment-form .form-control{
		padding: 13px 15px;
	}

	.book-appointment-form select.form-control{
		padding: 13px 30px 13px 15px;
	}

	.appointment-form-btn{
		margin-top: 0;
	}

	.appointment-form-btn .btn-default{
		padding: 15px;
	}

	.our-blog{
		padding: 60px 0 30px;
	}

	.post-item{
		min-height: 380px;
	}

	.post-item .post-item-btn{
		margin-top: 20px;
		padding-top: 20px;
	}

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

	.footer-newsletter-form{
		max-width: 100%;
	}

	.footer-newsletter-form .form-group{
		padding: 5px;
	}

	.footer-links h2{
		margin-bottom: 20px;
	}

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

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

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

	.our-approach{
    	padding: 60px 0 0;
		margin-bottom: 150px;
	}

	.approach-content-box{
		padding: 0;
	}

	.approach-image{
		position: initial;
		height: auto;
	}

	.approach-image figure,
	.approach-image img{
		height: auto;
	}

	.approach-image img{
		aspect-ratio: 1 / 0.43;
	}

	.approach-item-list{
		max-width: 100%;
	}

	.approach-content-box{
		margin-bottom: -150px;
	}

	.our-benefit{
		padding: 60px 0;
	}

	.benefit-item-list ul li{
		margin-bottom: 10px;
	}

	.benefit-item-list ul li:before{
		font-size: 16px;
	}

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

	.video-play-button a i{
		font-size: 24px;
	}

	.intro-video-contact-box{
		padding: 20px 0;
	}

	.intro-video-contact-list,
	.intro-video-contact-title{
		max-width: 100%;
	}

	.intro-video-contact-title h2{
		font-size: 26px;
	}

	.our-team{
		padding: 60px 0;
	}

	.team-item{
		min-height: 440px;
	}

	.page-services{
		padding: 60px 0 30px;
	}

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

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

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

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

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

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

	.service-benefit-box h3{
		font-size: 26px;
	}
	
	.service-focus-content-box{
		padding: 20px;
	}

	.service-focus-item-header{
		margin-bottom: 20px;
	}

	.service-process-item{
		gap: 15px;
	}

	.service-process-item-no{
		width: 50px;
		height: 50px;
	}

	.service-process-item-no span{
		font-size: 20px;
	}

	.service-process-item-content{
		width: calc(100% - 65px);
	}

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

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

	.page-single-post{
        padding: 15px 0;
    }
    
    .post-image{
        margin-bottom: 20px;
    }
    
    .post-entry h2{
        font-size: 38px;
    }
    
    .post-entry p{
        margin-bottom: 15px;
    }
    
    .post-entry ol li,
    .post-entry ul li{
		font-size: 16px;
        margin-bottom: 10px;
    }
    
    .post-entry blockquote{
        background-position: 20px 20px;
        background-size: 40px;
        padding: 20px 20px 20px 70px;
        margin-bottom: 20px;
    }
    
    .post-entry blockquote p{
        font-size: 18px;
    }
    
    .post-tags{
        margin-bottom: 20px;
    }
    
    .post-tags .tag-links a{
        padding: 12px 15px;
    }
    
    .post-social-sharing ul{
        text-align: left;
    }

	.page-case-study{
		padding: 60px 0 30px;
	}

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

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

	.case-study-entry h2{
		font-size: 38px;
		margin-bottom: 15px;
	}

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

	.case-study-challenge-item{
		padding: 20px;
	}

	.case-study-result-item .icon-box{
		margin-bottom: 20px;
	}

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

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

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

	.page-pricing{
		padding: 60px 0;
	}

	.page-testimonials{
		padding: 60px 0 30px;
	}

	.page-gallery{
		padding: 60px 0 30px;
	}

	.page-video-gallery{
		padding: 60px 0 30px;
	}

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

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

	.page-contact-us{
		padding: 60px 0 30px;
	}

	.contact-info-list-title h3{
		font-size: 26px;
	}

	.contact-form .form-control{
		padding: 13px 15px;
	}

	.google-map{
		padding: 30px 0 60px;
	}

	.google-map-iframe{
		height: 450px;
	}

	.page-book-appointment{
		padding: 60px 0;
	}

	.working-hour-box h3{
		font-size: 26px;
	}

	.working-hour-box ul li{
		margin-bottom: 20px;
		padding-bottom: 20px;
	}

	.working-hour-box ul li span{
        font-size: 18px;
    }

	.error-page{
		padding: 60px 0px;
	}
	
	.error-page-image{
		margin-bottom: 20px;
	}
}

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

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

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

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

	.hero-client-content h2{
		font-size: 16px;
	}

	.hero-info-box{
		max-width: 100%;
		gap: 20px;
	}

	.hero-info-box-rating{
		margin-top: 20px;
		padding-top: 20px;
	}

	.hero-info-box-rating h2{
		font-size: 18px;
	}

	.about-us-image-box{
		gap: 15px;
	}

	.about-us-image-box-1{
		width: calc(44% - 7.5px);
	}

	.happy-customer-review-box{
		padding: 0 15px 15px 0;
		margin-right: -55px;
	}

	.happy-customer-review-box::after{
		right: 20px;
		bottom: -20px;
	}
	
	.happy-customer-review-item{
		padding: 15px;
	}

	.happy-customer-review-item .hero-info-rating-star i{
		font-size: 16px;
	}

	.happy-customer-review-content{
		margin-top: 10px;
		padding-top: 10px;
	}

	.happy-customer-review-content p{
		font-size: 14px;
	}

	.happy-customer-review-item .satisfy-client-images{
		margin-top: 10px;
	}

	.about-us-image-box-2{
		width: calc(56% - 7.5px);
	}

	.about-us-item-list{
		gap: 20px;
	}

	.about-us-item{
		width: 100%;
	}

	.about-us-item-content h3{
		font-size: 18px;
	}

	.about-us-body-item{
		padding: 15px;
	}
	
	.service-item{
        gap: 20px;
        padding: 20px;
        min-height: auto;
    }

	.service-item-title h2{
		font-size: 18px;
	}

	.service-item-btn{
        margin-top: 20px;
        padding-top: 20px;
    }

	.skillbar .skill-data{
        margin-bottom: 10px;
    }

	.expertise-image-box-1{
		padding-bottom: 50px;
	}

	.expertise-image-box-1 figure{
		margin-right: -150px;
	}

	.experience-circle{
        transform: translate(-45px, 45px);
    }

	.experience-circle img{
        max-width: 90px;
    }

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

	.why-choose-image img{
		aspect-ratio: 1 / 0.9;
	}
	
	.why-choose-cta-item{
		padding: 20px;
	}

	.why-choose-cta-content h2{
        font-size: 20px;
    }

	.why-choose-slider-content{
		gap: 10px;
		margin-bottom: 20px;
	}

	.why-choose-logo img{
		max-width: 145px;
		height: 35px;
	}

	.case-study-item{
        min-height: 360px;
        padding: 20px;
    }

	.case-study-item-contant ul{
		margin-bottom: 10px;
	}

	.case-study-item-contant ul li a{
		padding: 6px 12px;
	}

	.case-study-item-contant h2{
		font-size: 18px;
	}
	
	.how-work-item-list{
        margin-top: 0;
    }

	.how-work-item{
		width: 100%;
	}

	.how-work-item:before{
		top: auto;
		bottom: -20px;
		left: 0;
		right: 0;
		height: 1px;
		width: 100%;
	}

	.how-work-item:nth-child(2n + 2):before{
		display: block;
	}

	.how-work-item:last-child:before{
		display: none;
	}

	.how-work-item-title h3{
		font-size: 18px;
	}

	.pricing-item-content,
	.pricing-item-list{
        padding: 10px;
    }

	.pricing-item-content h2{
		font-size: 18px;
	}

	.pricing-item-body{
        padding: 20px;
    }

	.pricing-item-price h2{
        font-size: 28px;
    }

	.pricing-item-price p{
		margin-top: 5px;
	}

	.pricing-item-btn{
		margin-top: 20px;
	}

	.pricing-item-list h3{
        margin-bottom: 15px;
        padding-bottom: 15px;
    }

	.pricing-benefit-list{
		margin-top: 5px;
	}

	.pricing-benefit-list ul{
		gap: 10px 20px;
	}

	.pricing-benefit-list ul li{
		font-size: 14px;
	}

	.pricing-benefit-list ul li img{
		max-width: 16px;
		margin-right: 5px;
	}

	.testimonials-image-box{
		margin-bottom: 30px;
	}

	.testimonials-image-box,
	.testimonials-image,
	.testimonials-image figure{
		height: auto;
	}

	.testimonials-image img{
		height: auto;
        aspect-ratio: 1 / 1.05;
    }

	.testimonials-review-box{
		max-width: 235px;
	}

	.testimonials-review-box-header .icon-box img{
		max-width: 30px;
	}

	.testimonials-review-header-content h2{
        font-size: 18px;
        min-width: 50px;
    }

	.testimonials-review-body{
		margin-top: 10px;
	}

	.testimonial-item{
		height: auto;
        min-height: auto;
		gap: 20px;
        padding: 20px;
    }

	.testimonial-item-author{
		padding-top: 20px;
	}

	.testimonial-item-author-content h2{
		font-size: 18px;
	}

	.faq-accordion .accordion-header .accordion-button{
        padding: 12px 35px 12px 15px;
		font-size: 16px;
    }

	.faq-accordion .accordion-item .accordion-body{
        padding: 12px 15px;
    }

	.faq-accordion .accordion-item .accordion-button::after,
	.faq-accordion .accordion-item .accordion-button.collapsed::after{
		font-size: 16px;
        right: 15px;
    }
	
	.book-appointment-form-box{
        padding: 30px 20px;
    }

	.post-item{
		padding: 20px;
	}
	 
	.post-item .post-item-btn{
        margin-top: 15px;
        padding-top: 15px;
    }

	.post-item .post-item-content h2{
		font-size: 18px;
	}

	.about-footer{
		padding: 20px;
	}

	.footer-links{
		max-width: 100%;
	}

	.footer-service-links{
		order: 3;
	}

	.footer-support-links{
		order: 2;
	}

	.footer-links h2{
		font-size: 18px;
		margin-bottom: 15px;
	}

	.footer-copyright-text{
		padding: 15px 0;
	}

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

	.approach-image img{
        aspect-ratio: 1 / 0.6;
    }

	.approach-item-list{
		padding: 20px;
	}

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

	.approach-item-content{
		width: 100%;
	}

	.approach-item-content h3{
		font-size: 18px;
	}

	.benefits-item{
		gap: 20px;
        padding: 20px;
    }

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

	.benefit-item-content h2{
		font-size: 18px;
	}

	.benefit-item-list{
		padding-top: 20px;
	}

	.intro-video-body{
		padding: 80px 0 60px;
    }

	.intro-video-content{
        margin-top: 30px;
    }

	.intro-video-contact-list{
		gap: 20px;
	}

	.intro-video-contact-title h2{
        font-size: 22px;
    }

	.intro-video-contact-item{
		width: 100%;
	}

	.intro-video-contact-item::before{
		display: none;
	}

	.intro-video-contact-content h3{
		font-size: 18px;
	}

	.team-item{
        min-height: auto;
        padding: 0;
    }

	.team-item-content h2{
		font-size: 18px;
	}

	.team-item:hover .team-social-list{
		margin-bottom: 20px;
	}

	.page-category-list .page-category-list-title{
		font-size: 18px;
	}

	.sidebar-cta-box{
		min-height: 380px;
	}

	.sidebar-cta-contact-item{
        margin-bottom: 15px;
        padding-bottom: 15px;
    }

	.sidebar-cta-contact-item-content h2{
        font-size: 16px;
    }

	.page-single-image img{
        aspect-ratio: 1 / 0.68;
    }

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

	.service-entry h2{
		font-size: 26px;
	}

	.service-entry h3{
		font-size: 18px;
	}

	.service-entry ul{
		gap: 10px;
		margin-top: 20px;
	}

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

	.service-benefit-box h3{
        font-size: 22px;
    }

	.service-focus-item{
		gap: 20px;
	}

	.service-focus-image,
	.service-focus-content-box{
		width: 100%;
	}

	.service-process-item-list,
	.service-process-video-image{
		width: 100%;
	}

	.service-process-item{
		margin-bottom: 20px;
	}

	.service-process-video-image figure,
	.service-process-video-image figure img{
		height: auto;
	}

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

	.post-image img{
		aspect-ratio: 1 / 0.7;
	}

	.post-entry blockquote{
		padding: 65px 20px 20px 20px;
	}

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

	.post-entry h2{
		font-size: 26px;
	}
	
	.tag-links{
		font-size: 18px;
	}

	.case-study-entry h2{
        font-size: 26px;
    }

	.case-study-entry h3{
		font-size: 18px;
	}

	.case-study-entry ul{
		gap: 10px;
	}

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

	.case-study-approach-list ul{
		gap: 15px;
	}

	.case-study-results-body{
		padding: 20px;
	}

	.case-study-result-item{
		width: 100%;
	}

	.case-study-result-list{
        margin-top: 20px;
        padding-top: 20px;
    }

	.case-study-challenge-item{
		width: 100%;
	}

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

	.team-contact-list-box{
        padding: 20px;
    }

	.team-contact-list-box-title{
		margin-bottom: 20px;
	}

	.team-contact-list-box-title h3{
        font-size: 22px;
    }

	.team-contact-list-item{
		gap: 20px;
	}

	.team-contact-item{
		width: 100%;
	}

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

	.member-skill-list .skill-progress{
		height: 10px;
	}

	.member-experience-item{
        width: 100%;
		padding: 15px;
    }

	.member-experience-item h3{
		font-size: 18px;
	}

	.contact-info-list-title{
        margin-bottom: 20px;
    }

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

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

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

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

	.google-map-iframe{
		height: 350px;
	}

	.working-hour-box h3{
        font-size: 22px;
        margin-bottom: 20px;
    }

	.working-hour-box ul li{
        margin-bottom: 15px;
        padding-bottom: 15px;
    }

	.working-hour-box ul li span{
		font-size: 16px;
	}
}

/************************************/
/***   35. Home - Version 2 css   ***/
/************************************/

header.main-header.main-header-gold .header-sticky{
	border-bottom: none;
}

header.main-header.main-header-gold .main-menu .nav-menu-wrapper > ul{
	background: var(--dark-divider-color);
    backdrop-filter: blur(15px);
    -webkit-backdrop-filter: blur(15px);
	border-radius: 5px;
	padding: 0px 15px;
}

header.main-header.main-header-gold .main-menu .nav-menu-wrapper > ul > li > a{
	padding: 20px 10px !important;
}

header.main-header.main-header-gold .main-menu ul ul{
	border-radius: 0 0 20px 20px;
}

.hero-gold{
    position: relative;
    align-content: center;
	border-radius: 20px;
	margin: 0 15px;
    overflow: hidden;
    padding: 0;
}

.hero-gold::before{
	content: '';
	position: absolute;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	background: linear-gradient(270deg, transparent 26.4%, rgba(39, 69, 67, 0.85) 62.54%);
	width: 100%;
	height: 100%;
	z-index: 1;
	background: linear-gradient(180deg, rgba(34, 34, 34, 0.58) 12%, #00000069 40.63%), linear-gradient(180deg, transparent 29.87%, rgba(34, 34, 34, 0.5) 81.81%);
}

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

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

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

.hero-box-gold{
	min-height: 100vh;
 	align-content: center;    
	padding: 240px 0 0px;
}

.hero-info-box-gold{
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 30px;
}

.hero-item-list-gold{
	width: calc(50% - 15px);
}

.hero-item-gold{
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 15px;
	margin-bottom: 20px;
}

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

.hero-item-gold .icon-box{
	position: relative;
	width: 50px;
	height: 50px;
	background: var(--accent-secondary-color);
	border-radius: 50%;
	display: flex;
	justify-content: center;
	align-items: center;
	overflow: hidden;
}

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

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

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

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

.hero-item-content-gold{
	width: calc(100% - 65px);
}

.hero-item-content-gold h2{
	font-size: 20px;
	line-height: 1.4em;
	color: var(--white-color);
}

.hero-info-list-gold{
	width: calc(50% - 15px);
	border-left: 1px solid var(--dark-divider-color);
	padding-left: 30px;
}

.hero-info-list-gold ul{
	list-style: none;
	margin: 0;
	padding: 0;
}

.hero-info-list-gold ul li{
	position: relative;
	color: var(--white-color);
	font-weight: 500;
    line-height: 1.5em;
    margin-bottom: 15px;
    padding-left: 25px;
}

.hero-info-list-gold ul li:last-child{
	margin-bottom: 0;
}

.hero-info-list-gold ul li::before{
	content: '\f058';
    position: absolute;
    font-family: 'Font Awesome 7 Free';
    font-size: 18px;
    font-weight: 900;
    color: var(--accent-secondary-color);
    top: 0;
    left: 0;
}

.hero-btn-gold{
	border-top: 1px solid var(--dark-divider-color);
	margin-top: 40px;
	padding-top: 40px;
}

.our-scrolling-ticker-gold{
	position: relative;
	background: var(--divider-color);
	backdrop-filter: blur(10px);
	-webkit-backdrop-filter: blur(10px);
	padding: 30px 0;
	z-index: 1;
}

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

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

.scrolling-content-gold span{
	display: inline-flex;
	align-items: center;
	gap: var(--gap);
	font-family: var(--accent-font);
	font-size: 30px;
	font-weight: 500;
	line-height: 1.1em;
	color: var(--white-color);
	text-transform: capitalize;
}

.scrolling-content-gold span img{
	width: 100%;
	max-width: 30px;
	animation: infiniterotate 30s infinite linear;
}

@keyframes scroll{
	from{
		transform: translateX(0);
	}
	to{
		transform: translateX(calc(-100% - var(--gap)));
	}
}

.about-us-gold{
	padding: 120px 0;
}

.about-us-image-box-gold{
	display: flex;
	flex-wrap: wrap;
	align-items: end;
	margin-right: 15px;
	
}

.about-us-image-box-1-gold{
	position: relative;
    width: 65%;
	padding: 80px 0 30px 0;
	background-image: url('../images/about-us-bg-image-gold.png');
    background-position: top left 70px;
    background-repeat: no-repeat;
    background-size: auto;
}

.about-us-image-1-gold{
	position: relative;
	padding: 6px 6px 0 0;
    background: var(--secondary-color);
    clip-path: polygon(0 0, 75% 0, 100% 20%, 100% 100%, 0 100%);
    border-radius: 20px;
    margin-left: auto;
	z-index: 2;
}

.about-us-image-1-gold figure{
	display: block;
	clip-path: polygon(0 0, 75% 0, 100% 20%, 100% 100%, 0 100%);
}

.about-us-image-1-gold figure img{
	width: 100%;
	aspect-ratio: 1 / 1.121;
    object-fit: cover;
    border-radius: 10px;
}

.about-us-image-box-2-gold{
	width: 35%;
}

.about-us-image-2-gold{
	margin-left: -230px;
}

.about-us-image-2-gold figure{
	display: block;
	border-radius: 20px;
}

.about-us-image-2-gold figure img{
	width: 100%;
	aspect-ratio: 1 / 1.246;
	object-fit: cover;
    border-radius: 20px;
}

.about-us-counter-box-gold{
	background: var(--accent-color);
    border-radius: 20px;
    margin: 20px 0 0 10px;
    padding: 80px 20px 20px;
}

.about-us-counter-box-gold h2{
	font-size: 34px;
	color: var(--white-color);
}

.about-us-counter-box-gold p{
	font-size: 20px;
    font-weight: 500;
    color: var(--white-color);
    margin: 5px 0 0;
}

.about-us-body-gold{
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 30px;
}

.about-us-item-gold{
	width: calc(68% - 15px);
	background: var(--white-color);
    border-radius: 20px;
    padding: 30px;
}

.about-us-item-header-gold{
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 15px;
	margin-bottom: 20px;
}

.about-us-item-header-gold .icon-box{
    width: 50px;
    height: 50px;
    background: var(--accent-secondary-color);
    border-radius: 50%;
    display: flex;
    justify-content: center;
    align-items: center;
}

.about-us-item-header-gold .icon-box img{
    width: 100%;
    max-width: 24px;
}

.about-us-item-title-gold{
	width: calc(100% - 65px);
}

.about-us-item-title-gold h3{
	font-size: 20px;
}

.about-us-item-content-gold p{
	margin: 0;
}

.about-us-item-content-gold ul{
	list-style: none;
	border-top: 1px solid var(--divider-color);
    margin: 30px 0 0 0;
	padding: 30px 0 0 0;
}	

.about-us-item-content-gold ul li{
	position: relative;
    line-height: 1.5em;
    padding-left: 25px;
    margin-bottom: 15px;	
}

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

.about-us-item-content-gold ul li::before{
	content: '\f058';
    position: absolute;
    font-family: 'Font Awesome 7 Free';
    top: 0;
    left: 0;
    font-size: 18px;
    font-weight: 900;
    color: var(--accent-color);
}

.experience-circle-gold img{
	width: 100%;
    max-width: 130px;
    aspect-ratio: 1 / 1;
    object-fit: cover;
    border-radius: 0;
    animation: infiniterotate-gold 20s infinite linear;
}

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

.about-us-body-gold .experience-circle-gold{
	width: calc(32% - 15px);
	text-align: center;
}

.about-us-footer-gold{
	display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 20px 30px;
    border-top: 1px solid var(--divider-color);
    padding-top: 40px;
    margin-top: 40px;
}

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

.about-client-box-gold .satisfy-client-image.add-more{
	background-color: var(--accent-secondary-color);
}

.about-client-content-gold{
	max-width: 175px;
}

.about-client-content-gold p{
	margin: 0;
}

.our-services-gold{
	/*! background-image: url(../images/our-services-bg-image.png); */
    /*! background-position: bottom center; */
    background-size: auto;
	padding: 0px 0;
	background-color: #ffff;
}

.service-item-gold{
	position: relative;
    background-color: var(--dark-divider-color);
    backdrop-filter: blur(50px);
    -webkit-backdrop-filter: blur(50px);
    border-radius: 20px;
    min-height: 460px;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    gap: 30px;
    height: calc(100% - 30px);
    margin-bottom: 30px;
    padding: 40px;
    transition: all 0.5s ease-in-out;
}

.service-item-gold:hover{
	transform: translateY(-5px);
}

.service-item-header-gold .icon-box{
	position: relative;
    width: 50px;
    height: 50px;
    background: var(--accent-secondary-color);
    border-radius: 50%;
    display: flex;
    justify-content: center;
    align-items: center;
    overflow: hidden;
	margin-bottom: 30px;
}

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

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

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

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

.service-item-content-gold h2{
	color: var(--white-color);
	font-size: 20px;
}

.service-item-content-gold h2 a{
	color: inherit;
}

.service-item-content-gold p{
	color: var(--white-color);
	margin: 10px 0 0 0;
}

.service-item-btn-gold{
	border-top: 1px solid var(--dark-divider-color);
	padding-top: 30px;
}

.why-choose-us-gold{
	padding: 120px 0;
}

.why-choose-image-box-gold{
	display: flex;
	flex-wrap: wrap;
	align-items: end;
	margin-right: 15px;
}

.why-choose-image-box-1-gold{
	position: relative;
    width: 73%;
	padding-bottom: 50px;
}

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

.why-choose-image-gold figure img{
    width: 100%;
    object-fit: cover;
    border-radius: 20px;
}

.why-choose-image-box-1-gold .why-choose-image-gold figure img{
	aspect-ratio: 1 / 1.36;
}

.why-choose-image-box-gold .experience-circle-gold{
	position: absolute;
    top: 10px;
    right: 0;
    transform: translateX(50%);
	border: 6px solid var(--secondary-color);
	border-radius: 50%;
    z-index: 1;
}

.why-choose-image-box-2-gold{
	width: 27%;
	z-index: 1;
}

.why-choose-image-box-2-gold .why-choose-image-gold{
	margin-left: -220px;
}

.why-choose-image-box-2-gold .why-choose-image-gold figure{
	border: 6px solid #15999b8c;
}

.why-choose-image-box-2-gold .why-choose-image-gold figure img{
	aspect-ratio: 1 / 1.08;
	border-radius: 10px;
}

.why-choose-content-box-gold{
	background-color: var(--white-color);
	border-radius: 20px;
	padding: 40px;
}

.why-choose-body-content-gold{
	width: calc(51% - 15px);
	align-content: center;
}

.why-choose-item-gold{
	display: flex;
	flex-wrap: wrap;
	gap: 15px;
	margin-bottom: 30px;
}

.why-choose-item-gold:last-child{
	margin-bottom: 0;
}

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

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

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

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

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

.why-choose-item-content-gold h3{
	font-size: 20px;
}

.why-choose-item-content-gold p{
	margin: 10px 0 0 0;
}

.why-choose-body-gold{
	display: flex;
	flex-wrap: wrap;
	gap: 30px;
	border-top: 1px solid var(--divider-color);
	padding-top: 30px;
	margin-top: 30px;
}

.why-choose-skills-bar-gold .skill-progress{
	background-color: var(--bg-color);
}

.google-rating-box-gold{
	border-top: 1px solid var(--divider-color);
	margin-top: 30px;
	padding-top: 30px;
}

.google-rating-header-gold{
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 15px;
	margin-bottom: 20px;
}

.google-rating-header-gold .icon-box img{
	width: 100%;
	max-width: 40px;
}

.google-rating-info-gold{
	width: calc(100% - 55px);
}

.google-rating-info-gold h3{
	font-size: 26px;
	display: flex;
	flex-wrap: wrap;
	align-items: center;
}

.google-review-star-gold{
	display: flex;
	margin-left: 10px;
}

.google-review-star-gold i{
	font-size: 20px;
	color: var(--accent-secondary-color);
}

.google-rating-content-gold p{
	margin: 0;
}

.why-choose-body-image-gold{
	width: calc(49% - 15px);
}

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

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

.interactive-process-layout-gold{
	overflow: hidden;
}

.interactive-process-layout-gold .interactive-process-item-gold{
    position: relative;
	width: 25%;
	display: flex;
    flex-direction: column;
    justify-content: flex-end;
	border-right: 1px solid var(--dark-divider-color);
    -ms-transition: all .5s ease;
    -o-transition: all .5s ease;
    -moz-transition: all .5s ease;
    -webkit-transition: all .5s ease;
    transition: all .5s ease;
    overflow: hidden;
	z-index: 1;
}

.interactive-process-layout-gold .interactive-inner-process-gold{
    position: relative;
	height: 100%;
	padding: 585px 0 0;
	transition: all 0.4s ease-in-out;
    z-index: 3;
}

.interactive-process-layout-gold .interactive-process-item-gold:nth-child(4n + 4) .interactive-inner-process-gold{
	border-right: none;
}

.process-content-wap-gold{
	position: relative;
	-ms-transition: all .5s ease;
    -o-transition: all .5s ease;
    -moz-transition: all .5s ease;
    -webkit-transition: all .5s ease;
    transition: all .5s ease;
}

.interactive-process-item-wap-gold{
	background-color: var(--dark-divider-color);
	backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);	
	transform: translateY(65px);
	padding: 40px;
	transition: all 0.4s ease-in-out;
}

.interactive-process-layout-gold .interactive-inner-process-gold.activate .interactive-process-item-wap-gold,
.interactive-process-layout-gold .interactive-process-item-gold:hover .interactive-process-item-wap-gold{
	transform: translateY(0px);
}

.interactive-process-item-wap-gold .icon-box{
	position: relative;
	width: 50px;
	height: 50px;
	background: var(--accent-secondary-color);
	border-radius: 50%;
	display: flex;
	align-items: center;
	justify-content: center;
	margin-bottom: 30px;
	overflow: hidden;
}

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

.interactive-inner-process-gold.activate .interactive-process-item-wap-gold .icon-box::before{
	transform: scale(1);
}

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

.interactive-inner-process-gold.activate .interactive-process-item-wap-gold .icon-box img{
	filter: brightness(0) invert(0);
}

.interactive-process-item-content-wap-gold h3{
	font-size: 20px;
	color: var(--white-color);
	line-height: 1.4em
}

.interactive-process-item-content-wap-gold h3 a{
	color: inherit;
}

.interactive-process-item-btn-gold{
	opacity: 0;
	visibility: hidden;
	border-top: 1px solid var(--dark-divider-color);
	padding-top: 25px;
	margin-top: 25px;
	transition: all 0.4s ease-in-out;
}

.interactive-process-item-btn-gold .readmore-btn{
	color: var(--white-color);
}

.interactive-process-item-btn-gold .readmore-btn::before{
	filter: brightness(0) invert(1);
}

.interactive-process-layout-gold .interactive-inner-process-gold.activate .interactive-process-item-btn-gold,
.interactive-process-layout-gold .interactive-process-item-gold:hover .interactive-process-item-btn-gold{
	opacity: 1;
	visibility: visible;
}

.interactive-process-layout-gold .interactive-con{
    position: relative;
    padding-bottom: 0!important;
    z-index: 1;
}

.interactive-process-layout-gold .interactive-con-inner{
    position: relative;
    display: flex;
	flex-wrap: wrap;
    z-index: 2;
}

.interactive-process-layout-gold .interactive-con-inner:before{
    content: "";
    position: absolute;
    width: 100%;
    height: 100%;
    left: 0;
    right: 0;
    bottom: 0;
    background: linear-gradient(180deg, transparent 0%, var(--primary-color) 100%);
    z-index: 1;
}

.interactive-process-layout-gold .interactive-process-list-image-gold{
    position: absolute;
    width: 100%;
    height: 100%;
    left: 0;
    top: 0;
    z-index: 1;
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center;
    overflow: hidden;
}

.interactive-process-layout-gold .interactive-process-list-image-gold .interactive-process-image-gold{
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
    opacity: 0;
    z-index: -1;
    -ms-transition: all .7s ease;
    -o-transition: all .7s ease;
    -moz-transition: all .7s ease;
    -webkit-transition: all .7s ease;
    transition: all .7s ease
}

.interactive-process-layout-gold .interactive-process-list-image-gold .interactive-process-image-gold:first-child{
    z-index: 1
}

.interactive-process-layout-gold .interactive-process-list-image-gold .interactive-process-image-gold.show{
    opacity: 1;
    z-index: 2;
    -ms-transform: scale(1.05);
    -o-transform: scale(1.05);
    -moz-transform: scale(1.05);
    -webkit-transform: scale(1.05);
    transform: scale(1.05)
}

.our-features-gold{
	padding: 0 0 50px 0;
	background-color: #fff;
}

.our-features-gold .section-row .section-title.section-title-center{
	max-width: 855px;
}

.core-feature-title-image-gold img{
	width: 100px;
    height: 44px;
    border-radius: 100px;
}

.feature-item-gold{
	background: #ecf8fb;
    border-radius: 20px;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    gap: 30px;
    height: calc(100% - 30px);
    margin-bottom: 30px;
    padding: 40px;
	border: 1px solid #c7e4ea;
}

.feature-item-content-gold h3{
	font-size: 20px;
	line-height: 1.4em;
}

.feature-item-counter-content-gold h2{
	font-size: 48px;
}

.feature-item-counter-content-gold p{
	margin: 0px 0 0;
}

.feature-box-image-gold{
	border-radius: 20px;
    height: calc(100% - 30px);
    margin-bottom: 30px;
    overflow: hidden;
}

.feature-box-image-gold figure{
	display: block;
	height: 100%;
}

.feature-box-image-gold figure img{
	width: 100%;
    height: 100%;
    aspect-ratio: 1 / 1.116;
    object-fit: cover;
}

.feature-item-header-gold .icon-box{
	position: relative;
    width: 50px;
    height: 50px;
    background: var(--accent-secondary-color);
    border-radius: 50%;
    display: flex;
    justify-content: center;
    align-items: center;
    overflow: hidden;
    margin-bottom: 30px;
}

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

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

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

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

.feature-item-content-gold p{
	border-top: 1px solid var(--divider-color);
	padding-top: 20px;
	margin: 20px 0 0;
}

.feature-item-list-gold{
	border-top: 1px solid var(--divider-color);
	padding-top: 30px;
}

.feature-item-list-gold ul{
	list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-wrap: wrap;
    gap: 15px;
}

.feature-item-list-gold ul li{
	display: inline-block;
    border: 1px solid var(--divider-color);
	font-size: 14px;
	font-weight: 500;
    color: var(--primary-color);
    border-radius: 100px;
    line-height: normal;
    padding: 7px 15px;
    transition: all 0.4s ease-in-out;
}

.feature-footer-box-gold{
	margin-top: 30px;
}

.feature-benefit-list-gold ul{
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	gap: 15px 30px;
	list-style: none;
	padding: 0;
	margin: 0 auto;
}

.feature-benefit-list-gold ul li{
	position: relative;
	font-weight: 500;
	background: var(--white-color);
    color: var(--primary-color);
    padding: 12px 16px 12px 32px;
    border-radius: 100px;
	transition: all 0.4s ease-in-out;
}

.feature-benefit-list-gold ul li:hover{
	background: var(--primary-color);
	color: var(--white-color);
}

.feature-benefit-list-gold ul li::before{
	content: '';
    position: absolute;
    left: 16px;
    top: 50%;
    transform: translateY(-50%);
    background: var(--accent-secondary-color);
    border-radius: 50%;
    width: 6px;
    height: 6px;
}

.how-we-work-gold{
	padding: 120px 0;
}

.how-work-item-list-gold{
	display: flex;
	flex-wrap: wrap;
	gap: 30px;
}

.how-work-item-gold{
	width: calc(33.33% - 20px);
	transition: all 0.5s ease-in-out;
}

.how-work-item-gold:hover{
	transform: translateY(-5px);
}

.how-work-item-no-gold{
	position: relative;
    text-align: center;
    margin-bottom: 65px;
}

.how-work-item-no-gold h2{
	position: relative;
    font-size: 16px;
    line-height: normal;
    display: inline-block;
    border: 1px solid var(--divider-color);
    border-radius: 100px;
    padding: 8px 30px;
    z-index: 1;
    transition: all 0.4s ease-in-out;
}

.how-work-item-no-gold h2:before{
	content: '';
    position: absolute;
    left: 50%;
    bottom: 0;
    background: var(--divider-color);
    width: 1px;
    height: 100%;
    transform: translate(-50%, 100%);
}

.how-work-item-content-box-gold{
	position: relative;
    background: linear-gradient(270deg, var(--bg-color) 0%, var(--secondary-color) 50%, var(--bg-color) 100%);
	background-size: 200% auto;
    border-radius: 20px;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    gap: 25px;
    padding: 40px;
    min-height: 420px;
    transition: all 0.4s ease-in-out;
}

.how-work-item-gold:hover .how-work-item-content-box-gold{
    background-position: right center;
}

.how-work-item-content-box-gold:before{
	content: '';
    position: absolute;
	background-color: var(--accent-secondary-color);
	border: 18px solid var(--white-color);
	border-radius: 50%;
	height: 50px;
	width: 50px;
	top: 0;
	left: 50%;
	transform: translate(-50%, -50%);
	z-index: 1;
}

.how-work-item-header-gold .icon-box{
	position: relative;
	height: 50px;
	width: 50px;
	display: flex;
	align-items: center;
	justify-content: center;
	background-color: var(--accent-secondary-color);
	border-radius: 50%;
	margin-bottom: 30px;
	z-index: 1;
}

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

.how-work-item-content-box-gold:hover .icon-box::before{
	transform: scale(1);
}

.how-work-item-header-gold .icon-box img{	
	position: relative;
	width: 100%;
	max-width: 24px;
	z-index: 1;
}

.how-work-item-content-gold h2{
	font-size: 20px;
}

.how-work-item-content-gold p{
	margin: 10px 0 0;
}

.how-work-item-content-list-gold{
	border-top: 1px solid var(--divider-color);
	padding-top: 25px;
}

.how-work-item-content-list-gold ul{
	list-style: none;
    margin: 0;
    padding: 0;
}

.how-work-item-content-list-gold ul li{
	position: relative;
    line-height: 1.5em;
    padding-left: 25px;
    margin-bottom: 15px;
}

.how-work-item-content-list-gold ul li:last-child{
	margin-bottom: 0;
}

.how-work-item-content-list-gold ul li::before{
	content: '\f058';
    position: absolute;
    font-family: 'Font Awesome 7 Free';
    font-size: 18px;
    font-weight: 900;
    color: var(--accent-color);
    top: 0;
    left: 0;
}

.how-we-work-gold .section-footer-text{
	margin-top: 60px;
}

.our-benefits-gold{
	padding: 120px 0;
}

.benefit-content-gold{
	margin-right: 15px;
}

.benefit-image-gold figure{
	display: block;
	border-radius: 20px;
}

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

.benefit-body-gold{
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 20px;
	border-top: 1px solid var(--divider-color);
	margin-top: 40px;
	padding-top: 40px;
}

.benefit-body-gold h2{
	font-size: 48px;
	width: 140px;
}

.benefit-body-gold p{
	width: calc(100% - 160px);
	margin: 0;
}

.benefit-satisfaction-box-gold{
	position: relative;
	background-color: var(--white-color);
	border-radius: 20px;
	padding: 60px;
	overflow: hidden;
}

.benefit-satisfaction-box-gold:before{
	content: '';
	position: absolute;
	top: auto;
	right: 0;
	bottom: 0;
	left: 0;
	width: 100%;
	height: 300px;
	background: linear-gradient(180deg, transparent 0%, var(--white-color) 43.86%);
	border-radius: 20px;
	z-index: 1;
}

.benefit-satisfaction-body-gold{
	display: flex;
	flex-wrap: wrap;
	align-items: start;
}

.benefit-satisfaction-content-gold{
	width: 48%;
	display: flex;
	flex-direction: column;
	justify-content: space-between;
	min-height: 265px;
}

.benefit-satisfaction-title-gold h3{
	font-size: 20px;
}

.benefit-satisfaction-counter-gold h2{
	font-size: 52px;
}

.benefit-satisfaction-counter-gold p{
	margin: 10px 0 0;
}

.benefit-satisfaction-image-gold{
	width: 52%;
}

.benefit-satisfaction-image-gold figure{
	display: block;
	text-align: right;
	border-radius: 20px;
	margin: 0px -60px -60px 0px;
}

.benefit-satisfaction-image-gold img{
	width: 100%;
	max-width: 320px;
    aspect-ratio: 1 / 1.3;
    object-fit: cover;
    border-radius: 20px;
}

.benefit-scrolling-ticker-box-gold{
	position: relative;
	display: flex;
	flex-direction: column;
	gap: 40px;
	z-index: 1;
}

.benefit-scrolling-ticker-item-gold{
	--gap: 25px;
	position: relative;
	display: flex;
	overflow: hidden;
	user-select: none;
	gap: var(--gap);
	align-items: center;
	width: calc(100% + 120px);
	left: -60px;
	transition: all 0.4s ease-in-out;
}

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

@keyframes scroll{
	from{
		transform: translateX(0);
	}
	to{
		transform: translateX(calc(-100% - var(--gap)));
	}
}

.benefit-scrolling-ticker-item-gold.scroll-reverse .benefit-scrolling-ticker-content-gold{
	animation-direction: reverse;
}

.benefit-scrolling-ticker-content-gold span{
	position: relative;
	display: flex;
	align-items: center;
	font-size: 16px;
	font-weight: 500;
	line-height: 1.5em;
	text-transform: capitalize;
	color: var(--primary-color);
	border: 1px solid var(--divider-color);
	border-radius: 100px;
	padding: 8px 16px 8px 32px;
	transition: all 0.4s ease-in-out;
}

.benefit-scrolling-ticker-content-gold span:before{
	content: '';
	position: absolute;
	top: 50%;
	transform: translateY(-50%);
	left: 16px;
	background-color: var(--accent-secondary-color);
	border-radius: 50%;
	height: 6px;
	width: 6px;
}

.benefit-scrolling-ticker-content-gold span:hover{
	background-color: var(--primary-color);
	color: var(--white-color);
}

.benefit-scrolling-ticker-item-gold:hover .benefit-scrolling-ticker-content-gold{
	animation-play-state: paused;
}

.our-testimonials-gold{
	padding: 120px 0;	
}

.testimonial-slider-gold{
	height: 100%;
}

.testimonial-slider-gold .swiper{
	padding-bottom: 50px;
	height: 100%;
}

.testimonial-slider-gold .swiper-wrapper{
	height: 100%;
	cursor: none;
}

.testimonial-slider-gold .swiper-wrapper .swiper-slide .testimonial-item-gold{
	transform: scale(0.95);
	transition: all 0.6s ease-in-out;
}

.testimonial-slider-gold .swiper-wrapper .swiper-slide.swiper-slide-next .testimonial-item-gold{
	transform: scale(1);
}

.testimonial-item-gold{
	position: relative;
	background-color: var(--dark-divider-color);
	backdrop-filter: blur(15px);
    -webkit-backdrop-filter: blur(15px);
	border-radius: 20px;
	min-height: 490px;
	display: flex;
	flex-direction: column;
	justify-content: space-between;
	gap: 40px;
	padding: 40px;
	height: 100%;
}

.testimonial-quote-gold{
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
}

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

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

.testimonial-item-rating-gold i{
	color: var(--accent-secondary-color);
}

.testimonial-item-content-gold p{
	color: var(--white-color);
	font-family: var(--accent-font);
	font-size: 20px;
	font-weight: 500;
	margin: 0;
}

.testimonial-author-gold{
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 15px;
	border-top: 1px solid var(--dark-divider-color);
	padding-top: 40px;
}

.testimonial-author-image-gold figure{
	display: block;
	border-radius: 50%;
}

.testimonial-author-image-gold figure img{
	width: 100%;
	max-width: 50px;
	border-radius: 50%;
}

.testimonial-author-content-gold{
	width: calc(100% - 65px);
}

.testimonial-author-content-gold h2{
	color: var(--white-color);
	font-size: 20px;
}

.testimonial-author-content-gold p{
	color: var(--white-color);
	line-height: normal;
	margin: 5px 0 0;
}

.testimonial-slider-gold .testimonials-pagination-gold{
	position: absolute;
	bottom: 0px;
	text-align: center;
}

.testimonial-slider-gold .testimonials-pagination-gold .swiper-pagination-bullet{
    position: relative;
    height: 10px;
    width: 10px;
    background: #0000003d;
    margin: 0 4px;
	opacity: 1;
	transition: all 0.3s ease-in-out;
}

.testimonial-slider-gold .testimonials-pagination-gold .swiper-pagination-bullet-active{
	background: #15999b;
    width: 34px;
    border-radius: 100px;
}

.our-testimonials-gold .section-footer-text{
	margin-top: 40px;
}

.our-pricing-gold{
	padding: 120px 0;
}

.our-pricing-swich-gold{
	display: flex;
    align-items: center;
    justify-content: center;
    gap: 20px;
    margin-bottom: 60px;
	padding: 0;
}

.our-pricing-swich-gold .form-check-label{
	color: var(--primary-color);
	font-family: var(--accent-font);
	font-size: 20px;
	font-weight: 500;
	cursor: pointer;
}

.our-pricing-swich-gold.form-switch .form-check-input{
	width: 80px;
    height: 40px;
    --bs-form-check-bg: var(--accent-secondary-color);
	--bs-form-switch-bg: url('../images/pricing-swich-circle.svg');
	background-size: 28px auto;
	background-position: left 5px center;
	border-radius: 100px;
	border: none;
	outline: none;
	box-shadow: none;
	cursor: pointer;
    margin: 0;
	transition: all 0.3s ease-in-out;
}

.form-switch .form-check-input:checked{
	background-color: var(--accent-color);
	background-position: right 5px center;
}

.pricing-item-gold{
	background-color: var(--white-color);
	border-radius: 20px;
	height: calc(100% - 30px);
	margin-bottom: 30px;
	padding: 10px;
}

.pricing-item-header-gold{
	background: linear-gradient(270deg, var(--bg-color) 0%, var(--secondary-color) 100%);
	border-radius: 14px;
	padding: 30px;
}

.pricing-item-content-gold h2{
	display: inline-block;
	font-size: 16px;
	line-height: normal;
	border: 1px solid var(--divider-color);
	border-radius: 100px;
	padding: 6px 20px;
	margin-bottom: 15px;
}

.pricing-item-content-gold p{
	margin: 0;
}

.pricing-item-price-gold{
	border-top: 1px solid var(--divider-color);
	margin-top: 30px;
	padding-top: 30px;
}

.pricing-item-price-gold h2{
	font-size: 34px;
}

.pricing-item-price-gold sub{
	font-size: 16px;
	bottom: 0;
}

.pricing-item-body-gold{
	padding: 30px;
}

.pricing-item-list-gold h3{
	font-size: 16px;
	border-bottom: 1px solid var(--divider-color);
	margin-bottom: 20px;
	padding-bottom: 20px;
}


.pricing-item-list-gold ul{
	list-style: none;
	margin: 0;
	padding: 0;
}

.pricing-item-list-gold ul li{
	position: relative;
	line-height: 1.5em;
	padding-left: 25px;
	margin-bottom: 15px;
}

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

.pricing-item-list-gold ul li::before{
	content: '\f058';
    position: absolute;
    font-family: 'Font Awesome 7 Free';
    top: 0;
    left: 0;
    font-size: 18px;
    font-weight: 900;
    color: var(--accent-color);
}

.pricing-item-btn-gold{
	margin-top: 30px;
}

.pricing-benefit-list-gold{
	margin-top: 30px;
}

.pricing-benefit-list-gold ul{
	list-style: none;
	margin: 0;
	padding: 0;
	display: flex;
	flex-wrap: wrap;
    justify-content: center;
	gap: 20px 40px;
}

.pricing-benefit-list-gold ul li{
    display: inline-flex;
    align-items: center;
	color: var(--primary-color);
}

.pricing-benefit-list-gold ul li img{
	width: 100%;
	max-width: 20px;
	margin-right: 15px;
}

.our-faqs-gold{
	position: relative;
	background-image: url('../images/faqs-bg-image-gold.png');
	background-color: var(--primary-color);
	padding: 120px 0;
}

.our-faqs-gold:before{
	content: '';
	position: absolute;
	bottom: 0;
	left: 0;
	background: url('../images/faqs-bg-image-1-gold.png');
	background-repeat: no-repeat;
	background-position: center center;
	width: 720px;
	height: 370px;
	background-size: cover;
}

.our-faqs-gold .container{
	position: relative;
	z-index: 1;
}

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

.faq-accordion-gold{
	background: var(--dark-divider-color);
    backdrop-filter: blur(50px);
    -webkit-backdrop-filter: blur(50px);
    border-radius: 20px;
	padding: 20px;
}

.faq-accordion-gold .accordion-item{
    position: relative;
    background: var(--dark-divider-color);
    border-radius: 14px;
    margin-bottom: 25px;
    overflow: hidden;
}

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

.faq-accordion-gold .accordion-header .accordion-button{
	font-size: 18px;
    font-weight: 500;
    line-height: 1.333em;
    background: transparent;
    color: var(--white-color);
    padding: 24px 55px 24px 24px;
    transition: all 0.4s ease-in-out;
}

.faq-accordion-gold .accordion-item .accordion-button::after, 
.faq-accordion-gold .accordion-item .accordion-button.collapsed::after{
   	content: '\f078';
    font-family: 'FontAwesome';
    position: absolute;
    right: 24px;
    top: 50%;
    transform: translateY(-50%);
    font-size: 20px;
    color: var(--white-color);
	line-height: normal;
    transition: all 0.3s ease-in-out;
}

.faq-accordion-gold .accordion-button:not(.collapsed)::after{
	transform: translateY(-50%) rotate(180deg);
}

.faq-accordion-gold .accordion-item .accordion-body{  
	border-top: 1px solid var(--dark-divider-color);
    padding: 24px;
}

.faq-accordion-gold .accordion-item .accordion-body p{
	color: var(--white-color);
	margin-bottom: 15px;
}

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

.main-footer-gold{
	padding: 50px 0 0px 0;
	margin-bottom: 0;
	background-color: #eef7f7;
	background: linear-gradient(135deg, #15999b, #114c5c);
	border-top: solid 1px #15999b63;
}

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

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

.about-footer-content-gold p{
	color: #fff;
	margin-bottom: 0;
}

.footer-working-hour-box-gold{
	border-top: 1px solid var(--dark-divider-color);
	margin-top: 30px;
	padding-top: 30px;
}

.footer-working-hour-box-gold h2{
	color: var(--white-color);
	font-size: 20px;
	margin-bottom: 30px;
}

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

.footer-working-hour-box-gold ul li{
	color: var(--white-color);
	line-height: 1.4em;
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 10px;
	margin-bottom: 20px;
}

.footer-working-hour-box-gold ul li:last-child{
	margin-bottom: 0;
}

.footer-working-hour-box-gold ul li span{
	font-weight: 500;
}

.footer-links-box-gold{
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    gap: 30px;
    margin-left: 40px;
}

.footer-links-gold{
    max-width: 38%;
}

.footer-links-gold h2{
    font-size: 20px;
    color: #fff;
    margin-bottom: 30px;
}

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

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

.footer-links-gold ul li::marker{
	color: #114c5c;
	list-style: none;
}

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

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

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

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

.footer-links-gold.footer-contact-list-gold ul li{
	display: flex;
	align-items: center;
	gap: 5px 10px;
	border-bottom: 1px solid var(--dark-divider-color);
	margin-bottom: 20px;
	padding-bottom: 20px;
}

.footer-links-gold.footer-contact-list-gold ul li:last-child{
	margin-bottom: 0;
	padding-bottom: 0;
	border-bottom: none;
}

.footer-links-gold.footer-contact-list-gold ul li img{
	width: 100%;
	max-width: 24px;
}

.footer-copyright-gold{
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	align-items: center;
	gap: 15px;
	border-top: 1px solid var(--dark-divider-color);
	padding: 40px 0;
	margin-top: 50px;
}

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

.footer-copyright-text-gold p{
	color: #fff;
	margin-bottom: 0;
}

.footer-social-links-gold{
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 20px;
}

.footer-social-links-gold h2{
    font-size: 16px;
    color: #fff;
}

.footer-social-links-gold ul{
	display: flex;
    flex-wrap: wrap;
    gap: 10px 20px;
    margin: 0;
    padding: 0;
    list-style: none;
}

.footer-social-links-gold ul li a{
	display: flex;
	align-items: center;
	gap: 10px;
	font-weight: 500;
	color: #fff;
	backdrop-filter: blur(15px);
	-webkit-backdrop-filter: blur(15px);
	border-radius: 5px;
	padding: 10px 16px;
	transition: all 0.4s ease-in-out;
	background: linear-gradient(135deg, #0d6477, #18a7b8);
	color: #fff;
	box-shadow: 0 16px 32px rgba(24, 167, 184, 0.25);
}

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

.footer-social-links-gold ul li a i{
    font-size: 20px;
    line-height: normal;
    color: inherit;
}

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

	.interactive-process-layout-gold .interactive-inner-process-gold{
		padding: 485px 0 0;
	}
}

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

	.hero-box-gold{
		min-height: 750px;
	}

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

	.about-us-image-box-gold{
		max-width: 615px;
		margin: 0 auto 30px;
	}

	.service-item-gold{
		min-height: auto;
		padding: 30px;
	}

	.why-choose-image-box-gold{
		max-width: 615px;
		margin: 0 auto 30px;
	}

	.why-choose-body-content-gold{
		width: calc(60% - 15px);
	}

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

	.interactive-process-layout-gold .interactive-process-item-gold{
		border-bottom: 1px solid var(--dark-divider-color);
		width: 50%;
	}

	.interactive-process-layout-gold .interactive-inner-process-gold{
		padding: 200px 0 0;
		height: auto;
	}

	.interactive-process-item-wap-gold{
		padding: 30px;
	}

	.interactive-process-item-wap-gold .icon-box{
		margin-bottom: 20px;
	}

	.interactive-process-item-btn-gold{
		margin-top: 20px;
		padding-top: 20px;
	}

	.interactive-process-layout-gold .interactive-con-inner-gold:before{
		background-color: var(--primary-color);
		opacity: 50%;
	}

	.feature-box-image-gold figure img{
		aspect-ratio: 1 / 0.8;
	}

	.feature-footer-box-gold{
		margin-top: 10px;
	}

	.how-work-item-gold{
		width: calc(50% - 15px);
	}

	.how-work-item-content-box-gold::before{
		border-width: 15px;
		height: 40px;
		width: 40px;
	}

	.benefit-content-gold{
		margin: 0 0 30px;
	}

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

	.benefit-satisfaction-box-gold{
		padding: 30px;
	}

	.benefit-satisfaction-image-gold figure{
		margin: 0px -30px -30px 0px;
	}

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

	.testimonial-slider-gold .swiper-wrapper .swiper-slide .testimonial-item-gold{
		transform: scale(1);
	}

	.testimonial-item-gold{
		padding: 30px;
		gap: 30px;
		min-height: 390px;
	}

	.testimonial-author-gold{
		padding-top: 30px;
	}	

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

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

	.footer-links-box-gold{
		margin: 0;
	}

	.footer-copyright-gold{
		flex-direction: column-reverse;
		justify-content: center;
		margin-top: 30px;
		padding: 30px 0;
	}
}

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

	.hero-gold{
		margin: 0;
		border-radius: 0;
	}

	.hero-box-gold{
		padding: 150px 0 60px;
	}

	.hero-info-list-gold ul li::before{
		font-size: 16px;
	}

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

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

	.scrolling-content-gold span img{
		max-width: 25px;
	}

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

	.about-us-gold{
		padding: 60px 0;
	}

	.about-us-item-gold{
		padding: 20px;
	}

	.about-us-counter-box-gold h2{
		font-size: 30px;
	}

	.about-us-item-content-gold ul{
		margin: 20px 0 0 0;
    	padding: 20px 0 0 0;
	}

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

	.experience-circle-gold img{
		max-width: 110px;
	}

	.about-us-footer-gold{
		padding-top: 30px;
		margin-top: 30px;
	}

	.our-services-gold{
		padding: 60px 0;
		background-size: 100% auto;
	}

	.why-choose-us-gold{
		padding: 60px 0;
	}

	.why-choose-content-box-gold{
		padding: 30px;
	}

	.google-rating-info-gold h3{
		font-size: 22px;
	}

	.google-review-star-gold i{
		font-size: 18px;
	}

	.our-features-gold{
		padding: 60px 0;
	}

	.core-feature-title-image-gold img{
		width: 88px;
		height: 36px;
	}

	.feature-item-gold{
		padding: 30px;
	}

	.feature-item-counter-content-gold h2{
		font-size: 38px;
	}

	.feature-benefit-list-gold ul{
		gap: 15px;
	}

	.feature-benefit-list-gold ul li{
		font-size: 14px;
		padding: 10px 12px 10px 26px;
	}

	.feature-benefit-list-gold ul li::before{
		left: 12px;
	}

	.our-features-gold .section-footer-text{
		margin-top: 20px;
	}

	.how-we-work-gold{
		padding: 60px 0;
	}

	.how-work-item-no-gold{
		margin-bottom: 35px;
	}

	.how-work-item-no-gold h2{
		font-size: 14px;
		padding: 5px 20px;
	}

	.how-work-item-content-box-gold{
		min-height: auto;
		padding: 30px;
	}

	.how-work-item-content-list-gold ul li::before{
		font-size: 16px;
	}

	.how-we-work-gold .section-footer-text{
		margin-top: 40px;
	}

	.our-benefits-gold{
		padding: 60px 0;
	}

	.benefit-body-gold h2{
		font-size: 38px;
		width: 110px;
	}

	.benefit-body-gold p{
		width: calc(100% - 130px);
	}

	.benefit-satisfaction-counter-gold h2{
		font-size: 40px;
	}

	.benefit-scrolling-ticker-content-gold span{
		padding: 6px 12px 6px 28px;
	}

	.benefit-scrolling-ticker-content-gold span:before{
		left: 12px;
	}

	.our-testimonials-gold{
		padding: 60px 0;
	}

	.testimonial-slider-gold .swiper{
		padding-bottom: 0px;
	}

	.testimonial-item-content-gold p{
		font-size: 18px;
	}

	.our-testimonials-gold .section-footer-text{
		margin-top: 30px;
	}

	.our-pricing-gold{
		padding: 60px 0;
	}

	.our-pricing-swich-gold{
		margin-bottom: 30px;
	}

	.our-pricing-swich-gold.form-switch .form-check-input{
		width: 60px;
		height: 32px;
		background-size: 22px auto;
	}

	.pricing-item-header-gold,
	.pricing-item-body-gold{
		padding: 20px;
	}

	.pricing-item-price-gold{
    	margin-top: 20px;
		padding-top: 20px;
	}

	.pricing-item-price-gold h2{
		font-size: 30px;
	}

	.pricing-item-list-gold ul li{
		margin-bottom: 10px;
	}

	.pricing-item-list-gold ul li:before{
		font-size: 16px;
	}

	.pricing-benefit-list-gold{
		margin-top: 10px;
	}

	.pricing-benefit-list-gold ul{
		gap: 20px 30px;
	}

	.pricing-benefit-list-gold ul li img{
		max-width: 18px;
		margin-right: 10px;
	}

	.our-faqs-gold{
		padding: 60px 0;
	}

	.our-faqs-gold:before{
		right: 0;
		width: 620px;
	    height: 270px;
		margin: 0 auto;
	}

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

	.faq-accordion-gold .accordion-header .accordion-button{
		padding: 18px 44px 18px 20px;
	}
	
	.faq-accordion-gold .accordion-item .accordion-button::after,
	.faq-accordion-gold .accordion-item .accordion-button.collapsed::after{
		right: 20px;
		font-size: 18px;
	}

	.faq-accordion-gold .accordion-item .accordion-body{
		padding: 18px 20px;
	}

	.main-footer-gold{
		padding: 20px 0 0;
		margin: 0;
	}

	.about-footer-content-gold{
		margin-top: 15px;
	}

	.footer-working-hour-box-gold h2,
	.footer-links-gold h2{
		margin-bottom: 20px;
	}

	.footer-social-links-gold ul li a{
		gap: 5px;
		padding: 10px;
	}

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

	.footer-working-hour-box-gold ul li{
		margin-bottom: 15px;
	}

	.footer-links-gold.footer-contact-list-gold ul li{
		margin-bottom: 15px;
		padding-bottom: 15px;
	}
}

@media only screen and (max-width: 767px){
	
	.hero-item-list-gold,
	.hero-item-gold{
		width: 100%;
	}

	.hero-item-content-gold h2{
		font-size: 18px;
	}

	.hero-info-list-gold{
		width: 100%;
		padding: 30px 0 0;
		border-top: 1px solid var(--dark-divider-color);
		border-left: none;
	}

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

	.scrolling-ticker-box-gold{
		--gap: 15px;
	}

	.scrolling-content-gold span img{
		max-width: 20px;
	}
	
	.scrolling-content-gold span{
		font-size: 22px;
	}

	.about-us-image-box-1-gold{
		width: 60%;
		background-position: top 0px left 45px;
		background-size: 40% auto;
		padding: 50px 0 20px 0;
	}

	.about-us-image-box-2-gold{
		width: 40%;
	}

	.about-us-image-1-gold{
		padding: 3px 3px 0 0;
	}

	.about-us-image-2-gold{
		margin-left: -100px;
	}

	.about-us-counter-box-gold{
		border-radius: 14px;
		margin: 10px 0 0 7px;
		padding: 10px;
	}

	.about-us-counter-box-gold h2{
		font-size: 26px;
	}

	.about-us-counter-box-gold p{
		font-size: 16px;
	}

	.about-us-item-gold{
		width: 100%;
	}

	.about-us-item-title-gold h3{
		font-size: 18px;
	}

	.about-us-body-gold .experience-circle-gold{
		display: none;
	}

	.experience-circle-gold img{
		max-width: 90px;
	}

	.service-item-gold{
		padding: 20px;
		gap: 20px;
	}

	.service-item-header-gold .icon-box{
		margin-bottom: 20px;
	}
	
	.service-item-content-gold h2{
		font-size: 18px;
	}

	.service-item-btn-gold{
		padding-top: 20px;
	}

	.why-choose-image-box-1-gold{
		padding-bottom: 0;
	}

	.why-choose-image-box-gold .experience-circle-gold{
		top: 30px;
		border-width: 3px;
	}

	.why-choose-image-box-2-gold .why-choose-image-gold{
		margin-left: -130px;
	}

	.why-choose-content-box-gold{
		padding: 20px;
	}

	.why-choose-item-content-gold{
		width: 100%;
	}

	.why-choose-item-content-gold h3{
		font-size: 18px;
	}

	.why-choose-body-gold{
		padding-top: 20px;
    	margin-top: 20px;
	}

	.why-choose-body-content-gold{
		width: 100%;
	}

	.google-rating-box-gold{
		margin-top: 20px;
    	padding-top: 20px
	}

	.google-rating-header-gold{
		margin-bottom: 10px;
	}

	.google-rating-header-gold .icon-box img{
		max-width: 32px;
	}

	.google-rating-info-gold{
		width: calc(100% - 47px);
	}

	.google-rating-info-gold h3{
		font-size: 18px;
	}

	.google-review-star-gold i{
		font-size: 16px;
	}

	.why-choose-body-image-gold{
		width: 100%;
	}

	.why-choose-body-image-gold figure,
	.why-choose-body-image-gold figure img{
		height: auto;
	}

	.interactive-process-layout-gold .interactive-process-item-gold{
		width: 100%;
	}

	.interactive-process-layout-gold .interactive-inner-process-gold{
        padding: 100px 0 0;
    }

	.interactive-process-item-wap-gold{
		padding: 20px;
		transform: translateY(60px);
		background-color: transparent;
		backdrop-filter: initial;
		-webkit-backdrop-filter: initial;
	}

	.interactive-process-item-content-wap-gold h3{
		font-size: 18px;
	}

	.core-feature-title-image-gold img{
		width: 78px;
		height: 30px;
	}
	
	.feature-item-gold{
		padding: 20px;
		gap: 20px;
	}

	.feature-item-content-gold h3{
		font-size: 18px;
	}

	.feature-item-counter-content-gold h2{
		font-size: 26px;
	}

	.feature-item-header-gold .icon-box{
		margin-bottom: 20px;
	}

	.feature-item-content-gold h3{
		font-size: 18px;
	}

	.feature-item-list-gold{
		padding-top: 20px;
	}

	.feature-benefit-list-gold ul{
		gap: 10px;
	}

	.feature-benefit-list-gold ul li{
		padding: 8px 10px 8px 24px;
	}

	.feature-benefit-list-gold ul li::before{
		left: 10px;
	}

	.how-work-item-gold{
		width: 100%;
	}

	.how-work-item-content-box-gold{
		padding: 20px;
	}

	.how-work-item-header-gold .icon-box{
		margin-bottom: 20px;
	}

	.how-work-item-content-gold h2{
		font-size: 18px;
	}

	.benefit-body-gold{
		gap: 10px;
	}

	.benefit-body-gold h2{
        font-size: 28px;
        width: 100%;
    }

	.benefit-body-gold p{
        width: 100%;
    }

	.benefit-satisfaction-box-gold{
        padding: 20px;
    }

	.benefit-satisfaction-content-gold{
		min-height: auto;		
	}

	.benefit-satisfaction-content-gold,
	.benefit-satisfaction-image-gold{
		width: 100%;
	}

	.benefit-satisfaction-content-gold{
		gap: 20px;
		margin-bottom: 30px;
	}

	.benefit-satisfaction-title-gold h2{
		font-size: 18px;
	}

	.benefit-satisfaction-counter-gold h2{
        font-size: 28px;
    }

	.benefit-satisfaction-box-gold:before{
		background: linear-gradient(180deg, transparent 0%, var(--white-color) 61.86%);
	}

	.benefit-satisfaction-image-gold figure{
		max-width: 280px;
        margin: 0 auto;
        text-align: center;
    }

	.benefit-scrolling-ticker-item-gold{
		--gap: 15px;
	}

	.benefit-scrolling-ticker-content-gold span{
        padding: 4px 8px 4px 26px;
    }

	.benefit-scrolling-ticker-content-gold span:before{
        left: 10px;
    }

	.testimonial-item-gold{
        min-height: auto;
        gap: 20px;
        padding: 20px;
    }

	.testimonial-quote-gold img{
		max-width: 70px;
	}

	.testimonial-item-rating-gold{
		margin-bottom: 15px;
	}

	.testimonial-item-content-gold p{
        font-size: 16px;
    }

	.testimonial-author-gold{
        padding-top: 20px;
    }

	.testimonial-author-content-gold h2{
		font-size: 18px;
	}

	.our-pricing-swich-gold .form-check-label{
		font-size: 18px;
	}

	.pricing-item-content-gold h2{
		font-size: 14px;
		padding: 4px 15px;
	}

	.pricing-item-price-gold h2{
        font-size: 26px;
    }

	.pricing-item-price-gold sub{
		font-size: 14px;
	}

	.pricing-item-list-gold h3{
		margin-bottom: 15px;
		padding-bottom: 15px;
	}

	.pricing-benefit-list-gold{
		margin-top: 5px;
	}

	.pricing-benefit-list-gold ul{
		gap: 10px;
	}

	.pricing-benefit-list-gold ul li{
		font-size: 14px;
	}

	.pricing-benefit-list-gold ul li img{
		max-width: 16px;
		margin-right: 5px;
	}

	.our-faqs-gold:before{
        width: 450px;
        height: 100px;
    }

	.faq-accordion-gold{
		padding: 15px;
	}

	.faq-accordion-gold .accordion-header .accordion-button{
        padding: 12px 40px 12px 15px;
		font-size: 16px;
    }

	.faq-accordion-gold .accordion-item .accordion-body{
        padding: 12px 15px;
    }

	.faq-accordion-gold .accordion-item .accordion-button::after,
	.faq-accordion-gold .accordion-item .accordion-button.collapsed::after{
		font-size: 16px;
        right: 15px;
    }

	.footer-working-hour-box-gold h2,
	.footer-links-gold h2{
		font-size: 18px;
		margin-bottom: 15px;
	}

	.footer-links-gold{
		max-width: 100%;
	}

	.footer-working-hour-box-gold ul li{
        margin-bottom: 10px;
    }

	.footer-copyright-gold{
		padding: 15px 0;
	}

	.footer-social-links-gold ul{
		gap: 10px;
	}

	.footer-social-links-gold ul li a{
		font-size: 14px;
	}

	.footer-social-links-gold ul li a i{
		font-size: 18px;
	}
}

/************************************/
/***   36. Home - Version 3 css   ***/
/************************************/

.hero-silver{
    position: relative;
    align-content: end;
	background-image: url('../images/hero-bg-image-silver.jpg');
    border-radius: 20px;
	height: auto;
	min-height: 100vh;
    align-content: center;
    padding: 230px 0 120px;
    margin: 15px 15px 0 15px;
    overflow: hidden;
}

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

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

.hero-content-silver{
	margin-right: 4.688vw;
}

.hero-content-body-silver{
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 20px 40px;
}

.video-play-button-silver{
	position: relative;
	display: inline-flex;
	align-items: center;
	gap: 20px;
	z-index: 1;
}

.video-play-button-silver a{
	position: relative;
	height: 50px;
	width: 50px;
	background: var(--accent-secondary-color);
	border-radius: 50%;
	color: var(--white-color);
	display: flex;
	justify-content: center;
	align-items: center;
	cursor: none;
	transition: all 0.3s ease-in-out;
}

.video-play-button-silver a:hover{
	background: var(--white-color);
	color: var(--primary-color);
}


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

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

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

.video-play-button-silver a i{
    font-size: 20px;
    color: inherit;
    margin-left: 2px;
}

.video-play-button-silver p{
	font-family: var(--accent-font);
	font-weight: 500;
    color: var(--white-color);
    margin: 0;
}

.hero-content-footer-silver{
	border-top: 1px solid var(--dark-divider-color);
	margin-top: 40px;
	padding-top: 40px;
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 30px;
}

.hero-footer-item-list-silver{
	width: calc(50% - 15px);
}

.hero-footer-item-silver{
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 15px;
	margin-bottom: 20px;
}

.hero-footer-item-silver:last-child{
	margin-bottom: 0;
}

.hero-footer-item-silver .icon-box{
	position: relative;
	width: 50px;
	height: 50px;
	background: var(--accent-secondary-color);
	border-radius: 50%;
	display: flex;
	justify-content: center;
	align-items: center;
	overflow: hidden;
}

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

.hero-footer-item-silver:hover .icon-box::before{
    transform: scale(1);
}

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

.hero-footer-item-silver:hover .icon-box img{
	filter: brightness(0) invert(0);
}

.hero-footer-item-content-silver{
	width: calc(100% - 65px);
}

.hero-footer-item-content-silver h2{
	color: var(--white-color);
	font-size: 20px;
}

.google-review-box-silver{
	width: calc(50% - 15px);
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 15px;
	border-left: 1px solid var(--dark-divider-color);
	padding-left: 30px;
}

.google-review-box-silver .icon-box img{
	width: 100%;
	max-width: 50px;
}

.google-review-box-body-silver{
	width: calc(100% - 65px);
}

.google-review-box-header-silver{
	width: calc(100% - 55px);
	display: flex;
	align-items: center;
}

.google-review-box-header-silver h2{
	color: var(--white-color);
	font-size: 26px;
	min-width: 70px;
	line-height: 1em;
}

.google-rating-star-silver{
	display: flex;
	line-height: normal;
}

.google-rating-star-silver i{
	font-size: 18px;
	color: var(--accent-secondary-color);
}

.google-review-box-content-silver p{
	color: var(--white-color);
	margin: 5px 0 0;
}

.hero-experience-circle-silver{
	text-align: center;
}

.hero-experience-circle-silver img{
	width: 100%;
	max-width: 130px;
	background-color: var(--divider-color);
	backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
	border: 1px solid var(--dark-divider-color);
	border-radius: 50%;
	animation: infiniterotate 20s infinite linear;
}

.about-us-silver{
	padding: 120px 0;
}

.about-us-item-silver{
	background-color: var(--accent-color);
	border-radius: 20px;
	display: flex;
	flex-direction: column;
	justify-content: space-between;
	gap: 30px;
	padding: 30px;
	min-height: 445px;
	height: calc(100% - 30px);
	margin-bottom: 30px;
}

.about-us-item-silver.box-1{
	background-image: url('../images/about-us-item-bg-silver.png');
	background-position: bottom right;
	background-repeat: no-repeat;
	background-size: auto;
}

.about-us-header-silver{
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	gap: 20px;
}

.about-us-header-title-silver p{
	font-size: 14px;
	font-weight: 500;
	line-height: normal;
	color: var(--white-color);
	background-color: var(--dark-divider-color);
	backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
	border-radius: 100px;
	padding: 8px 20px;
	margin: 0;
}

.about-us-body-content-silver h3{
	font-size: 20px;
	line-height: 1.6em;
	color: var(--white-color);
}

.about-us-body-list-silver{
	border-top: 1px solid var(--dark-divider-color);
	margin-top: 30px;
	padding-top: 30px;
}

.about-us-body-list-silver ul{
	list-style: none;
	margin: 0;
	padding: 0;
}

.about-us-body-list-silver li{
	position: relative;
	color: var(--white-color);
	line-height: 1.5em;
	padding-left: 25px;
	margin-bottom: 15px;
}

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

.about-us-body-list-silver ul li::before{
	content: '\f058';
    position: absolute;
    font-family: 'Font Awesome 7 Free';
    top: 0;
    left: 0;
    font-size: 18px;
    font-weight: 900;
    color: var(--accent-secondary-color);
}

.about-us-image-silver{
	height: calc(100% - 30px);
	margin-bottom: 30px;
}

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

.about-us-image-silver img{
	width: 100%;
	height: 100%;
	aspect-ratio: 1 / 1.1;
	object-fit: cover;
	border-radius: 20px;
}

.about-us-item-silver.box-2{
	background-color: var(--white-color);
}

.about-counter-item-silver{
	width: 100%;
	display: flex;
	flex-wrap: wrap;
	gap: 15px;
}

.about-counter-item-silver .icon-box{
	position: relative;
	width: 50px;
	height: 50px;
	background: var(--accent-secondary-color);
	border-radius: 50%;
	display: flex;
	justify-content: center;
	align-items: center;
	overflow: hidden;
}

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

.about-us-item-silver:hover .about-counter-item-silver .icon-box::before{
    transform: scale(1);
}

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

.about-counter-item-content-silver{
	width: calc(100% - 65px);
}

.about-counter-item-content-silver h2{
	font-size: 48px;
	line-height: 1em;
}

.about-counter-item-content-silver p{
	margin: 10px 0 0;
}

.about-us-header-content-silver{
	border-top: 1px solid var(--divider-color);
	padding-top: 20px;
}

.about-us-header-content-silver p{
	margin: 0;
}

.about-us-body-silver .skill-progress{
	background-color: var(--divider-color);
}

.about-us-footer-silver{
	margin-top: 30px;
}

.about-us-footer-list-silver ul{
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	gap: 20px;
	max-width: 900px;
	list-style: none;
	padding: 0;
	margin: 0 auto;
}

.about-us-footer-list-silver ul li{
	position: relative;
	background: transparent;
    background-color: var(--white-color);
    font-size: 16px;
    color: var(--primary-color);
    padding: 13px 20px 13px 36px;
    border-radius: 100px;
	transition: all 0.4s ease-in-out;
}

.about-us-footer-list-silver ul li::before{
	content: '';
    position: absolute;
    left: 16px;
    top: 50%;
    transform: translateY(-50%);
    background: var(--accent-secondary-color);
    border-radius: 50%;
    width: 6px;
    height: 6px;
}

.about-us-footer-list-silver ul li:hover{
	background: var(--primary-color);
	color: var(--white-color);
}

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

.our-services-silver{
	padding: 120px 0;
}

.service-item-silver{
	position: relative;
	min-height: 480px;
	align-content: end;
	border-radius: 20px;
	padding: 10px;
	height: calc(100% - 30px);
	margin-bottom: 30px;
	overflow: hidden;
}

.service-item-image-silver{
	position: absolute;
	top: 0;
	bottom: 0;
	right: 0;
	left: 0;
	width: 100%;
	height: 100%;
}

.service-item-image-silver figure,
.service-item-image-silver figure a{
	display: block;
	height: 100%;
	cursor: none;
}

.service-item-image-silver img{
	width: 100%;
	height: 100%;
	object-fit: cover;
	transition: all 0.6s ease-in-out;
}

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

.service-item-body-silver{
	position: relative;
	background: var(--divider-color);
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
	border-radius: 20px;
	padding: 30px;
	z-index: 1;
}

.service-item-content-silver h2{
	color: var(--white-color);
	font-size: 20px;
}

.service-item-content-silver h2 a{
	color: inherit;
}

.service-item-content-silver p{
	color: var(--white-color);
	margin: 10px 0 0;
}

.service-item-btn-silver{
	height: 0;
	border-top: 1px solid var(--dark-divider-color);
    opacity: 0;
    visibility: hidden;
    transition: all 0.4s ease-in-out;
}

.service-item-silver:hover .service-item-btn-silver{
	height: 37px;
	margin-top: 20px;
	padding-top: 20px;
    opacity: 1;
    visibility: visible;
}

.why-choose-us-silver{
	padding: 120px 0;
}

.why-choose-image-box-silver{
	position: relative;
	display: flex;
	flex-wrap: wrap;
	align-items: end;
}

.why-choose-image-box-1-silver{
	width: 58%;
	padding-left: 80px;
	padding-bottom: 120px;
}

.why-choose-author-box-silver{
	position: absolute;
	max-width: 280px;
	top: 70px;
	left: 0;
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 15px;
	background-color: var(--white-color);
	border-radius: 20px;
	padding: 30px;
	animation: Movestylesilver 2s infinite alternate linear;
	z-index: 1;
}

@keyframes Movestylesilver{
	50%{
		transform: translateX(20px);
	}
}

.why-choose-author-image-silver figure{
	display: block;
	border-radius: 50%;
}

.why-choose-author-image-silver img{
	width: 100%;
	max-width: 50px;
	border-radius: 50%;
	aspect-ratio: 1 / 1;
	object-fit: cover;
}

.why-choose-author-content-silver{
	width: calc(100% - 65px);
}

.why-choose-author-content-silver h2{
	font-size: 20px;
}

.why-choose-author-content-silver p{
	margin: 5px 0 0;
}

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

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

.why-choose-expert-box-silver{
	width: 42%;
	position: relative;
	background-color: var(--accent-color);
	border: 6px solid var(--bg-color);
	border-radius: 20px;
	padding: 30px 30px 0;
	overflow: hidden;
}

.why-choose-expert-box-silver:before{
	content: '';
	position: absolute;
	right: 0;
	bottom: -100px;
	left: -30px;
	height: 300px;
	width: calc(100% + 60px);
	background-color: var(--dark-divider-color);
	border-radius: 50%;
}

.why-choose-expert-content-silver{
	text-align: center;
	margin-bottom: 20px;
}

.why-choose-expert-content-silver h2{
	color: var(--white-color);
	font-size: 30px;
}

.why-choose-expert-content-silver p{
	color: var(--white-color);
	margin: 5px 0 0;
}

.why-choose-expert-image-silver{
	position: relative;
	z-index: 1;
}

.why-choose-expert-image-silver figure{
	display: block;
	border-radius: 14px 14px 0 0;
}

.why-choose-expert-image-silver img{
	width: 100%;
    aspect-ratio: 1 / 1.31;
    object-fit: cover;
    border-radius: 14px 14px 0 0;
}

.why-choose-content-silver{
	margin-left: 15px;
}

.why-choose-items-list-silver{
	display: flex;
	flex-wrap: wrap;
	gap: 30px;
}

.why-choose-item-silver{
	width: calc(50% - 15px);
	display: flex;
	align-items: center;
	gap: 15px;
}

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

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

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

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

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

.why-choose-item-content-silver h3{
	font-size: 20px;
	line-height: 1.4em;
}

.why-choose-body-list-silver{
	border-top: 1px solid var(--divider-color);
	margin-top: 40px;
	padding-top: 40px;
}

.why-choose-body-list-silver ul{
	list-style: none;
	margin: 0;
	padding: 0;
}

.why-choose-body-list-silver ul li{
	position: relative;
	line-height: 1.5em;
	padding-left: 25px;
	margin-bottom: 15px;
}

.why-choose-body-list-silver ul li:last-child{
	margin-bottom: 0;
}

.why-choose-body-list-silver ul li::before{
	content: '\f058';
    position: absolute;
    font-family: 'Font Awesome 7 Free';
    top: 0;
    left: 0;
    font-size: 18px;
    font-weight: 900;
    color: var(--accent-secondary-color);
}

.why-chooose-btn-silver{
	margin-top: 40px;
}

.our-benefit-silver{
	padding: 120px 0;
}

.benefit-image-box-silver{
	position: relative;
	background-image: url('../images/benefit-image-box-bg-silver.png');
	background-repeat: no-repeat;
	background-position: center center;
	background-size: 100% auto;
}

.benefit-image-box-silver:before{
	content: '';
	position: absolute;
	right: 0;
	bottom: 0;
	left: 0;
	background: linear-gradient(180deg, transparent 0%, var(--accent-color) 88.75%);
	height: 180px;
	width: 100%;
}

.benefit-image-silver{
	text-align: center;
}

.benefit-image-silver figure{
	display: block;
	max-width: 370px; 
	margin: 0 auto;
	border-radius: 20px;
}

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

.benefit-satisfaction-box-silver{
	position: absolute;
	bottom: 70px;
	left: 0;
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 15px;
	background-color: var(--white-color);
	border-radius: 20px;
	padding: 20px;
	animation: benefitboxmove 3s infinite linear alternate;

}

@keyframes benefitboxmove{
	50%{
		transform: translateX(20px);
	}
}

.benefit-satisfaction-box-silver .icon-box{
	position: relative;
    width: 50px;
    height: 50px;
    background: var(--accent-secondary-color);
    border-radius: 50%;
    display: flex;
    justify-content: center;
    align-items: center;
    overflow: hidden;
}

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

.benefit-satisfaction-box-silver:hover .icon-box::before{
	transform: scale(1);
}

.benefit-satisfaction-box-silver .icon-box img{
	position: relative;
    width: 100%;
    max-width: 24px;
	z-index: 1;
}

.benefit-satisfaction-content-silver{
	width: calc(100% - 65px);
}

.benefit-satisfaction-content-silver h2{
	font-size: 40px;
	line-height: 1em;
}

.benefit-satisfaction-content-silver p{
	margin: 5px 0 0;
}

.benefit-content-silver{
	margin-left: 15px;
}

.benefit-item-list-silver{
	background-color: var(--dark-divider-color);
	backdrop-filter: blur(30px);
    -webkit-backdrop-filter: blur(30px);
	border-radius: 20px;
	padding: 40px;
}

.benefit-item-silver{
	display: flex;
	flex-wrap: wrap;
	gap: 15px;
	border-bottom: 1px solid var(--dark-divider-color);
	margin-bottom: 30px;
	padding-bottom: 30px;
}

.benefit-item-silver:last-child{
	margin-bottom: 0;
	padding-bottom: 0;
	border-bottom: none;
}

.benefit-item-silver .icon-box{
	position: relative;
    width: 50px;
    height: 50px;
    background: var(--accent-secondary-color);
    border-radius: 50%;
    display: flex;
    justify-content: center;
    align-items: center;
    overflow: hidden;
}

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

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

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

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

.benefit-item-content-silver{
	width: calc(100% - 65px);
}

.benefit-item-content-silver h2{
	font-size: 20px;
	line-height: 1.4em;
	color: var(--white-color);
}

.benefit-item-content-silver p{
	color: var(--white-color);
	margin: 10px 0 0;
}

.benefit-btn-silver{
	margin-top: 40px;
}

.our-core-features-silver{
	padding: 120px 0;
}

.core-features-image-box-silver{
	display: flex;
    flex-wrap: wrap;
    align-items: end;
    margin-right: 15px;
}

.core-features-image-box-1-silver{
	width: 35%;
	padding-bottom: 160px;
}

.core-features-image-silver{
    position: relative;
    z-index: 0;
}

.core-features-image-silver figure{
	border-radius: 20px;
    overflow: hidden;
}

.core-features-image-silver figure img{
	width: 100%;
    object-fit: cover;
    border-radius: 20px;
}

.core-features-image-box-1-silver .core-features-image-silver{
	position: relative;
	margin-right: -260px;
	z-index: 1;
}

.core-features-image-box-1-silver .core-features-image-silver figure img{
    aspect-ratio: 1 / 1.32;
}

.core-features-image-box-2-silver{
	position: relative;
	width: 65%;
	text-align: right;
	z-index: 2;
}

.core-features-image-box-2-silver .core-features-image-silver figure{
	border: 6px solid var(--secondary-color);
}

.core-features-image-box-2-silver .core-features-image-silver figure img{
	aspect-ratio: 1 / 1.272;
	border-radius: 14px;
}

.experience-circle-silver{
	position: relative;
	display: inline-block;
    border-radius: 50%;
    border: 6px solid var(--secondary-color);
	text-align: right;
	margin-bottom: -71px;
	margin-right: 60px;
	z-index: 2;
}

.experience-circle-silver img{
	width: 100%;
	max-width: 130px;
	aspect-ratio: 1 / 1;
	object-fit: cover;
    border-radius: 50%;
    animation: infiniterotate 20s infinite linear;
}

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

.core-features-item-list-silver{
	display: flex;
	flex-wrap: wrap;
	gap: 30px;
}

.core-features-item-silver{
	width: calc(50% - 15px);
	background-color: var(--white-color);
	border-radius: 20px;
	min-height: 280px;
	display: flex;
	flex-direction: column;
	justify-content: space-between;
	gap: 30px;
	padding: 30px;
}

.core-features-item-silver .icon-box{
	position: relative;
    width: 50px;
    height: 50px;
    background: var(--accent-secondary-color);
    border-radius: 50%;
    display: flex;
    justify-content: center;
    align-items: center;
    overflow: hidden;
}

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

.core-features-item-silver:hover .icon-box::before{
	transform: scale(1);
}

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

.core-features-item-content-silver h2{
	font-size: 20px;
}

.core-features-item-content-silver p{
	border-top: 1px solid var(--divider-color);
	padding-top: 20px;
	margin: 20px 0 0;
}

.core-features-skill-list-silver{
	border-top: 1px solid var(--divider-color);
	margin-top: 30px;
	padding-top: 30px;
}

.core-features-btn-silver{
	margin-top: 40px;
}

.our-team-silver{
	padding: 120px 0;
}

.team-item-silver{
    position: relative;
    border-radius: 20px;
	align-content: end;
	min-height: 480px;
	padding: 40px;
    height: calc(100% - 30px);
    margin-bottom: 30px;
    overflow: hidden;
}

.team-item-image-silver{
	position: absolute;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	height: 100%;
	width: 100%;
}

.team-item-image-silver figure,
.team-item-image-silver a{
	position: relative;
    display: block;
	height: 100%;
    cursor: none;
}

.team-item-image-silver figure:before{
	content: '';
	position: absolute;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	height: 100%;
	width: 100%;
	background: linear-gradient(180deg, transparent 50%, rgba(34, 34, 34, 0.90) 90%);
	z-index: 1;
}

.team-item-image-silver img{
    width: 100%;
	height: 100%;
    object-fit: cover;
	transition: all 0.6s ease-in-out;
}

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

.team-item-body-silver{
	position: relative;
    transform: translateY(60%);
	text-align: center;
    transition: all 0.4s ease-in-out;
    z-index: 2;
}

.team-item-silver:hover .team-item-body-silver{
	transform: translateY(0%);
}

.team-item-content-silver h2{
    font-size: 20px;
    color: var(--white-color);
}

.team-item-content-silver h2 a{
    color: inherit;
}

.team-item-content-silver p{
    color: var(--white-color);
	margin: 10px 0 0;
}

.team-social-list-silver{
	margin-top: 30px;
	padding-top: 30px;
	border-top: 1px solid var(--dark-divider-color);
    opacity: 0;
    visibility: hidden;
    transition: all 0.4s ease-in-out;
}

.team-item-silver:hover .team-social-list-silver{
	opacity: 1;
	visibility: visible;
}

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

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

.team-social-list-silver ul li a:hover{
    background: var(--accent-secondary-color);
}

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

.our-pricing-silver{
	padding: 120px 0;
}

.pricing-item-silver{
	background-color: var(--white-color);
	border-radius: 20px;
	height: calc(100% - 30px);
	margin-bottom: 30px;
	padding: 10px;
}

.pricing-item-header-silver{
	padding: 30px;
}

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

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

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

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

.pricing-item-content-silver .pricing-item-title-silver{
    display: block;
    font-size: 20px;
    font-weight: 500;
    line-height: 1.2em;
    color: var(--primary-color);
	border-bottom: 1px solid var(--divider-color);
	margin-bottom: 20px;
	padding-bottom: 20px;
}

.pricing-item-content-silver p{
	margin-bottom: 30px;
}

.pricing-item-content-silver h2{
	font-size: 34px;
}

.pricing-item-content-silver h2 sub{
    font-size: 16px;
    bottom: 0;
}

.pricing-item-body-silver{
	background: linear-gradient(270deg, var(--bg-color) 0%, var(--secondary-color) 100%);
	border-radius: 14px;
	padding: 30px;
}

.pricing-item-list-silver h3{
	font-size: 16px;
}

.pricing-item-list-silver ul{
	list-style: none;
	border-top: 1px solid var(--divider-color);
	margin: 20px 0 0;
	padding: 20px 0 0;
}

.pricing-item-list-silver ul li{
	position: relative;
	color: var(--primary-color);
	line-height: 1.5em;
	padding-left: 25px;
	margin-bottom: 15px;
}

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

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

.pricing-item-btn-silver{
	margin-top: 30px;
}

.pricing-benefit-list-silver{
	margin-top: 30px;
}

.pricing-benefit-list-silver ul{
	display: flex;
	flex-wrap: wrap;
    justify-content: center;
	list-style: none;
	margin: 0;
	padding: 0;
	gap: 20px 40px;
}

.pricing-benefit-list-silver ul li{
    display: inline-flex;
    align-items: center;
	color: var(--primary-color);
}

.pricing-benefit-list-silver ul li img{
	width: 100%;
	max-width: 20px;
	margin-right: 10px;
}

.how-it-work-silver{
	padding: 120px 0;
}

.how-work-item-list-silver{
	display: flex;
	flex-wrap: wrap;
	gap: 30px;
}

.how-work-item-silver{
	width: calc(33.33% - 20px);
	text-align: center;
}

.how-work-item-no-silver{
	position: relative;
	margin-bottom: 176px;
}

.how-work-item-no-silver::before{
	content: '';
	position: absolute;
	top: 50%;
	left: 0;
	width: calc(100% + 30px);
	height: 1px;
	transform: translateY(-50%);
	background: var(--dark-divider-color);
}

.how-work-item-silver:nth-child(3n + 3) .how-work-item-no-silver::before,
.how-work-item-silver:last-child .how-work-item-no-silver::before{
	width: 100%;
}

.how-work-item-no-silver::after{
	content: '';
    position: absolute;
    bottom: -20px;
    left: 50%;
    transform: translate(-50%, 100%);
    background: url('../images/how-work-item-arrow-silver.svg') no-repeat;
	background-position: center center;
    background-size: cover;
    width: 12px;
    height: 52px;
	transition: all 0.3s ease-in-out;
}

.how-work-item-silver:hover .how-work-item-no-silver::after{
	transform: translate(-50%, 110%);
}

.how-work-item-no-silver span{
	display: inline-block;
	color: var(--white-color);
	font-weight: 500;
	line-height: 1.25em;
	background: var(--dark-divider-color);
	backdrop-filter: blur(20px);
	-webkit-backdrop-filter: blur(20px);
	border-radius: 100px;
	padding: 10px 30px;
	transition: all 0.4s ease-in-out;
}

.how-work-item-silver:hover .how-work-item-no-silver span{
	background: var(--white-color);
	color: var(--primary-color);
}

.how-work-item-content-box-silver{
	position: relative;
	background: var(--dark-divider-color);
	backdrop-filter: blur(20px);
	border-radius: 20px;
	padding: 0 40px 40px;
	transition: all 0.4s ease-in-out;
}

.how-work-item-silver:hover .how-work-item-content-box-silver{
	background: var(--accent-secondary-color);
}

.how-work-item-image-silver figure{
	display: inline-block;
	max-width: 172px;
	border: 6px solid var(--accent-color);
	border-radius: 50%;
	margin: -86px auto 0;
}

.how-work-item-image-silver img{
	width: 100%;
	aspect-ratio: 1 / 1;
	object-fit: cover;
	border-radius: 50%;
}

.how-work-item-content-silver{
	margin-top: 30px;
}

.how-work-item-content-silver h3{
	font-size: 20px;
	color: var(--white-color);
	border-bottom: 1px solid var(--dark-divider-color);
	margin-bottom: 15px;
	padding-bottom: 15px;
}

.how-work-item-content-silver p{
	color: var(--white-color);
	margin-bottom: 10px;
}

.how-work-item-content-silver p:last-child{
	margin: 0;
}

.our-testimonials-silver{
	padding: 120px 0;
}

.testimonial-slider-silver{
	height: 100%;
}

.testimonial-slider-silver .swiper{
	padding-bottom: 60px;
	height: 100%;
}

.testimonial-slider-silver .swiper-wrapper{
	height: 100%;
	cursor: none;
}

.testimonial-item-silver{
	background: var(--white-color) url('../images/testimonial-quote-silver.svg') no-repeat;
	background-position: center center;
	background-size: 80px auto;
	min-height: 480px;
	border-radius: 20px;
	height: 100%;
	display: flex;
	flex-direction: column;
	justify-content: space-between;
	gap: 40px;
	padding: 40px;
}

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

.testimonial-item-content-silver p{
	font-size: 20px;
	font-weight: 500;
	color: var(--primary-color);
}

.testimonial-item-content-silver p:last-child{
	margin-bottom: 0;
}

.testimonial-author-box-silver{
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 15px;
	border-top: 1px solid var(--divider-color);
	margin-top: 40px;
	padding-top: 40px;
}

.testimonial-author-image-silver figure{
	display: block;
	border-radius: 50%;
}

.testimonial-author-image-silver img{
	width: 100%;
	max-width: 50px;
	object-fit: cover;
	border-radius: 50%;
}

.testimonial-author-content-silver{
	width: calc(100% - 65px);
}

.testimonial-author-content-silver h2{
	font-size: 20px;
}

.testimonial-author-content-silver p{
	line-height: normal;
	margin: 5px 0 0;
}

.testimonial-slider-silver .testimonials-pagination-silver{
	position: absolute;
	bottom: 0px;
	display: flex;
	text-align: center;
}

.testimonial-slider-silver .testimonials-pagination-silver .swiper-pagination-bullet{
	position: relative;
    height: 2px;
    width: 100%;
    background: var(--divider-color);
	border-radius: 0;
	opacity: 1;
    margin: 0;
	transition: all 0.3s ease-in-out;
}

.testimonial-slider-silver .testimonials-pagination-silver .swiper-pagination-bullet:before{
	content: '';
    display: block;
    position: absolute;
    top: 0px;
	left: auto;
	right: 0;
    background: var(--accent-secondary-color);
	border-radius: 0;
	width: 0;
	height: 4px;
	transition: all 0.4s ease-in-out;
}

.testimonial-slider-silver .testimonials-pagination-silver .swiper-pagination-bullet.swiper-pagination-bullet-active:before{
	width: 100%;
	right: auto;
	left: 0;
}

.testimonial-cta-box-silver{
	background: var(--white-color);
	border-radius: 20px;
	display: flex;
	flex-direction: column;
	gap: 10px;
	height: calc(100% - 60px);
	margin-bottom: 60px;
	padding: 10px;
}

.testimonial-cta-image-silver{
	height: 100%;
}

.testimonial-cta-image-silver figure{
	display: block;
	height: 100%;
	border-radius: 14px;
}

.testimonial-cta-image-silver img{
	width: 100%;
	height: 100%;
	aspect-ratio: 1 / 0.67;
	object-fit: cover;
	border-radius: 14px;
}

.testimonial-cta-client-box-silver{
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 20px;
	padding: 20px;
}

.testimonial-cta-client-box-silver .satisfy-client-images{
	width: calc(52% - 10px);
}

.testimonial-cta-client-box-silver .satisfy-client-image figure img{
	max-width: 50px;
}

.testimonial-cta-client-content-silver{
	width: calc(48% - 10px);
	border-left: 1px solid var(--divider-color);
	padding-left: 20px;
}

.testimonial-cta-client-content-silver h2{
	font-size: 40px;
	line-height: 1.1em;
	display: flex;
	align-items: center;
}

.testimonial-cta-client-content-silver h2 span{
	min-width: 65px;
}

.testimonial-cta-client-content-silver h2 i{
	font-size: 24px;
	color: var(--accent-secondary-color);
}

.testimonial-cta-client-content-silver p{
	margin: 5px 0 0;
}

.testimonial-cta-client-content-silver p span{
	color: var(--primary-color);
	font-weight: 500;
}

.our-testimonials-silver .section-footer-text{
	margin-top: 60px;
}

.our-faqs-silver{
	padding: 120px 0;
}

.faqs-image-box-silver{
	position: relative;
	height: 100%;
	margin-right: 15px;
}

.faqs-image-silver{
	height: 100%;
}

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

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

.faqs-cta-box-silver{
	position: absolute;
	bottom: 30px;
	left: 30px;
	right: 30px;
	max-width: 325px;
	background: var(--divider-color);
	backdrop-filter: blur(10px);
	-webkit-backdrop-filter: blur(10px);
	border-radius: 20px;
	padding: 30px;
	z-index: 2;
}

.faqs-cta-box-silver .icon-box{
	position: relative;
	height: 50px;
	width: 50px;
	display: flex;
	align-items: center;
	justify-content: center;
	background-color: var(--accent-secondary-color);
	border-radius: 50%;
	margin-bottom: 25px;
	z-index: 1;
}

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

.faqs-image-box-silver:hover .faqs-cta-box-silver .icon-box::before{
	transform: scale(1);
}

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

.faqs-image-box-silver:hover .faqs-cta-box-silver .icon-box img{
	filter: brightness(0) invert(0);
}

.faqs-cta-content-silver h2{
	font-size: 20px;
	color: var(--white-color);
}

.faqs-cta-content-silver p{
	color: var(--white-color);
	margin: 10px 0 0;
}

.faqs-content-silver{
	height: 100%;
	align-content: center;
}

.faq-accordion-silver .accordion-item{
    position: relative;
    background: var(--bg-color);
    border-radius: 14px;
    margin-bottom: 25px;
    overflow: hidden;
}

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

.faq-accordion-silver .accordion-header .accordion-button{
	font-size: 18px;
    font-weight: 500;
    line-height: 1.333em;
    background: transparent;
    color: var(--primary-color);
    padding: 22px 55px 22px 24px;
    transition: all 0.4s ease-in-out;
}

.faq-accordion-silver .accordion-item .accordion-button::after, 
.faq-accordion-silver .accordion-item .accordion-button.collapsed::after{
   	content: '\f078';
    font-family: 'FontAwesome';
    position: absolute;
    right: 24px;
    top: 50%;
    transform: translateY(-50%);
    font-size: 20px;
    color: var(--accent-secondary-color);
	line-height: normal;
    transition: all 0.3s ease-in-out;
}

.faq-accordion-silver .accordion-button:not(.collapsed)::after{
	color: var(--primary-color);
	transform: translateY(-50%) rotate(180deg);
}

.faq-accordion-silver .accordion-item .accordion-body{  
	border-top: 1px solid var(--divider-color);
    padding: 22px 24px;
}

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

.main-footer-silver{
	position: relative;
	padding: 120px 0 60px;
	margin-bottom: 15px;
	overflow: hidden;
}

.main-footer-silver::before{
	content: '';
	position: absolute;
	bottom: 0;
	left: 0;
	background: url('../images/footer-bg-image-silver.png') no-repeat;
	background-position: center center;
	background-size: cover;
	width: 360px;
	height: 325px;
	z-index: 0;
}

.main-footer-silver .container{
	position: relative;
	z-index: 1;
}

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

.footer-newsletter-box-silver{
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 20px 30px;
}

.footer-newsletter-box-title-silver{
	width: calc(54% - 15px);
}

.footer-newsletter-box-title-silver h2{
	font-size: 40px;
	letter-spacing: -0.02em;
	color: var(--white-color);
}

.footer-newsletter-form-silver{
	width: calc(46% - 15px);
}

.footer-newsletter-form-silver .form-group{
	display: flex;
	background: var(--dark-divider-color);
	border-radius: 10px;
	backdrop-filter: blur(30px);
	-webkit-backdrop-filter: blur(30px);
	padding: 8px;
}

.footer-newsletter-form-silver .form-group .form-control{
	width: calc(100% - 44px);
	font-size: 16px;
	font-weight: 400;
	line-height: 1.2em;
	color: var(--white-color);
	background: transparent;
	border: none;
	border-radius: 0;
	outline: none;
	box-shadow: none;
	padding: 6px 16px;
}

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

.footer-newsletter-form-silver .form-group .newsletter-btn-silver{
	width: 44px;
	height: 44px;
	display: flex;
	justify-content: center;
	align-items: center;
	background-color: var(--accent-secondary-color);
	border: none;
	border-radius: 6px;
	transition: all 0.3s ease-in-out;
}

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

.footer-newsletter-form-silver .form-group .newsletter-btn-silver img{
	width: 100%;
	max-width: 14px;
	transition: all 0.4s ease-in-out;
}

.footer-newsletter-form-silver .form-group .newsletter-btn-silver:hover img{
	transform: rotate(45deg);
	filter: brightness(0) invert(0);
}

.footer-links-box-silver,
.footer-copyright-silver{
	border-top: 1px solid var(--dark-divider-color);
	margin-top: 60px;
	padding-top: 60px;
}

.footer-links-box-silver{
	display: flex;
	flex-wrap: wrap;
	gap: 30px 4.167vw;
}

.footer-links-silver{
	position: relative;
	width: calc(33.33% - 2.778vw);
}

.footer-links-silver::before{
	content: '';
	position: absolute;
	top: 50%;
	right: -2.083vw;
	transform: translateY(-50%);
	background: var(--dark-divider-color);
	width: 1px;
	height: 80%;
}

.footer-links-silver:nth-child(3n + 3)::before,
.footer-links-silver:last-child::before{
	display: none;
}

.footer-links-silver h2{
	font-size: 20px;
	color: var(--white-color);
	margin-bottom: 30px;
}

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

.footer-links-silver ul li{
	line-height: 1.5em;
	color: var(--white-color);
	margin-bottom: 10px;
}

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

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

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

.footer-service-links-silver ul{
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 15px;
}

.footer-links-silver.footer-service-links-silver ul li{
	margin: 0;
}

.footer-service-links-silver ul li a{
	width: 40px;
	height: 40px;
	border: 1px solid var(--dark-divider-color);
	border-radius: 50%;
	display: flex;
	align-items: center;
	justify-content: center;
	transition: all 0.4s ease-in-out;
}

.footer-service-links-silver ul li a:hover{
	background-color: var(--accent-secondary-color);
	color: var(--white-color);
}

.footer-service-links-silver ul li a i{
	font-size: 18px;
	color: inherit;
}

.footer-copyright-silver{
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
}

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

.footer-menu-silver ul{
    display: flex;
    flex-wrap: wrap;
    gap: 10px 30px;
    margin: 0;
    padding: 0;
    list-style: none;
}

.footer-menu-silver ul li{
    position: relative;
}

.footer-menu-silver ul li::before{
    content: '';
	position: absolute;
	top: 50%;
	right: -18px;
    background: var(--accent-secondary-color);
	border-radius: 100px;
	transform: translateY(-50%);
	width: 5px;
	height: 5px;
}

.footer-menu-silver ul li:last-child:before{
    display: none;
}

.footer-menu-silver ul li a{
	text-transform: capitalize;
    color: var(--white-color);
    transition: all 0.4s ease-in-out;
}

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

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

	.hero-silver{
		height: auto;
	}

	.hero-content-silver{
		margin: 0;
	}

	.hero-content-footer-silver{
		margin-top: 30px;
		padding-top: 30px;
	}

	.hero-experience-circle-silver{
		display: none;
	}

	.about-us-image-silver img{
		aspect-ratio: 1 / 0.8;
	}

	.why-choose-image-box-silver{
		max-width: 650px;
		margin: 0 auto 30px;
	}

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

	.why-choose-body-list-silver{
		margin-top: 30px;
		padding-top: 30px;
	}

	.why-chooose-btn-silver{
		margin-top: 30px;
	}

	.benefit-image-box-silver{
		max-width: 620px;
		margin: 0 auto 30px;
	}

	.benefit-content-silver{
		margin: 0;
	}

	.benefit-item-list-silver{
		padding: 30px;
	}

	.core-features-image-box-silver{
		max-width: 610px;
		margin: 0 auto 30px;
	}

	.core-features-image-box-1-silver{
		padding-bottom: 110px;
	}

	.core-features-image-box-1-silver .core-features-image-silver figure img{
		aspect-ratio: 1 / 1.2;
	}

	.core-features-image-box-2-silver .core-features-image-silver figure img{
		aspect-ratio: 1 / 1.1;
	}

	.core-features-content-silver{
		margin: 0;
	}

	.core-features-btn-silver{
		margin-top: 30px;
	}

	.team-item-silver{
		padding: 30px;
	}

	.how-work-item-content-box-silver{
		padding: 0 30px 30px;
	}

	.faqs-image-box-silver{
		max-width: 740px;
		height: auto;
		margin: 0 auto 30px;
	}

	.faqs-image-silver,
	.faqs-image-silver figure,
	.faqs-image-silver img,
	.faqs-content-silver{
		height: auto;
	}

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

	.main-footer-silver{
		padding-bottom: 30px;
	}

	.main-footer-silver::before{
		width: 240px;
        height: 215px;
		opacity: 55%;
	}

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

	.footer-links-box-silver,
	.footer-copyright-silver{
		margin-top: 30px;
		padding-top: 30px;
	}
}

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

	.hero-silver{
		padding: 150px 0 60px;
		margin: 0;
		border-radius: 0;
	}

	.google-review-box-header-silver h2{
		font-size: 22px;
    	min-width: 60px;
	}

	.about-us-silver{
		padding: 60px 0;
	}

	.about-us-item-silver{
		min-height: auto;
		padding: 20px;
	}

	.about-us-body-content-silver h3{
		font-size: 18px;
	}

	.about-us-body-list-silver li{
		margin-bottom: 10px;
	}

	.about-us-body-list-silver li:before{
		font-size: 16px;
	}

	.about-counter-item-content-silver h2{
		font-size: 38px;
	}

	.about-us-footer-silver{
		margin-top: 10px;
	}

	.about-us-footer-list-silver ul{
		gap: 15px;
	}

	.about-us-footer-list-silver ul li{
		padding: 10px 10px 10px 26px;
	}

	.about-us-footer-list-silver ul li::before{
		left: 10px;
	}

	.our-services-silver{
		padding: 60px 0;
	}

	.service-item-silver{
		min-height: 400px;
	}

	.service-item-body-silver{
		padding: 20px;
	}

	.why-choose-us-silver{
		padding: 60px 0;
	}

	.why-choose-image-box-1-silver{
		padding-bottom: 80px;
	}

	.why-choose-author-box-silver{
		padding: 20px;
	}

	.why-choose-expert-content-silver h2{
		font-size: 28px;
	}

	.why-choose-body-list-silver ul li{
		margin-bottom: 10px;
	}

	.why-choose-body-list-silver ul li::before{
		font-size: 16px;
	}

	.our-benefit-silver{
		padding: 60px 0;
	}

	.benefit-satisfaction-content-silver h2{
		font-size: 34px;
	}

	.benefit-btn-silver{
		margin-top: 30px;
	}

	.our-core-features-silver{
		padding: 60px 0;
	}

	.experience-circle-silver{
		margin-bottom: -61px;
		margin-right: 70px;
	}

	.experience-circle-silver img{
		max-width: 110px;
	}

	.our-team-silver{
		padding: 60px 0;
	}

	.team-item-silver{
		min-height: 400px;
	}

	.our-pricing-silver{
        padding: 60px 0;
    }

    .pricing-item-header-silver{
        padding: 20px 20px 30px;
    }

	.pricing-item-content-silver .pricing-item-title-silver{
		margin-bottom: 15px;
		padding-bottom: 15px;
	}

	.pricing-item-content-silver p{
		margin-bottom: 15px;
	}

    .pricing-item-body-silver{
        padding: 20px;
    }

    .pricing-item-content-silver h2{
        font-size: 30px;
    }

    .pricing-item-list-silver ul{
		margin: 15px 0 0;
		padding: 15px 0 0;
    }

    .pricing-item-list-silver ul li{
        margin-bottom: 10px;
    }

    .pricing-item-list-silver ul li:before{
        font-size: 16px;
    }

    .pricing-benefit-list-silver{
		margin-top: 10px;
	}

	.pricing-benefit-list-silver ul{
		gap: 15px 30px;
	}

	.how-it-work-silver{
		padding: 60px 0;
	}

	.how-work-item-silver{
		width: calc(50% - 15px);
	}

	.how-work-item-silver:nth-child(3n + 3) .how-work-item-no-silver::before{
		width: calc(100% + 30px);
	}

	.how-work-item-silver:nth-child(2n + 2) .how-work-item-no-silver::before,
	.how-work-item-silver:last-child .how-work-item-no-silver::before{
		width: 100%;
	}

	.how-work-item-no-silver span{
		padding: 8px 20px;
	}

	.how-work-item-no-silver{
		margin-bottom: 146px;
	}

	.how-work-item-no-silver::after{
		bottom: -10px;
		width: 9px;
		height: 38px;
	}

	.our-testimonials-silver{
		padding: 60px 0;
	}

	.testimonial-slider-silver .swiper{
		padding-bottom: 30px;
	}

	.testimonial-item-silver{
		padding: 30px;
		gap: 30px;
		min-height: 390px;
	}

	.testimonial-item-content-silver p,
	.testimonial-item-rating-silver i{
		font-size: 18px;
	}

	.testimonial-author-box-silver{
		margin-top: 30px;
		padding-top: 30px;
	}

	.testimonial-cta-box-silver{
		height: calc(100% - 30px);
		margin-bottom: 30px;
	}

	.testimonial-cta-client-box-silver{
		padding: 10px;
	}

	.testimonial-cta-client-box-silver .satisfy-client-images{
		width: calc(46% - 10px);
	}

	.testimonial-cta-client-box-silver .satisfy-client-image figure img{
		max-width: 40px;
	}

	.testimonial-cta-client-content-silver{
		width: calc(54% - 10px);
	}

	.testimonial-cta-client-content-silver h2{
		font-size: 34px;
	}

	.testimonial-cta-client-content-silver h2 span{
		min-width: 55px;
	}

	.testimonial-cta-client-content-silver h2 i{
		font-size: 18px;
	}

	.our-testimonials-silver .section-footer-text{
		margin-top: 30px;
	}

	.our-faqs-silver{
		padding: 60px 0;
	}

	.faqs-cta-box-silver{
		bottom: 20px;
		left: 20px;
		right: 20px;
	}

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

	.faq-accordion-silver .accordion-header .accordion-button{
		padding: 18px 44px 18px 20px;
	}
	
	.faq-accordion-silver .accordion-item .accordion-button::after,
	.faq-accordion-silver .accordion-item .accordion-button.collapsed::after{
		right: 20px;
		font-size: 18px;
	}

	.faq-accordion-silver .accordion-item .accordion-body{
		padding: 18px 20px;
	}

	.main-footer-silver{
		padding: 60px 0 30px;
		margin-bottom: 0;
	}

	.footer-newsletter-box-title-silver h2{
		font-size: 34px;
	}

	.footer-newsletter-form-silver .form-group{
		padding: 5px;
	}

	.footer-newsletter-form-silver .form-group .form-control{
		width: calc(100% - 36px);
	}

	.footer-newsletter-form-silver .form-group .newsletter-btn-silver{
		width: 36px;
		height: 36px;
	}
	
	.footer-newsletter-form-silver .form-group .newsletter-btn-silver img{
		max-width: 12px;
	}

	.footer-links-silver h2{
		margin-bottom: 20px;
	}
}

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

	.hero-content-body-silver{
		gap: 30px 20px;
	}

	.hero-content-body-silver .video-play-button-silver{
		margin-left: 10px;
	}

	.hero-footer-item-list-silver{
		width: 100%;
	}

	.hero-footer-item-content-silver h2{
		font-size: 18px;
	}

	.google-review-box-silver{
		width: 100%;
		border-left: none;
		border-top: 1px solid var(--dark-divider-color);
		padding: 30px 0 0;
	}

	.google-review-box-silver .icon-box img{
		max-width: 40px;
	}

	.google-review-box-body-silver{
		width: calc(100% - 55px);
	}

	.google-review-box-header-silver h2{
        font-size: 18px;
        min-width: 50px;
    }

	.google-rating-star-silver i{
		font-size: 16px;
	}

	.about-us-item-silver{
		padding: 20px;
		gap: 20px;
		min-height: auto;
	}

	.about-us-body-content-silver h3{
        font-size: 16px;
    }

	.about-us-body-list-silver{
		margin-top: 20px;
		padding-top: 20px;
	}

	.about-us-image-silver figure,
	.about-us-image-silver img{
		height: auto;
	}

	.about-counter-item-content-silver h2{
        font-size: 26px;
    }

	.about-counter-item-content-silver p{
		margin: 5px 0 0;
	}

	.about-us-footer-list-silver ul li{
		font-size: 14px;
		padding: 8px 10px 8px 26px;
	}

	.service-item-content-silver h2{
		font-size: 18px;
	}

	.service-item-silver:hover .service-item-btn-silver{
		height: 32px;
		margin-top: 15px;
		padding-top: 15px;
	}

	.why-choose-image-box-silver{
		padding-left: 20px;
	}

	.why-choose-image-box-1-silver{
		width: 48%;
		padding: 0 0 80px;
	}

	.why-choose-author-box-silver{
		border-radius: 10px;
        top: 20px;
		gap: 10px;
        padding: 12px;
    }

	.why-choose-author-image-silver img{
		max-width: 44px;
	}

	.why-choose-author-content-silver{
		width: calc(100% - 54px);
	}

	.why-choose-author-content-silver h2{
		font-size: 16px;
	}

	.why-choose-image-silver figure{
		margin-right: -80px;
	}

	.why-choose-expert-box-silver{
		width: 52%;
		border-width: 3px;
		padding: 15px 15px 0;
	}

	.why-choose-expert-box-silver:before{
		height: 200px;
	}

	.why-choose-expert-content-silver{
		margin-bottom: 10px;
	}

	.why-choose-expert-content-silver h2{
		font-size: 26px;
	}

	.why-choose-expert-content-silver p{
		font-size: 14px;
	}

	.why-choose-expert-image-silver figure{
		max-width: 110px;
		margin: 0 auto;
	}

	.why-choose-items-list-silver{
		gap: 20px;
	}

	.why-choose-item-silver{
		width: 100%;
	}

	.why-choose-item-content-silver h3{
		font-size: 18px;
	}

	.benefit-image-silver figure{
		max-width: 280px;
	}

	.benefit-satisfaction-box-silver{
		padding: 15px;
		bottom: 30px;
	}

	.benefit-satisfaction-content-silver h2{
        font-size: 28px;
    }

	.benefit-satisfaction-content-silver p{
		font-size: 14px;
	}

	.benefit-item-list-silver{
        padding: 20px;
    }

	.benefit-item-silver{
        margin-bottom: 20px;
        padding-bottom: 20px;
    }

	.benefit-item-content-silver h2{
		font-size: 18px;
	}

	.core-features-image-box-1-silver{
		padding-bottom: 100px;
	}

	.core-features-image-box-1-silver .core-features-image-silver{
		margin-right: -120px;
	}

	.experience-circle-silver{
        margin-bottom: -51px;
        margin-right: 55px;
    }

	.experience-circle-silver img{
        max-width: 90px;
    }

	.core-features-item-silver{
		width: 100%;
		padding: 20px;
		gap: 20px;
		min-height: auto;
	}

	.core-features-item-content-silver h2{
		font-size: 18px;
	}

	.core-features-item-content-silver p{
		margin-top: 15px;
		padding-top: 15px;
	}

	.team-item-silver{
        min-height: 360px;
        padding: 20px;
    }

	.team-item-content-silver h2{
		font-size: 18px;
	}

	.team-social-list-silver{
		margin-top: 20px;
		padding-top: 20px;
	}

	.pricing-item-header-silver{
        padding: 15px 15px 20px;
    }

	.pricing-item-content-silver .pricing-item-title-silver{
		font-size: 18px;
	}

	.pricing-item-content-silver h2{
        font-size: 26px;
    }

	.pricing-item-content-silver h2 sub{
		font-size: 14px;
	}

	.pricing-benefit-list-silver{
		margin-top: 5px;
	}

	.pricing-benefit-list-silver ul{
		gap: 10px;
	}

	.pricing-benefit-list-silver ul li{
		font-size: 14px;
	}

	.pricing-benefit-list-silver ul li img{
		max-width: 16px;
		margin-right: 5px;
	}

	.how-work-item-silver{
		width: 100%;
	}

	.how-work-item-silver:nth-child(3n + 3) .how-work-item-no-silver::before{
		width: 100%;
	}

	.how-work-item-no-silver span{
		font-size: 14px;
		padding: 6px 16px;
	}
	
	.how-work-item-content-box-silver{
		padding: 0 20px 20px;
    }

	.how-work-item-content-silver{
		margin-top: 20px;
	}

	.how-work-item-content-silver h3{
		font-size: 18px;
	}

	.testimonial-slider-silver,
	.testimonial-slider-silver .swiper,
	.testimonial-slider-silver .swiper-wrapper{
		height: auto;
	}

	.testimonial-slider-silver .swiper{
		padding-bottom: 30px;
	}

	.testimonial-item-silver{
		gap: 20px;
		min-height: auto;
		padding: 20px;
	}

	.testimonial-item-content-silver p{
		font-size: 16px;
	}

	.testimonial-author-box-silver{
        margin-top: 20px;
        padding-top: 20px;
    }

	.testimonial-author-content-silver h2{
		font-size: 18px;
	}

	.testimonial-cta-box-silver{
		height: auto;
		margin: 30px 0 0 0;
	}

	.testimonial-cta-client-content-silver h2{
		font-size: 28px;
	}

	.testimonial-cta-client-content-silver h2 span{
		min-width: 45px;
	}

	.faqs-cta-box-silver{
		bottom: 10px;
        left: 10px;
        right: 10px;
        padding: 15px;
	}

	.faqs-cta-box-silver .icon-box{
		margin-bottom: 15px;
	}

	.faqs-cta-content-silver h2{
		font-size: 18px;
	}

	.faq-accordion-silver .accordion-header .accordion-button{
		font-size: 16px;
        padding: 12px 40px 12px 15px;
    }

	.faq-accordion-silver .accordion-item .accordion-button::after,
	.faq-accordion-silver .accordion-item .accordion-button.collapsed::after{
		font-size: 16px;
        right: 15px;
    }

	.faq-accordion-silver .accordion-item .accordion-body{
        padding: 12px 15px;
    }

	.main-footer-silver{
		padding-bottom: 15px;
	}

	.footer-newsletter-box-title-silver,
	.footer-newsletter-form-silver{
		width: 100%;
	}

	.footer-newsletter-box-title-silver h2{
        font-size: 28px;
    }

	.footer-links-silver{
		width: 100%;
	}

	.footer-links-silver::before{
		display: none;
	}

	.footer-links-silver h2{
		font-size: 18px;
		margin-bottom: 15px;
	}

	.footer-copyright-silver{
		flex-direction: column-reverse;
		gap: 15px;
		padding-top: 15px;
	}

	.footer-menu-silver ul{
		gap: 10px 20px;
	}
	
	.footer-menu-silver ul li{
		font-size: 14px;
	}

	.footer-menu-silver ul li::before{
		right: -12px;
	}
}


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
























/* Header Wrapper */
.header-new {
    background: rgba(0, 0, 0, 0.4); /* Transparent dark overlay as per image */
    backdrop-filter: blur(10px); /* Modern blur effect */
    border-bottom: 1px solid rgba(255, 255, 255, 0.1);
    transition: all 0.3s ease;
    z-index: 1050;
}

/* Sticky Class (Applied automatically by Bootstrap sticky-top) */
.header-new.sticky-top {
    position: relative;
    top: 0;
    background-color: ;
    padding: 2px 0;
}

/* Logo Sizing */
.header-new .logo-main img {
    max-height: 79px;
}

.header-new .uae-logo-wrap img {
    max-height: 50px;
    filter: brightness(0) invert(1); /* Ensure UAE logo is white */
}

/* Button Styling (Exact colors from image) */
.header-new .btn-login {
    background-color: #3b4a75; /* Deep Blue */
    color: white;
    border: none;
    padding: 8px 10px;
    border-radius: 6px;
    font-weight: 500;
}

.header-new .btn-lang {
    background-color: #8d7051; /* Bronze/Brown */
    color: white;
    border: none;
    padding: 8px 20px;
    border-radius: 6px;
    font-weight: 500;
}

.header-new .btn-menu-toggle {
    background-color: #3b4a75;
    border: 1.5px solid #ffffff;
    color: white;
    padding: 4px 7px;
    border-radius: 7px;
}

/* Offcanvas Custom Design */
.header-new-menu {
    background-color: #fff;
    color: white;
    width: 300px !important;
    z-index: 10000;
}

.header-new-menu .side-nav-links li a {
    color: #000;
    text-decoration: none;
    padding: 12px 0;
    display: block;
    border-bottom: 1px solid rgba(255,255,255,0.05);
    font-size: 1.05rem;
    transition: 0.3s;
}

.header-new-menu .side-nav-links li a:hover {
    color: #8d7051;
    padding-left: 10px;
}

/* Responsive adjustments */
@media (max-width: 768px) {
    .header-new .logo-main img {
        max-height: 45px;
    }
}



/* Navigation Links */
.header-new .main-nav-links li {
    position: relative;
    padding: 10px 20px;
}

.header-new .main-nav-links li a {
    color: #ffffff;
    text-decoration: none;
    font-weight: 500;
    font-size: 0.95rem;
    transition: 0.3s;
    display: block;
}

.header-new .main-nav-links li a:hover {
    color: #8d7051;
}

/* Dropdown Logic */
.header-new .dropdown-menu-custom {
    position: absolute;
    top: 100%;
    left: 50%;
    transform: translateX(-50%) translateY(15px);
    background: rgba(26, 26, 26, 0.95);
    backdrop-filter: blur(15px);
    min-width: 220px;
    padding: 15px 0;
    list-style: none;
    border-radius: 12px;
    border: 1px solid rgba(255, 255, 255, 0.1);
    box-shadow: 0 15px 35px rgba(0, 0, 0, 0.5);
    opacity: 0;
    visibility: hidden;
    transition: all 0.3s cubic-bezier(0.165, 0.84, 0.44, 1);
}

/* Show Dropdown on Hover */
.header-new .dropdown-item-wrap:hover .dropdown-menu-custom {
    opacity: 1;
    visibility: visible;
    transform: translateX(-50%) translateY(0);
}

.header-new .dropdown-menu-custom li {
    padding: 0;
}

.header-new .dropdown-menu-custom li a {
    padding: 10px 25px;
    font-size: 0.85rem;
    color: rgba(255, 255, 255, 0.8);
    border-bottom: 1px solid rgba(255, 255, 255, 0.05);
}

.header-new .dropdown-menu-custom li a:hover {
    background: rgba(141, 112, 81, 0.2);
    color: #ffffff;
    padding-left: 30px; /* Subtle slide effect */
}

.header-new .dropdown-menu-custom li:last-child a {
    border-bottom: none;
}

/* Arrow indicator styling */
.header-new .fa-chevron-down {
    font-size: 0.7rem;
    transition: 0.3s;
}

.header-new .dropdown-item-wrap:hover .fa-chevron-down {
    transform: rotate(180deg);
}



/* Ensure the parent link highlights when the menu is open */
.header-new-menu .side-nav-links li a:not(.collapsed) {
    color: #8d7051 !important; /* Brand Bronze */
    background: rgba(141, 112, 81, 0.05);
}

/* Smooth arrow rotation for the active dropdown */
.header-new-menu .side-nav-links li a i {
    transition: transform 0.3s ease;
}

.header-new-menu .side-nav-links li a:not(.collapsed) i {
    transform: rotate(180deg);
}

/* Subtle animation for the sub-menu appearance */
.collapse {
    transition: height 0.3s ease-out;
}

.header-new-menu .sub-menu {
    padding-bottom: 10px;
    border-left: 2px solid rgba(141, 112, 81, 0.3);
    margin-left: 10px;
}


/* 1. Initial State (Static at top) */
.header-new {
    background: #ffffff;
    backdrop-filter: none;
    border-bottom: transparent;
    transition: all 0.4s ease-in-out;
    z-index: 20;
    width: 100%;
    position: absolute; /* Sits on top of the hero image */
    top: 0;
    left: 0;
}

/* 2. Sticky State (Triggered by JS on scroll) */
.header-new.is-sticky {
    position: fixed; /* Fixes to viewport */
    background: rgba(255, 255, 255, 0.88); /* Slightly darker for readability on white content */
    box-shadow: 0 5px 20px rgba(0, 0, 0, 0.3);
    animation: slideDown 0.4s ease; /* Smooth entrance animation */
    top: 0;
    padding: 0px 0;
}

@keyframes slideDown {
    from { transform: translateY(-100%); }
    to { transform: translateY(0); }
}


.btn-menu-toggle img{ width:30px; }
.emirates-logos{ margin-left:15px; }
.emirates-logos img{ width:180px; }


.offcanvas-header img{ width:210px; }

.wdth{ width:356px; height: 557px;}

/* Rest of your existing CSS remains the same... */










 /* Overlay */
            .cookie-overlay {
                position: fixed;
                bottom: 0;
                left: 0;
                width: 100%;
                height: 100%;
                background: rgba(0,0,0,0.6);
                backdrop-filter: blur(6px);
                display: flex;
                align-items: center;
                justify-content: center;
                opacity: 0;
                visibility: hidden;
                transition: 0.4s ease;
                z-index: 999999999999;
            }

                /* Show class */
                .cookie-overlay.show {
                    opacity: 1;
                    visibility: visible;
                }

            /* Popup box */
            .cookie-popup {
                background: #fff;
                width: 90%;
                max-width: 420px;
                padding: 25px;
                border-radius: 14px;
                text-align: center;
                transform: translateY(40px);
                opacity: 0;
                transition: all 0.4s ease;
                box-shadow: 0 10px 30px rgba(0,0,0,0.3);
            }

            /* Animate popup */
            .cookie-overlay.show .cookie-popup {
                transform: translateY(0);
                opacity: 1;
            }

            /* Title */
            .cookie-popup h3 {
                margin-bottom: 10px;
            }

            /* Text */
            .cookie-popup p {
                font-size: 14px;
                color: #555;
                margin-bottom: 20px;
            }

            /* Buttons */
            .cookie-buttons {
                display: flex;
                gap: 10px;
            }

                .cookie-buttons button {
                    flex: 1;
                    padding: 10px;
                    border: none;
                    border-radius: -11px;
                    cursor: pointer;
                    font-weight: 500;
                }

            /* Button styles */
            .accept {
                background: #22315a;
                color: white;
            }

            .reject {
                background: #927556;
                color: white;
            }

            .accept:hover {
                background: #795548;
            }

            .reject:hover {
                background: #8d7051;
            }













            .donation-card {
  background: #fff;
  border-radius: 20px;
  overflow: hidden;
  padding: 20px;
  align-items: center;
  gap: 20px;
  transition: 0.3s;
}

/* IMAGE */
.img-box {
  position: relative;
  overflow: hidden;
  border-radius: 15px;
  min-width: 200px;
}

.img-box img {
  width: 100%;
  height: 220px;
  object-fit: cover;
  transition: transform 0.5s ease;
}

/* 🔥 HOVER ZOOM */
.img-box:hover img {
  transform: scale(1.1);
}

/* BADGE */
.badge {
  position: absolute;
  top: 10px;
  left: 10px;
  background: #114c5c;
  color: #fff;
  padding: 8px 12px;
  border-radius: 4px;
  font-size: 14px;
  z-index: 2;
}

.badge.orange {
  background: #f4a300;
}

/* CONTENT */
.content {
  flex: 1;
}

.content h3 {
  font-size: 20px;
  font-weight: 500;
  margin-bottom: 6px;
  line-height: 22px;
  color: #114c5c;
}

.content p {
  color: #777;
  font-size: 16px;
}

/* PROGRESS BAR */
.progress-bar-wrap {
  height: 9px;
  background: #eee;
  border-radius: 10px;
  margin: 6px 0 15px 0;
  overflow: hidden;
}

.progress-bar-fill {
  width: 75%;
  height: 100%;
  background: #f4a300;
}

/* AMOUNT */
.amount small {
  color: #777;
}

.amount h6 {
  font-weight: 500;
}

/* BUTTON */
.donate-btn {
  display: inline-block;
  margin-top: 15px;
  background: #1f6f5f;
  color: #fff;
  padding: 10px 20px;
  border-radius: 30px;
  text-decoration: none;
  transition: 0.3s;
}

.donate-btn:hover {
  transform: translateY(-3px);
  box-shadow: 0 22px 40px rgba(24, 167, 184, 0.32);
}

/* RESPONSIVE */
@media (max-width: 768px) {
  .donation-card {
    flex-direction: column;
    text-align: center;
  }

  .img-box img {
    height: 200px;
  }

  .amount {
    justify-content: center !important;
    gap: 40px;
  }
}


.progress-bar-fill {
  width: 0;
  height: 100%;
  background: #b69673;
  transition: width 1.5s ease-in-out;
}

/* CARD FULL HEIGHT */
.donation-card {
  /*! background: #fff; */
  border-radius: 15px;
  overflow: hidden;
  padding: 20px;
  gap: 20px;
  align-items: stretch; /* 🔥 KEY */
}

/* IMAGE FULL HEIGHT */
.img-box {
  position: relative;
  overflow: hidden;
  border-radius: 9px;
  width: 100%;
  height: 230px;
  display: flex;
  margin-bottom: 15px;
}

.img-box img {
  width: 100%;
  height: 100%;
  object-fit: cover; /* 🔥 IMPORTANT */
  transition: transform 0.5s ease;
}

/* CONTENT TAKE FULL SPACE */
.content {
  /*! width: 60%; */
  display: flex;
  flex-direction: column;
  justify-content: center;
}

/* RESPONSIVE FIX */
@media (max-width: 768px) {
  .donation-card {
    flex-direction: column;
  }

  .img-box {
    width: 100%;
    height: 220px;
  }

  .content {
    width: 100%;
  }
}


.prog-cntnt{ min-height:63px; }
.donation-card  .prog-cntnt p{ margin-bottom:5px; }
.donation-card  .prog-cntnt .cas{ background-color:#fff; padding:1px 10px; border-radius:5px; display: inline-block;color: #000;margin-bottom: 9px;border: solid 1px #ccc;}
.progrs-br-wrap{ padding:8px; border-radius:5px; background-color:#fff; border:solid 1px #dfc8af; margin-top: 9px;margin-bottom: 28px;}

.donation-card  .about-us-btn{ margin-top:0; }





/* MAIN WRAPPER */
.p-tabs {
  width: 100%;
}

/* TAB MENU */
.p-tabs .tab-menu {
  display: flex;
  gap: 15px;
  list-style: none;
  padding: 0;
  margin-bottom: 25px;
  flex-wrap: wrap;
  justify-items: end;
  float: right;
}

.p-tabs .tab-menu li {
  padding: 10px 20px;
  background: #8d7051;
  border-radius: 30px;
  cursor: pointer;
  transition: 0.3s;
  font-weight: 500;
  font-size: 16px;
  font-weight: 500;
  line-height: 1em;
  text-transform: capitalize;
  color: var(--white-color);
  background: #15999b;
  border-radius: 5px;
  padding: 17px 24px 17px 24px;
  background: linear-gradient(135deg, #0d6477, #18a7b8);
}

/* ACTIVE TAB */
.p-tabs .tab-menu li.active {
  background: #114c5c;
  color: #fff;
  background: rgba(255,255,255,.88);
  color: #15999b;
  border: 1.5px solid #15999ba6;
}

/* HOVER */
.p-tabs .tab-menu li:hover {
  background: #22315a;
  color: #fff;
}

/* TAB CONTENT */
.p-tabs .tab-content {
  display: none;
  animation: fadeIn 0.4s ease;
}

.p-tabs .tab-content.active {
  display: block;
}

/* ANIMATION */
@keyframes fadeIn {
  from {
    opacity: 0;
    transform: translateY(10px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

/* RESPONSIVE */
@media (max-width: 768px) {
  .p-tabs .tab-menu {
    justify-content: center;
  }
}


.post-item-body  .about-us-btn{ margin-top:0; }
.feature-item-counter-content-gold h2{ color:#fff }

.cnt-bx{text-align:center;border:solid 1px #cccccc36;padding:20px 15px;border-radius:8px;background-color: #15999b;background: linear-gradient(135deg, #0d6477, #18a7b8);}
.cnt-bx p{ color:#fff; font-size:21px; }

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

.iso-wrap{ display:flex; gap:10px; margin-top:15px; }
.iso-wrap img{ width:80px; }

.mt-20{ margin-top:20px; }







/* MAIN */
.p-chatbot {
  position: fixed;
  bottom: 75px;
  right: 75px;
  z-index: 9999999;
  font-family: var(--default-font);
}

/* BUTTON */
.chat-toggle {
  width: 55px;
  height: 55px;
  background: #15999b;
  color: #fff;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 50%;
  cursor: pointer;
  font-size: 22px;
  box-shadow: 0 5px 15px rgba(0,0,0,0.2);
}

/* CHAT BOX */
.chat-box {
  width: 320px;
  height: 420px;
  background: #fff;
  border-radius: 15px;
  box-shadow: 0 10px 30px rgba(0,0,0,0.2);
  display: none;
  flex-direction: column;
  overflow: hidden;
  margin-bottom: 10px;
}

/* HEADER */
.chat-header {
  background: #128092;
  color: #fff !important;
  padding: 12px;
  display: flex;
  justify-content: space-between;
}

.close-chat {
  cursor: pointer;
}

/* BODY */
.chat-body {
  flex: 1;
  padding: 10px;
  overflow-y: auto;
  background: #f5f5f5;
}

/* MESSAGE */
.msg {
  padding: 8px 12px;
  margin: 6px 0;
  border-radius: 10px;
  max-width: 75%;
  font-size: 14px;
}

.msg.bot {
  background: #e0e0e0;
}

.msg.user {
  background: #1f6f5f;
  color: #fff;
  margin-left: auto;
}

/* FOOTER */
.chat-footer {
  display: flex;
  border-top: 1px solid #ddd;
}

.chat-footer input {
  flex: 1;
  border: none;
  padding: 10px;
  outline: none;
}

.chat-footer button {
  background: #0d6679;
  color: #fff;
  border: none;
  padding: 0 15px;
  cursor: pointer;
}

/* RESPONSIVE */
@media (max-width: 480px) {
  .chat-box {
    width: 100%;
    height: 100vh;
    position: fixed;
    bottom: 0;
    right: 0;
    border-radius: 0;
  }
}



.chat-toggle {
  transition: 0.3s;
}

.chat-toggle.hide {
  opacity: 0;
  visibility: hidden;
}
.chat-header h2{ color:#fff!important; font-size:22px; }




/* MAIN WRAPPER */
.p-float-icons {
  position: fixed;
  right: 20px;
  bottom: 100px;
  display: flex;
  flex-direction: column;
  gap: 12px;
  z-index: 9;
}

/* BUTTON */
.float-btn {
  display: flex;
  align-items: center;
  gap: 10px;
  background: #1f6f5f;
  color: #fff;
  padding: 13px 0px 13px 10px;
  border-radius: 50px;
  text-decoration: none;
  font-size: 17px;
  transition: 0.3s;
  overflow: hidden;
  white-space: nowrap;
  text-align: center;
}

/* ICON */
.float-btn i {
  font-size: 27px;
}

/* HOVER EXPAND */
.float-btn span {
  max-width: 0;
  overflow: hidden;
  transition: 0.3s;
}

.float-btn:hover span {
  max-width: 120px;
}

/* COLORS */
.float-btn.whatsapp {
  background: #25D366;
}

.float-btn.donate {
  background: #15999b;
}

.float-btn.zakat {
  background: #114c5c;
}

/* HOVER EFFECT */
.float-btn:hover {
  transform: translateX(-5px);
  box-shadow: 0 5px 15px rgba(0,0,0,0.2);
  padding-right: 15px;
}

/* MOBILE */
@media (max-width: 768px) {
  .p-float-icons {
    right: 10px;
    bottom: 80px;
  }

  .float-btn {
    padding: 10px;
  }

  .float-btn span {
    display: none; /* only icons on mobile */
  }
}




.whatsapp-h{ bottom:83px; }
.donat-i{bottom:142px;}
.zakat-i{bottom:202px;}


.btn-close-white{ background-color:#000; }

.cr-btns a{ 
  background-color: #15999b;
  padding: 10px 20px;
  border-radius: 6px;
  text-decoration: none;
  color: #fff;
  font-weight: 500;
  font-size: 18px;
}
.cr-btns a:hover{ background-color:#786149; } 








.icn-slider .swiper-slide {
  text-align: center;
}

/* CARD DESIGN */
.icn-card {
  background: #ecf8fb;
  border-radius: 12px 12px 0 0;
  padding: 30px 20px;
  transition: 0.3s ease;
  border: solid 1px #bbced3;
}

.icn-card img {
  width: 100px;
  height: 100px;
  object-fit: contain;
  margin-bottom: 15px;
  border-radius: 50%;
  background-color: #fff;
  padding: 7px;
  border: dashed 1px #15999b;
}

/* TEXT */
.icn-card h4 {
  font-size: 20px;
  color: #114c5c;
  margin: 0;
  line-height: 1.2;
}

/* HOVER EFFECT */
.icn-card:hover {
  transform: translateY(0px);
  background: #3b4a7526;
}

/* RESPONSIVE */
@media (max-width: 768px) {
  .icn-card {
    padding: 20px 15px;
  }

  .icn-card h4 {
    font-size: 14px;
  }
}



.icn-slider{ position:relative; }

/* NAV BUTTONS */
.icn-slider .swiper-button-next,
.icn-slider .swiper-button-prev {
  background: #fff;
  width: 40px;
  height: 40px;
  border-radius: 50%;
  box-shadow: 0 3px 10px rgba(0,0,0,0.1);
  color: #000;
}

.icn-slider .swiper-button-next::after,
.icn-slider .swiper-button-prev::after {
  font-size: 16px;
  font-weight: 500;
}

/* POSITION */
.icn-slider .swiper-button-next {
  right: 0;
}

.icn-slider .swiper-button-prev {
  left: 0;
}

/* PAGINATION DOTS */
.icn-slider .swiper-pagination {
  margin-top: 20px;
  position: relative;
}

.icn-slider .swiper-pagination-bullet {
  background: #ccc;
  opacity: 1;
}

.icn-slider .swiper-pagination-bullet-active {
  background: #8d7051;
  width: 50px;
  border-radius: 79px;
}



.thmb-wrap{ padding:50px 0 50px 0; }

.icn-card h4{ min-height:50px; }

.ttls .section-sub-title{
background: #F6F6F6!important;
  backdrop-filter: blur(15px);
  -webkit-backdrop-filter: blur(15px);
  color: #333!important;}


 .ttls .text-anime-style-3{ color:#114c5c !important; }




 /* CARD */
.donation-card {
  /*! width: 380px; */
  /*! background: #fff; */
  border-radius: 10px;
  overflow: hidden;
  box-shadow: 0 2px 15px rgba(0, 0, 0, 0.1);
  border: solid 1px #cccccc82;
  overflow: hidden;
}

/* PROGRESS BAR */
.progress {
  background: #d4e5e9;
  height: 25px;
  position: relative;
  margin-bottom: 5px;
  border: solid 1px #15999b47;
}

.progress-bar {
  width: 76%;
  background: #15999b;
  height: 100%;
  color: #fff;
  font-weight: 500;
  text-align: center;
  line-height: 37px;
}

/* CONTENT */
.content {
  padding: ;
}

/* AMOUNTS */
.amounts {
  display: flex;
  justify-content: space-between;
  margin-bottom: 20px;
}

.amounts p {
  margin: 0;
  color: #636363;
  font-weight: 500;
}

.amounts span {
  display: block;
  margin-top: 5px;
  font-weight: 500;
  font-size: 18px;
  color: #114c5c;
  letter-spacing: .2px;
}

/* INPUT + BUTTON */
.donate-row {
  display: flex;
  gap: 10px;
  margin-bottom: 15px;
}

.donate-row input {
  flex: 1;
  padding: 12px;
  border: 1px solid #d4d4d4;
  border-radius: 6px;
  font-size: 14px;
  outline: none;
}

.donate-row button {
  background: #114c5c;
  color: #fff;
  border: none;
  padding: 0 20px;
  border-radius: 6px;
  font-size: 18px;
  cursor: pointer;
  background: linear-gradient(90deg, rgb(21, 153, 155), rgb(20, 111, 135));
  color: rgb(255, 255, 255);
  box-shadow: rgba(13, 111, 104, 0.24) 0px 16px 36px;
}

/* BUTTON ROW */
.btn-row {
  display: flex;
  gap: 10px;
}

.btn-outline {
  flex: 1;
  cursor: pointer;
  font-size: 16px;
  cursor: pointer;
  background: rgba(255,255,255,.88);
  color: #15999b;
  border: 1.5px solid #15999ba6;
  padding: 0;
  border-radius: 8px;
  font-weight: 500;
}

/* CART BUTTON */
.cart-btn {
  width: auto;
  border: 1.5px solid #22315a;
  border-radius: 6px;
  background: transparent;
  color: #22315a;
  font-size: 16px;
  cursor: pointer;
  padding: 0px 20px;
  font-size: 16px;
  cursor: pointer;
  background: rgba(255,255,255,.88);
  color: #15999b;
  border: 1.5px solid #15999ba6;
  font-weight: 500;
}


.btn-outline:hover{background-color: bisque;color: #fff;transform: translateY(-3px);box-shadow: 0 22px 40px rgba(24, 167, 184, 0.32);background: linear-gradient(90deg, rgb(21, 153, 155), rgb(20, 111, 135));color: rgb(255, 255, 255);}
.cart-btn img{ width:19px; margin-left: 8px;}




/* MAIN */
.new-menu {
  background: transparent;
  color: #0e0e0e;
}

.new-menu .nav-container {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 15px 20px;
}

/* LOGO */
.new-menu .logo {
  font-size: 20px;
  font-weight: 500;
}

/* MENU */
.new-menu .menu {
  display: flex;
  list-style: none;
  gap: 16px;
  margin: 0;
  padding: 0;
}

.new-menu .menu li {
  position: relative;
  list-style: none;
}

.new-menu .menu a {
  color: #262626;
  text-decoration: none;
  padding: 9px 0;
  display: flex;
  align-items: center;
  gap: 0px;
  font-size: 18px;
}

/* ARROW */
.new-menu .arrow {
  transition: 0.3s;
}

/* DROPDOWN */
.new-menu .dropdown {
  position: absolute;
  top: 60px;
  left: 0;
  background: #fff;
  min-width: 180px;
  border-radius: 8px;
  overflow: hidden;
  opacity: 0;
  visibility: hidden;
  transform: translateY(10px);
  transition: 0.3s;
  margin-left: 0;
  left: 0;
  padding-left: 0px;
}

.new-menu .dropdown a {
  color: #333;
  padding: 14px 11px;
}

.new-menu .dropdown a:hover {
  background: #f5f5f5;
}

/* HOVER (DESKTOP) */
.new-menu .has-dropdown:hover .dropdown {
  opacity: 1;
  visibility: visible;
  transform: translateY(0);
}

.new-menu .has-dropdown:hover .arrow {
  transform: rotate(180deg);
}

/* TOGGLE BUTTON */
.menu-toggle {
  display: none;
  font-size: 24px;
  cursor: pointer;
}


@media (max-width: 768px) {

  .menu-toggle {
    display: none;
  }

  .new-menu .menu {
    position: absolute;
    top: 60px;
    left: 0;
    width: 100%;
    background: #1f6f5f;
    flex-direction: column;
    display: none;
  }

  .new-menu .menu.active {
    display: flex;
  }

  .new-menu .menu li {
    border-top: 1px solid rgba(255,255,255,0.2);
  }

  .new-menu .dropdown {
    position: static;
    opacity: 1;
    visibility: visible;
    display: none;
    transform: none;
    background: #155a4d;
  }

  .new-menu .dropdown a {
    color: #fff;
  }

  .new-menu .dropdown.show {
    display: block;
  }
}



.dont-btns a{background-color: #15999b;color:#fff;padding:15px;width: 100%;display: block;border-radius: 0 0 10px 10px;font-size: 19px;}



.d-mt{ font-size:17px; margin-bottom:9px; color: #444;}
.cart-btn:hover{background-color:#516fc221;background: linear-gradient(90deg, rgb(21, 153, 155), rgb(20, 111, 135));color: rgb(255, 255, 255);color: #fff;transform: translateY(-3px);}

.btn-lang img{ width:20px; margin-right:5px; }
.btn-login img{ width:18px; margin-right:5px; }
.btn:hover{ opacity:.9 }
.catgory-w:hover .dont-btns a{ background-color:#114c5c; }
.catgory-w:hover .icn-card{ background-color:#fff6ed; }






















/* MAIN */
.m-banner {
  width: 100%;
  /*! height: 600px; */
  padding: 0;
  border-radius: 0;
}

/* SLIDE */
.m-banner .swiper-slide {
  position: relative;
}

/* IMAGE */
.m-banner .banner-item img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

/* OVERLAY */
.m-banner .banner-item::after {
  content: "";
  /*! position: absolute; */
  inset: 0;
  /*! background: rgba(0,0,0,0.3); */
}

/* CONTENT */
.m-banner .banner-content {
  position: absolute;
  top: 50%;
  left: 5%;
  transform: translateY(-50%);
  color: #fff;
  max-width: 500px;
  z-index: 2;
  text-align: left;
}

/* ARABIC */
.m-banner .arabic {
  font-size: 50px;
  font-weight: 500;
  margin-bottom: 10px;
  color: #114c5c;
}

/* ENGLISH HIGHLIGHT */
.m-banner .highlight {
  display: inline-block;
  background: transparent;
  padding: 8px 15px;
  font-size: 56px;
}

/* BUTTON */
.m-banner .donate-btn {
  display: inline-block;
  margin-top: 20px;
  background: #fff;
  color: #333;
  padding: 10px 20px;
  border-radius: 30px;
  text-decoration: none;
}

/* ARROWS */
.m-banner .swiper-button-prev,
.m-banner .swiper-button-next {
  color: red;
}

/* RESPONSIVE */
@media (max-width: 768px) {
  .m-banner {
    height: 400px;
  }

  .m-banner .banner-content {
    right: 5%;
    left: 5%;
    text-align: center;
  }

  .m-banner .arabic {
    font-size: 21px;
  }

  .m-banner .highlight {
    font-size: 18px;
  }
}
.m-banner .banner-item{ border-radius: 0;
  overflow: hidden; }


























.new-header-wrap {
    width: 100%;
    background: #fff;
    border-bottom: 1px solid #eee;
}



/* Top Header */
.new-header-wrap .top-header {
    padding: 2px 0 10px 0;
}

.new-header-wrap .logo-section {
    width: 284px;
}

.new-header-wrap .main-logo { height: 60px; }
.new-header-wrap .star-logo { height: 50px; }

.new-header-wrap .search-box {
    position: relative;
    border: 1.5px solid #c5a059; /* Gold border */
    border-radius: 8px;
    padding: 5px 15px;
    display: flex;
    width: 300px;
}

.new-header-wrap .search-box input {
    border: none;
    outline: none;
    width: 100%;
    padding: 8px 0;
    color: #666;
}

.new-header-wrap .search-btn {
    background: none;
    border: none;
    cursor: pointer;
    font-size: 18px;
    color: #333;
}

/* Nav Bar */
.new-header-wrap .nav-bar {
    background: #15999b21;
    padding: 0;
}

.new-header-wrap .nav-links {
    list-style: none;
    display: flex;
    margin: 0;
    padding: 0;
}

.new-header-wrap .nav-links li {
    position: relative;
}

.new-header-wrap .nav-links a {
    text-decoration: none;
    color: #114c5c;
    font-weight: 500;
    padding: 15px 19px 15px 0px;
    display: block;
    font-size: 18px;
    transition: 0.3s;
}

.new-header-wrap .nav-links a:hover,
.new-header-wrap .nav-links a.active {
    color: #114c5c;
}

/* Dropdown Logic */
.new-header-wrap .dropdown-menu {
    position: absolute;
    top: 100%;
    left: 0;
    background: #fff;
    box-shadow: 0 4px 10px rgba(0,0,0,0.1);
    list-style: none;
    min-width: 200px;
    display: none;
    z-index: 1000;
}

.new-header-wrap .dropdown:hover .dropdown-menu {
    display: block;
}

.new-header-wrap .header-icons {
    display: flex;
    gap: 20px;
    font-size: 20px;
    color: #c5a059;
}

.new-header-wrap .mobile-toggle {
    display: none;
    font-size: 30px;
    background: none;
    border: none;
    cursor: pointer;
}

/* Responsive Mobile Styles */
@media (max-width: 991px) {
    .new-header-wrap .mobile-toggle { display: block; }
    .new-header-wrap .search-container { display: none; } /* Hide search on small mobile */

    .new-header-wrap .nav-bar {
        position: fixed;
        right: -100%; /* Start hidden on right */
        top: 0;
        height: 100vh;
        width: 280px;
        background: #fff;
        z-index: 2000;
        transition: 0.4s;
        box-shadow: -5px 0 15px rgba(0,0,0,0.1);
        display: block;
    }

    .new-header-wrap .nav-bar.active { right: 0; }

    .new-header-wrap .nav-links {
        flex-direction: column;
        padding-top: 60px;
    }

    .new-header-wrap .dropdown-menu {
        position: static;
        box-shadow: none;
        background: #f9f9f9;
        padding-left: 20px;
    }

    .new-header-wrap .menu-overlay {
        display: none;
        position: fixed;
        top:0; left:0; width:100%; height:100%;
        background: rgba(0,0,0,0.5);
        z-index: 1500;
    }
    
    .new-header-wrap .menu-overlay.active { display: block; }
}





.top-header-logos-w{display:flex;justify-content: space-between;align-items: center;}








 .uae-logo-s img{
  width: 80px;
}

.nav-flex {display:flex;justify-content: space-between;align-content: center;align-items: center;}

.dropdown-menu li a{padding: 10px 15px!important;font-size: 17px !important;}
.dropdown-menu li a:hover{ background-color:#f8f8f8; }





/* Tooltip Container */
.new-header-wrap .tooltip-trigger {
    position: relative;
    display: inline-flex;
    align-items: center;
    cursor: pointer;
}

/* Tooltip Bubble */
.new-header-wrap .tooltip-trigger::before {
    content: attr(data-tooltip);
    position: absolute;
    top: 140%; /* Position below the icon */
    left: 50%;
    transform: translateX(-50%) translateY(10px);
    background-color: #1a1c1e; /* Dark grey/black */
    color: #fff;
    padding: 8px 20px;
    border-radius: 6px;
    font-size: 14px;
    font-weight: 500;
    white-space: nowrap;
    opacity: 0;
    visibility: hidden;
    transition: all 0.2s ease-in-out;
    z-index: 999;
}

/* Tooltip Arrow (The triangle) */
.new-header-wrap .tooltip-trigger::after {
    content: "";
    position: absolute;
    top: 140%;
    left: 50%;
    transform: translateX(-50%) translateY(0);
    border-width: 6px;
    border-style: solid;
    border-color: transparent transparent #1a1c1e transparent; /* Points up */
    opacity: 0;
    visibility: hidden;
    transition: all 0.2s ease-in-out;
    z-index: 999;
    margin-top: -11px; /* Adjust to sit perfectly on top of bubble */
}

/* Hover State */
.new-header-wrap .tooltip-trigger:hover::before,
.new-header-wrap .tooltip-trigger:hover::after {
    opacity: 1;
    visibility: visible;
    transform: translateX(-50%) translateY(0);
}

/* Ensure SVG icons match the gold color */
.new-header-wrap .header-icons svg {
    transition: transform 0.2s;
}

.new-header-wrap .header-icons a:hover svg {
    transform: scale(1.1);
}

.hero-video-gold { margin-top:15px; }

.breadcrumb-item + .breadcrumb-item::before {
  float: left;
  padding-right: var(--bs-breadcrumb-item-padding-x);
  color: var(--bs-breadcrumb-divider-color);
  content: "/";
}

.pt-6{ padding-top:15px; }

.service-entry h6{ margin-bottom:10px; }

.p-lft {
  padding: 0 20px 0 0;
}







.don-wi {
    background: #f5f4ef;
    padding: 35px;
    border-radius: 15px;
}

/* Title */
.don-wi .title {
    font-weight: 500;
    font-size: 14px;
    margin-bottom: 33px;
}
.don-wi .title span {
    color: red;
}

/* Checkbox Grid */
.don-wi .checkbox-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 25px 60px;
    margin-bottom: 30px;
}

.don-wi .check-item {
    display: flex;
    align-items: flex-start;
    gap: 10px;
    font-size: 16px;
    color: #333;
}

/* Custom Checkbox */
.don-wi .check-item input[type="checkbox"] {
    width: 20px;
    height: 20px;
    cursor: pointer;
    background-color: aqua;
}

/* Description Label */
.don-wi .desc-label {
    font-weight: 500;
    margin-bottom: 10px;
}

/* Textarea */
.don-wi textarea {
    width: 100%;
    height: 200px;
    border-radius: 20px;
    border: none;
    background: #fff;
    padding: 20px;
    resize: none;
    font-size: 15px;
}

/* Responsive */
@media (max-width: 768px) {
    .don-wi .checkbox-grid {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 480px) {
    .don-wi .checkbox-grid {
        grid-template-columns: 1fr;
    }
}




.dnt-fms select {
  word-wrap: normal;
  font-size: 16px;
  font-weight: 400;
  line-height: 1.5em;
  color: var(--primary-color);
  background: #F5F4EF;
  border: none;
  border-radius: 10px;
  padding: 18px 20px;
  box-shadow: none;
  outline: none;
  width: 100%;
}


.mt-30{ margin-top:30px; }
.imp-nts h6{ margin-bottom:10px; }
.imp-nts ul{ padding-left:15px; }
.imp-nts li{ line-height:25px; }


.Critical-Cases-w{ padding:20px 0 50px 0; background: linear-gradient(0deg,rgb(255, 255, 255) 0%, rgba(159, 206, 207, 0.2) 50%, rgb(255, 255, 255) 100%);}

.Critical-Cases-w .donation-card{ margin:15px 0 }




.dn-details-p {
    background: #f5f4ef;
    padding: 30px;
    max-width: 100%;
    margin: auto;
    border-radius: 15px;
    padding: 22px;
    border-radius: 15px;
    background: #f6fbfc;
    border: 1px solid #dceef2;
    margin-bottom: 24px;
    box-shadow: rgba(15, 58, 47, 0.06) 0px 12px 35px;
    transition: 0.35s;
    border: 1px solid rgba(21, 153, 155, 0.49);
}

/* Title */
.dn-details-p h1 {
    font-size: 21px;
    margin-bottom: 10px;
}

/* Description */
.dn-details-p .desc {
    color: #444;
    line-height: 1.6;
    margin-bottom: 20px;
    font-weight: 500;
}

/* Info Row */
.dn-details-p .info-row {
    display: flex;
    justify-content: space-between;
    border-top: 1px solid #ddd;
    border-bottom: 1px solid #ddd;
    padding: 15px 0;
    margin-bottom: 20px;
}

.dn-details-p .info-box {
    flex: 1;
}

.dn-details-p .info-box strong {
    display: block;
    margin-bottom: 5px;
}

/* Form Row */
.dn-details-p .form-row {
    display: flex;
    gap: 15px;
    flex-wrap: wrap;
    margin-bottom: 20px;
}

.dn-details-p .input-box {
    flex: 1;
}

.dn-details-p input {
    width: 100%;
    padding: 7px;
    border-radius: 8px;
    border: 1px solid #158e96cf;
    font-size: 16px;
}

/* Quantity */
.dn-details-p .qty-box {
    display: inline-block;
    align-items: center;
    border: 1px #ccc solid;
    border-radius: 8px;
    overflow: hidden;
}

.dn-details-p .qty-box button {
    width: 43px;
    height: 43px;
    border: none;
    background: #15999b;
    font-size: 18px;
    cursor: pointer;
    color: #fff;
}

.dn-details-p .qty-box input {
    width: 50px;
    text-align: center;
    border: none;
    border-radius: 0;
}

/* Buttons */
.dn-details-p .btn-row {
    display: flex;
    gap: 15px;
    margin-top: 20px;
}

.dn-details-p .btn {
    flex: 1;
    padding: 15px;
    border-radius: 8px;
    border: none;
    font-size: 17px;
    cursor: pointer;
    background-color: #114c5c;
    color: #fff;
    font-weight: 500;
    background: linear-gradient(135deg, rgb(13, 100, 119), rgb(24, 167, 184));
    color: rgb(255, 255, 255);
    box-shadow: rgba(24, 167, 184, 0.25) 0px 16px 32px;
}

.dn-details-p .cart {
    background: rgba(255,255,255,.88);
    color: #15999b;
    border: 1.5px solid #15999ba6;
}

.dn-details-p .donate {
    background: transparent;
    border: 2px solid #3aa0b2;
    color: #3aa0b2;
}

.sr-imgs img{ border-radius:15px; width:100%  }

.case-detail-badge {
    position: absolute;
    left: 18px;
    top: 18px;
    z-index: 5;
    background: linear-gradient(135deg, #159aa3, #087489);
    color: #fff;
    border-radius: 11px;
    padding: 10px 16px;
    font-size: 16px;
    font-weight: 500;
    box-shadow: 0 12px 28px rgba(8,116,137,0.25);
}
.fs-13{ font-size:13px!important; }

.input-box label{ margin-bottom:9px; width: 100%;font-size: 16px;}

.news-w{ padding:50px 0 50px 0; }

/* Responsive */
@media(max-width:600px){
    .dn-details-p .info-row {
        flex-direction: inherit;
        gap: 10px;
    }
    .dn-details-p .btn-row {
        flex-direction: column;
    }
}





.shar-pop-btn {
    position: absolute;
    bottom: 20px;
    right: 20px;
    z-index: 999;
}

/* Main Button */
.shar-pop-btn .main-btn {
    width: 45px;
    height: 45px;
    border-radius: 50%;
    background: #15999b;
    color: #fff;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 20px;
    cursor: pointer;
}

/* Popup */
.shar-pop-btn .share-box {
    position: absolute;
    bottom: 47px;
    right: 0;
    width: 45px;
    background: #114c5c;
    border-radius: 30px;
    padding: 10px 0;
    display: none;
    flex-direction: column;
    align-items: center;
    gap: 10px;
}

/* Show */
.shar-pop-btn.active .share-box {
    display: flex;
}

/* Icons */
.shar-pop-btn .share-box a {
    color: #fff;
    font-size: 16px;
    text-decoration: none;
}

/* Divider */
.shar-pop-btn .divider {
    width: 30px;
    height: 1px;
    background: rgba(255,255,255,0.3);
}


.page-services .service-item {
  background-color: #F5F4EF;
}


.service-item {

  min-height: auto;}



/* MAIN WRAPPER */
.submit-wraps {
    max-width: 100;
    margin: 0px auto;
    padding: 0;
    line-height: 1.6;
    color: #333;
}

/* CARD STYLE */
.submit-wraps .card {
    background: #fff;
    border-radius: 12px;
    padding: 10px 25px;
    margin-bottom: 15px;
    box-shadow: 0 4px 15px rgba(0, 0, 0, 0);
}

/* HEADINGS */
.submit-wraps h2 {
    font-size: 22px;
    margin-bottom: 15px;
    color: #222;
    border-left: 4px solid #15999b;
    padding-left: 10px;
    margin-top: 18px;
}

.submit-wraps h3 {
    font-size: 20px;
    margin: 15px 0 10px;
    color: #114c5c;
}

/* LIST STYLE */
.submit-wraps ul {
    padding-left: 20px;
}

.submit-wraps ul li {
    margin-bottom: 6px;
}

.submit-wraps ul li strong {
    color: #4d4d4d;
}

/* NOTICE BOX */
.submit-wraps .notice {
    background: #f5f4ef;
    padding: 15px;
    border-left: 5px solid #15999b;
    border-radius: 8px;
    font-size: 17px;
}

/* AGREEMENT */
.submit-wraps .agreement {
    display: flex;
    align-items: flex-start;
    gap: 10px;
    margin-top: 20px;
    font-size: 17px;
}

.submit-wraps input[type="checkbox"] {
    width: 18px;
    height: 18px;
    margin-top: 4px;
}

/* BUTTON */
.submit-wraps .btn {
    margin-top: 13px;
    padding: 12px 25px;
    background: #15999b;
    color: #fff;
    border: none;
    border-radius: 5px;
    cursor: pointer;
    font-size: 17px;
    transition: 0.3s;
}

.submit-wraps .btn:hover {
    background: #114c5c;
}

/* RESPONSIVE */
@media (max-width: 768px) {
    .submit-wraps {
        padding: 0;
    }
}










/* MAIN WRAPPER */
.track-wrap {
    max-width: 800px;
    margin: 0px auto;
    padding: 0px 20px;
    text-align: center;
}

/* HEADING */
.track-wrap .title {
    font-size: 20px;
    color: #333;
    margin-bottom: 30px;
}

/* FORM BOX */
.track-wrap .track-box {
    background: #fff;
    padding: 30px 25px;
    border-radius: 15px;
    box-shadow: 0 8px 25px rgba(0,0,0,0.08);
}

/* LABEL */
.track-wrap label {
    display: block;
    text-align: left;
    font-weight: 500;
    margin-bottom: 10px;
    color: #444;
    font-size: 15px;
}

.track-wrap label span {
    color: red;
}

/* INPUT */
.track-wrap input {
    width: 100%;
    padding: 18px 20px;
    border-radius: 8px;
    border: 1px solid #ddd;
    background: #f5f4ef00;
    font-size: 15px;
    outline: none;
    transition: 0.3s;
    margin-top: 10px;
}

.track-wrap input:focus {
    border-color: #007bff;
    background: #fff;
    box-shadow: 0 0 0 3px rgba(0,123,255,0.1);
}

/* BUTTON */
.track-wrap .btn-track {
    margin-top: 25px;
    padding: 12px 35px;
    border-radius: 6px;
    border: ;
    background: #15999b;
    color: #fff;
    font-size: 17px;
    cursor: pointer;
    transition: 0.3s;
    background: linear-gradient(135deg, #0d5262, #19a4a9);
    color: #fff;
    border-color: transparent;
    box-shadow: 0 12px 24px rgba(21,154,163,.18);
}

.track-wrap .btn-track:hover {
    color: #fff;
    transform: translateY(-1px);
    box-shadow: 0 14px 30px rgba(7, 156, 161, .28);
}

/* RESPONSIVE */
@media (max-width: 600px) {
    .track-wrap .track-box {
        padding: 20px;
    }
}








/* MAIN WRAPPER */
.magazine-wrap {
    max-width: 100%;
    margin: 0px auto;
    padding: 0;
    grid-template-columns: repeat(auto-fit, minmax(260px, 2fr));
    gap: 30px;
}

/* CARD */
.magazine-wrap .mag-card {
    background: #f5f4ef;
    border-radius: 10px;
    padding: 8px;
    text-align: center;
    transition: 0.3s;
    box-shadow: 0 5px 15px rgba(0,0,0,0.05);
    margin-bottom: 10px;
    background: #ffffff;
    border: 1px solid #dceef2;
    border-radius: 10px;
    padding: 18px;
    box-shadow: 0 12px 28px rgba(13, 64, 84, 0.04);
    transition: 0.3s ease;
}

.magazine-wrap .mag-card:hover {
    transform: translateY(-8px);
    box-shadow: 0 15px 30px rgba(0,0,0,0.1);
}

/* IMAGE */
.magazine-wrap .mag-img {
    width: 100%;
    height: 220px;
    background: #ddd;
    border-radius: 10px;
    margin-bottom: 15px;
    overflow: hidden;
}

.magazine-wrap .mag-img img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

/* TITLE */
.magazine-wrap .mag-title {
    font-size: 18px;
    font-weight: 500;
    color: #333;
    margin-bottom: 15px;
    line-height: 25px;
}

/* BUTTON */
.magazine-wrap .mag-btn {
    display: inline-block;
    width: 100%;
    padding: 12px;
    background: #15999b;
    color: #fff;
    border-radius: 6px;
    text-decoration: none;
    font-weight: 500;
    transition: 0.3s;
    background: linear-gradient(135deg, #0d6477, #18a7b8);
    color: #fff;
    box-shadow: 0 16px 32px rgba(24, 167, 184, 0.25);
}

.magazine-wrap .mag-btn:hover {
    transform: translateY(-1px);
    box-shadow: 0 14px 30px rgba(7, 156, 161, .28);
}

/* OPTIONAL BADGE */
.magazine-wrap .badge {
    position: absolute;
    top: 15px;
    left: 15px;
    background: #176b43;
    color: #fff;
    font-size: 12px;
    padding: 5px 10px;
    border-radius: 20px;
}

/* CARD RELATIVE */
.magazine-wrap .mag-card {
    position: relative;
}

.mag-title p{ margin-bottom:5px; font-size:16px; }





/* MAIN WRAPPER */
.banks-s--wrap {
    max-width: 800px;
    margin: 0px auto 20px auto;
    padding: 20px 0px;
    text-align: center;
}

/* LOGO */
.banks-s--wrap .bank-logo img {
    max-width: 260px;
    margin-bottom: 20px;
}

/* TITLE */
.banks-s--wrap .bank-title {
    font-size: 24px;
    font-weight: 500;
    color: #333;
    margin-bottom: 15px;
}

/* DIVIDER */
.banks-s--wrap .divider {
    width: 120px;
    height: 3px;
    background: #6b4b2a;
    margin: 10px auto 25px;
    border-radius: 5px;
}

/* DETAILS BOX */
.banks-s--wrap .bank-box {
    background: #f5f4ef;
    padding: 25px;
    border-radius: 10px;
    /*! box-shadow: 0 8px 20px rgba(0,0,0,0.05); */
}

/* ROW */
.banks-s--wrap .bank-row {
    display: flex;
    justify-content: space-between;
    padding: 10px 0;
    border-bottom: 1px solid #ddd;
}

.banks-s--wrap .bank-row:last-child {
    border-bottom: none;
}

/* LABEL & VALUE */
.banks-s--wrap .label {
    font-weight: 500;
    color: #555;
}

.banks-s--wrap .value {
    font-weight: 500;
    color: #222;
    letter-spacing: .5px;
}

/* BUTTON WRAP */
.banks-s--wrap .btn-wrap {
    display: flex;
    justify-content: center;
    gap: 20px;
    margin-top: 25px;
}

/* BUTTON */
.banks-s--wrap .bank-btn {
    padding: 12px 25px;
    background: #15999b;
    color: #fff;
    border-radius: 7px;
    text-decoration: none;
    transition: 0.3s;
    font-weight: 500;
}

.banks-s--wrap .bank-btn:hover {
    background: #0f4d31;
}

/* RESPONSIVE */
@media (max-width: 600px) {
    .banks-s--wrap .bank-row {
        flex-direction: column;
        align-items: flex-start;
        gap: 5px;
    }

    .banks-s--wrap .btn-wrap {
        flex-direction: column;
    }
}



.open-datas h5{ margin-bottom:10px; }
.open-datas ul{ padding-left:15px; margin-bottom:25px;  }
.open-datas ul li{ margin-bottom:5px; }

.dd-wrp{display: flex; gap: 10px;}

.open-datas  .mag-title {
  font-size: 18px;
  font-weight: 500;
  color: #333;
  margin-bottom: 6px;
  line-height: 25px;
}

.open-datas h6{ margin-bottom:10px; }




.abt-msg-wrap {
  padding: 0;
  background-color: #ffffff;
  display: flex;
  justify-content: center;
  align-items: center;
  padding-bottom: 40px;
}

.content-inner {
  max-width: 80%;
  width: 100%;
  text-align: center;
  margin: 0 auto;
  background-color: #f5f4ef;
  padding: 50px 35px;
  border-radius: 15px;
  box-shadow: 0 15px 45px rgba(0,0,0,0.03);
}

.header-group {
  margin-bottom: 20px;
}

.subtitle {
  display: block;
  text-transform: uppercase;
  letter-spacing: 3px;
  font-size: 0.8rem;
  color: #a18262; /* Subtle gold/bronze accent */
  margin-bottom: 10px;
}

.main-title {
   /* Or any elegant serif font */
}

.accent-line {
  width: 60px;
  height: 3px;
  background: #2c3e50;
  margin: 20px auto 0;
}

.message-body {
  position: relative;
  padding: 0;
  background: transparent;
  border-radius: 4px;
}

.quote-icon {
  position: absolute;
  top: -20px;
  left: 50%;
  transform: translateX(-50%);
  font-size: 80px;
  font-family: var(--default-font);
  color: #e0e6ed;
  line-height: 1;
  background: #f9fbfd;
  padding: 0 15px;
}

.message-body p {
  font-size: 1.15rem;
  line-height: 1.8;
  color: #546e7a;
  margin-bottom: 25px;
}

.message-body strong {
  color: #2c3e50;
}

.closing-statement {
  border-top: 1px solid #e0e6ed;
  padding-top: 20px;
  font-style: italic;
  color: #2c3e50;
  font-weight: 500;
}

/* Responsive adjustment */
@media (max-width: 768px) {
  .main-title { font-size: 2rem; }
  .message-body { padding: 30px 20px; }
}








abt-stage-wrap {
    max-width: 1200px;
    margin: 50px auto;
    padding: 20px;
    font-family: var(--default-font);
    color: #333;
}

.header-content {
    text-align: center;
    margin-bottom: 60px;
}

.title {
    font-size: 2.5rem;
    color: #2c3e50;
    margin-bottom: 10px;
}

.separator {
    width: 80px;
    height: 3px;
    background: #8e735b;
    margin: 0 auto 20px;
}

.intro-text {
    max-width: 700px;
    margin: 0 auto;
    font-size: 1.1rem;
    color: #666;
    line-height: 1.6;
}

.activities-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 30px;
}

.activity-card {
    background: #fff;
    border-radius: 15px;
    padding: 40px 30px;
    position: relative;
    box-shadow: 0 10px 30px rgba(0,0,0,0.05);
    border: 1px solid #f0f0f0;
    transition: transform 0.3s ease;
}


/* Make Financial Aid span full width or larger area */
.financial {
    grid-column: span 2;
    background: linear-gradient(to bottom right, #ffffff, #fdfbf9);
}

.card-badge {
    position: absolute;
    top: -15px;
    left: 30px;
    background: #8e735b;
    color: white;
    padding: 5px 20px;
    border-radius: 20px;
    font-size: 0.8rem;
    text-transform: uppercase;
    font-weight: 500;
}

.activity-card h3 {
    margin-top: 10px;
    margin-bottom: 25px;
    color: #2c3e50;
    font-size: 1.5rem;
    border-bottom: 2px solid #f0f0f0;
    padding-bottom: 10px;
}

.benefit-list {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(400px, 1fr));
    gap: 12px;
    list-style: none;
    padding: 0;
    font-size: ;
}

.benefit-list li {
    padding-left: 20px;
    position: relative;
    font-size: 18px;
    color: #555;
}

.benefit-list li::before {
    content: ;
    color: #8e735b;
    font-weight: 500;
    position: absolute;
    left: 0;
}

.auth-tag {
    display: inline-block;
    margin-top: 20px;
    font-size: 0.8rem;
    background: #f5f4ef;
    color: #15999b;
    padding: 4px 12px;
    border-radius: 4px;
    font-weight: 500;
}

@media (max-width: 768px) {
    .activities-grid { grid-template-columns: 1fr; }
    .financial { grid-column: span 1; }
}

.pdg-80{ padding:80px 0; }


.ptoject-wr .donate-row {
  margin-bottom: 0;
}

.ptoject-wr  .amounts {
  margin-bottom: 0;
  padding: 15px 10px;
  border-radius: 10px;
  background: rgb(246, 251, 252);
  border: 1px solid rgb(193, 218, 224);
  margin-bottom: 0;
  margin-bottom: 15px;
}

.prog-cntnt p {
  min-height: 78px;
}



.dnt-1-wrap {
  padding: 0;
  display: flex;
  justify-content: center;
  background: transparent;
  margin-top: 25px;
}

.selection-card {
  background: #f5f4ef;
  padding: 30px;
  border-radius: 15px;
  max-width: 100%;
  width: 100%;
  padding: 22px;
  border-radius: 15px;
  background: #e9f6f68f;
  border: 1px solid #dceef2;
  margin-bottom: 24px;
  box-shadow: rgba(15, 58, 47, 0.06) 0px 12px 35px;
  transition: 0.35s;
  border: 1px solid rgba(21, 153, 155, 0.49);
}

/* Provider Toggle Styles */
.provider-toggle {
  display: flex;
  justify-content: center;
  gap: 10px;
  margin-bottom: 8px;
}

.provider-option input {
  display: none; /* Hide actual radio button */
}

.provider-box {
  padding: 0;
  border: 2px solid #fff;
  border-radius: 8px;
  cursor: pointer;
  transition: all 0.3s ease;
  filter: ;
  opacity: 10;
  overflow: hidden;
}

.provider-box img {
  height: 44px;
  display: block;
}

/* Selected Provider State */
.provider-option input:checked + .provider-box {
  border-color: #15999b; /* Accent color */
  filter: grayscale(0);
  opacity: 1;
  background: #15999b17;
  transform: translateY(-3px);
}

.divider {
  height: 1px;
  background: #eee;
  margin: 20px 0;
}

/* Amount Grid Styles */
.amount-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 12px;
}

.amount-item input {
  display: none;
}

.amount-item span {
  display: flex;
  align-items: center;
  justify-content: center;
  height: 49px;
  border: 1px solid #15999b9c;
  border-radius: 6px;
  font-size: 17px;
  font-weight: 500;
  color: #114c5c;
  cursor: pointer;
  transition: all 0.2s ease;
  background-color: white;
}

/* Hover & Selected Amount State */
.amount-item:hover span {
  background: #f9f9f9;
  border-color: #ccc;
}

.amount-item input:checked + span {
  background: #15999b;
  color: #fff;
  border-color: #15999b;
  box-shadow: 0 4px 12px rgba(21, 153, 155, 0);
}

@media (max-width: 480px) {
  .amount-grid { grid-template-columns: repeat(3, 1fr); gap: 10px;margin-bottom: 0;}
}






.cart-wrp {
  background-color: transparent;
  padding: 0;
}

.cart-container {
  max-width: 100%;
  margin: 0 auto;
  /*! display: grid; */
  grid-template-columns: 1fr 340px;
  gap: 30px;
  align-items: start;
}

/* Item Card Design */
.cart-item {
  background: #f5f4ef;
  padding: 24px;
  border-radius: 10px;
  box-shadow: 0 4px 12px rgba(0,0,0,0.03);
  display: flex;
  align-items: center;
  gap: 20px;
  position: relative;
}

.item-icon-box {
  width: 60px;
  height: 60px;
  background: #e0f2fe;
  border-radius: 12px;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #0ea5e9;
}

.item-details h3 {
  margin: 0;
  font-size: 1.1rem;
  color: #1e293b;
}

.category-tag {
  font-size: 0.85rem;
  color: #64748b;
}

/* Quantity Controls */
.quantity-controls {
  display: flex;
  align-items: center;
  background: #f1f5f9;
  border-radius: 50px;
  padding: 4px;
  margin-left: auto;
}

.qty-btn {
  width: 32px;
  height: 32px;
  border: none;
  background: white;
  border-radius: 50%;
  cursor: pointer;
  font-weight: 500;
  box-shadow: 0 2px 4px rgba(0,0,0,0.05);
}

.quantity-controls input {
  width: 40px;
  border: none;
  background: transparent;
  text-align: center;
  font-weight: 500;
}

/* Price & Remove */
.price-display {
  text-align: right;
  min-width: 120px;
  /*! display: flex; */
  /*! gap: 5px; */
}

.price-display .amount {
  font-weight: 500;
  color: #0f172a;
}

.remove-item {
  background: #fee2e2;
  color: #ef4444;
  border: none;
  width: 28px;
  height: 28px;
  border-radius: 50%;
  cursor: pointer;
  font-size: 0.8rem;
}

/* Sidebar Styling */
.cart-summary {
  background: #38b2ac;
  border-radius: 10px;
  overflow: hidden;
  /*! box-shadow: 0 10px 25px rgba(0,0,0,0.05); */
  border: solid 1px #ccc;
}

.summary-header {
  background: #114c5c;
  color: white;
  padding: 20px;
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.action-buttons {
  padding: 20px 0;
  display: flex;
  flex-direction: column;
  gap: 12px;
}

.btn {
  padding: 14px;
  border-radius: 8px;
  border: none;
  font-weight: 500;
  cursor: pointer;
  transition: 0.2s;
}

.btn-primary { background: #1e293b; color: white; }
.btn-secondary { background: #334155; color: white; }
.btn-dark { background: #0f172a; color: white; }

.btn:hover { opacity: 0.9; transform: translateY(-1px); }

.payment-partners {
  padding: 20px;
  border-top: 1px solid #f1f5f9;
  text-align: center;
}

.partner-logos {
  display: flex;
  justify-content: center;
  gap: 15px;
  margin-top: 10px;
}

/* Responsive adjustment */
@media (max-width: 900px) {
  .cart-container { grid-template-columns: 1fr; }
  .cart-item { flex-wrap: wrap; }
}










/* ... Previous styles included ... */

.select-btn {
  padding: 14px;
  border-radius: 10px;
  border: 2px solid #e2e8f0;
  background: white;
  color: #1e293b;
  font-weight: 500;
  cursor: pointer;
  transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1);
  text-align: center;
}

/* The Active Select State */
.select-btn.active {
  background: #114c5c;
  color: white;
  border-color: #1e293b;
  transform: scale(1.02);
  box-shadow: 0 4px 12px rgba(0,0,0,0.1);
}

.logo-box {
  width: 45px;
  height: 35px;
  border: 1px solid #e2e8f0;
  border-radius: 6px;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  transition: 0.2s;
}

.logo-box.selected {
  border-color: #38b2ac;
  background: #e6fffa;
  transform: translateY(-3px);
}

.qty-btn:active {
  transform: scale(0.9);
  background: #e2e8f0;
}






.login01-wrap {
  min-height: auto;
  display: flex;
  align-items: center;
  justify-content: center;
  background: transparent;
  padding: 0;
}

.login-card {
  display: flex;
  background: white;
  width: 100%;
  max-width: 500px;
  border-radius: 15px;
  overflow: hidden;
  box-shadow: ;
  border: solid 1px #d0cdbe;
}

/* Brand Side Styling */
.brand-side {
  flex: 1;
  background: #ff8a3d; /* Vibrant Orange */
  padding: 60px;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  position: relative;
}

.brand-side h1 {
  color: white;
  font-size: 2.5rem;
  line-height: 1.2;
  margin-bottom: 20px;
}

.brand-side h1 span {
  text-decoration: underline;
}

.brand-side p {
  color: rgba(255,255,255,0.9);
  max-width: 300px;
}

.illustration-box img {
  width: 100%;
  height: auto;
  margin-top: 40px;
}

/* Form Side Styling */
.form-side {
  flex: 1;
  padding: 37px;
  display: flex;
  align-items: center;
  background-color: #f5f4ef;
}

.form-inner { width: 100%; }

.form-inner h2 {
  font-size: 24px;
  color: #114c5c;
  margin-bottom: 1px;
  letter-spacing: 0.5px;
}

.form-inner p {color: #666;margin-bottom: 20px;font-size: 17px;}

.input-group { margin-bottom: 20px; position: relative; }

.input-group input {
  width: 100%;
  padding: 15px 20px;
  background: #fff;
  border: 1px solid transparent;
  border-radius: 9px;
  outline: none;
  transition: 0.3s;
  font-size: 16px;
}

.input-group input:focus {
  border-color: #ff8a3d;
  background: white;
}

.password-group .toggle-eye {
  position: absolute;
  right: 15px;
  top: 15px;
  border: none;
  background: none;
  cursor: pointer;
  opacity: 0.5;
}

.forgot-link {
  display: block;
  text-align: right;
  margin-top: 8px;
  color: #999;
  font-size: 0.85rem;
  text-decoration: none;
}

.login-submit {
  width: 100%;
  padding: 20px;
  background: #15999b;
  color: white;
  border: none;
  border-radius: 10px;
  font-weight: 500;
  font-size: 1rem;
  cursor: pointer;
  margin-top: 0px;
  transition: 0.3s;
}

.login-submit:hover {
  background: #114c5c;
  transform: translateY(-2px);
}

/* Social Login */
.social-divider {
  display: flex;
  align-items: center;
  margin: 30px 0;
  color: #0b0b0b;
  font-size: 0.85rem;
}

.social-divider::before, .social-divider::after {
  content: "";
  flex: 1;
  height: 1px;
  background: #114c5c;
}

.social-divider span { padding: 0 15px; }

.social-grid { display: flex; gap: 15px; }

.social-btn {
  flex: 1;
  padding: 12px;
  border: 1px solid #ddd;
  border-radius: 12px;
  background: white;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  cursor: pointer;
  transition: 0.2s;
}

.social-btn:hover { background: #f8f8f8; }

.form-footer {
  text-align: center;
  margin-top: 28px;
  color: #666;
  font-size: 15px;
}

.form-footer a {
  color: #15999b;
  font-weight: 500;
  text-decoration: none;
}

/* Mobile Responsiveness */
@media (max-width: 850px) {
  .login-card { flex-direction: column; }
  .brand-side { display: none; } /* Hide illustration on small screens */
}


.btn-row a{display: block; color: #15999b;padding: 15px;}
.btn-row .btn-outline a:hover{ color:#fff }

.donate-row button a{ color:#fff; display:block; }

.action-buttons .select-btn a{ color:#fff; display:block; }





.section-empty{ padding:80px 0; }

.section-empty .input_form{ margin-top:16px; }
.cart_img_content{display:flex;justify-content: space-between;}
.billing_text {
  
  font-weight: 500;
  margin: 0;
  font-size: 22px !important;
  color: #114c5c !important;
}

.yourCart_div {
}

.cart_img_content {
}

.food_img_price_des {
  display: flex;
  margin-bottom: 1rem;
}

.food_img_price_des .cart_food_img {
  width: 85px;
  height: 51px;
  overflow: hidden;
  border: 1px solid #d4d4d491;
  padding: 4px;
}

.food_img_price_des .cart_food_img img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.food_img_price_des .food_dec_flex {
  margin-left: 2rem;
}

.food_img_price_des .food_dec_flex p {
  color: #737373;
  margin: 0;
 
  font-weight: 500;
  font-size: 14px;
}

.food_img_price_des .food_dec_flex p:last-child {
  color: red;
}

.yourCart_div {
  border: 1px solid #d4d4d491;
  padding: 19px;
  margin-top: 16px;
  border-radius: 11px;
}

.cart_total {
}

.cart_total .price_total {
  display: flex;
  margin-bottom: 5px;
  justify-content: space-between;
}

.cart_total .price_total p {
  color: #737373;
  margin: 0;
  font-family: var(--default-font);
  font-weight: 500;
  font-size: 14px;
}

.total_btn_cart {
  width: 100%;
  background: #15999b !important;
  border-color: #15999b !important;
  padding: 16px 19px !important;
  display: flex;
  justify-content: space-between;
  color: #fff;
  font-weight: 500;
  border-style: unset;
 
  border-radius: 0 0 10px 10px;
}

.total_btn_cart:hover {
  background-color: #114c5c !important;
  border-color: #114c5c !important;
}

.cart_total {
  border: 1px solid #d4d4d491;
  padding: 8px 19px;
  border-top: 1px solid #ccc;
  border-radius: 10px 10px 0 0;
  margin-top: 15px;
}

.section-empty .input_form .form-group input,
.section-empty .input_form .form-group textarea {
  font-size: 16px;
  font-weight: 400;
  line-height: 1.5em;
  color: var(--primary-color);
  background: #F5F4EF;
  border: none;
  border-radius: 10px;
  padding: 18px 20px;
  box-shadow: none;
  outline: none;
}

.input_form .input_box_cart {
  margin-bottom: 15px;
}

.mb_23px {
  margin-bottom: 20px !important;
}

.text_center_button {
  justify-content: center;
}



.footer-parallax-container {
  margin-bottom: 0 !important;
  box-shadow: none;
  min-height: auto !important;
}

.footer-parallax {
  height: auto !important;
  position: relative !important;
  background-color: #f5f5f5 !important;
  z-index: 1;
}

.section-bg-image_full_height {
  background-image: url(../images/hd-8.png);
  background-attachment: fixed;
}



.bg_green {
  background-color: #4caf50 !important;
  border-color: #4caf50 !important;
}

.bg_green:hover {
  background-color: #4caf50 !important;
  border-color: #4caf50 !important;
}


.slts{
  background: #f5f4ef;
  padding: 20px 0;}




  .popup-donation {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  display: none;
  justify-content: center;
  align-items: center;
  background: linear-gradient(120deg, rgba(0,0,0,0.6), rgba(0,0,0,0.4));
  backdrop-filter: blur(6px);
  z-index: 999;
}

/* Modal */
.popup-donation .donation-modal {
  width: 90%;
  max-width: 720px;
  background: #fff;
  border-radius: 15px;
  padding: 25px;
  box-shadow: 0 20px 50px rgba(0,0,0,0.2);
  position: relative;
  animation: popFade 0.3s ease;
  overflow: scroll;
}

@keyframes popFade {
  from { transform: translateY(20px); opacity: 0; }
  to { transform: translateY(0); opacity: 1; }
}

/* Header */
.popup-donation h2 {
  text-align: center;
  font-weight: 500;
  font-size: 22px;
}

.popup-donation .case-id {
  text-align: center;
  background: #ffe9e1;
  color: #873c00;
  display: inline-block;
  padding: 9px 21px 7px 21px;
  border-radius: 6px;
  margin: 7px auto;
  font-weight: 500;
  line-height: 20px;
  display: inline-block;
  text-align: center;
}

.popup-donation .sub-text {
  text-align: center;
  margin: 15px 0 22px;
  color: #555;
}

/* Layout */
.donation-grid {
  display: flex;
  gap: 30px;
}

.left, .right {
  flex: 1;
}

/* Input */
.popup-donation input[type="number"] {
  width: 100%;
  padding: 14px;
  border-radius: 30px;
  border: none;
  background: #e0e0e0;
  box-shadow: inset 3px 3px 6px #cfcfcf,
              inset -3px -3px 6px #ffffff;
  margin: 10px 0 20px;
  text-align: ;
  font-size: 16px;
  font-size: 16px;
  font-weight: 400;
  line-height: 1.5em;
  color: var(--primary-color);
  background: #F5F4EF;
  border: none;
  border-radius: 7px;
  padding: 11px 20px;
  box-shadow: none;
  outline: none;
  border: solid 1px #aea88c;
  width: 100%;
  min-height: 54px;
  border: 1px solid #b2c2cb;
  border-radius: 9px;
  background: #fff;
  padding: 13px 15px;
  color: #394b58;
  font-size: 15px;
  outline: none;
  transition: 0.3s;
}

/* Divider */
.divider {
  height: 1px;
  background: #ccc;
  margin: 20px 0;
}

/* Radios */
.radio-row {
  display: flex;
  gap: 20px;
}

.pay-list label,
.radio-row label {
  display: flex;
  align-items: center;
  margin-bottom: 10px;
  cursor: pointer;
  background-color: transparent;
  padding: 13px;
  border: solid 1px #15999b;
  border-radius: 6px;
  margin-top: 12px;
  font-size: 16px;
  color: #454545;
}

.popup-donation input[type="radio"] {
  margin-right: 8px;
}

/* Button */
.donate-btn {
  margin-top: 15px;
  width: 100%;
  padding: 18px;
  border-radius: 10px;
  border: none;
  background: linear-gradient(45deg, #15999b, #15999b);
  color: #fff;
  font-weight: 500;
  cursor: pointer;
  transition: 0.3s;
  background: linear-gradient(135deg, #0d6477, #18a7b8);
  color: #fff;
  box-shadow: 0 16px 32px rgba(24, 167, 184, 0.25);
}

.donate-btn:hover {
  transform: translateY(-2px);
  box-shadow: 0 8px 20px rgba(0,0,0,0.2);
}

/* Close button bottom */
.close-btn {
  display: block;
  margin: 25px auto 0;
  padding: 10px 25px;
  background: #d9534f;
  color: #fff;
  border: none;
  border-radius: 6px;
  cursor: pointer;
}

/* Top close */
.close-x {
  position: absolute;
  right: 20px;
  top: 15px;
  font-size: 22px;
  cursor: pointer;
  background-color: #15999b;
  padding: 1px 8px 5px 8px;
  border-radius: 50%;
  color: #fff;
  font-size: 31px;
  line-height: 28px;
}

/* Open btn */
.open-btn {
  padding: 10px 20px;
  border: none;
  background: #6b4f3b;
  color: #fff;
  border-radius: 20px;
  cursor: pointer;
}

/* Responsive */
@media(max-width: 700px) {
  .donation-grid {
    flex-direction: column;
  }
}






.popup-donation {
  z-index: 9999;
}

.popup-donation .donation-modal {
  position: relative;
  z-index: 10000;
}
.popup-donation {
  pointer-events: auto;
  overflow: inherit;
}


.popup-donation .pp1 {
  width: 90%;
  max-width: 420px;}







.regi-wrap {
    background: #f5f4ef;
    padding: 60px 20px;
    text-align: center;
    border-radius: 20px;
}

/* Title */
.regi-wrap h1 {
    font-size: 25px;
    color: #114c5c;
    margin-bottom: 6px;
}

.regi-wrap p {
    color: #333;
    margin-bottom: 42px;
}

/* Options */
.regi-options {
    display: flex;
    justify-content: center;
    max-width: fit-content;
    margin: auto;
    gap: 20px;
}

.regi-card {
    width: 48%;
    padding: 40px 20px 20px 20px;
    border-radius: 11px;
    cursor: pointer;
    transition: 0.3s;
    background-color: #fff;
    width: auto;
    border: solid 1px #d7cabc;
}

.regi-card:hover {
    background: #f0ebe5;
}

/* Active selection */
.regi-card.active {
    border: 2px solid #8a6f52;
    background: #fffcf8;
}

/* Icon */
.regi-icon {
    font-size: 9px;
    color: #6bbf8a;
    margin-bottom: 0;
    width: auto;
    height: auto;
    /*! background-color: #2aa5a7; */
    padding: 0 15px;
    border-radius: 999px;
    display: initial;
    /*! border: solid 1px #fff; */
}

/* Label */
.regi-card h3 {
    font-size: 20px;
    color: #8a6f52;
    display: block;
    margin-top: 20px;
}

/* Button */
.regi-btn {
    margin-top: 40px;
}

.regi-btn button {
    padding: 12px 40px;
    border-radius: 6px;
    border: 2px solid #114c5c;
    background: #114c5c;
    font-size: 18px;
    cursor: pointer;
    transition: 0.3s;
    color: #fff;
}

.regi-btn button:hover {
    background: #5a3d1e;
    color: #fff;
}


/* Mobile */
@media(max-width:768px){
    .regi-options {
        flex-direction: column;
        gap: 20px;
    }

    .regi-card {
        width: 100%;
    }
}




.regi-card.active .regi-icon svg{
  color: #fff;}

  .regi-card.active h3 { color:#8a6f52; }


/* Default SVG color */
.regi-svg {
    width: 40px;
    height: 40px;
    stroke: #6bbf8a; /* green */
    transition: 0.3s;
}

/* Active state color change */
.regi-card.active .regi-svg {
    stroke: #5a3d1e; /* brown (same as theme) */
}

/* Optional: hover effect */
.regi-card:hover .regi-svg {
    stroke: #3e2a14;
}

.regi-btn .btn{ background-color:#114c5c; color: #fff;padding: 12px 33px;font-size: 18px;}


@media(max-width: 700px) {

.new-header-wrap .top-header {
  padding: 0px 0 0px 0;
}


}





/* MAIN WRAPPER */
.form-mn {
    background: #f4f4f4;
    padding: 20px;
}

/* CONTAINER */
.form-mn .form-box {
    max-width: 100%;
    margin: auto;
    background: #f5f4ef;
    padding: 25px;
    border-radius: 12px;
    box-shadow: 0;
}

/* TITLE */
.form-mn h2 {
    text-align: center;
    margin-bottom: 10px;
    color: #333;
}

.form-mn p {
    font-size: 16px;
    color: #5b5b5b;
    text-align: center;
    margin-bottom: 20px;
}

/* INPUT */
.form-mn input,
.form-mn select,
.form-mn textarea {
    width: 100%;
    padding: 12px;
    margin-bottom: 15px;
    border-radius: 30px;
    border: none;
    background: #eee;
    font-size: 14px;
}

.case-detail-modern {
  padding: 34px 0 42px;
  background: linear-gradient(180deg, #f6fbfd 0%, #ffffff 100%);
}

input[type="number"]::-webkit-outer-spin-button,
input[type="number"]::-webkit-inner-spin-button {
  -webkit-appearance: none;
  margin: 0;
}

input[type="number"] {
  appearance: textfield;
  -moz-appearance: textfield;
}

.case-detail-modern-container {
  max-width: 1440px;
}

.case-detail-modern-grid {
  display: grid;
  grid-template-columns: minmax(360px, 0.78fr) minmax(520px, 1.22fr);
  gap: 22px;
  align-items: stretch;
}

.case-story-card,
.case-donation-panel {
  background: #fff;
  border: 1px solid rgba(9, 105, 121, 0.1);
  border-radius: 18px;
  box-shadow: 0 18px 45px rgba(15, 73, 89, 0.08);
}

.case-story-card {
  padding: 14px;
}

.case-story-image {
  position: relative;
  overflow: hidden;
  border-radius: 14px;
  min-height: 330px;
  background: #eaf5f7;
}

.case-story-image img {
  width: 100%;
  height: 330px;
  object-fit: cover;
  display: block;
}

.case-story-badge {
  position: absolute;
  top: 16px;
  left: 16px;
  display: inline-flex;
  align-items: center;
  gap: 7px;
  padding: 10px 13px;
  border-radius: 10px;
  background: linear-gradient(135deg, #07828a, #00666f);
  color: #fff;
  font-size: 13px;
  font-weight: 800;
  box-shadow: 0 10px 25px rgba(0, 102, 111, 0.24);
}

.case-story-share {
  position: absolute;
  right: 16px;
  bottom: 16px;
  width: 48px;
  height: 48px;
  border: 0;
  border-radius: 50%;
  background: #007780;
  color: #fff;
  box-shadow: 0 12px 26px rgba(0, 119, 128, 0.28);
}

.case-story-share-list {
  position: absolute;
  right: 18px;
  bottom: 72px;
  display: grid;
  gap: 8px;
  opacity: 0;
  pointer-events: none;
  transform: translateY(10px);
  transition: 0.2s ease;
}

.case-story-share-list.active {
  opacity: 1;
  pointer-events: auto;
  transform: translateY(0);
}

.case-story-share-list a {
  width: 36px;
  height: 36px;
  border-radius: 50%;
  display: grid;
  place-items: center;
  background: #fff;
  color: #007780;
  box-shadow: 0 8px 20px rgba(15, 73, 89, 0.14);
}

.case-story-body {
  padding: 28px 12px 18px;
}

.case-story-body h1 {
  margin: 0 0 18px;
  color: #06465b;
  font-size: 23px;
  line-height: 1.2;
  font-weight: 500;
}

.case-story-body p {
  color: #29333f;
  font-size: 15px;
  line-height: 1.85;
}

.case-story-divider,
.case-panel-divider {
  height: 1px;
  background: rgba(11, 91, 105, 0.12);
  margin: 20px 0;
}

.case-benefits {
  display: grid;
  gap: 14px;
}

.case-benefit-item {
  display: grid;
  grid-template-columns: 58px 1fr;
  align-items: center;
  gap: 16px;
}

.case-benefit-item span {
  width: 54px;
  height: 54px;
  border-radius: 50%;
  display: grid;
  place-items: center;
  border: 1px solid rgba(0, 119, 128, 0.18);
  color: #007780;
  background: #f8ffff;
  font-size: 22px;
}

.case-benefit-item p {
  margin: 0;
  line-height: 1.55;
  font-weight: 600;
}

.case-donation-panel {
  padding: 34px 38px;
}

.case-donation-panel h2,
.case-amount-title {
  display: block;
  color: #06465b;
  font-size: 20px;
  line-height: 1.2;
  font-weight: 500;
  margin: 0 0 18px;
}

.case-progress-track {
  height: 34px;
  overflow: hidden;
  border-radius: 9px;
  background: #e9f1f5;
}

.case-progress-fill {
  min-width: 72px;
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 9px;
  background: linear-gradient(135deg, #07828a, #00666f);
  color: #fff;
  font-size: 15px;
  font-weight: 900;
}

.case-amount-summary {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 18px;
  margin-top: 24px;
}

.case-amount-summary div:last-child {
  text-align: right;
}

.case-amount-summary span {
  display: block;
  color: #29333f;
  font-size: 16px;
  font-weight: 600;
  margin-bottom: 8px;
}

.case-amount-summary strong {
  color: #007780;
  font-size: 22px;
  font-weight: 900;
}

.case-donate-box {
  display: grid;
  grid-template-columns: 1fr 160px;
  border: 1px solid rgba(0, 119, 128, 0.42);
  border-radius: 10px;
  overflow: hidden;
  min-height: 60px;
}

.case-donate-input-wrap {
  display: grid;
  grid-template-columns: 80px 1fr;
  align-items: center;
  background: #fff;
}

.case-donate-input-wrap span {
  padding-left: 26px;
  color: #5f6770;
  font-size: 16px;
  font-weight: 600;
}

.case-donate-input-wrap input {
  width: 100%;
  border: 0;
  outline: 0;
  color: #007780;
  font-size: 40px;
  line-height: 1;
  font-weight: 400;
  text-align: center;
  background: transparent;
}

.case-donate-box button {
  border: 0;
  background: linear-gradient(135deg, #07828a, #00666f);
  color: #fff;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  gap: 5px;
}

.case-donate-box button strong {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 18px;
  line-height: 1;
  font-weight: 600;
}

.case-donate-box button small {
  display: flex;
  align-items: center;
  gap: 7px;
  font-size: 11px;
  font-weight: 500;
}

.case-quick-divider {
  display: grid;
  grid-template-columns: 1fr auto 1fr;
  gap: 20px;
  align-items: center;
  margin: 28px 0 20px;
  color: #00666f;
  font-size: 15px;
  font-weight: 700;
}

.case-quick-divider::before,
.case-quick-divider::after {
  content: "";
  height: 1px;
  background: rgba(11, 91, 105, 0.14);
}

.case-provider-row {
  display: flex;
  justify-content: center;
  gap: 36px;
  margin-bottom: 22px;
}

.case-provider-row button {
  width: 190px;
  height: 78px;
  border: 1px solid rgba(10, 97, 115, 0.12);
  border-radius: 8px;
  background: #fff;
  box-shadow: 0 8px 18px rgba(10, 97, 115, 0.07);
}

.case-provider-row img {
  max-width: 116px;
  max-height: 52px;
  object-fit: contain;
}

.case-sms-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 12px 28px;
}

.case-sms-grid button {
  min-height: 60px;
  border: 1px solid rgba(21, 153, 155, 0.26);
  border-radius: 8px;
  background: #fff;
  color: #06465b;
  display: grid;
  grid-template-columns: 36px 1fr;
  grid-template-rows: 1fr 1fr;
  align-items: center;
  text-align: left;
  padding: 10px 14px;
  column-gap: 10px;
}

.case-sms-grid button span {
  grid-row: 1 / span 2;
  width: 34px;
  height: 34px;
  border-radius: 50%;
  background: #fff;
  color: rgb(30, 80, 40);
  border: 1px solid rgba(30, 80, 40, 0.18);
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 18px;
}

.case-sms-grid button small {
  color: #333947;
  font-size: 13px;
  font-weight: 500;
}

.case-sms-grid button strong {
  color: #06465b;
  font-size: 16px;
  line-height: 1; 
}

.case-secure-banner {
  display: grid;
  grid-template-columns: 48px 1fr;
  align-items: center;
  gap: 16px;
  margin-top: 26px;
  padding: 18px 22px;
  border: 1px solid rgba(17, 178, 117, 0.15);
  border-radius: 9px;
  background: #f2fbfb;
  color: #007064;
}

.case-secure-banner i {
  color: #13a672;
  font-size: 34px;
}

.case-secure-banner p {
  margin: 0;
  font-size: 16px;
  line-height: 1.5;
  font-weight: 700;
}

@media (max-width: 1100px) {
  .case-detail-modern-grid {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 700px) {
  .case-detail-modern {
    padding: 18px 0 28px;
  }

  .case-donation-panel {
    padding: 22px 16px;
  }

  .case-story-body h1 {
    font-size: 24px;
  }

  .case-amount-summary,
  .case-donate-box,
  .case-sms-grid {
    grid-template-columns: 1fr;
  }

  .case-amount-summary div:last-child {
    text-align: left;
  }

  .case-donate-input-wrap input {
    font-size: 58px;
  }

  .case-donate-box button {
    min-height: 86px;
  }

  .case-provider-row {
    gap: 12px;
  }

  .case-provider-row button {
    flex: 1 1 0;
    width: auto;
  }
}

/* TEXTAREA */
.form-mn textarea {
    border-radius: 12px;
    height: 100px;
    margin-bottom: 10px;
    width: 100%;
    padding: 14px 20px;
    background: #fff;
    border: 1px solid transparent;
    border-radius: 9px;
    border-top-left-radius: 9px;
    border-bottom-left-radius: 9px;
    outline: none;
    transition: 0.3s;
    font-size: 16px;
}

/* RADIO */
.form-mn .radio-group {
    display: flex;
    gap: 20px;
    margin-bottom: 15px;
}

/* FILE */
.form-mn .file-box {
    background: transparent;
    padding: 0;
    border-radius: 10px;
    margin-bottom: 5px;
    margin-top: 15px;
}

/* BUTTON */
.form-mn button {
    width: 100%;
    padding: 12px;
    border-radius: 30px;
    border: none;
    background: #b89c6d;
    color: #fff;
    font-size: 16px;
    cursor: pointer;
}

/* SUCCESS MESSAGE */
.form-mn .success-msg {
    display: none;
    background: #d4edda;
    color: #155724;
    padding: 12px;
    border-radius: 8px;
    margin-bottom: 15px;
    text-align: center;
}






/* MAIN */
.form-mn {
    background: transparent;
    padding: 0;
}

/* BOX */
.form-box {
    max-width: 500px;
    margin: auto;
    background: #fff;
    padding: 20px;
    border-radius: 10px;
}

/* INPUT */
.form-mn input, .form-mn button {
    width: 100%;
    padding: 12px;
    margin-bottom: 0px;
    width: 100%;
    padding: 12px 9px;
    background: #fff;
    border: 1px solid transparent;
    border-radius: 9px;
    outline: none;
    transition: 0.3s;
    font-size: 16px;
}

/* BUTTON */
.form-mn button {
    background: #b89c6d;
    color: #fff;
    border: none;
    padding: 15px 10px;
    border-radius: 5px;
    font-size: 18px;
    margin-top: 9px;
    padding: 15px 25px;
    background: #15999b;
    color: #fff;
    border: none;
    border-radius: 5px;
    cursor: pointer;
    font-size: 20px;
    transition: 0.3s;
}

/* POPUP */
.popup {
    position: fixed;
    top: 20px;
    right: 20px;
    background: #28a745;
    color: #fff;
    padding: 12px 20px;
    border-radius: 5px;
    display: none;
    z-index: 999;
}



.mb-10{ margin-bottom:10px; }


.input-group label{ margin-bottom:10px; } 

.input-group select{margin-bottom: 0px;
  width: 100%;
  padding: 14px 20px;
  background: #fff;
  border: 1px solid transparent;
  border-radius: 9px;
  outline: none;
  transition: 0.3s;
  font-size: 16px;}

.input-group textarea{margin-bottom: 0px;
  width: 100%;
  padding: 14px 20px;
  background: #fff!important;
  border: 1px solid transparent;
  border-radius: 9px;
  outline: none;
  transition: 0.3s;
  font-size: 16px; }


::file-selector-button {
  font: inherit;
  -webkit-appearance: button;
  background-color: #e9f6f6;
  color: #2c2c2c;
  border: 0;
  padding: 4px 4px;
  border: solid 1px #15999b;
  border-radius: 3px;
}

.fm-pw{text-align: left!important;margin-top: 5px; line-height: 19px; font-size: 16px}
.form-mn-p{ font-size:18px!important; margin-bottom:30px; }





/* QUESTION */
.form-mn .question {
    display: block;
    font-size: 15px;
    color: #333;
    margin-bottom: 10px;
}

/* CONTAINER */
.form-mn .radio-box {
    display: flex;
    gap: 20px;
}

/* CARD STYLE */
.form-mn .radio-card {
    display: flex;
    align-items: center;
    gap: 9px;
    background: #fff;
    padding: 3px 18px 3px 9px;
    border-radius: 30px;
    cursor: pointer;
    transition: 0.3s;
    margin-top: 14px;
    border: solid 1px #c4c4c4;
}

/* HIDE DEFAULT */
.form-mn .radio-card input {
    display: none;
}

/* CUSTOM RADIO */
.form-mn .radio-ui {
    width: 18px;
    height: 18px;
    border-radius: 50%;
    border: 2px solid #999;
    position: relative;
}

/* INNER DOT */
.form-mn .radio-ui::after {
    content: '';
    width: 10px;
    height: 10px;
    background: #b89c6d;
    border-radius: 50%;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%) scale(0);
    transition: 0.3s;
}

/* ACTIVE STATE */
.form-mn .radio-card input:checked + .radio-ui::after {
    transform: translate(-50%, -50%) scale(1);
}

/* ACTIVE CARD */
.form-mn .radio-card input:checked ~ .text {
    font-weight: 500;
    color: #b89c6d;
}

.form-mn .radio-card input:checked {
}

.form-mn .radio-card:hover {
    background: #e0e0e0;
}














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

.srv-snt  .our-services{
	background-image: url('../images/our-services-bg-image.png');
	background-position: bottom center;
	background-size: auto;
	padding: 120px 0;
}

.srv-snt .service-item{
	/* background: var(--dark-divider-color); */
	backdrop-filter: blur(30px);
	-webkit-backdrop-filter: blur(30px);
	border-radius: 12px;
	min-height: auto;
	display: flex;
	flex-direction: column;
	justify-content: space-between;
	gap: 34px;
	height: auto;
	margin-bottom: 27px;
	padding: 30px 10px;
	transition: all 0.4s ease-in-out;
}

.srv-snt  .service-item:hover{
	transform: translateY(-5px);
}

.srv-snt  .service-item-header{
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 15px;
	flex-direction: column;
	justify-content: center;
}

.srv-snt   .service-item-header .icon-box{
	position: relative;
	width: 100px;
	height: 100px;
	background: var(--accent-secondary-color);
	border-radius: 50%;
	display: flex;
	justify-content: center;
	align-items: center;
	overflow: hidden;
}

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

.srv-snt  .service-item:hover .service-item-header .icon-box::before{
    transform: scale(1);
}

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

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

.service-item-title{
	width: 100%;
	text-align: center;
}

.srv-snt  .service-item-title h2{
	font-size: 20px;
	line-height: 1.3em;
	color: var(--white-color);
	font-weight: 500;
	min-height: 53px;
}

.srv-snt  .service-item-title h2 a{
	color: #114c5c;
	font-size: 19px;
}

.srv-snt  .service-item-content p{
	color: var(--white-color);
	margin: 0;
}

.srv-snt   .service-item-btn{
	border-top: 1px solid var(--dark-divider-color);
	margin-top: 40px;
	padding-top: 40px;
}



.regi-icon img { width:80px; }




























.book-wrap-12 {
	background-color: #fff;
	border: solid 1px #cccccc78;
	border-radius: 12px;
	overflow: hidden;
	box-shadow: 0 8px 25px rgba(0,0,0,0.08);
}

.bw-container {
  display: flex;
  height: 100vh;
}

/* Sidebar */
.bw-sidebar {
  width: 299px;
  background: #f5f4ef;
  padding: 20px;
}

.bw-sidebar h3 {
  margin-bottom: 20px;
}

.bw-sidebar ul {
  list-style: none;
  padding: 0;
}

.bw-sidebar li {
  padding: 21px 10px 21px 0px;
  margin-bottom: 8px;
  border-left: 0px solid transparent;
  cursor: pointer;
  color: #414141;
}

.bw-sidebar li.active {
  color: #fff;
  /* border-left: 3px solid #c89b3c; */
  font-weight: 500;
  background-color: #15999b;
  border-radius: 6px;
  padding: 17px 10px;
}

/* Content */
.bw-content {
  flex: 1;
  padding: 25px 40px 40px 40px;
}

/* Steps */
.bw-step {
  display: none;
}

.bw-step.active {
  display: block;
}

/* Form */
.bw-form-group {
  margin-bottom: 20px;
}

.bw-form-group label {
  display: block;
  margin-bottom: 5px;
}

.bw-form-group input,
.bw-form-group select {
  width: 100%;
  padding: 10px;
  border: 1px solid #ddd;
  border-radius: 5px;
}

/* Buttons */
.bw-buttons {
  margin-top: 0;
  display: flex;
  gap: 10px;
}

.bw-back {
  background: #fff;
  border: 1px solid #15999b;
  padding: 10px 20px;
  cursor: pointer;
  border-radius: 5px;
  color: #15999b;
}

.bw-next {
  background: #15999b;
  color: #fff;
  border: none;
  padding: 10px 20px;
  cursor: pointer;
  border-radius: 5px;
}

.bw-next:hover {
  background: #114c5c;
}

/* Responsive */
@media (max-width: 768px) {
  .bw-container {
    flex-direction: column;
  }

  .bw-sidebar {
    width: 100%;
  }
}


.bokking-wrap{ padding:50px 0; }

.bw-sidebar ul li{
  list-style: none;
  background-color: #fff;
  padding: 17px 10px;
  border-radius: 6px;
}



.bokking-wrap .form-mn .form-box {
  max-width: 100%;
  margin: auto;
  background: transparent;
  padding: 10px 0;
  border-radius: 12px;
  box-shadow: 0;
}

.bokking-wrap .form-mn input{ border:solid 1px #ccc;
  border: solid 1px #ccc;
  border-top-left-radius: 8px !important;
  border-bottom-left-radius: 8px !important;
} 



.bokking-wrap .form-mn input, .bokking-wrap .form-mn select, .bokking-wrap .form-mn textarea { border:solid 1px #ccc;
  border: solid 1px #ccc;
  border-top-left-radius: 8px !important;
  border-bottom-left-radius: 8px !important;
} 


 .bokking-wrap label{
  line-height: 24px;
  color: #444;
}


.bw-container {
  display: flex;
  height: auto;
}

.book-wrap-12 h4{ margin-bottom:20px; }

/* Completed step */
.bw-sidebar li.completed {
  color: #fff;
  background-color: #15999b;
  font-weight: 500;
  display: flex;
  justify-content: space-between;
}

/* Optional tick */
.bw-sidebar li.completed::after {
  content: "";
  display: initial;
  width: 14px;
  height: 8px;
  border: 3px solid #fff;
  border-top: none;
  border-right: none;
  transform: rotate(-45deg);
  margin-left: 10px;
  margin-top: 2px;
  justify-content: ;
}

.bw-buttons.hide {
  display: none;
}



.header-new.is-sticky {
  position: relative;}


  .page-category-list ul li.active a {
  color: #fff;
  font-weight: 500;
  background-color: #15999b;
  background: linear-gradient(45deg, #114c5c, #15999b);
  background: rgba(255,255,255,0.22);
  transform: translateX(4px);
  color: #fff;
}

.page-category-list ul li.active {
  border-left: 0;
  padding-left: 0;
}


.page-category-list ul li::before {
    transform: translateY(-50%) rotate(45deg);
}





/* dashboard */


.dashboard-wrps {
  background: transparent;
  padding: 0;
}

.dashboard-wrps .dw-container {
  display: flex;
  background: #fff;
  border-radius: 10px;
  overflow: hidden;
}

/* Sidebar */
.dashboard-wrps .dw-sidebar {
  width: 300px;
  background: #f5f4ef;
  padding: 20px;
}

.dashboard-wrps .dw-sidebar ul {
  list-style: none;
  padding: 0;
}

.dashboard-wrps .dw-sidebar li {
  background: #e9e9e9;
  padding: 15px;
  border-radius: 8px;
  margin-bottom: 10px;
  color: #333;
}

.dashboard-wrps .dw-sidebar li.active {
  background: #1f8f8b;
  color: #fff;
  font-weight: 500;
}

/* Content */
.dashboard-wrps .dw-content {
  flex: 1;
  padding: 30px;
  background-color: #fff;
}

.dashboard-wrps .dw-content h2 {
  margin-bottom: 20px;
}

/* Form Grid */
.dashboard-wrps .dw-form-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 20px;
}

.dashboard-wrps .dw-form-group {
  display: flex;
  flex-direction: column;
}

.dashboard-wrps .dw-form-group.full {
  grid-column: span 2;
}

.dashboard-wrps .dw-form-group label {
  margin-bottom: 5px;
}

.dashboard-wrps .dw-form-group input {
  padding: 12px;
  border: 1px solid #ddd;
  border-radius: 8px;
}

/* Buttons */
.dashboard-wrps .dw-buttons {
  margin-top: 30px;
}

.dashboard-wrps .dw-back {
  padding: 10px 20px;
  border: 1px solid #1f8f8b;
  background: #fff;
  color: #1f8f8b;
  border-radius: 6px;
  margin-right: 10px;
}

.dashboard-wrps .dw-next {
  padding: 10px 20px;
  background: #1f8f8b;
  color: #fff;
  border: none;
  border-radius: 6px;
}

/* Responsive */
@media (max-width: 768px) {
  .dashboard-wrps .dw-container {
    flex-direction: column;
  }

  .dashboard-wrps .dw-sidebar {
    width: 100%;
  }

  .dashboard-wrps .dw-form-grid {
    grid-template-columns: 1fr;
  }

  .dashboard-wrps .dw-form-group.full {
    grid-column: span 1;
  }
}











.bw-infographic {
  font-family: var(--default-font);
}

/* STEP CONTAINER */
.bw-step {
  opacity: 0;
  transform: translateX(40px) scale(0.95);
  transition: all 0.5s ease;
  position: absolute;
  width: 100%;
  pointer-events: none;
}

.bw-step.active {
  opacity: 1;
  transform: translateX(0) scale(1);
  position: relative;
  pointer-events: auto;
}

/* EXIT ANIMATION */
.bw-step.exit-left {
  transform: translateX(-40px);
  opacity: 0;
}

.bw-step.exit-right {
  transform: translateX(40px);
  opacity: 0;
}

/* SIDEBAR */
.bw-sidebar li {
  transition: all 0.3s ease;
  position: relative;
}

/* ACTIVE STEP */
.bw-sidebar li.active {
  color: #fff;
  background: linear-gradient(45deg, #3a7f92, #15999b);
  transform: scale(1.01);
}


/* BUTTONS */
.bw-buttons {
  transition: opacity 0.3s ease;
}

.bw-buttons.hide {
  opacity: 0;
  pointer-events: none;
}






.faq-accordion ul li {
  padding: 0;
  list-style: none;
  margin: 0px 0;
 
}


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

 .faq-accordion .grd-2 ul{
  padding-left: 0; display: grid;
  grid-template-columns: repeat(2, 1fr); /* 2 columns */
  gap: 10px;}


 .faq-accordion .grd-2 ul li img{
  filter: brightness(0) invert(0);
  width: 20px;
  margin-right: 10px;
}

 .faq-accordion .grd-2 ul li {
  padding: 0;
  list-style: none;
  margin: 0px 0;
  background-color: #f7f7f7;
  padding: 15px 15px;
  border-radius: 5px;
  border: solid 1px #b0b0b0;
  line-height: 24px;
  color: #385e68;
}


 .faq-accordion .grd-3 ul{
  padding-left: 0; display: grid;
  grid-template-columns: repeat(3, 1fr)!important; /* 2 columns */
  gap: 10px;}



.faq-accordion .dflx-li img{
  filter: brightness(0) invert(0);
  width: 20px;
  margin-right: 10px;
}

.mb-20{ margin-bottom:20px; }

 .faq-accordion .grd-3 ul li {
  padding: 0;
  list-style: none;
  margin: 3px 0;
  background-color: #f7f7f7;
  padding: 15px 15px;
  border-radius: 5px;
  border: solid 1px #e8e8e8;
  line-height: 24px;
  color: #385e68;
}












.dflx-li{display:flex; line-height: 18px;}





 .faq-accordion .notice {
  background: #f5f4ef;
  padding: 15px;
  border-left: 5px solid #15999b;
  border-radius: 8px;
  font-size: 14px;
}






































.ne-tab-step-form{
      max-width:1420px;
      margin:0 auto;
    }

    .ne-tab-step-form .ne-tsf-box{
      display:grid;
      grid-template-columns:370px 1fr;
      background:#fff;
      border-radius:18px;
      overflow:hidden;
      min-height:720px;
      box-shadow:var(--ne-shadow);
      border:1px solid #e8f0f2;
    }

    /* SIDEBAR */
    .ne-tab-step-form .ne-tsf-sidebar{
      background:#fff;
      border-right:1px solid #eef3f5;
      padding:28px 18px;
      display:flex;
      flex-direction:column;
      gap:22px;
      position:relative;
    }

    .ne-tab-step-form .ne-tsf-steps{
      position:relative;
      display:flex;
      flex-direction:column;
      gap:38px;
      padding:0;
    }

    .ne-tab-step-form .ne-tsf-steps::before{
      content:"";
      position:absolute;
      left:30px;
      top:30px;
      bottom:18px;
      width:3px;
      background:#e2ebef;
      z-index:0;
    }

    .ne-tab-step-form .ne-tsf-steps::after{
      content:"";
      position:absolute;
      left:30px;
      top:30px;
      width:3px;
      height:var(--step-progress-height, 0px);
      background:var(--ne-primary);
      z-index:1;
      transition:height .35s ease;
    }

    .ne-tab-step-form .ne-tsf-step{
      position:relative;
      display:grid;
      grid-template-columns:38px 24px 1fr;
      gap:14px;
      align-items:center;
      border:none;
      background:transparent;
      text-align:left;
      padding:16px 14px;
      border-radius:12px;
      cursor:pointer;
      transition:all .25s ease;
      z-index:2;
      width:100%;
    }

    .ne-tab-step-form .ne-tsf-step:hover{
      background:#f5fbfb;
    }

    .ne-tab-step-form .ne-tsf-step.is-active{
      background:linear-gradient(90deg,#ebffff 0%,#c0e7e9 100%);
      color: #fff;
    }

    .ne-tab-step-form .ne-tsf-step-badge{
      width:34px;
      height:34px;
      border-radius:50%;
      background:#e7eef1;
      color:#263f4d;
      display:flex;
      align-items:center;
      justify-content:center;
      font-weight: 500;
      font-size:14px;
      position:relative;
      z-index:3;
      border:none;
      box-shadow:0 3px 10px rgba(22,45,60,.08);
      transition:all .25s ease;
    }

    .ne-tab-step-form .ne-tsf-step.is-active .ne-tsf-step-badge{
      background:linear-gradient(180deg,var(--ne-primary-2) 0%, var(--ne-primary) 100%);
      color:#fff;
      box-shadow:0 8px 18px rgba(8,127,134,.25);
    }

    .ne-tab-step-form .ne-tsf-step.is-completed .ne-tsf-step-badge{
      background:linear-gradient(180deg,var(--ne-primary-2) 0%, var(--ne-primary) 100%);
      color:#fff;
      font-size:0;
      box-shadow:0 8px 18px rgba(8,127,134,.25);
    }

    .ne-tab-step-form .ne-tsf-step.is-completed .ne-tsf-step-badge::before{
      content:"";
      font-size:35px;
      font-weight: 500;
      background-image: url(../images/img/tick.svg);
  background-size: cover;
  background-repeat: no-repeat;
      width: 14px;
      height: 14px;
    }

    .ne-tab-step-form .ne-tsf-step-icon{
      width:20px;
      height:20px;
      color:#7e97a5;
      transition:all .25s ease;
    }

    .ne-tab-step-form .ne-tsf-step.is-active .ne-tsf-step-icon,
    .ne-tab-step-form .ne-tsf-step.is-completed .ne-tsf-step-icon{
      color:var(--ne-primary);
    }

    .ne-tab-step-form .ne-tsf-step-title{
      display:block;
      font-size:18px;
      font-weight: 500;
      color:#17384b;
      line-height:1.3;
      margin:0 0 0px;
    }

    .ne-tab-step-form .ne-tsf-step-desc{
      display:block;
      font-size:15px;
      color:#6f8491;
      line-height:1.35;
      margin:0;
    }

    .ne-tab-step-form .ne-tsf-step.is-active .ne-tsf-step-title{
      color:var(--ne-primary);
    }

    .ne-tab-step-form .ne-tsf-security{
      margin-top:auto;
      background:linear-gradient(180deg,#f4fbfb 0%,#eff8f8 100%);
      border:1px solid #a4c2c6;
      border-radius:14px;
      padding:18px;
      display:flex;
      gap:14px;
      align-items:flex-start;
    }

    .ne-tab-step-form .ne-tsf-security-icon{
      width:40px;
      height:40px;
      color:var(--ne-primary);
      flex:0 0 40px;
    }

    .ne-tab-step-form .ne-tsf-security h4{
      margin:0 0 6px;
      font-size:18px;
      font-weight: 500;
      color:var(--ne-dark);
    }

    .ne-tab-step-form .ne-tsf-security p{
      margin:0;
      font-size:16px;
      color:var(--ne-muted);
      line-height:1.25;
    }

    /* MAIN CONTENT */
    .ne-tab-step-form .ne-tsf-main{
      padding:26px 34px;
      background:#fff;
    }

    .ne-tab-step-form .ne-tsf-head{
      display:flex;
      justify-content:space-between;
      align-items:flex-start;
      gap:20px;
      margin-bottom:16px;
    }

    .ne-tab-step-form .ne-tsf-heading h2{
      margin:0 0 6px;
      font-size:24px;
      color:#114c5c;
      font-weight: 500;
    }

    .ne-tab-step-form .ne-tsf-heading p{
      margin:0;
      color:var(--ne-muted);
      font-size:17px;
    }

    .ne-tab-step-form .ne-tsf-pass{
      border:2px solid rgba(7,156,161,.35);
      border-radius:9px;
      padding:14px 16px;
      min-width:231px;
      display:flex;
      gap:12px;
      align-items:flex-start;
      background:#fbffff;
      margin-bottom: 25px;
    }

    .ne-tab-step-form .ne-tsf-pass svg{
      width:28px;
      height:28px;
      color:var(--ne-primary);
      flex:0 0 28px;
    }

    .ne-tab-step-form .ne-tsf-pass strong{
      display:block;
      color:var(--ne-primary);
      font-size:16px;
      margin-bottom:4px;
    }

    .ne-tab-step-form .ne-tsf-pass span{
      display:block;
      font-size:16px;
      color:var(--ne-muted);
    }

    .ne-tab-step-form .ne-tsf-progress-row{
      /*! max-width:520px; */
      margin-bottom:26px;
    }

    .ne-tab-step-form .ne-tsf-progress-meta{
      display:flex;
      justify-content:space-between;
      align-items:center;
      margin-bottom:8px;
      color:#5d7887;
      font-size:14px;
      font-weight: 500;
    }

    .ne-tab-step-form .ne-tsf-progress-bar{
      height:8px;
      width:100%;
      background:#edf3f4;
      border-radius:30px;
      overflow:hidden;
    }

    .ne-tab-step-form .ne-tsf-progress-bar span{
      display:block;
      width:25%;
      height:100%;
      background:linear-gradient(90deg,var(--ne-primary-2),var(--ne-primary));
      border-radius:30px;
      transition:width .35s ease;
    }

    .ne-tab-step-form .ne-tsf-divider{
      border:none;
      border-top:1px solid #edf2f4;
      margin:0 0 24px;
    }

    .ne-tab-step-form .ne-tsf-panel{
      display:none;
      animation:fadeIn .25s ease;
    }

    .ne-tab-step-form .ne-tsf-panel.is-active{
      display:block;
    }

    @keyframes fadeIn{
      from{
        opacity:0;
        transform:translateY(5px);
      }
      to{
        opacity:1;
        transform:translateY(0);
      }
    }

    .ne-tab-step-form .ne-tsf-form-grid{
      display:grid;
      grid-template-columns:repeat(2, minmax(0, 1fr));
      gap:22px 26px;
    }

    .ne-tab-step-form .ne-tsf-col-full{
      grid-column:1 / -1;
    }

    .ne-tab-step-form label{
      display:block;
      margin-bottom:9px;
      font-size:17px;
      font-weight:500;
      color:#17384b;
    }

    .ne-tab-step-form .ne-tsf-required{
      color:#ef4444;
    }

    .ne-tab-step-form .ne-tsf-input-wrap{
      position:relative;
    }

    .ne-tab-step-form .ne-tsf-input-icon{
      position:absolute;
      top:50%;
      left:14px;
      transform:translateY(-50%);
      width:18px;
      height:18px;
      color:#7d919d;
      pointer-events:none;
    }

    .ne-tab-step-form input,
    .ne-tab-step-form select,
    .ne-tab-step-form textarea{
      width:100%;
      border:1.5px solid #c8c8c8;
      background:#fff;
      border-radius:10px;
      padding:14px 16px;
      font-size:17px;
      color:#17384b;
      outline:none;
      transition:.25s ease;
      font-family:inherit;
      width: 100%;
    }

    .ne-tab-step-form input.has-icon,
    .ne-tab-step-form select.has-icon{
      padding-left:42px;
    }

    .ne-tab-step-form input:focus,
    .ne-tab-step-form select:focus,
    .ne-tab-step-form textarea:focus{
      border-color:var(--ne-primary);
      box-shadow:0 0 0 4px rgba(7,156,161,.10);
    }

    .ne-tab-step-form select{
      appearance:none;
      -webkit-appearance:none;
      -moz-appearance:none;
      padding-right:42px;
      background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='18' height='18' viewBox='0 0 24 24' fill='none' stroke='%236b7f8b' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E");
      background-repeat:no-repeat;
      background-position:right 14px center;
      background-size:18px;
    }

    .ne-tab-step-form textarea{
      min-height:130px;
      resize:vertical;
    }

    .ne-tab-step-form .ne-tsf-help{
      margin-top:8px;
      color:var(--ne-muted);
      font-size:14px;
    }

    .ne-tab-step-form .ne-tsf-radio-options{
      display:flex;
      gap:24px;
      align-items:center;
      padding-top:9px;
      min-height:48px;
    }

    .ne-tab-step-form .ne-tsf-radio{
      display:flex;
      align-items:center;
      gap:10px;
      cursor:pointer;
      margin:0;
      font-weight: 500;
      color:#28485a;
    }

    .ne-tab-step-form .ne-tsf-radio input{
      width:18px;
      height:18px;
      padding:0;
      margin:0;
      accent-color:var(--ne-primary);
    }

    .ne-tab-step-form .ne-tsf-char-count{
      text-align:right;
      font-size:12px;
      color:#8296a1;
      margin-top:8px;
    }

    .ne-tab-step-form .ne-tsf-upload-grid{
      display:grid;
      grid-template-columns:repeat(2, minmax(0, 1fr));
      gap:18px;
    }

    .ne-tab-step-form .ne-tsf-upload{
      border:1.5px dashed #9bbdc5;
      background:#f9f9f9;
      border-radius:11px;
      padding:18px;
      display:flex;
      gap:14px;
      align-items:flex-start;
    }

    .ne-tab-step-form .ne-tsf-upload-icon{
      width:42px;
      height:42px;
      border-radius:8px;
      background:#e6fcfd;
      color:var(--ne-primary);
      display:flex;
      align-items:center;
      justify-content:center;
      flex:0 0 42px;
    }

    .ne-tab-step-form .ne-tsf-upload h4{
      margin:0 0 10px;
      font-size:16px;
      color:#212121;
      font-weight: 500;
    }

    .ne-tab-step-form .ne-tsf-upload p{
      margin:9px 0 0;
      color:#61676b;
      font-size:15px;
      line-height:1.25;
    }

    .ne-tab-step-form .ne-tsf-review{
      display:grid;
      grid-template-columns:repeat(2, minmax(0, 1fr));
      gap:16px;
    }

    .ne-tab-step-form .ne-tsf-review-card{
      background:#fbfefe;
      border:1px solid #e6eef1;
      border-radius:14px;
      padding:16px;
    }

    .ne-tab-step-form .ne-tsf-review-card h4{
      margin:0 0 12px;
      font-size:16px;
      color:#124058;
    }

    .ne-tab-step-form .ne-tsf-review-item{
      display:flex;
      justify-content:space-between;
      gap:12px;
      padding:9px 0;
      border-bottom:1px dashed #e5edf0;
      font-size:17px;
    }

    .ne-tab-step-form .ne-tsf-review-item:last-child{
      border-bottom:none;
    }

    .ne-tab-step-form .ne-tsf-review-item span:first-child{
      color:#696969;
    }

    .ne-tab-step-form .ne-tsf-review-item span:last-child{
      font-weight: 500;
      text-align:right;
      word-break:break-word;
    }

    .ne-tab-step-form .ne-tsf-actions{
      margin-top:30px;
      padding-top:18px;
      border-top:1px solid #edf2f4;
      display:flex;
      justify-content:space-between;
      align-items:center;
      gap:18px;
      flex-wrap:wrap;
    }

    .ne-tab-step-form .ne-tsf-actions-left,
    .ne-tab-step-form .ne-tsf-actions-right{
      display:flex;
      align-items:center;
      gap:16px;
      flex-wrap:wrap;
    }

    .ne-tab-step-form .ne-tsf-save-note{
      text-align:center;
      font-size:12px;
      color:var(--ne-muted);
      line-height:1.4;
    }

    .ne-tab-step-form .ne-tsf-save-note strong{
      display:block;
      color:var(--ne-primary);
      font-size:13px;
      margin-bottom:2px;
    }

    .ne-tab-step-form .ne-tsf-btn{
      border:none;
      border-radius:10px;
      padding:14px 28px;
      font-size:16px;
      font-weight: 500;
      cursor:pointer;
      display:inline-flex;
      align-items:center;
      justify-content:center;
      gap:10px;
      min-width:140px;
      transition:.25s ease;
    }

    .ne-tab-step-form .ne-tsf-btn svg{
      width:18px;
      height:18px;
    }

    .ne-tab-step-form .ne-tsf-btn-outline{
      background:#fff;
      color:var(--ne-primary);
      border:1.5px solid rgba(7,156,161,.6);
    }

    .ne-tab-step-form .ne-tsf-btn-outline:hover{
      background:#f4fbfb;
    }

    .ne-tab-step-form .ne-tsf-btn-primary{
      background:linear-gradient(90deg,var(--ne-primary-2),var(--ne-primary));
      color:#fff;
      box-shadow:0 10px 25px rgba(7,156,161,.22);
    }

    .ne-tab-step-form .ne-tsf-btn-primary:hover{
      transform:translateY(-1px);
      box-shadow:0 14px 30px rgba(7,156,161,.28);
    }

    .ne-tab-step-form .ne-tsf-btn[disabled]{
      opacity:.5;
      cursor:not-allowed;
      transform:none;
      box-shadow:none;
    }

    /* RESPONSIVE */
    @media(max-width:1100px){
      .ne-tab-step-form .ne-tsf-box{
        grid-template-columns:270px 1fr;
      }

      .ne-tab-step-form .ne-tsf-form-grid,
      .ne-tab-step-form .ne-tsf-upload-grid,
      .ne-tab-step-form .ne-tsf-review{
        grid-template-columns:1fr;
      }

      .ne-tab-step-form .ne-tsf-head{
        flex-direction:column;
      }

      .ne-tab-step-form .ne-tsf-pass{
        width:100%;
      }
    }

    @media(max-width:860px){
      body{
        padding:10px;
      }

      .ne-tab-step-form .ne-tsf-box{
        grid-template-columns:1fr;
      }

      .ne-tab-step-form .ne-tsf-sidebar{
        border-right:none;
        border-bottom:1px solid #eef3f5;
      }

      .ne-tab-step-form .ne-tsf-steps{
        gap:12px;
      }

      .ne-tab-step-form .ne-tsf-steps::before,
      .ne-tab-step-form .ne-tsf-steps::after{
        display:none;
      }

      .ne-tab-step-form .ne-tsf-step{
        background:#fbfefe;
        border:1px solid #edf3f5;
      }

      .ne-tab-step-form .ne-tsf-main{
        padding:20px 16px;
      }

      .ne-tab-step-form .ne-tsf-actions{
        flex-direction:column;
        align-items:stretch;
      }

      .ne-tab-step-form .ne-tsf-actions-left,
      .ne-tab-step-form .ne-tsf-actions-right{
        width:100%;
      }

      .ne-tab-step-form .ne-tsf-btn{
        width:100%;
      }

      .ne-tab-step-form .ne-tsf-save-note{
        width:100%;
        order:-1;
      }
    }



     :root{
      --ne-primary:#15999b;
      --ne-primary-2:#15999b;
      --ne-dark:#114c5c;
      --ne-muted:#6f8491;
      --ne-border:#dfe9ec;
      --ne-soft:#f4fbfb;
      --ne-card:#ffffff;
      --ne-shadow:0 10px 35px rgba(9,55,79,.08);
    }


    .sts{ width:100%; }



.ne-success-popup{
  position:fixed;
  inset:0;
  background:rgba(12,34,45,.55);
  backdrop-filter:blur(6px);
  display:none;
  align-items:center;
  justify-content:center;
  z-index:999999;
  padding:20px;
}

.ne-success-popup.active{
  display:flex;
}

.ne-success-box{
  width:100%;
  max-width:420px;
  background:#fff;
  border-radius:11px;
  padding:35px 28px;
  text-align:center;
  box-shadow:0 25px 70px rgba(0,0,0,.25);
  animation:nePopup .3s ease;
}

.ne-success-icon{
  width:80px;
  height:80px;
  margin:0 auto 18px;
  border-radius:50%;
  background:linear-gradient(180deg,#11b7b8,#079ca1);
  color:#fff;
  display:flex;
  align-items:center;
  justify-content:center;
  font-size:44px;
  font-weight: 500;
}

.ne-success-box h3{
  margin:0 0 10px;
  color:#17384b;
  font-size:26px;
  font-weight: 500;
}

.ne-success-box p{
  margin:0 0 25px;
  color:#6f8491;
  font-size:15px;
}

.ne-success-box button{
  border:none;
  border-radius:12px;
  padding:14px 36px;
  background:linear-gradient(90deg,#11b7b8,#079ca1);
  color:#fff;
  font-size:15px;
  font-weight: 500;
  cursor:pointer;
}

@keyframes nePopup{
  from{
    opacity:0;
    transform:scale(.9);
  }
  to{
    opacity:1;
    transform:scale(1);
  }
}


















.ne-lang-btn{
  border:0;
  /*! background:#fff; */
  color:#114c5c;
  border-radius:999px;
  /*! padding:8px 9px; */
  font-size:18px;
  font-weight:500;
  cursor:pointer;
  transition:.25s ease;
}

.ne-lang-btn:hover{
  background:#f4fbfb;
}

.ne-lang-popup{
  position:fixed;
  inset:0;
  background:rgba(12,34,45,.55);
  backdrop-filter:blur(6px);
  display:none;
  align-items:center;
  justify-content:center;
  z-index:999999;
  padding:20px;
}

.ne-lang-popup.active{
  display:flex;
}

.ne-lang-box{
  width:100%;
  max-width:430px;
  background:#fff;
  border-radius:10px;
  padding:32px 28px;
  text-align:center;
  position:relative;
  box-shadow:0 25px 70px rgba(0,0,0,.25);
  animation:neLangPopup .28s ease;
}

.ne-lang-close{
  position:absolute;
  top:14px;
  right:16px;
  width:34px;
  height:34px;
  border:none;
  border-radius:50%;
  background:#f1f6f7;
  color:#17384b;
  font-size:24px;
  line-height:1;
  cursor:pointer;
}

.ne-lang-box h3{
  margin:0 0 4px;
  color:#17384b;
  font-size:22px;
  font-weight: 500;
}

.ne-lang-box p{
  margin:0 0 24px;
  color:#6f8491;
  font-size:16px;
}

.ne-lang-options{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:14px;
}

.ne-lang-option{
  border:1.5px solid #dce8ec;
  background:#fff;
  color:#17384b;
  border-radius:10px;
  padding:18px 14px;
  font-size:16px;
  font-weight: 500;
  cursor:pointer;
  transition:.25s ease;
}

.ne-lang-option span{
  display:block;
  font-size:32px;
  margin-bottom:8px;
}

.ne-lang-option:hover,
.ne-lang-option.active{
  border-color:#079ca1;
  background:linear-gradient(180deg,#f4fbfb,#eefafa);
  color:#000;
  box-shadow:0 10px 25px rgba(7,156,161,.12);
}

@keyframes neLangPopup{
  from{
    opacity:0;
    transform:scale(.9) translateY(10px);
  }
  to{
    opacity:1;
    transform:scale(1) translateY(0);
  }
}

@media(max-width:480px){
  .ne-lang-options{
    grid-template-columns:1fr;
  }
}


.new-header-wrap .tooltip-trigger a{ color:#222!important }




























.sad-wrap {
      width: 100%;
      /*! min-height: 100vh; */
      /*! background:
        radial-gradient(circle at top left, rgba(255, 255, 255, 0.14), transparent 34%), linear-gradient(180deg, #f7fbfa 0%, #fff 100%); */
    }

    .sad-wrap a {
      text-decoration: none;
    }

    .sad-header {
      width: 100%;
      background: rgba(255,255,255,0.88);
      backdrop-filter: blur(14px);
      border-bottom: 1px solid #e1eeeb;
      position: sticky;
      top: 0;
      z-index: 99;
    }

    .sad-container {
      /*! width: min(1180px, calc(100% - 32px)); */
      margin: 0 auto;
    }

    .sad-nav {
      min-height: 78px;
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 24px;
    }

    .sad-logo {
      display: flex;
      align-items: center;
      gap: 12px;
      color: #0d5a58;
      font-weight: 500;
      font-size: 20px;
    }

    .sad-logo-mark {
      width: 46px;
      height: 46px;
      border-radius: 15px;
      background: linear-gradient(135deg, #12a89d, #0d6f68);
      color: #fff;
      display: flex;
      align-items: center;
      justify-content: center;
      font-weight: 500;
      box-shadow: 0 12px 28px rgba(13, 111, 104, 0.25);
    }

    .sad-menu {
      display: flex;
      gap: 22px;
      align-items: center;
      list-style: none;
      padding: 0;
      margin: 0;
    }

    .sad-menu a {
      color: #315360;
      font-size: 14px;
      font-weight: 500;
    }

    .sad-menu a:hover {
      color: #0d9187;
    }

    .sad-nav-actions {
      display: flex;
      align-items: center;
      gap: 12px;
    }

    .sad-lang {
      border: 1px solid #d6e7e4;
      background: #fff;
      color: #0d6f68;
      border-radius: 999px;
      padding: 11px 15px;
      font-size: 13px;
      font-weight: 500;
      cursor: pointer;
    }

    .sad-donate {
      border: none;
      background: linear-gradient(90deg, #12a89d, #0d6f68);
      color: #fff;
      border-radius: 999px;
      padding: 12px 20px;
      font-size: 14px;
      font-weight: 500;
      cursor: pointer;
      box-shadow: 0 12px 28px rgba(13, 111, 104, 0.23);
    }

    .sad-mobile-btn {
      display: none;
      width: 42px;
      height: 42px;
      border: 1px solid #d6e7e4;
      background: #fff;
      border-radius: 12px;
      font-size: 22px;
      cursor: pointer;
      color: #0d6f68;
    }

    .sad-hero {
      padding: 64px 0 46px;
    }

    .sad-hero-grid {
      display: grid;
      grid-template-columns: 1.05fr 0.95fr;
      gap: 34px;
      align-items: center;
    }

    .sad-breadcrumb {
      display: inline-flex;
      align-items: center;
      gap: 8px;
      background: #ffffff;
      border: 1px solid #deebe8;
      color: #66808a;
      border-radius: 999px;
      padding: 10px 16px;
      font-size: 13px;
      font-weight: 500;
      margin-bottom: 22px;
    }

    .sad-hero h1 {
      margin: 0;
      color: #073f4f;
      font-size: clamp(36px, 5vw, 62px);
      line-height: 1.05;
      font-weight: 500;
      letter-spacing: -1.5px;
    }

    .sad-hero h1 span {
      color: #0d9187;
    }

    .sad-hero p {
      margin: 22px 0 0;
      color: #657f89;
      font-size: 17px;
      line-height: 1.75;
      max-width: 620px;
    }

    .sad-hero-actions {
      display: flex;
      gap: 14px;
      flex-wrap: wrap;
      margin-top: 30px;
    }

    .sad-btn {
      min-height: 52px;
      display: inline-flex;
      align-items: center;
      justify-content: center;
      border-radius: 8px;
      padding: 14px 24px;
      font-size: 15px;
      font-weight: 500;
      cursor: pointer;
      border: none;
      transition: 0.25s ease;
    }

    .sad-btn-primary {
      background: linear-gradient(90deg, #12a89d, #0d6f68);
      color: #fff;
      box-shadow: 0 14px 34px rgba(13, 111, 104, 0.24);
    }

    .sad-btn-primary:hover {
      transform: translateY(-2px);
      box-shadow: 0 18px 42px rgba(13, 111, 104, 0.3);
    }

    .sad-btn-outline {
      background: #fff;
      color: #0d6f68;
      border: 1.5px solid #bcded8;
    }

    .sad-btn-outline:hover {
      background: #eef9f7;
    }

    .sad-hero-card {
      background: #fff;
      border: 1px solid #deebe8;
      border-radius: 17px;
      overflow: hidden;
      box-shadow: 0 28px 80px rgba(18, 56, 74, 0.12);
    }

    .sad-hero-img {
      height: 330px;
      background:
        linear-gradient(rgba(13, 111, 104, 0.18), rgba(7, 63, 79, 0.46)),
        url("https://images.unsplash.com/photo-1488521787991-ed7bbaae773c?auto=format&fit=crop&w=1200&q=80");
      background-size: cover;
      background-position: center;
    }

    .sad-contact-strip {
      display: grid;
      grid-template-columns: 1fr 1fr;
      gap: 14px;
      padding: 18px;
    }

    .sad-contact-box {
      border-radius: 9px;
      background: #f3faf8;
      padding: 18px;
      border: 1px solid #dcebe8;
    }

    .sad-contact-box span {
      display: block;
      color: #29434e;
      font-size: 17px;
      font-weight: 500;
      margin-bottom: 6px;
    }

    .sad-contact-box strong {
      display: block;
      color: #073f4f;
      font-size: 20px;
      word-break: break-word;
      font-weight: 500;
    }

    .sad-section {
      padding: 34px 0;
    }

    .sad-section-head {
      text-align: center;
      margin-bottom: 34px;
    }

    .sad-section-head small {
      display: inline-block;
      color: #0d9187;
      font-weight: 500;
      margin-bottom: 10px;
      text-transform: uppercase;
      letter-spacing: 1px;
    }

    .sad-section-head h2 {
      margin: 0;
      font-size: clamp(28px, 2.1vw, 44px);
      color: #114c5c;
      line-height: 1.15;
      font-weight: 500;
    }

    .sad-section-head p {
      margin: 14px auto 0;
      color: #657f89;
      line-height: 1.7;
      max-width: 720px;
    }

    .sad-info-grid {
      display: grid;
      grid-template-columns: repeat(4, 1fr);
      gap: 18px;
      margin-bottom: 34px;
    }

    .sad-info-card {
      background: #fff;
      border: 1px solid #deebe8;
      border-radius: 15px;
      padding: 24px;
      box-shadow: 0 14px 40px rgba(18, 56, 74, 0.06);
    }

    .sad-info-icon {
      width: 48px;
      height: 48px;
      border-radius: 16px;
      /*! background: linear-gradient(135deg, #e8f8f5, #d8f1ed); */
      color: #0d9187;
      display: flex;
      align-items: center;
      justify-content: center;
      font-size: 47px;
      margin-bottom: 18px;
    }

    .sad-info-card h3 {
      margin: 0 0 10px;
      color: #073f4f;
      font-size: 18px;
    }

    .sad-info-card p {
      margin: 0;
      color: #657f89;
      line-height: 1.65;
      font-size: 14px;
    }

    .sad-doc-layout {
      display: grid;
      grid-template-columns: 310px 1fr;
      gap: 24px;
      align-items: start;
    }

    .sad-side-card {
      background: linear-gradient(180deg, #15999b, #114c5c);
      color: #fff;
      border-radius: 15px;
      padding: 28px;
      position: sticky;
      top: 30px;
      box-shadow: 0 20px 50px rgba(13, 111, 104, 0.24);
    }

    .sad-side-card h3 {
      margin: 0 0 12px;
      font-size: 24px;
      line-height: 1.2;
      color: #fff;
    }

    .sad-side-card p {
      margin: 0 0 22px;
      color: rgba(255,255,255,0.82);
      line-height: 1.45;
      font-size: 17px;
    }

    .sad-side-list {
      list-style: none;
      padding: 0;
      margin: 0;
      display: grid;
      gap: 12px;
    }

    .sad-side-list li {
      display: flex;
      align-items: center;
      gap: 10px;
      color: rgba(255,255,255,0.95);
      font-weight: 500;
      font-size: 15px;
    }

    .sad-side-list li::before {
      content: "";
      width: 22px;
      height: 21px;
      border-radius: 0;
      background: transparent;
      display: flex;
      align-items: center;
      justify-content: center;
      flex: 0 0 15px;
      background-image: url(../images/img/tick.svg);
      background-size: 100%;
      background-repeat: no-repeat;
    }

    .sad-docs {
      display: grid;
      gap: 22px;
    }

    .sad-doc-group {
      background: #fff;
      border: 1px solid #deebe8;
      border-radius: 15px;
      padding: 26px;
      box-shadow: 0 14px 40px rgba(18, 56, 74, 0.06);
    }

    .sad-doc-title {
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 16px;
      margin-bottom: 18px;
      padding-bottom: 16px;
      border-bottom: 1px solid #e8f1ef;
    }

    .sad-doc-title h3 {
      margin: 0;
      color: #073f4f;
      font-size: 22px;
      font-weight: 500;
    }

    .sad-doc-title span {
      color: #15999b;
      font-weight: 500;
      background: #15999b1f;
      padding: 8px 21px;
      border-radius: 999px;
      font-size: 17px;
    }

    .sad-doc-list {
      display: grid;
      grid-template-columns: repeat(2, 1fr);
      gap: 14px;
      list-style: none;
      padding: 0;
      margin: 0;
    }

    .sad-doc-list li {
      display: flex;
      align-items: flex-start;
      gap: 12px;
      background: #15999b0a;
      border: 1px solid #15999b59;
      border-radius: 9px;
      padding: 16px;
      color: #315360;
      line-height: 1.5;
      font-size: 18px;
      font-weight: 500;
    }

    .sad-doc-list li::before {
      content: "";
      width: 34px;
      height: 34px;
      border-radius: 999px;
      background: transparent;
      display: flex;
      align-items: center;
      justify-content: center;
      flex: 0 0 34px;
      font-size: 33px;
      background-image: url(../images/img/file-2.svg);
      background-size: cover;
      border-radius: 0;
    }

    .sad-notice {
      margin-top: 28px;
      background: #fff8e8;
      border: 1px solid #f3dfaa;
      border-radius: 13px;
      padding: 24px;
      display: flex;
      gap: 16px;
      align-items: flex-start;
    }

    .sad-notice-icon {
      width: 46px;
      height: 46px;
      border-radius: 15px;
      background: #ffe7a3;
      display: flex;
      align-items: center;
      justify-content: center;
      flex: 0 0 46px;
      font-size: 22px;
    }

    .sad-notice h3 {
      margin: 0 0 8px;
      color: #7a5312;
      font-size: 20px;
    }

    .sad-notice p {
      margin: 0;
      color: #745c2c;
      line-height: 1.65;
      font-weight: 650;
      font-size: 15px;
    }

    .sad-apply-box {
      margin-top: 26px;
      background: #fff;
      border: 1px solid #deebe8;
      border-radius: 13px;
      padding: 28px;
      display: grid;
      grid-template-columns: 1fr auto;
      gap: 20px;
      align-items: center;
      box-shadow: 0 16px 44px rgba(18, 56, 74, 0.08);
    }

    .sad-check {
      display: flex;
      gap: 12px;
      align-items: flex-start;
      color: #315360;
      line-height: 1.6;
      font-weight: 650;
    }

    .sad-check input {
      width: 20px;
      height: 20px;
      margin-top: 3px;
      accent-color: #0d9187;
      flex: 0 0 20px;
    }

    .sad-footer {
      margin-top: 40px;
      background: #073f4f;
      color: #fff;
      padding: 44px 0;
    }

    .sad-footer-grid {
      display: grid;
      grid-template-columns: 1.3fr 1fr 1fr 1fr;
      gap: 28px;
    }

    .sad-footer h4 {
      margin: 0 0 14px;
      font-size: 18px;
    }

    .sad-footer p,
    .sad-footer a {
      color: rgba(255,255,255,0.72);
      line-height: 1.7;
      font-size: 14px;
    }

    .sad-footer ul {
      margin: 0;
      padding: 0;
      list-style: none;
      display: grid;
      gap: 8px;
    }

    .sad-copy {
      border-top: 1px solid rgba(255,255,255,0.12);
      margin-top: 30px;
      padding-top: 20px;
      color: rgba(255,255,255,0.65);
      font-size: 14px;
    }

    .sad-floating {
      position: fixed;
      right: 22px;
      bottom: 22px;
      display: grid;
      gap: 12px;
      z-index: 80;
    }

    .sad-floating a {
      width: 54px;
      height: 54px;
      border-radius: 50%;
      background: linear-gradient(135deg, #12a89d, #0d6f68);
      color: #fff;
      display: flex;
      align-items: center;
      justify-content: center;
      font-size: 22px;
      box-shadow: 0 14px 34px rgba(13, 111, 104, 0.3);
    }

    @media (max-width: 1024px) {
      .sad-menu,
      .sad-nav-actions {
        display: none;
      }

      .sad-mobile-btn {
        display: block;
      }

      .sad-hero-grid,
      .sad-doc-layout {
        grid-template-columns: 1fr;
      }

      .sad-side-card {
        position: relative;
        top: 0;
      }

      .sad-info-grid {
        grid-template-columns: repeat(2, 1fr);
      }

      .sad-footer-grid {
        grid-template-columns: repeat(2, 1fr);
      }
    }

    @media (max-width: 640px) {
      .sad-container {
        width: min(100% - 22px, 1180px);
      }

      .sad-hero {
        padding: 42px 0 28px;
      }

      .sad-hero-img {
        height: 245px;
      }

      .sad-contact-strip,
      .sad-info-grid,
      .sad-doc-list,
      .sad-apply-box,
      .sad-footer-grid {
        grid-template-columns: 1fr;
      }

      .sad-doc-group {
        padding: 20px;
        border-radius: 22px;
      }

      .sad-doc-title {
        align-items: flex-start;
        flex-direction: column;
      }

      .sad-apply-box {
        padding: 22px;
      }

      .sad-btn {
        width: 100%;
      }

      .sad-floating {
        right: 14px;
        bottom: 14px;
      }

      .sad-floating a {
        width: 48px;
        height: 48px;
        font-size: 20px;
      }
    }










    .sad-hero-new {
  position: relative;
  padding: 78px 0 68px;
  overflow: hidden;
  background:
    radial-gradient(circle at 12% 10%, rgba(18,168,157,.16), transparent 34%),
    radial-gradient(circle at 92% 22%, rgba(13,111,104,.12), transparent 32%),
    linear-gradient(135deg, #f8fcfb 0%, #eef8f6 100%);
}

.sad-hero-new::before {
  content: "";
  position: absolute;
  width: 520px;
  height: 520px;
  right: -180px;
  top: -190px;
  border-radius: 50%;
  background: rgba(18,168,157,.10);
  filter: blur(4px);
}

.sad-hero-new::after {
  content: "";
  position: absolute;
  width: 260px;
  height: 260px;
  left: -90px;
  bottom: -110px;
  border-radius: 50%;
  background: rgba(13,111,104,.08);
}

.sad-hero-new-grid {
  position: relative;
  z-index: 2;
  display: grid;
  grid-template-columns: 1fr 0.95fr;
  gap: 56px;
  align-items: center;
}

.sad-hero-new-content {
  max-width: 700px;
}

.sad-hero-badge {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  background: rgba(255,255,255,.9);
  border: 1px solid #dcece8;
  color: #0d9187;
  border-radius: 999px;
  padding: 10px 16px;
  font-size: 13px;
  font-weight: 500;
  margin-bottom: 22px;
  box-shadow: 0 10px 28px rgba(18,56,74,.06);
}

.sad-hero-badge span {
  width: 9px;
  height: 9px;
  border-radius: 50%;
  background: #0d9187;
  box-shadow: 0 0 0 6px rgba(13,145,135,.12);
}

.sad-hero-new h1 {
  margin: 0;
  color: #073f4f;
  font-size: clamp(42px, 2.0vw, 69px);
  line-height: 46px;
  font-weight: 500;
  letter-spacing: 0;
}

.sad-hero-new h1 span {
  color: #15999b;
  position: relative;
}

.sad-hero-new h1 span::after {
  content: "";
  position: absolute;
  left: 4px;
  right: 4px;
  bottom: 5px;
  height: 12px;
  /*! background: rgba(18,168,157,.16); */
  z-index: -1;
  border-radius: 999px;
}

.sad-hero-new p {
  margin: 24px 0 0;
  color: #5f7983;
  font-size: 18px;
  line-height: 1.85;
  max-width: 620px;
}

.sad-hero-stats {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 14px;
  margin-top: 32px;
  max-width: 620px;
}

.sad-hero-stats div {
  background: rgba(255,255,255,.86);
  border: 1px solid #dcece8;
  border-radius: 10px;
  padding: 18px 16px;
  box-shadow: 0 14px 34px rgba(18,56,74,.06);
}

.sad-hero-stats strong {
  display: block;
  color: #15999b;
  font-size: 28px;
  font-weight: 500;
  line-height: 1;
  margin-bottom: 7px;
}

.sad-hero-stats span {
  display: block;
  color: #434343;
  font-size: 18px;
  font-weight: 500;
}

.sad-hero-actions {
  display: flex;
  gap: 14px;
  flex-wrap: wrap;
  margin-top: 32px;
}

.sad-btn {
  min-height: 56px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 8px;
  padding: 15px 26px;
  font-size: 18px;
  font-weight: 500;
  cursor: pointer;
  border: none;
  transition: .25s ease;
}

.sad-btn-primary {
  background: linear-gradient(90deg, #15999b, #146f87);
  color: #fff;
  box-shadow: 0 16px 36px rgba(13,111,104,.24);
}

.sad-btn-primary:hover {
  transform: translateY(-2px);
  box-shadow: 0 20px 44px rgba(13,111,104,.32);
}

.sad-btn-outline {
  background: rgba(255,255,255,.88);
  color: #15999b;
  border: 1.5px solid #15999ba6;
}

.sad-btn-outline:hover {
  background: #eef9f7;
}

.sad-hero-new-visual {
  position: relative;
  border-radius: 20px;
  overflow: hidden;
  border: solid 8px #ffffff29;
}

.sad-hero-img-card {
  position: relative;
  border-radius: 34px;
  overflow: hidden;
  background: #fff;
  padding: 14px;
  border: 1px solid #dcece8;
  /*! box-shadow: 0 34px 90px rgba(18,56,74,.16); */
}

.sad-hero-img-card::before {
  content: "";
  position: absolute;
  inset: 14px;
  border-radius: 26px;
  background: linear-gradient(180deg, transparent 38%, rgba(7,63,79,.72));
  z-index: 2;
  pointer-events: none;
}

.sad-hero-img-card img {
  width: 100%;
  height: 470px;
  object-fit: cover;
  display: block;
  border-radius: 26px;
}

.sad-floating-card {
  position: absolute;
  z-index: 4;
  display: flex;
  align-items: center;
  gap: 12px;
  background: rgba(255,255,255,.92);
  backdrop-filter: blur(12px);
  border: 1px solid rgba(255,255,255,.7);
  border-radius: 10px;
  padding: 15px 16px;
  box-shadow: 0 18px 44px rgba(18,56,74,.16);
  animation: sadHeroFloat 3.4s ease-in-out infinite;
}

.sad-card-top {
  top: 36px;
  left: -26px;
}

.sad-card-bottom {
  right: 36px;
  bottom: 36px;
  animation-delay: .6s;
}

.sad-floating-icon {
  width: 42px;
  height: 42px;
  border-radius: 14px;
  background: linear-gradient(135deg, #12a89d, #0d6f68);
  color: #fff;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 19px;
  font-weight: 500;
  flex: 0 0 42px;
}

.sad-floating-card strong {
  display: block;
  color: #073f4f;
  font-size: 17px;
  font-weight: 500;
  margin-bottom: 2px;
}

.sad-floating-card span {
  display: block;
  color: #657f89;
  font-size: 12px;
  font-weight: 500;
}

.sad-contact-modern {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 14px;
  margin-top: 16px;
}

.sad-contact-modern-box {
  background: rgba(255,255,255,.88);
  border: 1px solid #dcece8;
  border-radius: 15px;
  padding: 20px;
  box-shadow: 0 14px 34px rgba(18,56,74,.07);
}

.sad-contact-modern-box span {
  display: block;
  color: #718b95;
  font-size: 13px;
  font-weight: 500;
  margin-bottom: 8px;
}

.sad-contact-modern-box strong {
  display: block;
  color: #073f4f;
  font-size: 17px;
  line-height: 1.25;
  word-break: break-word;
}

@keyframes sadHeroFloat {
  0%, 100% {
    transform: translateY(0);
  }

  50% {
    transform: translateY(-10px);
  }
}

@media (max-width: 1024px) {
  .sad-hero-new {
    padding: 56px 0;
  }

  .sad-hero-new-grid {
    grid-template-columns: 1fr;
    gap: 38px;
  }

  .sad-hero-new-content {
    max-width: 100%;
  }

  .sad-hero-img-card img {
    height: 390px;
  }

  .sad-card-top {
    left: 24px;
  }

  .sad-card-bottom {
    right: 24px;
  }
}

@media (max-width: 640px) {
  .sad-hero-new {
    padding: 42px 0 38px;
  }

  .sad-hero-new h1 {
    font-size: 42px;
    letter-spacing: -1.3px;
  }

  .sad-hero-new p {
    font-size: 16px;
    line-height: 1.7;
  }

  .sad-hero-stats {
    grid-template-columns: 1fr;
  }

  .sad-hero-actions {
    flex-direction: column;
  }

  .sad-btn {
    width: 100%;
  }

  .sad-hero-img-card {
    border-radius: 24px;
    padding: 10px;
  }

  .sad-hero-img-card img {
    height: 300px;
    border-radius: 18px;
  }

  .sad-hero-img-card::before {
    inset: 10px;
    border-radius: 18px;
  }

  .sad-floating-card {
    position: relative;
    left: auto;
    right: auto;
    top: auto;
    bottom: auto;
    margin-top: 12px;
    animation: none;
  }

  .sad-contact-modern {
    grid-template-columns: 1fr;
  }

  .sad-contact-modern-box strong {
    font-size: 18px;
  }
}









.services-wrap-new {
  width: 100%;
  padding: 50px 0;
  /*! background: #f7faf8; */
  position: relative;
  overflow: hidden;
  background: linear-gradient(0deg,rgb(255, 255, 255) 0%, rgba(159, 206, 207, 0.2) 50%, rgb(255, 255, 255) 100%);
}

.services-wrap-new *,
.services-wrap-new *::before,
.services-wrap-new *::after {
  box-sizing: border-box;
}

.services-wrap-new::before {
  content: "";
  position: absolute;
  inset: 0;
  background:
    linear-gradient(rgba(15, 115, 96, 0.045) 1px, transparent 1px),
    linear-gradient(90deg, rgba(15, 115, 96, 0.045) 1px, transparent 1px);
  background-size: 42px 42px;
  pointer-events: none;
}

.services-new-container {
  max-width: 100%;
  margin: 0 auto;
  position: relative;
  z-index: 2;
}

.services-new-heading {
  max-width: 680px;
  margin: 0 auto 48px;
  text-align: center;
}

.services-new-heading span {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 8px 18px;
  border-radius: 100px;
  background: #e8f4ef;
  color: #0d765c;
  font-size: 13px;
  font-weight: 500;
  letter-spacing: 1px;
  text-transform: uppercase;
  margin-bottom: 16px;
}

.services-new-heading h2 {
  margin: 0;
  color: #102b24;
  font-size: 46px;
  line-height: 1.12;
  font-weight: 500;
  letter-spacing: -1.4px;
}

.services-new-heading p {
  margin: 18px auto 0;
  color: #657771;
  font-size: 16px;
  line-height: 1.8;
}

.services-new-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 18px;
}

.services-new-card {
  position: relative;
  display: flex;
  flex-direction: column;
  min-height: 235px;
  padding: 24px;
  border-radius: 15px;
  background: #ffffff;
  border: 1px solid rgba(19, 83, 68, 0.08);
  text-decoration: none;
  overflow: hidden;
  box-shadow: 0 12px 35px rgba(15, 58, 47, 0.06);
  transition: 0.35s ease;
  border: solid 1px #15999b7d;
}

.services-new-card::before {
  content: "";
  position: absolute;
  width: 160px;
  height: 160px;
  right: -85px;
  bottom: -85px;
  border-radius: 50%;
  background: #15999b21;
  transition: 0.35s ease;
}

.services-new-card::after {
  content: "";
  position: absolute;
  left: 24px;
  bottom: 0;
  width: 0;
  height: 4px;
  border-radius: inherit;
  background: #15999b;
  transition: 0.35s ease;
}

.services-new-card:hover {
  transform: translateY(-8px);
  border-color: rgb(21 153 155 / 18%);
  box-shadow: 0 24px 55px rgba(15, 58, 47, 0.13);
}

.services-new-card:hover::before {
  width: 220px;
  height: 220px;
  background: #15999b1f;
}

.services-new-card:hover::after {
  width: calc(100% - 48px);
}

.card-top {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 34px;
  position: relative;
  z-index: 2;
}

.card-icon {
  width: 52px;
  height: 52px;
  border-radius: 999px;
  background: #15999b1f;
  border: 1px solid rgba(21, 153, 155, 0.32);
  display: flex;
  align-items: center;
  justify-content: center;
  transition: 0.35s ease;
}

.card-icon i {
  font-style: normal;
  color: #ffffff;
  font-size: 20px;
  font-weight: 500;
}

.card-arrow {
  width: 38px;
  height: 38px;
  border-radius: 50%;
  background: #f6faf8;
  color: #0d765c;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 20px;
  transform: rotate(-35deg);
  transition: 0.35s ease;
}

.services-new-card:hover .card-icon {
  background: #15999b;
}

.services-new-card:hover .card-icon i {
  color: #ffffff;
}

.services-new-card:hover .card-arrow {
  background: #0d765c;
  color: #ffffff;
  transform: rotate(0deg);
}

.services-new-card h3 {
  margin: 0 0 12px;
  color: #114c5c;
  font-size: 22px;
  line-height: 1.35;
  font-weight: 500;
  letter-spacing: -0.4px;
  position: relative;
  z-index: 2;
}

.services-new-card p {
  margin: 0;
  color: #6a7b75;
  font-size: 16.5px;
  line-height: 1.5;
  position: relative;
  z-index: 2;
}

.services-featured-card {
  grid-column: span 2;
  border: none;
  background: linear-gradient(135deg, #114c5c, #15999b);
}

.services-featured-card::before {
  background: rgba(255, 255, 255, 0.17);
}

.services-featured-card::after {
  background: #ffffff;
}

.services-featured-card .card-icon {
  background: rgba(255, 255, 255, 0.14);
  border-color: rgba(255, 255, 255, 0.22);
}

.services-featured-card .card-icon i,
.services-featured-card h3,
.services-featured-card p {
  color: #ffffff;
}

.services-featured-card .card-arrow {
  background: rgba(255, 255, 255, 0.14);
  color: #ffffff;
}

.services-featured-card:hover .card-icon,
.services-featured-card:hover .card-arrow {
  background: #ffffff;
}

.services-featured-card:hover .card-icon i,
.services-featured-card:hover .card-arrow {
  color: #0d765c;
}

@media (max-width: 1100px) {
  .services-new-grid {
    grid-template-columns: repeat(3, 1fr);
  }

  .services-featured-card {
    grid-column: span 1;
  }
}

@media (max-width: 768px) {
  .services-wrap-new {
    padding: 70px 16px;
  }

  .services-new-heading {
    margin-bottom: 34px;
  }

  .services-new-heading h2 {
    font-size: 34px;
  }

  .services-new-heading p {
    font-size: 15px;
  }

  .services-new-grid {
    grid-template-columns: repeat(2, 1fr);
    gap: 15px;
  }

  .services-new-card {
    min-height: 220px;
    padding: 22px;
  }
}

@media (max-width: 520px) {
  .services-wrap-new {
    padding: 15px 0;
  }

  .services-new-heading h2 {
    font-size: 29px;
  }

  .services-new-grid {
    grid-template-columns: 1fr;
  }

  .services-new-card {
    min-height: auto;
    border-radius: 20px;
  }

  .card-top {
    margin-bottom: 26px;
  }
}














.services-details-wrap-new {
  --primary: #114c5c;
  --primary-2: #15999b;
  --dark: #142f29;
  --text: #5f716b;
  --line: #dcebe6;
  --soft: #eef8f4;
  --white: #ffffff;

  width: 100%;
  padding: 50px 0px;
  background:
    radial-gradient(circle at 10% 5%, rgba(18, 164, 127, 0.09), transparent 28%), radial-gradient(circle at 90% 35%, rgba(11, 114, 92, 0.08), transparent 26%), linear-gradient(135deg, #f7fbf9 0%, #15999b0f 55%, #fff 100%);
  overflow: hidden;
  position: relative;
  background: linear-gradient(0deg,rgb(255, 255, 255) 0%, rgba(159, 206, 207, 0.2) 50%, rgb(255, 255, 255) 100%);
}

bo {
  box-sizing: border-box;
}

.services-details-wrap-new::before {
  content: "";
  position: absolute;
  inset: 0;
  background-image:
    linear-gradient(rgba(11, 114, 92, 0.035) 1px, transparent 1px),
    linear-gradient(90deg, rgba(11, 114, 92, 0.035) 1px, transparent 1px);
  background-size: 46px 46px;
  pointer-events: none;
}

.sdn-container {
  max-width: 100%;
  margin: 0 auto;
  position: relative;
  z-index: 2;
}

/* Hero */
.sdn-hero-modern {
  display: grid;
  grid-template-columns: 1.15fr 0.85fr;
  gap: 26px;
  align-items: center;
  padding: 42px;
  border-radius: 20px;
  background:
    linear-gradient(135deg, rgb(17, 76, 92), rgb(21, 153, 155)), radial-gradient(circle at top right, rgba(255,255,255,0.25), transparent 35%);
  position: relative;
  overflow: hidden;
  box-shadow: 0 30px 80px rgba(11, 84, 68, 0.18);
  margin-bottom: 22px;
}

.sdn-hero-modern::before {
  content: "";
  position: absolute;
  width: 420px;
  height: 420px;
  right: -170px;
  top: -160px;
  border-radius: 50%;
  background: rgba(255,255,255,0.12);
  animation: sdnFloat 7s ease-in-out infinite;
}

.sdn-hero-modern::after {
  content: "";
  position: absolute;
  width: 220px;
  height: 220px;
  left: 48%;
  bottom: -120px;
  border-radius: 50%;
  background: rgba(255,255,255,0.09);
  animation: sdnFloat 6s ease-in-out infinite reverse;
}

.sdn-hero-left,
.sdn-hero-right {
  position: relative;
  z-index: 2;
}

.sdn-pill {
  display: inline-flex;
  padding: 9px 16px;
  border-radius: 999px;
  background: rgba(255,255,255,0.16);
  border: 1px solid rgba(255,255,255,0.18);
  color: #ffffff;
  font-size: 13px;
  font-weight: 500;
  margin-bottom: 16px;
}

.sdn-hero-modern h1 {
  margin: 0;
  max-width: 720px;
  color: #ffffff;
  font-size: 40px;
  line-height: 1.1;
  font-weight: 500;
  letter-spacing: -1.4px;
}

.sdn-hero-modern p {
  margin: 18px 0 0;
  max-width: 650px;
  color: rgba(255,255,255,0.86);
  font-size: 16px;
  line-height: 1.85;
}

.sdn-action-row {
  display: flex;
  gap: 14px;
  flex-wrap: wrap;
  margin-top: 30px;
}

.sdn-primary-btn,
.sdn-secondary-btn,
.sdn-support-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 52px;
  padding: 0 24px;
  border-radius: 8px;
  text-decoration: none;
  font-size: 17px;
  font-weight: 500;
  transition: 0.35s ease;
}

.sdn-primary-btn {
  background: #ffffff;
  color: var(--primary);
  box-shadow: 0 18px 35px rgba(0,0,0,0.14);
}

.sdn-secondary-btn {
  color: #ffffff;
  border: 1px solid rgba(255,255,255,0.24);
  background: rgba(255,255,255,0.11);
}

.sdn-primary-btn:hover,
.sdn-secondary-btn:hover {
  transform: translateY(-5px);
}

.sdn-orbit-card {
  width: 340px;
  height: 340px;
  margin-left: auto;
  border-radius: 50%;
  background: rgba(255,255,255,0.11);
  border: 1px solid rgba(255,255,255,0.17);
  backdrop-filter: blur(12px);
  position: relative;
  animation: sdnFloat 6s ease-in-out infinite;
}

.sdn-orbit-card::before,
.sdn-orbit-card::after {
  content: "";
  position: absolute;
  inset: 35px;
  border-radius: 50%;
  border: 1px dashed rgba(255,255,255,0.35);
}

.sdn-orbit-card::after {
  inset: 76px;
  border-style: solid;
  opacity: 0.32;
}

.sdn-orbit-circle {
  width: 150px;
  height: 150px;
  border-radius: 50%;
  background: #ffffff;
  color: var(--primary);
  position: absolute;
  left: 95px;
  top: 95px;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
  box-shadow: 0 18px 45px rgba(0,0,0,0.16);
}

.sdn-orbit-circle span {
  width: 44px;
  height: 44px;
  border-radius: 50%;
  background: linear-gradient(135deg, var(--primary), var(--primary-2));
  margin-bottom: 10px;
  position: relative;
}

.sdn-orbit-circle span::before {
  content: "✓";
  position: absolute;
  inset: 0;
  color: #ffffff;
  display: flex;
  align-items: center;
  justify-content: center;
  font-weight: 500;
}

.sdn-orbit-circle strong {
  font-size: 22px;
}

.sdn-mini-card {
  position: absolute;
  min-width: 126px;
  padding: 14px 16px;
  border-radius: 10px;
  background: #ffffff;
  box-shadow: 0 18px 40px rgba(0,0,0,0.13);
  transition: 0.35s ease;
}

.sdn-mini-card:hover {
  transform: translateY(-6px) scale(1.03);
}

.sdn-mini-card b {
  display: block;
  color: var(--dark);
  font-size: 18px;
  margin-bottom: 4px;
}

.sdn-mini-card small {
  color: var(--text);
  font-size: 12px;
}

.sdn-mini-one {
  left: -18px;
  top: 52px;
}

.sdn-mini-two {
  right: -12px;
  top: 190px;
}

.sdn-mini-three {
  left: 50px;
  bottom: -10px;
}

/* Summary */
.sdn-summary-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 16px;
  margin-bottom: 24px;
}

.sdn-summary-card {
  padding: 22px;
  border-radius: 15px;
  background: rgba(255,255,255,0.92);
  border: 1px solid rgba(11,114,92,0.10);
  box-shadow: 0 16px 42px rgba(12, 58, 47, 0.07);
  transition: 0.35s ease;
  position: relative;
  overflow: hidden;
  display: flex;
  gap: 29px;
  align-items: center;
}

.sdn-summary-card::before {
  content: "";
  position: absolute;
  width: 110px;
  height: 110px;
  right: -58px;
  top: -58px;
  border-radius: 50%;
  background: var(--soft);
  transition: 0.35s ease;
}

.sdn-summary-card:hover {
  transform: translateY(-8px);
  box-shadow: 0 24px 58px rgba(12, 58, 47, 0.12);
}

.sdn-summary-card:hover::before {
  width: 150px;
  height: 150px;
  background: rgba(18,164,127,0.13);
}

.sdn-summary-icon {
  width: 85px;
  height: 85px;
  border-radius: 50%;
  background: #e8f6f6;
  color: var(--primary);
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 14px;
  font-weight: 500;
  margin-bottom: 0;
  position: relative;
  z-index: 2;
  transition: 0.35s ease;
  border: dashed 2px #15999b75;
  padding: 11px;
}

.sdn-summary-card:hover .sdn-summary-icon {
  background: transparent;
  color: #ffffff;
  transform: rotate(-5deg);
}

.sdn-summary-card span {
  display: block;
  color: var(--text);
  font-size: 17px;
  margin-bottom: 6px;
  position: relative;
  z-index: 2;
}

.sdn-summary-card h3 {
  margin: 0;
  color: #114c5c;
  font-size: 18px;
  font-weight: 500;
  position: relative;
  z-index: 2;
}

/* Layout */
.sdn-main-layout {
  display: grid;
  grid-template-columns: 1fr 355px;
  gap: 24px;
  align-items: start;
}

.sdn-content-area {
  min-width: 0;
}

/* Tabs */
.sdn-modern-tabs {
  display: flex;
  gap: 10px;
  padding: 10px;
  overflow-x: auto;
  border-radius: 15px;
  background: rgba(255,255,255,0.94);
  border: 1px solid rgba(11,114,92,0.09);
  box-shadow: 0 16px 40px rgba(12, 58, 47, 0.06);
  margin-bottom: 20px;
  position: sticky;
  top: 10px;
  z-index: 8;
  backdrop-filter: blur(14px);
}

.sdn-modern-tabs a {
  text-decoration: none;
  white-space: nowrap;
  color: var(--text);
  font-size: 16px;
  font-weight: 500;
  padding: 13px 18px;
  border-radius: 6px;
  transition: 0.3s ease;
}

.sdn-modern-tabs a:hover,
.sdn-modern-tabs a.active {
  background: linear-gradient(135deg, #114c5c, #15999b);
  color: #ffffff;
}

/* Content Cards */
.sdn-section-card {
  padding: 20px;
  border-radius: 16px;
  /*! background: rgba(255,255,255,0.96); */
  border: 1px solid rgba(11, 114, 92, 0.15);
  /*! box-shadow: 0 18px 48px rgba(12, 58, 47, 0.07); */
  /*! margin-bottom: 20px; */
  transition: 0.35s ease;
  position: relative;
  overflow: hidden;
  background-color: #ffff;
}

.sdn-section-card::before {
  content: "";
  position: absolute;
  width: 140px;
  height: 140px;
  right: -75px;
  top: -75px;
  border-radius: 50%;
  background: #fff;
  transition: 0.35s ease;
}

.sdn-section-card:hover {
  /* transform: translateY(-6px); */
  /* box-shadow: 0 26px 64px rgba(12, 58, 47, 0.12); */
}

.sdn-section-card:hover::before {
  width: 210px;
  height: 210px;
}

.sdn-section-head {
  display: flex;
  align-items: center;
  gap: 16px;
  margin-bottom: 24px;
  position: relative;
  z-index: 2;
}

.sdn-title-mark {
  width: 52px;
  height: 52px;
  border-radius: 999px;
  background: var(--soft);
  color: var(--primary);
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 15px;
  font-weight: 500;
  flex: 0 0 auto;
  padding: 8px;
  border: dashed 1px #15999b;
}

.sdn-section-head h2 {
  margin: 0 0 1px;
  color: var(--dark);
  font-size: 23px;
  font-weight: 500;
  letter-spacing: .5px;
}

.sdn-section-head p {
  margin: 0;
  color: var(--text);
  font-size: 14px;
}

/* Overview */
.sdn-overview-box {
  display: grid;
  grid-template-columns: 1.05fr 0.95fr;
  gap: 20px;
  position: relative;
  z-index: 2;
}

.sdn-overview-copy > p {
  margin: 0 0 20px;
  color: var(--text);
  font-size: 15px;
  line-height: 1.85;
}

.sdn-check-list {
  display: grid;
  gap: 12px;
  grid-template-columns: repeat(2, 1fr);
  gap: 9px;
}

.sdn-check-list div {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 14px;
  border-radius: 10px;
  background: #f8fcfa;
  border: 1px solid #e6f1ed;
  transition: 0.3s ease;
}

.sdn-check-list div:hover {
  transform: translateX(6px);
  background: var(--soft);
}

.sdn-check-list span {
  width: 28px;
  height: 28px;
  border-radius: 50%;
  background: linear-gradient(135deg, var(--primary), var(--primary-2));
  color: #ffffff;
  display: flex;
  align-items: center;
  justify-content: center;
  font-weight: 500;
  flex: 0 0 auto;
}

.sdn-check-list p {
  margin: 0;
  color: var(--dark);
  font-size: 17px;
  font-weight: 500;
}

.sdn-data-visual {
  padding: 24px;
  border-radius: 26px;
  background:
    linear-gradient(180deg, #f8fcfa 0%, #eef8f4 100%);
  border: 1px solid #deeee8;
}

.sdn-visual-top {
  display: flex;
  justify-content: space-between;
  gap: 14px;
  align-items: center;
  margin-bottom: 24px;
}

.sdn-visual-top h4 {
  margin: 0;
  color: var(--dark);
  font-size: 19px;
  font-weight: 500;
}

.sdn-visual-top small {
  color: var(--text);
  font-size: 12px;
}

.sdn-progress-lines {
  display: grid;
  gap: 18px;
}

.sdn-progress-lines div span {
  display: block;
  color: var(--text);
  font-size: 13px;
  margin-bottom: 8px;
}

.sdn-progress-lines div {
  position: relative;
}

.sdn-progress-lines div::after {
  content: "";
  display: block;
  height: 10px;
  border-radius: 999px;
  background: #ffffff;
  border: 1px solid #deeee8;
}

.sdn-progress-lines b {
  position: absolute;
  left: 0;
  bottom: 0;
  height: 10px;
  border-radius: 999px;
  background: linear-gradient(90deg, var(--primary), var(--primary-2));
  animation: sdnProgress 1.2s ease both;
}

/* Requirements */
.sdn-modern-requirements {
  display: grid;
  grid-template-columns: repeat(1, 1fr);
  gap: 18px;
  position: relative;
  z-index: 2;
}

.sdn-requirement-box {
  padding: 24px;
  border-radius: 26px;
  background: #f8fcfa;
  border: 1px solid #e1eee9;
  transition: 0.35s ease;
}

.sdn-requirement-box:hover {
  background: #ffffff;
  transform: translateY(-8px);
  box-shadow: 0 20px 45px rgba(12, 58, 47, 0.10);
}

.sdn-req-number {
  width: 54px;
  height: 54px;
  border-radius: 18px;
  background: linear-gradient(135deg, var(--primary), var(--primary-2));
  color: #ffffff;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 20px;
  font-weight: 500;
  margin-bottom: 18px;
}

.sdn-requirement-box h4 {
  margin: 0 0 10px;
  color: var(--dark);
  font-size: 18px;
  font-weight: 500;
}

.sdn-requirement-box p {
  margin: 0;
  color: var(--text);
  font-size: 14px;
  line-height: 1.75;
}

/* Timeline */
.sdn-timeline-modern {
  position: relative;
  display: grid;
  gap: 18px;
  z-index: 2;
}

.sdn-timeline-modern::before {
  content: "";
  position: absolute;
  left: 25px;
  top: 24px;
  bottom: 24px;
  width: 2px;
  background: linear-gradient(180deg, var(--primary), var(--primary-2));
  opacity: 0.35;
}

.sdn-timeline-item {
  display: grid;
  grid-template-columns: 52px 1fr;
  gap: 16px;
  padding: 18px;
  border-radius: 24px;
  background: #f8fcfa;
  border: 1px solid #e1eee9;
  transition: 0.35s ease;
  position: relative;
}

.sdn-timeline-item:hover {
  background: #ffffff;
  transform: translateX(6px);
  box-shadow: 0 18px 42px rgba(12, 58, 47, 0.09);
}

.sdn-dot {
  width: 52px;
  height: 52px;
  border-radius: 18px;
  background: linear-gradient(135deg, var(--primary), var(--primary-2));
  color: #ffffff;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 18px;
  font-weight: 500;
  z-index: 2;
}

.sdn-timeline-item h4 {
  margin: 0 0 8px;
  color: var(--dark);
  font-size: 18px;
  font-weight: 500;
}

.sdn-timeline-item p {
  margin: 0;
  color: var(--text);
  font-size: 14px;
  line-height: 1.75;
}

/* Attachments */
.sdn-empty-modern {
  display: flex;
  align-items: center;
  gap: 18px;
  padding: 24px;
  border-radius: 24px;
  background: #f8fcfa;
  border: 1px dashed #cfe2dc;
  position: relative;
  z-index: 2;
}

.sdn-empty-circle {
  width: 72px;
  height: 72px;
  border-radius: 22px;
  background: #ffffff;
  box-shadow: 0 12px 30px rgba(12, 58, 47, 0.08);
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 30px;
  flex: 0 0 auto;
}

.sdn-empty-modern h4 {
  margin: 0 0 8px;
  color: var(--dark);
  font-size: 21px;
  font-weight: 500;
}

.sdn-empty-modern p {
  margin: 0;
  color: #585a59;
  font-size: 16px;
  line-height: 1.7;
}

/* Terms */
.sdn-modern-checkbox {
  display: flex;
  gap: 12px;
  align-items: center;
  padding: 16px 18px;
  border-radius: 10px;
  background: #f2f9f9;
  border: 1px solid #c5e2e2;
  cursor: pointer;
  margin-bottom: 18px;
  position: relative;
  z-index: 2;
  font-size: 18px;
}

.sdn-modern-checkbox input {
  width: 18px;
  height: 18px;
  accent-color: var(--primary);
}

.sdn-modern-checkbox span {
  color: var(--dark);
  font-size: 17px;
  line-height: 1.6;
}

.sdn-confirm-modern {
  min-height: 52px;
  padding: 0 26px;
  border: none;
  border-radius: 8px;
  background: linear-gradient(135deg, var(--primary), var(--primary-2));
  color: #ffffff;
  font-size: 17px;
  font-weight: 500;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  transition: 0.35s ease;
  position: relative;
  z-index: 2;
}

.sdn-confirm-modern:hover {
  transform: translateY(-5px);
  box-shadow: 0 18px 36px rgba(11, 114, 92, 0.25);
}

/* Sidebar */
.sdn-sidebar-modern {
  position: sticky;
  top: 20px;
  display: grid;
  gap: 18px;
}

.sdn-side-panel,
.sdn-support-panel {
  padding: 24px;
  border-radius: 14px;
  background: rgba(255,255,255,0.96);
  border: 1px solid rgba(11,114,92,0.10);
  box-shadow: 0 18px 45px rgba(12, 58, 47, 0.07);
  transition: 0.35s ease;
}

.sdn-side-panel:hover,
.sdn-support-panel:hover {
  /* transform: translateY(-5px); */
}

.sdn-side-panel h3,
.sdn-support-panel h3 {
  margin: 0 0 18px;
  color: var(--dark);
  font-size: 21px;
  font-weight: 500;
}

.sdn-info-line {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  padding: 14px 0;
  border-bottom: 1px solid var(--line);
}

.sdn-info-line:last-child {
  border-bottom: none;
}

.sdn-info-line span {
  color: var(--text);
  font-size: 14px;
}

.sdn-info-line strong {
  color: var(--dark);
  font-size: 14px;
  text-align: right;
}

.sdn-related-modern {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 12px;
  text-decoration: none;
  color: var(--dark);
  padding: 15px;
  border-radius: 18px;
  background: #f8fcfa;
  border: 1px solid #e1eee9;
  margin-bottom: 12px;
  font-size: 14px;
  font-weight: 500;
  transition: 0.35s ease;
}

.sdn-related-modern:last-child {
  margin-bottom: 0;
}

.sdn-related-modern:hover {
  background: linear-gradient(135deg, var(--primary), var(--primary-2));
  color: #ffffff;
  transform: translateX(6px);
}

.sdn-support-panel {
  background: linear-gradient(135deg, var(--primary), var(--primary-2));
  color: #ffffff;
  overflow: hidden;
  position: relative;
}

.sdn-support-panel::before {
  content: "";
  position: absolute;
  width: 170px;
  height: 170px;
  right: -80px;
  top: -80px;
  border-radius: 50%;
  background: rgba(255,255,255,0.13);
}

.sdn-support-panel > * {
  position: relative;
  z-index: 2;
}

.sdn-support-panel span {
  display: inline-flex;
  padding: 7px 13px;
  border-radius: 999px;
  background: rgba(255,255,255,0.15);
  font-size: 12px;
  font-weight: 500;
  margin-bottom: 14px;
}

.sdn-support-panel h3 {
  color: #ffffff;
  margin-bottom: 10px;
}

.sdn-support-panel p {
  margin: 0 0 18px;
  color: rgba(255,255,255,0.82);
  font-size: 16px;
  line-height: 1.55;
}

.sdn-support-item {
  padding: 14px;
  border-radius: 10px;
  background: rgba(255,255,255,0.12);
  border: 1px solid rgba(255,255,255,0.12);
  margin-bottom: 12px;
}

.sdn-support-item small {
  display: block;
  color: rgba(255,255,255,0.72);
  font-size: 12px;
  margin-bottom: 5px;
}

.sdn-support-item strong {
  color: #ffffff;
  font-size: 19px;
  word-break: break-word;
  font-weight: 500;
}

.sdn-support-btn {
  width: 100%;
  background: #ffffff;
  color: var(--primary);
  margin-top: 4px;
}

.sdn-support-btn:hover {
  transform: translateY(-4px);
}

/* Animations */
@keyframes sdnFloat {
  0%, 100% {
    transform: translateY(0);
  }

  50% {
    transform: translateY(-12px);
  }
}

@keyframes sdnProgress {
  from {
    width: 0;
  }
}

/* Responsive */
@media (max-width: 1100px) {
  .sdn-hero-modern {
    grid-template-columns: 1fr;
  }

  .sdn-orbit-card {
    margin: 20px auto 0;
  }

  .sdn-summary-grid {
    grid-template-columns: repeat(2, 1fr);
  }

  .sdn-main-layout {
    grid-template-columns: 1fr;
  }

  .sdn-sidebar-modern {
    position: static;
    grid-template-columns: repeat(3, 1fr);
  }
}

@media (max-width: 860px) {
  .services-details-wrap-new {
    padding: 55px 14px;
  }

  .sdn-hero-modern {
    padding: 30px;
    border-radius: 28px;
  }

  .sdn-hero-modern h1 {
    font-size: 36px;
  }

  .sdn-overview-box,
  .sdn-modern-requirements {
    grid-template-columns: 1fr;
  }

  .sdn-sidebar-modern {
    grid-template-columns: 1fr;
  }

  .sdn-modern-tabs {
    position: relative;
    top: auto;
  }
}

@media (max-width: 620px) {
  .sdn-summary-grid {
    grid-template-columns: 1fr;
  }

  .sdn-hero-modern h1 {
    font-size: 29px;
  }

  .sdn-hero-modern p {
    font-size: 14px;
  }

  .sdn-action-row {
    flex-direction: column;
  }

  .sdn-primary-btn,
  .sdn-secondary-btn,
  .sdn-confirm-modern {
    width: 100%;
  }

  .sdn-orbit-card {
    width: 280px;
    height: 280px;
  }

  .sdn-orbit-circle {
    width: 124px;
    height: 124px;
    left: 78px;
    top: 78px;
  }

  .sdn-mini-card {
    position: static;
    margin: 12px auto 0;
    width: 180px;
  }

  .sdn-section-card {
    padding: 22px;
    border-radius: 24px;
  }

  .sdn-section-head {
    align-items: flex-start;
  }

  .sdn-section-head h2 {
    font-size: 22px;
  }

  .sdn-empty-modern {
    flex-direction: column;
    text-align: center;
  }
}



















.sad-wrap {
  width: 100%;
}

.ne-tab-menu {
  width: 100%;
  display: flex;
  gap: 6px;
  align-items: center;
  background: #fff;
  padding: 12px;
  border-radius: 11px;
  margin-bottom: 28px;
  box-shadow: 0 14px 40px rgba(0, 0, 0, 0.04);
  overflow-x: auto;
  border: solid 1px #cccccc80;
}

.ne-tab-btn {
  position: relative;
  border: 0;
  outline: none;
  background: transparent;
  padding: 16px 26px;
  border-radius: 10px;
  font-size: 17px;
  font-weight: 500;
  color: #0e727b;
  cursor: pointer;
  transition: color 0.35s ease, transform 0.35s ease;
  overflow: hidden;
  z-index: 1;
  white-space: nowrap;
}

.ne-tab-btn::before {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(135deg, #0d6f78, #15979d);
  border-radius: inherit;
  opacity: 0;
  transform: scale(0.75);
  transition: transform 0.35s cubic-bezier(0.34, 1.56, 0.64, 1), opacity 0.25s ease;
  z-index: -1;
}

.ne-tab-btn::after {
  content: "";
  position: absolute;
  width: 35px;
  height: 80px;
  top: -18px;
  left: -50px;
  background: rgba(255, 255, 255, 0.35);
  transform: rotate(25deg);
  opacity: 0;
  transition: 0.45s ease;
  z-index: -1;
}

.ne-tab-btn:hover {
  color: #0d7f86;
  transform: translateY(-2px);
}

.ne-tab-btn:hover::before {
  opacity: 0.08;
  transform: scale(1);
}

.ne-tab-btn.active {
  color: #ffffff;
  transform: translateY(-2px);
  animation: tabPop 0.38s ease;
  box-shadow: 0 10px 24px rgba(13, 111, 120, 0.28);
}

.ne-tab-btn.active::before {
  opacity: 1;
  transform: scale(1);
}

.ne-tab-btn.active::after {
  opacity: 1;
  left: 120%;
}

.ne-tab-content {
  display: none;
  background: transparent;
  padding: 0;
  border-radius: 0;
  border: 0;
  box-shadow: 0;
}

.ne-tab-content.active {
  display: block;
  animation: contentFadeSlide 0.45s ease both;
}

@keyframes tabPop {
  0% {
    transform: translateY(0) scale(0.96);
  }
  60% {
    transform: translateY(-3px) scale(1.04);
  }
  100% {
    transform: translateY(-2px) scale(1);
  }
}

@keyframes contentFadeSlide {
  from {
    opacity: 0;
    transform: translateY(18px) scale(0.98);
  }
  to {
    opacity: 1;
    transform: translateY(0) scale(1);
  }
}

@media (max-width: 768px) {
  .ne-tab-menu {
    gap: 10px;
    padding: 10px;
  }

  .ne-tab-btn {
    padding: 13px 18px;
    font-size: 14px;
  }

  .ne-tab-content {
    padding: 24px;
    border-radius: 20px;
  }
}



.sdn-side-panel{ text-align:center; }
.sdn-side-panel img{ width:120px; }

.sdn-check-list-1 {
  display: block;}

 .sdn-check-list-1 li{ margin-bottom:5px; }





.services-new-card .card-icon {
  width: 100px;
  height: 100px;
  border-radius: 999px;
  background: #15999b0d;
  border: 2px dashed rgba(21, 153, 155, 0.7);
  display: flex;
  align-items: center;
  justify-content: center;
  transition: 0.35s ease;
  padding: 12px;
}


.services-new-card .card-top {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 20px;
  position: relative;
  z-index: 2;
}





.services-new-card:hover .card-icon img {
    filter: brightness(0) invert(1);
}

.services-featured-card .card-icon img {filter: brightness(0) invert(1);}

.services-featured-card:hover .card-icon img {filter:inherit;}




.services-details-wrap-new ul{ margin-left:0; padding-left: 15px;}




.login-mdn {
      min-height: auto;
      width: 100%;
      padding: 50px 0;
      display: flex;
      align-items: center;
      justify-content: center;
      position: relative;
      overflow: hidden;
      /*! background:
        radial-gradient(circle at 8% 18%, rgba(32, 164, 167, 0.22), transparent 28%),
        radial-gradient(circle at 92% 85%, rgba(5, 52, 72, 0.22), transparent 30%),
        linear-gradient(135deg, #f8fcfc 0%, #edf7f7 48%, #ffffff 100%); */
      background: linear-gradient(0deg,rgb(255, 255, 255) 0%, rgba(159, 206, 207, 0.2) 50%, rgb(255, 255, 255) 100%);
    }

    .login-mdn::before {
      content: "";
      position: absolute;
      width: 520px;
      height: 520px;
      border-radius: 50%;
      /*! background: linear-gradient(135deg, rgba(31, 166, 167, 0.24), rgba(0, 55, 77, 0.08)); */
      left: -210px;
      top: -160px;
      animation: mdnFloat 9s ease-in-out infinite;
      /*! background: linear-gradient(0deg,rgb(255, 255, 255) 0%, rgba(159, 206, 207, 0.2) 50%, rgb(255, 255, 255) 100%); */
    }

    .login-mdn::after {
      content: "";
      position: absolute;
      width: 430px;
      height: 430px;
      border-radius: 50%;
      /*! background: linear-gradient(135deg, rgba(0, 55, 77, 0.16), rgba(31, 166, 167, 0.18)); */
      right: -170px;
      bottom: -150px;
      animation: mdnFloat 8s ease-in-out infinite reverse;
    }

    @keyframes mdnFloat {
      0%, 100% {
        transform: translateY(0) scale(1);
      }
      50% {
        transform: translateY(-28px) scale(1.04);
      }
    }

    .login-mdn-shape {
      position: absolute;
      border-radius: 999px;
      background: rgba(255, 255, 255, 0.55);
      border: 1px solid rgba(20, 158, 159, 0.18);
      backdrop-filter: blur(12px);
      box-shadow: 0 20px 60px rgba(0, 55, 77, 0.08);
      z-index: 1;
    }

    .login-mdn-shape.one {
      width: 84px;
      height: 84px;
      left: 14%;
      bottom: 18%;
      animation: mdnDrift 7s ease-in-out infinite;
    }

    .login-mdn-shape.two {
      width: 58px;
      height: 58px;
      right: 16%;
      top: 14%;
      animation: mdnDrift 6s ease-in-out infinite reverse;
    }

    .login-mdn-shape.three {
      width: 18px;
      height: 18px;
      left: 22%;
      top: 22%;
      background: #0d5a6f;
      box-shadow: 0 0 0 12px rgba(13, 90, 111, 0.08);
      animation: mdnPulse 2.5s ease-in-out infinite;
    }

    @keyframes mdnDrift {
      0%, 100% {
        transform: translateY(0);
      }
      50% {
        transform: translateY(-24px);
      }
    }

    @keyframes mdnPulse {
      0%, 100% {
        transform: scale(1);
        opacity: 1;
      }
      50% {
        transform: scale(1.35);
        opacity: 0.55;
      }
    }

    .login-mdn-card {
      width: 100%;
      max-width: 100%;
      min-height: auto;
      display: grid;
      grid-template-columns: 1.05fr 0.95fr;
      position: relative;
      z-index: 2;
      border-radius: 20px;
      overflow: hidden;
      background: rgba(255, 255, 255, 0.78);
      border: 1px solid rgba(197, 197, 197, 0.88);
      backdrop-filter: blur(24px);
      /*! box-shadow: 0 35px 100px rgba(0, 55, 77, 0.16); */
    }

    .login-mdn-left {
      padding: 46px;
      position: relative;
      overflow: hidden;
      color: #fff;
      background:
        linear-gradient(135deg, rgba(255, 255, 255, 0), rgba(0, 0, 0, 0.01)), url("../images/img/logins.jpg");
      background-size: cover;
      background-position: center;
      display: flex;
      flex-direction: column;
      justify-content: space-between;
    }

    .login-mdn-left::before {
      content: "";
      position: absolute;
      inset: 0;
      /*! background:
        linear-gradient(135deg, rgba(0, 42, 59, 0.88), rgba(19, 157, 159, 0.54)),
        radial-gradient(circle at 70% 25%, rgba(255,255,255,0.18), transparent 26%); */
      z-index: 0;
    }

    .login-mdn-left::after {
      content: "";
      position: absolute;
      width: 520px;
      height: 520px;
      border: 1px solid rgba(255, 255, 255, 0.22);
      border-radius: 50%;
      right: -180px;
      bottom: -180px;
      z-index: 0;
    }

    .login-mdn-brand,
    .login-mdn-hero,
    .login-mdn-mini {
      position: relative;
      z-index: 1;
    }

    .login-mdn-brand {
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 14px;
    }

    .login-mdn-logo {
      display: flex;
      align-items: center;
      gap: 12px;
      font-size: 20px;
      font-weight: 500;
      letter-spacing: -0.6px;
    }

    .login-mdn-logo span {
      width: 46px;
      height: 46px;
      border-radius: 16px;
      display: grid;
      place-items: center;
      background: rgba(255, 255, 255, 0.16);
      border: 1px solid rgba(255, 255, 255, 0.24);
      backdrop-filter: blur(10px);
      font-size: 22px;
    }

    .login-mdn-secure {
      padding: 9px 14px;
      border-radius: 999px;
      background: rgba(255, 255, 255, 0.14);
      border: 1px solid rgba(255, 255, 255, 0.22);
      font-size: 12px;
      font-weight: 500;
      color: rgba(255, 255, 255, 0.88);
    }

    .login-mdn-hero {
      max-width: 540px;
    }

    .login-mdn-hero .tag {
      display: inline-flex;
      align-items: center;
      gap: 8px;
      padding: 9px 14px;
      border-radius: 999px;
      background: rgba(255, 255, 255, 0.14);
      border: 1px solid rgba(255, 255, 255, 0.22);
      font-size: 13px;
      font-weight: 500;
      margin-bottom: 20px;
    }

    .login-mdn-hero .tag i {
      width: 8px;
      height: 8px;
      border-radius: 50%;
      background: #fff;
      box-shadow: 0 0 0 7px rgba(255, 255, 255, 0.14);
    }

    .login-mdn-hero h1 {
      font-size: clamp(38px, 5.4vw, 66px);
      line-height: 0.98;
      letter-spacing: -2.8px;
      margin-bottom: 20px;
    }

    .login-mdn-hero p {
      max-width: 475px;
      font-size: 16px;
      line-height: 1.75;
      color: rgba(255, 255, 255, 0.84);
    }

    .login-mdn-mini {
      display: grid;
      grid-template-columns: repeat(3, 1fr);
      gap: 14px;
    }

    .login-mdn-mini-box {
      padding: 17px;
      border-radius: 9px;
      background: rgba(0, 0, 0, 0.21);
      border: 1px solid rgba(255, 255, 255, 0.2);
      backdrop-filter: blur(14px);
      transition: 0.35s ease;
    }

    .login-mdn-mini-box:hover {
      transform: translateY(-6px);
      background: rgba(255, 255, 255, 0.2);
    }

    .login-mdn-mini-box strong {
      display: block;
      font-size: 24px;
      font-weight: 500;
      margin-bottom: 5px;
    }

    .login-mdn-mini-box span {
      display: block;
      font-size: 12px;
      color: rgba(255, 255, 255, 0.78);
      line-height: 1.4;
    }

    .login-mdn-right {
      padding: 54px 58px;
      display: flex;
      align-items: center;
      justify-content: center;
      background:
        linear-gradient(180deg, rgba(255,255,255,0.92), rgba(247,251,251,0.86));
      position: relative;
    }

    .login-mdn-form {
      width: 100%;
      /*! max-width: 430px; */
      position: relative;
      z-index: 1;
    }

    .login-mdn-title-badge {
      display: inline-flex;
      align-items: center;
      gap: 9px;
      padding: 9px 14px;
      border-radius: 999px;
      background: rgba(20, 158, 159, 0.1);
      color: #149e9f;
      font-size: 13px;
      font-weight: 500;
      margin-bottom: 18px;
    }

    .login-mdn-title-badge span {
      width: 9px;
      height: 9px;
      border-radius: 50%;
      background: #149e9f;
      box-shadow: 0 0 0 7px rgba(20, 158, 159, 0.12);
    }

    .login-mdn-form h2 {
      font-size: 29px;
      line-height: 1.1;
      color: #00374d;
      letter-spacing: 0;
      margin-bottom: 10px;
    }

    .login-mdn-form .desc {
      color: #667085;
      font-size: 15px;
      line-height: 1.65;
      margin-bottom: 28px;
    }

    .uae-pass-btn {
      width: 100%;
      height: 75px;
      border: 0;
      border-radius: 9px;
      cursor: pointer;
      /*! background: linear-gradient(135deg, #101828, #00374d); */
      color: #464646;
      display: flex;
      align-items: center;
      justify-content: center;
      gap: 13px;
      font-size: 18px;
      font-weight: 500;
      /*! box-shadow: 0 18px 38px rgba(0, 55, 77, 0.24); */
      transition: 0.32s ease;
      margin-bottom: 24px;
      background-color: #e7e7e759;
      border: solid 1px #ccc;
      letter-spacing: .5px;
      font-weight: 500;
      text-transform: uppercase;
    }

    .uae-pass-btn:hover {
      transform: translateY(-3px);
      box-shadow: 0 22px 46px rgba(0, 55, 77, 0.32);
    }

    .uae-pass-icon {
      width: 36px;
      height: auto;
      border-radius: 9px;
      background: transparent;
      display: grid;
      place-items: center;
      color: #00374d;
      font-size: 18px;
      font-weight: 500;
    }

    .login-mdn-divider {
      display: flex;
      align-items: center;
      gap: 14px;
      margin: 4px 0 24px;
      color: #8a96a8;
      font-size: 13px;
      font-weight: 500;
    }

    .login-mdn-divider::before,
    .login-mdn-divider::after {
      content: "";
      flex: 1;
      height: 1px;
      background: #dce7e8;
    }

    .login-mdn-group {
      margin-bottom: 18px;
    }

    .login-mdn-group label {
      display: block;
      font-size: 17px;
      font-weight: 500;
      color: #344054;
      margin-bottom: 8px;
    }

    .login-mdn-input {
      position: relative;
    }

    .login-mdn-input input {
      width: 100%;
      height: 63px;
      border-radius: 9px;
      border: 1px solid #dce7e8;
      background: #fff;
      outline: none;
      padding: 0 54px 0 18px;
      color: #00374d;
      font-size: 17px;
      font-weight: 500;
      transition: 0.3s ease;
      box-shadow: 0 10px 28px rgba(0, 55, 77, 0.04);
    }

    .login-mdn-input input::placeholder {
      color: #98a2b3;
      font-weight: 500;
    }

    .login-mdn-input input:focus {
      border-color: #149e9f;
      box-shadow: 0 0 0 5px rgba(20, 158, 159, 0.12);
    }

    .login-mdn-input .icon {
      position: absolute;
      right: 18px;
      top: 50%;
      transform: translateY(-50%);
      color: #149e9f;
      font-size: 18px;
      cursor: pointer;
      user-select: none;
    }

    .login-mdn-options {
      display: flex;
      justify-content: space-between;
      align-items: center;
      gap: 12px;
      margin: 2px 0 24px;
    }

    .login-mdn-check {
      display: inline-flex;
      align-items: center;
      gap: 8px;
      color: #667085;
      font-size: 14px;
      font-weight: 500;
    }

    .login-mdn-check input {
      accent-color: #149e9f;
      width: 15px;
      height: 15px;
    }

    .login-mdn-options a {
      color: #149e9f;
      font-size: 14px;
      font-weight: 500;
      text-decoration: none;
    }

    .login-mdn-submit {
      width: 100%;
      height: 60px;
      border: 0;
      border-radius: 8px;
      background: linear-gradient(135deg, #1fa6a7, #007f86);
      color: #fff;
      font-size: 18px;
      font-weight: 500;
      cursor: pointer;
      box-shadow: 0 18px 36px rgba(31, 166, 167, 0.3);
      transition: 0.32s ease;
      background: linear-gradient(90deg, #15999b, #146f87);
    }

    .login-mdn-submit:hover {
      transform: translateY(-3px);
      box-shadow: 0 24px 44px rgba(31, 166, 167, 0.38);
    }

    .login-mdn-social {
      display: grid;
      grid-template-columns: 1fr 1fr;
      gap: 14px;
      margin-top: 24px;
    }

    .login-mdn-social button {
      height: 54px;
      border-radius: 10px;
      border: 1px solid #8ac2c4;
      background: #fff;
      color: #101828;
      font-size: 17px;
      font-weight: 500;
      cursor: pointer;
      transition: 0.3s ease;
      box-shadow: 0 10px 24px rgba(0, 55, 77, 0.04);
    }

    .login-mdn-social button:hover {
      border-color: #149e9f;
      color: #149e9f;
      transform: translateY(-2px);
    }

    .login-mdn-signup {
      margin-top: 28px;
      text-align: center;
      color: #667085;
      font-size: 14px;
      font-weight: 500;
    }

    .login-mdn-signup a {
      color: #149e9f;
      font-weight: 500;
      text-decoration: none;
    }

    @media (max-width: 980px) {
      .login-mdn-card {
        grid-template-columns: 1fr;
        max-width: 620px;
      }

      .login-mdn-left {
        min-height: 430px;
      }

      .login-mdn-right {
        padding: 48px 34px;
      }
    }

    @media (max-width: 620px) {
      .login-mdn {
        padding: 15px 0;
        align-items: flex-start;
      }

      .login-mdn-card {
        border-radius: 15px;
      }

      .login-mdn-left {
        padding: 28px;
        min-height: 240px;
      }

      .login-mdn-brand {
        align-items: flex-start;
      }

      .login-mdn-secure {
        display: none;
      }

      .login-mdn-hero h1 {
        font-size: 38px;
        letter-spacing: -1.6px;
      }

      .login-mdn-mini {
        grid-template-columns: repeat(3, 1fr);
        display: none;
      }

      .login-mdn-mini-box {
        padding: 14px 16px;
      }

      .login-mdn-right {
        padding: 18px 20px;
      }

      .login-mdn-form h2 {
        font-size: 18px;
      }

      .login-mdn-options {
        flex-direction: column;
        align-items: flex-start;
      }

      .login-mdn-social {
        grid-template-columns: 1fr;
      }

      .uae-pass-btn,
      .login-mdn-submit,
      .login-mdn-input input {
        height: 56px;
      }
    }

    @media (max-width: 390px) {
      .login-mdn-left {
        padding: 24px;
      }

      .login-mdn-right {
        padding: 30px 16px;
      }

      .login-mdn-logo {
        font-size: 17px;
      }

      .login-mdn-hero h1 {
        font-size: 34px;
      }
    }











.tabs-min-srv {
      max-width: 1100px;
      margin: 0 auto;
      background: rgba(255, 255, 255, 0.9);
      border: 1px solid #e6edf3;
      border-radius: 28px;
      box-shadow: 0 20px 60px rgba(12, 38, 65, 0.08);
      overflow: hidden;
    }

    .tabs-min-srv__top {
      padding: 28px 28px 10px;
      background: linear-gradient(135deg, #ffffff 0%, #f8fbfd 100%);
    }

    .tabs-min-srv__label {
      display: inline-flex;
      align-items: center;
      gap: 8px;
      padding: 8px 14px;
      border-radius: 999px;
      background: #eaf7fb;
      color: #0f6c8d;
      font-size: 13px;
      font-weight: 500;
      margin-bottom: 14px;
    }

    .tabs-min-srv__title {
      font-size: 34px;
      line-height: 1.15;
      font-weight: 500;
      color: #0f172a;
      margin-bottom: 10px;
    }

    .tabs-min-srv__desc {
      font-size: 15px;
      line-height: 1.7;
      color: #64748b;
      max-width: 760px;
      margin-bottom: 22px;
    }

    .tabs-min-srv__nav {
      display: flex;
      flex-wrap: wrap;
      gap: 12px;
      margin-bottom: 30px;
    }

    .tabs-min-srv__btn {
      border: 1px solid #d9e5ef;
      background: #fff;
      color: #15999b;
      padding: 14px 20px;
      border-radius: 9px;
      font-size: 18px;
      font-weight: 500;
      cursor: pointer;
      display: flex;
      align-items: center;
      gap: 10px;
      transition: all 0.3s ease;
      padding: 12px 10px;
      width: 227px;
      letter-spacing: 0;
      font-weight: 500;
    }

    .tabs-min-srv__btn i {
      font-size: 28px;
      color: ;
    }

    .tabs-min-srv__btn:hover {
      transform: translateY(-2px);
      box-shadow: 0 10px 24px rgba(15, 108, 141, 0.08);
      border-color: #b9d6e4;
    }

    .tabs-min-srv__btn.active {
      background: linear-gradient(135deg, #114c5c, #15999b);
      color: #fff;
      border-color: transparent;
      box-shadow: 0 14px 28px rgba(25, 167, 199, 0.25);
    }

    .tabs-min-srv__body {
      padding: 28px;
    }

    .tabs-min-srv__panel {
      display: none;
      animation: fadeTab 0.35s ease;
    }

    .tabs-min-srv__panel.active {
      display: block;
    }

    @keyframes fadeTab {
      from {
        opacity: 0;
        transform: translateY(10px);
      }
      to {
        opacity: 1;
        transform: translateY(0);
      }
    }

    .tabs-min-srv__content {
      display: grid;
      grid-template-columns: 1.15fr 0.85fr;
      gap: 24px;
      align-items: stretch;
    }

    .tabs-min-srv__card {
      background: linear-gradient(180deg, #ffffff 0%, #f9fbfd 100%);
      border: 1px solid #e7eef5;
      border-radius: 24px;
      padding: 26px;
      box-shadow: 0 12px 35px rgba(15, 23, 42, 0.04);
    }

    .tabs-min-srv__head {
      display: flex;
      align-items: center;
      gap: 16px;
      margin-bottom: 18px;
    }

    .tabs-min-srv__icon {
      width: 62px;
      height: 62px;
      border-radius: 18px;
      background: linear-gradient(135deg, #0f6c8d, #19a7c7);
      color: #fff;
      display: flex;
      align-items: center;
      justify-content: center;
      font-size: 24px;
      box-shadow: 0 14px 30px rgba(25, 167, 199, 0.25);
      flex-shrink: 0;
    }

    .tabs-min-srv__head h3 {
      font-size: 28px;
      line-height: 1.2;
      color: #0f172a;
      font-weight: 500;
      margin-bottom: 6px;
    }

    .tabs-min-srv__head p {
      font-size: 14px;
      line-height: 1.6;
      color: #64748b;
    }

    .tabs-min-srv__list {
      list-style: none;
      display: grid;
      gap: 14px;
      margin-top: 20px;
    }

    .tabs-min-srv__list li {
      display: flex;
      align-items: flex-start;
      gap: 12px;
      padding: 14px 16px;
      border-radius: 16px;
      background: #f8fbfd;
      border: 1px solid #ecf2f7;
      transition: 0.3s ease;
    }

    .tabs-min-srv__list li:hover {
      background: #f1f8fc;
      transform: translateX(3px);
    }

    .tabs-min-srv__list li i {
      color: #0f6c8d;
      font-size: 15px;
      margin-top: 4px;
      min-width: 18px;
    }

    .tabs-min-srv__list li span {
      font-size: 15px;
      line-height: 1.65;
      color: #334155;
      font-weight: 500;
    }

    .tabs-min-srv__side {
      display: flex;
      flex-direction: column;
      gap: 18px;
    }

    .tabs-min-srv__mini {
      background: linear-gradient(135deg, #0f6c8d, #19a7c7);
      color: #fff;
      border-radius: 24px;
      padding: 24px;
      min-height: 180px;
      position: relative;
      overflow: hidden;
    }

    .tabs-min-srv__mini::before {
      content: "";
      position: absolute;
      width: 150px;
      height: 150px;
      background: rgba(255,255,255,0.09);
      border-radius: 50%;
      right: -45px;
      top: -45px;
    }

    .tabs-min-srv__mini i {
      font-size: 28px;
      margin-bottom: 16px;
      display: inline-block;
    }

    .tabs-min-srv__mini h4 {
      font-size: 22px;
      line-height: 1.2;
      font-weight: 500;
      margin-bottom: 10px;
      position: relative;
      z-index: 1;
    }

    .tabs-min-srv__mini p {
      font-size: 14px;
      line-height: 1.7;
      color: rgba(255,255,255,0.9);
      position: relative;
      z-index: 1;
    }

    .tabs-min-srv__info {
      background: #ffffff;
      border: 1px solid #e7eef5;
      border-radius: 24px;
      padding: 22px;
    }

    .tabs-min-srv__info h5 {
      font-size: 18px;
      font-weight: 500;
      color: #0f172a;
      margin-bottom: 14px;
    }

    .tabs-min-srv__info ul {
      list-style: none;
      display: grid;
      gap: 12px;
    }

    .tabs-min-srv__info ul li {
      display: flex;
      gap: 10px;
      align-items: flex-start;
      color: #475569;
      font-size: 14px;
      line-height: 1.6;
    }

    .tabs-min-srv__info ul li i {
      color: #19a7c7;
      margin-top: 3px;
    }

    @media (max-width: 900px) {
      .tabs-min-srv__content {
        grid-template-columns: 1fr;
      }

      .tabs-min-srv__title {
        font-size: 28px;
      }
    }

    @media (max-width: 640px) {
      .tabs-min-srv__top,
      .tabs-min-srv__body {
        padding: 20px;
      }

      .tabs-min-srv__btn {
        width: 100%;
        justify-content: center;
      }

      .tabs-min-srv__head {
        align-items: flex-start;
      }

      .tabs-min-srv__head h3 {
        font-size: 24px;
      }

      .tabs-min-srv__icon {
        width: 54px;
        height: 54px;
        font-size: 20px;
      }

      .tabs-min-srv__title {
        font-size: 24px;
      }
    }











.tabs-min-srv__panel {
  display: none;
}

.tabs-min-srv__panel.active {
  display: block;
}


.mt-30{ margin-top:30px }
.mb-30{ margin-bottom:30px }
.mb-20{ margin-bottom:20px }













 .apply-info {
      min-height: auto;
      padding: 50px 0;
      display: flex;
      align-items: center;
      justify-content: center;
      position: relative;
      overflow: hidden;
      background: linear-gradient(0deg,rgb(255, 255, 255) 0%, rgba(159, 206, 207, 0.2) 50%, rgb(255, 255, 255) 100%);
    }

    .apply-info::before {
      content: "";
      position: absolute;
      inset: 0;
      background-image:
        linear-gradient(rgba(17, 145, 165, 0.055) 1px, transparent 1px),
        linear-gradient(90deg, rgba(17, 145, 165, 0.055) 1px, transparent 1px);
      background-size: 34px 34px;
      pointer-events: none;
    }

    .apply-info__wrap {
      width: 100%;
      max-width: 100%;
      position: relative;
      z-index: 1;
    }

    .apply-info__card {
      display: grid;
      grid-template-columns: 0.9fr 1.1fr;
      gap: 30px;
      align-items: stretch;
      background: rgba(255, 255, 255, 0.86);
      border: 1px solid rgba(198, 229, 236, 0.95);
      border-radius: 26px;
      padding: 15px;
      box-shadow: 0 30px 80px rgba(13, 64, 84, 0.1);
      overflow: hidden;
      position: relative;
    }

    .apply-info__card::after {
      content: "";
      position: absolute;
      width: 260px;
      height: 260px;
      border-radius: 50%;
      right: -110px;
      bottom: -110px;
      background: rgba(20, 158, 159, 0.08);
    }

    .apply-info__left {
      position: relative;
      z-index: 1;
      border-radius: 18px;
      padding: 30px;
      color: #fff;
      background:
        linear-gradient(135deg, rgba(7, 84, 103, 0.01), rgba(23, 164, 181, 0)), url("../images/img/arabic.webp");
      background-size: cover;
      background-position: center;
      overflow: hidden;
      display: flex;
      flex-direction: column;
      justify-content: space-between;
      min-height: auto;
    }

    .apply-info__left::before {
      content: "";
      position: absolute;
      inset: 0;
      background: linear-gradient(135deg, rgba(4, 56, 74, 0.92), rgba(22, 156, 173, 0.68));
      z-index: 0;
    }

    .apply-info__left::after {
      content: "";
      position: absolute;
      width: 260px;
      height: 260px;
      border-radius: 50%;
      border: 1px solid rgba(255,255,255,0.24);
      right: -90px;
      bottom: -90px;
      z-index: 0;
    }

    .apply-info__badge,
    .apply-info__hero,
    .apply-info__status {
      position: relative;
      z-index: 1;
    }

    .apply-info__badge {
      width: fit-content;
      display: inline-flex;
      align-items: center;
      gap: 9px;
      padding: 10px 15px;
      border-radius: 999px;
      background: rgba(255,255,255,0.15);
      border: 1px solid rgba(255,255,255,0.22);
      font-size: 13px;
      font-weight: 500;
      backdrop-filter: blur(10px);
    }

    .apply-info__hero h1 {
      font-size: clamp(34px, 2vw, 30px);
      line-height: 1.04;
      letter-spacing: 0;
      margin-bottom: 16px;
      font-weight: 500;
      color: #fff;
    }

    .apply-info__hero p {
      color: rgba(255,255,255,0.86);
      font-size: 15px;
      line-height: 1.8;
      max-width: 430px;
    }

    .apply-info__status {
      display: grid;
      gap: 12px;
    }

    .apply-info__status-item {
      display: flex;
      align-items: center;
      gap: 12px;
      padding: 14px;
      border-radius: 18px;
      background: rgba(0, 0, 0, 0.19);
      border: 1px solid rgba(255,255,255,0.2);
      backdrop-filter: blur(12px);
    }

    .apply-info__status-item i {
      width: 38px;
      height: 38px;
      border-radius: 13px;
      background: rgba(255,255,255,0.18);
      display: grid;
      place-items: center;
      flex-shrink: 0;
    }

    .apply-info__status-item strong {
      display: block;
      font-size: 14px;
      margin-bottom: 3px;
    }

    .apply-info__status-item span {
      display: block;
      font-size: 12px;
      color: rgba(255,255,255,0.75);
      line-height: 1.4;
    }

    .apply-info__right {
      position: relative;
      z-index: 1;
      padding: 14px 6px;
      display: flex;
      flex-direction: column;
      justify-content: center;
    }

    .apply-info__top {
      margin-bottom: 24px;
    }

    .apply-info__step {
      display: inline-flex;
      align-items: center;
      gap: 8px;
      padding: 9px 14px;
      border-radius: 999px;
      background: #e8f8fb;
      color: #108da0;
      font-size: 13px;
      font-weight: 500;
      margin-bottom: 14px;
    }

    .apply-info__top h2 {
      font-size: clamp(28px, 2vw, 38px);
      color: #07384b;
      font-weight: 500;
      letter-spacing: 0;
      margin-bottom: -1px;
    }

    .apply-info__top p {
      font-size: 15px;
      line-height: 1.8;
      color: #647985;
      max-width: 650px;
    }

    .apply-info__fetch {
      display: flex;
      align-items: center;
      gap: 20px;
      padding: 22px;
      border-radius: 15px;
      background: #f6fbfc;
      border: 1px solid #dceef2;
      margin-bottom: 24px;
    }

    .apply-info__loader {
      width: 78px;
      height: 78px;
      border-radius: 50%;
      border: 7px solid #dff4f7;
      border-top-color: #18a7b8;
      animation: applySpin 1s linear infinite;
      flex-shrink: 0;
    }

    @keyframes applySpin {
      to {
        transform: rotate(360deg);
      }
    }

    .apply-info__fetch h3 {
      font-size: 20px;
      color: #07384b;
      margin-bottom: 7px;
      font-weight: 500;
    }

    .apply-info__fetch p {
      font-size: 14px;
      color: #647985;
      line-height: 1.7;
    }

    .apply-info__grid {
      display: grid;
      grid-template-columns: repeat(2, 1fr);
      gap: 14px;
      margin-bottom: 24px;
    }

    .apply-info__item {
      background: #ffffff;
      border: 1px solid #dceef2;
      border-radius: 10px;
      padding: 18px;
      box-shadow: 0 12px 28px rgba(13, 64, 84, 0.04);
      transition: 0.3s ease;
      display: flex;
    }

    .apply-info__item:hover {
      transform: translateY(-4px);
      border-color: #18a7b8;
      box-shadow: 0 18px 34px rgba(13, 64, 84, 0.08);
    }

    .apply-info__item-icon {
      width: 42px;
      height: 42px;
      border-radius: 50%;
      background: #e8f8fb;
      color: #1093a6;
      display: grid;
      place-items: center;
      font-size: 17px;
      margin-bottom: 0;
      margin-right: 18px;
      border: dashed 1px #15999b;
    }

    .apply-info__item small {
      display: block;
      color: #51595d;
      font-size: 16px;
      font-weight: 500;
      margin-bottom: 5px;
    }

    .apply-info__item strong {
      display: block;
      color: #07384b;
      font-size: 18px;
      font-weight: 500;
      line-height: 1.5;
      word-break: break-word;
    }

    .apply-info__actions {
      display: flex;
      justify-content: space-between;
      gap: 14px;
      flex-wrap: wrap;
    }

    .apply-info__btn {
      min-height: 54px;
      padding: 0 24px;
      border-radius: 9px;
      border: none;
      cursor: pointer;
      font-size: 16px;
      font-weight: 500;
      display: inline-flex;
      align-items: center;
      justify-content: center;
      gap: 10px;
      transition: 0.3s ease;
      text-decoration: none;
    }

    .apply-info__btn--light {
      background: #fff;
      color: #12384a;
      border: 1px solid #92c5d5;
    }

    .apply-info__btn--light:hover {
      color: #108da0;
      border-color: #18a7b8;
    }

    .apply-info__btn--primary {
      background: linear-gradient(135deg, #0d6477, #18a7b8);
      color: #fff;
      box-shadow: 0 16px 32px rgba(24, 167, 184, 0.25);
    }

    .apply-info__btn--primary:hover {
      transform: translateY(-3px);
      box-shadow: 0 22px 40px rgba(24, 167, 184, 0.32);
    }

    @media (max-width: 980px) {
      .apply-info__card {
        grid-template-columns: 1fr;
      }

      .apply-info__left {
        min-height: 420px;
      }
    }

    @media (max-width: 650px) {
      .apply-info {
        padding: 15px 0px;
        align-items: flex-start;
      }

      .apply-info__card {
        padding: 0;
        border-radius: 15px;
      }

      .apply-info__left {
        min-height: 330px;
        padding: 15px;
        border-radius: 15px;
      }

      .apply-info__grid {
        grid-template-columns: 1fr;
      }

      .apply-info__fetch {
        align-items: flex-start;
        flex-direction: column;
      }

      .apply-info__actions {
        flex-direction: column-reverse;
      }

      .apply-info__btn {
        width: 100%;
      }
    }












    .dashbord-wrp-1 {
      min-height: 100vh;
      padding: 50px 0;
      position: relative;
      overflow: hidden;
      background: linear-gradient(0deg,rgb(255, 255, 255) 0%, rgba(159, 206, 207, 0.2) 50%, rgb(255, 255, 255) 100%);
    }

    .dashbord-wrp-1::before {
      content: "";
      position: absolute;
      inset: 0;
      background-image:
        linear-gradient(rgba(18, 136, 156, 0.045) 1px, transparent 1px),
        linear-gradient(90deg, rgba(18, 136, 156, 0.045) 1px, transparent 1px);
      background-size: 36px 36px;
      pointer-events: none;
    }

    .db1-layout {
      position: relative;
      z-index: 1;
      margin: 0 auto;
      display: grid;
      grid-template-columns: 350px 1fr;
      gap: 28px;
      align-items: stretch;
    }

    .db1-sidebar {
      min-height: calc(100vh - 52px);
      border-radius: 20px;
      padding: 25px;
      background: linear-gradient(180deg, #0d6879 0%, #1ca3af 100%);
      color: #fff;
      box-shadow: 0 24px 65px rgba(15, 117, 136, 0.22);
      position: sticky;
      top: 26px;
      overflow: hidden;
    }

    .db1-sidebar::before {
      content: "";
      position: absolute;
      width: 240px;
      height: 240px;
      border-radius: 50%;
      background: rgba(255,255,255,0.08);
      right: -90px;
      bottom: -90px;
    }

    .db1-profile {
      position: relative;
      z-index: 1;
      margin-bottom: 34px;
    }

    .db1-avatar {
      width: 100px;
      height: 100px;
      border-radius: 50%;
      background: rgba(255,255,255,0.18);
      border: 1px solid rgba(255,255,255,0.18);
      display: grid;
      place-items: center;
      font-size: 51px;
      margin-bottom: 22px;
      backdrop-filter: blur(10px);
    }

    .db1-profile h3 {
      font-size: 24px;
      font-weight: 500;
      line-height: 1.2;
      margin-bottom: 0;
      color: #fff;
    }

    .db1-profile p {
      color: rgba(255,255,255,0.82);
      font-size: 15px;
      line-height: 1.5;
    }

    .db1-menu {
      position: relative;
      z-index: 1;
      display: grid;
      gap: 12px;
    }

    .db1-tab-btn {
      width: 100%;
      border: 0;
      cursor: pointer;
      min-height: 56px;
      border-radius: 9px;
      padding: 0 18px;
      background: rgba(255,255,255,0.10);
      color: rgba(255,255,255,0.92);
      display: flex;
      align-items: center;
      gap: 13px;
      font-size: 16px;
      font-weight: 500;
      text-align: left;
      transition: 0.3s ease;
    }

    .db1-tab-btn i {
      width: 22px;
      text-align: center;
      font-size: 16px;
    }

    .db1-tab-btn:hover,
    .db1-tab-btn.active {
      background: rgba(255,255,255,0.22);
      transform: translateX(4px);
      color: #fff;
    }

    .db1-main {
      background: rgba(255,255,255,0.72);
      border: 1px solid rgba(202, 230, 236, 0.95);
      border-radius: 20px;
      padding: 25px;
      min-height: calc(100vh - 52px);
      box-shadow: 0 24px 65px rgba(13, 64, 84, 0.08);
      backdrop-filter: blur(16px);
      overflow: hidden;
    }

    .db1-panel {
      display: none;
      animation: db1Fade 0.35s ease;
    }

    .db1-panel.active {
      display: block;
    }

    @keyframes db1Fade {
      from {
        opacity: 0;
        transform: translateY(12px);
      }
      to {
        opacity: 1;
        transform: translateY(0);
      }
    }

    .db1-head {
      margin-bottom: 34px;
    }

    .db1-head h1 {
      font-size: clamp(20px, 2vw, 25px);
      line-height: 1.08;
      letter-spacing: 0;
      color: #023b53;
      font-weight: 500;
      margin-bottom: 3px;
    }

    .db1-head p {
      color: #5d7482;
      font-size: 17px;
      line-height: 1.7;
      margin-bottom: 0;
    }

    .db1-stats {
      display: grid;
      grid-template-columns: repeat(3, 1fr);
      gap: 12px;
      margin-bottom: 26px;
    }

    .db1-stat-card {
      background: rgba(255,255,255,0.9);
      border: 1px solid #d6eaf0;
      border-radius: 20px;
      padding: 28px;
      min-height: 205px;
      box-shadow: 0 18px 45px rgba(13, 64, 84, 0.06);
      transition: 0.3s ease;
      position: relative;
      overflow: hidden;
    }

    .db1-stat-card::after {
      content: "";
      position: absolute;
      width: 120px;
      height: 120px;
      border-radius: 50%;
      background: rgba(24, 167, 184, 0.08);
      right: -50px;
      bottom: -50px;
    }

    .db1-stat-card:hover {
      transform: translateY(-6px);
      box-shadow: 0 24px 55px rgba(13, 64, 84, 0.1);
      border-color: #9ed8e2;
    }

    .db1-stat-icon {
      width: 70px;
      height: 70px;
      border-radius: 999px;
      background: #e7f8fb;
      color: #1198aa;
      display: grid;
      place-items: center;
      font-size: 32px;
      margin-bottom: 15px;
      border: dashed 1px #15999bc7;
    }

    .db1-stat-card h2 {
      font-size: 38px;
      font-weight: 500;
      color: #023b53;
      margin-bottom: 2px;
      letter-spacing: -1px;
    }

    .db1-stat-card p {
      color: #5d7482;
      font-weight: 500;
      font-size: 15px;
      margin: 0;
    }

    .db1-card {
      background: rgba(255,255,255,0.92);
      border: 1px solid #d6eaf0;
      border-radius: 20px;
      padding: 30px;
      box-shadow: 0 18px 45px rgba(13, 64, 84, 0.06);
    }

    .db1-card-title {
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 14px;
      margin-bottom: 22px;
    }

    .db1-card-title h2 {
      font-size: 22px;
      color: #023b53;
      font-weight: 500;
      letter-spacing: 0;
    }

    .db1-action-btn {
      min-height: 38px;
      padding: 0px 14px;
      border-radius: 6px;
      border: 0;
      background: linear-gradient(135deg, #0d6879, #1ca3af);
      color: #fff;
      font-size: 15px;
      font-weight: 500;
      cursor: pointer;
      display: inline-flex;
      align-items: center;
      gap: 9px;
      transition: 0.3s ease;
      box-shadow: 0 14px 28px rgba(24,167,184,0.22);
      margin-top: 15px;
    }

    .db1-action-btn:hover {
      transform: translateY(-3px);
      box-shadow: 0 18px 35px rgba(24,167,184,0.3);
    }

    .db1-list {
      display: grid;
      gap: 16px;
    }

    .db1-list-item {
      display: block;
      align-items: center;
      justify-content: space-between;
      gap: 18px;
      padding: 15px;
      border-radius: 11px;
      background: #f6fbfc;
      border: 1px solid #dceef2;
      transition: 0.3s ease;
    }

    .db1-list-item:hover {
      background: #eef9fb;
      transform: translateX(4px);
    }

    .db1-list-left {
      display: flex;
      align-items: initial;
      gap: 14px;
    }

    .db1-list-icon {
      width: 60px;
      height: 60px;
      border-radius: 50%;
      background: #e7f8fb;
      color: #1198aa;
      display: grid;
      place-items: center;
      font-size: 23px;
      flex-shrink: 0;
      border: dashed 1px #15999bbf;
    }

    .db1-list-item h3 {
      font-size: 18px;
      color: #023b53;
      font-weight: 500;
      margin-bottom: 6px;
    }

    .db1-list-item p {
      color: #5f7683;
      font-size: 14px;
      line-height: 1.5;
    }

    .db1-status {
      padding: 9px 15px;
      border-radius: 999px;
      font-size: 13px;
      font-weight: 500;
      white-space: nowrap;
    }

    .db1-status.approved {
      background: #e8f8ef;
      color: #078345;
      float: right;
    }

    .db1-status.pending {
      background: #fff4d9;
      color: #a86500;
      float: right;
    }

    .db1-status.notification {
      background: #e6f7fb;
      color: #07839b;
      float: right;
    }

    .db1-status.rejected {
      background: #ffe9e9;
      color: #c83232;
    }

    .db1-grid-2 {
      display: grid;
      grid-template-columns: repeat(2, 1fr);
      gap: 22px;
    }

    .db1-info-box {
      background: #f6fbfc;
      border: 1px solid #dceef2;
      border-radius: 22px;
      padding: 22px;
      transition: 0.3s ease;
    }

    .db1-info-box:hover {
      background: #eef9fb;
      transform: translateY(-4px);
    }

    .db1-info-box i {
      width: 48px;
      height: 48px;
      border-radius: 16px;
      background: #e7f8fb;
      color: #1198aa;
      display: grid;
      place-items: center;
      font-size: 18px;
      margin-bottom: 15px;
    }

    .db1-info-box small {
      display: block;
      font-size: 13px;
      color: #6b808a;
      font-weight: 500;
      margin-bottom: 6px;
    }

    .db1-info-box strong {
      color: #023b53;
      font-size: 17px;
      line-height: 1.5;
      word-break: break-word;
    }

    .db1-empty {
      text-align: center;
      padding: 50px 20px;
      color: #5f7683;
    }

    .db1-empty i {
      width: 78px;
      height: 78px;
      border-radius: 24px;
      background: #e7f8fb;
      color: #1198aa;
      display: grid;
      place-items: center;
      margin: 0 auto 18px;
      font-size: 30px;
    }

    .db1-empty h3 {
      color: #023b53;
      font-size: 24px;
      margin-bottom: 8px;
    }

    @media (max-width: 1100px) {
      .db1-layout {
        grid-template-columns: 1fr;
      }

      .db1-sidebar {
        position: relative;
        top: auto;
        min-height: auto;
      }

      .db1-menu {
        grid-template-columns: repeat(4, 1fr);
      }

      .db1-tab-btn {
        justify-content: center;
      }

      .db1-profile {
        display: flex;
        align-items: center;
        gap: 18px;
      }

      .db1-avatar {
        margin-bottom: 0;
      }
    }

    @media (max-width: 850px) {
      .dashbord-wrp-1 {
        padding: 16px;
      }

      .db1-main,
      .db1-sidebar {
        border-radius: 14px;
        padding: 22px;
      }

      .db1-stats,
      .db1-grid-2 {
        grid-template-columns: 1fr;
      }

      .db1-menu {
        grid-template-columns: repeat(2, 1fr);
      }

      .db1-card-title {
        align-items: flex-start;
        flex-direction: column;
      }

      .db1-list-item {
        align-items: flex-start;
        flex-direction: column;
      }

      .db1-status {
        align-self: flex-start;
      }
    }

    @media (max-width: 520px) {
      .db1-profile {
        align-items: flex-start;
        flex-direction: column;
      }

      .db1-menu {
        grid-template-columns: 1fr;
      }

      .db1-tab-btn {
        justify-content: flex-start;
      }

      .db1-main,
      .db1-sidebar {
        padding: 9px;
      }

      .db1-stat-card {
        min-height: auto;
        padding: 22px;
      }

      .db1-card {
        padding: 20px;
      }

      .db1-list-left {
        align-items: flex-start;
      }
    }
























    .user-profile-page {
      /*! min-height: 100vh; */
      /*! padding: 40px 18px; */
      /*! background:
        radial-gradient(circle at 8% 12%, rgba(20, 158, 159, 0.16), transparent 28%),
        radial-gradient(circle at 90% 85%, rgba(0, 55, 77, 0.13), transparent 32%),
        linear-gradient(135deg, #f8fcfd 0%, #eef8fa 100%); */
      /*! position: relative; */
      /*! overflow: hidden; */
    }

    .user-profile-page::before {
      content: "";
      position: absolute;
      inset: 0;
      background-image:
        linear-gradient(rgba(18, 136, 156, 0.045) 1px, transparent 1px),
        linear-gradient(90deg, rgba(18, 136, 156, 0.045) 1px, transparent 1px);
      background-size: 36px 36px;
      pointer-events: none;
    }

    .user-profile-page__wrap {
      
      margin: 0 auto;
      position: relative;
      z-index: 1;
    }

    .user-profile-page__header {
      margin-bottom: 28px;
      display: flex;
      align-items: flex-end;
      justify-content: space-between;
      gap: 20px;
      flex-wrap: wrap;
    }

    .user-profile-page__badge {
      display: inline-flex;
      align-items: center;
      gap: 8px;
      padding: 9px 15px;
      border-radius: 999px;
      background: #e7f8fb;
      color: #0f8798;
      font-size: 13px;
      font-weight: 500;
      margin-bottom: 14px;
    }

    .user-profile-page__header h1 {
      font-size: clamp(32px, 2vw, 28px);
      line-height: 1.08;
      color: #023b53;
      font-weight: 500;
      letter-spacing: -1.4px;
      margin-bottom: 8px;
    }

    .user-profile-page__header p {
      color: #5d7482;
      font-size: 16px;
      line-height: 1.7;
    }

    .user-profile-page__actions {
      display: flex;
      gap: 12px;
      flex-wrap: wrap;
    }

    .up-btn {
      min-height: 50px;
      padding: 0 20px;
      border-radius: 7px;
      border: 0;
      cursor: pointer;
      font-size: 16px;
      font-weight: 500;
      display: inline-flex;
      align-items: center;
      justify-content: center;
      gap: 9px;
      transition: 0.3s ease;
      text-decoration: none;
    }

    .up-btn--primary {
      background: linear-gradient(135deg, #0d6879, #1ca3af);
      color: #fff;
      box-shadow: 0 16px 32px rgba(24, 167, 184, 0.24);
    }

    .up-btn--primary:hover {
      transform: translateY(-3px);
      box-shadow: 0 22px 42px rgba(24, 167, 184, 0.32);
    }

    .up-btn--light {
      background: #fff;
      color: #07384b;
      border: 1px solid #d7eaf0;
    }

    .up-btn--light:hover {
      color: #0f8798;
      border-color: #18a7b8;
    }

    .user-profile-page__layout {
      display: block;
    }

    .up-sidebar {
      background: linear-gradient(180deg, #0d6879 0%, #1ca3af 100%);
      border-radius: 32px;
      padding: 28px;
      color: #fff;
      box-shadow: 0 24px 65px rgba(15, 117, 136, 0.22);
      position: sticky;
      top: 24px;
      overflow: hidden;
    }

    .up-sidebar::after {
      content: "";
      position: absolute;
      width: 220px;
      height: 220px;
      border-radius: 50%;
      right: -100px;
      bottom: -90px;
      background: rgba(255,255,255,0.08);
    }

    .up-avatar {
      position: relative;
      z-index: 1;
      width: 96px;
      height: 96px;
      border-radius: 28px;
      background: rgba(255,255,255,0.18);
      border: 1px solid rgba(255,255,255,0.2);
      display: grid;
      place-items: center;
      font-size: 42px;
      margin-bottom: 22px;
      backdrop-filter: blur(12px);
    }

    .up-sidebar h2 {
      position: relative;
      z-index: 1;
      font-size: 26px;
      line-height: 1.2;
      font-weight: 500;
      margin-bottom: 8px;
    }

    .up-sidebar p {
      position: relative;
      z-index: 1;
      color: rgba(255,255,255,0.82);
      font-size: 15px;
      line-height: 1.6;
      margin-bottom: 22px;
    }

    .up-side-info {
      position: relative;
      z-index: 1;
      display: grid;
      gap: 12px;
      margin-top: 20px;
    }

    .up-side-info__item {
      display: flex;
      align-items: center;
      gap: 12px;
      padding: 14px;
      border-radius: 18px;
      background: rgba(255,255,255,0.12);
      border: 1px solid rgba(255,255,255,0.12);
    }

    .up-side-info__item i {
      width: 36px;
      height: 36px;
      border-radius: 12px;
      background: rgba(255,255,255,0.15);
      display: grid;
      place-items: center;
      flex-shrink: 0;
    }

    .up-side-info__item small {
      display: block;
      color: rgba(255,255,255,0.72);
      font-size: 12px;
      font-weight: 500;
      margin-bottom: 3px;
    }

    .up-side-info__item strong {
      display: block;
      color: #fff;
      font-size: 14px;
      font-weight: 500;
      word-break: break-word;
    }

    .up-card {
      /*! background: rgba(255,255,255,0.86); */
      /*! border: 1px solid rgba(204, 230, 236, 0.95); */
      border-radius: 0;
      padding: 0;
      /*! box-shadow: 0 25px 70px rgba(13, 64, 84, 0.09); */
      position: relative;
      overflow: hidden;
    }

    .up-card::after {
      content: "";
      position: absolute;
      width: 220px;
      height: 220px;
      border-radius: 50%;
      right: -100px;
      bottom: -100px;
      background: rgba(20, 158, 159, 0.08);
      pointer-events: none;
    }

    .up-section-title {
      position: relative;
      z-index: 1;
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 14px;
      margin-bottom: 24px;
      padding-bottom: 18px;
      border-bottom: 1px solid #dceef2;
    }

    .up-section-title h3 {
      font-size: 21px;
      color: #023b53;
      font-weight: 500;
      letter-spacing: -0.5px;
      display: flex;
      align-items: center;
      gap: 12px;
    }

    .up-section-title h3 i {
      width: 44px;
      height: 44px;
      border-radius: 15px;
      background: #e7f8fb;
      color: #1198aa;
      display: grid;
      place-items: center;
      font-size: 18px;
    }

    .up-form {
      position: relative;
      z-index: 1;
      display: grid;
      grid-template-columns: repeat(2, 1fr);
      gap: 18px;
    }

    .up-form-group {
      display: grid;
      gap: 8px;
    }

    .up-form-group.full {
      grid-column: 1 / -1;
    }

    .up-form-group label {
      color: #12384a;
      font-size: 16px;
      font-weight: 500;
    }

    .up-input {
      position: relative;
    }

    .up-input i {
      position: absolute;
      left: 16px;
      top: 50%;
      transform: translateY(-50%);
      color: #1198aa;
      font-size: 15px;
      z-index: 1;
    }

    .up-input input,
    .up-input select {
      width: 100%;
      min-height: 56px;
      border: 1px solid #d7eaf0;
      border-radius: 8px;
      background: #fff;
      color: #07384b;
      font-size: 17px;
      font-weight: 500;
      padding: 0 16px 0 46px;
      outline: none;
      transition: 0.3s ease;
      font-family: inherit;
    }

    .up-input input::placeholder {
      color: #94a8b2;
      font-weight: 500;
    }

    .up-input input:focus,
    .up-input select:focus {
      border-color: #18a7b8;
      box-shadow: 0 0 0 5px rgba(24, 167, 184, 0.1);
    }

    .up-input input[readonly] {
      background: #f6fbfc;
      color: #526c78;
    }

    .up-password-note {
      grid-column: 1 / -1;
      padding: 15px 16px;
      border-radius: 11px;
      background: #e7f8fb;
      color: #0f6476;
      font-size: 15px;
      line-height: 1.6;
      font-weight: 500;
      display: flex;
      align-items: flex-start;
      gap: 10px;
    }

    .up-password-note i {
      margin-top: 2px;
    }

    .up-form-actions {
      grid-column: 1 / -1;
      display: flex;
      justify-content: flex-end;
      gap: 12px;
      margin-top: 12px;
      flex-wrap: wrap;
      border-radius: 0;
    }

    @media (max-width: 1050px) {
      .user-profile-page__layout {
        grid-template-columns: 1fr;
      }

      .up-sidebar {
        position: relative;
        top: auto;
      }

      .up-side-info {
        grid-template-columns: repeat(3, 1fr);
      }
    }

    @media (max-width: 760px) {
      .user-profile-page {
        padding: 24px 14px;
      }

      .user-profile-page__header {
        align-items: flex-start;
        flex-direction: column;
      }

      .user-profile-page__actions,
      .up-form-actions {
        width: 100%;
      }

      .up-btn {
        width: 100%;
      }

      .up-card,
      .up-sidebar {
        border-radius: 26px;
        padding: 22px;
      }

      .up-form {
        grid-template-columns: 1fr;
      }

      .up-side-info {
        grid-template-columns: 1fr;
      }

      .up-section-title {
        align-items: flex-start;
        flex-direction: column;
      }

      .up-section-title h3 {
        font-size: 22px;
      }
    }


















    .my-donation-wrp {
    }

    .my-donation-wrp::before {
      content: "";
      position: absolute;
      inset: 0;
      background-image:
        linear-gradient(rgba(17, 145, 165, 0.045) 1px, transparent 1px),
        linear-gradient(90deg, rgba(17, 145, 165, 0.045) 1px, transparent 1px);
      background-size: 36px 36px;
      pointer-events: none;
    }

    .my-donation-wrp__container {
      max-width: 1360px;
      margin: 0 auto;
      position: relative;
      z-index: 1;
    }

    .my-donation-wrp__title {
      text-align: center;
      margin-bottom: 42px;
    }

    .my-donation-wrp__title h1 {
      font-size: clamp(30px, 4vw, 42px);
      color: #302417;
      font-weight: 500;
      letter-spacing: -0.8px;
      margin-bottom: 18px;
    }

    .my-donation-wrp__line {
      width: 330px;
      height: 1px;
      background: #b8b8b8;
      margin: 0 auto;
      position: relative;
    }

    .my-donation-wrp__line::after {
      content: "";
      position: absolute;
      width: 130px;
      height: 3px;
      background: #46331f;
      left: 50%;
      top: -1px;
      transform: translateX(-50%);
      border-radius: 999px;
    }

    .donation-card {
      background: transparent;
      border: 0;
      border-radius: 0;
      padding: 0;
      box-shadow: 0 0px 0px rgba(0, 0, 0, 0.1);
      /*! overflow: hidden; */
      border: 0;
      position: relative;
      flex-direction: column;
      padding: 16px;
      border-radius: 15px;
      background: #ffffff;
      border: 1px solid rgba(19, 83, 68, 0.08);
      text-decoration: none;
      overflow: hidden;
      box-shadow: 0 12px 35px rgba(15, 58, 47, 0.06);
      transition: 0.35s ease;
      border: solid 1px #c4dcdc;
    }

    .donation-card__top {
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 18px;
      margin-bottom: 18px;
      flex-wrap: wrap;
    }

    .donation-card__group-text {
      font-size: 16px;
      color: #343434;
      font-weight: 500;
      line-height: 1.5;
    }

    .donation-toolbar {
      display: flex;
      align-items: center;
      justify-content: flex-end;
      gap: 8px;
      flex-wrap: wrap;
    }

    .donation-tool-btn {
      width: 38px;
      height: 38px;
      border-radius: 6px;
      border: 1px solid #cfe0e6;
      background: #fff;
      color: #6f8998;
      display: inline-flex;
      align-items: center;
      justify-content: center;
      font-size: 18px;
      cursor: pointer;
      transition: 0.3s ease;
    }

    .donation-tool-btn:hover {
      transform: translateY(-2px);
      color: #0f8798;
      border-color: #18a7b8;
      box-shadow: 0 12px 26px rgba(13, 64, 84, 0.08);
    }

    .donation-tool-btn.active {
      background: #15999b;
      color: #fff;
      border-color: #15999b;
    }

    .donation-search {
      position: relative;
      min-width: 320px;
    }

    .donation-search i {
      position: absolute;
      left: 15px;
      top: 50%;
      transform: translateY(-50%);
      color: #607986;
      font-size: 16px;
    }

    .donation-search input {
      width: 100%;
      height: 44px;
      border: 1px solid #d8e7ec;
      border-radius: 8px;
      background: #fff;
      padding: 0 15px 0 44px;
      font-size: 15px;
      color: #07384b;
      outline: none;
      transition: 0.3s ease;
      font-family: inherit;
    }

    .donation-search input:focus {
      border-color: #18a7b8;
      box-shadow: 0 0 0 5px rgba(24, 167, 184, 0.1);
    }

    .donation-table-wrap {
      width: 100%;
      overflow-x: auto;
      border: 1px solid #cfd8dd;
      border-radius: 9px;
      background: #fff;
    }

    .donation-table {
      width: 100%;
      min-width: 100%;
      border-collapse: collapse;
      table-layout: fixed;
    }

    .donation-table th,
    .donation-table td {
      border-right: 1px solid #d7dee2;
      border-bottom: 1px solid #d7dee2;
      padding: 13px 10px;
      text-align: left;
      vertical-align: middle;
      font-size: 14px;
    }

    .donation-table th:last-child,
    .donation-table td:last-child {
      border-right: 0;
    }

    .donation-table thead th {
      background: #fbfdfe;
      color: #111827;
      font-size: 15px;
      font-weight: 500;
      white-space: nowrap;
    }

    .donation-table tbody tr:hover {
      background: #f7fbfc;
    }

    .check-col {
      width: 70px;
      text-align: center !important;
    }

    .type-col {
      width: 150px;
    }

    .ref-col {
      width: 170px;
    }

    .date-col {
      width: 160px;
    }

    .value-col {
      width: 160px;
    }

    .status-col {
      width: 130px;
      text-align: center !important;
    }

    .details-col {
      width: 95px;
      text-align: center !important;
    }

    .notes-col {
      width: 330px;
    }

    .donation-th-inner {
      display: flex;
      align-items: center;
      gap: 8px;
      min-width: 0;
    }

    .donation-th-inner span {
      overflow: hidden;
      text-overflow: ellipsis;
      white-space: nowrap;
    }

    .donation-th-inner .sort-icon {
      margin-left: auto;
      color: #0a3447;
      font-size: 12px;
    }

    .donation-th-inner .filter-icon {
      color: #8b8b8b;
      font-size: 15px;
    }

    .donation-filter-row td {
      height: 42px;
      background: #fff;
    }

    .donation-filter-field {
      display: flex;
      align-items: center;
      gap: 8px;
      color: #0a5570;
      font-size: 16px;
      min-height: 24px;
    }

    .donation-filter-field input {
      width: 100%;
      border: 0;
      outline: 0;
      background: transparent;
      font-size: 14px;
      font-family: inherit;
      color: #07384b;
    }

    .donation-checkbox {
      width: 18px;
      height: 18px;
      accent-color: #18a7b8;
    }

    .donation-status {
      display: inline-flex;
      align-items: center;
      justify-content: center;
      padding: 7px 12px;
      border-radius: 5pz;
      font-size: 13px;
      font-weight: 500;
      white-space: nowrap;
    }

    .donation-status.completed {
      background: #e8f8ef;
      color: #078345;
    }

    .donation-status.pending {
      background: #fff4d9;
      color: #a86500;
    }

    .donation-status.failed {
      background: #ffe9e9;
      color: #c83232;
    }

    .donation-detail-btn {
      width: 38px;
      height: 38px;
      border-radius: 5px;
      border: 0;
      background: linear-gradient(135deg, #0d6879, #1ca3af);
      color: #fff;
      cursor: pointer;
      display: inline-flex;
      align-items: center;
      justify-content: center;
      font-size: 15px;
      box-shadow: 0 10px 22px rgba(24, 167, 184, 0.22);
      transition: 0.3s ease;
    }

    .donation-detail-btn:hover {
      transform: translateY(-2px);
      box-shadow: 0 14px 30px rgba(24, 167, 184, 0.32);
    }

    .donation-mobile-note {
      display: none;
      margin-top: 12px;
      color: #607986;
      font-size: 13px;
      line-height: 1.6;
      text-align: center;
    }

    .donation-details-popup {
      position: fixed;
      inset: 0;
      background: rgba(4, 31, 42, 0.58);
      display: none;
      align-items: center;
      justify-content: center;
      padding: 18px;
      z-index: 9999;
    }

    .donation-details-popup.active {
      display: flex;
    }

    .donation-details-box {
      width: 100%;
      max-width: 620px;
      background: #ffffff;
      border-radius: 15px;
      padding: 28px;
      box-shadow: 0 30px 90px rgba(0, 0, 0, 0.22);
      position: relative;
      animation: donationPopup 0.3s ease;
    }

    @keyframes donationPopup {
      from {
        opacity: 0;
        transform: translateY(18px) scale(0.96);
      }
      to {
        opacity: 1;
        transform: translateY(0) scale(1);
      }
    }

    .donation-details-close {
      position: absolute;
      right: 18px;
      top: 18px;
      width: 38px;
      height: 38px;
      border-radius: 12px;
      border: 0;
      background: #f1f7f9;
      color: #07384b;
      cursor: pointer;
      font-size: 16px;
    }

    .donation-details-head {
      margin-bottom: 24px;
      padding-right: 45px;
    }

    .donation-details-head .icon {
      width: 58px;
      height: 58px;
      border-radius: 50%;
      background: #e7f8fb;
      color: #1198aa;
      display: grid;
      place-items: center;
      font-size: 23px;
      margin-bottom: 14px;
      border: dashed 1px #3a9dac;
    }

    .donation-details-head h3 {
      font-size: 26px;
      color: #023b53;
      font-weight: 500;
      margin-bottom: 6px;
    }

    .donation-details-head p {
      color: #607986;
      font-size: 15px;
      line-height: 1.6;
    }

    .donation-details-grid {
      display: grid;
      grid-template-columns: repeat(2, 1fr);
      gap: 14px;
    }

    .donation-detail-item {
      padding: 10px 16px;
      border-radius: 10px;
      background: #f6fbfc;
      border: 1px solid #dceef2;
    }

    .donation-detail-item small {
      display: block;
      color: #6c8290;
      font-size: 12px;
      font-weight: 500;
      margin-bottom: 6px;
    }

    .donation-detail-item strong {
      display: block;
      color: #07384b;
      font-size: 15px;
      line-height: 1.5;
      word-break: break-word;
    }

    .donation-detail-item.full {
      grid-column: 1 / -1;
    }

    .donation-details-actions {
      margin-top: 22px;
      display: flex;
      justify-content: flex-end;
      gap: 12px;
    }

    .donation-details-btn {
      min-height: 41px;
      padding: 0 18px;
      border-radius: 8px;
      border: 0;
      cursor: pointer;
      font-size: 14px;
      font-weight: 500;
      background: linear-gradient(135deg, #0d6879, #1ca3af);
      color: #fff;
    }

    @media (max-width: 900px) {
      .donation-card {
        padding: 20px;
        border-radius: 20px;
      }

      .donation-card__top {
        align-items: flex-start;
        flex-direction: column;
      }

      .donation-toolbar {
        width: 100%;
        justify-content: flex-start;
      }

      .donation-search {
        min-width: 100%;
        flex: 1;
      }

      .donation-mobile-note {
        display: block;
      }
    }

    @media (max-width: 560px) {
      .my-donation-wrp {
        padding: 28px 12px;
      }

      .my-donation-wrp__line {
        width: 240px;
      }

      .my-donation-wrp__line::after {
        width: 100px;
      }

      .donation-card {
        padding: 10px;
      }

      .donation-card__group-text {
        font-size: 14px;
      }

      .donation-tool-btn {
        width: 40px;
        height: 40px;
        font-size: 16px;
      }

      .donation-details-box {
        padding: 22px;
        border-radius: 22px;
      }

      .donation-details-grid {
        grid-template-columns: 1fr;
      }

      .donation-details-head h3 {
        font-size: 22px;
      }

      .donation-details-actions {
        flex-direction: column;
      }

      .donation-details-btn {
        width: 100%;
      }
    }























    .donation-timeline-wrp {
      width: 100%;
      padding: 20px 18px;
    }

    .dt-page {
      display: grid;
      grid-template-columns: 438px 1fr;
      gap: 34px;
      max-width: 1760px;
      margin: auto;
    }

    /* Sidebar */
    .dt-sidebar {
      min-height: calc(100vh - 40px);
      background: linear-gradient(180deg, #116c7a, #1fa7ad);
      border-radius: 22px;
      padding: 36px;
      color: #fff;
      position: relative;
      overflow: hidden;
      box-shadow: 0 20px 45px rgba(10, 93, 110, 0.22);
    }

    .dt-sidebar::after {
      content: "";
      position: absolute;
      right: -110px;
      bottom: -110px;
      width: 295px;
      height: 295px;
      background: rgba(255,255,255,0.14);
      border-radius: 50%;
    }

    .dt-user-icon {
      width: 125px;
      height: 125px;
      border-radius: 14px;
      background: rgba(255,255,255,0.18);
      border: 1px solid rgba(255,255,255,0.22);
      display: grid;
      place-items: center;
      margin-bottom: 28px;
      box-shadow: inset 0 0 30px rgba(255,255,255,0.07);
    }

    .dt-user-icon i {
      font-size: 64px;
      color: #fff;
    }

    .dt-user-name {
      font-size: 29px;
      font-weight: 500;
      margin-bottom: 14px;
    }

    .dt-user-status {
      font-size: 17px;
      opacity: 0.95;
      margin-bottom: 47px;
    }

    .dt-menu {
      display: grid;
      gap: 15px;
      position: relative;
      z-index: 2;
    }

    .dt-menu a {
      display: flex;
      align-items: center;
      gap: 20px;
      min-height: 70px;
      padding: 18px 26px;
      text-decoration: none;
      color: #fff;
      background: rgba(255,255,255,0.13);
      border-radius: 10px;
      font-size: 18px;
      font-weight: 500;
      transition: 0.3s;
    }

    .dt-menu a:hover,
    .dt-menu a.active {
      background: rgba(255,255,255,0.24);
      transform: translateX(4px);
    }

    .dt-menu i {
      width: 20px;
      text-align: center;
      font-size: 18px;
    }

    /* Main Content */
    .dt-main {
      background: rgba(255,255,255,0.76);
      border: 0;
      border-radius: 22px;
      padding: 0;
      min-height: calc(100vh - 40px);
      box-shadow: none;
      overflow: ;
    }

    .dt-header {
      margin-bottom: 30px;
    }

    .dt-header h1 {
      font-size: 36px;
      line-height: 1.2;
      font-weight: 500;
      color: #0b425a;
      margin-bottom: 8px;
    }

    .dt-header p {
      font-size: 19px;
      color: #587083;
      font-weight: 500;
    }

    .dt-stats {
      display: grid;
      grid-template-columns: repeat(2, 1fr);
      gap: 18px;
      margin-bottom: 30px;
    }

    .dt-stat-card {
      background: #ffffff;
      border: 1px solid #cfdde5;
      border-radius: 10px;
      padding: 20px;
      display: flex;
      align-items: center;
      gap: 14px;
      box-shadow: 0 8px 22px rgba(13, 78, 98, 0.06);
    }

    .dt-stat-icon {
      width: 55px;
      height: 55px;
      border-radius: 50%;
      display: grid;
      place-items: center;
      background: #e8f7f8;
      color: #087489;
      font-size: 20px;
      flex-shrink: 0;
      border: dashed 1px #15999bc9;
    }

    .dt-stat-info span {
      display: block;
      color: #617383;
      font-size: 15px;
      font-weight: 500;
      margin-bottom: 5px;
    }

    .dt-stat-info strong {
      color: #0b425a;
      font-size: 18px;
      font-weight: 500;
    }

    .dt-content-grid {
      display: grid;
      grid-template-columns: auto-fill;
      gap: 25px;
      align-items: flex-start;
    }

    .dt-card {
      background: #fff;
      border: 1px solid #cfdde5;
      border-radius: 12px;
      overflow: hidden;
      box-shadow: 0 8px 22px rgba(13, 78, 98, 0.06);
    }

    .dt-card-title {
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 15px;
      padding: 20px 22px;
      border-bottom: 1px solid #d4e0e7;
      background: #fbfdfe;
    }

    .dt-card-title h2 {
      font-size: 20px;
      color: #101828;
      font-weight: 500;
    }

    .dt-badge {
      display: inline-flex;
      align-items: center;
      gap: 7px;
      padding: 8px 13px;
      border-radius: 8px;
      background: #e8f7f8;
      color: #087489;
      font-size: 13px;
      font-weight: 500;
      white-space: nowrap;
    }

    .dt-timeline {
      padding: 26px 26px 26px 65px;
      position: relative;
    }

    .dt-timeline::before {
      content: "";
      position: absolute;
      left: 34px;
      top: 34px;
      width: 3px;
      height: calc(100% - 68px);
      background: #d5e4ea;
      border-radius: 20px;
    }

    .dt-step {
      position: relative;
      padding-bottom: 25px;
    }

    .dt-step:last-child {
      padding-bottom: 0;
    }

    .dt-dot {
      position: absolute;
      left: -41px;
      top: 5px;
      width: 23px;
      height: 23px;
      border-radius: 50%;
      background: #c8d6de;
      border: 5px solid #fff;
      box-shadow: 0 0 0 2px #c8d6de;
      z-index: 2;
    }

    .dt-step.done .dt-dot {
      background: #1fa7ad;
      box-shadow: 0 0 0 2px #1fa7ad;
    }

    .dt-step.active .dt-dot {
      background: #087489;
      box-shadow: 0 0 0 7px rgba(8,116,137,0.16);
      animation: dtPulse 1.5s infinite;
    }

    @keyframes dtPulse {
      0% { box-shadow: 0 0 0 0 rgba(8,116,137,0.35); }
      70% { box-shadow: 0 0 0 12px rgba(8,116,137,0); }
      100% { box-shadow: 0 0 0 0 rgba(8,116,137,0); }
    }

    .dt-step-box {
      border: 1px solid #d5e4ea;
      border-radius: 10px;
      padding: 18px;
      background: #ffffff;
      transition: 0.3s;
    }

    .dt-step-box:hover {
      transform: translateY(-3px);
      box-shadow: 0 10px 24px rgba(11, 82, 100, 0.09);
    }

    .dt-step-head {
      display: flex;
      justify-content: space-between;
      gap: 15px;
      margin-bottom: 8px;
    }

    .dt-step-head h3 {
      color: #101828;
      font-size: 17px;
      font-weight: 500;
    }

    .dt-date {
      color: #6a7784;
      font-size: 14px;
      font-weight: 500;
      white-space: nowrap;
    }

    .dt-step-box p {
      color: #5a5a5a;
      font-size: 15px;
      line-height: 1.6;
      margin-bottom: 12px;
    }

    .dt-status {
      display: inline-flex;
      align-items: center;
      gap: 7px;
      padding: 7px 12px;
      border-radius: 8px;
      font-size: 13px;
      font-weight: 500;
    }

    .dt-status.success {
      background: #e6f8f4;
      color: #05815e;
    }

    .dt-status.process {
      background: #e8f7f8;
      color: #087489;
    }

    .dt-status.pending {
      background: #fff4df;
      color: #b56a00;
    }

    .dt-details {
      padding: 22px;
    }

    .dt-detail-row {
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 15px;
      border-bottom: 1px solid #e2eaf0;
      padding: 14px 0;
    }

    .dt-detail-row:first-child {
      padding-top: 0;
    }

    .dt-detail-row:last-child {
      border-bottom: 0;
      padding-bottom: 0;
    }

    .dt-detail-row span {
      color: #657789;
      font-size: 14px;
      font-weight: 500;
    }

    .dt-detail-row strong {
      color: #333;
      font-size: 15px;
      font-weight: 500;
      text-align: right;
    }

    .dt-progress-wrap {
      margin-top: 22px;
      padding: 18px;
      background: #f4fbfc;
      border: 1px solid #d7e8ee;
      border-radius: 12px;
    }

    .dt-progress-top {
      display: flex;
      justify-content: space-between;
      color: #0b425a;
      font-weight: 500;
      font-size: 14px;
      margin-bottom: 10px;
    }

    .dt-progress {
      width: 100%;
      height: 11px;
      background: #d3e5eb;
      border-radius: 20px;
      overflow: hidden;
    }

    .dt-progress span {
      display: block;
      width: 75%;
      height: 100%;
      background: linear-gradient(90deg, #116c7a, #1fa7ad);
      border-radius: 20px;
    }

    .dt-btn-row {
      display: grid;
      grid-template-columns: 1fr;
      gap: 12px;
      margin-top: 20px;
    }

    .dt-btn {
      min-height: 48px;
      border: 0;
      border-radius: 10px;
      padding: 13px 18px;
      font-size: 15px;
      font-weight: 500;
      cursor: pointer;
      text-decoration: none;
      display: inline-flex;
      align-items: center;
      justify-content: center;
      gap: 9px;
      transition: 0.3s;
    }

    .dt-btn-primary {
      background: #159aa3;
      color: #fff;
    }

    .dt-btn-primary:hover {
      background: #087489;
      transform: translateY(-2px);
    }

    .dt-btn-light {
      background: #eef8fa;
      color: #087489;
      border: 1px solid #cce4eb;
    }

    .dt-btn-light:hover {
      background: #dff3f6;
      transform: translateY(-2px);
    }

    .dt-note {
      margin-top: 18px;
      padding: 15px;
      border-radius: 10px;
      background: #fff8e8;
      border: 1px solid #f1d79b;
      color: #8a5a00;
      font-size: 14px;
      line-height: 1.6;
      font-weight: 500;
    }

    @media (max-width: 1200px) {
      .dt-page {
        grid-template-columns: 320px 1fr;
        gap: 24px;
      }

      .dt-sidebar {
        padding: 28px;
      }

      .dt-content-grid {
        grid-template-columns: 1fr;
      }
    }

    @media (max-width: 992px) {
      .dt-page {
        grid-template-columns: 1fr;
      }

      .dt-sidebar {
        min-height: auto;
      }

      .dt-menu {
        grid-template-columns: repeat(2, 1fr);
      }

      .dt-stats {
        grid-template-columns: repeat(2, 1fr);
      }
    }

    @media (max-width: 650px) {
      .donation-timeline-wrp {
        padding: 12px;
      }

      .dt-main {
        padding: 26px 18px;
      }

      .dt-header h1 {
        font-size: 28px;
      }

      .dt-header p {
        font-size: 16px;
      }

      .dt-menu {
        grid-template-columns: 1fr;
      }

      .dt-stats {
        grid-template-columns: 1fr;
      }

      .dt-card-title {
        flex-direction: column;
        align-items: flex-start;
      }

      .dt-step-head {
        flex-direction: column;
        gap: 5px;
      }

      .dt-date {
        white-space: normal;
      }

      .dt-timeline {
        padding-left: 42px;
      }

      .dt-timeline::before {
        left: 30px;
      }

      .dt-dot {
        left: -23px;
      }

      .dt-detail-row {
        flex-direction: column;
        align-items: flex-start;
      }

      .dt-detail-row strong {
        text-align: left;
      }
    }
  


  .dd-btns{ margin-top:15px; float:right; width:100% }





























  .abt-re-new {
      width: 100%;
      padding: 0;
      overflow: hidden;
    }

    .abt-re-new .abt-container {
      max-width: 100%;
      margin: 0 auto;
    }

    .abt-re-new .abt-hero {
      position: relative;
      min-height: 420px;
      border-radius: 0;
      overflow: hidden;
      background:
        linear-gradient(110deg, rgba(10, 99, 113, 0.96), rgba(31, 167, 173, 0.86)),
        url("https://images.unsplash.com/photo-1488521787991-ed7bbaae773c?auto=format&fit=crop&w=1600&q=80");
      background-size: cover;
      background-position: center;
      display: grid;
      grid-template-columns: 1.1fr 0.9fr;
      align-items: center;
      padding: 56px;
      color: #fff;
      box-shadow: 0 22px 55px rgba(8, 88, 105, 0.22);
      margin-bottom: 34px;
    }

    .abt-re-new .abt-hero::after {
      content: "";
      position: absolute;
      right: -120px;
      bottom: -120px;
      width: 350px;
      height: 350px;
      border-radius: 50%;
      background: rgba(255,255,255,0.15);
    }

    .abt-re-new .abt-hero-content {
      position: relative;
      z-index: 2;
    }

    .abt-re-new .abt-badge {
      display: inline-flex;
      align-items: center;
      gap: 9px;
      background: rgba(255,255,255,0.16);
      border: 1px solid rgba(255,255,255,0.22);
      padding: 10px 16px;
      border-radius: 50px;
      font-size: 14px;
      font-weight: 500;
      margin-bottom: 18px;
      backdrop-filter: blur(8px);
    }

    .abt-re-new .abt-hero h1 {
      font-size: 35px;
      line-height: 1.08;
      margin-bottom: 18px;
      font-weight: 500;
      letter-spacing: -1px;
      color: #fff;
    }

    .abt-re-new .abt-hero p {
      font-size: 18px;
      line-height: 1.8;
      max-width: 720px;
      color: rgba(255,255,255,0.92);
      margin-bottom: 28px;
    }

    .abt-re-new .abt-hero-actions {
      display: flex;
      flex-wrap: wrap;
      gap: 14px;
    }

    .abt-re-new .abt-btn {
      min-height: 50px;
      padding: 14px 22px;
      border-radius: 9px;
      border: 0;
      text-decoration: none;
      display: inline-flex;
      align-items: center;
      justify-content: center;
      gap: 10px;
      font-size: 18px;
      font-weight: 500;
      cursor: pointer;
      transition: 0.3s;
    }

    .abt-re-new .abt-btn-primary {
      background: #ffffff;
      color: #087489;
    }

    .abt-re-new .abt-btn-primary:hover {
      transform: translateY(-3px);
      box-shadow: 0 12px 28px rgba(0,0,0,0.18);
    }

    .abt-re-new .abt-btn-outline {
      background: rgba(255,255,255,0.12);
      color: #fff;
      border: 1px solid rgba(255,255,255,0.35);
    }

    .abt-re-new .abt-btn-outline:hover {
      background: rgba(255,255,255,0.2);
      transform: translateY(-3px);
    }

    .abt-re-new .abt-hero-card {
      position: relative;
      z-index: 2;
      background: rgba(255,255,255,0.14);
      border: 1px solid rgba(255,255,255,0.22);
      border-radius: 20px;
      padding: 28px;
      backdrop-filter: blur(12px);
      box-shadow: 0 18px 40px rgba(0,0,0,0.14);
    }

    .abt-re-new .abt-hero-card-icon {
      width: 76px;
      height: 76px;
      border-radius: 999px;
      background: rgba(255,255,255,0.2);
      display: grid;
      place-items: center;
      font-size: 34px;
      margin-bottom: 22px;
      border: dashed 2px #abcbcb;
    }

    .abt-re-new .abt-hero-card h3 {
      font-size: 26px;
      margin-bottom: 12px;
      color: #fff;
    }

    .abt-re-new .abt-hero-card p {
      font-size: 17px;
      margin: 0;
      line-height: 1.5;
    }

    .abt-re-new .abt-stats {
      display: grid;
      grid-template-columns: repeat(4, 1fr);
      gap: 18px;
      margin-bottom: 34px;
    }

    .abt-re-new .abt-stat {
      background: rgba(255,255,255,0.86);
      border: 1px solid #cbe5ed;
      border-radius: 18px;
      padding: 24px;
      display: flex;
      gap: 16px;
      align-items: center;
      box-shadow: 0 12px 30px rgba(11, 82, 100, 0.07);
      transition: 0.3s;
    }

    .abt-re-new .abt-stat:hover {
      transform: translateY(-5px);
      box-shadow: 0 18px 40px rgba(11, 82, 100, 0.12);
    }

    .abt-re-new .abt-stat i {
      width: 54px;
      height: 54px;
      border-radius: 999px;
      display: grid;
      place-items: center;
      color: #087489;
      background: #e8f7f8;
      font-size: 22px;
      flex-shrink: 0;
      border: dashed 1px #15999b;
    }

    .abt-re-new .abt-stat span {
      display: block;
      color: #627685;
      font-size: 14px;
      font-weight: 500;
      margin-bottom: 4px;
    }

    .abt-re-new .abt-stat strong {
      color: #0b425a;
      font-size: 21px;
      font-weight: 500;
    }

    .abt-re-new .abt-section {
      margin-bottom: 34px;
    }

    .abt-re-new .abt-section-head {
      margin-bottom: 22px;
      display: flex;
      justify-content: space-between;
      gap: 20px;
      align-items: flex-end;
    }

    .abt-re-new .abt-title-small {
      color: #159aa3;
      font-size: 14px;
      font-weight: 500;
      text-transform: uppercase;
      letter-spacing: 1px;
      margin-bottom: 8px;
    }

    .abt-re-new .abt-section-head h2 {
      color: #0b425a;
      font-size: 25px;
      line-height: 1.2;
      font-weight: 500;
    }

    .abt-re-new .abt-section-head p {
      max-width: 520px;
      color: #5c7180;
      font-size: 16px;
      line-height: 1.7;
    }

    .abt-re-new .abt-brief-card {
      display: grid;
      grid-template-columns: 0.9fr 1.1fr;
      gap: 28px;
      background: rgba(255,255,255,0.86);
      border: 1px solid #cbe5ed;
      border-radius: 20px;
      padding: 28px;
      box-shadow: 0 12px 30px rgba(11, 82, 100, 0.07);
      overflow: hidden;
    }

    .abt-re-new .abt-brief-img {
      min-height: 360px;
      border-radius: 20px;
      background:
        linear-gradient(rgba(8,116,137,0.1), rgba(8,116,137,0.1)),
        url("../images/img/abt-s.webp");
      background-size: cover;
      background-position: center;
      position: relative;
      overflow: hidden;
    }

    .abt-re-new .abt-brief-img::after {
      content: "Since 2012";
      position: absolute;
      left: 20px;
      bottom: 20px;
      background: #fff;
      color: #087489;
      padding: 12px 18px;
      border-radius: 12px;
      font-size: 18px;
      font-weight: 500;
      box-shadow: 0 12px 25px rgba(0,0,0,0.12);
    }

    .abt-re-new .abt-brief-content {
      padding: 12px 4px;
    }

    .abt-re-new .abt-brief-content h3 {
      font-size: 28px;
      color: #0b425a;
      margin-bottom: 14px;
      font-weight: 500;
    }

    .abt-re-new .abt-brief-content p {
      color: #556875;
      font-size: 17px;
      line-height: 1.9;
      margin-bottom: 20px;
    }

    .abt-re-new .abt-info-grid {
      display: grid;
      grid-template-columns: repeat(2, 1fr);
      gap: 18px;
    }

    .abt-re-new .abt-info-card {
      background: #fff;
      border: 1px solid #cfdde5;
      border-radius: 10px;
      padding: 24px;
      box-shadow: 0 10px 26px rgba(13, 78, 98, 0.06);
      transition: 0.3s;
      position: relative;
      overflow: hidden;
    }

    .abt-re-new .abt-info-card::after {
      content: "";
      position: absolute;
      right: -45px;
      top: -45px;
      width: 110px;
      height: 110px;
      border-radius: 50%;
      background: #e8f7f8;
    }

    .abt-re-new .abt-info-card:hover {
      transform: translateY(-5px);
    }

    .abt-re-new .abt-info-icon {
      width: 56px;
      height: 56px;
      border-radius: 999px;
      display: grid;
      place-items: center;
      background: linear-gradient(135deg, #116c7a, #1fa7ad);
      color: #fff;
      font-size: 22px;
      margin-bottom: 18px;
      position: relative;
      z-index: 2;
      border: dashed 1px #deffff;
    }

    .abt-re-new .abt-info-card h3 {
      color: #0b425a;
      font-size: 22px;
      margin-bottom: 10px;
      font-weight: 500;
      position: relative;
      z-index: 2;
    }

    .abt-re-new .abt-info-card p {
      color: #5a6f7d;
      font-size: 17px;
      line-height: 1.5;
      position: relative;
      z-index: 2;
    }

    .abt-re-new .abt-message {
      background: linear-gradient(135deg, #0f6f7c, #20a9ad);
      border-radius: 20px;
      padding: 34px;
      color: #fff;
      display: grid;
      grid-template-columns: 70px 1fr;
      gap: 22px;
      box-shadow: 0 20px 45px rgba(8, 88, 105, 0.18);
    }

    .abt-re-new .abt-message i {
      width: 70px;
      height: 70px;
      border-radius: 999px;
      background: rgba(255,255,255,0.18);
      display: grid;
      place-items: center;
      font-size: 30px;
      border: dashed 2px #5cc3c7;
    }

    .abt-re-new .abt-message h2 {
      font-size: 22px;
      margin-bottom: 10px;
      color: #fff;
    }

    .abt-re-new .abt-message p {
      line-height: 1.55;
      color: rgba(255,255,255,0.92);
      font-size: 18px;
      margin-bottom: 0;
    }

    .abt-re-new .abt-activity-grid {
      display: grid;
      grid-template-columns: repeat(1, 1fr);
      gap: 22px;
    }

    .abt-re-new .abt-activity-card {
      background: #fff;
      border: 1px solid #cfdde5;
      border-radius: 20px;
      padding: 26px;
      box-shadow: 0 12px 30px rgba(11, 82, 100, 0.07);
    }

    .abt-re-new .abt-card-top {
      display: flex;
      align-items: center;
      gap: 16px;
      margin-bottom: 18px;
    }

    .abt-re-new .abt-card-icon {
      width: 58px;
      height: 58px;
      border-radius: 999px;
      display: grid;
      place-items: center;
      background: #e8f7f8;
      color: #087489;
      font-size: 23px;
      flex-shrink: 0;
      border: dashed 1px #15999b;
    }

    .abt-re-new .abt-card-top span {
      color: #159aa3;
      font-size: 13px;
      font-weight: 500;
      text-transform: uppercase;
    }

    .abt-re-new .abt-card-top h3 {
      color: #0b425a;
      font-size: 23px;
      font-weight: 500;
    }

    .abt-re-new .abt-list {
      display: grid;
      grid-template-columns: repeat(3, 1fr);
      gap: 12px;
      list-style: none;
      padding-left: 0;
    }

    .abt-re-new .abt-list li {
      display: flex;
      gap: 9px;
      align-items: flex-start;
      color: #556875;
      font-size: 17px;
      line-height: 1.45;
      background: #f7fbfc;
      border: 1px solid #e1edf1;
      padding: 11px 12px;
      border-radius: 12px;
    }

    .abt-re-new .abt-list li i {
      color: #159aa3;
      margin-top: 3px;
      flex-shrink: 0;
    }

    .abt-re-new .abt-project-grid {
      display: grid;
      grid-template-columns: repeat(3, 1fr);
      gap: 18px;
    }

    .abt-re-new .abt-project-card {
      background: #fff;
      border: 1px solid #cfdde5;
      border-radius: 20px;
      padding: 24px;
      box-shadow: 0 10px 26px rgba(13, 78, 98, 0.06);
      transition: 0.3s;
    }

    .abt-re-new .abt-project-card:hover {
      transform: translateY(-5px);
    }

    .abt-re-new .abt-project-card .num {
      width: 42px;
      height: 42px;
      border-radius: 999px;
      display: grid;
      place-items: center;
      background: #159aa3;
      color: #fff;
      font-weight: 500;
      margin-bottom: 16px;
    }

    .abt-re-new .abt-project-card h3 {
      color: #0b425a;
      font-size: 20px;
      margin-bottom: 10px;
      font-weight: 500;
    }

    .abt-re-new .abt-project-card p {
      color: #5a6f7d;
      font-size: 18px;
      line-height: 1.55;
    }

    .abt-re-new .abt-cta {
      background:
        linear-gradient(100deg, rgba(10, 99, 113, 0.95), rgba(31, 167, 173, 0.92)),
        url("../images/img/abt-s.webp");
      background-size: cover;
      background-position: center;
      color: #fff;
      border-radius: 20px;
      padding: 38px;
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 28px;
      box-shadow: 0 20px 45px rgba(8, 88, 105, 0.2);
    }

    .abt-re-new .abt-cta h2 {
      font-size: 25px;
      margin-bottom: 4px;
      font-weight: 500;
      color: #fff;
    }

    .abt-re-new .abt-cta p {
      color: rgba(255,255,255,0.9);
      font-size: 16px;
      line-height: 1.7;
      max-width: 720px;
    }

    @media (max-width: 1100px) {
      .abt-re-new .abt-hero {
        grid-template-columns: 1fr;
        gap: 28px;
      }

      .abt-re-new .abt-stats {
        grid-template-columns: repeat(2, 1fr);
      }

      .abt-re-new .abt-brief-card {
        grid-template-columns: 1fr;
      }

      .abt-re-new .abt-info-grid,
      .abt-re-new .abt-project-grid {
        grid-template-columns: repeat(2, 1fr);
      }

      .abt-re-new .abt-content-grid {
        grid-template-columns: 1fr;
      }
    }

    @media (max-width: 800px) {
      .abt-re-new {
        padding: 0;
      }

      .abt-re-new .abt-hero {
        padding: 34px 22px;
        min-height: auto;
        border-radius: 22px;
      }

      .abt-re-new .abt-hero h1 {
        font-size: 38px;
      }

      .abt-re-new .abt-hero p {
        font-size: 16px;
      }

      .abt-re-new .abt-section-head {
        flex-direction: column;
        align-items: flex-start;
      }

      .abt-re-new .abt-section-head h2 {
        font-size: 20px;
      }

      .abt-re-new .abt-info-grid,
      .abt-re-new .abt-activity-grid,
      .abt-re-new .abt-project-grid,
      .abt-re-new .abt-stats {
        grid-template-columns: 1fr;
      }

      .abt-re-new .abt-list {
        grid-template-columns: 1fr;
      }

      .abt-re-new .abt-message {
        grid-template-columns: 1fr;
        padding: 26px;
      }

      .abt-re-new .abt-cta {
        flex-direction: column;
        align-items: flex-start;
        padding: 28px;
      }

      .abt-re-new .abt-cta h2 {
        font-size: 27px;
      }
    }

    @media (max-width: 480px) {
      .abt-re-new .abt-hero h1 {
        font-size: 32px;
      }

      .abt-re-new .abt-hero-actions {
        flex-direction: column;
      }

      .abt-re-new .abt-btn {
        width: 100%;
      }

      .abt-re-new .abt-stat {
        align-items: flex-start;
      }

      .abt-re-new .abt-brief-img {
        min-height: 260px;
      }
    }

















    .stry-srv-w {
      width: 100%;
      padding: 0;
      position: relative;
      overflow: hidden;
    }

    .stry-srv-w .stry-container {
      width: 100%;
      margin: 0 auto;
      position: relative;
    }

    .stry-srv-w .swiper {
      width: 100%;
      padding: 0 0 22px;
      overflow: hidden;
    }

    .stry-srv-w .swiper-slide {
      height: auto;
    }

    .stry-srv-w .stry-card {
      height: auto;
      background: #eaf8fb8f;
      border: 1px solid #bddde4;
      border-radius: 10px;
      overflow: hidden;
      display: flex;
      flex-direction: column;
      justify-content: space-between;
      text-align: center;
      transition: 0.35s ease;
    }

    .stry-srv-w .stry-card:hover {
      transform: translateY(0px);
      box-shadow: 0 16px 34px rgba(9, 106, 120, 0.16);
      border-color: #179ca0;
    }

    .stry-srv-w .stry-card-body {
      padding: 20px 10px 10px;
      min-height: auto;
      display: flex;
      flex-direction: column;
      align-items: center;
    }

    .stry-srv-w .stry-icon-wrap {
      width: 110px;
      height: 110px;
      border: 1.5px dashed #16a7ad;
      border-radius: 50%;
      background: #ffffff;
      display: flex;
      align-items: center;
      justify-content: center;
      margin-bottom: 22px;
      position: relative;
    }

    .stry-srv-w .stry-icon-wrap img {
      max-width: 70px;
      max-height: 70px;
      object-fit: contain;
    }

    .stry-srv-w .stry-icon-fallback {
      font-size: 58px;
      color: #907456;
      line-height: 1;
    }

    .stry-srv-w .stry-title {
      color: #0a4a5d;
      font-size: 20px;
      line-height: 1.15;
      font-weight: 500;
      max-width: inherit;
      margin: 0 auto;
      min-height: 35px;
    }

    .stry-srv-w .stry-btn {
      width: 100%;
      min-height: 53px;
      border: 0;
      background: #179ca0;
      color: #ffffff;
      font-size: 19px;
      font-weight: 500;
      text-decoration: none;
      display: flex;
      align-items: center;
      justify-content: center;
      transition: 0.3s ease;
      background: linear-gradient(90deg, rgb(21, 153, 155), rgb(20, 111, 135));
    }

    .stry-srv-w .stry-btn:hover {
      background: #0f7f88;
    }

    .stry-srv-w .stry-nav {
      width: 40px;
      height: 40px;
      border-radius: 50%;
      background: #ffffff;
      color: #000000;
      box-shadow: 0 10px 25px rgba(20, 60, 70, 0.18);
      top: 50%;
      transform: translateY(-50%);
      margin: 0;
      transition: 0.3s ease;
    }

    .stry-srv-w .stry-nav::after {
      font-size: 17px;
      font-weight: 500;
    }

    .stry-srv-w .stry-nav:hover {
      background: #179ca0;
      color: #ffffff;
    }

    .stry-srv-w .swiper-button-prev {
      left: 0;
    }

    .stry-srv-w .swiper-button-next {
      right: 0;
    }

    .stry-srv-w .swiper-pagination {
      position: relative;
      margin-top: 10px;
    }

    .stry-srv-w .swiper-pagination-bullet {
      width: 10px;
      height: 10px;
      background: #0a4a5d;
      opacity: 0.25;
    }

    .stry-srv-w .swiper-pagination-bullet-active {
      opacity: 1;
      background: #179ca0;
    }

    @media (max-width: 1199px) {
      .stry-srv-w {
        padding: 45px 36px 36px;
      }

      .stry-srv-w .stry-card {
        height: 330px;
      }

      .stry-srv-w .stry-title {
        font-size: 22px;
      }

      .stry-srv-w .stry-btn {
        font-size: 20px;
      }
    }

    @media (max-width: 767px) {
      .stry-srv-w {
        padding: 35px 18px 30px;
      }

      .stry-srv-w .stry-card {
        height: 315px;
      }

      .stry-srv-w .stry-card-body {
        padding: 34px 16px 20px;
        min-height: 255px;
      }

      .stry-srv-w .stry-icon-wrap {
        width: 118px;
        height: 118px;
      }

      .stry-srv-w .stry-icon-wrap img {
        max-width: 78px;
        max-height: 78px;
      }

      .stry-srv-w .stry-title {
        font-size: 21px;
      }

      .stry-srv-w .stry-btn {
        min-height: 58px;
        font-size: 19px;
      }

      .stry-srv-w .stry-nav {
        width: 44px;
        height: 44px;
      }

      .stry-srv-w .swiper-button-prev {
        left: 2px;
      }

      .stry-srv-w .swiper-button-next {
        right: 2px;
      }
    }

    @media (max-width: 480px) {
      .stry-srv-w {
        padding: 28px 14px;
      }

      .stry-srv-w .stry-card {
        height: 300px;
      }

      .stry-srv-w .stry-card-body {
        min-height: 242px;
      }

      .stry-srv-w .stry-icon-wrap {
        width: 108px;
        height: 108px;
        margin-bottom: 18px;
      }

      .stry-srv-w .stry-icon-wrap img {
        max-width: 70px;
        max-height: 70px;
      }

      .stry-srv-w .stry-title {
        font-size: 20px;
      }

      .stry-srv-w .stry-btn {
        min-height: 56px;
        font-size: 18px;
      }
    }






















    .policy-list--wrt {
      width: 100%;
      padding: 0;
      overflow: hidden;
    }

    .policy-list--wrt .policy-container {
      max-width: 100%;
      margin: 0 auto;
      padding: 0;
    }

    .policy-list--wrt .policy-hero {
      background: linear-gradient(135deg, #116c7a, #1fa7ad);
      border-radius: 0;
      padding: 54px;
      color: #fff;
      position: relative;
      overflow: hidden;
      box-shadow: 0 22px 55px rgba(8, 88, 105, 0.22);
      margin-bottom: 34px;
    }

    .policy-list--wrt .policy-hero::after {
      content: "";
      position: absolute;
      right: -120px;
      bottom: -120px;
      width: 340px;
      height: 340px;
      background: rgba(255,255,255,0.14);
      border-radius: 50%;
    }

    .policy-list--wrt .policy-hero::before {
      content: "";
      position: absolute;
      right: 160px;
      top: 40px;
      width: 90px;
      height: 90px;
      border: 1px solid rgba(255,255,255,0.22);
      border-radius: 10px;
      transform: rotate(18deg);
    }

    .policy-list--wrt .policy-badge {
      display: inline-flex;
      align-items: center;
      gap: 9px;
      background: rgba(255,255,255,0.16);
      border: 1px solid rgba(255,255,255,0.22);
      padding: 10px 16px;
      border-radius: 50px;
      font-size: 14px;
      font-weight: 500;
      margin-bottom: 18px;
      position: relative;
      z-index: 2;
    }

    .policy-list--wrt .policy-hero h1 {
      font-size: 36px;
      line-height: 1.08;
      margin-bottom: 18px;
      font-weight: 500;
      letter-spacing: -1px;
      position: relative;
      z-index: 2;
      color: #fff;
    }

    .policy-list--wrt .policy-breadcrumb {
      display: flex;
      flex-wrap: wrap;
      gap: 10px;
      list-style: none;
      position: relative;
      z-index: 2;
      padding-left: 0;
    }

    .policy-list--wrt .policy-breadcrumb li,
    .policy-list--wrt .policy-breadcrumb a {
      color: rgba(255,255,255,0.9);
      font-size: 16px;
      text-decoration: none;
      font-weight: 500;
    }

    .policy-list--wrt .policy-layout {
      display: grid;
      grid-template-columns: 000001fr;
      gap: 26px;
      align-items: flex-start;
    }

    .policy-list--wrt .policy-side {
      background: rgba(255,255,255,0.92);
      border: 1px solid #cbe5ed;
      border-radius: 24px;
      padding: 24px;
      box-shadow: 0 12px 30px rgba(11, 82, 100, 0.07);
      position: sticky;
      top: 20px;
    }

    .policy-list--wrt .policy-side h3 {
      color: #0b425a;
      font-size: 22px;
      font-weight: 500;
      margin-bottom: 16px;
    }

    .policy-list--wrt .policy-side ul {
      list-style: none;
      display: grid;
      gap: 10px;
    }

    .policy-list--wrt .policy-side a {
      display: flex;
      align-items: center;
      gap: 10px;
      min-height: 44px;
      padding: 10px 12px;
      border-radius: 12px;
      text-decoration: none;
      background: #f7fbfc;
      border: 1px solid #e1edf1;
      color: #526979;
      font-size: 14px;
      font-weight: 500;
      transition: 0.3s;
    }

    .policy-list--wrt .policy-side a:hover {
      background: #e8f7f8;
      color: #087489;
      transform: translateX(4px);
    }

    .policy-list--wrt .policy-side a i {
      color: #159aa3;
      width: 18px;
      text-align: center;
      flex-shrink: 0;
    }

    .policy-list--wrt .policy-main {
      min-width: 0;
    }

    .policy-list--wrt .policy-intro {
      background: rgba(255,255,255,0.92);
      border: 1px solid #cbe5ed;
      border-radius: 24px;
      padding: 30px;
      box-shadow: 0 12px 30px rgba(11, 82, 100, 0.07);
      margin-bottom: 24px;
      display: grid;
      grid-template-columns: 76px 1fr;
      gap: 20px;
      align-items: flex-start;
    }

    .policy-list--wrt .policy-intro-icon {
      width: 76px;
      height: 76px;
      border-radius: 20px;
      background: linear-gradient(135deg, #116c7a, #1fa7ad);
      color: #fff;
      display: grid;
      place-items: center;
      font-size: 32px;
      box-shadow: 0 14px 28px rgba(17,108,122,0.18);
    }

    .policy-list--wrt .policy-intro h2 {
      color: #0b425a;
      font-size: 30px;
      line-height: 1.2;
      font-weight: 500;
      margin-bottom: 10px;
    }

    .policy-list--wrt .policy-intro p {
      color: #5c7180;
      font-size: 16px;
      line-height: 1.8;
    }

    .policy-list--wrt .policy-grid {
      display: grid;
      grid-template-columns: repeat(3, 1fr);
      gap: 22px;
    }

    .policy-list--wrt .policy-card {
      background: #fff;
      border: 1px solid #cfdde5;
      border-radius: 15px;
      padding: 25px;
      min-height: 210px;
      box-shadow: 0 12px 30px rgba(11, 82, 100, 0.07);
      position: relative;
      overflow: hidden;
      transition: 0.35s ease;
    }

    .policy-list--wrt .policy-card::after {
      content: "";
      position: absolute;
      right: -55px;
      top: -55px;
      width: 140px;
      height: 140px;
      background: #e8f7f8;
      border-radius: 50%;
      z-index: 1;
    }

    .policy-list--wrt .policy-card:hover {
      transform: translateY(-6px);
      box-shadow: 0 20px 46px rgba(11, 82, 100, 0.13);
      border-color: #1fa7ad;
    }

    .policy-list--wrt .policy-card-top {
      display: flex;
      align-items: flex-start;
      justify-content: space-between;
      gap: 18px;
      position: relative;
      z-index: 2;
      margin-bottom: 18px;
    }

    .policy-list--wrt .policy-icon {
      width: 70px;
      height: 70px;
      border-radius: 999px;
      background: linear-gradient(135deg, #116c7a, #1fa7ad);
      color: #fff;
      display: grid;
      place-items: center;
      font-size: 25px;
      flex-shrink: 0;
      box-shadow: 0 12px 24px rgba(17,108,122,0.16);
      border: dashed 1px #fff;
    }

    .policy-list--wrt .policy-number {
      width: 38px;
      height: 38px;
      border-radius: 12px;
      display: grid;
      place-items: center;
      background: #e8f7f8;
      color: #bad3d5;
      font-size: 23px;
      font-weight: 500;
      position: relative;
      z-index: 2;
    }

    .policy-list--wrt .policy-card h3 {
      color: #0b425a;
      font-size: 22px;
      line-height: 1.3;
      font-weight: 500;
      margin-bottom: 12px;
      position: relative;
      z-index: 2;
    }

    .policy-list--wrt .policy-card p {
      color: #5a6f7d;
      font-size: 17px;
      line-height: 1.45;
      margin-bottom: 20px;
      position: relative;
      z-index: 2;
    }

    .policy-list--wrt .policy-btn {
      display: inline-flex;
      align-items: center;
      justify-content: center;
      gap: 9px;
      min-height: 44px;
      padding: 11px 16px;
      border-radius: 9px;
      background: #e8f7f8;
      color: #087489;
      text-decoration: none;
      font-size: 17px;
      font-weight: 500;
      transition: 0.3s;
      position: relative;
      z-index: 2;
      border: solid 1px #9dcdd1;
    }

    .policy-list--wrt .policy-btn:hover {
      background: #159aa3;
      color: #fff;
      transform: translateY(-2px);
    }

    .policy-list--wrt .policy-card.featured {
      grid-column: span 2;
      background: linear-gradient(135deg, #0f6f7c, #20a9ad);
      color: #fff;
      display: grid;
      grid-template-columns: 76px 1fr auto;
      gap: 20px;
      align-items: center;
      min-height: auto;
    }

    .policy-list--wrt .policy-card.featured::after {
      background: rgba(255,255,255,0.13);
      width: 210px;
      height: 210px;
      right: -80px;
      top: -80px;
    }

    .policy-list--wrt .policy-card.featured .policy-icon {
      background: rgba(255,255,255,0.18);
      box-shadow: none;
    }

    .policy-list--wrt .policy-card.featured h3,
    .policy-list--wrt .policy-card.featured p {
      color: #fff;
      margin-bottom: 6px;
    }

    .policy-list--wrt .policy-card.featured .policy-btn {
      background: #fff;
      color: #087489;
      white-space: nowrap;
    }

    .policy-list--wrt .policy-card.featured .policy-btn:hover {
      background: rgba(255,255,255,0.85);
    }

    .policy-list--wrt .policy-footer-note {
      margin-top: 24px;
      background: rgba(255,255,255,0.92);
      border: 1px solid #cbe5ed;
      border-radius: 24px;
      padding: 26px;
      box-shadow: 0 12px 30px rgba(11, 82, 100, 0.07);
      display: flex;
      align-items: flex-start;
      gap: 16px;
    }

    .policy-list--wrt .policy-footer-note i {
      width: 48px;
      height: 48px;
      border-radius: 14px;
      background: #e8f7f8;
      color: #087489;
      display: grid;
      place-items: center;
      font-size: 20px;
      flex-shrink: 0;
    }

    .policy-list--wrt .policy-footer-note p {
      color: #556875;
      font-size: 15px;
      line-height: 1.8;
    }

    @media (max-width: 1100px) {
      .policy-list--wrt .policy-layout {
        grid-template-columns: 1fr;
      }

      .policy-list--wrt .policy-side {
        position: relative;
        top: auto;
      }

      .policy-list--wrt .policy-side ul {
        grid-template-columns: repeat(2, 1fr);
      }
    }

    @media (max-width: 850px) {
      .policy-list--wrt {
        padding: 0;
        border-radius: 0;
      }

      .policy-list--wrt .policy-hero {
        padding: 15px;
        border-radius: 0;
      }

      .policy-list--wrt .policy-hero h1 {
        font-size: 38px;
      }

      .policy-list--wrt .policy-grid {
        grid-template-columns: 1fr;
      }

      .policy-list--wrt .policy-card.featured {
        grid-column: span 1;
        grid-template-columns: 1fr;
      }

      .policy-list--wrt .policy-card.featured .policy-btn {
        width: fit-content;
      }

      .policy-list--wrt .policy-intro {
        grid-template-columns: 1fr;
        padding: 24px;
      }

      .policy-list--wrt .policy-intro h2 {
        font-size: 25px;
      }
    }

    @media (max-width: 560px) {
      .policy-list--wrt .policy-hero h1 {
        font-size: 21px;
        margin-bottom: 9px;
      }

      .policy-list--wrt .policy-side ul {
        grid-template-columns: 1fr;
      }

      .policy-list--wrt .policy-card {
        padding: 15px;
        border-radius: 15px;
      }

      .policy-list--wrt .policy-card h3 {
        font-size: 20px;
      }

      .policy-list--wrt .policy-footer-note {
        flex-direction: column;
      }
    }



    .policy-layout{ padding:50px 0; }






     .kid-d-wrp {
      width: 100%;
      padding: 0;
      /*! overflow: hidden; */
      padding-bottom: 50px;
      background: linear-gradient(0deg,rgb(255, 255, 255) 0%, rgba(159, 206, 207, 0.2) 50%, rgb(255, 255, 255) 100%);
    }

    .kid-d-wrp .kid-container {
      max-width: 100%;
      margin: 0 auto;
      /*! padding: 15px; */
      border: 0;
    }

    .kid-d-wrp .kid-hero {
      background: linear-gradient(135deg, #116c7a, #1fa7ad);
      border-radius: 0;
      padding: 54px;
      color: #fff;
      position: relative;
      overflow: hidden;
      box-shadow: 0 22px 55px rgba(8, 88, 105, 0.22);
      margin-bottom: 0;
    }

    .kid-d-wrp .kid-hero::after {
      content: "";
      position: absolute;
      right: -120px;
      bottom: -120px;
      width: 340px;
      height: 340px;
      background: rgba(255,255,255,0.14);
      border-radius: 50%;
    }

    .kid-d-wrp .kid-hero::before {
      content: "";
      position: absolute;
      right: 150px;
      top: 42px;
      width: 90px;
      height: 90px;
      border: 1px solid rgba(255,255,255,0.24);
      border-radius: 0;
      transform: rotate(18deg);
    }

    .kid-d-wrp .kid-badge {
      display: inline-flex;
      align-items: center;
      gap: 9px;
      background: rgba(255,255,255,0.16);
      border: 1px solid rgba(255,255,255,0.22);
      padding: 10px 16px;
      border-radius: 50px;
      font-size: 14px;
      font-weight: 500;
      margin-bottom: 18px;
      position: relative;
      z-index: 2;
    }

    .kid-d-wrp .kid-hero h1 {
      font-size: 33px;
      line-height: 1.08;
      margin-bottom: 9px;
      font-weight: 500;
      letter-spacing: 0;
      position: relative;
      z-index: 2;
      color: #fff;
    }

    .kid-d-wrp .kid-breadcrumb {
      display: flex;
      flex-wrap: wrap;
      gap: 10px;
      list-style: none;
      position: relative;
      z-index: 2;
      padding-left: 0;
      text-transform: capitalize;
    }

    .kid-d-wrp .kid-breadcrumb li,
    .kid-d-wrp .kid-breadcrumb a {
      color: rgba(255,255,255,0.9);
      font-size: 16px;
      text-decoration: none;
      font-weight: 500;
    }

    .kid-d-wrp .kid-layout {
      display: grid;
      grid-template-columns: 1fr 380px;
      gap: 26px;
      align-items: flex-start;
      padding-top: 50px;
    }

    .kid-d-wrp .kid-main-card,
    .kid-d-wrp .kid-side-card {
      background: rgba(255,255,255,0.92);
      border: 1px solid #cbe5ed;
      border-radius: 19px;
      box-shadow: 0 12px 30px rgba(11, 82, 100, 0.07);
      overflow: hidden;
    }

    .kid-d-wrp .kid-card-head {
      padding: 26px 28px;
      background: #fbfdfe;
      border-bottom: 1px solid #d8e8ee;
      display: flex;
      align-items: normal;
      gap: 16px;
    }

    .kid-d-wrp .kid-card-icon {
      width: 58px;
      height: 58px;
      border-radius: 999px;
      display: grid;
      place-items: center;
      background: linear-gradient(135deg, #116c7a, #1fa7ad);
      color: #fff;
      font-size: 24px;
      flex-shrink: 0;
      box-shadow: 0 12px 24px rgba(17,108,122,0.16);
    }

    .kid-d-wrp .kid-card-head h2 {
      color: #0b425a;
      font-size: 23px;
      line-height: 1.2;
      font-weight: 500;
    }

    .kid-d-wrp .kid-card-head p {
      color: #5c7180;
      font-size: 15px;
      line-height: 1.6;
      margin-top: 4px;
      margin-bottom: 0;
    }

    .kid-d-wrp .kid-info {
      padding: 0;
    }

    .kid-d-wrp .kid-alert {
      background: linear-gradient(135deg, #e8f7f8, #f7fbfc);
      border: 1px solid #cde9ef;
      border-radius: 10px;
      padding: 22px;
      margin-bottom: 24px;
      display: grid;
      grid-template-columns: 54px 1fr;
      gap: 16px;
      align-items: flex-start;
    }

    .kid-d-wrp .kid-alert i {
      width: 54px;
      height: 54px;
      border-radius: 9px;
      display: grid;
      place-items: center;
      background: #159aa3;
      color: #fff;
      font-size: 22px;
    }

    .kid-d-wrp .kid-alert p {
      color: #526979;
      font-size: 16px;
      line-height: 1.8;
      margin-bottom: 0;
    }

    .kid-d-wrp .kid-work-time {
      background: #fff8e8;
      border: 1px solid #f1d79b;
      border-radius: 10px;
      padding: 18px;
      margin-bottom: 24px;
      display: flex;
      gap: 14px;
      align-items: flex-start;
      color: #8a5a00;
      font-weight: 500;
      line-height: 1.7;
    }

    .kid-d-wrp .kid-work-time i {
      margin-top: 3px;
      font-size: 20px;
      color: #b56a00;
    }

    .kid-d-wrp .kid-form-note {
      color: #556875;
      font-size: 16px;
      line-height: 1.8;
      margin-bottom: 24px;
    }

    .kid-d-wrp .kid-form {
      display: grid;
      gap: 22px;
    }

    .kid-d-wrp .kid-form-grid {
      display: grid;
      grid-template-columns: repeat(2, 1fr);
      gap: 18px;
    }

    .kid-d-wrp .kid-field {
      display: grid;
      gap: 8px;
    }

    .kid-d-wrp .kid-field label {
      color: #0b425a;
      font-size: 18px;
      font-weight: 500;
    }

    .kid-d-wrp .kid-field input,
    .kid-d-wrp .kid-field select,
    .kid-d-wrp .kid-field textarea {
      width: 100%;
      min-height: 54px;
      border: 1px solid #b2c2cb;
      border-radius: 9px;
      background: #fff;
      padding: 13px 15px;
      color: #394b58;
      font-size: 15px;
      outline: none;
      transition: 0.3s;
    }

    .kid-d-wrp .kid-field textarea {
      min-height: 135px;
      resize: vertical;
    }

    .kid-d-wrp .kid-field input:focus,
    .kid-d-wrp .kid-field select:focus,
    .kid-d-wrp .kid-field textarea:focus {
      border-color: #159aa3;
      box-shadow: 0 0 0 4px rgba(21,154,163,0.12);
    }

    .kid-d-wrp .kid-types {
      background: #f7fbfc;
      border: 1px solid #e1edf1;
      border-radius: 18px;
      padding: 20px;
    }

    .kid-d-wrp .kid-types-title {
      color: #0b425a;
      font-size: 16px;
      font-weight: 500;
      margin-bottom: 16px;
    }

    .kid-d-wrp .kid-type-grid {
      display: grid;
      grid-template-columns: repeat(3, 1fr);
      gap: 12px;
    }

    .kid-d-wrp .kid-check {
      position: relative;
    }

    .kid-d-wrp .kid-check input {
      position: absolute;
      opacity: 0;
      pointer-events: none;
    }

    .kid-d-wrp .kid-check span {
      min-height: 50px;
      padding: 12px 13px;
      border-radius: 8px;
      border: 1px solid #d7e8ee;
      background: #fff;
      color: #526979;
      font-size: 17px;
      font-weight: 500;
      display: flex;
      align-items: center;
      gap: 9px;
      cursor: pointer;
      transition: 0.3s;
    }

    .kid-d-wrp .kid-check span::before {
      content: "";
      width: 18px;
      height: 18px;
      border-radius: 4px;
      border: 2px solid #b8cbd3;
      flex-shrink: 0;
      transition: 0.3s;
    }

    .kid-d-wrp .kid-check input:checked + span {
      background: #e8f7f8;
      border-color: #159aa3;
      color: #087489;
    }

    .kid-d-wrp .kid-check input:checked + span::before {
      background: #159aa3;
      border-color: #159aa3;
      box-shadow: inset 0 0 0 3px #fff;
    }

    .kid-d-wrp .kid-submit {
      width: fit-content;
      min-height: 49px;
      padding: 12px 30px;
      border: 0;
      border-radius: 9px;
      background: #159aa3;
      color: #fff;
      font-size: 17px;
      font-weight: 500;
      cursor: pointer;
      display: inline-flex;
      align-items: center;
      justify-content: center;
      gap: 10px;
      transition: 0.3s;
      box-shadow: 0 14px 28px rgba(21,154,163,0.18);
    }

    .kid-d-wrp .kid-submit:hover {
      background: #087489;
      transform: translateY(-3px);
    }

    .kid-d-wrp .kid-side-card {
      position: sticky;
      top: 20px;
    }

    .kid-d-wrp .kid-side-content {
      padding: 24px;
    }

    .kid-d-wrp .kid-side-box {
      margin-bottom: 22px;
    }

    .kid-d-wrp .kid-side-box:last-child {
      margin-bottom: 0;
    }

    .kid-d-wrp .kid-side-box h3 {
      color: #0b425a;
      font-size: 18px;
      font-weight: 500;
      margin-bottom: 14px;
      display: flex;
      align-items: center;
      gap: 10px;
    }

    .kid-d-wrp .kid-side-box h3 i {
      color: #159aa3;
    }

    .kid-d-wrp .kid-list {
      list-style: none;
      display: grid;
      gap: 12px;
      padding-left: 0;
    }

    .kid-d-wrp .kid-list li {
      display: flex;
      align-items: flex-start;
      gap: 10px;
      color: #556875;
      font-size: 16px;
      line-height: 1.55;
      background: #f7fbfc;
      border: 1px solid #d7e0e3;
      border-radius: 9px;
      padding: 12px;
    }

    .kid-d-wrp .kid-list li i {
      color: #159aa3;
      margin-top: 3px;
      flex-shrink: 0;
    }

    .kid-d-wrp .kid-note {
      background: #fff8e8;
      border: 1px solid #f1d79b;
      border-radius: 16px;
      padding: 16px;
      color: #8a5a00;
      font-size: 16px;
      line-height: 1.5;
      font-weight: 500;
      margin-bottom: 0;
    }

    .kid-d-wrp .kid-footer-brief {
      margin-top: 28px;
      background: linear-gradient(135deg, #116c7a, #1fa7ad);
      border-radius: 20px;
      padding: 30px;
      color: #fff;
      box-shadow: 0 20px 45px rgba(8, 88, 105, 0.18);
    }

    .kid-d-wrp .kid-footer-brief p {
      color: rgba(255,255,255,0.92);
      font-size: 17px;
      line-height: 1.5;
      margin-bottom: 0;
    }

    @media (max-width: 1100px) {
      .kid-d-wrp .kid-layout {
        grid-template-columns: 1fr;
      }

      .kid-d-wrp .kid-side-card {
        position: relative;
        top: auto;
      }

      .kid-d-wrp .kid-type-grid {
        grid-template-columns: repeat(3, 1fr);
      }
    }

    @media (max-width: 850px) {
      .kid-d-wrp {
        padding: 14px 12px 40px;
      }

      .kid-d-wrp .kid-hero {
        padding: 15px 15px;
        border-radius: 15px;
      }

      .kid-d-wrp .kid-hero h1 {
        font-size: 38px;
      }

      .kid-d-wrp .kid-card-head {
        padding: 22px;
        align-items: flex-start;
      }

      .kid-d-wrp .kid-card-head h2 {
        font-size: 25px;
      }

      .kid-d-wrp .kid-info {
        padding: 22px;
      }

      .kid-d-wrp .kid-form-grid {
        grid-template-columns: 1fr;
      }

      .kid-d-wrp .kid-type-grid {
        grid-template-columns: repeat(2, 1fr);
      }

      .kid-d-wrp .kid-alert {
        grid-template-columns: 1fr;
      }
    }

    @media (max-width: 520px) {
      .kid-d-wrp .kid-hero h1 {
        font-size: 21px;
      }

      .kid-d-wrp .kid-card-head {
        flex-direction: column;
      }

      .kid-d-wrp .kid-type-grid {
        grid-template-columns: 1fr;
      }

      .kid-d-wrp .kid-submit {
        width: 100%;
      }
    }

   .cart-btn a{ display:block; }
   .cart-btn:hover a{ color:#fff; }
.cart-btn:hover a img{ filter: brightness(0) invert(1);}
   


   .pay-list labe input:checked + span::before {
  background: #159aa3;
  border-color: #159aa3;
  box-shadow: inset 0 0 0 3px #fff;
}

.crtic {
      width: 100%;
      max-width: 100%;
      padding: 15px 0;
    }

    .crtic .crtic-card {
      background: rgba(255,255,255,0.94);
      border: 1px solid #cbe5ed;
      border-radius: 20px;
      padding: 18px;
      box-shadow: 0 24px 55px rgba(11, 82, 100, 0.12);
      overflow: hidden;
      position: relative;
    }

    .crtic .crtic-card::after {
      content: "";
      position: absolute;
      width: 220px;
      height: 220px;
      right: -95px;
      bottom: -95px;
      border-radius: 50%;
      background: rgba(31, 167, 173, 0.08);
      pointer-events: none;
    }

    .crtic .crtic-img-wrap {
      position: relative;
      border-radius: 10px;
      overflow: hidden;
      height: 260px;
      background: #e8f7f8;
    }

    .crtic .crtic-img-wrap img {
      width: 100%;
      height: 100%;
      object-fit: cover;
      display: block;
      transition: 0.45s ease;
    }

    .crtic .crtic-card:hover .crtic-img-wrap img {
      transform: scale(1.05);
    }

    .crtic .crtic-img-wrap::after {
      content: "";
      position: absolute;
      inset: 0;
      background: linear-gradient(180deg, rgba(0,0,0,0.18), transparent 45%, rgba(0,0,0,0.08));
      pointer-events: none;
    }

    .crtic .crtic-case {
      position: absolute;
      left: 16px;
      top: 16px;
      z-index: 2;
      background: linear-gradient(135deg, #159aa3, #087489);
      color: #fff;
      border-radius: 11px;
      padding: 10px 16px;
      font-size: 16px;
      font-weight: 500;
      box-shadow: 0 12px 28px rgba(8,116,137,0.25);
    }

    .crtic .crtic-category {
      position: absolute;
      right: 16px;
      top: 16px;
      z-index: 2;
      width: 46px;
      height: 46px;
      border-radius: 50%;
      background: rgba(255,255,255,0.92);
      color: #087489;
      display: grid;
      place-items: center;
      font-size: 20px;
      box-shadow: 0 10px 24px rgba(0,0,0,0.13);
    }

    .crtic .crtic-body {
      position: relative;
      z-index: 2;
      padding: 22px 2px 0;
    }

    .crtic .crtic-title {
      color: #064760;
      font-size: 19px;
      line-height: 1.15;
      font-weight: 500;
      margin-bottom: 15px;
    }

    .crtic .crtic-meta {
      display: flex;
      flex-wrap: wrap;
      gap: 10px;
      margin-bottom: 14px;
    }

    .crtic .crtic-chip {
      display: inline-flex;
      align-items: center;
      gap: 8px;
      background: #e8f7f8;
      color: #087489;
      border: 1px solid #cde9ef;
      padding: 9px 12px;
      border-radius: 50px;
      font-size: 13px;
      font-weight: 500;
    }

    .crtic .crtic-amount-head {
      display: flex;
      justify-content: space-between;
      gap: 15px;
      align-items: ;
      margin-bottom: 12px;
    }

    .crtic .crtic-amount-head h3 {
      color: #1c2f3a;
      font-size: 17px;
      font-weight: 500;
    }

    .crtic .crtic-percent {
      color: #087489;
      background: #e8f7f8;
      border: 1px solid #cde9ef;
      padding: 4px 12px;
      border-radius: 30px;
      font-size: 13px;
      font-weight: 500;
    }

    .crtic .crtic-progress {
      width: 100%;
      height: 16px;
      border-radius: 50px;
      overflow: hidden;
      background: #e8f7f8;
      border: 1px solid #aee0e7;
      margin-bottom: 14px;
    }

    .crtic .crtic-progress span {
      display: block;
      height: 100%;
      width: 78%;
      background: linear-gradient(90deg, #159aa3, #087489);
      border-radius: 50px;
      position: relative;
      overflow: hidden;
    }

    .crtic .crtic-progress span::after {
      content: "";
      position: absolute;
      inset: 0;
      background: linear-gradient(90deg, transparent, rgba(255,255,255,0.35), transparent);
      animation: crticShine 1.9s infinite;
    }

    @keyframes crticShine {
      0% {
        transform: translateX(-100%);
      }
      100% {
        transform: translateX(100%);
      }
    }

    .crtic .crtic-amount-grid {
      display: grid;
      grid-template-columns: 1fr 1fr;
      gap: 14px;
      margin-bottom: 24px;
    }

    .crtic .crtic-amount-box {
      background: #f7fbfc;
      border: 1px solid #d7e8ee;
      border-radius: 10px;
      padding: 11px;
    }

    .crtic .crtic-amount-box span {
      display: block;
      color: #5c7180;
      font-size: 16px;
      font-weight: 500;
      margin-bottom: 7px;
    }

    .crtic .crtic-amount-box strong {
      color: #064760;
      font-size: 18px;
      line-height: 1.2;
      font-weight: 500;
    }

    .crtic .crtic-form {
      display: grid;
      grid-template-columns: 1fr 120px;
      gap: 12px;
      margin-bottom: 16px;
    }

    .crtic .crtic-input-wrap {
      position: relative;
    }

    .crtic .crtic-input-wrap input {
      width: 100%;
      min-height: 50px;
      border: 1px solid #6cc9d0;
      border-radius: 9px;
      padding: 9px 52px 9px 16px;
      color: #394b58;
      font-size: 16px;
      outline: none;
      transition: 0.3s;
      background: #fff;
    }

    .crtic .crtic-input-wrap input:focus {
      border-color: #087489;
      box-shadow: 0 0 0 4px rgba(21,154,163,0.12);
    }

    .crtic .crtic-input-wrap input.is-invalid {
      border-color: #d64242;
      box-shadow: 0 0 0 4px rgba(214,66,66,0.12);
    }

    .crtic .crtic-cart-message {
      display: flex;
      align-items: center;
      gap: 8px;
      margin-top: 10px;
      padding: 10px 12px;
      border: 1px solid rgba(214,66,66,0.22);
      border-radius: 9px;
      background: #fff5f5;
      color: #9f2c2c;
      font-size: 13px;
      font-weight: 600;
      line-height: 1.35;
    }

    .crtic .crtic-cart-message i {
      color: #d64242;
      font-size: 14px;
    }

    .crtic .crtic-input-wrap span {
      position: absolute;
      right: 14px;
      top: 50%;
      transform: translateY(-50%);
      color: #087489;
      font-weight: 500;
      font-size: 14px;
    }

    .crtic .crtic-btn {
      min-height: 50px;
      border-radius: 9px;
      border: 0;
      cursor: pointer;
      font-size: 17px;
      font-weight: 500;
      display: inline-flex;
      align-items: center;
      justify-content: center;
      gap: 9px;
      text-decoration: none;
      transition: 0.3s;
    }

    .crtic .crtic-btn-primary {
      background: linear-gradient(135deg, #159aa3, #087489);
      color: #fff;
      box-shadow: 0 14px 28px rgba(21,154,163,0.2);
    }

    .crtic .crtic-btn-primary:hover {
      transform: translateY(-3px);
      box-shadow: 0 18px 34px rgba(21,154,163,0.28);
    }

    .crtic .crtic-actions {
      display: grid;
      grid-template-columns: 1fr 1fr;
      gap: 12px;
    }

    .crtic .crtic-btn-outline {
      background: #fff;
      color: #087489;
      border: 1px solid #55c0ca;
    }

    .crtic .crtic-btn-outline:hover {
      background: #e8f7f8;
      transform: translateY(-3px);
    }

    @media (max-width: 640px) {
      body {
        padding: 14px;
      }

      .crtic .crtic-card {
        border-radius: 22px;
        padding: 15px;
      }

      .crtic .crtic-img-wrap {
        height: 245px;
        border-radius: 17px;
      }

      .crtic .crtic-title {
        font-size: 22px;
      }

      .crtic .crtic-amount-grid {
        grid-template-columns: 1fr;
      }

      .crtic .crtic-form {
        grid-template-columns: 1fr;
      }

      .crtic .crtic-actions {
        grid-template-columns: 1fr;
      }

      .crtic .crtic-btn {
        width: 100%;
      }
    }

    @media (max-width: 420px) {
      .crtic .crtic-img-wrap {
        height: 215px;
      }

      .crtic .crtic-case {
        font-size: 14px;
        padding: 9px 12px;
      }

      .crtic .crtic-title {
        font-size: 20px;
      }

      .crtic .crtic-amount-box strong {
        font-size: 17px;
      }
    }














    .contact-wrap {
      width: 100%;
      padding: 50px 0 50px 0;
      overflow: hidden;
    }

    .contact-wrap .contact-container {
      max-width: 100%;
      margin: 0 auto;
    }

    .contact-wrap .contact-box {
      display: grid;
      grid-template-columns: 0.9fr 1.1fr;
      gap: 34px;
      align-items: stretch;
    }

    .contact-wrap .contact-info-panel,
    .contact-wrap .contact-form-panel {
      background: rgba(255,255,255,0.92);
      border: 1px solid #cbe5ed;
      border-radius: 20px;
      padding: 30px;
      box-shadow: 0 18px 45px rgba(11, 82, 100, 0.08);
      position: relative;
      overflow: hidden;
    }

    .contact-wrap .contact-info-panel::after,
    .contact-wrap .contact-form-panel::after {
      content: "";
      position: absolute;
      width: 220px;
      height: 220px;
      border-radius: 50%;
      background: rgba(31,167,173,0.08);
      right: -95px;
      bottom: -95px;
      pointer-events: none;
    }

    .contact-wrap .contact-badge {
      display: inline-flex;
      align-items: center;
      gap: 10px;
      background: #f4f7f6;
      border: 1px solid #e7eeee;
      color: #064760;
      padding: 11px 18px;
      border-radius: 50px;
      font-size: 14px;
      font-weight: 500;
      text-transform: uppercase;
      letter-spacing: 0.4px;
      margin-bottom: 24px;
      position: relative;
      z-index: 2;
    }

    .contact-wrap .contact-badge span {
      width: 8px;
      height: 8px;
      background: #159aa3;
      border-radius: 50%;
      display: inline-block;
    }

    .contact-wrap .contact-info-panel h2,
    .contact-wrap .contact-form-panel h2 {
      color: #064760;
      font-size: 22px;
      line-height: 1.15;
      font-weight: 500;
      margin-bottom: 16px;
      position: relative;
      z-index: 2;
    }

    .contact-wrap .contact-desc {
      color: #4f5f6d;
      font-size: 18px;
      line-height: 1.8;
      margin-bottom: 32px;
      max-width: 720px;
      position: relative;
      z-index: 2;
    }

    .contact-wrap .contact-sub-title {
      color: #064760;
      font-size: 22px;
      font-weight: 500;
      margin-bottom: 22px;
      position: relative;
      z-index: 2;
    }

    .contact-wrap .contact-list {
      position: relative;
      z-index: 2;
    }

    .contact-wrap .contact-item {
      display: grid;
      grid-template-columns: 64px 1fr;
      gap: 20px;
      align-items: center;
      padding: 22px 0;
      border-bottom: 1px solid #e2ecef;
    }

    .contact-wrap .contact-item:last-child {
      border-bottom: 0;
    }

    .contact-wrap .contact-icon {
      width: 64px;
      height: 64px;
      border-radius: 50%;
      background: linear-gradient(135deg, #064f60, #087489);
      color: #fff;
      display: grid;
      place-items: center;
      font-size: 24px;
      box-shadow: 0 14px 28px rgba(8,116,137,0.18);
    }

    .contact-wrap .contact-item h3 {
      color: #064760;
      font-size: 17px;
      font-weight: 500;
      margin-bottom: 3px;
    }

    .contact-wrap .contact-item a,
    .contact-wrap .contact-item p {
      color: #4f5f6d;
      font-size: 18px;
      line-height: 1.5;
      text-decoration: none;
      word-break: break-word;
    }

    .contact-wrap .contact-item a:hover {
      color: #159aa3;
    }

    .contact-wrap .contact-form-panel {
      background: linear-gradient(180deg, rgba(255,255,255,0.96), rgba(247,252,253,0.94));
    }

    .contact-wrap .contact-form {
      position: relative;
      z-index: 2;
      display: grid;
      gap: 22px;
    }

    .contact-wrap .contact-form-grid {
      display: grid;
      grid-template-columns: repeat(2, 1fr);
      gap: 22px;
    }

    .contact-wrap .contact-field {
      position: relative;
    }

    .contact-wrap .contact-field input,
    .contact-wrap .contact-field textarea {
      width: 100%;
      min-height: 50px;
      border: 1px solid transparent;
      background: #f3f2ef;
      border-radius: 16px;
      padding: 15px 18px;
      font-size: 16px;
      color: #273642;
      outline: none;
      transition: 0.3s;
      border: 1.5px solid #c8c8c8;
      background: #fff;
      border-radius: 10px;
    }

    .contact-wrap .contact-field textarea {
      min-height: 190px;
      resize: vertical;
      display: block;
    }

    .contact-wrap .contact-field input::placeholder,
    .contact-wrap .contact-field textarea::placeholder {
      color: #4f5f6d;
      opacity: 0.95;
    }

    .contact-wrap .contact-field input:focus,
    .contact-wrap .contact-field textarea:focus {
      background: #fff;
      border-color: #159aa3;
      box-shadow: 0 0 0 4px rgba(21,154,163,0.12);
    }

    .contact-wrap .contact-submit {
      width: fit-content;
      min-height: 58px;
      border: none;
      border-radius: 10px;
      background: #064f60;
      color: #fff;
      padding: 20px;
      display: inline-flex;
      align-items: center;
      gap: 18px;
      font-size: 17px;
      font-weight: 500;
      cursor: pointer;
      transition: 0.3s;
      box-shadow: 0 14px 28px rgba(6,79,96,0.18);
      background: linear-gradient(90deg, #15999b, #146f87);
      color: #fff;
      box-shadow: 0 16px 36px rgba(13,111,104,.24);
    }

    .contact-wrap .contact-submit:hover {
      background: #087489;
      transform: translateY(-3px);
      box-shadow: 0 18px 35px rgba(8,116,137,0.24);
    }

    .contact-wrap .contact-submit i {
      width: 48px;
      height: 48px;
      border-radius: 7px;
      background: #159aa3;
      color: #fff;
      display: grid;
      place-items: center;
      font-size: 20px;
      transition: 0.3s;
    }

    .contact-wrap .contact-submit:hover i {
      background: #fff;
      color: #087489;
      transform: translateX(3px);
    }

    .contact-wrap .contact-note {
      margin-top: 26px;
      background: #e8f7f8;
      border: 1px solid #cde9ef;
      border-radius: 11px;
      padding: 18px;
      color: #087489;
      font-size: 15px;
      line-height: 1.7;
      font-weight: 500;
      position: relative;
      z-index: 2;
    }

    @media (max-width: 1100px) {
      .contact-wrap .contact-box {
        grid-template-columns: 1fr;
      }
    }

    @media (max-width: 768px) {
      .contact-wrap {
        padding: 45px 14px;
      }

      .contact-wrap .contact-info-panel,
      .contact-wrap .contact-form-panel {
        padding: 28px 22px;
        border-radius: 22px;
      }

      .contact-wrap .contact-info-panel h2,
      .contact-wrap .contact-form-panel h2 {
        font-size: 30px;
      }

      .contact-wrap .contact-desc {
        font-size: 16px;
      }

      .contact-wrap .contact-form-grid {
        grid-template-columns: 1fr;
        gap: 18px;
      }

      .contact-wrap .contact-item {
        grid-template-columns: 56px 1fr;
        gap: 16px;
      }

      .contact-wrap .contact-icon {
        width: 56px;
        height: 56px;
        font-size: 21px;
      }
    }

    @media (max-width: 480px) {
      .contact-wrap .contact-info-panel,
      .contact-wrap .contact-form-panel {
        padding: 24px 18px;
      }

      .contact-wrap .contact-info-panel h2,
      .contact-wrap .contact-form-panel h2 {
        font-size: 27px;
      }

      .contact-wrap .contact-sub-title {
        font-size: 19px;
        margin-bottom: 0;
      }

      .contact-wrap .contact-item {
        grid-template-columns: 1fr;
      }

      .contact-wrap .contact-item a,
      .contact-wrap .contact-item p {
        font-size: 16px;
      }

      .contact-wrap .contact-submit {
        width: 100%;
        justify-content: space-between;
        padding-left: 20px;
      }
    }












    .cart-wrap-1 {
      width: 100%;
      /*! min-height: 100vh; */
      padding: 50px 18px;
      background:
        linear-gradient(rgba(255,255,255,.94), rgba(255,255,255,.94)),
        linear-gradient(90deg, rgba(14,118,132,.08) 1px, transparent 1px),
        linear-gradient(rgba(14,118,132,.08) 1px, transparent 1px);
      background-size: 100% 100%, 28px 28px, 28px 28px;
      overflow: hidden;
    }

    .cart-wrap-1 .cart-container {
      /*! max-width: 1450px; */
      margin: 0 auto;
    }

    .cart-wrap-1 .cart-head {
      margin-bottom: 28px;
    }

    .cart-wrap-1 .cart-head span {
      display: inline-flex;
      align-items: center;
      gap: 9px;
      background: #e9f8f9;
      color: #087489;
      border: 1px solid #cce8ec;
      padding: 9px 15px;
      border-radius: 50px;
      font-size: 14px;
      font-weight: 500;
      margin-bottom: 12px;
    }

    .cart-wrap-1 .cart-head h2 {
      color: #073f54;
      font-size: 23px;
      line-height: 1.15;
      font-weight: 500;
      margin-bottom: 1px;
    }

    .cart-wrap-1 .cart-head p {
      color: #5d7180;
      font-size: 16px;
      line-height: 1.6;
    }

    .cart-wrap-1 .cart-layout {
      display: grid;
      grid-template-columns: 1fr 390px;
      gap: 28px;
      align-items: flex-start;
    }

    .cart-wrap-1 .cart-items {
      display: grid;
      gap: 18px;
    }

    .cart-wrap-1 .cart-item {
      background: rgba(255,255,255,.95);
      border: 1px solid #d1e7ed;
      border-radius: 14px;
      padding: 22px;
      display: grid;
      grid-template-columns: 74px 1fr auto auto 44px;
      gap: 20px;
      align-items: center;
      box-shadow: 0 18px 45px rgba(11,82,100,.08);
      position: relative;
      overflow: hidden;
      transition: 0.3s ease;
    }

    .cart-wrap-1 .cart-item:hover {
      transform: translateY(-4px);
      box-shadow: 0 24px 55px rgba(11,82,100,.12);
      border-color: #a9dce4;
    }

    .cart-wrap-1 .cart-item:before {
      content: "";
      position: absolute;
      inset: 0;
      background: linear-gradient(120deg, rgba(21,154,163,.08), transparent 45%);
      pointer-events: none;
    }

    .cart-wrap-1 .cart-item:after {
      content: "";
      position: absolute;
      width: 170px;
      height: 170px;
      right: -80px;
      bottom: -80px;
      border-radius: 50%;
      background: rgba(21,154,163,.08);
      pointer-events: none;
    }

    .cart-wrap-1 .cart-icon {
      width: 65px;
      height: 65px;
      border-radius: 50%;
      background: linear-gradient(135deg, #0d5262, #19a4a9);
      color: #fff;
      display: grid;
      place-items: center;
      font-size: 24px;
      position: relative;
      z-index: 2;
      box-shadow: 0 14px 28px rgba(21,154,163,.22);
    }

    .cart-wrap-1 .cart-info,
    .cart-wrap-1 .cart-qty,
    .cart-wrap-1 .cart-price,
    .cart-wrap-1 .cart-delete {
      position: relative;
      z-index: 2;
    }

    .cart-wrap-1 .cart-info h3 {
      color: #071f3d;
      font-size: 19px;
      font-weight: 500;
      margin-bottom: 1px;
    }

    .cart-wrap-1 .cart-info p {
      color: #526b8a;
      font-size: 16px;
      font-weight: 500;
      padding-bottom: 0;
      margin-bottom: 0;
    }

    .cart-wrap-1 .cart-qty {
      display: inline-flex;
      align-items: center;
      background: #f7fbfc;
      border: 1px solid #d7e8ee;
      border-radius: 8px;
      padding: 5px;
      box-shadow: 0 8px 20px rgba(11,82,100,.06);
    }

    .cart-wrap-1 .cart-qty button {
      width: 36px;
      height: 36px;
      border: 0;
      border-radius: 6px;
      background: #fff;
      color: #073f54;
      font-size: 18px;
      font-weight: 500;
      cursor: pointer;
      transition: .3s ease;
    }

    .cart-wrap-1 .cart-qty button:hover {
      background: #159aa3;
      color: #fff;
    }

    .cart-wrap-1 .cart-qty input {
      width: 44px;
      height: 36px;
      border: 0;
      background: transparent;
      text-align: center;
      color: #071f3d;
      font-size: 18px;
      font-weight: 500;
      outline: none;
    }

    .cart-wrap-1 .cart-price {
      text-align: right;
      min-width: 150px;
    }

    .cart-wrap-1 .cart-price strong {
      display: block;
      color: #071f3d;
      font-size: 22px;
      line-height: 1;
      font-weight: 500;
      white-space: nowrap;
    }

    .cart-wrap-1 .cart-price span {
      color: #526b8a;
      font-size: 14px;
      font-weight: 500;
    }

    .cart-wrap-1 .cart-delete {
      width: 44px;
      height: 44px;
      border: 0;
      border-radius: 15px;
      background: #fff0f0;
      color: #ef4444;
      cursor: pointer;
      font-size: 17px;
      transition: .3s ease;
    }

    .cart-wrap-1 .cart-delete:hover {
      background: #ef4444;
      color: #fff;
      transform: rotate(90deg);
    }

    .cart-wrap-1 .cart-summary {
      background: linear-gradient(160deg, #0d5262, #18a4a7);
      border-radius: 15px;
      padding: 26px;
      color: #fff;
      box-shadow: 0 22px 50px rgba(11,82,100,.2);
      position: sticky;
      top: 24px;
      overflow: hidden;
    }

    .cart-wrap-1 .summary-glow {
      position: absolute;
      width: 220px;
      height: 220px;
      border-radius: 50%;
      right: -90px;
      top: -90px;
      background: rgba(255,255,255,.16);
      pointer-events: none;
    }

    .cart-wrap-1 .summary-glow.two {
      width: 140px;
      height: 140px;
      left: -70px;
      bottom: -70px;
      top: auto;
      right: auto;
      background: rgba(255,255,255,.09);
    }

    .cart-wrap-1 .summary-title {
      position: relative;
      z-index: 2;
      display: flex;
      align-items: center;
      justify-content: space-between;
      margin-bottom: 24px;
    }

    .cart-wrap-1 .summary-title span {
      font-size: 22px;
      font-weight: 500;
    }

    .cart-wrap-1 .summary-title i {
      width: 46px;
      height: 46px;
      border-radius: 50%;
      background: rgba(255,255,255,.15);
      display: grid;
      place-items: center;
      font-size: 20px;
    }

    .cart-wrap-1 .summary-row {
      position: relative;
      z-index: 2;
      display: flex;
      justify-content: space-between;
      gap: 15px;
      padding: 15px 15px;
      border-bottom: 1px solid rgba(255,255,255,.18);
    }

    .cart-wrap-1 .summary-row span {
      color: rgba(255,255,255,.75);
      font-weight: 500;
    }

    .cart-wrap-1 .summary-row strong {
      color: #fff;
      font-weight: 500;
      text-align: right;
    }

    .cart-wrap-1 .summary-total {
      position: relative;
      z-index: 2;
      background: rgba(255,255,255,.14);
      border: 1px solid rgba(255,255,255,.18);
      border-radius: 12px;
      padding: 15px;
      margin: 22px 0;
    }

    .cart-wrap-1 .summary-total span {
      display: block;
      color: rgba(255,255,255,.78);
      font-size: 14px;
      font-weight: 500;
      margin-bottom: 6px;
    }

    .cart-wrap-1 .summary-total strong {
      display: block;
      font-size: 23px;
      line-height: 1.1;
      font-weight: 500;
    }

    .cart-wrap-1 .summary-total small {
      font-size: 15px;
      font-weight: 500;
    }

    .cart-wrap-1 .summary-actions {
      position: relative;
      z-index: 2;
      display: grid;
      gap: 12px;
    }

    .cart-wrap-1 .cart-btn {
      min-height: 56px;
      border-radius: 10px;
      text-decoration: none;
      display: inline-flex;
      align-items: center;
      justify-content: center;
      gap: 10px;
      font-size: 16px;
      font-weight: 500;
      transition: .3s ease;
    }

    .cart-wrap-1 .cart-btn-light {
      background: #fff;
      color: #073f54;
    }

    .cart-wrap-1 .cart-btn-dark {
      background: #073f54;
      color: #fff;
    }

    .cart-wrap-1 .cart-btn:hover {
      transform: translateY(-3px);
      box-shadow: 0 14px 26px rgba(0,0,0,.16);
    }

    .cart-wrap-1 .payment-partners {
      position: relative;
      z-index: 2;
      margin-top: 24px;
      padding-top: 22px;
      border-top: 1px solid rgba(255,255,255,.18);
    }

    .cart-wrap-1 .payment-partners h4 {
      font-size: 17px;
      font-weight: 500;
      text-align: center;
      margin-bottom: 14px;
      color: #fff;
    }

    .cart-wrap-1 .payment-logos {
      background: #fff;
      border-radius: 9px;
      padding: 11px;
      /*! display: grid; */
      grid-template-columns: repeat(4, 1fr);
      gap: 9px;
    }

    .cart-wrap-1 .pay-logo {
      min-height: 38px;
      border-radius: 5px;
      display: grid;
      place-items: center;
      color: #fff;
      font-weight: 500;
      overflow: hidden;
    }

    .cart-wrap-1 .visa {
      background: #1a1f71;
      font-size: 20px;
      letter-spacing: 1px;
    }

    .cart-wrap-1 .apple,
    .cart-wrap-1 .gpay {
      background: #000;
      font-size: 15px;
    }

    .cart-wrap-1 .master {
      background: #111;
      position: relative;
    }

    .cart-wrap-1 .master span {
      width: 21px;
      height: 21px;
      border-radius: 50%;
      position: absolute;
    }

    .cart-wrap-1 .master span:first-child {
      background: #eb001b;
      left: 18px;
    }

    .cart-wrap-1 .master span:last-child {
      background: #f79e1b;
      right: 18px;
      opacity: .9;
    }

    @media (max-width: 1100px) {
      .cart-wrap-1 .cart-layout {
        grid-template-columns: 1fr;
      }

      .cart-wrap-1 .cart-summary {
        position: relative;
        top: auto;
      }
    }

    @media (max-width: 850px) {
      .cart-wrap-1 {
        padding: 35px 14px;
      }

      .cart-wrap-1 .cart-head h2 {
        font-size: 30px;
      }

      .cart-wrap-1 .cart-item {
        grid-template-columns: 64px 1fr 44px;
        gap: 16px;
      }

      .cart-wrap-1 .cart-icon {
        width: 64px;
        height: 64px;
        border-radius: 20px;
        font-size: 26px;
      }

      .cart-wrap-1 .cart-qty {
        grid-column: 1 / 3;
        width: fit-content;
      }

      .cart-wrap-1 .cart-price {
        grid-column: 1 / 4;
        text-align: left;
      }

      .cart-wrap-1 .cart-delete {
        grid-column: 3;
        grid-row: 1;
        justify-self: end;
      }
    }

    @media (max-width: 520px) {
      .cart-wrap-1 .cart-item {
        grid-template-columns: 1fr;
        padding: 20px;
      }

      .cart-wrap-1 .cart-icon {
        width: 58px;
        height: 58px;
        border-radius: 18px;
        font-size: 24px;
      }

      .cart-wrap-1 .cart-delete {
        position: absolute;
        right: 18px;
        top: 18px;
      }

      .cart-wrap-1 .cart-info {
        padding-right: 52px;
      }

      .cart-wrap-1 .cart-info h3 {
        font-size: 20px;
      }

      .cart-wrap-1 .cart-qty,
      .cart-wrap-1 .cart-price {
        grid-column: auto;
      }

      .cart-wrap-1 .cart-price strong {
        font-size: 21px;
      }

      .cart-wrap-1 .cart-summary {
        padding: 22px;
        border-radius: 24px;
      }

      .cart-wrap-1 .summary-total strong {
        font-size: 24px;
      }

      .cart-wrap-1 .payment-logos {
        grid-template-columns: repeat(2, 1fr);
      }
    }



























    .checkout-wrap-1 {
      width: 100%;
      min-height: 100vh;
      padding: 50px 18px;
      background:
        linear-gradient(rgba(255,255,255,.94), rgba(255,255,255,.94)),
        linear-gradient(90deg, rgba(14,118,132,.08) 1px, transparent 1px),
        linear-gradient(rgba(14,118,132,.08) 1px, transparent 1px);
      background-size: 100% 100%, 28px 28px, 28px 28px;
      overflow: hidden;
      position: relative;
    }

    .checkout-wrap-1::before {
      content: "";
      position: absolute;
      width: 360px;
      height: 360px;
      border-radius: 50%;
      background: rgba(21,154,163,.08);
      top: -160px;
      left: -160px;
      pointer-events: none;
    }

    .checkout-wrap-1::after {
      content: "";
      position: absolute;
      width: 420px;
      height: 420px;
      border-radius: 50%;
      background: rgba(13,82,98,.06);
      right: -180px;
      bottom: -180px;
      pointer-events: none;
    }

    .checkout-wrap-1 .checkout-container {
      max-width: 1450px;
      margin: 0 auto;
      position: relative;
      z-index: 2;
    }

    .checkout-wrap-1 .checkout-head {
      margin-bottom: 32px;
    }

    .checkout-wrap-1 .checkout-head span {
      display: inline-flex;
      align-items: center;
      gap: 9px;
      background: #e9f8f9;
      color: #087489;
      border: 1px solid #cce8ec;
      padding: 9px 15px;
      border-radius: 50px;
      font-size: 14px;
      font-weight: 500;
      margin-bottom: 12px;
    }

    .checkout-wrap-1 .checkout-head h1 {
      color: #073f54;
      font-size: 24px;
      line-height: 1.15;
      font-weight: 500;
      margin-bottom: 8px;
    }

    .checkout-wrap-1 .checkout-head p {
      color: #5d7180;
      font-size: 16px;
      line-height: 1.7;
      max-width: 720px;
    }

    .checkout-wrap-1 .checkout-layout {
      display: grid;
      grid-template-columns: minmax(0, 1fr) 430px;
      gap: 30px;
      align-items: flex-start;
    }

    .checkout-wrap-1 .billing-card,
    .checkout-wrap-1 .cart-card,
    .checkout-wrap-1 .payment-card {
      background: rgba(255,255,255,.95);
      border: 1px solid #d1e7ed;
      border-radius: 15px;
      box-shadow: 0 18px 45px rgba(11,82,100,.08);
      position: relative;
      overflow: hidden;
    }

    .checkout-wrap-1 .billing-card::after,
    .checkout-wrap-1 .cart-card::after,
    .checkout-wrap-1 .payment-card::after {
      content: "";
      position: absolute;
      right: -75px;
      bottom: -75px;
      width: 180px;
      height: 180px;
      border-radius: 50%;
      background: rgba(21,154,163,.07);
      pointer-events: none;
    }

    .checkout-wrap-1 .card-head {
      padding: 26px 28px;
      border-bottom: 1px solid #dbeaf0;
      background: linear-gradient(120deg, rgba(21,154,163,.08), transparent 55%);
      display: flex;
      align-items: center;
      gap: 16px;
      position: relative;
      z-index: 2;
    }

    .checkout-wrap-1 .card-icon {
      width: 58px;
      height: 58px;
      border-radius: 50%;
      background: linear-gradient(135deg, #0d5262, #19a4a9);
      color: #fff;
      display: grid;
      place-items: center;
      font-size: 24px;
      box-shadow: 0 14px 28px rgba(21,154,163,.22);
      flex-shrink: 0;
    }

    .checkout-wrap-1 .card-head h2 {
      color: #073f54;
      font-size: 20px;
      line-height: 1.2;
      font-weight: 500;
      margin-bottom: 4px;
    }

    .checkout-wrap-1 .card-head p {
      color: #5d7180;
      font-size: 16px;
      line-height: 1.5;
      margin-bottom: 0;
    }

    .checkout-wrap-1 .billing-body {
      padding: 28px;
      position: relative;
      z-index: 2;
    }

    .checkout-wrap-1 .billing-form {
      display: grid;
      gap: 22px;
    }

    .checkout-wrap-1 .form-grid {
      display: grid;
      grid-template-columns: repeat(2, 1fr);
      gap: 22px;
    }

    .checkout-wrap-1 .field {
      position: relative;
    }

    .checkout-wrap-1 .field input,
    .checkout-wrap-1 .field textarea {
      width: 100%;
      min-height: 66px;
      border: 1px solid transparent;
      background: #f3f2ef;
      border-radius: 18px;
      padding: 20px 18px 10px;
      font-size: 16px;
      color: #273642;
      outline: none;
      transition: 0.3s;
      border: 1.5px solid #c8c8c8;
      background: #fff;
      border-radius: 10px;
      padding: 18px 16px 14px 16px;
      font-size: 17px;
      color: #17384b;
      outline: none;
      transition: .25s ease;
      width: 100%;
    }

    .checkout-wrap-1 .field textarea {
      min-height: 190px;
      resize: vertical;
      display: block;
      padding-top: 22px;
    }

    .checkout-wrap-1 .field label {
      position: absolute;
      top: 21px;
      left: 18px;
      color: #4f5f6d;
      font-size: 16px;
      pointer-events: none;
      transition: 0.25s;
    }

    .checkout-wrap-1 .field input:focus,
    .checkout-wrap-1 .field textarea:focus,
    .checkout-wrap-1 .field input:not(:placeholder-shown),
    .checkout-wrap-1 .field textarea:not(:placeholder-shown) {
      background: #fff;
      border-color: #159aa3;
      box-shadow: 0 0 0 4px rgba(21,154,163,.12);
    }

    .checkout-wrap-1 .field input:focus + label,
    .checkout-wrap-1 .field textarea:focus + label,
    .checkout-wrap-1 .field input:not(:placeholder-shown) + label,
    .checkout-wrap-1 .field textarea:not(:placeholder-shown) + label {
      top: 4px;
      font-size: 13px;
      color: #087489;
      font-weight: 500;
    }

    .checkout-wrap-1 .secure-note {
      margin-top: 24px;
      background: #e9f8f9;
      border: 1px solid #cce8ec;
      border-radius: 15px;
      padding: 16px 18px;
      color: #087489;
      font-size: 15px;
      line-height: 1.7;
      font-weight: 500;
      display: flex;
      gap: 12px;
      align-items: flex-start;
    }

    .checkout-wrap-1 .secure-note i {
      margin-top: 4px;
      flex-shrink: 0;
    }

    .checkout-wrap-1 .checkout-side {
      display: grid;
      gap: 22px;
      position: sticky;
      top: 24px;
    }

    .checkout-wrap-1 .cart-card {
      padding: 0;
    }

    .checkout-wrap-1 .cart-body {
      padding: 24px;
      position: relative;
      z-index: 2;
    }

    .checkout-wrap-1 .cart-item {
      background: #fff;
      border: 1px solid #dbeaf0;
      border-radius: 10px;
      padding: 18px;
      display: grid;
      grid-template-columns: 1fr;
      gap: 16px;
      align-items: center;
      margin-bottom: 19px;
      box-shadow: 0 10px 25px rgba(11,82,100,.06);
    }

    .checkout-wrap-1 .cart-item-icon {
      width: 56px;
      height: 56px;
      border-radius: 17px;
      background: linear-gradient(135deg, #0d5262, #19a4a9);
      color: #fff;
      display: grid;
      place-items: center;
      font-size: 23px;
    }

    .checkout-wrap-1 .cart-item-info {
      min-width: 0;
    }

    .checkout-wrap-1 .cart-item-top {
      display: flex;
      justify-content: space-between;
      gap: 15px;
      align-items: flex-start;
      margin-bottom: 0px;
    }

    .checkout-wrap-1 .cart-item h3 {
      color: #071f3d;
      font-size: 17px;
      line-height: 1.25;
      font-weight: 500;
    }

    .checkout-wrap-1 .cart-item strong {
      color: #071f3d;
      font-size: 17px;
      font-weight: 500;
      white-space: nowrap;
    }

    .checkout-wrap-1 .cart-item strong span {
      font-size: 13px;
      font-weight: 500;
      color: #526b8a;
    }

    .checkout-wrap-1 .cart-item p {
      color: #526b8a;
      font-size: 15px;
      font-weight: 500;
    }

    .checkout-wrap-1 .price-lines {
      display: grid;
      gap: 13px;
      margin-bottom: 18px;
    }

    .checkout-wrap-1 .price-line {
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 14px;
      color: #5d7180;
      font-size: 16px;
      font-weight: 500;
    }

    .checkout-wrap-1 .price-line strong {
      color: #071f3d;
      font-weight: 500;
      text-align: right;
    }

    .checkout-wrap-1 .price-line .free {
      color: #159aa3;
    }

    .checkout-wrap-1 .total-box {
      background: linear-gradient(135deg, #0d5262, #19a4a9);
      border-radius: 8px;
      padding: 18px;
      color: #fff;
      display: flex;
      justify-content: space-between;
      gap: 16px;
      align-items: center;
      box-shadow: 0 16px 34px rgba(21,154,163,.22);
    }

    .checkout-wrap-1 .total-box span {
      font-size: 16px;
      font-weight: 500;
      opacity: 0.88;
    }

    .checkout-wrap-1 .total-box strong {
      font-size: 24px;
      font-weight: 500;
      text-align: right;
    }

    .checkout-wrap-1 .total-box small {
      font-size: 14px;
      font-weight: 500;
    }

    .checkout-wrap-1 .payment-card {
      padding: 24px;
      position: relative;
      z-index: 2;
    }

    .checkout-wrap-1 .payment-card h3 {
      color: #073f54;
      font-size: 20px;
      font-weight: 500;
      margin-bottom: 16px;
      display: flex;
      align-items: center;
      gap: 10px;
      position: relative;
      z-index: 2;
    }

    .checkout-wrap-1 .payment-card h3 i {
      color: #159aa3;
    }

    .checkout-wrap-1 .payment-logos {
      position: relative;
      z-index: 2;
      display: ;
      grid-template-columns: repeat(5, 1fr);
      gap: 12px;
    }

    .checkout-wrap-1 .pay-logo {
      min-height: 52px;
      border-radius: 15px;
      background: #fff;
      border: 1px solid #dbeaf0;
      box-shadow: 0 8px 18px rgba(11,82,100,.06);
      display: grid;
      place-items: center;
      font-weight: 500;
      overflow: hidden;
    }

    .checkout-wrap-1 .apple {
      color: #000;
      font-size: 21px;
    }

    .checkout-wrap-1 .master {
      position: relative;
      background: #fff;
    }

    .checkout-wrap-1 .master span {
      width: 28px;
      height: 28px;
      border-radius: 50%;
      position: absolute;
    }

    .checkout-wrap-1 .master span:first-child {
      background: #eb001b;
      left: calc(50% - 24px);
    }

    .checkout-wrap-1 .master span:last-child {
      background: #f79e1b;
      right: calc(50% - 24px);
      opacity: 0.9;
    }

    .checkout-wrap-1 .visa {
      color: #1a1f71;
      font-size: 27px;
      letter-spacing: 1px;
      font-style: italic;
    }

    .checkout-wrap-1 .etisalat {
      color: #77a900;
      font-size: 14px;
    }

    .checkout-wrap-1 .du {
      color: #00a9d6;
      font-size: 30px;
      font-weight: 500;
    }

    .checkout-wrap-1 .pay-btn {
      width: 100%;
      min-height: 62px;
      margin-top: 22px;
      border: 0;
      border-radius: 10px;
      background: #073f54;
      color: #fff;
      padding: 8px 8px 8px 24px;
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 18px;
      font-size: 18px;
      font-weight: 500;
      cursor: pointer;
      transition: 0.3s;
      box-shadow: 0 16px 34px rgba(7,63,84,.22);
      position: relative;
      z-index: 2;
      background: linear-gradient(135deg, #0d5262, #19a4a9);
    }

    .checkout-wrap-1 .pay-btn:hover {
      background: #087489;
      transform: translateY(-3px);
      box-shadow: 0 20px 42px rgba(8,116,137,.25);
    }

    .checkout-wrap-1 .pay-btn i {
      width: 36px;
      height: 36px;
      border-radius: 5px;
      background: #159aa3;
      display: grid;
      place-items: center;
      font-size: 16px;
      transition: 0.3s;
    }

    .checkout-wrap-1 .pay-btn:hover i {
      background: #fff;
      color: #087489;
      transform: translateX(3px);
    }

    @media (max-width: 1150px) {
      .checkout-wrap-1 .checkout-layout {
        grid-template-columns: 1fr;
      }

      .checkout-wrap-1 .checkout-side {
        position: relative;
        top: auto;
      }
    }

    @media (max-width: 768px) {
      .checkout-wrap-1 {
        padding: 36px 14px;
      }

      .checkout-wrap-1 .checkout-head h1 {
        font-size: 31px;
      }

      .checkout-wrap-1 .card-head {
        padding: 22px;
        align-items: flex-start;
      }

      .checkout-wrap-1 .card-head h2 {
        font-size: 22px;
      }

      .checkout-wrap-1 .billing-body {
        padding: 22px;
      }

      .checkout-wrap-1 .form-grid {
        grid-template-columns: 1fr;
        gap: 18px;
      }

      .checkout-wrap-1 .cart-item-top {
        flex-direction: column;
        gap: 7px;
      }

      .checkout-wrap-1 .payment-logos {
        grid-template-columns: repeat(3, 1fr);
      }
    }

    @media (max-width: 520px) {
      .checkout-wrap-1 .checkout-head h1 {
        font-size: 28px;
      }

      .checkout-wrap-1 .billing-card,
      .checkout-wrap-1 .cart-card,
      .checkout-wrap-1 .payment-card {
        border-radius: 22px;
      }

      .checkout-wrap-1 .card-head {
        flex-direction: column;
      }

      .checkout-wrap-1 .field input,
      .checkout-wrap-1 .field textarea {
        border-radius: 15px;
      }

      .checkout-wrap-1 .cart-body,
      .checkout-wrap-1 .payment-card {
        padding: 20px;
      }

      .checkout-wrap-1 .cart-item {
        grid-template-columns: 1fr;
      }

      .checkout-wrap-1 .total-box {
        flex-direction: column;
        align-items: flex-start;
      }

      .checkout-wrap-1 .total-box strong {
        text-align: left;
        font-size: 22px;
      }

      .checkout-wrap-1 .payment-logos {
        grid-template-columns: repeat(2, 1fr);
      }

      .checkout-wrap-1 .pay-btn {
        font-size: 16px;
      }
    }













    .bakacnt-wrap-1 {
      width: 100%;
      min-height: inherit;
      padding: 50px 0px;
      background:
        linear-gradient(rgba(255,255,255,.94), rgba(255,255,255,.94)),
        linear-gradient(90deg, rgba(14,118,132,.08) 1px, transparent 1px),
        linear-gradient(rgba(14,118,132,.08) 1px, transparent 1px);
      background-size: 100% 100%, 28px 28px, 28px 28px;
      overflow: hidden;
      position: relative;
    }

    .bakacnt-wrap-1::before {
      content: "";
      position: absolute;
      width: 360px;
      height: 360px;
      border-radius: 50%;
      background: rgba(21,154,163,.08);
      top: -160px;
      left: -160px;
      pointer-events: none;
    }

    .bakacnt-wrap-1::after {
      content: "";
      position: absolute;
      width: 420px;
      height: 420px;
      border-radius: 50%;
      background: rgba(13,82,98,.06);
      right: -180px;
      bottom: -180px;
      pointer-events: none;
    }

    .bakacnt-wrap-1 .bank-container {
      max-width: 100%;
      margin: 0 auto;
      position: relative;
      z-index: 2;
    }

    .bakacnt-wrap-1 .bank-hero {
      background: linear-gradient(135deg, #0d5262, #19a4a9);
      border-radius: 30px;
      padding: 48px;
      color: #fff;
      margin-bottom: 34px;
      position: relative;
      overflow: hidden;
      box-shadow: 0 24px 55px rgba(11,82,100,.18);
    }

    .bakacnt-wrap-1 .bank-hero::before {
      content: "";
      position: absolute;
      right: -110px;
      top: -110px;
      width: 310px;
      height: 310px;
      background: rgba(255,255,255,.14);
      border-radius: 50%;
    }

    .bakacnt-wrap-1 .bank-hero::after {
      content: "";
      position: absolute;
      right: 160px;
      bottom: 38px;
      width: 86px;
      height: 86px;
      border: 1px solid rgba(255,255,255,.25);
      border-radius: 24px;
      transform: rotate(18deg);
    }

    .bakacnt-wrap-1 .bank-badge {
      display: inline-flex;
      align-items: center;
      gap: 9px;
      background: rgba(255,255,255,.16);
      color: #fff;
      border: 1px solid rgba(255,255,255,.24);
      padding: 10px 16px;
      border-radius: 50px;
      font-size: 14px;
      font-weight: 500;
      margin-bottom: 18px;
      position: relative;
      z-index: 2;
    }

    .bakacnt-wrap-1 .bank-hero h1 {
      font-size: 48px;
      line-height: 1.12;
      font-weight: 500;
      margin-bottom: 14px;
      position: relative;
      z-index: 2;
    }

    .bakacnt-wrap-1 .bank-breadcrumb {
      display: flex;
      flex-wrap: wrap;
      gap: 10px;
      list-style: none;
      position: relative;
      z-index: 2;
    }

    .bakacnt-wrap-1 .bank-breadcrumb li,
    .bakacnt-wrap-1 .bank-breadcrumb a {
      color: rgba(255,255,255,.9);
      font-size: 16px;
      text-decoration: none;
      font-weight: 500;
    }

    .bakacnt-wrap-1 .bank-intro {
      background: rgba(255,255,255,.95);
      border: 1px solid #d1e7ed;
      border-radius: 18px;
      padding: 26px;
      box-shadow: 0 18px 45px rgba(11,82,100,.08);
      margin-bottom: 26px;
      display: grid;
      grid-template-columns: 70px 1fr;
      gap: 18px;
      align-items: flex-start;
      position: relative;
      overflow: hidden;
    }

    .bakacnt-wrap-1 .bank-intro::after {
      content: "";
      position: absolute;
      width: 170px;
      height: 170px;
      right: -75px;
      bottom: -75px;
      border-radius: 50%;
      background: rgba(21,154,163,.07);
    }

    .bakacnt-wrap-1 .bank-intro-icon {
      width: 70px;
      height: 70px;
      border-radius: 50%;
      background: linear-gradient(135deg, #0d5262, #19a4a9);
      color: #fff;
      display: grid;
      place-items: center;
      font-size: 30px;
      box-shadow: 0 14px 28px rgba(21,154,163,.22);
      position: relative;
      z-index: 2;
    }

    .bakacnt-wrap-1 .bank-intro h2 {
      color: #073f54;
      font-size: 23px;
      line-height: 1.2;
      font-weight: 500;
      margin-bottom: 2px;
      position: relative;
      z-index: 2;
    }

    .bakacnt-wrap-1 .bank-intro p {
      color: #5d7180;
      font-size: 14px;
      line-height: 1.5;
      position: relative;
      z-index: 2;
      margin-bottom: 0;
    }

    .bakacnt-wrap-1 .bank-grid {
      display: grid;
      grid-template-columns: repeat(3, 1fr);
      gap: 24px;
    }

    .bakacnt-wrap-1 .bank-card {
      background: rgba(255,255,255,.96);
      border: 1px solid #d1e7ed;
      border-radius: 15px;
      overflow: hidden;
      box-shadow: 0 18px 45px rgba(11,82,100,.08);
      position: relative;
      transition: 0.35s ease;
    }

    .bakacnt-wrap-1 .bank-card:hover {
      transform: translateY(-7px);
      box-shadow: 0 26px 60px rgba(11,82,100,.14);
      border-color: #9dd9e2;
    }

    .bakacnt-wrap-1 .bank-card-top {
      padding: 28px;
      background: linear-gradient(120deg, rgba(21,154,163,.1), transparent 65%);
      border-bottom: 1px solid #dbeaf0;
      position: relative;
      overflow: hidden;
    }

    .bakacnt-wrap-1 .bank-card-top::after {
      content: "";
      position: absolute;
      right: -52px;
      top: -52px;
      width: 135px;
      height: 135px;
      border-radius: 50%;
      background: rgba(21,154,163,.1);
    }

    .bakacnt-wrap-1 .bank-logo {
      width: 76px;
      height: 76px;
      border-radius: 50%;
      background: #fff;
      border: 1px solid #dbeaf0;
      display: grid;
      place-items: center;
      color: #087489;
      font-size: 31px;
      margin-bottom: 20px;
      box-shadow: 0 12px 26px rgba(11,82,100,.08);
      position: relative;
      z-index: 2;
      border: dashed 1px #15999b;
    }

    .bakacnt-wrap-1 .bank-card h3 {
      color: #073f54;
      font-size: 20px;
      line-height: 1.35;
      font-weight: 500;
      position: relative;
      z-index: 2;
    }

    .bakacnt-wrap-1 .bank-type {
      display: inline-flex;
      align-items: center;
      gap: 7px;
      background: #e9f8f9;
      color: #087489;
      border: 1px solid #cce8ec;
      padding: 8px 12px;
      border-radius: 50px;
      font-size: 13px;
      font-weight: 500;
      margin-top: 14px;
      position: relative;
      z-index: 2;
    }

    .bakacnt-wrap-1 .bank-card-body {
      padding: 26px;
      display: grid;
      gap: 16px;
    }

    .bakacnt-wrap-1 .bank-detail {
      background: #f7fbfc;
      border: 1px solid #dbeaf0;
      border-radius: 15px;
      padding: 16px;
      display: grid;
      gap: 8px;
    }

    .bakacnt-wrap-1 .bank-detail-top {
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 12px;
    }

    .bakacnt-wrap-1 .bank-detail label {
      color: #5d7180;
      font-size: 14px;
      font-weight: 500;
    }

    .bakacnt-wrap-1 .copy-btn {
      width: 34px;
      height: 34px;
      border: 0;
      border-radius: 10px;
      background: #e9f8f9;
      color: #087489;
      cursor: pointer;
      display: grid;
      place-items: center;
      transition: 0.3s;
      flex-shrink: 0;
    }

    .bakacnt-wrap-1 .copy-btn:hover {
      background: #159aa3;
      color: #fff;
      transform: translateY(-2px);
    }

    .bakacnt-wrap-1 .bank-detail strong {
      color: #071f3d;
      font-size: 17px;
      line-height: 1.5;
      font-weight: 500;
      word-break: break-all;
    }

    .bakacnt-wrap-1 .donate-action {
      width: 100%;
      min-height: 60px;
      border-radius: 11px;
      background: linear-gradient(135deg, #0d5262, #19a4a9);
      color: #fff;
      text-decoration: none;
      display: inline-flex;
      align-items: center;
      justify-content: center;
      gap: 10px;
      font-size: 16px;
      font-weight: 500;
      margin-top: 4px;
      transition: 0.3s;
      box-shadow: 0 14px 28px rgba(21,154,163,.2);
    }

    .bakacnt-wrap-1 .donate-action:hover {
      transform: translateY(-3px);
      box-shadow: 0 18px 36px rgba(21,154,163,.28);
    }

    .bakacnt-wrap-1 .bank-note {
      margin-top: 28px;
      background: linear-gradient(135deg, #0d5262, #19a4a9);
      border-radius: 20px;
      padding: 30px;
      color: #fff;
      box-shadow: 0 22px 50px rgba(11,82,100,.18);
      display: grid;
      grid-template-columns: 62px 1fr;
      gap: 18px;
      align-items: flex-start;
      position: relative;
      overflow: hidden;
    }

    .bakacnt-wrap-1 .bank-note::after {
      content: "";
      position: absolute;
      width: 210px;
      height: 210px;
      right: -90px;
      bottom: -90px;
      border-radius: 50%;
      background: rgba(255,255,255,.14);
    }

    .bakacnt-wrap-1 .bank-note i {
      width: 62px;
      height: 62px;
      border-radius: 50%;
      background: rgba(255,255,255,.16);
      color: #fff;
      display: grid;
      place-items: center;
      font-size: 26px;
      position: relative;
      z-index: 2;
    }

    .bakacnt-wrap-1 .bank-note h3 {
      font-size: 20px;
      font-weight: 500;
      margin-bottom: 8px;
      position: relative;
      z-index: 2;
      color: #fff;
    }

    .bakacnt-wrap-1 .bank-note p {
      color: rgba(255,255,255,.92);
      font-size: 16px;
      line-height: 1.8;
      position: relative;
      z-index: 2;
      margin-bottom: 0;
    }

    @media (max-width: 1150px) {
      .bakacnt-wrap-1 .bank-grid {
        grid-template-columns: repeat(2, 1fr);
      }
    }

    @media (max-width: 768px) {
      .bakacnt-wrap-1 {
        padding: 15px 0;
      }

      .bakacnt-wrap-1 .bank-hero {
        padding: 36px 24px;
        border-radius: 24px;
      }

      .bakacnt-wrap-1 .bank-hero h1 {
        font-size: 36px;
      }

      .bakacnt-wrap-1 .bank-intro {
        grid-template-columns: 1fr;
        padding: 22px;
      }

      .bakacnt-wrap-1 .bank-intro h2 {
        font-size: 19px;
      }

      .bakacnt-wrap-1 .bank-grid {
        grid-template-columns: 1fr;
      }

      .bakacnt-wrap-1 .bank-card-top,
      .bakacnt-wrap-1 .bank-card-body {
        padding: 15px;
      }

      .bakacnt-wrap-1 .bank-note {
        grid-template-columns: 1fr;
        padding: 24px;
      }
    }

    @media (max-width: 480px) {
      .bakacnt-wrap-1 .bank-hero h1 {
        font-size: 30px;
      }

      .bakacnt-wrap-1 .bank-card {
        border-radius: 22px;
      }

      .bakacnt-wrap-1 .bank-card h3 {
        font-size: 19px;
      }

      .bakacnt-wrap-1 .bank-detail strong {
        font-size: 15px;
      }
    }










     .open-d-w-1 {
      width: 100%;
      min-height: 100vh;
      padding: 50px 0px;
      background:
        linear-gradient(rgba(255,255,255,.94), rgba(255,255,255,.94)),
        linear-gradient(90deg, rgba(14,118,132,.08) 1px, transparent 1px),
        linear-gradient(rgba(14,118,132,.08) 1px, transparent 1px);
      background-size: 100% 100%, 28px 28px, 28px 28px;
      overflow: hidden;
      position: relative;
    }

    .open-d-w-1::before {
      content: "";
      position: absolute;
      width: 360px;
      height: 360px;
      border-radius: 50%;
      background: rgba(21,154,163,.08);
      top: -160px;
      left: -160px;
      pointer-events: none;
    }

    .open-d-w-1::after {
      content: "";
      position: absolute;
      width: 420px;
      height: 420px;
      border-radius: 50%;
      background: rgba(13,82,98,.06);
      right: -180px;
      bottom: -180px;
      pointer-events: none;
    }

    .open-d-w-1 .open-container {
      max-width: 100%;
      margin: 0 auto;
      position: relative;
      z-index: 2;
    }

    .open-d-w-1 .open-hero {
      background: linear-gradient(135deg, #0d5262, #19a4a9);
      border-radius: 30px;
      padding: 48px;
      color: #fff;
      margin-bottom: 34px;
      position: relative;
      overflow: hidden;
      box-shadow: 0 24px 55px rgba(11,82,100,.18);
    }

    .open-d-w-1 .open-hero::before {
      content: "";
      position: absolute;
      right: -110px;
      top: -110px;
      width: 310px;
      height: 310px;
      background: rgba(255,255,255,.14);
      border-radius: 50%;
    }

    .open-d-w-1 .open-hero::after {
      content: "";
      position: absolute;
      right: 160px;
      bottom: 38px;
      width: 86px;
      height: 86px;
      border: 1px solid rgba(255,255,255,.25);
      border-radius: 24px;
      transform: rotate(18deg);
    }

    .open-d-w-1 .open-badge {
      display: inline-flex;
      align-items: center;
      gap: 9px;
      background: rgba(255,255,255,.16);
      color: #fff;
      border: 1px solid rgba(255,255,255,.24);
      padding: 10px 16px;
      border-radius: 50px;
      font-size: 14px;
      font-weight: 500;
      margin-bottom: 18px;
      position: relative;
      z-index: 2;
    }

    .open-d-w-1 .open-hero h1 {
      font-size: 48px;
      line-height: 1.12;
      font-weight: 500;
      margin-bottom: 14px;
      position: relative;
      z-index: 2;
    }

    .open-d-w-1 .open-breadcrumb {
      display: flex;
      flex-wrap: wrap;
      gap: 10px;
      list-style: none;
      position: relative;
      z-index: 2;
    }

    .open-d-w-1 .open-breadcrumb li,
    .open-d-w-1 .open-breadcrumb a {
      color: rgba(255,255,255,.9);
      font-size: 16px;
      text-decoration: none;
      font-weight: 500;
    }

    .open-d-w-1 .open-intro {
      background: rgba(255,255,255,.95);
      border: 1px solid #d1e7ed;
      border-radius: 19px;
      padding: 30px;
      box-shadow: 0 18px 45px rgba(11,82,100,.08);
      margin-bottom: 28px;
      display: grid;
      grid-template-columns: 82px 1fr;
      gap: 22px;
      align-items: flex-start;
      position: relative;
      overflow: hidden;
    }

    .open-d-w-1 .open-intro::after {
      content: "";
      position: absolute;
      width: 190px;
      height: 190px;
      right: -85px;
      bottom: -85px;
      border-radius: 50%;
      background: rgba(21,154,163,.07);
    }

    .open-d-w-1 .open-intro-icon {
      width: 82px;
      height: 82px;
      border-radius: 50%;
      background: linear-gradient(135deg, #0d5262, #19a4a9);
      color: #fff;
      display: grid;
      place-items: center;
      font-size: 34px;
      box-shadow: 0 14px 28px rgba(21,154,163,.22);
      position: relative;
      z-index: 2;
    }

    .open-d-w-1 .open-intro h2 {
      color: #073f54;
      font-size: 23px;
      line-height: 1.2;
      font-weight: 500;
      margin-bottom: 4px;
      position: relative;
      z-index: 2;
    }

    .open-d-w-1 .open-intro p {
      color: #5d7180;
      font-size: 17px;
      line-height: 1.5;
      position: relative;
      z-index: 2;
      margin-bottom: 0;
    }

    .open-d-w-1 .open-points {
      display: grid;
      grid-template-columns: repeat(3, 1fr);
      gap: 18px;
      margin-bottom: 34px;
    }

    .open-d-w-1 .open-point {
      background: rgba(255,255,255,.95);
      border: 1px solid #d1e7ed;
      border-radius: 15px;
      padding: 22px;
      box-shadow: 0 14px 34px rgba(11,82,100,.07);
      display: flex;
      gap: 15px;
      align-items: flex-start;
      transition: 0.3s ease;
    }

    .open-d-w-1 .open-point:hover {
      transform: translateY(-5px);
      border-color: #9dd9e2;
      box-shadow: 0 22px 45px rgba(11,82,100,.12);
    }

    .open-d-w-1 .open-point i {
      width: 60px;
      height: 60px;
      border-radius: 50%;
      background: #e9f8f9;
      color: #087489;
      display: grid;
      place-items: center;
      font-size: 24px;
      flex-shrink: 0;
      border: dashed 1px #15999bc2;
    }

    .open-d-w-1 .open-point h3 {
      color: #073f54;
      font-size: 18px;
      line-height: 1.35;
      font-weight: 500;
      margin-bottom: 6px;
    }

    .open-d-w-1 .open-point p {
      color: #5d7180;
      font-size: 16px;
      line-height: 1.3;
      font-weight: 500;
      margin-bottom: 0;
    }

    .open-d-w-1 .open-section-head {
      display: flex;
      align-items: flex-end;
      justify-content: space-between;
      gap: 22px;
      margin-bottom: 24px;
    }

    .open-d-w-1 .open-title-small {
      display: inline-flex;
      align-items: center;
      gap: 9px;
      color: #087489;
      background: #e9f8f9;
      border: 1px solid #cce8ec;
      padding: 8px 13px;
      border-radius: 50px;
      font-size: 13px;
      font-weight: 500;
      margin-bottom: 10px;
    }

    .open-d-w-1 .open-section-head h2 {
      color: #073f54;
      font-size: 24px;
      line-height: 1.2;
      font-weight: 500;
    }

    .open-d-w-1 .open-section-head p {
      color: #5d7180;
      font-size: 16px;
      line-height: 1.7;
      max-width: 560px;
    }

    .open-d-w-1 .open-doc-grid {
      display: grid;
      grid-template-columns: repeat(4, 1fr);
      gap: 24px;
    }

    .open-d-w-1 .open-doc-card {
      background: rgba(255,255,255,.96);
      border: 1px solid #d1e7ed;
      border-radius: 15px;
      overflow: hidden;
      box-shadow: 0 18px 45px rgba(11,82,100,.08);
      position: relative;
      transition: 0.35s ease;
    }

    .open-d-w-1 .open-doc-card:hover {
      transform: translateY(-7px);
      box-shadow: 0 26px 60px rgba(11,82,100,.14);
      border-color: #9dd9e2;
    }

    .open-d-w-1 .open-doc-visual {
      min-height: 190px;
      background: linear-gradient(135deg, #e9f8f9, #ffffff);
      border-bottom: 1px solid #dbeaf0;
      display: grid;
      place-items: center;
      position: relative;
      overflow: hidden;
    }

    .open-d-w-1 .open-doc-visual::before {
      content: "";
      position: absolute;
      width: 180px;
      height: 180px;
      border-radius: 50%;
      background: rgba(21,154,163,.08);
      right: -70px;
      top: -70px;
    }

    .open-d-w-1 .open-doc-visual::after {
      content: "";
      position: absolute;
      width: 86px;
      height: 86px;
      border: 1px dashed rgba(21,154,163,.4);
      border-radius: 24px;
      left: 24px;
      bottom: 22px;
      transform: rotate(15deg);
    }

    .open-d-w-1 .open-doc-icon {
      width: 96px;
      height: 116px;
      border-radius: 20px;
      background: #fff;
      border: 1px solid #dbeaf0;
      box-shadow: 0 18px 36px rgba(11,82,100,.10);
      display: grid;
      place-items: center;
      color: #087489;
      font-size: 42px;
      position: relative;
      z-index: 2;
    }

    .open-d-w-1 .open-doc-icon span {
      position: absolute;
      right: -10px;
      bottom: -10px;
      width: 38px;
      height: 38px;
      border-radius: 13px;
      background: linear-gradient(135deg, #0d5262, #19a4a9);
      color: #fff;
      display: grid;
      place-items: center;
      font-size: 15px;
      font-weight: 500;
    }

    .open-d-w-1 .open-doc-body {
      padding: 19px;
    }

    .open-d-w-1 .open-doc-body h3 {
      color: #073f54;
      font-size: 19px;
      line-height: 1.35;
      font-weight: 500;
      margin-bottom: 14px;
      min-height: 60px;
    }

    .open-d-w-1 .open-download-label {
      display: flex;
      align-items: center;
      gap: 9px;
      color: #5d7180;
      font-size: 14px;
      font-weight: 500;
      margin-bottom: 14px;
    }

    .open-d-w-1 .open-download-label i {
      color: #159aa3;
    }

    .open-d-w-1 .open-actions {
      display: grid;
      grid-template-columns: 1fr 1fr;
      gap: 12px;
    }

    .open-d-w-1 .open-btn {
      min-height: 48px;
      border-radius: 9px;
      text-decoration: none;
      border: 1px solid #cce8ec;
      display: inline-flex;
      align-items: center;
      justify-content: center;
      gap: 8px;
      font-size: 15px;
      font-weight: 500;
      transition: 0.3s;
    }

    .open-d-w-1 .open-btn.ar {
      background: #e9f8f9;
      color: #087489;
    }

    .open-d-w-1 .open-btn.en {
      background: linear-gradient(135deg, #0d5262, #19a4a9);
      color: #fff;
      border-color: transparent;
      box-shadow: 0 12px 24px rgba(21,154,163,.18);
    }

    .open-d-w-1 .open-btn:hover {
      transform: translateY(-3px);
      box-shadow: 0 14px 28px rgba(11,82,100,.14);
    }

    .open-d-w-1 .open-footer-note {
      margin-top: 30px;
      background: linear-gradient(135deg, #0d5262, #19a4a9);
      border-radius: 26px;
      padding: 30px;
      color: #fff;
      box-shadow: 0 22px 50px rgba(11,82,100,.18);
      display: grid;
      grid-template-columns: 62px 1fr;
      gap: 18px;
      align-items: flex-start;
      position: relative;
      overflow: hidden;
    }

    .open-d-w-1 .open-footer-note::after {
      content: "";
      position: absolute;
      width: 210px;
      height: 210px;
      right: -90px;
      bottom: -90px;
      border-radius: 50%;
      background: rgba(255,255,255,.14);
    }

    .open-d-w-1 .open-footer-note i {
      width: 62px;
      height: 62px;
      border-radius: 18px;
      background: rgba(255,255,255,.16);
      color: #fff;
      display: grid;
      place-items: center;
      font-size: 26px;
      position: relative;
      z-index: 2;
    }

    .open-d-w-1 .open-footer-note h3 {
      font-size: 24px;
      font-weight: 500;
      margin-bottom: 8px;
      position: relative;
      z-index: 2;
    }

    .open-d-w-1 .open-footer-note p {
      color: rgba(255,255,255,.92);
      font-size: 16px;
      line-height: 1.8;
      position: relative;
      z-index: 2;
    }

    @media (max-width: 1150px) {
      .open-d-w-1 .open-doc-grid,
      .open-d-w-1 .open-points {
        grid-template-columns: repeat(2, 1fr);
      }
    }

    @media (max-width: 768px) {
      .open-d-w-1 {
        padding: 36px 14px;
      }

      .open-d-w-1 .open-hero {
        padding: 36px 24px;
        border-radius: 24px;
      }

      .open-d-w-1 .open-hero h1 {
        font-size: 36px;
      }

      .open-d-w-1 .open-intro {
        grid-template-columns: 1fr;
        padding: 24px;
      }

      .open-d-w-1 .open-intro h2 {
        font-size: 25px;
      }

      .open-d-w-1 .open-section-head {
        flex-direction: column;
        align-items: flex-start;
      }

      .open-d-w-1 .open-section-head h2 {
        font-size: 28px;
      }

      .open-d-w-1 .open-doc-grid,
      .open-d-w-1 .open-points {
        grid-template-columns: 1fr;
      }

      .open-d-w-1 .open-doc-body h3 {
        min-height: auto;
      }

      .open-d-w-1 .open-footer-note {
        grid-template-columns: 1fr;
        padding: 24px;
      }
    }

    @media (max-width: 480px) {
      .open-d-w-1 .open-hero h1 {
        font-size: 30px;
      }

      .open-d-w-1 .open-doc-card {
        border-radius: 22px;
      }

      .open-d-w-1 .open-doc-body {
        padding: 22px;
      }

      .open-d-w-1 .open-actions {
        grid-template-columns: 1fr;
      }

      .open-d-w-1 .open-point {
        flex-direction: column;
      }
    }



    .pb-50{ padding-bottom:50px; }


.pt-80{ padding-top:80px } 
.pb-0{ padding-bottom:0 }


#mainNav {
    display: none; /* Initially hide the menu */
    /* Other styles */
}

#mainNav.active {
    display: block; /* Show the menu when the 'active' class is added */
}



@media only screen and (max-width: 991px) {
 .container {
  max-width: 100%;
}

body {
    padding: 0;
  }

  .thmb-wrap {
  padding: 0px 0 0px 0;
}

  .our-services-gold {
    padding: 0px 0;
    background-size: 100% auto;
  }

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

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

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

.section-title p {
  margin-top: 20px;
  margin-bottom: 0;
  font-size: 16px;
  line-height: 24px;
  letter-spacing: 0;
  font-weight: 500;
}

.about-us-item { margin-bottom:0 }
  .about-us {
    padding: 0px 0;
  }

    .feature-item-gold {
    padding: 20px;
    gap: 83px;
  }


  .feature-item-gold {
  height: calc(100% - 14px);}

    .our-features-gold {
    padding: 20px 0 0;
  }




  .cnt-bx {
  margin-bottom: 0px;
}

.cnt-bx p {
  color: #fff;
  font-size: 15px;
}

  .how-it-work {
    padding: 0px 0 0;
  }
 .our-blog {
    padding: 20px 0 0px;
  }

  .float-btn {
    padding: 13px 10px;
  }
  .p-chatbot {
  right: 7px;}

 .feature-item-gold {
    padding: 20px;
    gap: 10px;
  }
  .section-title-content {
    margin-top: 0;
  }
  .section-btn {
  float: left;
}

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

  .section-content-btn {
  float: none;
  text-align: left;
}
.section-content-btn .section-btn {
    margin-top: 5px;
    margin-bottom: 10px;
  }

  

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


.p-tabs .tab-menu {
  float: left;
  margin-top: 15px;
}


.p-tabs .tab-menu li {
  padding: 10px 20px 10px 20px;}
.pt-80{ padding-top:20px } 


.about-us-item-list {
  display: flex;
  flex-wrap: inherit;}

.about-us-item-content {
  width: 100%;
}

.about-us-item-content p {
  margin: 3px 0 0;
  font-size: 15px;
  line-height: 19px;
}
.about-us-body, .about-us-btn {
    margin-top: 15px;
  }

  .wdth {
  width: 364px;
  height: 500px;
}

.post-item {
  min-height: 300px;
  margin-bottom: 15px;}

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

  body {
  font-size: 16px;}

.iso-wrap img {
  width: 65px;
}

.stry-srv-w .stry-btn {
    min-height: 44px;
    font-size: 16px;
  }

  .stry-srv-w .stry-card {
    height: 250px;
  }

.stry-srv-w .stry-title {
    font-size: 15px;
  }

 .abt-re-new .abt-hero {
    padding: 20px 15px;
    min-height: auto;
    border-radius: 22px;
  }



}


@media (max-width: 480px) {
  .stry-srv-w {
    padding: 0;
  }
}














/* =========================
   MAIN WRAPPER
========================= */

.nw-wrp-mnu{
    width:100%;
    background:#dfe9e9;
    border-bottom:1px solid #d4dddd;
    position:relative;
    z-index:9999;
}

/* =========================
   NAVBAR
========================= */

.nw-wrp-mnu .nw-nav{
    max-width:1400px;
    margin:auto;
    display:flex;
    align-items:center;
    justify-content:space-between;
    padding:14px 20px;
}

/* =========================
   LEFT SIDE
========================= */

.nw-left{
    display:flex;
    align-items:center;
    gap:40px;
}

.nw-logo-dot{
    width:12px;
    height:12px;
    border-radius:50%;
    background:#0d5468;
}

/* =========================
   DESKTOP MENU
========================= */

.nw-menu{
    display:flex;
    align-items:center;
    list-style:none;
    gap:34px;
}

.nw-menu li{
    position:relative;
}

.nw-menu li a{
    text-decoration:none;
    color:#0d5468;
    font-size:16px;
    font-weight:500;
    display:flex;
    align-items:center;
    gap:6px;
    transition:.3s;
}

.nw-menu li a:hover{
    color:#000;
}

/* =========================
   DROPDOWN
========================= */

.nw-dropdown{
    position:absolute;
    top:45px;
    left:0;
    background:#fff;
    min-width:230px;
    border-radius:14px;
    box-shadow:0 10px 30px rgba(0,0,0,0.08);
    opacity:0;
    visibility:hidden;
    transform:translateY(10px);
    transition:.3s;
    padding:12px 0;
}

.nw-dropdown li{
    list-style:none;
}

.nw-dropdown li a{
    padding:12px 20px;
    display:block;
    font-size:15px;
}

.nw-menu li:hover .nw-dropdown{
    opacity:1;
    visibility:visible;
    transform:translateY(0);
}

/* =========================
   RIGHT ICONS
========================= */

.nw-icons{
    display:flex;
    align-items:center;
    gap:18px;
}

.nw-icons svg{
    width:25px;
    height:25px;
    stroke:#0d5468;
    cursor:pointer;
}

/* =========================
   MOBILE BUTTON
========================= */

.nw-mobile-btn{
    display:none;
    background:none;
    border:none;
    cursor:pointer;
}

.nw-mobile-btn span{
    width:28px;
    height:3px;
    background:#0d5468;
    display:block;
    margin:5px 0;
    border-radius:10px;
}

/* =========================
   MOBILE MENU
========================= */

.nw-mobile-menu{
    position:fixed;
    top:0;
    right:-100%;
    width:320px;
    height:100vh;
    background:#fff;
    z-index:99999;
    transition:.4s ease;
    overflow-y:auto;
    box-shadow:-10px 0 30px rgba(0,0,0,0.1);
    padding:30px 25px;
}

.nw-mobile-menu.active{
    right:0;
    z-index: 10000000000;
}

.nw-mobile-top{
    display:flex;
    align-items:center;
    justify-content:space-between;
    margin-bottom:9px;
}

.nw-close{
    font-size:32px;
    cursor:pointer;
    color:#0d5468;
    background-color: #dcf3f8;
    width: 35px;
    height: 35px;
    text-align: center;
    padding-top: 8px;
    border-radius: 50%;
    border: dashed 1px #83b6c4;
}

.nw-mobile-links{
    list-style:none;
    padding-left: 0;
}

.nw-mobile-links li{
    border-bottom:1px solid #eee;
}

.nw-mobile-links li a{
    text-decoration:none;
    color:#0d5468;
    font-size:16px;
    font-weight:500;
    padding:16px 0;
    display:flex;
    justify-content:space-between;
    align-items:center;
}

/* MOBILE DROPDOWN */

.nw-mobile-dropdown{
    display:none;
    padding-bottom:15px;
}

.nw-mobile-dropdown a{
    padding:10px 0 10px 15px !important;
    font-size:14px !important;
    color:#5d7075 !important;
}

.nw-mobile-item.active .nw-mobile-dropdown{
    display:block;
}

/* =========================
   OVERLAY
========================= */

.nw-overlay{
    position:fixed;
    inset:0;
    background:rgba(0,0,0,0.45);
    opacity:0;
    visibility:hidden;
    transition:.3s;
    z-index:9999;
}

.nw-overlay.active{
    opacity:1;
    visibility:visible;
}

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

@media(max-width:991px){

    .nw-menu,
    .nw-icons{
        display:none;
    }

    .nw-mobile-btn{
        display:block;
    }

    .nw-left{
        gap:16px;
    }

}





















.h-d-wrp {
      padding: 0;
      position: relative;
    }

    /* Hero Section */
    .hero {
      text-align: center;
      max-width: 900px;
      margin: 0 auto;
    }

    .hero h1 {
      font-size: clamp(36px, 5vw, 62px);
      color: #0d4358;
      font-weight: 500;
      line-height: 1.2;
      margin-bottom: 16px;
    }

    .hero h1 span {
      color: #0d9187;
    }

    .hero p {
      color: #657f89;
      font-size: 16px;
      line-height: 1.7;
      margin-bottom: 30px;
    }

    .cta-buttons {
      display: flex;
      gap: 20px;
      flex-wrap: wrap;
      justify-content: center;
    }

    .cta-buttons a {
      display: inline-block;
      padding: 16px 28px;
      border-radius: 24px;
      background: linear-gradient(90deg, #11b7b8, #0d9187);
      color: #fff;
      font-weight: 500;
      text-align: center;
      text-decoration: none;
      font-size: 16px;
      transition: 0.3s ease;
    }

    .cta-buttons a:hover {
      background: linear-gradient(90deg, #079ca1, #11b7b8);
    }

    .cta-buttons a.secondary {
      background: #f0f8f8;
      color: #079ca1;
      border: 2px solid #079ca1;
    }

    .cta-buttons a.secondary:hover {
      background: #eef9f7;
    }

    /* Category Selection */
    .category-selection {
      display: grid;
      grid-template-columns: repeat(3, 1fr);
      gap: 20px;
      margin-top: 0;
    }

    .category-card {
      background: #fff;
      border-radius: 20px;
      padding: 30px;
      text-align: center;
      box-shadow: 0 10px 40px rgba(18, 56, 74, 0.06);
      transition: 0.3s ease;
      cursor: pointer;
      background: #f7fbfc;
      border: 1px solid #d7e0e3;
      border-radius: 9px;
    }

    .category-card:hover {
      transform: translateY(-6px);
      box-shadow: 0 14px 50px rgba(18, 56, 74, 0.12);
    }

    .category-card .icon {
      font-size: 40px;
      margin-bottom: 20px;
      color: #079ca1;
      width: 80px;
      height: 80px;
      background-color: #fff;
      padding: 30px 0;
      margin-bottom: 15px;
      display: inline-block;
      border-radius: 999px;
      border: dashed 2px #15999b6b;
    }

    .category-card h3 {
      color: #0d4358;
      font-size: 20px;
      font-weight: 500;
      margin-bottom: 10px;
    }

    .category-card p {
      color: #657f89;
      font-size: 14px;
      line-height: 1.7;
    }

    .category-card input[type="checkbox"] {
      display: none;
    }

    .category-card input[type="checkbox"]:checked + label {
      background-color: #12a89d;
      color: #fff;
      background: linear-gradient(135deg, #116c7a, #1fa7ad);
    }

    .category-card label {
      display: block;
      padding: 15px;
      background-color: #eef9f7;
      color: #079ca1;
      border-radius: 8px;
      font-size: 18px;
      cursor: pointer;
      transition: 0.3s ease;
      background: #fff;
      border: 1px solid #a4b9c0;
      margin-top: 15px;
    }

     /* Upload Section */
    .upload-section {
      display: none;
      margin-top: 40px;
      background: #fff;
    }

    .upload-section.active {
      display: block;
    }

    .upload-card {
      background: #fff;
      border-radius: 10px;
      padding: 30px;
      text-align: center;
      margin-bottom: 20px;
      box-shadow: 0 6px 20px rgba(18, 56, 74, 0.06);
      transition: all 0.3s ease;
      border: 1px solid #d7e0e3;
    }

    .upload-card:hover {
      transform: translateY(-6px);
      box-shadow: 0 14px 40px rgba(18, 56, 74, 0.12);
    }

    .upload-card h3 {
      font-size: 18px;
      color: #0d4358;
      margin-bottom: 4px;
    }

    .upload-card p {
      color: #657f89;
      font-size: 14px;
      margin-bottom: 20px;
    }

    .upload-card input[type="file"] {
      display: block;
      margin: 20px auto 0;
      padding: 10px;
      border: 2px solid #eef9f7;
      border-radius: 8px;
      color: #15999b;
      background-color: #eef9f7;
      font-size: 14px;
      cursor: pointer;
      transition: background-color 0.3s ease;
      border: solid 1px #15999b91;
      width: 100%;
    }

    .upload-card input[type="file"]:hover {
      background-color: #15999b;
      color: #fff;
    }

    /* Additional Fields */
    .additional-fields {
      display: flex;
      gap: 20px;
      flex-wrap: wrap;
    }

    .additional-field {
      background: #fff;
      border-radius: 20px;
      padding: 20px;
      width: 100%;
      max-width: 280px;
      box-shadow: 0 6px 20px rgba(18, 56, 74, 0.06);
    }

    .additional-field label {
      font-size: 16px;
      color: #0d4358;
      display: block;
      margin-bottom: 8px;
    }

    .additional-field input,
    .additional-field select {
      width: 100%;
      padding: 10px;
      border-radius: 12px;
      border: 1px solid #e1eeeb;
      font-size: 14px;
      color: #657f89;
    }

    /* Responsive Design */
    @media (max-width: 1024px) {
      .category-selection {
        grid-template-columns: repeat(2, 1fr);
      }

      .upload-card {
        margin-bottom: 30px;
      }
    }


.aplos-s{ display: block;
  grid-template-columns: repeat(1, 1fr);
  gap: 0; }

    /* Additional Fields */
    .additional-fields {
      display: grid;
      margin-top: 30px;
      grid-template-columns: repeat(3, 1fr);
      gap: 13px;
    }

    .additional-field {
      background: #fff;
      border-radius: 8px;
      padding: 20px;
      width: 100%;
      max-width: 100%;
      box-shadow: 0 10px 40px rgba(18, 56, 74, 0.06);
      border: solid 1px #9bbdbd63;
    }

    .additional-field label {
      font-size: 16px;
      color: #0d4358;
      display: block;
      margin-bottom: 8px;
    }

    .additional-field input,
    .additional-field select {
      width: 100%;
      padding: 10px;
      border-radius: 10px;
      border: 1px solid #e1eeeb;
      font-size: 15px;
      color: #535a5c;
      border: 1.5px solid #c8c8c8;
      background: #fff;
      border-radius: 5px;
    }

    /* Confirmation Section */
    .confirmation-screen {
      margin-top: 80px;
      background: #f0f8f8;
      border-radius: 20px;
      padding: 40px;
      text-align: center;
      box-shadow: 0 10px 40px rgba(18, 56, 74, 0.06);
    }

    .confirmation-screen h3 {
      color: #0d4358;
      font-size: 22px;
      font-weight: 500;
      margin-bottom: 20px;
    }

    .confirmation-screen p {
      color: #657f89;
      font-size: 16px;
      line-height: 1.7;
      margin-bottom: 20px;
    }

    /* Responsive Design */
    @media (max-width: 1024px) {
      .category-selection {
        grid-template-columns: repeat(2, 1fr);
      }

      .upload-section {
        margin-top: 40px;
      }

      .pickup-details {
        grid-template-columns: 1fr;
      }
    }

    @media (max-width: 640px) {
      .category-selection {
        grid-template-columns: 1fr;
      }

      .cta-buttons {
        flex-direction: column;
      }

      .cta-buttons a {
        width: 100%;
        text-align: center;
      }
    }




.h-d-wrp .upload-section {
      max-width: 100%;
      margin: 0 auto;
      padding: 0;
      background: #fff;
      border-radius: 0;
      box-shadow: none;
    }

   .h-d-wrp .upload-card {
      text-align: center;
      padding: 30px;
      /*! background: #f9fafa; */
      border-radius: 12px;
    }

   .h-d-wrp .upload-card h3 {
      font-size: 20px;
      color: #0d4358;
      margin-bottom: 6px;
    }

   .h-d-wrp .upload-card p {
      color: #657f89;
      margin-bottom: 20px;
    }

    /* Drag & Drop Zone */
  .h-d-wrp  .drop-zone {
      background-color: #f7fbfc;
      border: 2px dashed #15999b85;
      border-radius: 12px;
      padding: 40px 20px;
      text-align: center;
      cursor: pointer;
      margin-top: 20px;
      transition: 0.3s ease;
    }

   .h-d-wrp .drop-zone:hover {
      background-color: #ffffff;
      border-color: #079ca1;
    }

   .h-d-wrp .drop-zone p {
      font-size: 16px;
      color: #657f89;
    }

    /* Image Preview Section */
   .h-d-wrp  #image-preview {
      margin-top: 20px;
      display: flex;
      flex-wrap: wrap;
      gap: 15px;
    }

   .h-d-wrp #image-preview img {
      max-width: 100px;
      max-height: 100px;
      border-radius: 8px;
      object-fit: cover;
    }

    /* File Input (Hidden) */
   .h-d-wrp #fileInput {
      display: none;
    }

    /* Mobile-Friendly */
    @media (max-width: 640px) {
     .h-d-wrp .upload-card {
        padding: 15px;
      }

     .h-d-wrp .drop-zone {
        padding: 11px 13px 13px;
      }
    }

    .h-d-wrp .upload-section {
  display: block;}


  .h-d-wrp #fileInput {
  display: block;
}


.category-selection{ margin-bottom:30px; }




 .upload-section {
      max-width: 800px;
      margin: 0 auto;
      padding: 40px 20px;
      background: #fff;
      border-radius: 20px;
      box-shadow: 0 10px 30px rgba(18, 56, 74, 0.08);
    }

    .upload-card {
      text-align: center;
      padding: 30px;
      background: #f9fafa;
      border-radius: 12px;
    }

    .upload-card h3 {
      font-size: 22px;
      color: #0d4358;
      margin-bottom: 15px;
    }

    .upload-card p {
      color: #657f89;
      margin-bottom: 20px;
    }

    /* Camera Button */
    .camera-btn {
      background-color: #079ca1;
      color: white;
      padding: 15px 25px;
      font-size: 18px;
      border: none;
      border-radius: 8px;
      cursor: pointer;
      transition: 0.3s ease;
    }

    .camera-btn:hover {
      background-color: #12a89d;
    }

    /* File Input (Hidden) */
    #cameraInput {
      display: none;
    }

    /* Preview Area */
    #image-preview {
      margin-top: 20px;
      text-align: center;
    }

    #image-preview img {
      max-width: 100px;
      max-height: 100px;
      border-radius: 8px;
      object-fit: cover;
    }





    .lb-b{ width:100% }


    .lb-b label {
  font-size: 16px;
  color: #0d4358;
  margin-bottom: 8px;
  width: 100%;
}







.kid-submit{ margin-top:5px; }




    .pickup-section {
		    padding-right: 30px !important;
      max-width: 100%;
      margin: 0 auto;
      padding: 0;
      background: transparent;
      border-radius: 20px;
      box-shadow: 0 10px 30px rgba(18, 56, 74, 0.08);
    }

    .pickup-card {
      padding: 30px;
      background: #f9fafa;
      border-radius: 12px;
      background: #fff;
      border-radius: 8px;
      padding: 20px;
      width: 100%;
      max-width: 100%;
      margin-top: 0;
      /*! box-shadow: 0 6px 20px rgba(18, 56, 74, 0.06); */
      transition: all 0.3s ease;
      border: 1px solid #d7e0e3;
    }

    .pickup-card h3 {
      font-size: 21px;
      color: #0d4358;
      margin-bottom: 3px;
    }

    .pickup-card p {
      color: #657f89;
      margin-bottom: 20px;
      font-size: 20px;
    }

    /* Input fields */
    .input-field {
      width: 100%;
      padding: 12px 20px;
      font-size: 17px;
      border-radius: 10px;
      border: 1px solid #e1eeeb;
      margin-bottom: 20px;
      background-color: #f9fafa;
      color: #4a4f51;
      border: 1.5px solid #c8c8c8;
      background: #fff;
    }

    .input-field:focus {
      border-color: #079ca1;
      outline: none;
    }

    /* Date & Time Slot Picker */
    .picker-container {
      display: flex;
      justify-content: space-between;
      gap: 20px;
      margin-bottom: 0;
    }

    .time-slot {
      width: 100%;
      padding: 12px 20px;
      border-radius: 7px;
      border: 1px solid #e1eeeb;
      font-size: 17px;
      background-color: #f9fafa;
      color: #657f89;
      height: 53px;
      border: 1.5px solid #c8c8c8;
      background: #fff;
    }

    /* Contact Number */
    .contact-number {
      width: 100%;
      padding: 12px 20px;
      border-radius: 10px;
      border: 1px solid #e1eeeb;
      font-size: 16px;
      margin-bottom: 20px;
      background-color: #f9fafa;
      color: #657f89;
      border: 1.5px solid #c8c8c8;
      background: #fff;
    }

    .contact-number:focus {
      border-color: #079ca1;
      outline: none;
    }

    /* Confirm Button */
    .btn {
      padding: 15px 30px;
      font-size: 18px;
      background-color: #079ca1;
      color: white;
      border: none;
      border-radius: 10px;
      cursor: pointer;
      transition: background-color 0.3s ease;
    }

    .btn:hover {
      background-color: #12a89d;
    }

    /* Mobile-Friendly */
    @media (max-width: 640px) {
      .picker-container {
        flex-direction: column;
      }

      .time-slot {
        width: 100%;
        margin-bottom: 20px;
      }
    }









    /* Modal Overlay */
    .k-d-w-pop-overlay {
      position: fixed;
      top: 0;
      left: 0;
      right: 0;
      bottom: 0;
      background-color: rgba(0, 0, 0, 0.5);
      display: none;
      justify-content: center;
      align-items: center;
      z-index: 999;
      opacity: 0;
      transition: opacity 0.3s ease;
    }

    /* Confirmation Modal */
    .k-d-w-pop {
      background: #fff;
      padding: 30px;
      border-radius: 20px;
      max-width: 900px;
      width: 100%;
      text-align: center;
      box-shadow: 0 10px 30px rgba(18, 56, 74, 0.08);
      animation: fadeIn 0.3s ease-out;
    }

    /* Fade In Animation */
    @keyframes fadeIn {
      0% {
        opacity: 0;
        transform: translateY(-50px);
      }
      100% {
        opacity: 1;
        transform: translateY(0);
      }
    }

    /* Close Button */
    .close-btn {
      background: transparent;
      border: none;
      font-size: 24px;
      color: #079ca1;
      cursor: pointer;
      margin-top: 20px;
      transition: color 0.3s;
    }

    .close-btn:hover {
      color: #12a89d;
    }

    /* Donation Reference */
    .donation-reference {
      font-weight: 500;
      color: #079ca1;
      font-size: 18px;
      margin-bottom: 15px;
    }

    /* Summary Items */
    .summary-item {
      margin-bottom: 15px;
      font-size: 16px;
    }

    .summary-item span {
      font-weight: 500;
    }

    /* Uploaded Images */
    .uploaded-images {
      margin-top: 20px;
      display: flex;
      justify-content: center;
      gap: 10px;
    }

    .uploaded-images img {
      max-width: 100px;
      max-height: 100px;
      border-radius: 8px;
      object-fit: cover;
    }

    /* Button Styling */
    .btn {
      padding: 15px 30px;
      font-size: 18px;
      background-color: #079ca1;
      color: white;
      border: none;
      border-radius: 10px;
      cursor: pointer;
      transition: background-color 0.3s ease;
      margin-top: 20px;
    }

    .btn:hover {
      background-color: #12a89d;
    }

    /* Submit Button */
    .submit-btn {
      padding: 15px 30px;
      font-size: 18px;
      background-color: #079ca1;
      color: white;
      border: none;
      border-radius: 7px;
      cursor: pointer;
      transition: background-color 0.3s ease;
      display: flex;
      align-items: center;
      justify-content: center;
      background: linear-gradient(90deg, rgb(21, 153, 155), rgb(20, 111, 135));
      color: rgb(255, 255, 255);
      box-shadow: rgba(13, 111, 104, 0.24) 0px 16px 36px;
    }

    .submit-btn:hover {
      background-color: #12a89d;
    }

    .submit-btn i {
      margin-left: 10px;
    }














    .donation-options {
      display: grid;
      gap: 20px;
      grid-template-columns: repeat(3, 2fr);
    }

    .donation-option {
      background-color: white;
      border-radius: 15px;
      padding: 17px 30px;
      width: 100%;
      text-align: center;
      box-shadow: none;
      cursor: pointer;
      position: relative;
      transition: all 0.3s ease;
      border: solid #e0e0e0 2px;
    }

    .donation-option:hover {
      transform: translateY(-5px);
    }

    .donation-option.selected {
      background-color: #fff;
      color: white;
      border: solid 2px #15999b;
    }

    .donation-option i {
      font-size: 16px;
      color: #079ca1;
      margin-bottom: 0;
      width: 18px;
      height: 12px;
      padding: 0;
    }

    .donation-option.selected i {
      color: white;
    }

    .donation-option .checkmark {
      position: absolute;
      top: 10px;
      right: 10px;
      background-color: #079ca1;
      border-radius: 50%;
      padding: 3px;
      font-size: 18px;
      color: white;
      display: none;
    }

    .donation-option.selected .checkmark {
      display: block;
    }

    .donation-option p {
      font-weight: 500;
      color: #114c5c;
      margin-bottom: 0;
    }

    .donation-option .description {
      font-size: 14px;
      color: #555;
    }



.h-d-wrp h3{ font-size:22px; margin-bottom:15px; }
.h-d-wrp{ margin-bottom:30px; }

.sdm-s{ margin-bottom:15px; background-color: #e5f6fa70;display: inline-block;width: 80px;height: 80px;border-radius: 50%;border: dashed 1px #16808bc4;padding: 14px;}





















 .quk-dnt .left-panel,
    .quk-dnt .right-panel {
      background: #ffffff;
      border-radius: 28px;
      padding: 40px;
      box-shadow: 0 10px 30px rgba(0,0,0,0.06);
    }

   .quk-dnt .logo {
      display: flex;
      align-items: center;
      gap: 12px;
      margin-bottom: 45px;
    }

   .quk-dnt .logo-box {
      width: 50px;
      height: 50px;
      border-radius: 10px;
      background: linear-gradient(135deg, #0d5b72, #d5a84d);
    }

   .quk-dnt .logo h4 {
      font-size: 14px;
      font-weight: 500;
      line-height: 1.4;
    }

  .quk-dnt  .hero-title {
      font-size: 68px;
      line-height: 1;
      font-weight: 500;
      color: #083344;
      margin-bottom: 20px;
    }

  .quk-dnt  .hero-subtitle {
      font-size: 24px;
      color: #64748b;
      margin-bottom: 28px;
    }

   .quk-dnt .tagline {
      display: inline-flex;
      align-items: center;
      gap: 10px;
      padding: 16px 22px;
      border-radius: 18px;
      background: #f8fafc;
      color: #334155;
      margin-bottom: 35px;
      font-size: 15px;
    }

   .quk-dnt .hero-image {
      width: 100%;
      height: 350px;
      border-radius: 24px;
      background: url('https://images.unsplash.com/photo-1488521787991-ed7bbaae773c?q=80&w=1400&auto=format&fit=crop') center/cover;
      margin-bottom: 28px;
    }

    .quk-dnt .stats-box {
      background: linear-gradient(135deg, #169bac5e, #0a4d5bab);
      /*! border-radius: 17px; */
      padding: 30px;
      display: grid;
      grid-template-columns: repeat(3, 1fr);
      gap: 20px;
      margin-bottom: 28px;
      color: white;
    }

    .quk-dnt .stat {
      text-align: center;
      border-right: 1px solid rgba(255,255,255,0.2);
    }

    .quk-dnt .stat:last-child {
      border-right: none;
    }

    .quk-dnt .stat h2 {
      font-size: 31px;
      margin-bottom: 0px;
      color: #fff;
    }

    .quk-dnt .stat p {
      font-size: 15px;
      opacity: 0.85;
      margin-bottom: 0;
    }

    .quk-dnt .support-box {
      padding: 26px;
      border-radius: 22px;
      background: #f8fafc;
      display: flex;
      align-items: center;
      gap: 18px;
    }

    .quk-dnt .support-icon {
      width: 58px;
      height: 58px;
      border-radius: 16px;
      background: white;
      display: flex;
      align-items: center;
      justify-content: center;
      font-size: 24px;
      box-shadow: 0 5px 15px rgba(0,0,0,0.05);
    }

    .quk-dnt .support-box h4 {
      font-size: 22px;
      margin-bottom: 6px;
      color: #0f172a;
    }

    .quk-dnt .support-box p {
      color: #64748b;
      line-height: 1.6;
    }

    .quk-dnt .top-right {
      display: flex;
      justify-content: flex-end;
      gap: 30px;
      margin-bottom: 30px;
      color: #334155;
      font-size: 14px;
    }

    .quk-dnt .quick-title {
      font-size: 30px;
      font-weight: 500;
      margin-bottom: 8px;
      color: #083344;
    }

   .quk-dnt .section-title {
      font-size: 20px;
      font-weight: 500;
      margin-bottom: 18px;
      color: #114c5c;
      margin-top: 15px;
    }

  .quk-dnt  .amount-grid,
   .quk-dnt .category-grid,
   .quk-dnt .payment-grid {
      display: grid;
      gap: 16px;
      margin-bottom: 15px;
    }

   .quk-dnt .amount-grid {
      grid-template-columns: repeat(5, 1fr);
    }

   .quk-dnt .category-grid {
      grid-template-columns: repeat(3, 1fr);
    }

   .quk-dnt .payment-grid {
      grid-template-columns: repeat(6, 1fr);
    }

   .quk-dnt .card-option {
      border: 2px solid #e2e8f0;
      border-radius: 10px;
      padding: 14px 11px;
      text-align: left;
      font-weight: 500;
      transition: 0.3s ease;
      cursor: pointer;
      background: white;
      position: relative;
      overflow: hidden;
      display: flex;
      gap: 10px;
      align-items: anchor-center;
      align-items: center;
    }

   .quk-dnt .amount-card {
      display: flex;
      flex-direction: column;
      align-items: center;
      justify-content: center;
      min-height: auto;
    }

   .quk-dnt .amount-card span {
      font-size: 14px;
      font-weight: 500;
      opacity: 0.7;
      margin-bottom: -5px;
      letter-spacing: 1px;
    }

   .quk-dnt .amount-card strong {
      font-size: 20px;
      font-weight: 500;
    }

   .quk-dnt .amount-card.active::after {
      content: '';
      position: absolute;
      top: 10px;
      right: 10px;
      width: 24px;
      height: 24px;
      background: white;
      color: #114c5c;
      border-radius: 50%;
      display: flex;
      align-items: center;
      justify-content: center;
      font-size: 14px;
      font-weight: 500;
      background-image: url(../images/img/tick-s.svg);
  background-size: cover;
  background-repeat: no-repeat;
  width: 18px;
  height: 18px;
    }

    .quk-dnt .payment-card {
      display: flex;
      align-items: center;
      justify-content: center;
      flex-direction: column;
      gap: 8px;
      min-height: 95px;
    }

   .quk-dnt .payment-card .payment-logo {
      font-size: 28px;
      font-weight: 500;
    }

   .quk-dnt .payment-card small {
      font-size: 12px;
      color: #64748b;
      margin-top: 0;
    }

   .quk-dnt .card-option:hover {
      transform: translateY(-3px);
      border-color: #15999b;
    }

    .card-option.active {
      background: #15999b;
      color: white;
      border-color: #15999b;
    }

  .quk-dnt  .card-option small {
      display: block;
      font-size: 13px;
      margin-top: 2px;
      opacity: 0.75;
      font-weight: 500;
    }

  .quk-dnt  .custom-input {
      width: 100%;
      border: 1px solid #ccc;
      border-radius: 10px;
      padding: 13px 20px;
      font-size: 17px;
      outline: none;
      margin-bottom: 18px;
      background-color: #fff;
    }

  .quk-dnt  .select-box {
      width: 100%;
      border: 1px solid #15999b3b;
      border-radius: 10px;
      padding: 13px 20px;
      font-size: 17px;
      outline: none;
      margin-bottom: 18px;
      background-color: #15999b12;
    }

   .quk-dnt .secure-note {
      display: flex;
      align-items: center;
      gap: 12px;
      background: #15999b17;
      border-radius: 9px;
      padding: 18px;
      margin-top: 15px;
      margin-bottom: 20px;
      color: #475569;
      font-size: 15px;
    }

   .quk-dnt .donate-btn {
      width: 100%;
      background: linear-gradient(135deg, #0d6679, #17a0b1);
      color: white;
      border: none;
      border-radius: 11px;
      padding: 22px;
      font-size: 22px;
      font-weight: 500;
      cursor: pointer;
      transition: 0.3s ease;
    }

   .quk-dnt .donate-btn:hover {
      transform: translateY(-2px);
      opacity: 0.95;
    }

    .quk-dnt.footer-features {
      max-width: 1450px;
      margin: 25px auto 0;
      display: grid;
      grid-template-columns: repeat(4, 1fr);
      gap: 18px;
    }

   .quk-dnt .feature-card {
      background: white;
      border-radius: 20px;
      padding: 24px;
      display: flex;
      gap: 16px;
      align-items: flex-start;
      box-shadow: 0 8px 20px rgba(0,0,0,0.04);
    }

   .quk-dnt .feature-card h5 {
      font-size: 18px;
      margin-bottom: 6px;
    }

   .quk-dnt .feature-card p {
      font-size: 14px;
      color: #64748b;
      line-height: 1.5;
    }
    .quk-stlbn{ display:flex; gap:20px }

     .quk-dnt .dwn-w h4{ color:#fff }


    .quk-dnt  .pay-otn .card-option.active {

  background: #fff;
  color: white;
  border-color: #15999b;
}
.quk-dnt .pay-otn  .card-option small {
  display: block;
  font-size: 13px;
  margin-top: -2px;
  opacity: 10;
  font-weight: 500;
  text-align: center;
  line-height: 14px;
}

.quk-dnt .pay-otn  .payment-card {
  gap: 8px;
  min-height: 80px;}

.quk-dnt .pay-otn .card-option {
  border: 2px solid #e2e8f0;
  border-radius: 10px;
  padding: 0px 14px;}

.quk-dnt .pay-otn .payment-card .payment-logo {
  font-size: 28px;
  font-weight: 500;
  width: 50px;
}



  .quk-dnt .apply-info__left::before {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(135deg, rgba(4, 56, 74, 0.52), rgba(22, 156, 173, 0.39));
  z-index: 0;
}


 .quk-dnt .apply-info__hero h1 {
  margin-bottom: 0;

}

.apply-info__left {

  background: linear-gradient(135deg, rgba(7, 84, 103, 0.01), rgba(23, 164, 181, 0)), url("../images/img/ssa.jpg"); background-size: cover;
}

    @media(max-width: 1200px) {
     .quk-dnt .container {
        grid-template-columns: 1fr;
      }

    .quk-dnt  .hero-title {
        font-size: 52px;
      }
    }

    @media(max-width: 768px) {
    
    .quk-dnt  .left-panel,
    .quk-dnt  .right-panel {
        padding: 24px;
      }

     .quk-dnt .hero-title {
        font-size: 42px;
      }

     .quk-dnt .amount-grid,
     .quk-dnt .category-grid,
     .quk-dnt .payment-grid,
     .quk-dnt .footer-features,
     .quk-dnt .stats-box {
	border-radius: 15px;
	padding: 20px 0;
	margin-bottom: 0px;
      }

     .quk-dnt .stat {
        border-right: none;
        border-bottom: 1px solid rgba(255,255,255,0.2);
        padding-bottom: 0;
      }

     .quk-dnt .stat:last-child {
        border-bottom: none;
      }

     .quk-dnt .top-right {
        justify-content: flex-start;
        flex-wrap: wrap;
      }
    }





















.pay-afrer-wrap { max-width:100%px; margin:auto; padding:50px 0; display:flex; flex-wrap:wrap; gap:20px; background: linear-gradient(0deg,rgb(255, 255, 255) 0%, rgba(159, 206, 207, 0.2) 50%, rgb(255, 255, 255) 100%);}

  /* Left Column */
  .success-left { flex:2; background:#fff; border-radius:12px; padding:30px; box-shadow:0 4px 15px rgba(0,0,0,0.05); border: solid 1px #f1f1f1;}
  .success-left h1 { font-size:2rem; margin-bottom:5px; }
  .success-left p { font-size:1rem; margin-bottom:15px; color:#5b6770; }
  .success-left .icon-circle { width:65px; height:65px; background:#15999b; border-radius:50%; display:flex; align-items:center; justify-content:center; font-size:2rem; color:#fff; margin:auto; }
  
  .amount-row { display:flex; gap:15px; flex-wrap:wrap; margin:20px 0; }
  .amount-box { flex:1; background:#edfbfc; border-radius:9px; padding:15px; text-align:center; min-width:120px; }
  .amount-box h3 { margin:0; font-size:0.95rem; color:#5b6770; }
  .amount-box p { margin:5px 0 0; font-weight: 500; font-size:1.1rem; }

  .transaction-row { display:flex; gap:10px; flex-wrap:wrap; margin-bottom:20px; }
  .transaction-box { flex:1; background:#f9fafb; border-radius:10px; padding:12px; font-size:0.95rem; text-align:center; min-width:120px; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:5px; background: #edfbfc;}
  .transaction-box svg { width:20px; height:20px; color:#0f9464; }
  .transaction-box strong { font-weight: 500; color:#0f172a; }

  .message-box { background:#e6f0ee; padding:15px; border-radius:8px; margin-bottom:20px; font-size:1rem; display:flex; align-items:center; gap:10px; }

  .action-buttons { display:flex; gap:10px; flex-wrap:wrap; margin-bottsssom:20px; }
  .action-buttons button { flex:1; padding:18px 15px; border:none; border-radius:8px; cursor:pointer; font-size:1rem; font-weight: 500;}
  .action-buttons .primary { background:#0f9464; color:white; background: linear-gradient(90deg, rgb(21, 153, 155), rgb(20, 111, 135));color: rgb(255, 255, 255);box-shadow: rgba(13, 111, 104, 0.24) 0px 16px 36px;}
  .action-buttons .secondary { background:#fff; border:1px solid #15999b; color:#0f172a; }

  .secure-box { display:flex; align-items:center; gap:10px; background:#f0f6f5; padding:12px; border-radius:8px; font-size:0.95rem; }

  /* Right Column */
  .success-right { flex:1; display:flex; flex-direction:column; gap:20px; }
  .option-box { background:#fff; border-radius:12px; padding:20px; box-shadow:0 4px 10px rgba(0,0,0,0.05); }
  .option-box h3 { margin-bottom:10px; font-size:1.2rem; }
  .option-buttons { display:flex; gap:10px; margin-top:10px; }
  .option-buttons button { flex:1; padding:12px; border-radius:8px; border:1px solid #c7c8c8; background:#fff; cursor:pointer; font-size:1rem; display:flex; flex-direction:column; align-items:center; gap:5px; padding: 20px 15px;}
  .option-buttons button.active { background:#fff; color:#114c5c; border:none; border: solid 2px #15999b;}

  .impact-box { background:#fff; border-radius:12px; padding:20px; box-shadow:0 4px 10px rgba(0,0,0,0.05); }
  .impact-stats { display:flex; gap:10px; flex-wrap:wrap; margin-bottom:10px; }
  .impact-stat { flex:1; text-align:center; min-width:80px; padding: 15px 8px;border: solid 1px #d4e6e6;border-radius: 10px;}
  .impact-stat h4 { margin:0; font-size:1.2rem; }
  .impact-stat p { margin:4px 0 0; font-size:0.9rem; color:#5b6770; line-height: 17px;}
  .impact-quote { font-size:0.85rem; color:#5b6770; background:#f0f6f5; padding:10px; border-radius:8px; }

.pay-afrer-wrap  .icon-circle img{ width:33px; }
.pay-afrer-wrap  .icon-circle{ margin-bottom:10px }


.pay-afrer-wrap .contnu-wrap{
  margin-top: 10px;
  padding: 17px 15px;
  border-radius: 8px;
  border: none;
  background: #0f9464;
  color: white;
  width: 100%;
  background: linear-gradient(90deg, rgb(21, 153, 155), rgb(20, 111, 135));
  margin-top:15px;
}

.impact-box h3{   margin-bottom: 10px;font-size: 1.2rem;}

  .action-buttons {
  display: flex;
  gap: 10px;
  flex-wrap: wrap;
  margin-bottom: 20px;
  flex-direction: initial;
}


  /* Responsive */
  @media(max-width:900px){ .pay-afrer-wrap{ flex-direction:column; } .success-left,.success-right{ width:100%; } }
.ic-b-1{
  width: 75px;
  height: 75px;
  border-radius: 50px;
  background-color: #15999b21;
  padding: 12px;
  margin-bottom: 15px;
}

.impact-stat img{ width:49px; margin-bottom:8px; background-color: #15999b1c;padding: 9px;border-radius: 50%;}

.card-option{   } 
.crd-imgs-op{ width:47px; background: #ecf7f7;border-radius: 50%;padding: 9px;border: dashed 1px #11b2b5;}
.card-option.active .crd-imgs-op img{ /*! filter: brightness(0) invert(1); */ }


 .donation-summary { display:flex; flex-direction:column; gap:15px; margin-bottom:20px; }
  .summary-row { display:flex; justify-content:space-between; background:#0e5b6a; padding:18px 15px; border-radius:8px; font-size:0.95rem; }
  .summary-row strong { color:#0f172a; }

  .uploaded-images { display:flex; gap:10px; flex-wrap:wrap; margin-top:16px; justify-content: flex-start;}
  .uploaded-images img { width:80px; height:80px; object-fit:cover; border-radius:8px; border:1px solid #ddd; }

  .summary-row span{ font-size:17px; color: #363636;}









  .zakat-demo-wrap {
      text-align: center;
    }

    .zakat-open-btn {
      background: linear-gradient(135deg, #6b4d2f, #8c6a45);
      color: #fff;
      border: none;
      padding: 16px 28px;
      border-radius: 14px;
      font-size: 16px;
      font-weight: 500;
      cursor: pointer;
      box-shadow: 0 10px 25px rgba(107, 77, 47, 0.18);
      transition: 0.3s ease;
    }

    .zakat-open-btn:hover {
      transform: translateY(-2px);
      box-shadow: 0 16px 35px rgba(107, 77, 47, 0.22);
    }

    .zakat-popup-overlay {
      position: fixed;
      inset: 0;
      background: rgba(19, 17, 14, 0.55);
      backdrop-filter: blur(6px);
      display: flex;
      align-items: center;
      justify-content: center;
      padding: 20px;
      opacity: 0;
      visibility: hidden;
      transition: 0.3s ease;
      z-index: 999;
    }

    .zakat-popup-overlay.active {
      opacity: 1;
      visibility: visible;
    }

    .zakat-popup-card {
      width: 100%;
      max-width: 560px;
      background: #ffffff;
      border-radius: 20px;
      overflow: hidden;
      box-shadow: 0 30px 60px rgba(0, 0, 0, 0.18);
      transform: translateY(20px) scale(0.96);
      transition: 0.3s ease;
      position: relative;
    }

    .zakat-popup-overlay.active .zakat-popup-card {
      transform: translateY(0) scale(1);
    }

    .zakat-popup-head {
      background: linear-gradient(135deg, #0e5666, #17999f);
      color: #fff;
      padding: 32px 28px 26px;
      text-align: center;
      position: relative;
    }

    .zakat-close-btn {
      position: absolute;
      top: 16px;
      right: 16px;
      width: 40px;
      height: 40px;
      border: none;
      border-radius: 50%;
      background: rgba(255,255,255,0.16);
      color: #fff;
      font-size: 22px;
      cursor: pointer;
      transition: 0.25s ease;
    }

    .zakat-close-btn:hover {
      background: rgba(255,255,255,0.24);
      transform: rotate(90deg);
    }

    .zakat-icon-box {
      width: 74px;
      height: 74px;
      margin: 0 auto 16px;
      border-radius: 20px;
      background: rgba(255,255,255,0.16);
      display: flex;
      align-items: center;
      justify-content: center;
    }

    .zakat-icon-box svg {
      width: 38px;
      height: 38px;
      stroke: #fff;
    }

    .zakat-popup-head h2 {
      font-size: 28px;
      font-weight: 500;
      line-height: 1.2;
      margin-bottom: 2px;
      color: #fff;
    }

    .zakat-popup-head p {
      font-size: 13px;
      line-height: 1.4;
      color: rgba(255,255,255,0.88);
      max-width: 420px;
      margin: 0 auto;
    }

    .zakat-popup-body {
      padding: 30px 28px 28px;
    }

    .zakat-field {
      margin-bottom: 18px;
    }

    .zakat-field label {
      display: block;
      margin-bottom: 10px;
      font-size: 15px;
      font-weight: 500;
      color: #362c23;
    }

    .zakat-input-wrap {
      position: relative;
    }

    .zakat-currency {
      position: absolute;
      left: 16px;
      top: 50%;
      transform: translateY(-50%);
      font-size: 14px;
      font-weight: 500;
      color: #0f616f;
      pointer-events: none;
    }

    .zakat-input,
    .zakat-result-box {
      width: 100%;
      min-height: 58px;
      border-radius: 11px;
      border: 1px solid #70707052;
      background: #fff;
      padding: 0 18px 0 56px;
      font-size: 16px;
      color: #000;
      outline: none;
      transition: 0.25s ease;
    }

    .zakat-input:focus {
      border-color: #8c6a45;
      background: #fff;
      box-shadow: 0 0 0 4px rgba(140, 106, 69, 0.10);
    }

    .zakat-result-box {
      display: flex;
      align-items: center;
      font-weight: 500;
      color: #6b4d2f;
      background: #fff;
    }

    .zakat-actions {
      display: flex;
      gap: 12px;
      margin-top: 24px;
      flex-wrap: wrap;
    }

    .zakat-calc-btn,
    .zakat-reset-btn {
      flex: 1;
      min-width: 140px;
      border: none;
      min-height: 56px;
      border-radius: 10px;
      font-size: 15px;
      font-weight: 500;
      cursor: pointer;
      transition: 0.3s ease;
    }

    .zakat-calc-btn {
      background: linear-gradient(135deg, #6b4d2f, #8f6a45);
      color: #fff;
      box-shadow: 0 12px 24px rgba(107, 77, 47, 0.18);
      transition: 0.3s;
      background: linear-gradient(135deg, #0d5262, #19a4a9);
      color: #fff;
      border-color: transparent;
      box-shadow: 0 12px 24px rgba(21,154,163,.18);
    }

    .zakat-calc-btn:hover {
      transform: translateY(-2px);
    }

    .zakat-reset-btn {
      background: #fff;
      color: #0e5c6b;
      border: 1px solid #169299;
    }

    .zakat-reset-btn:hover {
      background: #efe6dd;
    }

    .zakat-note {
      margin-top: 18px;
      background: #fcf8f3;
      border: 1px solid #eee3d7;
      padding: 14px 16px;
      border-radius: 14px;
      font-size: 13px;
      line-height: 1.7;
      color: #6b5b4c;
    }

    @media (max-width: 640px) {
      .zakat-popup-head {
        padding: 28px 20px 24px;
      }

      .zakat-popup-body {
        padding: 24px 20px 22px;
      }

      .zakat-popup-head h2 {
        font-size: 26px;
      }

      .zakat-actions {
        flex-direction: column;
      }

      .zakat-calc-btn,
      .zakat-reset-btn {
        width: 100%;
      }
    }






   .donation-summary .summary-row {
  background: #15969a14;

}





.pickup-location-wrap {
  width: 100%;
margin-bottom: 20px;
  
}

.pickup-label {
  display: block;
  font-size: 15px;
  font-weight: 500;
  margin-bottom: 8px;
  color: #263544;
  font-size: 16px;
  color: #0d4358;
  margin-bottom: 8px;
  width: 100%;
}

.pickup-label span {
  color: #e3342f;
}

.pickup-input {
  height: 54px;
  border: 2px solid #0f8b8d;
  border-radius: 8px;
  background: #fff;
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 0 15px;
}

.pickup-input input {
  flex: 1;
  border: 0;
  outline: 0;
  font-size: 14px;
}

.pickup-help {
  font-size: 13px;
  color: #64748b;
  margin: 8px 0 13px;
}

.pickup-card {
  background: #fff;
  border: 1px solid #dfe6ec;
  border-radius: 8px;
  overflow: hidden;
}

.pickup-map-area {
  height: 300px;
  position: relative;
}

#pickupMap {
  width: 100%;
  height: 100%;
}

#pickupMapSearch {
  position: absolute;
  top: 16px;
  left: 16px;
  width: 260px;
  height: 44px;
  z-index: 9;
  border: 0;
  outline: 0;
  border-radius: 7px;
  padding: 0 14px;
  font-size: 13px;
  box-shadow: 0 4px 15px rgba(0,0,0,0.18);
}

.pickup-selected {
  display: flex;
  align-items: flex-start;
  gap: 14px;
  padding: 18px;
  border-top: 1px solid #e5e7eb;
}

.pickup-pin {
  width: 34px;
  height: 34px;
  border: 2px solid #0f8b8d;
  color: #0f8b8d;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}

.pickup-text {
  flex: 1;
}

.pickup-text h4 {
  margin: 0 0 6px;
  font-size: 15px;
  color: #263544;
}

.pickup-text p {
  margin: 0;
  font-size: 13px;
  color: #64748b;
  line-height: 1.4;
}

#changePickupBtn {
  border: 0;
  background: transparent;
  color: #0f8b8d;
  font-size: 13px;
  font-weight: 500;
  text-decoration: underline;
  cursor: pointer;
  margin-top: 6px;
}

@media(max-width: 767px) {
  #pickupMapSearch {
    width: calc(100% - 32px);
  }

  .pickup-map-area {
    height: 340px;
  }

  .pickup-selected {
    flex-wrap: wrap;
  }

  #changePickupBtn {
    margin-left: 48px;
  }
}
















.bn-profile-wrap{
    margin-top:35px;
    display:flex;
    flex-direction:column;
    gap:30px;
}

.bn-profile-box{
    background:transparent;
    border:0;
    border-radius:0;
    padding:0;
    box-shadow:none;
}

.bn-profile-head{
    display:flex;
    justify-content:space-between;
    align-items:center;
    margin-bottom:30px;
}

.bn-profile-head h2{
    font-size:34px;
    font-weight: 500;
    color:#083344;
    margin-bottom:8px;
}

.bn-profile-head p{
    color:#64748b;
    font-size:16px;
}

/* PROFILE TOP */

.bn-profile-top{
    display:flex;
    align-items:center;
    gap:24px;
    background:linear-gradient(135deg,#f2fbfc,#f7fdff);
    border:1px solid #e2f2f5;
    border-radius:30px;
    padding:30px;
    margin-bottom:35px;
}

.bn-profile-avatar{
    width:120px;
    height:120px;
    border-radius:30px;
    background:linear-gradient(135deg,#14b8a6,#0f766e);
    display:flex;
    align-items:center;
    justify-content:center;
    color:#fff;
    font-size:52px;
    box-shadow:0 14px 30px rgba(20,184,166,.20);
}

.bn-profile-user h3{
    font-size:34px;
    color:#083344;
    margin-bottom:12px;
}

.bn-profile-tags{
    display:flex;
    flex-wrap:wrap;
    gap:12px;
}

.bn-profile-tag{
    padding:12px 20px;
    border-radius:50px;
    background:#ecfdf3;
    color:#15803d;
    font-weight: 500;
    font-size:14px;
}

/* SECTION */

.bn-profile-section{
    margin-bottom:35px;
}

.bn-profile-section:last-child{
    margin-bottom:0;
}

.bn-profile-title{
    display:flex;
    align-items:center;
    gap:12px;
    margin-bottom:30px;
}

.bn-profile-title-icon{
    width:40px;
    height:40px;
    border-radius:50%;
    background:linear-gradient(135deg,#15999b21,#15999b1c);
    display:flex;
    align-items:center;
    justify-content:center;
    color:#15999b;
    font-size:15px;
    border: dashed 1px;
}

.bn-profile-title h4{
    font-size:18px;
    color:#083344;
    font-weight: 500;
}

/* GRID */

.bn-profile-grid{
    display:grid;
    grid-template-columns:repeat(3,1fr);
    gap:19px;
}

.bn-profile-card{
    background:transparent;
    border:0;
    border-radius:24px;
    padding:0;
    transition:.3s;
}

.bn-profile-card:hover{
    transform:translateY(-3px);
    box-shadow:0 12px 30px rgba(20,184,166,.08);
}

.bn-profile-card span{
    display:block;
    color:#64748b;
    margin-bottom:10px;
    font-size:15px;
    margin-bottom: 10px;
    color: #114c5c;
    font-weight: 500;
}

.bn-profile-card h5{
    color:#083344;
    font-size:22px;
    font-weight: 500;
    line-height:1.5;
}


.bn-profile-card input, .bn-profile-card  select{
height: 56px;
  width: 100%;
  min-height: 56px;
  border: 1px solid #d7eaf0;
  border-radius: 8px;
  background: #fff;
  color: #505c61;
  font-size: 17px;
  font-weight: 500;
  padding: 0 16px 0 16px;
  outline: none;
  transition: 0.3s ease;
  font-family: inherit;
  padding: 12px;
}

/* RESPONSIVE */

@media(max-width:991px){

.bn-profile-grid{
    grid-template-columns:repeat(2,1fr);
}

}

@media(max-width:768px){

.bn-profile-box{
    padding:0;
}

.bn-profile-top{
    flex-direction:column;
    text-align:center;
}

.bn-profile-grid{
    grid-template-columns:1fr;
}

.bn-profile-head{
    flex-direction:column;
    align-items:flex-start;
    gap:10px;
}

.bn-profile-head h2{
    font-size:28px;
}

.bn-profile-user h3{
    font-size:28px;
}

.bn-profile-title h4{
    font-size:17px;
}

.bn-profile-card h5{
    font-size:20px;
}

}



















    .pickup-page-wrap {
      max-width: 1480px;
      margin: auto;
      background: #fff;
      border: 1px solid #e9eef2;
      border-radius: 18px;
      box-shadow: 0 8px 26px rgba(0, 0, 0, 0.05);
      overflow: hidden;
    }

    .pickup-header {
      padding: 28px 34px 22px;
      display: flex;
      align-items: center;
      justify-content: space-between;
      border-bottom: 1px solid #edf1f4;
      gap: 20px;
    }

    .pickup-logo {
      display: flex;
      align-items: center;
      gap: 12px;
      color: #113b7a;
      font-weight: 500;
      line-height: 1.3;
    }

    .pickup-logo .logo-icon {
      width: 46px;
      height: 46px;
      border: 2px dashed #113b7a;
      display: grid;
      place-items: center;
      font-size: 18px;
      border-radius: 4px;
    }

    .pickup-logo small {
      display: block;
      font-size: 13px;
      color: #113b7a;
      letter-spacing: .4px;
      margin-top: 4px;
    }

    /* Timeline */
    .pickup-timeline {
      display: flex;
      align-items: center;
      gap: 10px;
      min-width: 520px;
    }

    .timeline-item {
      display: flex;
      align-items: center;
      gap: 10px;
      color: #4c5f70;
      font-size: 16px;
      white-space: nowrap;
    }

    .timeline-number {
      width: 34px;
      height: 34px;
      border-radius: 50%;
      border: 1px solid #d7e0e8;
      display: grid;
      place-items: center;
      font-weight: 500;
      background: #fff;
      color: #142f43;
    }

    .timeline-item.active .timeline-number {
      background: #006f7c;
      color: #fff;
      border-color: #006f7c;
    }

    .timeline-item.active {
      color: #006f7c;
      font-weight: 500;
    }

    .timeline-line {
      width: 58px;
      height: 2px;
      background: #dce5eb;
    }

    .pickup-content {
      padding: 30px 34px;
    }

    .pickup-card {
      border: 1px solid #edf1f4;
      border-radius: 16px;
      padding: 28px;
      box-shadow: 0 4px 16px rgba(0, 0, 0, 0.03);
    }

    .pickup-layout {
      display: grid;
      grid-template-columns: minmax(0, 1fr) 420px;
      gap: 42px;
      align-items: flex-start;
    }

    .main-title {
      font-size: 31px;
      color: #0d3044;
      margin-bottom: 8px;
      font-weight: 500;
    }

    .subtitle {
      color: #6a7c8d;
      font-size: 16px;
      margin-bottom: 30px;
    }

    label {
      display: block;
      margin-bottom: 10px;
      color: #0d3044;
      font-weight: 500;
      font-size: 16px;
    }

    .required {
      color: #e14b4b;
    }

    .field {
      width: 100%;
      height: 54px;
      border: 1.5px solid #007b83;
      border-radius: 8px;
      display: flex;
      align-items: center;
      gap: 14px;
      padding: 0 16px;
      color: #6f7f8c;
      background: #fff;
    }

    .field i {
      color: #007b83;
      font-size: 18px;
    }

    .field input,
    .field select {
      border: none;
      outline: none;
      width: 100%;
      font-size: 15px;
      color: #4e6170;
      background: transparent;
    }

    .hint {
      color: #687b89;
      margin: 10px 0 18px;
      font-size: 14px;
    }

    .map-box {
      border: 1px solid #e2e7eb;
      border-radius: 10px;
      overflow: hidden;
      background: #f6f8fa;
      margin-bottom: 30px;
    }

    .map-area {
      height: 285px;
      position: relative;
     
      background-size: cover;
      background-position: center;
    }

    .map-area::before {
      content: "";
      position: absolute;
      inset: 0;
      background: rgba(242, 248, 250, 0.25);
    }

    .map-search {
      position: absolute;
      top: 18px;
      left: 18px;
      background: #fff;
      width: 250px;
      height: 48px;
      border-radius: 8px;
      display: flex;
      align-items: center;
      gap: 12px;
      padding: 0 16px;
      color: #667785;
      box-shadow: 0 6px 18px rgba(0,0,0,.08);
      z-index: 2;
      font-size: 14px;
    }

    .map-pin {
      position: absolute;
      left: 50%;
      top: 47%;
      transform: translate(-50%, -50%);
      width: 44px;
      height: 44px;
      background: #007b83;
      color: #fff;
      display: grid;
      place-items: center;
      border-radius: 50% 50% 50% 0;
      transform: translate(-50%, -50%) rotate(-45deg);
      z-index: 3;
      box-shadow: 0 7px 18px rgba(0, 123, 131, .35);
    }

    .map-pin i {
      transform: rotate(45deg);
      font-size: 20px;
    }

    .map-controls {
      position: absolute;
      right: 18px;
      top: 142px;
      z-index: 3;
      display: grid;
      gap: 8px;
    }

    .map-btn {
      width: 42px;
      height: 42px;
      border-radius: 8px;
      background: #fff;
      display: grid;
      place-items: center;
      box-shadow: 0 6px 16px rgba(0,0,0,.1);
      color: #16374a;
      font-size: 17px;
    }

    .map-footer {
      background: #fff;
      padding: 20px 26px;
      display: flex;
      gap: 16px;
      align-items: center;
      justify-content: space-between;
    }

    .map-footer-left {
      display: flex;
      gap: 16px;
      align-items: flex-start;
    }

    .map-footer i {
      font-size: 27px;
      color: #007b83;
      margin-top: 4px;
    }

    .map-footer h4 {
      color: #16374a;
      margin-bottom: 7px;
      font-size: 16px;
    }

    .map-footer p {
      color: #6c7c88;
      font-size: 14px;
    }

    .change-location {
      color: #006f7c;
      font-weight: 500;
      font-size: 14px;
      text-decoration: underline;
      white-space: nowrap;
      cursor: pointer;
    }

    .form-row {
      display: grid;
      grid-template-columns: repeat(3, 1fr);
      gap: 22px;
      margin-bottom: 36px;
    }

    .form-row .field {
      border-color: #dfe7ec;
    }

    .submit-btn {
      border: none;
      background: linear-gradient(135deg, #007b83, #005c66);
      color: #fff;
      height: 58px;
      padding: 0 34px;
      border-radius: 9px;
      font-size: 16px;
      font-weight: 500;
      display: inline-flex;
      align-items: center;
      gap: 14px;
      cursor: pointer;
      box-shadow: 0 10px 18px rgba(0, 111, 124, .2);
    }

    .submit-btn i {
      font-size: 19px;
    }

    .summary-card,
    .help-card {
      border: 1px solid #e9eef2;
      border-radius: 12px;
      overflow: hidden;
      background: #fff;
      box-shadow: 0 6px 18px rgba(0,0,0,.035);
    }

    .summary-head {
      background: linear-gradient(135deg, #006f7c, #005762);
      color: #fff;
      padding: 24px;
      display: flex;
      gap: 16px;
      align-items: center;
      font-size: 17px;
      font-weight: 500;
    }

    .summary-head i {
      font-size: 28px;
    }

    .summary-body {
      padding: 28px 25px;
    }

    .summary-item {
      display: grid;
      grid-template-columns: 34px 1fr;
      gap: 14px;
      margin-bottom: 31px;
    }

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

    .summary-item i {
      color: #007b83;
      font-size: 22px;
      margin-top: 3px;
    }

    .summary-item span {
      display: block;
      color: #18384d;
      font-size: 15px;
      margin-bottom: 8px;
    }

    .summary-item strong {
      color: #112e42;
      font-size: 15px;
      line-height: 1.45;
    }

    .help-card {
      margin-top: 30px;
      padding: 25px;
    }

    .help-title {
      display: flex;
      align-items: center;
      gap: 13px;
      color: #17364b;
      font-weight: 500;
      font-size: 17px;
      margin-bottom: 15px;
    }

    .help-title i {
      color: #007b83;
      font-size: 30px;
    }

    .help-card p {
      color: #6b7b88;
      font-size: 14px;
      margin-bottom: 28px;
    }

    .help-divider {
      height: 1px;
      background: #e9eef2;
      margin-bottom: 25px;
    }

    .contact-info {
      display: flex;
      gap: 14px;
      align-items: center;
      color: #16374a;
      font-size: 15px;
      line-height: 1.6;
    }

    .contact-info i {
      color: #007b83;
      font-size: 21px;
    }

    /* Mobile Timeline */
    .mobile-timeline {
      display: none;
      padding: 18px;
      background: #f9fcfd;
      border-bottom: 1px solid #edf1f4;
    }

    .mobile-timeline .timeline-step {
      display: grid;
      grid-template-columns: 34px 1fr;
      gap: 12px;
      position: relative;
      padding-bottom: 20px;
    }

    .mobile-timeline .timeline-step:last-child {
      padding-bottom: 0;
    }

    .mobile-timeline .timeline-step::after {
      content: "";
      position: absolute;
      left: 16px;
      top: 36px;
      width: 2px;
      height: calc(100% - 30px);
      background: #dce5eb;
    }

    .mobile-timeline .timeline-step:last-child::after {
      display: none;
    }

    .mobile-timeline .circle {
      width: 34px;
      height: 34px;
      border-radius: 50%;
      border: 1px solid #d7e0e8;
      display: grid;
      place-items: center;
      background: #fff;
      font-weight: 500;
      z-index: 2;
    }

    .mobile-timeline .timeline-step.active .circle {
      background: #006f7c;
      border-color: #006f7c;
      color: #fff;
    }

    .mobile-timeline h4 {
      font-size: 15px;
      color: #17364b;
      margin-bottom: 4px;
    }

    .mobile-timeline p {
      color: #687b89;
      font-size: 13px;
    }

    @media (max-width: 1180px) {
      .pickup-layout {
        grid-template-columns: 1fr;
      }

      .sidebar {
        display: grid;
        grid-template-columns: 1fr 1fr;
        gap: 24px;
      }

      .help-card {
        margin-top: 0;
      }
    }

    @media (max-width: 900px) {
      body {
        padding: 10px;
      }

      .pickup-header {
        padding: 22px;
      }

      .pickup-timeline {
        display: none;
      }

      .mobile-timeline {
        display: block;
      }

      .pickup-content {
        padding: 18px;
      }

      .pickup-card {
        padding: 20px;
      }

      .main-title {
        font-size: 24px;
      }

      .form-row {
        grid-template-columns: 1fr;
        gap: 18px;
      }

      .sidebar {
        grid-template-columns: 1fr;
      }

      .map-footer {
        align-items: flex-start;
        flex-direction: column;
      }

      .map-search {
        width: calc(100% - 36px);
      }
    }

    @media (max-width: 520px) {
      .pickup-logo {
        font-size: 13px;
      }

      .pickup-logo .logo-icon {
        width: 38px;
        height: 38px;
      }

      .pickup-header {
        padding: 18px 15px;
      }

      .pickup-content {
        padding: 14px;
      }

      .pickup-card {
        padding: 16px;
      }

      .main-title {
        font-size: 22px;
      }

      .subtitle {
        font-size: 14px;
      }

      .map-area {
        height: 250px;
      }

      .submit-btn {
        width: 100%;
        justify-content: center;
      }

      .summary-body,
      .help-card {
        padding: 22px 18px;
      }
    }
  






















  .k-wraps {
      max-width: 1480px;
      margin: auto;
      background: #fff;
      border: 1px solid #e9eef2;
      border-radius: 18px;
      box-shadow: 0 8px 26px rgba(0, 0, 0, 0.05);
      overflow: hidden;
    }

    .k-wraps .pickup-header {
      padding: 28px 34px 22px;
      display: flex;
      align-items: center;
      justify-content: space-between;
      border-bottom: 1px solid #edf1f4;
      gap: 20px;
    }

    .k-wraps .pickup-logo {
      display: flex;
      align-items: center;
      gap: 12px;
      color: #113b7a;
      font-weight: 500;
      line-height: 1.3;
    }

    .k-wraps .pickup-logo small {
      display: block;
      font-size: 13px;
      color: #113b7a;
      letter-spacing: 0.4px;
      margin-top: 4px;
    }

    .k-wraps .logo-icon {
      width: 46px;
      height: 46px;
      border: 2px dashed #113b7a;
      display: grid;
      place-items: center;
      font-size: 18px;
      border-radius: 4px;
    }

    .k-wraps .pickup-timeline {
      display: flex;
      align-items: center;
      gap: 10px;
      min-width: 520px;
    }

    .k-wraps .timeline-item {
      display: flex;
      align-items: center;
      gap: 10px;
      color: #4c5f70;
      font-size: 14px;
      white-space: nowrap;
      cursor: pointer;
      transition: 0.3s ease;
    }

    .k-wraps .timeline-number {
      width: 34px;
      height: 34px;
      border-radius: 50%;
      border: 1px solid #d7e0e8;
      display: grid;
      place-items: center;
      font-weight: 500;
      background: #fff;
      color: #142f43;
      transition: 0.3s ease;
    }

    .k-wraps .timeline-item.active {
      color: #006f7c;
      font-weight: 500;
    }

    .k-wraps .timeline-item.active .timeline-number {
      background: #006f7c;
      color: #fff;
      border-color: #006f7c;
    }

    .k-wraps .timeline-item.completed {
      color: #15999b;
      font-weight: 500;
    }

    .k-wraps .timeline-item.completed .timeline-number {
      background: #15999b;
      color: #fff;
      border-color: #15999b;
    }

    .k-wraps .timeline-line {
      width: 58px;
      height: 2px;
      background: #dce5eb;
      transition: 0.3s ease;
    }

    .k-wraps .timeline-line.completed {
      background: #15999b;
    }

    .k-wraps .mobile-timeline {
      display: none;
      padding: 18px;
      background: #f9fcfd;
      border-bottom: 1px solid #edf1f4;
    }

    .k-wraps .mobile-step {
      display: grid;
      grid-template-columns: 34px 1fr;
      gap: 12px;
      position: relative;
      padding-bottom: 20px;
      cursor: pointer;
    }

    .k-wraps .mobile-step:last-child {
      padding-bottom: 0;
    }

    .k-wraps .mobile-step::after {
      content: "";
      position: absolute;
      left: 16px;
      top: 36px;
      width: 2px;
      height: calc(100% - 30px);
      background: #dce5eb;
    }

    .k-wraps .mobile-step:last-child::after {
      display: none;
    }

    .k-wraps .mobile-step.completed::after {
      background: #0e8f78;
    }

    .k-wraps .mobile-circle {
      width: 34px;
      height: 34px;
      border-radius: 50%;
      border: 1px solid #d7e0e8;
      display: grid;
      place-items: center;
      background: #fff;
      font-weight: 500;
      z-index: 2;
      transition: 0.3s ease;
    }

    .k-wraps .mobile-step.active .mobile-circle {
      background: #006f7c;
      border-color: #006f7c;
      color: #fff;
    }

    .k-wraps .mobile-step.completed .mobile-circle {
      background: #0e8f78;
      border-color: #0e8f78;
      color: #fff;
    }

    .k-wraps .mobile-step h4 {
      font-size: 15px;
      color: #17364b;
      margin-bottom: 4px;
    }

    .k-wraps .mobile-step p {
      color: #687b89;
      font-size: 13px;
    }

    .k-wraps .pickup-content {
      padding: 30px 34px;
    }

    .k-wraps .pickup-card {
      border: 0;
      border-radius: 0;
      padding: 0;
      box-shadow: none;
    }

    .k-wraps .pickup-layout {
      display: grid;
      grid-template-columns: minmax(0, 1fr) 420px;
      gap: 42px;
      align-items: flex-start;
    }

    .k-wraps .main-title {
      font-size: 25px;
      color: #0d3044;
      margin-bottom: 0;
      font-weight: 500;
    }

    .k-wraps .subtitle {
      color: #6a7c8d;
      font-size: 15px;
      margin-bottom: 30px;
      text-transform: none;
      letter-spacing: 0;
    }

    .k-wraps label {
      display: block;
      margin-bottom: 10px;
      color: #0d3044;
      font-weight: 500;
      font-size: 16px;
    }

    .k-wraps .required {
      color: #e14b4b;
    }

    .k-wraps .field {
      width: 100%;
      height: 54px;
      border: 1.5px solid #dfe7ec;
      border-radius: 8px;
      display: flex;
      align-items: center;
      gap: 14px;
      padding: 0 16px;
      color: #6f7f8c;
      background: #fff;
    }

    .k-wraps .field.focus-field {
      border-color: #007b83;
    }

    .k-wraps .field i {
      color: #007b83;
      font-size: 18px;
      flex-shrink: 0;
    }

    .k-wraps .field input,
    .k-wraps .field select,
    .k-wraps .field textarea {
      border: none;
      outline: none;
      width: 100%;
      font-size: 15px;
      color: #4e6170;
      background: transparent;
    }

    .k-wraps .field textarea {
      resize: none;
      height: 75px;
      padding-top: 2px;
    }

    .k-wraps .textarea-field {
      height: 110px;
      align-items: flex-start;
      padding-top: 15px;
    }

    .k-wraps .hint {
      color: #687b89;
      margin: 10px 0 18px;
      font-size: 14px;
    }

    .k-wraps .form-row {
      display: grid;
      grid-template-columns: repeat(3, 1fr);
      gap: 22px;
      margin-bottom: 30px;
    }

    .k-wraps .form-row.two-col {
      grid-template-columns: repeat(2, 1fr);
    }

    .k-wraps .map-box {
      border: 1px solid #e2e7eb;
      border-radius: 10px;
      overflow: hidden;
      background: #f6f8fa;
      margin-bottom: 30px;
    }

    .k-wraps .map-area {
      height: 285px;
      position: relative;
     
      background-size: cover;
      background-position: center;
    }

    .k-wraps .map-area::before {
      content: "";
      position: absolute;
      inset: 0;
      background: rgba(242, 248, 250, 0.25);
    }

    .k-wraps .map-search {
      position: absolute;
      top: 18px;
      left: 18px;
      background: #fff;
      width: 250px;
      height: 48px;
      border-radius: 8px;
      display: flex;
      align-items: center;
      gap: 12px;
      padding: 0 16px;
      color: #667785;
      box-shadow: 0 6px 18px rgba(0,0,0,.08);
      z-index: 2;
      font-size: 14px;
    }

    .k-wraps .map-pin {
      position: absolute;
      left: 50%;
      top: 47%;
      width: 44px;
      height: 44px;
      background: #007b83;
      color: #fff;
      display: grid;
      place-items: center;
      border-radius: 50% 50% 50% 0;
      transform: translate(-50%, -50%) rotate(-45deg);
      z-index: 3;
      box-shadow: 0 7px 18px rgba(0, 123, 131, .35);
    }

    .k-wraps .map-pin i {
      transform: rotate(45deg);
      color: #fff;
      font-size: 20px;
    }

    .k-wraps .map-controls {
      position: absolute;
      right: 18px;
      top: 142px;
      z-index: 3;
      display: grid;
      gap: 8px;
    }

    .k-wraps .map-btn {
      width: 42px;
      height: 42px;
      border-radius: 8px;
      background: #fff;
      display: grid;
      place-items: center;
      box-shadow: 0 6px 16px rgba(0,0,0,.1);
      color: #16374a;
      font-size: 17px;
    }

    .k-wraps .map-footer {
      background: #fff;
      padding: 20px 26px;
      display: flex;
      gap: 16px;
      align-items: center;
      justify-content: space-between;
    }

    .k-wraps .map-footer-left {
      display: flex;
      gap: 16px;
      align-items: flex-start;
    }

    .k-wraps .map-footer i {
      font-size: 27px;
      color: #007b83;
      margin-top: 4px;
    }

    .k-wraps .map-footer h4 {
      color: #16374a;
      margin-bottom: 7px;
      font-size: 16px;
    }

    .k-wraps .map-footer p {
      color: #6c7c88;
      font-size: 14px;
    }

    .k-wraps .change-location {
      color: #006f7c;
      font-weight: 500;
      font-size: 14px;
      text-decoration: underline;
      white-space: nowrap;
      cursor: pointer;
    }

    .k-wraps .step-content {
      display: none;
      animation: fadeUp 0.35s ease;
    }

    .k-wraps .step-content.active {
      display: block;
    }

    @keyframes fadeUp {
      from {
        opacity: 0;
        transform: translateY(12px);
      }
      to {
        opacity: 1;
        transform: translateY(0);
      }
    }

    .k-wraps .step-actions {
      display: flex;
      gap: 14px;
      margin-top: 35px;
      flex-wrap: wrap;
    }

    .k-wraps .step-btn {
      border: none;
      height: 52px;
      padding: 0 28px;
      border-radius: 9px;
      font-size: 15px;
      font-weight: 500;
      cursor: pointer;
      transition: 0.25s ease;
      display: inline-flex;
      align-items: center;
      justify-content: center;
      gap: 10px;
    }

    .k-wraps .next-btn,
    .k-wraps .submit-final-btn {
      background: linear-gradient(135deg, #007b83, #005c66);
      color: #fff;
      box-shadow: 0 10px 18px rgba(0, 111, 124, .2);
    }

    .k-wraps .next-btn:hover,
    .k-wraps .submit-final-btn:hover {
      transform: translateY(-2px);
    }

    .k-wraps .back-btn {
      background: #eef5f6;
      color: #005c66;
    }

    .k-wraps .summary-card,
    .k-wraps .help-card {
      border: 1px solid #e9eef2;
      border-radius: 12px;
      overflow: hidden;
      background: #fff;
      box-shadow: 0 6px 18px rgba(0,0,0,.035);
    }

    .k-wraps .summary-head {
      background: linear-gradient(135deg, #006f7c, #005762);
      color: #fff;
      padding: 20px;
      display: flex;
      gap: 16px;
      align-items: center;
      font-size: 17px;
      font-weight: 500;
    }

    .k-wraps .summary-head i {
      font-size: 28px;
      color: #fff;
    }

    .k-wraps .summary-body {
      padding: 28px 25px;
      display: grid;
      gap: 20px;
      grid-template-columns: repeat(2, 2fr);
    }

    .k-wraps .summary-item {
      display: grid;
      grid-template-columns: 34px 1fr;
      gap: 14px;
      margin-bottom: 11px;
      background-color: #f7fbfc;
      padding: 15px;
      border: solid 1px #e2e2e2;
      border-radius: 10px;
    }

    .k-wraps .summary-item:last-child {
      margin-bottom: 0;
    }

    .k-wraps .summary-item i {
      color: #007b83;
      font-size: 22px;
      margin-top: 3px;
    }

    .k-wraps .summary-item span {
      display: block;
      color: #18384d;
      font-size: 15px;
      margin-bottom: 1px;
      font-weight: 500;
    }

    .k-wraps .summary-item strong {
      color: #112e42;
      font-size: 16px;
      line-height: 1.45;
      font-weight: 500;
    }

    .k-wraps .help-card {
      margin-top: 30px;
      padding: 25px;
    }

    .k-wraps .help-title {
      display: flex;
      align-items: center;
      gap: 13px;
      color: #17364b;
      font-weight: 500;
      font-size: 17px;
      margin-bottom: 15px;
    }

    .k-wraps .help-title i {
      color: #007b83;
      font-size: 30px;
    }

    .k-wraps .help-card p {
      color: #6b7b88;
      font-size: 14px;
      margin-bottom: 28px;
    }

    .k-wraps .help-divider {
      height: 1px;
      background: #e9eef2;
      margin-bottom: 25px;
    }

    .k-wraps .contact-info {
      display: flex;
      gap: 14px;
      align-items: center;
      color: #16374a;
      font-size: 15px;
      line-height: 1.6;
    }

    .k-wraps .contact-info i {
      color: #007b83;
      font-size: 21px;
    }

    .k-wraps .success-screen {
      display: none;
      text-align: center;
      padding: 45px 25px;
    }

    .k-wraps .success-screen.active {
      display: block;
      animation: fadeUp 0.35s ease;
    }

    .k-wraps .success-icon {
      width: 86px;
      height: 86px;
      margin: 0 auto 20px;
      border-radius: 50%;
      background: #e8f8f5;
      color: #0e8f78;
      display: grid;
      place-items: center;
      font-size: 42px;
    }

    .k-wraps .success-screen h2 {
      color: #0d3044;
      font-size: 30px;
      margin-bottom: 12px;
    }

    .k-wraps .success-screen p {
      color: #6a7c8d;
      max-width: 620px;
      margin: 0 auto 25px;
      line-height: 1.7;
    }

    .k-wraps .success-info {
      max-width: 620px;
      margin: auto;
      background: #f8fbfc;
      border: 1px solid #e9eef2;
      border-radius: 14px;
      padding: 22px;
      text-align: left;
    }

    .k-wraps .success-info div {
      display: flex;
      justify-content: space-between;
      gap: 20px;
      border-bottom: 1px solid #e5ecef;
      padding: 12px 0;
      color: #17364b;
    }

    .k-wraps .success-info div:last-child {
      border-bottom: none;
    }

    .k-wraps .success-info span {
      color: #6a7c8d;
    }

    .k-wraps .success-info strong {
      text-align: right;
    }

    @media (max-width: 1180px) {
      .k-wraps .pickup-layout {
        grid-template-columns: 1fr;
      }

      .k-wraps .sidebar {
        display: grid;
        grid-template-columns: 1fr 1fr;
        gap: 24px;
      }

      .k-wraps .help-card {
        margin-top: 0;
      }
    }

    @media (max-width: 900px) {
      body {
        padding: 0;
      }

      .k-wraps .pickup-header {
        padding: 22px;
      }

      .k-wraps .pickup-timeline {
        display: none;
      }

      .k-wraps .mobile-timeline {
        display: block;
      }

      .k-wraps .pickup-content {
        padding: 18px;
      }

      .k-wraps .pickup-card {
        padding: 20px;
      }

      .k-wraps .main-title {
        font-size: 24px;
      }

      .k-wraps .form-row,
      .k-wraps .form-row.two-col {
        grid-template-columns: 1fr;
        gap: 18px;
      }

      .k-wraps .sidebar {
        grid-template-columns: 1fr;
      }

      .k-wraps .map-footer {
        align-items: flex-start;
        flex-direction: column;
      }

      .k-wraps .map-search {
        width: calc(100% - 36px);
      }
    }

    @media (max-width: 520px) {
      .k-wraps .pickup-logo {
        font-size: 13px;
      }

      .k-wraps .logo-icon {
        width: 38px;
        height: 38px;
      }

      .k-wraps .pickup-header {
        padding: 18px 15px;
      }

      .k-wraps .pickup-content {
        padding: 14px;
      }

      .k-wraps .pickup-card {
        padding: 16px;
      }

      .k-wraps .main-title {
        font-size: 19px;
      }

      .k-wraps .subtitle {
        font-size: 14px;
      }

      .k-wraps .map-area {
        height: 250px;
      }

      .k-wraps .step-actions {
        flex-direction: column;
      }

      .k-wraps .step-btn {
        width: 100%;
      }

      .k-wraps .summary-body,
      .k-wraps .help-card {
        padding: 22px 18px;
      }

      .k-wraps .success-info div {
        flex-direction: column;
        gap: 4px;
      }

      .k-wraps .success-info strong {
        text-align: left;
      }
    }






.sms-dn .amount-grid {
  grid-template-columns: repeat(6, 1fr)!important;
  margin-bottom: 0;
}










.dntpopups {
  --teal: #006b73;
  --dark: #073f47;
  --light: #effafa;
  --border: #d8e1e3;
  --text: #17333b;
  --muted: #65777d;
}

.dntpopups .open-donation-btn {
  border: none;
  background: linear-gradient(90deg, #005b64, #009ca8);
  color: #fff;
  padding: 15px 34px;
  border-radius: 10px;
  font-size: 18px;
  font-weight: 500;
  cursor: pointer;
  box-shadow: 0 12px 25px rgba(0, 107, 115, 0.25);
}

.dntpopups .donation-overlay {
  position: fixed;
  inset: 0;
  background: rgba(3, 24, 30, 0.72);
  backdrop-filter: blur(7px);
  display: none;
  align-items: center;
  justify-content: center;
  padding: 25px;
  z-index: 9999;
}

.dntpopups.active .donation-overlay {
  display: flex;
}

.dntpopups .donation-modal {
  width: min(980px, 100%);
  background: #fff;
  border-radius: 18px;
  padding: 25px 30px 20px;
  box-shadow: 0 30px 80px rgba(0,0,0,0.35);
  position: relative;
  animation: popIn 0.3s ease;
}

@keyframes popIn {
  from {
    opacity: 0;
    transform: translateY(18px) scale(0.97);
  }
  to {
    opacity: 1;
    transform: translateY(0) scale(1);
  }
}

.dntpopups .close-popup {
  position: absolute;
  right: 28px;
  top: 15px;
  width: 46px;
  height: 46px;
  border: 1.5px solid var(--teal);
  border-radius: 50%;
  background: #fff;
  color: var(--teal);
  font-size: 31px;
  line-height: 1;
  cursor: pointer;
  z-index: 15000;
}

.dntpopups .modal-header {
  display: grid;
  grid-template-columns: 260px 1fr 60px;
  align-items: start;
  border-bottom: 1px solid #dfe6e8;
  padding-bottom: 28px;
  gap: 20px;
}

.dntpopups .brand {
  font-weight: 500;
  color: #1a2b6f;
  line-height: 1.2;
}

.dntpopups .brand-ar {
  font-size: 20px;
  margin-bottom: 5px;
}

.dntpopups .brand-en {
  font-size: 13px;
  letter-spacing: 0.3px;
}

.dntpopups .header-title {
  text-align: left;
}

.dntpopups .header-title h2 {
  margin: 0 0 14px;
  font-size: 22px;
  color: var(--dark);
  font-weight: 500;
}

.dntpopups .case-no {
  display: inline-block;
  background: #edfbfc;
  padding: 8px 24px;
  border-radius: 24px;
  font-size: 20px;
  font-weight: 500;
  text-align: left;
}

.dntpopups .case-no span {
  color: var(--teal);
  margin-left: 6px;
}

.dntpopups .modal-body {
  display: grid;
  grid-template-columns: 1fr 1.05fr;
  gap: 38px;
  padding-top: 32px;
}

.dntpopups .left-col {
  padding-right: 36px;
  border-right: 1px solid #e3e8ea;
}

.dntpopups .field-title {
  margin: 0 0 14px;
  color: var(--dark);
  font-size: 19px;
  font-weight: 500;
  margin-bottom: 10px;
}

.dntpopups .amount-box {
  height: 50px;
  border: 1px solid #a6ced0b8;
  border-radius: 9px;
  display: flex;
  align-items: center;
  overflow: hidden;
  padding: 0;
}

.dntpopups .currency {
  width: 94px;
  height: 100%;
  display: grid;
  place-items: center;
  color: #525252;
  font-size: 18px;
  background: #15999b08;
}

.dntpopups .amount-box input {
  border: none;
  outline: none;
  width: 100%;
  height: 100%;
  padding: 0 22px;
  font-size: 20px;
  color: #0f2530;
}

.dntpopups .help-text {
  margin: 6px 0 42px;
  color: #5e737a;
  font-size: 16px;
}

.dntpopups .type-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 24px;
}

.dntpopups .type-card {
  position: relative;
  min-height: 160px;
  border: 1.5px solid var(--border);
  border-radius: 9px;
  background: #fff;
  cursor: pointer;
  text-align: center;
  padding: 30px 18px 20px;
  transition: 0.25s ease;
}

.dntpopups .type-card.active {
  border-color: var(--teal);
  box-shadow: 0 0 0 1px var(--teal);
}

.dntpopups .radio {
  position: absolute;
  left: 26px;
  top: 34px;
  width: 20px;
  height: 20px;
  border: 1.5px solid #b8c2c5;
  border-radius: 50%;
}

.dntpopups .type-card.active .radio,
.dntpopups .method-card.active .radio {
  border-color: var(--teal);
}

.dntpopups .type-card.active .radio::after,
.dntpopups .method-card.active .radio::after {
  content: "";
  position: absolute;
  inset: 5px;
  background: var(--teal);
  border-radius: 50%;
}

.dntpopups .type-icon {
  font-size: 42px;
  color: var(--teal);
  margin-bottom: 8px;
}

.dntpopups .type-name {
  font-size: 21px;
  font-weight: 500;
  margin-bottom: 8px;
}

.dntpopups .type-desc {
  color: #4f6066;
  font-size: 18px;
}

.dntpopups .secure-box {
  margin-top: 30px;
  background: #edfbfc;
  border-radius: 8px;
  padding: 22px 25px;
  display: flex;
  align-items: center;
  gap: 24px;
}

.dntpopups .secure-icon {
  font-size: 43px;
  color: var(--teal);
}

.dntpopups .secure-box p {
  margin: 0;
  color: #183a43;
  font-size: 17px;
  line-height: 1.45;
}

.dntpopups .user-info-section {
  margin-bottom: 22px;
}

.dntpopups .user-info-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 11px;
}

.dntpopups .user-info-field:first-child {
  grid-column: 1 / -1;
}

.dntpopups .user-info-field {
  display: flex;
  flex-direction: column;
  gap: 6px;
}

.dntpopups .user-info-field label {
  color: #24464e;
  font-size: 14px;
  font-weight: 500;
}

.dntpopups .user-info-field input {
  width: 100%;
  height: 46px;
  border: 1px solid var(--border);
  border-radius: 8px;
  background: #fff;
  color: #0f2530;
  font-size: 16px;
  outline: none;
  padding: 0 14px;
  transition: 0.25s ease;
}

.dntpopups .user-info-field input:focus {
  border-color: var(--teal);
  box-shadow: 0 0 0 1px var(--teal);
}

.dntpopups .user-info-field input::placeholder {
  color: #8a999d;
}

.dntpopups .method-list {
  display: flex;
  flex-direction: column;
  gap: 9px;
}

.dntpopups .method-card {
  position: relative;
  min-height: 50px;
  border: 1px solid var(--border);
  border-radius: 8px;
  background: #fff;
  cursor: pointer;
  display: flex;
  align-items: center;
  padding: 0 10px 0 45px;
  transition: 0.25s ease;
}

.dntpopups .method-card.active {
  border-color: var(--teal);
  box-shadow: 0 0 0 1px var(--teal);
}

.dntpopups .method-card .radio {
  left: 10px;
  top: 50%;
  transform: translateY(-50%);
}

.dntpopups .method-name {
  font-size: 17px;
  flex: 1;
}

.dntpopups .logos {
  display: flex;
  align-items: center;
  gap: 13px;
  font-weight: 500;
  color: #00509d;
}

.dntpopups .mada {
  color: #2e918e;
  font-size: 15px;
}

.dntpopups .visa {
  color: #123da4;
  font-size: 19px;
}

.dntpopups .master {
  width: 41px;
  height: 25px;
  display: inline-block;
  position: relative;
}

.dntpopups .master::before,
.dntpopups .master::after {
  content: "";
  position: absolute;
  top: 2px;
  width: 23px;
  height: 23px;
  border-radius: 50%;
}

.dntpopups .master::before {
  left: 0;
  background: #eb001b;
}

.dntpopups .master::after {
  right: 0;
  background: #f79e1b;
  opacity: 0.9;
}

.dntpopups .method-icon {
  color: var(--teal);
  font-size: 30px;
  font-weight: 500;
  width: 40px;
}

.dntpopups .bank-details {
  display: none;
  margin-top: 12px;
  padding: 16px 18px;
  background: #f4fbfc;
  border: 1px dashed var(--teal);
  border-radius: 9px;
  color: #24464e;
  line-height: 1.6;
}

.dntpopups .bank-details.show {
  display: block;
}

.dntpopups .donate-now {
  margin-top: 32px;
  width: 100%;
  height: 58px;
  border: none;
  border-radius: 8px;
  background: linear-gradient(90deg, #005964, #0099a4);
  color: #fff;
  font-size: 21px;
  font-weight: 500;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 16px;
  transition: 0.25s ease;
}

.dntpopups .donate-now:disabled {
  cursor: not-allowed;
  opacity: 0.72;
  transform: none;
}

.dntpopups .donate-now:hover {
  transform: translateY(-2px);
  box-shadow: 0 15px 25px rgba(0, 107, 115, 0.25);
}

.dntpopups .donation-error {
  margin-top: 16px;
  padding: 10px 14px;
  border: 1px solid #f0b8b8;
  border-radius: 8px;
  background: #fff3f3;
  color: #a33131;
  font-size: 15px;
  line-height: 1.4;
}

.dntpopups .bottom-secure {
  margin-top: 16px;
  text-align: center;
  color: #6b7477;
  font-size: 17px;
}

.dntpopups .success-screen {
  display: none;
  text-align: center;
  padding: 45px 20px 20px;
}

.dntpopups .success-icon {
  width: 88px;
  height: 88px;
  background: #e9fbf4;
  color: #0b8f6b;
  border-radius: 50%;
  display: grid;
  place-items: center;
  margin: 0 auto 22px;
  font-size: 48px;
}

.dntpopups .success-screen h3 {
  margin: 0 0 12px;
  font-size: 32px;
  color: var(--dark);
}

.dntpopups .success-screen p {
  margin: 0 0 25px;
  color: #5d7076;
  font-size: 18px;
}

.dntpopups .summary-box {
  max-width: 520px;
  margin: 0 auto 25px;
  background: #f5fbfc;
  border: 1px solid #dcebec;
  border-radius: 12px;
  padding: 20px;
  text-align: left;
}

.dntpopups .summary-box div {
  display: flex;
  justify-content: space-between;
  padding: 8px 0;
  border-bottom: 1px solid #e1eded;
}

.dntpopups .summary-box div:last-child {
  border-bottom: none;
}

.dntpopups .summary-box strong {
  color: var(--dark);
}

.dntpopups .done-btn {
  border: none;
  background: var(--teal);
  color: #fff;
  padding: 13px 35px;
  border-radius: 8px;
  font-size: 17px;
  font-weight: 500;
  cursor: pointer;
}

.dntpopups.is-success .main-form {
  display: none;
}

.dntpopups.is-success .success-screen {
  display: block;
}


.cse-nom{
  text-align: left;
  margin-top: 0;
  margin-bottom: 15px;
  background-color: #edfbfc;
  border-radius: 5px;
  padding: 8px;
  display: table;
  border: solid 1px #8cd9da;
}

@media (max-width: 900px) {
  .dntpopups .donation-modal {
    padding: 28px 20px 20px;
    max-height: 92vh;
    overflow-y: auto;
  }

  .dntpopups .modal-header {
    grid-template-columns: 1fr;
    text-align: center;
    padding-right: 40px;
  }

  .dntpopups .header-title h2 {
    font-size: 26px;
  }

  .dntpopups .modal-body {
    grid-template-columns: 1fr;
    gap: 28px;
  }

  .dntpopups .user-info-grid {
    grid-template-columns: 1fr;
  }

  .dntpopups .left-col {
    border-right: none;
    padding-right: 0;
  }

  .dntpopups .type-grid {
    grid-template-columns: 1fr;
  }

  .dntpopups .method-card {
    padding-right: 14px;
  }

  .dntpopups .logos {
    gap: 8px;
  }

  .after-payment-layout {
    flex-direction: column;
  }
}

@media (max-width: 520px) {
  .dntpopups .donation-overlay {
    padding: 12px;
  }

  .dntpopups .donation-modal {
    border-radius: 16px;
  }

  .dntpopups .close-popup {
    right: 15px;
    top: 15px;
    width: 38px;
    height: 38px;
    font-size: 25px;
  }

  .dntpopups .header-title h2 {
    font-size: 19px;
  }

  .dntpopups .case-no {
    font-size: 16px;
  }

  .dntpopups .amount-box {
    height: 43px;
  }

  .dntpopups .currency {
    width: 72px;
    font-size: 18px;
  }

  .dntpopups .amount-box input {
    font-size: 17px;
  }

  .dntpopups .method-name {
    font-size: 16px;
  }

  .dntpopups .method-icon {
    font-size: 25px;
  }

  .dntpopups .donate-now {
    height: 45px;
    font-size: 18px;
  }
}










/* MAIN CLASS */
.reg-page{
    min-height:100vh;
    display:flex;
    align-items:center;
    justify-content:center;
    padding:50px 20px;
    background: linear-gradient(0deg,rgb(255, 255, 255) 0%, rgba(159, 206, 207, 0.2) 50%, rgb(255, 255, 255) 100%);
}

.reg-page .reg-wrap{
    width:100%;
    max-width:950px;
    background:#ffffff;
    border-radius:30px;
    padding:70px 50px;
    box-shadow:
    0 10px 40px rgba(0,0,0,0.05);
    position:relative;
    overflow:hidden;
    border: solid 1px #a2a2a230;
}

/* decorative blur */
.reg-page .reg-wrap::before{
    content:'';
    position:absolute;
    width:300px;
    height:300px;
    background:#15999b0f;
    border-radius:50%;
    top:-120px;
    right:-120px;
}

.reg-page .reg-wrap::after{
    content:'';
    position:absolute;
    width:250px;
    height:250px;
    background:#17b26a10;
    border-radius:50%;
    bottom:-120px;
    left:-120px;
}

.reg-page .top-badge{
    width:70px;
    height:70px;
    background:linear-gradient(135deg,#0d5668,#16859b);
    border-radius:50%;
    margin:auto;
    display:flex;
    align-items:center;
    justify-content:center;
    box-shadow:0 10px 25px rgba(13,86,104,0.25);
    margin-bottom:14px;
}

.reg-page .top-badge svg{
    width:34px;
    fill:#fff;
}

.reg-page h1{
    text-align:center;
    font-size:27px;
    color:#0d5668;
    font-weight: 500;
    margin-bottom:0px;
}

.reg-page .sub-text{
    text-align:center;
    color:#6b7280;
    font-size:17px;
    max-width:600px;
    margin:auto;
    line-height:1.7;
}

.reg-page .account-grid{
    margin-top:55px;
    display:grid;
    grid-template-columns:repeat(2,1fr);
    gap:30px;
    max-width:520px;
    margin-inline:auto;
}

.reg-page .account-card{
    background:#fff;
    border:2px solid #edf1f4;
    border-radius:15px;
    padding:30px 25px 15px 25px;
    text-align:center;
    cursor:pointer;
    transition:0.35s ease;
    position:relative;
    overflow:hidden;
}

.reg-page .account-card:hover{
    transform:translateY(-8px);
    border-color:#0d5668;
    box-shadow:0 20px 35px rgba(13,86,104,0.12);
}

.reg-page .account-card.active{
    border-color:#0d5668;
    background:linear-gradient(180deg,#ffffff 0%,#f4fbfd 100%);
    box-shadow:0 15px 30px rgba(13,86,104,0.15);
}

.reg-page .account-card.active::before{
    content:'';
    position:absolute;
    top:0;
    left:0;
    width:100%;
    height:5px;
    background:linear-gradient(90deg,#0d5668,#18a2bb);
}

.reg-page .icon-box{
    width:95px;
    height:95px;
    border-radius:50%;
    background:#f6fafb;
    display:flex;
    align-items:center;
    justify-content:center;
    margin:auto;
    margin-bottom:25px;
    transition:0.3s;
    border: dashed 1px #15999b;
}

.reg-page .account-card:hover .icon-box{
    transform:scale(1.08);
}

.reg-page .icon-box img{
    width:62px;
}

.reg-page .account-card h3{
    font-size:23px;
    color:#1f2937;
    margin-bottom:10px;
}

.reg-page .account-card p{
    font-size:14px;
    color:#6b7280;
    line-height:1.4;
}

.reg-page .btn-wrap{
    margin-top:55px;
    text-align:center;
}

.reg-page .create-btn{
    border:none;
    outline:none;
    background:linear-gradient(135deg,#0d5668,#16859b);
    color:#fff;
    font-size:18px;
    font-weight: 500;
    padding:14px 55px;
    border-radius:9px;
    cursor:pointer;
    transition:0.35s;
    box-shadow:0 15px 30px rgba(13,86,104,0.25);
}

.reg-page .create-btn:hover{
    transform:translateY(-4px);
    box-shadow:0 20px 40px rgba(13,86,104,0.3);
}

.reg-page .create-btn:disabled{
    opacity:.5;
    cursor:not-allowed;
    transform:none;
}

/* Responsive */

@media(max-width:768px){

    .reg-page .reg-wrap{
        padding:15px;
        border-radius:24px;
    }

    .reg-page h1{
        font-size:32px;
    }

    .reg-page .account-grid{
        grid-template-columns:1fr;
        max-width:100%;
    }

    .reg-page .account-card{
        padding:30px 20px;
    }

}











/* MAIN CLASS */
.Merited-wrap{
    min-height:100vh;
    display:flex;
    align-items:center;
    justify-content:center;
    padding:50px 20px;
    background: linear-gradient(0deg,rgb(255, 255, 255) 0%, rgba(159, 206, 207, 0.2) 50%, rgb(255, 255, 255) 100%);
}

.Merited-wrap .register-card{
    width:100%;
    max-width:1100px;
    background:#ffffff;
    border-radius:35px;
    overflow:hidden;
    box-shadow:
    0 15px 50px rgba(0,0,0,0.07);
    position:relative;
}

/* top section */

.Merited-wrap .top-section{
    background:linear-gradient(135deg,#8b6b47,#b18a5f);
    padding:60px 40px 120px;
    position:relative;
    overflow:hidden;
}

.Merited-wrap .top-section::before{
    content:'';
    position:absolute;
    width:320px;
    height:320px;
    background:rgba(255,255,255,0.08);
    border-radius:50%;
    top:-120px;
    right:-80px;
}

.Merited-wrap .top-section::after{
    content:'';
    position:absolute;
    width:250px;
    height:250px;
    background:rgba(255,255,255,0.05);
    border-radius:50%;
    bottom:-120px;
    left:-100px;
}

.Merited-wrap .small-text{
    color:rgba(255,255,255,0.8);
    text-transform:uppercase;
    letter-spacing:2px;
    font-size:13px;
    margin-bottom:15px;
    position:relative;
    z-index:2;
}

.Merited-wrap h1{
    color:#fff;
    font-size:42px;
    font-weight: 500;
    margin-bottom:18px;
    position:relative;
    z-index:2;
}

.Merited-wrap .sub-text{
    color:rgba(255,255,255,0.88);
    line-height:1.8;
    max-width:650px;
    font-size:16px;
    position:relative;
    z-index:2;
}

/* form section */

.Merited-wrap .form-area{
    margin-top:-70px;
    position:relative;
    z-index:5;
    padding:0 40px 45px;
}

.Merited-wrap .form-box{
    background:#fff;
    border-radius:30px;
    padding:45px;
    box-shadow:
    0 10px 40px rgba(0,0,0,0.06);
}

.Merited-wrap .form-title{
    font-size:28px;
    color:#222;
    margin-bottom:10px;
    font-weight: 500;
}

.Merited-wrap .form-desc{
    color:#6b7280;
    margin-bottom:35px;
    line-height:1.7;
}

.Merited-wrap form{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:25px;
}

.Merited-wrap .form-group{
    display:flex;
    flex-direction:column;
}

.Merited-wrap .full-width{
    grid-column:span 2;
}

.Merited-wrap label{
    font-size:14px;
    color:#374151;
    font-weight: 500;
    margin-bottom:10px;
}

.Merited-wrap .input-box{
    position:relative;
}

.Merited-wrap input{
    width:100%;
    height:58px;
    border:none;
    outline:none;
    border-radius:18px;
    background:#f3f5f7;
    padding:0 20px;
    font-size:15px;
    transition:0.3s ease;
    border:2px solid transparent;
}

.Merited-wrap input:focus{
    background:#fff;
    border-color:#a78359;
    box-shadow:0 0 0 4px rgba(167,131,89,0.12);
}

.Merited-wrap input::placeholder{
    color:#9ca3af;
}

.Merited-wrap .submit-wrap{
    grid-column:span 2;
    text-align:center;
    margin-top:10px;
}

.Merited-wrap .submit-btn{
    border:none;
    outline:none;
    background:linear-gradient(135deg,#8b6b47,#b18a5f);
    color:#fff;
    padding:18px 65px;
    border-radius:18px;
    font-size:17px;
    font-weight: 500;
    cursor:pointer;
    transition:0.35s;
    box-shadow:
    0 12px 30px rgba(139,107,71,0.25);
}

.Merited-wrap .submit-btn:hover{
    transform:translateY(-4px);
    box-shadow:
    0 18px 35px rgba(139,107,71,0.3);
}

/* responsive */

@media(max-width:768px){

    .Merited-wrap{
        padding:25px 15px;
    }

    .Merited-wrap .top-section{
        padding:40px 25px 100px;
    }

    .Merited-wrap h1{
        font-size:32px;
    }

    .Merited-wrap .form-area{
        padding:0 20px 25px;
    }

    .Merited-wrap .form-box{
        padding:30px 22px;
        border-radius:25px;
    }

    .Merited-wrap form{
        grid-template-columns:1fr;
    }

    .Merited-wrap .full-width{
        grid-column:span 1;
    }

    .Merited-wrap .submit-wrap{
        grid-column:span 1;
    }

}














/* MAIN CLASS */
.Merited-wrap{
    min-height:auto;
    padding:50px 0;
    display:flex;
    align-items:center;
    justify-content:center;
}

/* MAIN CONTAINER */

.Merited-wrap .register-box{
    width:100%;
    max-width:100%;
    background:#fff;
    border-radius:15px;
    overflow:hidden;
    display:grid;
    grid-template-columns:45% 55%;
    box-shadow:
    0 10px 40px rgba(0,0,0,0.08);
}

/* LEFT SIDE */

.Merited-wrap .left-side{
    position:relative;
    min-height:auto;
    overflow:hidden;
}

.Merited-wrap .left-side img{
    width:100%;
    height:100%;
    object-fit:cover;
}

.Merited-wrap .image-overlay{
    position:absolute;
    inset:0;
    background:
    linear-gradient(to top,
    rgba(0,0,0,0.55),
    rgba(0,0,0,0.05));
}

.Merited-wrap .secure-badge{
    position:absolute;
    top:40px;
    left:40px;
    z-index:5;
    padding:10px 18px;
    border-radius:50px;
    backdrop-filter:blur(12px);
    background:rgba(255,255,255,0.18);
    border:1px solid rgba(255,255,255,0.25);
    color:#fff;
    font-size:13px;
    font-weight:500;
}

.Merited-wrap .left-content{
    position:absolute;
    bottom:45px;
    left:40px;
    right:40px;
    z-index:5;
}

.Merited-wrap .left-content h1{
    color:#fff;
    font-size:30px;
    line-height:1.2;
    margin-bottom:10px;
    font-weight: 500;
}

.Merited-wrap .left-content p{
    color:rgba(255,255,255,0.88);
    font-size:16px;
    line-height:1.5;
    max-width:700px;
}

.Merited-wrap .info-grid{
    margin-top:40px;
    display:grid;
    grid-template-columns:repeat(3,1fr);
    gap:18px;
}

.Merited-wrap .info-card{
    padding:15px;
    border-radius:20px;
    backdrop-filter:blur(15px);
    background:rgba(255,255,255,0.16);
    border:1px solid rgba(255,255,255,0.18);
}

.Merited-wrap .info-card h3{
    color:#fff;
    font-size:30px;
    margin-bottom:8px;
}

.Merited-wrap .info-card p{
    font-size:13px;
    line-height:1.4;
}

/* RIGHT SIDE */

.Merited-wrap .right-side{
    padding:36px 50px;
    display:flex;
    align-items:center;
}

.Merited-wrap .form-wrapper{
    width:100%;
}

.Merited-wrap .welcome-badge{
    display:inline-flex;
    align-items:center;
    gap:10px;
    padding:10px 18px;
    border-radius:50px;
    background:#e9f8f8;
    color:#13949d;
    font-size:13px;
    font-weight: 500;
    margin-bottom:25px;
}

.Merited-wrap .welcome-badge span{
    width:10px;
    height:10px;
    border-radius:50%;
    background:#13949d;
}

.Merited-wrap .form-title{
    font-size:30px;
    color:#0f172a;
    margin-bottom:0;
    font-weight: 500;
}

.Merited-wrap .form-subtitle{
    color:#64748b;
    line-height:1.8;
    margin-bottom:20px;
    font-size:15px;
}

/* FORM */

.Merited-wrap form{
    display:flex;
    flex-direction:column;
    gap:22px;
}

.Merited-wrap .form-row{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:20px;
    margin-bottom: 0;
}
.Merited-wrap .input-group{ display:block; margin-bottom: 0;}
.Merited-wrap .input-group label{
    display:block;
    margin-bottom:9px;
    color:#114c5c;
    font-size:16px;
    font-weight:500;
}

.Merited-wrap .input-box{
    position:relative;
}

.Merited-wrap .input-box input{
    width:100%;
    height:55px;
    border-radius:10px;
    border:1px solid #dbe5ea;
    background:#f8fbfc;
    padding:0 20px;
    outline:none;
    font-size:15px;
    transition:0.3s ease;
}

.Merited-wrap .input-box input:focus{
    background:#fff;
    border-color:#13949d;
    box-shadow:0 0 0 4px rgba(19,148,157,0.12);
}

.Merited-wrap .input-box i{
    position:absolute;
    right:20px;
    top:50%;
    transform:translateY(-50%);
    color:#13949d;
    font-size:18px;
}

/* BUTTON */

.Merited-wrap .register-btn{
    width:100%;
    height:65px;
    border:none;
    border-radius:11px;
    background:linear-gradient(135deg,#16939d,#0f6e83);
    color:#fff;
    font-size:18px;
    font-weight: 500;
    cursor:pointer;
    transition:0.3s ease;
    margin-top:10px;
    box-shadow:
    0 15px 30px rgba(15,110,131,0.22);
}

.Merited-wrap .register-btn:hover{
    transform:translateY(-3px);
}

/* BOTTOM */

.Merited-wrap .bottom-text{
    margin-top:28px;
    text-align:center;
    color:#64748b;
    font-size:14px;
}

.Merited-wrap .bottom-text a{
    color:#13949d;
    text-decoration:none;
    font-weight: 500;
}

/* RESPONSIVE */

@media(max-width:1200px){

    .Merited-wrap .register-box{
        grid-template-columns:1fr;
    }

    .Merited-wrap .left-side{
        min-height:650px;
    }

}

@media(max-width:768px){

    .Merited-wrap{
        padding:15px 0;
    }

    .Merited-wrap .right-side{
        padding:20px 20px;
    }

    .Merited-wrap .left-content{
        left:20px;
        right:20px;
        bottom:20px;
    }

    .Merited-wrap .secure-badge{
        left:20px;
        top:20px;
    }

    .Merited-wrap .left-content h1{
        font-size:20px;
        margin-bottom: 5px;
    }

    .Merited-wrap .form-title{
        font-size:19px;
    }

    .Merited-wrap .info-grid{
        grid-template-columns:repeat(3,1fr);
        margin-top: 20px;
        display: none;
    }

    .Merited-wrap .form-row{
        grid-template-columns:1fr;
    }

}











/* =========================
   PAYMENT TIMELINE
========================= */

.Payment-time-line-wrap{
    width:100%;
    background:#fff;
    border-radius:24px;
    padding:0;
    box-shadow:none;
}

.Payment-time-line-wrap .payment-header{
    margin-bottom:25px;
}

.Payment-time-line-wrap .payment-header h2{
    font-size:28px;
    font-weight: 500;
    color:#111827;
    margin-bottom:6px;
}

.Payment-time-line-wrap .payment-header p{
    color:#6b7280;
    font-size:15px;
}

.Payment-time-line-wrap .payment-timeline{
    position:relative;
}

.Payment-time-line-wrap .payment-timeline::before{
    content:'';
    position:absolute;
    left:17px;
    top:0;
    width:2px;
    height:100%;
    background:#e5e7eb;
}

.Payment-time-line-wrap .payment-item{
    position:relative;
    display:flex;
    gap:20px;
    margin-bottom:25px;
}

.Payment-time-line-wrap .payment-icon{
    min-width:35px;
    height:35px;
    border-radius:50%;
    display:flex;
    align-items:center;
    justify-content:center;
    color:#fff;
    font-size:15px;
    position:relative;
    z-index:2;
}

.Payment-time-line-wrap .success .payment-icon{
    background:linear-gradient(135deg,#27798f,#00afb1);
}

.Payment-time-line-wrap .pending .payment-icon{
    background: linear-gradient(135deg,#27798f,#00afb1);
}

.Payment-time-line-wrap .failed .payment-icon{
    background: linear-gradient(135deg,#27798f,#00afb1);
}

.Payment-time-line-wrap .payment-content{
    flex:1;
    background:#15999b12;
    border-radius:10px;
    padding:18px;
    transition:0.3s ease;
}

.Payment-time-line-wrap .payment-content:hover{
    transform:translateY(-3px);
    box-shadow:0 10px 25px rgba(0,0,0,0.06);
}

.Payment-time-line-wrap .payment-top{
    display:flex;
    justify-content:space-between;
    align-items:center;
    margin-bottom:4px;
    gap:15px;
}

.Payment-time-line-wrap .payment-top h4{
    font-size:17px;
    color:#114c5c;
    font-weight: 500;
}

.Payment-time-line-wrap .payment-top span{
    font-size:20px;
    font-weight: 500;
    color:#114c5c;
}

.Payment-time-line-wrap .payment-content p{
    color:#6b7280;
    font-size:14px;
    line-height:1.5;
    margin-bottom:15px;
}

.Payment-time-line-wrap .payment-bottom{
    display:flex;
    justify-content:space-between;
    align-items:center;
    gap:15px;
    flex-wrap:wrap;
}

.Payment-time-line-wrap .payment-bottom small{
    color:#9ca3af;
    font-size:14px;
}

.Payment-time-line-wrap .status{
    padding:7px 14px;
    border-radius:30px;
    font-size:12px;
    font-weight: 500;
}

.Payment-time-line-wrap .status.success{
    background:#dcfce7;
    color:#15803d;
}

.Payment-time-line-wrap .status.pending{
    background:#fef3c7;
    color:#b45309;
}

.Payment-time-line-wrap .status.failed{
    background:#fee2e2;
    color:#b91c1c;
}

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

@media(max-width:768px){

    .Payment-time-line-wrap{
        padding:20px;
    }

    .Payment-time-line-wrap .payment-header h2{
        font-size:22px;
    }

    .Payment-time-line-wrap .payment-top{
        flex-direction:column;
        align-items:flex-start;
    }

    .Payment-time-line-wrap .payment-bottom{
        flex-direction:column;
        align-items:flex-start;
    }

}















/* =========================
   PAYMENT OPTION SELECT
========================= */

.paynt-opt-slct-chckout{
    width:100%;
    display:flex;
    flex-direction:column;
    gap:-3px;
}

.paynt-opt-slct-chckout .payment-option{
    width:100%;
    cursor:pointer;
}

.paynt-opt-slct-chckout .payment-option input{
    display:none;
}

.paynt-opt-slct-chckout .payment-card{
    background:#fff;
    border:2px solid #edf0f5;
    border-radius:10px;
    padding:2px 12px;
    display:flex;
    align-items:center;
    justify-content:space-between;
    transition:0.3s ease;
    position:relative;
}

.paynt-opt-slct-chckout .payment-card:hover{
    transform:translateY(-2px);
    box-shadow:0 10px 30px rgba(0,0,0,0.06);
}

.paynt-opt-slct-chckout .payment-left{
    display:flex;
    align-items:center;
    gap:16px;
}

.paynt-opt-slct-chckout .payment-left img{
    width:55px;
    height:55px;
    object-fit:contain;
    background:#f8fafc;
    padding:7px;
    border-radius:50%;
}

.paynt-opt-slct-chckout .payment-text h4{
    font-size:17px;
    font-weight:500;
    color:#111827;
    margin-bottom:0;
}

.paynt-opt-slct-chckout .payment-text p{
    font-size:14px;
    color:#9c9ea2;
    margin-bottom: 0;
    font-weight: 500;
}

.paynt-opt-slct-chckout .check-mark{
    width:28px;
    height:27px;
    border-radius:50%;
    border:2px solid #d1d5db;
    display:flex;
    align-items:center;
    justify-content:center;
    font-size:12px;
    color:#fff;
    transition:0.3s ease;
}

.paynt-opt-slct-chckout .payment-option input:checked + .payment-card{
    border-color:#15999b;
    background:#15999b03;
}

.paynt-opt-slct-chckout .payment-option input:checked + .payment-card .check-mark{
    background:#15999b;
    border-color:#15999b;
}

.paynt-opt-slct-chckout .payment-option input:checked + .payment-card .payment-text h4{
    color:#15999b;
}

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

@media(max-width:768px){

    .paynt-opt-slct-chckout .payment-card{
        padding:16px;
    }

    .paynt-opt-slct-chckout .payment-left{
        gap:12px;
    }

    .paynt-opt-slct-chckout .payment-left img{
        width:48px;
        height:48px;
    }

    .paynt-opt-slct-chckout .payment-text h4{
        font-size:15px;
    }

    .paynt-opt-slct-chckout .payment-text p{
        font-size:13px;
    }

}


.paynt-opt-slct-chckout  .payment-card::after{ display:none; }














.print-screens-wrp{ padding:50px 0; background: linear-gradient(0deg,rgb(255, 255, 255) 0%, rgba(159, 206, 207, 0.2) 50%, rgb(255, 255, 255) 100%); }



.print-screens{
    max-width:100%;
    margin:auto;
    background:#fff;
    border-radius:20px;
    overflow:hidden;
    border:1px solid #dfe8ec;
    box-shadow:0 10px 30px rgba(0,0,0,0.05);
    padding: 0px 0;
    width: 84%
}

/* =========================
HEADER
========================= */

.print-screens .ps-header{
    padding:30px 40px;
    border-bottom:1px solid #dfe8ec;
}

.print-screens .top-head{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:20px;
}

.print-screens .brand{
    display:flex;
    align-items:center;
    gap:18px;
}

.print-screens .brand-logo{
    width:65px;
    height:65px;
    border-radius:12px;
    background:#f3f6f8;
    display:flex;
    align-items:center;
    justify-content:center;
    font-size:28px;
}

.print-screens .brand h4{
    font-size:14px;
    color:#0c3b4b;
    margin-bottom:5px;
}

.print-screens .brand h2{
    font-size:26px;
    font-weight: 500;
    color:#083747;
}

.print-screens .print-btn{
    background:#083d4d;
    color:#fff;
    border:none;
    padding:14px 24px;
    border-radius:9px;
    font-size:16px;
    font-weight: 500;
    cursor:pointer;
    transition:0.3s;
    background: linear-gradient(90deg, rgb(21, 153, 155), rgb(20, 111, 135));
    color: rgb(255, 255, 255);
    box-shadow: rgba(13, 111, 104, 0.24) 0px 16px 36px;
}

.print-screens .print-btn:hover{
    background:#0d5266;
}

/* =========================
MAIN CONTENT
========================= */

.print-screens .ps-body{
    padding:40px;
}

.print-screens .receipt-top{
    display:flex;
    justify-content:space-between;
    gap:30px;
    margin-bottom:13px;
    flex-wrap:wrap;
}

.print-screens .receipt-title h1{
    font-size:26px;
    font-weight: 500;
    color:#083747;
    margin-bottom:5px;
}

.print-screens .receipt-title p{
    color:#56707b;
    line-height:1.3;
    font-size:17px;
    margin-bottom: 0;
}

.print-screens .receipt-info{
    text-align:right;
}

.print-screens .receipt-info .info-box{
    margin-bottom:25px;
}

.print-screens .receipt-info span{
    display:block;
    font-size:17px;
    color:#708792;
    margin-bottom:8px;
}

.print-screens .receipt-info strong{
    font-size:17px;
    color:#114c5c;
    font-weight: 500;
}

/* =========================
INFO CARDS
========================= */

.print-screens .info-grid{
    display:grid;
    grid-template-columns:repeat(4,1fr);
    border:1px solid #bae2f1;
    border-radius:18px;
    overflow:hidden;
    margin-bottom:30px;
}

.print-screens .info-card{
    padding:35px 25px;
    border-right:1px solid #bae2f1;
    text-align:center;
}

.print-screens .info-card:last-child{
    border-right:none;
}

.print-screens .info-icon{
    width:70px;
    height:70px;
    margin:auto;
    border-radius:50%;
    background:#f1f7f8;
    display:flex;
    align-items:center;
    justify-content:center;
    font-size:32px;
    margin-bottom:18px;
}

.print-screens .info-card h5{
    color:#6f838d;
    font-size:17px;
    margin-bottom:5px;
    font-weight:500;
}

.print-screens .info-card h3{
    font-size:17px;
    color:#083747;
    font-weight: 500;
}

/* =========================
PAYMENT BAR
========================= */

.print-screens .payment-bar{
    border:1px solid #bae2f1;
    border-radius:18px;
    display:grid;
    grid-template-columns:repeat(3,1fr);
    margin-bottom:30px;
    overflow:hidden;
}

.print-screens .payment-item{
    padding:28px;
    border-right:1px solid #bae2f1;
}

.print-screens .payment-item:last-child{
    border-right:none;
}

.print-screens .payment-item h6{
    font-size:16px;
    color:#728892;
    margin-bottom:10px;
    font-weight:500;
}

.print-screens .payment-item strong{
    font-size:17px;
    color:#083747;
}

.print-screens .status{
    display:inline-flex;
    align-items:center;
    gap:1px;
    background:#e8f8f1;
    color:#159a63;
    padding:10px 18px;
    border-radius:7px;
    font-weight: 500;
}

/* =========================
CONTENT GRID
========================= */

.print-screens .content-grid{
    display:grid;
    grid-template-columns:1.1fr 0.9fr;
    gap:25px;
    margin-bottom:30px;
}

.print-screens .box{
    border:1px solid #bae2f1;
    border-radius:18px;
    padding:35px;
}

.print-screens .box-title{
    font-size:22px;
    font-weight: 500;
    color:#114c5c;
    margin-bottom:22px;
    position:relative;
    padding-bottom:-4px;
}

.print-screens .box-title:after{
    position:;
    left:0;
    bottom:0;
    width:70px;
    height:3px;
    background:#0c7d8d;
    border-radius:10px;
}

.print-screens .box p{
    color:#5f7480;
    line-height:1.4;
    font-size:16px;
    margin-bottom: 0;
}

.print-screens .signature{
    margin-top:30px;
    font-size:24px;
    color:#15999b;
}

.print-screens .chairman{
    margin-top:10px;
    font-size:17px;
    font-weight: 500;
}

.print-screens .breakdown-row{
    display:flex;
    justify-content:space-between;
    margin-bottom:13px;
    font-size:18px;
    color:#425a66;
}

.print-screens .total-row{
    margin-top:30px;
    padding-top:25px;
    border-top:1px solid #e3ebee;
    display:flex;
    justify-content:space-between;
    font-size:20px;
    font-weight: 500;
    color:#0a887f;
}

/* =========================
SECURE BOX
========================= */

.print-screens .secure-box{
    background:1px solid #bae2f1;
    border-radius:18px;
    padding:30px;
    display:flex;
    justify-content:space-between;
    align-items:center;
    gap:20px;
    margin-bottom:30px;
    flex-wrap:wrap;
    background-color: #15999b17;
}

.print-screens .secure-left{
    display:flex;
    align-items:center;
    gap:18px;
}

.print-screens .shield{
    width:75px;
    height:75px;
    border-radius:50%;
    background:#fff;
    display:flex;
    align-items:center;
    justify-content:center;
    font-size:34px;
}

.print-screens .secure-left h3{
    font-size:21px;
    margin-bottom:6px;
}

.print-screens .secure-left p{
    color:#607784;
    line-height:1.4;
}

.print-screens .mail-text{
    text-align:right;
    color:#607784;
    line-height:1.8;
}

.print-screens .mail-text strong{
    color:#083747;
}

/* =========================
BOTTOM INFO
========================= */

.print-screens .bottom-grid{
    display:grid;
    grid-template-columns:1fr 0.7fr;
    gap:25px;
    padding:10px 0 40px;
}

.print-screens .quote-box,
.print-screens .contact-box{
    border-top:1px solid #e3ebee;
    padding-top:30px;
}

.print-screens .quote-box p{
    line-height:1.4;
    color:#4d6671;
    margin-bottom:22px;
}

.print-screens .contact-box ul{
    list-style:none;
}

.print-screens .contact-box li{
    margin-bottom:16px;
    font-size:17px;
    color:#4d6671;
}

/* =========================
FOOTER
========================= */

.print-screens .footer-bar{
    background:#15999b;
    color:#fff;
    padding:25px 40px;
    display:flex;
    justify-content:space-between;
    align-items:center;
    gap:20px;
    flex-wrap:wrap;
}

.print-screens .footer-actions{
    display:flex;
    gap:15px;
    flex-wrap:wrap;
}

.print-screens .footer-btn{
    background:rgba(255,255,255,0.12);
    border:1px solid rgba(255,255,255,0.15);
    color:#fff;
    padding:12px 20px;
    border-radius:8px;
    cursor:pointer;
    font-weight: 500;
}

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

@media(max-width:992px){

    .print-screens .info-grid{
        grid-template-columns:repeat(2,1fr);
    }

    .print-screens .content-grid{
        grid-template-columns:1fr;
    }

    .print-screens .bottom-grid{
        grid-template-columns:1fr;
    }

    .print-screens .payment-bar{
        grid-template-columns:1fr;
    }

    .print-screens .payment-item{
        border-right:none;
        border-bottom:1px solid #e3ebee;
    }

    .print-screens .payment-item:last-child{
        border-bottom:none;
    }
}

@media(max-width:768px){

  

    .print-screens .ps-header,
    .print-screens .ps-body{
        padding:22px;
    }

    .print-screens .top-head{
        flex-direction:column;
        align-items:flex-start;
    }

    .print-screens .receipt-title h1{
        font-size:34px;
    }

    .print-screens .receipt-info{
        text-align:left;
    }

    .print-screens .info-grid{
        grid-template-columns:1fr;
    }

    .print-screens .info-card{
        border-right:none;
        border-bottom:1px solid #e3ebee;
    }

    .print-screens .info-card:last-child{
        border-bottom:none;
    }

    .print-screens .box-title{
        font-size:24px;
    }

    .print-screens .total-row{
        font-size:24px;
    }

    .print-screens .footer-bar{
        flex-direction:column;
        align-items:flex-start;
    }
}


.print-screens .info-card img{ padding:10px; }

.openDonation:hover{ cursor:pointer; }














:root{
    --primary: #15999b;
    --primary-light: #15999b17;
    --green: #15999b;
    --green-light: #15999b17;
    --orange: #15999b;
    --orange-light: #15999b17;
    --red: #15999b;
    --red-light: #15999b17;
    --text: #114c5c;
    --text-light:#64748b;
    --border:#edf0f7;
    --white:#ffffff;
    --bg:#f5f7fb;
}












/* =========================
MONTHLY GIVING SUCCESS POPUP
========================= */

.monthly-success-popup{
    position:fixed;
    inset:0;
    z-index:9999;
    display:flex;
    align-items:center;
    justify-content:center;
    padding:20px;
}

.monthly-success-overlay{
    position:absolute;
    inset:0;
    background:rgba(5, 25, 35, 0.75);
    backdrop-filter:blur(5px);
}

.monthly-success-box{
    position:relative;
    width:100%;
    max-width:560px;
    background:#fff;
    border-radius:15px;
    padding:23px 23px;
    text-align:center;
    z-index:2;
    box-shadow:0 20px 60px rgba(0,0,0,0.15);
    animation:popupScale 0.4s ease;
}

@keyframes popupScale{
    from{
        opacity:0;
        transform:scale(0.8) translateY(20px);
    }
    to{
        opacity:1;
        transform:scale(1) translateY(0);
    }
}

.monthly-success-icon{
    width:45px;
    height:45px;
    margin:auto;
    border-radius:50%;
    background:linear-gradient(135deg,#12b981,#0f766e);
    color:#fff;
    display:flex;
    align-items:center;
    justify-content:center;
    font-size:21px;
    font-weight: 500;
    margin-bottom:18px;
    box-shadow:0 10px 30px rgba(16,185,129,0.35);
}

.monthly-success-box h2{
    font-size:21px;
    color:#073b4c;
    margin-bottom:6px;
    font-weight: 500;
}

.monthly-success-box p{
    color:#607784;
    font-size:15px;
    line-height:1.4;
    margin-bottom:22px;
}

.monthly-success-details{
    background:#f5fafb;
    border-radius:15px;
    padding:10px 19px;
    margin-bottom:21px;
}

.monthly-detail-item{
    display:flex;
    justify-content:space-between;
    align-items:center;
    padding:14px 0;
    border-bottom:1px solid #dde9ed;
    gap:20px;
}

.monthly-detail-item:last-child{
    border-bottom:none;
    padding-bottom:0;
}

.monthly-detail-item span{
    color:#69808b;
    font-size:15px;
}

.monthly-detail-item strong{
    color:#083747;
    font-size:17px;
}

.monthly-success-message{
    background:#15999b17;
    color:#15999b;
    border-radius:7px;
    padding:14px;
    font-weight: 500;
    margin-bottom:15px;
    font-size: 15px;
}

.monthly-success-actions{
    display:flex;
    gap:15px;
}

.monthly-btn{
    flex:1;
    border:none;
    padding:16px;
    border-radius:9px;
    font-size:16px;
    font-weight: 500;
    cursor:pointer;
    transition:0.3s;
    background: linear-gradient(90deg, rgb(21, 153, 155), rgb(20, 111, 135));
}

.primary-btn{
    background:#15999b;
    color:#fff;
}

.primary-btn:hover{
    background:#0b5268;
}

.secondary-btn{
    background:#eef5f7;
    color:#083747;
}

.secondary-btn:hover{
    background:#ddebef;
}

@media(max-width:576px){

    .monthly-success-box{
        padding:15px;
        border-radius:15px;
    }

    .monthly-success-box h2{
        font-size:19px;
    }

    .monthly-success-actions{
        flex-direction:column;
    }

    .monthly-detail-item{
        flex-direction:column;
        align-items:flex-start;
        gap: 10px;
    }
}






/* OPEN POPUP BUTTON */

.open-monthly-popup-btn{
    background:linear-gradient(135deg,#0f766e,#083d4d);
    color:#fff;
    border:none;
    padding:16px 28px;
    border-radius:14px;
    font-size:16px;
    font-weight: 500;
    cursor:pointer;
    transition:0.3s;
    box-shadow:0 10px 25px rgba(8,61,77,0.18);
}

.open-monthly-popup-btn:hover{
    transform:translateY(-2px);
    background:linear-gradient(135deg,#11998e,#0b5268);
}


.monthly-success-popup{ display:none; }









/* =========================
TRACK RESULT PAGE
========================= */

.track-result-page{
    background:transparent;
    min-height:100vh;
    padding:0;
   
}

/* =========================
HEADER
========================= */

.track-result-page .track-result-header{
    max-width:900px;
    margin:auto;
    text-align:center;
    margin-bottom:35px;
}

.track-result-page .track-success-icon{
    width:95px;
    height:95px;
    margin:auto;
    border-radius:50%;
    background:linear-gradient(135deg,#14b86f,#0d8b57);
    color:#fff;
    display:flex;
    align-items:center;
    justify-content:center;
    font-size:42px;
    font-weight: 500;
    margin-bottom:25px;
    box-shadow:0 12px 35px rgba(20,184,111,0.25);
}

.track-result-page h1{
    font-size:48px;
    color:#073b4c;
    margin-bottom:18px;
    font-weight: 500;
}

.track-result-page .track-result-header p{
    color:#607985;
    line-height:1.9;
    font-size:17px;
}

/* =========================
CARD
========================= */

.track-result-page .track-result-card{
    max-width:1100px;
    margin:auto;
    background:#fff;
    border-radius:28px;
    padding:40px;
    box-shadow:0 12px 40px rgba(0,0,0,0.05);
    border:1px solid #e3ecef;
}

/* =========================
TOP
========================= */

.track-result-page .result-top{
    display:flex;
    justify-content:space-between;
    align-items:center;
    gap:20px;
    flex-wrap:wrap;
    margin-bottom:35px;
}

.track-result-page .small-title{
    display:block;
    color:#70848e;
    font-size:14px;
    margin-bottom:10px;
}

.track-result-page .result-top h2{
    font-size:20px;
    color:#073b4c;
}

.track-result-page .approved-status{
    background:#eafbf3;
    color:#0ea565;
    padding:14px 24px;
    border-radius:40px;
    font-size:16px;
    font-weight: 500;
}

/* =========================
INFO GRID
========================= */

.track-result-page .track-info-grid{
    display:grid;
    grid-template-columns:repeat(4,1fr);
    gap:20px;
    margin-bottom:40px;
}

.track-result-page .track-info-box{
    background:#f7fbfc;
    padding:25px;
    border-radius:18px;
}

.track-result-page .track-info-box span{
    display:block;
    color:#6f838d;
    font-size:14px;
    margin-bottom:6px;
}

.track-result-page .track-info-box strong{
    color:#073b4c;
    font-size:17px;
}

/* =========================
TIMELINE
========================= */

.track-result-page .track-time-line-wrap h3{
    font-size:21px;
    color:#073b4c;
    margin-bottom:30px;
}

.track-result-page .timeline-wrap{
    position:relative;
    padding-left:45px;
}

.track-result-page .timeline-wrap:before{
    content:'';
    position:absolute;
    left:13px;
    top:0;
    width:3px;
    height:100%;
    background:#dce8ed;
}

.track-result-page .timeline-item{
    position:relative;
    padding-bottom:35px;
}

.track-result-page .timeline-item:last-child{
    padding-bottom:0;
}

.track-result-page .timeline-dot{
    position:absolute;
    left:-45px;
    top:0;
    width:30px;
    height:30px;
    border-radius:50%;
    background:#d6e7ec;
    border:5px solid #eef7fa;
}

.track-result-page .timeline-item.completed .timeline-dot{
    background:#15999b;
}

.track-result-page .timeline-item.active .timeline-dot{
    background:#f59e0b;
}

.track-result-page .timeline-content{
    background:#15999b0f;
    padding:24px;
    border-radius:18px;
    width: 100%;
}

.track-result-page .timeline-content h4{
    color:#073b4c;
    font-size:18px;
    margin-bottom:3px;
}

.track-result-page .timeline-content p{
    color:#627783;
    line-height:1.8;
    margin-bottom:10px;
}

.track-result-page .timeline-content span{
    color:#0c7d8d;
    font-size:14px;
    font-weight: 500;
}

/* =========================
SUPPORT BOX
========================= */

.track-result-page .support-message-box{
    margin-top:40px;
    background:linear-gradient(135deg,#f0fbff,#f7fdff);
    border-radius:24px;
    padding:30px;
    display:flex;
    justify-content:space-between;
    align-items:center;
    gap:20px;
    flex-wrap:wrap;
}

.track-result-page .support-message-box h4{
    font-size:20px;
    color:#073b4c;
    margin-bottom:2px;
}

.track-result-page .support-message-box p{
    color:#617a86;
    line-height:1.5;
    font-size: 14px;
}

.track-result-page .support-btn{
    border:none;
    background:#073b4c;
    color:#fff;
    padding:16px 28px;
    border-radius:10px;
    font-size:16px;
    font-weight: 500;
    cursor:pointer;
    background: linear-gradient(90deg, rgb(21, 153, 155), rgb(20, 111, 135));
    color: rgb(255, 255, 255);
    box-shadow: rgba(13, 111, 104, 0.24) 0px 16px 36px;
}

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

@media(max-width:992px){

    .track-result-page .track-info-grid{
        grid-template-columns:repeat(2,1fr);
    }

}

@media(max-width:768px){

    .track-result-page{
        padding:0;
    }

    .track-result-page h1{
        font-size:34px;
    }

    .track-result-page .track-result-card{
        padding:15px;
        border-radius: 15px;
    }

    .track-result-page .track-info-grid{
        grid-template-columns:1fr;
    }

    .track-result-page .result-top h2{
        font-size:18px;
    }

    .track-result-page .track-time-line-wrap h3{
        font-size:18px;
    }

    .track-result-page .support-message-box{
        flex-direction:column;
        align-items:flex-start;
        padding: 15px;
    }

}








/* =========================================
MAIN
========================================= */

.benifi-dash-bord{
    display:flex;
    gap:24px;
    background:#edf4f7;
    padding:0;
    min-height:100vh;
    background: linear-gradient(0deg,rgb(255, 255, 255) 0%, rgba(159, 206, 207, 0.2) 50%, rgb(255, 255, 255) 100%);
}

/* =========================================
SIDEBAR
========================================= */

.benifi-dash-bord .beni-sidebar{
    height:fit-content;
    min-height: calc(100vh - 58px);
    border-radius: 20px;
    padding: 19px;
    background: linear-gradient(180deg, #0d6879 0%, #1ca3af 100%);
    color: #fff;
    box-shadow: 0 24px 65px rgba(15, 117, 136, 0.22);
    position: sticky;
    top: 26px;
    overflow: hidden;
    width: 320px;
}

.benifi-dash-bord .beni-profile{
    text-align:center;
    margin-bottom:35px;
}

.benifi-dash-bord .beni-profile-img{
    width:110px;
    height:110px;
    border-radius:20px;
    overflow:hidden;
    margin:0 0 15px 0;
    border:4px solid rgba(255,255,255,0.15);
}

.benifi-dash-bord .beni-profile-img img{
    width:100%;
    height:100%;
    object-fit:cover;
}

.benifi-dash-bord .beni-profile h2{
    font-size: 20px;
    font-weight: 500;
    line-height: 1.2;
    margin-bottom: 0;
    color: #fff;
}

.benifi-dash-bord .beni-profile p{
    margin-bottom:18px;
    color: rgba(255,255,255,0.82);
    font-size: 15px;
    line-height: 1.5;
    margin-bottom: 0;
}

.benifi-dash-bord .verify-tag{
    background:#12c357ad;
    padding:6px 10px;
    border-radius:40px;
    font-size:14px;
    display:inline-flex;
    align-items:center;
    gap:8px;
    color: #fff;
    font-weight: 500;
}

.benifi-dash-bord .beni-menu-wrap{
    display:flex;
    flex-direction:column;
    gap:14px;
}

.benifi-dash-bord .beni-menu{
    border:none;
    height:51px;
    border-radius:9px;
    background:rgba(255,255,255,0.08);
    color:#fff;
    display:flex;
    align-items:center;
    gap:12px;
    padding:0 20px;
    cursor:pointer;
    font-size:16px;
    transition:0.3s;
    text-align:left;
    font-weight: 500;
}

.benifi-dash-bord .beni-menu:hover{
    background:rgba(255,255,255,0.16);
}

.benifi-dash-bord .beni-menu.active{
    background:#0a5964;
}

/* =========================================
MAIN CONTENT
========================================= */

.benifi-dash-bord .beni-main{
    flex:1;
}

.benifi-dash-bord .beni-tab-content{
    display:none;
}

.benifi-dash-bord .beni-tab-content.active{
    display:block;
    background: #ffffffb0;
    border: 0;
    border-radius: 20px;
    padding: 0;
    min-height: calc(100vh - 52px);
    box-shadow: 0 24px 65px rgba(13, 64, 84, 0.08);
    backdrop-filter: blur(16px);
    overflow: hidden;
    height: 100%;
    padding: 30px;
    background: rgba(255,255,255,0.72);
    border: 1px solid rgba(202, 230, 236, 0.95);
    border-radius: 20px;
    padding: 25px;
    min-height: calc(100vh - 100%);
    box-shadow: 0 24px 65px rgba(13, 64, 84, 0.08);
    backdrop-filter: blur(16px);
    overflow: hidden;
    height: 100%;
}

.benifi-dash-bord .page-title{
    margin-bottom:25px;
}

.benifi-dash-bord .page-title h1{
    font-size: clamp(27px, 1.5vw, 24px);
    line-height: 1.08;
    letter-spacing: 0;
    color: #023b53;
    font-weight: 500;
    margin-bottom: 3px;
}

.benifi-dash-bord .page-title p{
    color:#7b8c94;
    font-weight: 500;
}

/* =========================================
STATS
========================================= */

.benifi-dash-bord .stats-grid{
    display:grid;
    grid-template-columns:repeat(4,1fr);
    gap:20px;
}

.benifi-dash-bord .stat-card{
    background:#fff;
    border-radius:24px;
    padding:30px;
    text-align:center;
    text-align: left;
    background: rgba(255,255,255,0.9);
    border: 1px solid #d6eaf0;
    border-radius: 16px;
    padding: 28px;
    min-height: 205px;
    box-shadow: 0 18px 45px rgba(13, 64, 84, 0.06);
    transition: 0.3s ease;
    position: relative;
    overflow: hidden;
    margin-bottom: 0;
    padding-bottom: 0;
}

.benifi-dash-bord .stat-card i{
    font-size:34px;
    color:#1493a2;
    margin-bottom:18px;
    width: 70px;
    height: 70px;
    border-radius: 999px;
    background: #e7f8fb;
    color: #1198aa;
    display: grid;
    place-items: center;
    font-size: 32px;
    margin-bottom: 15px;
    border: dashed 1px #15999bc7;
}

.benifi-dash-bord .stat-card h2{
    font-size:27px;
    color:#073b4c;
    margin-bottom:2px;
}

.benifi-dash-bord .stat-card p{
    color:#6d838d;
}

/* =========================================
CONTENT CARD
========================================= */

.benifi-dash-bord .content-card{
    background:#fff;
    border-radius:28px;
    padding:30px;
    background: transparent;
    border: 0;
    border-radius: 0;
    padding: 0;
    min-height: calc(100vh - 100%);
    box-shadow: none;
    backdrop-filter: blur(16px);
    overflow: hidden;
    height: 100%;
}

.benifi-dash-bord .card-title{
    margin-bottom:28px;
}

.benifi-dash-bord .card-title h2{
    font-size: clamp(27px, 1.5vw, 24px);
    line-height: 1.08;
    letter-spacing: 0;
    color: #023b53;
    font-weight: 500;
    margin-bottom: 3px;
}

/* =========================================
FORM
========================================= */

.benifi-dash-bord .form-grid{
    display:grid;
    grid-template-columns:repeat(2,1fr);
    gap:22px;
    background: transparent;
}

.benifi-dash-bord .form-group{
    display:flex;
    flex-direction:column;
}

.benifi-dash-bord .form-group label{
    margin-bottom:10px;
    color:#114c5c;
    font-weight: 500;
}

.benifi-dash-bord .form-group input,
.benifi-dash-bord .form-group textarea,
.benifi-dash-bord .form-group select{
    height:56px;
    width: 100%;
    min-height: 56px;
    border: 1px solid #d7eaf0;
    border-radius: 8px;
    background: #fff;
    color: #505c61;
    font-size: 17px;
    font-weight: 500;
    padding: 0 16px 0 16px;
    outline: none;
    transition: 0.3s ease;
    font-family: inherit;
    padding: 12px;
}

.benifi-dash-bord .form-group textarea{
    height:130px;
    padding-top:18px;
    resize:none;
}

.benifi-dash-bord .full-width{
    grid-column:1/-1;
}

.benifi-dash-bord .submit-btn{
    height:51px;
    margin-top:25px;
    min-height: 46px;
    padding: 0 40px;
    border-radius: 6px;
    border: 0;
    background: linear-gradient(135deg, #0d6879, #1ca3af);
    color: #fff;
    font-size: 16px;
    font-weight: 500;
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    gap: 9px;
    transition: 0.3s ease;
    box-shadow: 0 14px 28px rgba(24,167,184,0.22);
}

/* =========================================
DOCUMENTS
========================================= */

.benifi-dash-bord .doc-grid{
    display:grid;
    grid-template-columns:repeat(3,1fr);
    gap:20px;
    align-items: center;
    justify-content: center;
}

.benifi-dash-bord .doc-card{
    background:#f7fbfc;
    border-radius:20px;
    padding:30px 20px;
    text-align:center;
    text-align: center;
    background: rgba(255,255,255,0.9);
    border: 1px solid #d6eaf0;
    border-radius: 16px;
    padding-bottom: 28px;
    min-height: auto;
    box-shadow: 0 18px 45px rgba(13, 64, 84, 0.06);
    transition: 0.3s ease;
    position: relative;
    overflow: hidden;
    margin-bottom: 0;
    padding-bottom: 0;
    padding: 20px;
    text-align: center;
}

.benifi-dash-bord .doc-card i{
    font-size:43px;
    color:#1493a2;
    margin-bottom:18px;
}

.benifi-dash-bord .doc-card h4{
    color:#073b4c;
    font-size: 18px;
}

/* =========================================
TIMELINE
========================================= */

.benifi-dash-bord .timeline{
    position:relative;
    padding-left:35px;
}

.benifi-dash-bord .timeline:before{
    content:'';
    position:absolute;
    left:10px;
    top:0;
    width:3px;
    height:100%;
    background:#dce7ec;
}

.benifi-dash-bord .timeline-item{
    position:relative;
    margin-bottom:30px;
}

.benifi-dash-bord .dot{
    position:absolute;
    left:-34px;
    width:21px;
    height:20px;
    border-radius:50%;
    background:#cfdde2;
    top: 0;
}

.benifi-dash-bord .timeline-item.done .dot{
    background:#0ea565;
}

.benifi-dash-bord .timeline-item.active .dot{
    background:#f59e0b;
}

.benifi-dash-bord .timeline-content-box{
    background:#15999b12;
    border-radius:15px;
    padding:22px;
    width: 100%;
}

.benifi-dash-bord .timeline-content-box h4{
    margin-bottom:6px;
    color:#073b4c;
    font-size: 19px;
}

/* =========================================
NOTIFICATION
========================================= */

.benifi-dash-bord .notify-item{
    background:#15999b0f;
    border-radius:15px;
    padding:22px;
    margin-bottom:18px;
}

.benifi-dash-bord .notify-item h4{
    color:#073b4c;
    margin-bottom:6px;
    font-size: 19px;
}

/* =========================================
TABLE
========================================= */

.benifi-dash-bord .history-table{
    width:100%;
}

.benifi-dash-bord .table-head,
.benifi-dash-bord .table-row{
    display:grid;
    grid-template-columns:repeat(4,1fr);
    gap:15px;
    padding:18px;
    align-items:center;
}

.benifi-dash-bord .table-head{
    background:#0d6f7d;
    color:#fff;
    border-radius:10px;
    margin-bottom:12px;
}

.benifi-dash-bord .table-row{
    background:#15999b0f;
    border-radius:10px;
    margin-bottom:12px;
}

.benifi-dash-bord .badge{
    padding:8px 14px;
    border-radius:30px;
    font-size:13px;
    font-weight: 500;
}

.benifi-dash-bord .badge.green{
    background:#e9fbf1;
    color:#0ea565;
}

.benifi-dash-bord .badge.orange{
    background:#fff5e2;
    color:#f59e0b;
}

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

@media(max-width:1200px){

    .benifi-dash-bord{
        flex-direction:column;
    }

    .benifi-dash-bord .beni-sidebar{
        width:100%;
        position:relative;
        top:auto;
    }

    .benifi-dash-bord .stats-grid{
        grid-template-columns:repeat(2,1fr);
    }

    .benifi-dash-bord .doc-grid{
        grid-template-columns:repeat(2,1fr);
    }

}

@media(max-width:768px){

    .benifi-dash-bord{
        padding:0;
    }

    .benifi-dash-bord .stats-grid{
        grid-template-columns:1fr;
    }

    .benifi-dash-bord .form-grid{
        grid-template-columns:1fr;
    }

    .benifi-dash-bord .doc-grid{
        grid-template-columns:1fr;
    }

    .benifi-dash-bord .table-head,
    .benifi-dash-bord .table-row{
        grid-template-columns:1fr;
    }

    .benifi-dash-bord .page-title h1{
        font-size:32px;
    }

    .benifi-dash-bord .card-title h2{
        font-size:19px;
    }

}




.benifi-dash-bord .stat-card::after {
  content: "";
  position: absolute;
  width: 120px;
  height: 120px;
  border-radius: 50%;

  background: rgba(24, 167, 184, 0.08);

  right: -50px;
  bottom: -50px;
}




.benifi-dash-bord .beni-sidebar::before {
  content: "";
  position: absolute;
  width: 240px;
  height: 240px;
  border-radius: 50%;

  background: rgba(255,255,255,0.08);

  right: -90px;
  bottom: -90px;
}


 .benifi-dash-bord-wrap{
  background: linear-gradient(0deg,rgb(255, 255, 255) 0%, rgba(159, 206, 207, 0.2) 50%, rgb(255, 255, 255) 100%);
  padding: 50px 0;
}

 .benifi-dash-bord-wrap .green{
  background-color: #d1ffeb;
  padding: 2px 18px;
  border-radius: 999px;
  font-size: 16px;
  color: #444;
  text-align: right;
}

 .benifi-dash-bord-wrap .orange{
  background-color: #ffe7d1;
  padding: 2px 18px;
  border-radius: 999px;
  font-size: 16px;
  color: #444;
    text-align: right;
}


 .benifi-dash-bord-wrap .doc-card i{
  width: 70px;
  height: 70px;
  border-radius: 999px;
  background: #e7f8fb;
  color: #1198aa;
  display: grid;
  place-items: center;
  font-size: 33px;
  margin-bottom: 15px;
  border: dashed 1px #15999bc7;
  justify-content: center;
  align-items: center;
  margin: 0  auto 20px auto;
  }








.beneficiary-dashboard{
    padding: 0;
}

/* HEADER */

.beneficiary-topbar{
    display:flex;
    justify-content:space-between;
    align-items:center;
    margin-bottom:30px;
    gap:20px;
}

.beneficiary-title h2{
    font-size:25px;
    color:#114c5c;
    font-weight: 500;
    margin-bottom:4px;
}

.beneficiary-title p{
    color:var(--text-light);
    font-size:15px;
    margin-bottom: 0;
}

.beneficiary-actions{
    display:flex;
    gap:15px;
    align-items:center;
}

.beneficiary-action-btn{
    width:48px;
    height:48px;
    border-radius:50%;
    background:#fff;
    border:1px solid #15999b40;
    display:flex;
    align-items:center;
    justify-content:center;
    color:#15999b;
    font-size:18px;
    cursor:pointer;
    box-shadow:0 5px 18px rgba(0,0,0,.04);
}

/* MAIN GRID */

.beneficiary-main-grid{
    display:grid;
    grid-template-columns:1fr 310px;
    gap:15px;
}

/* LEFT CONTENT */

.beneficiary-left{
    display:flex;
    flex-direction:column;
    gap:15px;
}

/* STAT CARDS */

.beneficiary-stat-grid{
    display:grid;
    grid-template-columns:repeat(2,1fr);
    gap:15px;
}

.beneficiary-stat-card{
    background:#fff;
    border-radius:15px;
    padding:20px;
    border:1px solid #e3eafb;
    box-shadow:0 8px 30px rgba(0,0,0,.04);
    transition:.3s;
    display: flex;
    gap: 15px;
    align-items: start;
}

.beneficiary-stat-card:hover{
    transform:translateY(-5px);
}

.stat-top{
    display:flex;
    justify-content:space-between;
    align-items:center;
    margin-bottom:0;
    text-align: left;
    overflow: hidden;
    padding-bottom: 0;
    width: auto;
}

.stat-icon{
    width:62px;
    height:62px;
    border-radius: 999px;
    display:flex;
    align-items:center;
    justify-content:center;
    font-size:24px;
    border: dashed 1px #15999b;
}

.blue-bg{
    background:var(--primary-light);
    color:var(--primary);
}

.green-bg{
    background:var(--green-light);
    color:var(--green);
}

.orange-bg{
    background:var(--orange-light);
    color:var(--orange);
}

.red-bg{
    background:var(--red-light);
    color:var(--red);
}

.beneficiary-stat-card h3{
    font-size: 27px;
    margin-bottom:0px;
    color:var(--text);
}

.beneficiary-stat-card p{
    color:var(--text-light);
    font-size:15px;
    margin-bottom: 5px;
    line-height: 19px;
}

.view-link{
    display:inline-flex;
    align-items:center;
    gap:8px;
    margin-top:9px;
    color: #114c5cf2;
    text-decoration:none;
    font-size:14px;
    font-weight:500;
}

/* TABLE */

.dashboard-card{
    background:#fff;
    border-radius: 15px;
    border:1px solid var(--border);
    box-shadow:0 8px 30px rgba(0,0,0,.04);
    overflow:hidden;
}

.dashboard-card-header{
    padding:20px 20px;
    display:flex;
    justify-content:space-between;
    align-items:center;
    border-bottom:1px solid var(--border);
}

.dashboard-card-header h3{
    font-size:22px;
    color:var(--text);
}

.dashboard-card-header a{
    text-decoration:none;
    color: #15999b;
    font-weight: 500;
    font-size:14px;
}

.application-table-wrap{
    overflow:auto;
    padding: 0 20px;
}

.application-table{
    width:100%;
    border-collapse:collapse;
}

.application-table th{
    text-align:left;
    padding: 11px 2px;
    color:#64748b;
    font-size:14px;
    font-weight: 500;
    border-bottom:1px solid var(--border);
}

.application-table td{
    padding: 12px 2px;
    border-bottom:1px solid #c4ebec;
    color:#1e293b;
    font-size:14px;
    background-color: #15999b00;
}

.application-id{
    display:flex;
    align-items:center;
    gap:10px;
    font-weight:500;
    font-size: 15px;
}

.application-id i{
    color: #b1b1b1;
}

.status-badge{
    padding:3px 9px;
    border-radius:50px;
    font-size:12px;
    font-weight:500;
}

.status-review{
    background:#eaf2ff;
    color:#2563eb;
}

.status-approved{
    background:#ecfdf3;
    color:#16a34a;
}

.status-pending{
    background:#fff7e8;
    color:#d97706;
}

.status-rejected{
    background:#fef2f2;
    color:#dc2626;
}

/* DOCUMENTS */

.document-grid{
    display:grid;
    grid-template-columns: repeat(2,1fr);
    gap: 14px;
    padding:20px;
}

.document-box{
    border:1px solid var(--border);
    border-radius: 15px;
    padding: 18px;
    transition:.3s;
    background:#fff;
}

.document-box:hover{
    transform:translateY(-4px);
}

.document-icon{
    width:65px;
    height:65px;
    border-radius: 50%;
    background: #eaf6f6;
    color: #15999b;
    display:flex;
    align-items:center;
    justify-content:center;
    font-size:26px;
    margin-bottom:20px;
    margin-bottom: 15px;
    border: dashed 1px #15999bc7;
}

.document-box h4{
    font-size:18px;
    margin-bottom:8px;
    color:#1e293b;
}

.document-box p{
    font-size:14px;
    color:#64748b;
    margin-bottom:18px;
    line-height:24px;
}

.doc-status{
    display:inline-block;
    padding:8px 14px;
    border-radius:50px;
    background:#ecfdf3;
    color:#16a34a;
    font-size:12px;
    font-weight: 500;
}

/* RIGHT SIDEBAR */

.beneficiary-sidebar{
    display:flex;
    flex-direction:column;
    gap:25px;
}

.profile-card{
    background:#fff;
    border-radius: 15px;
    padding:30px;
    border:1px solid var(--border);
    box-shadow:0 8px 30px rgba(0,0,0,.04);
}

.profile-top{
    display:flex;
    gap:18px;
    align-items:center;
    margin-bottom:25px;
}

.profile-top img{
    width:75px;
    height:75px;
    border-radius:50%;
    object-fit:cover;
    object-position: top;
    background-color: #e3e3e3;
}

.profile-top h3{
    font-size: 18px;
    margin-bottom: -1px;
    color: #114c5c;
}

.profile-top p{
    color:#64748b;
    font-size:14px;
    margin-bottom: 0;
}

.verify-tag{
    margin-top:10px;
    display:inline-block;
    background:#ecfdf3;
    color:#16a34a;
    padding:9px 14px;
    border-radius:40px;
    font-size:12px;
    font-weight: 500;
}

.profile-info{
    display:flex;
    flex-direction:column;
    gap: 6px;
}

.profile-info-item{
    display:flex;
    gap:9px;
    align-items:flex-start;
    color:#475569;
    font-size:14px;
}

.profile-info-item i{
    color: #15999b;
    margin-top:4px;
}

.profile-btn{
    justify-content:center;
    text-decoration:none;
    height: 45px;
    margin-top: 25px;
    min-height: 46px;
    padding: 0 22px;
    border-radius: 6px;
    border: 0;
    background: linear-gradient(135deg, #0d6879, #1ca3af);
    color: #fff;
    font-size: 16px;
    font-weight: 500;
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    gap: 9px;
    transition: 0.3s ease;
    box-shadow: 0 14px 28px rgba(24, 167, 184, 0.22);
}

/* NOTIFICATIONS */

.notification-list{
    padding:10px 30px 30px;
}

.notification-item{
    display:flex;
    gap:15px;
    padding:11px 0;
    border-bottom: 1px solid #15999b4d;
}

.notification-item:last-child{
    border-bottom:none;
}

.notification-icon{
    width:52px;
    height:52px;
    min-width:52px;
    border-radius: 50%;
    display:flex;
    align-items:center;
    justify-content:center;
    font-size:20px;
    border: dashed 1px #15999b;
}

.notification-content h5{
    font-size:15px;
    line-height: 19px;
    color:#1e293b;
    margin-bottom: 4px;
    font-weight: 500;
}

.notification-content p{
    color:#64748b;
    font-size:13px;
    margin-bottom: 0;
}

/* RESPONSIVE */

@media(max-width:1200px){

.beneficiary-main-grid{
    grid-template-columns:1fr;
}

.document-grid{
    grid-template-columns:repeat(2,1fr);
}

}

@media(max-width:992px){

.beneficiary-stat-grid{
    grid-template-columns:repeat(2,1fr);
}

}

@media(max-width:768px){

.beneficiary-dashboard{
    padding:18px;
}

.beneficiary-topbar{
    flex-direction:column;
    align-items:flex-start;
}

.beneficiary-stat-grid{
    grid-template-columns:1fr;
}

.document-grid{
    grid-template-columns:1fr;
}

.dashboard-card-header{
    padding:20px;
}

.application-table th,
.application-table td{
    padding:16px;
}

.profile-card,
.dashboard-card{
    border-radius:22px;
}

}

@media(max-width:768px){
  .beneficiary-main-grid{
    display:flex;
    flex-direction:column;
    gap:18px;
  }

  .beneficiary-left{
    order:1;
  }

  .beneficiary-sidebar{
    display:contents;
  }

  .beneficiary-sidebar .profile-card{
    order:-1;
    width:100%;
    max-width:100%;
    margin:0;
    padding:36px;
    border-radius:10px !important;
    background:#fff;
    border:1px solid #dceef2;
    box-shadow:0 18px 45px rgba(13,64,84,0.08);
  }

  .beneficiary-sidebar .dashboard-card{
    order:2;
  }

  .profile-top{
    display:grid;
    grid-template-columns:90px 1fr;
    gap:18px;
    align-items:center;
    margin-bottom:28px;
  }

  .profile-top img{
    width:90px;
    height:90px;
    border-radius:50% !important;
  }

  .profile-top h3{
    font-size:22px;
    line-height:1.22;
    margin-bottom:3px;
  }

  .profile-top p{
    font-size:14px;
    line-height:1.3;
    margin-bottom:0px;
  }

  .profile-top .verify-tag{
    font-size:14px;
    line-height:1.15;
    padding:5px 18px;
    border-radius:999px !important;
    background:#58d37e;
    color:#fff;
  }

  .profile-info{
    gap:12px;
    margin-bottom:28px;
  }

  .profile-info-item{
    gap:9px;
    font-size:16px;
    line-height:1.25;
    color:#2f4662;
  }

  .profile-info-item i{
    width:18px;
    font-size:18px;
    color:#15999b;
    text-align:center;
  }

  .profile-btn{
    min-height:46px;
    width:100%;
    justify-content:center;
    margin-top:0;
    border-radius:8px !important;
    font-size:15px;
  }
}

@media(max-width:420px){
  .beneficiary-sidebar .profile-card{
    padding:16px 19px;
  }

  .profile-top{
    grid-template-columns:80px 1fr;
    gap:14px;
  }

  .profile-top img{
    width:80px;
    height:80px;
  }

  .profile-top h3{
    font-size:17px;
  }
}







.beneficiary-stat-card{ overflow:hidden; }



.beneficiary-stat-card::before {
  content: "";
  position: absolute;
  width: 120px;
  height: 120px;
  border-radius: 50%;
  background: rgba(24, 167, 184, 0.08);
  right: -50px;
  bottom: -50px;
}



.timeline-content-box p{ margin-bottom:0 }
.notify-itemp{ margin-bottom:0 }


.pro-p{border-radius: 50%;
  overflow: hidden;
border: solid 3px #1895a2;
width: 80px;
height: 80px;
margin-bottom: 11px;
margin: 0 auto;
margin-bottom: 15px;
}





.app-sts{
    background:transparent;
    border-radius:30px;
    border:0;
    overflow:hidden;
    box-shadow:0 10px 40px rgba(15,23,42,.04);
}

/* HEADER */

.app-sts-head{
    padding:28px 30px;
    border-bottom:1px solid #edf0f7;
    display:flex;
    justify-content:space-between;
    align-items:center;
    gap:20px;
}

.app-sts-title{
    display:flex;
    align-items:center;
    gap:16px;
}

.app-sts-title-icon{
    width:58px;
    height:58px;
    border-radius:18px;
    background:#eef4ff;
    color:#2563eb;
    display:flex;
    align-items:center;
    justify-content:center;
    font-size:24px;
}

.app-sts-title h3{
    font-size:24px;
    color:#0f172a;
    margin-bottom:5px;
    font-weight: 500;
}

.app-sts-title p{
    color:#64748b;
    font-size:14px;
}

.app-sts-head-link{
    text-decoration:none;
    color:#2563eb;
    font-size:14px;
    font-weight: 500;
}

/* BODY */

.app-sts-body{
    padding:20px 0;
    display:flex;
    flex-direction:column;
    gap:24px;
    background: ;
}

/* ITEM */

.app-sts-item{
    border:1px solid #15999b36;
    border-radius:20px;
    padding:24px;
    display:flex;
    gap:24px;
    align-items:flex-start;
    transition:.3s;
    background:#fff;
    position:relative;
    overflow:hidden;
}

.app-sts-item:hover{
    transform:translateY(-4px);
    box-shadow:0 12px 35px rgba(15,23,42,.06);
}

.app-sts-item::before{
    content:'';
    position:absolute;
    left:0;
    top:0;
    width:0;
    height:100%;
}

.app-sts-confirmed::before{
    background:#22c55e;
}

.app-sts-pending::before{
    background:#f59e0b;
}

.app-sts-cancelled::before{
    background:#ef4444;
}

/* ICON */

.app-sts-icon{
    width:65px;
    height:65px;
    min-width:65px;
    border-radius:50%;
    display:flex;
    align-items:center;
    justify-content:center;
    font-size:30px;
    border: dashed 1px;
}

.app-sts-confirmed .app-sts-icon{
    background:#ecfdf3;
    color:#16a34a;
}

.app-sts-pending .app-sts-icon{
    background:#fff7e8;
    color:#d97706;
}

.app-sts-cancelled .app-sts-icon{
    background:#fef2f2;
    color:#dc2626;
}

/* CONTENT */

.app-sts-content{
    width:100%;
}

.app-sts-top{
    display:flex;
    justify-content:space-between;
    align-items:flex-start;
    gap:20px;
    margin-bottom:0;
}

.app-sts-top h4{
    font-size:19px;
    color:#0f172a;
    margin-bottom:2px;
    font-weight: 500;
}

.app-sts-top p{
    color:#64748b;
    font-size:14px;
}

/* BADGES */

.app-sts-badge{
    padding:10px 18px;
    border-radius:50px;
    font-size:12px;
    font-weight: 500;
    letter-spacing:.3px;
}

.app-sts-confirmed .app-sts-badge{
    background:#ecfdf3;
    color:#16a34a;
}

.app-sts-pending .app-sts-badge{
    background:#fff7e8;
    color:#d97706;
}

.app-sts-cancelled .app-sts-badge{
    background:#fef2f2;
    color:#dc2626;
}

/* META */

.app-sts-meta{
    display:flex;
    flex-wrap:wrap;
    gap:14px;
    margin-bottom:0;
}

.app-sts-meta-box{
    background:#15999b1a;
    border-radius:7px;
    padding:13px 18px;
    display:flex;
    align-items:center;
    gap:10px;
    color:#475569;
    font-size:14px;
}

.app-sts-meta-box i{
    color:#15999b;
}

/* FOOTER */

.app-sts-footer{
    display:flex;
    justify-content:space-between;
    align-items:center;
    gap:20px;
    flex-wrap:wrap;
}

.app-sts-doctor{
    display:flex;
    align-items:center;
    gap:14px;
}

.app-sts-doctor img{
    width:52px;
    height:52px;
    border-radius:50%;
    object-fit:cover;
}

.app-sts-doctor h5{
    font-size:15px;
    color:#0f172a;
    margin-bottom:4px;
}

.app-sts-doctor span{
    color:#64748b;
    font-size:13px;
}

.app-sts-btns{
    display:flex;
    gap:12px;
}

.app-sts-btn{
    height:46px;
    padding:0 22px;
    border:none;
    border-radius:14px;
    font-size:14px;
    font-weight: 500;
    cursor:pointer;
    transition:.3s;
}

.app-sts-btn-primary{
    background:#2563eb;
    color:#fff;
}

.app-sts-btn-secondary{
    background:#eff6ff;
    color:#2563eb;
}

.app-sts-btn:hover{
    transform:translateY(-2px);
}

/* RESPONSIVE */

@media(max-width:768px){

.app-sts-head{
    flex-direction:column;
    align-items:flex-start;
}

.app-sts-item{
    flex-direction:column;
}

.app-sts-top{
    flex-direction:column;
    align-items:flex-start;
}

.app-sts-footer{
    flex-direction:column;
    align-items:flex-start;
}

.app-sts-meta{
    flex-direction:column;
}

.app-sts-btns{
    width:100%;
    flex-direction:column;
}

.app-sts-btn{
    width:100%;
}

}


.aplsns{ margin-bottom:10px !important; margin-top:15px; }

.aplsns p{ margin-bottom:0; }


.notify-item p{ margin-bottom:0 }
.notify-item p{font-size: 18px;}















.applictho-trk-wrap {
  max-width: 100%;
  margin: auto;
  padding: 0;
  background: #f7fbfc;
  border-radius: 17px;
}

.trk-header h2 {
  font-size: 28px;
  color: #114c5c;
  margin-bottom: 8px;
}

.trk-header p {
  color: #6c7b88;
  font-size: 16px;
  margin-bottom: 24px;
}

.trk-search-card {
  display: block;
  gap: 15px;
  margin-bottom: 0;
  flex-wrap: wrap;
}

.trk-input-group {
  flex: 1;
  position: relative;
}

.trk-input-group i {
  position: absolute;
  left: 12px;
  top: 50%;
  transform: translateY(-50%);
  color: #1b8d99;
}

.trk-input-group input {
  width: 100%;
  padding: 14px 14px 14px 40px;
  border-radius: 12px;
  border: 1px solid #d6e3e4;
  outline: none;
  font-size: 15px;
}

.trk-btn {
  background: linear-gradient(135deg, #114c5c, #1fa3b0);
  color: #fff;
  padding: 14px 24px;
  border-radius: 8px;
  border: none;
  font-size: 15px;
  font-weight: 500;
  cursor: pointer;
  display: ;
  align-items: center;
  gap: 6px;
  width: 100%;
  text-align: center;
  margin-top: 10px;
}










/* Reset */
* { box-sizing: border-box; margin: 0; padding: 0; }

/* Swiper container full width */
.m-banner { width: 100%; position: relative; }
.banner-slider{ position:relative; z-index: 10;}

/* Each slide full height */
.banner-slider .swiper-slide {
  position: relative;
  height: 500px; /* desktop height */
}

/* Images */
.banner-slider .banner-item img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
 
}

/* Content overlay */
.banner-slider .banner-content {
  position: absolute;
  top: 50%;
  left: auto;
  transform: translateY(-50%);
  color: #fff;
  max-width: 650px;
  z-index: 10;
}

/* Headline */
.banner-slider .banner-content h2 {
  font-size: 40px;
  margin-bottom: 3px;
  line-height: 1.2;
}

/* Paragraph */
.banner-slider .banner-content p {
  font-size: 18px;
  line-height: 1.5;
  margin-bottom: 25px;
  color: #424242;
}

/* Button */
.banner-slider .banner-content button {
  padding: 15px 35px;
  font-size: 18px;
  border: none;
  cursor: pointer;
  background-color: #e74c3c;
  color: #fff;
  border-radius: 6px;
  transition: 0.3s ease;
}
.banner-slider .banner-content button:hover { background-color: #c0392b; }

/* Tablet */
@media (max-width: 992px) {
  .banner-slider .swiper-slide { height: 550px; }
  .banner-slider .banner-content { left: 7%; max-width: 450px; }
  .banner-slider .banner-content h2 { font-size: 40px; }
  .banner-slider .banner-content p { font-size: 20px; }
  .banner-slider .banner-content button { font-size: 16px; padding: 12px 28px; }
}

/* Mobile */
@media (max-width: 576px) {
 .banner-slider  .swiper-slide { height: 500px; }
  .banner-slider .banner-content {
    left: 50%;
    transform: translate(-50%, -50%);
    text-align: center;
    max-width: 45%;
  }
  .banner-slider .banner-content h2 { font-size: 22px; }
  .banner-slider  .banner-content p { font-size: 15px;
    line-height: 19px; }
  .banner-slider .banner-content button { font-size: 14px; padding: 10px 25px; }
}

.mob-menu-show{ display:none!important; }














/* ===== SAME COLOR COMBINATION STYLE ===== */

.track-bn-extra{
    margin-top:0;
    display:flex;
    gap:30px;
    flex-direction: column;
}

.track-bn-box{
    background:transparent;
    border:0;
    border-radius:0;
    padding:0;
    box-shadow:none;
}

.track-bn-head{
    display:flex;
    justify-content:space-between;
    align-items:center;
    margin-bottom:28px;
}

.track-bn-head h3{
    font-size:22px;
    font-weight: 500;
    color:#083344;
}

.track-bn-head p{
    color:#64748b;
    margin-top:6px;
}

/* TOP CARDS */

.track-bn-cards{
    display:grid;
    grid-template-columns:repeat(2,1fr);
    gap:15px;
}

.track-bn-card{
    background:#f9fcfd;
    border-radius:15px;
    padding:20px;
    transition:.3s;
    position:relative;
    overflow:hidden;
    border: 1px solid #e9e9e9;
}

.track-bn-card:hover{
    transform:translateY(-4px);
    box-shadow:0 12px 30px rgba(14,165,183,.08);
}

.track-bn-card-icon{
    width:74px;
    height:74px;
    border-radius:50%;
    display:flex;
    align-items:center;
    justify-content:center;
    font-size:30px;
    margin-bottom:20px;
}

/* SAME COLORS */

.track-clr-green{
    background:#15999b12;
    color:#15999b;
    border: dashed 1px;
}

.track-clr-blue{
    background:#eaf6ff;
    color:#2563eb;
    background: #15999b12;
    color: #15999b;
    border: dashed 1px;
}

.track-clr-orange{
    background:#fff7ed;
    color:#ea580c;
    background: #15999b12;
    color: #15999b;
    border: dashed 1px;
}

.track-clr-purple{
    background:#f4ebff;
    color:#7c3aed;
    background: #15999b12;
    color: #15999b;
    border: dashed 1px;
}

.track-bn-card span{
    display:block;
    font-size:15px;
    color:#64748b;
    margin-bottom:10px;
}

.track-bn-card h4{
    font-size:20px;
    color:#114c5c;
    margin-bottom:8px;
    font-weight: 500;
}

.track-bn-card p{
    color:#626a6c;
    line-height:1.3;
    margin-bottom: 0;
    font-weight: 500;
}

/* ELIGIBILITY */

.track-bn-eligibility{
    display:grid;
    grid-template-columns:repeat(3,1fr);
    gap:22px;
}

.track-bn-eligibility-item{
    background:#f9fcfd;
    border:1px solid #e5f0f2;
    border-radius:28px;
    padding:32px;
    text-align:center;
    transition:.3s;
    background: #f9fcfd;
    border-radius: 15px;
    padding: 12px;
    transition: .3s;
    position: relative;
    overflow: hidden;
    border: 1px solid #e9e9e9;
    font-size: 12px;
}

.track-bn-eligibility-item:hover{
    transform:translateY(-3px);
}

.track-bn-eligibility-item i{
    width:70px;
    height:70px;
    border-radius:50%;
    display:flex;
    align-items:center;
    justify-content:center;
    margin:auto;
    margin-bottom:22px;
    font-size:34px;
}

.track-ok i{
    background:#ecfdf3;
    color:#16a34a;
    background: #15999b12;
    color: #15999b;
    border: dashed 1px;
}

.track-no i{
    background:#fef2f2;
    color:#dc2626;
    background: #15999b12;
    color: #15999b;
    border: dashed 1px;
}

.track-review i{
    background:#fff7ed;
    color:#d97706;
    background: #15999b12;
    color: #15999b;
    border: dashed 1px;
}

.track-bn-eligibility-item h4{
    font-size:20px;
    margin-bottom:9px;
    color:#083344;
    font-weight: 500;
}

.track-bn-eligibility-item p{
	color: #626a6c;
	line-height: 1.2;
	margin-bottom: 0;
	font-weight: 500;
	font-size: 17px;
}

/* QUICK ACTION */

.track-bn-actions{
    display:grid;
    grid-template-columns:repeat(2,1fr);
    gap:15px;
}

.track-bn-action-btn{
    height:65px;
    border:none;
    border-radius:10px;
    background:linear-gradient(135deg,#14b8a6,#0f766e);
    color:#fff;
    font-size:18px;
    font-weight: 500;
    display:flex;
    align-items:center;
    justify-content:center;
    gap:12px;
    cursor:pointer;
    transition:.3s;
    box-shadow:0 10px 25px rgba(20,184,166,.18);
    background: linear-gradient(135deg, #0d6879, #1ca3af);
}

.track-bn-action-btn:hover{
    transform:translateY(-4px);
}

/* ALERTS */

.track-bn-alerts{
    display:flex;
    flex-direction:column;
    gap:18px;
}

.track-bn-alert{
    background:#fff;
    border:1px solid #f1d6d6;
    border-radius:15px;
    padding:15px;
    display:flex;
    align-items:inherit;
    gap:15px;
}

.track-bn-alert i{
    width:50px;
    height:50px;
    border-radius:50%;
    background:#fff;
    color:#ff7474;
    display:flex;
    align-items:center;
    justify-content:center;
    font-size:24px;
    box-shadow:0 6px 20px rgba(162, 162, 162, 0.28);
    border: solid 1px #ffcaca;
}

.track-bn-alert h5{
    font-size:18px;
    color:#ff5151;
    margin-bottom:00;
    font-weight: 500;
}

.track-bn-alert p{
    color:#6c6c6c;
    margin-bottom: 0;
    font-size: 16px;
}

/* TIMELINE */

.track-bn-timeline{
    position:relative;
    padding-left:32px;
}

.track-bn-timeline::before{
    content:'';
    position:absolute;
    left:7px;
    top:0;
    width:3px;
    height:100%;
    background:#d8ebef;
}

.track-bn-timeline-item{
    position:relative;
    padding-bottom:010px;
}

.track-bn-timeline-dot{
    position:absolute;
    left:-35px;
    top:0;
    width:24px;
    height:24px;
    border-radius:50%;
    background:#15999b;
    border:5px solid #dff8f5;
}

.track-bn-timeline-card{
    background:#f9fcfd;
    border-radius:15px;
    padding:17px;
    border: 1px solid #e9e9e9;
}

.track-bn-timeline-card h4{
    font-size:18px;
    color:#083344;
    margin-bottom:0px;
}

.track-bn-timeline-card p{
    color:#5f6e6e;
    line-height:1.5;
    margin-bottom:12px;
    font-size: 18px;
}

.track-bn-time{
    color:#0f766e;
    font-weight:500;
    font-size: 16px;
}

/* RESPONSIVE */

@media(max-width:991px){

.track-bn-cards,
.track-bn-eligibility,
.track-bn-actions{
    grid-template-columns:repeat(2,1fr);
}

}

@media(max-width:768px){

.track-bn-box{
    padding:0;
}

.track-bn-cards,
.track-bn-eligibility,
.track-bn-actions{
    grid-template-columns: repeat(2,1fr);
}

.track-bn-head{
    flex-direction:column;
    align-items:flex-start;
    gap:8px;
    margin-bottom: 15px;
}

.track-bn-head h3{
    font-size:18px;
}

.track-bn-card h4{
    font-size:19px;
}

.track-bn-action-btn{
    height:50px;
    font-size:15px;
}

.track-bn-alert{
    flex-direction:column;
    align-items:flex-start;
}

}






























@media (max-width: 768px) {
  .banner-slider .banner-content {
    left: auto;
    transform: translate(-0%, -50%);
    text-align: left;
    max-width: 45%;
  }

.banner-slider .banner-content {
  position: absolute;
  top: 50%;}

  .banner-slider  .swiper-slide {
    height: auto;
    margin-bottom: 30px;
}


 .new-header-wrap .logo-section {
  width: 224px;
}


.stry-srv-w .stry-card-body {
    min-height: auto;
  }


   .stry-srv-w .stry-icon-wrap img {
    max-width: 50px;
    max-height: 50px;
  }

   .stry-srv-w .stry-icon-wrap {
    width: 80px;
    height: 80px;
    margin-bottom: 10px;
  }


  .stry-srv-w .stry-card-body {
    padding: 20px 10px 15px;
  }


  stry-srv-w .stry-card {
    height: fit-content;
  }


  .donate-row input {
  flex: 1;
  padding: 6px;}


  .btn-row a {
  display: block;
  color: #15999b;
  padding: 8px;
}

.content h3 {
  font-size: 17px;
}

.prog-cntnt {
  min-height: auto;
}

  .btn-default {
    padding: 12px 25px;
  }


   .stry-srv-w .stry-card {
    height: 220px;
  }


  .d-mt {
  font-size: 14px;
  margin-bottom: 6px;
  color: #444;
  text-align: left;
  margin-top: 13px;
}

.content h3 {
    font-size: 18px;
    text-align: left;
  }
.section-row .section-title {
    margin-bottom: 15px;
    text-align: left;
  }


.new-header-wrap .header-icons {
  display: flex;
  gap: 2px;
  font-size: 20px;
  color: #c5a059;
}

.mob-menu-show{ display:block!important; }
.mob-mnu-incs-st{display: flex;
  gap: 15px;
}


.login-mdn-form .desc {
  color: #667085;
  font-size: 15px;
  line-height: 1.4;
  margin-bottom: 20px;
}
 .uae-pass-btn, .login-mdn-submit, .login-mdn-input input {
    height: 45px;
  }
  

.login-mdn-mini-box strong {
  display: block;
  font-size: 20px;
  font-weight: 500;
  margin-bottom: 5px;
}

 .login-mdn-mini-box {
    padding: 11px 8px;
  }

.reg-page {
  min-height: auto;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 15px 15px;
  background: linear-gradient(0deg,rgb(255, 255, 255) 0%, rgba(159, 206, 207, 0.2) 50%, rgb(255, 255, 255) 100%);
}
  .reg-page h1 {
    font-size: 19px;
  }

.reg-page .sub-text {
  text-align: center;
  color: #6b7280;
  font-size: 16px;
  max-width: 600px;
  margin: auto;
  line-height: 1.4;
}

.reg-page .account-card {
    padding: 15px 8px;
  }


.reg-page .account-card h3 {
  font-size: 18px;
  color: #1f2937;
  margin-bottom: 4px;
}

.reg-page .icon-box img {
  width: 45px;
}

.reg-page .icon-box {
  width: 75px;
  height: 75px;
  border-radius: 50%;
  background: #f6fafb;
  display: flex;
  align-items: center;
  justify-content: center;
  margin: auto;
    margin-bottom: auto;
  margin-bottom: 7px;
  transition: 0.3s;
  border: dashed 1px #15999b;
}
.reg-page .account-card p {
  margin-bottom: 0;
}

.reg-page .btn-wrap {
  margin-top: 20px;
  text-align: center;
}


  .reg-page .account-grid {
    grid-template-columns: repeat(2,1fr);
    max-width: 100%;
    margin-top: 20px;
    gap: 15px;
  }


.Merited-wrap .info-card h3 {
  color: #fff;
  font-size: 20px;
  margin-bottom: 3px;
}

.Merited-wrap .left-content p {
  color: rgba(255,255,255,0.88);
  font-size: 14px;
  line-height: 1.2;
  max-width: 700px;
}


.Merited-wrap .left-side {
    min-height: 90px;
  }
  
.Merited-wrap .input-box input {
  width: 100%;
  height: 45px;
  border-radius: 9px;
  border: 1px solid #dbe5ea;
  background: #f8fbfc;
  padding: 0px 15px;
  outline: none;
  font-size: 15px;
  transition: 0.3s ease;
}

.Merited-wrap .register-btn {
  width: 100%;
  height: 50px;
  border: none;
  border-radius: 9px;}


  .Merited-wrap .info-card {
  padding: 11px;
  border-radius: 15px;}

   .Merited-wrap .left-content p {
    color: rgba(255,255,255,0.88);
    font-size: 14px;
    line-height: 1.2;
    max-width: 700px;
    margin-bottom: 0;


}

}




















/* =========================================
UPLOAD CENTER
========================================= */

.doc-upload-center{
    display:grid;
    grid-template-columns:1.5fr 1fr;
    gap:15px;
}

.doc-upload-box{
    background:linear-gradient(135deg,#f2fbfc,#f8feff);
    border:2px dashed #bfe8eb;
    border-radius:20px;
    padding:30px 15px;
    text-align:center;
}

.doc-upload-box i{
    font-size:39px;
    color:#14b8a6;
    margin-bottom:5px;
}

.doc-upload-box h5{
    font-size:20px;
    color:#083344;
    margin-bottom:0px;
    font-weight: 500;
}

.doc-upload-box p{
    color:#64748b;
    margin-bottom:10px;
    line-height:1.7;
    font-size: 15px;
}

.doc-upload-box button{
    height:45px;
    padding:0 30px;
    border:none;
    border-radius:10px;
    background:linear-gradient(135deg,#14b8a6,#0f766e);
    color:#fff;
    font-size:16px;
    font-weight: 500;
    cursor:pointer;
    transition:.3s;
}

.doc-upload-box button:hover{
    transform:translateY(-3px);
}

.doc-upload-features{
    display:flex;
    flex-direction:column;
    gap:20px;
}

.doc-feature-card{
    background:#f9fcfd;
    border:1px solid #cfe2e5;
    border-radius:12px;
    padding:19px;
    display:flex;
    align-items:flex-start;
    gap:18px;
}

.doc-feature-icon{
    width:55px;
    height:55px;
    border-radius:50%;
    background:linear-gradient(135deg,#14b8a6,#0f766e);
    display:flex;
    align-items:center;
    justify-content:center;
    color:#fff;
    font-size:24px;
    flex-shrink:0;
}

.doc-feature-card h6{
    font-size:17px;
    color:#083344;
    margin-bottom:2px;
    font-weight: 500;
}

.doc-feature-card p{
    color:#64748b;
    line-height:1.5;
    font-size: 15px;
    margin-bottom: 0;
}

/* =========================================
INPUT STYLE
========================================= */

.bn-profile-card input,
.bn-profile-card select{
    width:100%;
    height:55px;
    border:1px solid #dbecef;
    border-radius:10px;
    padding:0 18px;
    background:#fff;
    font-size:15px;
    color:#083344;
    outline:none;
}

.bn-profile-card input[type="file"]{
    padding:15px;
}

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

@media(max-width:991px){

.doc-upload-center{
    grid-template-columns:1fr;
}

}

@media(max-width:768px){

.doc-upload-box{
    padding:35px 20px;
}

.doc-upload-box h5{
    font-size:24px;
}

.doc-feature-card{
    flex-direction:column;
}

}














/* =====================================
DRAG & DROP UPLOAD
===================================== */

.doc-drag-upload{
    width:100%;
}

.doc-drag-box{
    background:linear-gradient(135deg,#f2fbfc,#f8feff);
    border:2px dashed #bfe8eb;
    border-radius:15px;
    padding:15px 20px;
    text-align:center;
    transition:.3s;
    position:relative;
    overflow:hidden;
}

.doc-drag-box.active{
    border-color:#14b8a6;
    background:#ecfeff;
    transform:scale(1.01);
}

.doc-drag-icon{
    width:auto;
    height:auto;
    border-radius:20px;
    background:transparent;
    display:flex;
    align-items:center;
    justify-content:center;
    margin:auto;
    margin-bottom:10px;
    box-shadow:none;
    color: #000;
}

.doc-drag-icon i{
    color:#8ccccd;
    font-size:39px;
}

.doc-drag-box h4{
    font-size:20px;
    color:#083344;
    margin-bottom:1px;
    font-weight: 500;
}

.doc-drag-box p{
    color:#64748b;
    font-size:14px;
    margin-bottom:21px;
    line-height:1.7;
}

.doc-drag-box button{
    height:45px;
    padding:0 34px;
    border:none;
    border-radius:10px;
    background:linear-gradient(135deg,#215a6a,#15999b);
    color:#fff;
    font-size:16px;
    font-weight: 500;
    cursor:pointer;
    transition:.3s;
    margin-bottom:11px;
    box-shadow:0 10px 25px rgba(20,184,166,.18);
}

.doc-drag-box button:hover{
    transform:translateY(-3px);
}

.doc-upload-note{
    display:block;
    color:#1f6472;
    font-weight:500;
    font-size:14px;
}

/* FILE LIST */

.doc-upload-list{
    margin-top:24px;
    display:flex;
    flex-direction:column;
    gap:16px;
}

.doc-file-item{
    background:#f9fcfd;
    border:1px solid #e5f1f3;
    border-radius:22px;
    padding:18px 22px;
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:20px;
}

.doc-file-left{
    display:flex;
    align-items:center;
    gap:16px;
}

.doc-file-icon{
    width:58px;
    height:58px;
    border-radius:50%;
    background:#e0f7fa;
    display:flex;
    align-items:center;
    justify-content:center;
    color:#15999b;
    font-size:22px;
    border: dashed 1px;
}

.doc-file-info h5{
    font-size:18px;
    color:#083344;
    margin-bottom:5px;
}

.doc-file-info span{
    color:#64748b;
    font-size:14px;
}

.doc-remove{
    width:44px;
    height:44px;
    border:none;
    border-radius:14px;
    background:#fef2f2;
    color:#dc2626;
    cursor:pointer;
    font-size:16px;
}

/* RESPONSIVE */

@media(max-width:768px){

.doc-drag-box{
    padding:40px 20px;
}

.doc-drag-box h4{
    font-size:26px;
}

.doc-file-item{
    flex-direction:column;
    align-items:flex-start;
}

}










/* =========================================
VERIFY GRID
========================================= */

.verify-grid{
    display:grid;
    grid-template-columns:repeat(2,1fr);
    gap:24px;
}

.verify-card{
    background:#f9fcfd;
    border-radius:28px;
    padding:28px;
    border:1px solid #e4f1f3;
    transition:.3s;
}

.verify-card:hover{
    transform:translateY(-4px);
}

.verify-top{
    display:flex;
    align-items:center;
    justify-content:space-between;
    margin-bottom:22px;
}

.verify-icon{
    width:68px;
    height:68px;
    border-radius:22px;
    display:flex;
    align-items:center;
    justify-content:center;
    font-size:28px;
}

.verify-status{
    padding:10px 18px;
    border-radius:50px;
    font-size:14px;
    font-weight: 500;
}

.verify-card h5{
    font-size:26px;
    color:#083344;
    margin-bottom:12px;
    font-weight: 500;
}

.verify-card p{
    color:#64748b;
    line-height:1.8;
}

/* SUCCESS */

.verify-card.success .verify-icon{
    background:#ecfdf3;
    color:#16a34a;
}

.verify-card.success .verify-status{
    background:#dcfce7;
    color:#15803d;
}

/* WARNING */

.verify-card.warning .verify-icon{
    background:#fff7ed;
    color:#ea580c;
}

.verify-card.warning .verify-status{
    background:#ffedd5;
    color:#c2410c;
}

/* PENDING */

.verify-card.pending .verify-icon{
    background:#eff6ff;
    color:#2563eb;
}

.verify-card.pending .verify-status{
    background:#dbeafe;
    color:#1d4ed8;
}

/* =========================================
ELIGIBILITY ENGINE
========================================= */

.eligibility-engine{
    display:flex;
    flex-direction:column;
    gap:20px;
}

.eligibility-card{
    display:flex;
    align-items:flex-start;
    gap:20px;
    padding:26px;
    border-radius:26px;
    border:1px solid #e5f1f3;
    background:#f9fcfd;
}

.eligibility-icon{
    width:70px;
    height:70px;
    border-radius:22px;
    display:flex;
    align-items:center;
    justify-content:center;
    font-size:28px;
    flex-shrink:0;
}

.eligibility-card h5{
    font-size:24px;
    color:#083344;
    margin-bottom:10px;
    font-weight: 500;
}

.eligibility-card p{
    color:#64748b;
    line-height:1.8;
}

/* DANGER */

.eligibility-card.danger .eligibility-icon{
    background:#fef2f2;
    color:#dc2626;
}

/* WARNING */

.eligibility-card.warning .eligibility-icon{
    background:#fff7ed;
    color:#ea580c;
}

/* PENDING */

.eligibility-card.pending .eligibility-icon{
    background:#eff6ff;
    color:#2563eb;
}

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

@media(max-width:991px){

.verify-grid{
    grid-template-columns:1fr;
}

}

@media(max-width:768px){

.verify-card{
    padding:22px;
}

.verify-card h5{
    font-size:22px;
}

.eligibility-card{
    flex-direction:column;
}

}











/* =========================================
VERIFY GRID
========================================= */

.verify-grid{
    display:grid;
    grid-template-columns:repeat(2,1fr);
    gap:24px;
}

.verify-card{
    background:#f6fdff;
    border-radius:15px;
    padding:20px;
    border:1px solid #e4f1f3;
    transition:.3s;
}

.verify-card:hover{
    transform:translateY(-4px);
}

.verify-top{
    display:flex;
    align-items:center;
    justify-content:space-between;
    margin-bottom:22px;
}

.verify-icon{
    width:68px;
    height:68px;
    border-radius:22px;
    display:flex;
    align-items:center;
    justify-content:center;
    font-size:28px;
}

.verify-status{
    padding:10px 18px;
    border-radius:50px;
    font-size:14px;
    font-weight: 500;
}

.verify-card h5{
    font-size:18px;
    color:#083344;
    margin-bottom:1px;
    font-weight: 500;
}

.verify-card p{
    color:#64748b;
    line-height:1.5;
    margin-bottom: 0;
    font-size: 17px;
}

/* SUCCESS */

.verify-card.success .verify-icon{
    background:#ecfdf3;
    color:#16a34a;
    background: linear-gradient(135deg,#ffffff21,#ffffff1c);
    display: flex;
    align-items: center;
    justify-content: center;
    color: #15999b;
    border: dashed 1px #238190;
    border-radius: 50%;
}

.verify-card.success .verify-status{
    background:#dcfce7;
    color:#15803d;
}

/* WARNING */

.verify-card.warning .verify-icon{
    background:#fff7ed;
    color:#ea580c;
    background: linear-gradient(135deg,#ffffff21,#ffffff1c);
    display: flex;
    align-items: center;
    justify-content: center;
    color: #15999b;
    border: dashed 1px #238190;
    border-radius: 50%;
}

.verify-card.warning .verify-status{
    background:#ffedd5;
    color:#c2410c;
}

/* PENDING */

.verify-card.pending .verify-icon{
    background:#eff6ff;
    color:#2563eb;
    background: linear-gradient(135deg,#ffffff21,#ffffff1c);
    display: flex;
    align-items: center;
    justify-content: center;
    color: #15999b;
    border: dashed 1px #238190;
    border-radius: 50%;
}

.verify-card.pending .verify-status{
    background:#dbeafe;
    color:#1d4ed8;
}

/* =========================================
ELIGIBILITY ENGINE
========================================= */

.eligibility-engine{
    display:flex;
    flex-direction:column;
    gap:20px;
}

.eligibility-card{
    display:flex;
    align-items:flex-start;
    gap:20px;
    padding:20px;
    border-radius:15px;
    border:1px solid #e5f1f3;
    background:#f9fcfd;
}

.eligibility-icon{
    width:60px;
    height:60px;
    border-radius:22px;
    display:flex;
    align-items:center;
    justify-content:center;
    font-size:22px;
    flex-shrink:0;
}

.eligibility-card h5{
    font-size:18px;
    color:#083344;
    margin-bottom:2px;
    font-weight: 500;
}

.eligibility-card p{
    color:#64748b;
    line-height:1.5;
    margin-bottom: 0px;
    font-size: 16px;
}

/* DANGER */

.eligibility-card.danger .eligibility-icon{
    background:#fef2f2;
    color:#dc2626;
    border: dashed 1px;
    border-radius: 50%;
    opacity: .8;
}

/* WARNING */

.eligibility-card.warning .eligibility-icon{
    background:#fff7ed;
    color:#ea580c;
    border: dashed 1px;
    border-radius: 50%;
    opacity: .8;
}

/* PENDING */

.eligibility-card.pending .eligibility-icon{
    background:#eff6ff;
    color:#2563eb;
    border: dashed 1px;
    border-radius: 50%;
    opacity: .8;
}

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

@media(max-width:991px){

.verify-grid{
    grid-template-columns:1fr;
}

}

@media(max-width:768px){

.verify-card{
    padding:22px;
}

.verify-card h5{
    font-size:22px;
}

.eligibility-card{
    flex-direction:column;
}

}




































/* =========================================
TEXTAREA
========================================= */

.bn-profile-card textarea{
    width:100%;
    min-height:140px;
    border:1px solid #dbecef;
    border-radius:18px;
    padding:18px;
    background:#fff;
    font-size:15px;
    color:#083344;
    outline:none;
    resize:none;
}

.bn-full-width{
    grid-column:span 2;
}

/* =========================================
AID CATEGORY
========================================= */

.aid-category-grid{
    display:grid;
    grid-template-columns:repeat(5,1fr);
    gap:20px;
}

.aid-category-card{
    background:#f9fcfd;
    border:1px solid #e5f1f3;
    border-radius:15px;
    padding:21px 12px;
    text-align:center;
    transition:.3s;
    cursor:pointer;
}

.aid-category-card:hover{
    transform:translateY(-4px);
}

.aid-category-card.active{
    background:linear-gradient(135deg,#15999b,#114c5c);
}

.aid-category-card i{
    font-size:27px;
    color:#14b8a6;
    margin-bottom:18px;
}

.aid-category-card.active i,
.aid-category-card.active h5{
    color:#fff;
}

.aid-category-card h5{
    font-size:16px;
    color:#083344;
    font-weight: 500;
}

.donate-swiper-shell .swiper-slide{
    height:auto;
}

.donate-swiper-card{
    display:flex;
    flex-direction:column;
    justify-content:space-between;
    min-height:314px;
    border:1px solid #b9e3ee;
    border-radius:18px;
    overflow:hidden;
    background:#edf9fe;
    box-shadow:0 18px 36px rgba(17,76,92,0.06);
    transition:transform .25s ease, box-shadow .25s ease;
}

.donate-swiper-card:hover{
    transform:translateY(-6px);
    box-shadow:0 24px 48px rgba(17,76,92,0.12);
}

.donate-swiper-body{
    flex:1;
    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:center;
    text-align:center;
    padding:26px 24px 22px;
}

.donate-swiper-icon{
    width:138px;
    height:138px;
    border:1.5px dashed #18b1c5;
    border-radius:50%;
    background:#fff;
    display:flex;
    align-items:center;
    justify-content:center;
    margin:0 auto 28px;
}

.donate-swiper-icon img{
    max-width:72px;
    width:100%;
    height:auto;
}

.donate-swiper-title{
    margin:0;
    color:#0b4f6f;
    font-size:20px;
    font-weight:700;
    line-height:1.35;
}

.donate-swiper-btn{
    width:100%;
    min-height:66px;
    border:0;
    border-radius:0 0 18px 18px;
    background:linear-gradient(135deg,#1b9aa0,#177d95);
    color:#fff;
    font-size:18px;
    font-weight:700;
    transition:background .2s ease, letter-spacing .2s ease;
}

.donate-swiper-btn:hover{
    background:linear-gradient(135deg,#168f97,#136d84);
    letter-spacing:.01em;
}

/* =========================================
ATTACHMENTS
========================================= */

.attachment-grid{
    display:flex;
    flex-direction:column;
    gap:20px;
}

.attachment-card{
    background:#f9fcfd;
    border:1px solid #e5f1f3;
    border-radius:15px;
    padding:15px;
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:17px;
}

.attachment-icon{
    width:60px;
    height:60px;
    border-radius:22px;
    background:linear-gradient(135deg,#15999b,#0d697a);
    display:flex;
    align-items:center;
    justify-content:center;
    color:#fff;
    font-size:28px;
    border-radius: 50%;
}

.attachment-info{
    flex:1;
}

.attachment-info h5{
    font-size:17px;
    color:#083344;
    margin-bottom:0px;
}

.attachment-info p{
    color:#64748b;
    margin-bottom: 0;
    font-size: 17px;
}

.attachment-card button{
    height:36px;
    padding:0 16px;
    border:none;
    border-radius:8px;
    background:#138b9217;
    color:#0f766e;
    font-weight:500;
    cursor:pointer;
    font-size: 15px;
}

/* =========================================
REQUEST STATUS
========================================= */

.request-status-wrap{
    display:grid;
    grid-template-columns:repeat(5,1fr);
    gap:18px;
}

.request-status-card{
    background:#13a9991c;
    border:1px solid #e5f1f3;
    border-radius:10px;
    padding:17px 20px;
    text-align:center;
    transition:.3s;
}

.request-status-card i{
    font-size:20px;
    margin-bottom:12px;
}

.request-status-card h5{
    font-size:15px;
    font-weight:500;
}

/* COLORS */

.draft i{ color:#64748b; }

.submitted i{ color:#2563eb; }

.review i{ color:#ea580c; }

.approved i{ color:#16a34a; }

.rejected i{ color:#dc2626; }

.request-status-card.active{
    background:linear-gradient(135deg,#14b8a6,#0f766e);
}

.request-status-card.active i,
.request-status-card.active h5{
    color:#fff;
}

/* =========================================
COMMITTEE
========================================= */

.committee-wrap{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:24px;
}

.committee-card{
    background:#f9fcfd;
    border:1px solid #e5f1f3;
    border-radius:15px;
    padding:20px;
    display:flex;
    align-items:flex-start;
    gap:20px;
}

.committee-icon{
    width:65px;
    height:65px;
    border-radius:50%;
    background:linear-gradient(135deg,#14b8a6,#0f766e);
    display:flex;
    align-items:center;
    justify-content:center;
    color:#fff;
    font-size:30px;
    flex-shrink:0;
}

.committee-card span{
    color:#64748b;
    font-size:15px;
    display:block;
    margin-bottom:8px;
}

.committee-card h3{
    font-size:20px;
    color:#083344;
    font-weight: 500;
}

.committee-card p{
    color:#64748b;
    line-height:1.3;
    font-size: 16px;
    margin-bottom: 0;
}

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

@media(max-width:1200px){

.aid-category-grid{
    grid-template-columns:repeat(3,1fr);
}

.request-status-wrap{
    grid-template-columns:repeat(3,1fr);
}

}

@media(max-width:991px){

.committee-wrap{
    grid-template-columns:1fr;
}

}

@media(max-width:768px){

.bn-full-width{
    grid-column:span 1;
}

.aid-category-grid{
    grid-template-columns:repeat(2,1fr);
}

.request-status-wrap{
    grid-template-columns:repeat(2,1fr);
}

.attachment-card{
    flex-direction:column;
    align-items:flex-start;
}

.committee-card{
    flex-direction:column;
}

}















/* =========================================
TRACK WRAP
========================================= */

.app-track-wrap{
    position:relative;
}

/* =========================================
TRACK ITEM
========================================= */

.app-track-item{
    display:flex;
    gap:24px;
    margin-bottom:30px;
}

.app-track-left{
    display:flex;
    flex-direction:column;
    align-items:center;
}

.app-track-icon{
    width:50px;
    height:50px;
    border-radius:50%;
    display:flex;
    align-items:center;
    justify-content:center;
    font-size:20px;
    position:relative;
    z-index:2;
}

.app-track-line{
    width:4px;
    flex:1;
    background:#d9ecef;
    margin-top:10px;
    border-radius:10px;
}

/* =========================================
CARD
========================================= */

.app-track-card{
    flex:1;
    background:#ecf7f7;
    border:1px solid #addae2;
    border-radius:16px;
    padding:20px;
    transition:.3s;
}

.app-track-card:hover{
    transform:translateY(-3px);
}

.app-track-top{
    display:flex;
    align-items:center;
    justify-content:space-between;
    margin-bottom:13px;
}

.track-status{
    padding:7px 18px;
    border-radius:49px;
    font-size:13px;
    font-weight: 500;
}

.track-date{
    color:#64748b;
    font-size:15px;
    font-weight:500;
}

.app-track-card h4{
    font-size:19px;
    color:#083344;
    margin-bottom:7px;
    font-weight: 500;
}

/* =========================================
INFO GRID
========================================= */

.track-info-grid{
    display:grid;
    grid-template-columns:1fr 2fr;
    gap:20px;
}

.track-info-box{
    background:#fff;
    border-radius:10px;
    padding:16px;
    border:1px solid #edf4f5;
}

.track-info-box span{
    display:block;
    color:#64748b;
    font-size:15px;
    margin-bottom:4px;
    font-weight:500;
}

.track-info-box h5{
    color:#083344;
    font-size:17px;
    font-weight: 500;
}

.track-info-box p{
    color:#64748b;
    line-height:1.8;
    margin-bottom: 0;
}

/* =========================================
COMPLETED
========================================= */

.app-track-item.completed .app-track-icon{
    background:#15999b1c;
    color:#15999b;
}

.app-track-item.completed .track-status{
    background:#dcfce7;
    color:#15803d;
}

/* =========================================
ACTIVE
========================================= */

.app-track-item.active .app-track-icon{
    background:linear-gradient(135deg,#14b8a6,#0f766e);
    color:#fff;
    box-shadow:0 15px 35px rgba(20,184,166,.18);
}

.app-track-item.active .track-status{
    background:#ccfbf1;
    color:#0f766e;
}

/* =========================================
PENDING
========================================= */

.app-track-item.pending .app-track-icon{
    background:#f1f5f9;
    color:#64748b;
}

.app-track-item.pending .track-status{
    background:#fff;
    color:#475569;
}

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

@media(max-width:991px){

.track-info-grid{
    grid-template-columns:1fr;
}

}

@media(max-width:768px){

.app-track-item{
    gap:16px;
}

.app-track-icon{
    width:50px;
    height:50px;
    font-size:16px;
    border-radius:50%;
}

.app-track-card{
    padding:13px;
    border-radius: 10px;
}

.app-track-card h4{
    font-size:18px;
}

.app-track-top{
    flex-direction:column;
    align-items:flex-start;
    gap:12px;
}

}
























/* =========================================
MAIN WRAP
========================================= */

.appoint-main-wrap{
    padding:40px 0;
    border-radius:40px;
    background:transparent;
}

/* =========================================
HEADER
========================================= */

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

.appoint-mini-title{
    display:inline-block;
    padding:10px 18px;
    border-radius:50px;
    background:#ccfbf1;
    color:#0f766e;
    font-size:13px;
    font-weight: 500;
    margin-bottom:16px;
}

.appoint-head-wrap h2{
    font-size:19px;
    color:#083344;
    margin-bottom:1px;
    font-weight: 500;
    font-size: clamp(27px, 1.5vw, 24px);
    line-height: 1.08;
}

.appoint-head-wrap p{
    color:#64748b;
    line-height:1.8;
    max-width:max-content;
    font-size: 16px;
}

.appoint-book-btn{
    height:50px;
    border:none;
    padding:0 27px;
    border-radius:10px;
    background:linear-gradient(135deg,#14b8a6,#0f766e);
    color:#fff;
    font-size:15px;
    font-weight: 500;
    display:flex;
    align-items:center;
    gap:12px;
    cursor:pointer;
    box-shadow:0 15px 40px rgba(20,184,166,.18);
}

/* =========================================
TOP CARDS
========================================= */

.appoint-top-grid{
    display:grid;
    grid-template-columns:repeat(4,1fr);
    gap:24px;
    margin-bottom:35px;
}

.appoint-top-card{
    background:#ddf4f166;
    border-radius:10px;
    padding:10px;
    border:1px solid #d8edf1;
    display:flex;
    align-items:center;
    gap:18px;
}

.appoint-top-icon{
    width:50px;
    height:50px;
    border-radius:50%;
    background:#15999b;
    color:#fff;
    display:flex;
    align-items:center;
    justify-content:center;
    font-size:18px;
}

.appoint-top-icon.orange{
    background:#fff7ed;
    color:#ea580c;
    background: #15999b;
    color: #fff;
}

.appoint-top-icon.blue{
    background:#eff6ff;
    color:#2563eb;
    background: #15999b;
    color: #fff;
}

.appoint-top-icon.green{
    background:#dcfce7;
    color:#16a34a;
    background: #15999b;
    color: #fff;
}

.appoint-top-card span{
    display:block;
    color:#64748b;
    margin-bottom:1px;
    font-size:14px;
}

.appoint-top-card h3{
    color:#083344;
    font-size:16px;
    font-weight: 500;
}

/* =========================================
MAIN GRID
========================================= */

.appoint-main-grid{
    display:grid;
    grid-template-columns:1.5fr 1fr;
    gap:28px;
}

/* =========================================
COMMON BOX
========================================= */

.appoint-box,
.appoint-queue-box,
.appoint-history-box{
    background:#fff;
    border-radius:15px;
    border:1px solid #e5f1f3;
    padding:20px;
    margin-bottom:28px;
}

.appoint-active-box{
    background:linear-gradient(135deg,#28acae,#114c5c);
}

/* =========================================
TOP SECTION
========================================= */

.appoint-box-top{
    display:flex;
    align-items:flex-start;
    justify-content:space-between;
    gap:20px;
    margin-bottom:30px;
}

.appoint-title-wrap{
    display:flex;
    gap:20px;
}

.appoint-main-icon{
    width:50px;
    height:50px;
    border-radius:50%;
    background:#ecfeff;
    color:#14b8a6;
    display:flex;
    align-items:center;
    justify-content:center;
    font-size:27px;
}

.appoint-active-box .appoint-main-icon{
    background:rgba(255,255,255,.14);
    color:#fff;
}

.appoint-title-wrap span{
    display:block;
    color:#64748b;
    margin-bottom:3px;
    font-size: 15px;
}

.appoint-title-wrap h3{
    color:#083344;
    font-size:20px;
    font-weight: 500;
}

.appoint-active-box .appoint-title-wrap span,
.appoint-active-box .appoint-title-wrap h3{
    color:#fff;
}

.appoint-status-badge{
    background:#dcfce7e8;
    color:#15803d;
    padding:7px 16px;
    border-radius:50px;
    font-size:14px;
    font-weight: 500;
}

/* =========================================
INFO GRID
========================================= */

.appoint-info-grid{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:18px;
}

.appoint-info-card{
    background:#f9fcfd;
    border-radius:10px;
    padding:15px;
}

.appoint-active-box .appoint-info-card{
    background:rgba(255,255,255,.10);
}

.appoint-info-card span{
    display:block;
    color:#64748b;
    margin-bottom:5px;
    font-size:16px;
}

.appoint-info-card h5{
    color:#083344;
    font-size:18px;
    font-weight: 500;
}

.appoint-active-box .appoint-info-card span,
.appoint-active-box .appoint-info-card h5{
    color:#fff;
}

/* =========================================
SECTION HEAD
========================================= */

.appoint-section-head{
    margin-bottom:25px;
}

.appoint-section-head h4{
    color:#083344;
    font-size:21px;
    margin-bottom:3px;
    font-weight: 500;
}

.appoint-section-head p{
    color:#64748b;
    font-size: 16px;
}

/* =========================================
BOOKING
========================================= */

.appoint-booking-grid{
    display:flex;
    flex-direction:column;
    gap:18px;
}

.appoint-booking-card{
    border:1px solid #cce5e9;
    border-radius:15px;
    padding:15px;
    display:flex;
    align-items:center;
    gap:20px;
    position:relative;
}

.appoint-booking-card.active{
    border-color:#14b8a6;
    box-shadow:0 15px 35px rgba(20,184,166,.10);
}

.appoint-booking-icon{
    width:60px;
    height:60px;
    border-radius:50%;
    background:#ccfbf1;
    color:#14b8a6;
    display:flex;
    align-items:center;
    justify-content:center;
    font-size:28px;
}

.appoint-booking-icon.blue{
    background:#eff6ff;
    color:#2563eb;
}

.appoint-booking-content h5{
    font-size:16px;
    color:#083344;
    margin-bottom:4px;
    font-weight: 500;
}

.appoint-booking-content p{
    color:#64748b;
    line-height:1.4;
    font-size: 15px;
    margin-bottom: 0;
}

.appoint-check{
    position:absolute;
    top:20px;
    right:20px;
    width:28px;
    height:28px;
    border-radius:50%;
    background:#14b8a6;
    color:#fff;
    display:flex;
    align-items:center;
    justify-content:center;
}

/* =========================================
QUEUE
========================================= */

.appoint-queue-top{
    display:flex;
    align-items:center;
    gap:20px;
    margin-bottom:28px;
}

.appoint-queue-icon{
    width:70px;
    height:70px;
    border-radius:50%;
    background:linear-gradient(135deg,#14b8a6,#0f766e);
    color:#fff;
    display:flex;
    align-items:center;
    justify-content:center;
    font-size:29px;
}

.appoint-queue-top span{
    display:block;
    color:#64748b;
    margin-bottom:4px;
    font-size: 16px;
}

.appoint-queue-top h3{
    color:#083344;
    font-size:18px;
    font-weight: 500;
}

.appoint-queue-number{
    background:#f5fbfc;
    border-radius:20px;
    padding:15px;
    text-align:center;
    margin-bottom:18px;
}

.appoint-queue-number span{
    color:#64748b;
}

.appoint-queue-number h1{
    font-size:50px;
    color:#14b8a6;
    line-height:1;
    margin-top:12px;
    font-weight: 500;
}

.appoint-progress-bar{
    height:10px;
    background:#e2e8f0;
    border-radius:30px;
    overflow:hidden;
    margin-bottom:18px;
}

.appoint-progress-fill{
    width:75%;
    height:100%;
    border-radius:30px;
    background:linear-gradient(135deg,#14b8a6,#0f766e);
}

.appoint-queue-footer{
    display:flex;
    justify-content:space-between;
    color:#64748b;
    font-size: 15px;
}

.appoint-queue-footer strong{
    color:#083344;
}

/* =========================================
HISTORY
========================================= */

.appoint-history-list{
    display:flex;
    flex-direction:column;
    gap:24px;
}

.appoint-history-item{
    display:flex;
    gap:18px;
}

.appoint-history-dot{
    width:18px;
    height:18px;
    border-radius:50%;
    background:#14b8a6;
    margin-top:0;
    position:relative;
    flex-shrink:0;
}

.appoint-history-dot.green{
    background:#14b8a6;
    padding: 0;
}

.appoint-history-dot.blue{
    background:#2563eb;
}

.appoint-history-dot::after{
    content:'';
    position:absolute;
    top:20px;
    left:50%;
    transform:translateX(-50%);
    width:2px;
    height:85px;
    background:#dbecec;
}

.appoint-history-item:last-child .appoint-history-dot::after{
    display:none;
}

.appoint-history-top{
    display:flex;
    justify-content:space-between;
    gap:20px;
    margin-bottom:1px;
}

.appoint-history-top h5{
    font-size:16px;
    color:#083344;
    font-weight: 500;
}

.appoint-history-top span{
    color:#64748b;
    font-size:13px;
}

.appoint-history-content p{
    color:#64748b;
    line-height:1.5;
    font-size: 15px;
    margin-bottom: 10px;
}

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

@media(max-width:1200px){

.appoint-top-grid{
    grid-template-columns:repeat(2,1fr);
}

}

@media(max-width:991px){

.appoint-main-grid{
    grid-template-columns:1fr;
}

}

@media(max-width:768px){

.appoint-main-wrap{
    padding:22px 0;
}

.appoint-head-wrap{
    flex-direction:column;
    align-items:flex-start;
}

.appoint-top-grid{
    grid-template-columns:1fr;
}

.appoint-info-grid{
    grid-template-columns:1fr;
}

.appoint-box-top{
    flex-direction:column;
}

.appoint-title-wrap{
    flex-direction:column;
}

.appoint-history-top{
    flex-direction:column;
}

.appoint-head-wrap h2{
    font-size:19px;
    line-height: inherit;
}

.appoint-title-wrap h3,
.appoint-section-head h4,
.appoint-queue-top h3{
    font-size:18px;
}

.appoint-queue-number h1{
    font-size:52px;
}

}






















/* =========================================
MAIN WRAP
========================================= */

.notify-sec-wrap{
    padding:0;
    border-radius:40px;
    background:transparent;
}

/* =========================================
HEADER
========================================= */

.notify-sec-head{
    margin-bottom:30px;
}

.notify-sec-tag{
    display:inline-block;
    padding:10px 18px;
    border-radius:50px;
    background:#ccfbf1;
    color:#0f766e;
    font-size:13px;
    font-weight: 500;
    margin-bottom:16px;
}

.notify-sec-head h2{
    font-size:42px;
    font-weight: 500;
    color:#083344;
    margin-bottom:12px;
}

.notify-sec-head p{
    color:#64748b;
    line-height:1.8;
    max-width:700px;
}

/* =========================================
PURPOSE CARD
========================================= */

.notify-purpose-card{
    background:linear-gradient(135deg,#14b8a6,#0f766e);
    border-radius:30px;
    padding:30px;
    display:flex;
    align-items:center;
    gap:24px;
    margin-bottom:35px;
}

.notify-purpose-icon{
    width:85px;
    height:85px;
    border-radius:26px;
    background:rgba(255,255,255,.15);
    color:#fff;
    display:flex;
    align-items:center;
    justify-content:center;
    font-size:34px;
    flex-shrink:0;
}

.notify-purpose-card span{
    display:block;
    color:#d1fae5;
    margin-bottom:8px;
    font-size:14px;
}

.notify-purpose-card h4{
    color:#fff;
    font-size:30px;
    font-weight: 500;
}

/* =========================================
GRID
========================================= */

.notify-grid-wrap{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:28px;
}

/* =========================================
BOX CARD
========================================= */

.notify-box-card{
    background:transparent;
    border-radius:32px;
    padding:0;
    border:0;
}

.notify-box-head{
    display:flex;
    align-items:center;
    gap:18px;
    margin-bottom:30px;
}

.notify-box-icon{
    width:75px;
    height:75px;
    border-radius:24px;
    background:#ecfeff;
    color:#14b8a6;
    display:flex;
    align-items:center;
    justify-content:center;
    font-size:30px;
}

.notify-box-icon.teal-bg{
    background:#ccfbf1;
}

.notify-box-head h3{
    font-size:22px;
    color:#083344;
    font-weight: 500;
    margin-bottom:2px;
}

.notify-box-head p{
    color:#64748b;
}

/* =========================================
LIST ITEM
========================================= */

.notify-list-item{
    display:flex;
    align-items:flex-start;
    gap:18px;
    padding:20px;
    border-radius:15px;
    background:#cfe3e54f;
    margin-bottom:18px;
    border:1px solid #edf4f5;
}

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

.notify-list-icon{
    width:62px;
    height:62px;
    border-radius:50%;
    background:#ecfeff;
    color:#14b8a6;
    display:flex;
    align-items:center;
    justify-content:center;
    font-size:24px;
    flex-shrink:0;
}

.notify-list-icon.green{
    background:#fff;
    color:#15999b;
    border: dashed 1px;
    font-size: 20px;
}

.notify-list-icon.orange{
    background: #fff;
    color: #15999b;
    border: dashed 1px;
    font-size: 20px;
}

.notify-list-icon.blue{
    background: #fff;
    color: #15999b;
    border: dashed 1px;
    font-size: 20px;
}

.notify-list-icon.teal{
    background: #fff;
    color: #15999b;
    border: dashed 1px;
    font-size: 20px;
}

.notify-list-content h5{
    font-size:20px;
    color:#083344;
    margin-bottom:8px;
    font-weight: 500;
}

.notify-list-content span{
    color:#64748b;
    line-height:1.7;
    font-size:14px;
}

/* =========================================
CHANNELS
========================================= */

.notify-channel-grid{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:18px;
}

.notify-channel-card{
    padding:24px;
    border-radius:15px;
    border:1px solid #d9dbdb;
    text-align:center;
    background:#f9fcfd;
    transition:.3s;
}

.notify-channel-card.active{
    border-color:#14b8a6;
    box-shadow:0 12px 30px rgba(20,184,166,.08);
}

.notify-channel-icon{
    width:70px;
    height:70px;
    border-radius:50%;
    background:#ecfeff;
    color:#14b8a6;
    margin:auto;
    margin-bottom:18px;
    display:flex;
    align-items:center;
    justify-content:center;
    font-size:28px;
    background: #fff;
    color: #15999b;
    border: dashed 1px;
    font-size: 27px;
}

.notify-channel-icon.blue{
    background:#eff6ff;
    color:#2563eb;
}

.notify-channel-icon.orange{
    background:#fff7ed;
    color:#ea580c;
    font-size: 24px;
}

.notify-channel-icon.whatsapp{
    background:#dcfce7;
    color:#22c55e;
}

.notify-channel-card h5{
    color:#083344;
    font-size:17px;
    font-weight: 500;
}

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

@media(max-width:991px){

.notify-grid-wrap{
    grid-template-columns:1fr;
}

}

@media(max-width:768px){

.notify-sec-wrap{
    padding:22px;
}

.notify-sec-head h2{
    font-size:34px;
}

.notify-purpose-card{
    flex-direction:column;
    align-items:flex-start;
}

.notify-purpose-card h4{
    font-size:24px;
}

.notify-box-head{
    flex-direction:column;
    align-items:flex-start;
}

.notify-box-head h3{
    font-size:24px;
}

.notify-channel-grid{
    grid-template-columns:1fr;
}

.notify-list-item{
    flex-direction:column;
}

}





















/* =========================================
MAIN WRAP
========================================= */

.aidhis-main-wrap{
    padding:0;
    border-radius:0;
    background:transparent;
}

/* =========================================
HEADER
========================================= */

.aidhis-head-wrap{
    margin-bottom:35px;
}

.aidhis-mini-tag{
    display:inline-block;
    padding:10px 18px;
    border-radius:50px;
    background:#ccfbf1;
    color:#0f766e;
    font-size:13px;
    font-weight: 500;
    margin-bottom:16px;
}

.aidhis-head-wrap h2{
    font-size:44px;
    font-weight: 500;
    color:#083344;
    margin-bottom:12px;
}

.aidhis-head-wrap p{
    color:#64748b;
    line-height:1.8;
    max-width:700px;
}

/* =========================================
SUMMARY GRID
========================================= */

.aidhis-summary-grid{
    display:grid;
    grid-template-columns:repeat(4,1fr);
    gap:24px;
    margin-bottom:35px;
}

.aidhis-summary-card{
    background:#eaf6f694;
    border-radius:10px;
    padding:10px;
    border:1px solid #dde9ea;
    display:flex;
    align-items:center;
    gap:18px;
}

.aidhis-summary-icon{
    width:60px;
    height:60px;
    border-radius:50%;
    background:#fff0;
    color:#31b5b6;
    display:flex;
    align-items:center;
    justify-content:center;
    font-size:28px;
    border: dashed 1px;
}

.aidhis-summary-icon.blue{
    background:#f3fafa;
    color:#15999b;
    font-size: 28px;
    border: dashed 1px;
}

.aidhis-summary-icon.orange{
    background:#fff7ed;
    color:#ea580c;
    background: #f3fafa;
    color: #15999b;
    font-size: 28px;
    border: dashed 1px;
}

.aidhis-summary-icon.green{
    background: #f3fafa;
    color: #15999b;
    font-size: 28px;
    border: dashed 1px;
}

.aidhis-summary-card span{
    display:block;
    color:#64748b;
    margin-bottom:8px;
    font-size:14px;
}

.aidhis-summary-card h3{
    color:#083344;
    font-size:16px;
    font-weight: 500;
}

/* =========================================
GRID
========================================= */

.aidhis-grid-wrap{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:28px;
}

/* =========================================
BOX CARD
========================================= */

.aidhis-box-card{
    background:#fff;
    border-radius:20px;
    padding:20px;
    border:1px solid #e5f1f3;
}

.aidhis-box-card.full-width{
    grid-column:span 2;
}

.aidhis-box-head{
    display:flex;
    align-items:flex-start;
    gap:18px;
    margin-bottom:28px;
}

.aidhis-box-icon{
    width:75px;
    height:75px;
    border-radius:50%;
    background:#ecfeff;
    color:#14b8a6;
    display:flex;
    align-items:center;
    justify-content:center;
    font-size:30px;
    background: #f3fafa;
    color: #15999b;
    font-size: 28px;
    border: dashed 1px;
}

.aidhis-box-icon.blue{
    background:#f3fafa;
    color:#42abae;
}

.aidhis-box-icon.orange{
    background:#fff7ed;
    color:#ea580c;
}

.aidhis-box-icon.green{
    background:#dcfce7;
    color:#16a34a;
}

.aidhis-box-icon.teal{
    background:#ccfbf1;
    color:#0f766e;
}

.aidhis-box-head h3{
    font-size:22px;
    color:#083344;
    font-weight: 500;
    margin-bottom: 2px;
}

.aidhis-box-head p{
    color:#64748b;
}

/* =========================================
DETAIL LIST
========================================= */

.aidhis-detail-list{
    display:flex;
    flex-direction:column;
    gap:18px;
}

.aidhis-detail-item{
    background:#f3fafa;
    border-radius:10px;
    padding:21px 22px;
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:20px;
    border:1px solid #c7e7ec;
}

.aidhis-detail-item span{
    color:#64748b;
    font-size:16px;
}

.aidhis-detail-item strong{
    color:#083344;
    font-size:17px;
    font-weight: 500;
}

/* STATUS */

.aidhis-status{
    padding:10px 18px;
    border-radius:50px;
    font-size:13px;
    font-weight: 500;
}

.aidhis-status.green{
    background:#dcfce7;
    color:#15803d;
    font-weight: 500;
}

/* =========================================
SPONSOR GRID
========================================= */

.aidhis-sponsor-grid{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:20px;
}

.aidhis-sponsor-card{
    background:#f9fcfd;
    border-radius:24px;
    padding:24px;
    border:1px solid #edf4f5;
}

.aidhis-sponsor-card span{
    display:block;
    color:#64748b;
    margin-bottom:10px;
    font-size:14px;
}

.aidhis-sponsor-card h5{
    color:#083344;
    font-size:17px;
    font-weight: 500;
}

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

@media(max-width:1200px){

.aidhis-summary-grid{
    grid-template-columns:repeat(2,1fr);
}

}

@media(max-width:991px){

.aidhis-grid-wrap{
    grid-template-columns:1fr;
}

.aidhis-box-card.full-width{
    grid-column:span 1;
}

}

@media(max-width:768px){

.aidhis-main-wrap{
    padding:22px;
}

.aidhis-summary-grid{
    grid-template-columns:1fr;
}

.aidhis-head-wrap h2{
    font-size:34px;
}

.aidhis-box-head{
    flex-direction:column;
    align-items:flex-start;
}

.aidhis-box-head h3{
    font-size:24px;
}

.aidhis-detail-item{
    flex-direction:column;
    align-items:flex-start;
}

.aidhis-sponsor-grid{
    grid-template-columns:1fr;
}

}







/* =========================================
MAIN WRAP
========================================= */

.setng-main-wrap{
    padding:0;
    border-radius:0;
    background:transparent;
}

/* =========================================
HEADER
========================================= */

.setng-head-wrap{
    margin-bottom:35px;
}

.setng-mini-tag{
    display:inline-block;
    padding:10px 18px;
    border-radius:50px;
    background:#ccfbf1;
    color:#0f766e;
    font-size:13px;
    font-weight: 500;
    margin-bottom:16px;
}

.setng-head-wrap h2{
    font-size:44px;
    font-weight: 500;
    color:#083344;
    margin-bottom:12px;
}

.setng-head-wrap p{
    color:#64748b;
    line-height:1.8;
    max-width:700px;
}

/* =========================================
TOP GRID
========================================= */

.setng-top-grid{
    display:grid;
    grid-template-columns:repeat(4,1fr);
    gap:24px;
    margin-bottom:35px;
}

.setng-top-card{
    background:#fff;
    border-radius:15px;
    padding:10px;
    border:1px solid #dfeef1;
    display:flex;
    align-items:center;
    gap:18px;
}

.setng-top-icon{
    width:56px;
    height:55px;
    border-radius:50%;
    background:#15999b;
    color:#ebf4f6;
    display:flex;
    align-items:center;
    justify-content:center;
    font-size:25px;
    border: dashed 1px;
}

.setng-top-icon.blue{
    background:#eff6ff;
    color:#2563eb;
    border-radius: 50%;
    background: #ecfeff;
    color: #15999b;
    background: #15999b;
    color: #ebf4f6;
}

.setng-top-icon.orange{
    background:#fff7ed;
    color:#ea580c;
    border-radius: 50%;
    background: #ecfeff;
    color: #15999b;
    background: #15999b;
    color: #ebf4f6;
}

.setng-top-icon.green{
    background:#dcfce7;
    color:#16a34a;
    border-radius: 50%;
    background: #ecfeff;
    color: #15999b;
    background: #15999b;
    color: #ebf4f6;
}

.setng-top-card span{
    display:block;
    color:#64748b;
    margin-bottom:2px;
    font-size:14px;
}

.setng-top-card h4{
    color:#083344;
    font-size:16px;
    font-weight: 500;
}

/* =========================================
GRID
========================================= */

.setng-grid-wrap{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:28px;
}

/* =========================================
CARD
========================================= */

.setng-box-card{
    background:#fff;
    border-radius:15px;
    padding:17px;
    border:1px solid #d9e8ea;
}

.setng-box-card.full-width{
    grid-column:span 2;
}

.setng-box-head{
    display:flex;
    align-items:center;
    gap:18px;
    margin-bottom:25px;
}

.setng-box-icon{
    width:60px;
    height:60px;
    border-radius:50%;
    background:#ecfeff;
    color:#15999b;
    display:flex;
    align-items:center;
    justify-content:center;
    font-size:21px;
    border: dashed 1px;
    color: #15999b;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 21px;
    border: dashed 1px;
}

.setng-box-icon.blue{
    background:#eff6ff;
    color:#15999b;
}

.setng-box-icon.green{
    background:#dcfce7;
    color:#16a34a;
}

.setng-box-head h3{
    font-size:22px;
    color:#083344;
    font-weight: 500;
    margin-bottom:0;
}

.setng-box-head p{
    color:#64748b;
    margin-bottom: 0;
    font-size: 17px;
}

/* =========================================
OPTION ITEM
========================================= */

.setng-option-item{
    background:#edf8f8;
    border-radius:15px;
    padding:20px 22px;
    border:1px solid #daecef;
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:20px;
    margin-bottom:18px;
}

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

.setng-option-left{
    display:flex;
    align-items:center;
    gap:18px;
}

.setng-option-icon{
    width:62px;
    height:62px;
    border-radius:50%;
    background:#ecfeff;
    color:#14b8a6;
    display:flex;
    align-items:center;
    justify-content:center;
    font-size:24px;
    flex-shrink:0;
    color: #15999b;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 21px;
    border: dashed 1px;
}

.setng-option-icon.green{
    background:#dcfce7;
    color:#16a34a;
}

.setng-option-icon.blue{
    background:#eff6ff;
    color:#2563eb;
}

.setng-option-icon.orange{
    background:#fff7ed;
    color:#ea580c;
}

.setng-option-left h5{
    color:#083344;
    font-size:17px;
    font-weight: 500;
    margin-bottom:3px;
}

.setng-option-left span{
    color:#64748b;
    line-height:1.4;
    font-size:14px;
}

/* =========================================
BUTTON
========================================= */

.setng-btn{
    border:none;
    background:#15999b;
    color:#fff;
    padding:12px 22px;
    border-radius:9px;
    font-weight: 500;
    cursor:pointer;
}

/* =========================================
SELECT
========================================= */

.setng-select{
    border:1px solid #9eefef;
    border-radius:9px;
    padding:4px 20px;
    outline:none;
    min-width:140px;
    font-weight:200;
    background-color: #fff;
}

/* =========================================
PRIVACY GRID
========================================= */

.setng-privacy-grid{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:24px;
}

.setng-privacy-card{
    background:#edf8f8;
    border-radius:15px;
    padding:19px;
    border:1px solid #edf4f5;
}

.setng-privacy-icon{
    width:72px;
    height:72px;
    border-radius:50%;
    background:#ccfbf1;
    color:#14b8a6;
    display:flex;
    align-items:center;
    justify-content:center;
    font-size:28px;
    margin-bottom:22px;
    color: #15999b;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 21px;
    border: dashed 1px;
}

.setng-privacy-icon.orange{
    background:#fff7ed;
    color:#ea580c;
}

.setng-privacy-card h5{
    color:#083344;
    font-size:20px;
    font-weight: 500;
    margin-bottom:7px;
}

.setng-privacy-card p{
    color:#64748b;
    line-height:1.3;
    margin-bottom:16px;
    font-size: 16px;
}

/* =========================================
SWITCH
========================================= */

.setng-switch{
    position:relative;
    display:inline-block;
    width:60px;
    height:32px;
}

.setng-switch input{
    opacity:0;
    width:0;
    height:0;
}

.setng-slider{
    position:absolute;
    cursor:pointer;
    inset:0;
    background:#cbd5e1;
    transition:.4s;
    border-radius:50px;
}

.setng-slider:before{
    position:absolute;
    content:"";
    height:24px;
    width:24px;
    left:4px;
    bottom:4px;
    background:white;
    transition:.4s;
    border-radius:50%;
}

.setng-switch input:checked + .setng-slider{
    background:#15999b;
}

.setng-switch input:checked + .setng-slider:before{
    transform:translateX(28px);
}

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

@media(max-width:1200px){

.setng-top-grid{
    grid-template-columns:repeat(2,1fr);
}

}

@media(max-width:991px){

.setng-grid-wrap{
    grid-template-columns:1fr;
}

.setng-box-card.full-width{
    grid-column:span 1;
}

}

@media(max-width:768px){

.setng-main-wrap{
    padding:22px;
}

.setng-top-grid{
    grid-template-columns:1fr;
}

.setng-head-wrap h2{
    font-size:34px;
}

.setng-box-head{
    flex-direction:column;
    align-items:flex-start;
}

.setng-box-head h3{
    font-size:24px;
}

.setng-option-item{
    flex-direction:column;
    align-items:flex-start;
}

.setng-option-left{
    align-items:flex-start;
}

.setng-privacy-grid{
    grid-template-columns:1fr;
}

}

/* Donor portal refresh */
.dashbord-wrp-1 {
  background:
    radial-gradient(circle at 5% 8%, rgba(21, 153, 155, 0.12), transparent 28%),
    radial-gradient(circle at 92% 22%, rgba(223, 200, 175, 0.22), transparent 30%),
    linear-gradient(135deg, #f8fcfd 0%, #f4f8f6 100%);
  padding: 50px 0 48px;
}

.dp-sidebar {
  background:
    linear-gradient(180deg, rgba(8, 73, 89, 0.98) 0%, rgba(18, 123, 136, 0.98) 100%),
    url("../images/dark-section-bg-image.png");
  background-size: cover;
  background: linear-gradient(180deg, #0d6879 0%, #1ca3af 100%);
}

.dp-profile {
  margin-bottom: 18px;
}

.dp-photo-avatar {
  overflow: hidden;
  padding: 0;
  background: rgba(255,255,255,0.16);
}

.dp-photo-avatar img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

.dp-donor-score {
  position: relative;
  z-index: 1;
  border: 1px solid rgba(255, 255, 255, 0.2);
  background: rgba(255, 255, 255, 0.12);
  border-radius: 12px;
  padding: 16px;
  margin-bottom: 22px;
  backdrop-filter: blur(10px);
}

.dp-donor-score span,
.dp-donor-score small {
  display: block;
  color: rgba(255, 255, 255, 0.78);
  font-size: 13px;
  line-height: 1.5;
}

.dp-donor-score strong {
  display: block;
  color: #fff;
  font-size: 20px;
  line-height: 1.2;
  margin: 3px 0;
}

.dp-sidebar .db1-tab-btn {
  min-height: 48px;
  padding: 0 14px;
  border-radius: 8px;
  font-size: 17px;
}

.dp-main {
  background:
    linear-gradient(180deg, rgba(255,255,255,0.9), rgba(255,255,255,0.76)),
    linear-gradient(135deg, rgba(21,153,155,0.07), rgba(223,200,175,0.12));
}

.dp-mobile-menu-toggle,
.dp-mobile-menu-backdrop {
  display: none;
}

.dp-hero {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 20px;
  border-radius: 18px;
  padding: 28px;
  margin-bottom: 24px;
  background:
    linear-gradient(135deg, rgba(17,76,92,0.96), rgba(21,153,155,0.9)),
    url("../images/img/banners.jpg") center / cover;
  overflow: hidden;
  position: relative;
}

.dp-hero::before {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(90deg, rgb(13, 105, 121), rgb(25, 151, 164));
}

.dp-hero > * {
  position: relative;
  z-index: 1;
}

.dp-eyebrow {
  display: inline-flex;
  align-items: center;
  min-height: 30px;
  padding: 0 12px;
  border-radius: 999px;
  color: #114c5c;
  background: #dfc8af;
  font-size: 13px;
  font-weight: 500;
  margin-bottom: 12px;
}

.dp-hero h1 {
  color: #fff;
  font-size: clamp(20px, 2vw, 30px);
  line-height: 1.1;
  margin-bottom: 8px;
}

.dp-hero p {
  max-width: 720px;
  color: rgba(255,255,255,0.85);
  font-size: 16px;
  line-height: 1.35;
  margin: 0;
}

.dp-hero .db1-action-btn {
  background: #fff;
  color: #114c5c;
  box-shadow: 0 14px 28px rgba(0,0,0,0.18);
  flex-shrink: 0;
}

.dp-stats {
  grid-template-columns: repeat(4, minmax(0, 1fr));
}

.dp-stats .db1-stat-card {
  min-height: 178px;
  border-radius: 16px;
  padding: 22px;
}

.dp-stats .db1-stat-card h2 {
  font-size: 19px;
  letter-spacing: 0;
}

.dp-dashboard-grid {
  display: grid;
  grid-template-columns: minmax(0, 1.15fr) minmax(340px, 0.85fr);
  gap: 22px;
  align-items: start;
}

.dp-wide-card,
.dp-side-summary {
  height: 100%;
}

.dp-dashboard-side-stack {
  display: grid;
  gap: 22px;
}

.dp-head-row {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 18px;
}

.dp-section-grid {
  display: grid;
  grid-template-columns: repeat(1, minmax(0, 1fr));
  gap: 16px;
}

.dp-feature-card {
  display: grid;
  grid-template-columns: auto 1fr auto;
  align-items: flex-start;
  gap: 14px;
  min-height: auto;
  padding: 18px;
  border: 1px solid #dceef2;
  border-radius: 12px;
  background: linear-gradient(180deg, #ffffff 0%, #f7fbfc 100%);
  transition: 0.25s ease;
}

.dp-feature-card:hover {
  transform: translateY(-4px);
  border-color: rgba(21, 153, 155, 0.45);
  box-shadow: 0 16px 34px rgba(13, 64, 84, 0.08);
}

.dp-feature-icon {
  width: 48px;
  height: 48px;
  border-radius: 12px;
  display: grid;
  place-items: center;
  background: #e7f8fb;
  color: #1198aa;
  border: 1px dashed rgba(21, 153, 155, 0.55);
  font-size: 18px;
  flex-shrink: 0;
}

.dp-feature-card h3 {
  color: #023b53;
  font-size: 18px;
  font-weight: 500;
  line-height: 1.25;
  margin-bottom: 6px;
}

.dp-feature-card p {
  color: #607785;
  font-size: 14px;
  line-height: 1.55;
  margin: 0;
}

.dp-feature-card span {
  align-self: flex-start;
  white-space: nowrap;
  color: #8a6f52;
  background: #fff7ec;
  border: 1px solid rgba(223, 200, 175, 0.8);
  border-radius: 4px;
  padding: 4px 10px;
  font-size: 12px;
  font-weight: 500;
}

.dp-hidden-search {
  position: absolute;
  width: 1px;
  height: 1px;
  opacity: 0;
  pointer-events: none;
}

.dp-profile-edit-grid {
  display: grid;
  gap: 18px;
}

.dp-profile-summary-card {
  position: relative;
  border: 1px solid #dceef2;
  border-radius: 16px;
  background: #fff;
  padding: 36px 38px 38px;
  min-height: 382px;
  box-shadow: 0 18px 42px rgba(13, 64, 84, 0.07);
}

.dp-profile-summary-dot {
  position: absolute;
  top: 14px;
  left: 50%;
  width: 12px;
  height: 12px;
  border-radius: 50%;
  transform: translateX(-50%);
  background: #0d6879;
}

.dp-profile-summary-top {
  display: grid;
  grid-template-columns: 92px 1fr;
  gap: 24px;
  align-items: center;
  margin-bottom: 28px;
}

.dp-profile-summary-top img {
  width: 92px;
  height: 92px;
  border-radius: 50%;
  object-fit: cover;
  background: #e7eef0;
  object-position: top;
}

.dp-profile-summary-top h3 {
  color: #0d5566;
  font-size: 21px;
  font-weight: 500;
  line-height: 1.2;
  margin-bottom: 4px;
}

.dp-profile-summary-top p {
  color: #536a86;
  font-size: 16px;
  line-height: 1.3;
  margin: 0 0 14px;
}

.dp-profile-summary-top strong {
  display: inline-flex;
  align-items: center;
  min-height: 36px;
  padding: 0 15px;
  border-radius: 999px;
  background: #58d37e;
  color: #fff;
  font-size: 15px;
  font-weight: 500;
  white-space: nowrap;
}

.dp-profile-summary-contact {
  display: grid;
  gap: 12px;
  margin-bottom: 30px;
}

.dp-profile-summary-contact p {
  display: flex;
  align-items: center;
  gap: 14px;
  color: #2f4662;
  font-size: 16px;
  line-height: 1.35;
  margin: 0;
}

.dp-profile-summary-contact i {
  width: 18px;
  color: #15999b;
  font-size: 18px;
  text-align: center;
}

.dp-profile-view-btn {
  min-height: 58px;
  width: 192px;
  border: 0;
  border-radius: 6px;
  background: linear-gradient(135deg, #0d6879, #1ca3af);
  color: #fff;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 12px;
  font-size: 18px;
  font-weight: 500;
  box-shadow: 0 18px 34px rgba(21, 153, 155, 0.22);
  cursor: pointer;
  transition: 0.25s ease;
}

.dp-profile-view-btn:hover {
  transform: translateY(-3px);
}

.dp-profile-edit-card {
  border: 1px solid #dceef2;
  border-radius: 16px;
  background: linear-gradient(180deg, #ffffff 0%, #f7fbfc 100%);
  padding: 20px;
  box-shadow: 0 14px 32px rgba(13, 64, 84, 0.05);
}

.dp-profile-edit-head,
.dp-profile-card-foot {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
}

.dp-profile-edit-head {
  margin-bottom: 16px;
}

.dp-profile-edit-head > div {
  display: flex;
  align-items: center;
  gap: 12px;
}

.dp-profile-edit-head span {
  width: 46px;
  height: 46px;
  border-radius: 12px;
  display: grid;
  place-items: center;
  background: #e7f8fb;
  color: #1198aa;
  border: 1px dashed rgba(21, 153, 155, 0.55);
}

.dp-profile-edit-head h3 {
  color: #023b53;
  font-size: 21px;
  font-weight: 500;
}

.dp-edit-btn,
.dp-save-btn {
  min-height: 40px;
  border-radius: 7px;
  padding: 0 14px;
  border: 1px solid #d6eaf0;
  background: #fff;
  color: #114c5c;
  display: inline-flex;
  align-items: center;
  gap: 8px;
  font-size: 14px;
  font-weight: 500;
  cursor: pointer;
  transition: 0.25s ease;
}

.dp-edit-btn:hover,
.dp-save-btn:hover {
  transform: translateY(-2px);
  border-color: rgba(21, 153, 155, 0.5);
}

.dp-profile-fields {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 14px;
}

.dp-profile-fields label {
  display: grid;
  gap: 8px;
  margin: 0;
}

.dp-profile-fields small {
  color: #607785;
  font-size: 15px;
  font-weight: 500;
}

.dp-profile-fields input {
  width: 100%;
  min-height: 48px;
  border-radius: 8px;
  border: 1px solid #dceef2;
  background: #f6fbfc;
  color: #023b53;
  padding: 0 14px;
  font-size: 16px;
  font-weight: 500;
  outline: none;
}

.dp-profile-edit-card.is-editing {
  border-color: rgba(21, 153, 155, 0.65);
  box-shadow: 0 18px 38px rgba(13, 64, 84, 0.09);
}

.dp-profile-edit-card.is-editing input {
  background: #fff;
  border-color: rgba(21, 153, 155, 0.55);
}

.dp-profile-card-foot {
  margin-top: 16px;
  padding-top: 14px;
  border-top: 1px solid #e7f1f4;
}

.dp-profile-card-foot span {
  color: #078345;
  background: #e8f8ef;
  border-radius: 999px;
  padding: 8px 12px;
  font-size: 13px;
  font-weight: 500;
}

.dp-save-btn {
  display: none;
  background: linear-gradient(135deg, #0d6879, #1ca3af);
  color: #fff;
  border-color: transparent;
}

.dp-profile-edit-card.is-editing .dp-save-btn {
  display: inline-flex;
}

@media (max-width: 1280px) {
  .dp-stats {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .dp-dashboard-grid {
    grid-template-columns: 1fr;
  }

  .dp-profile-summary-card {
    max-width: none;
  }
}

@media (max-width: 1100px) {
  .db1-layout {
    display: block;
  }

  .dp-mobile-menu-toggle {
    position: sticky;
    top: 12px;
    z-index: 90;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    min-height: 41px;
    padding: 0 11px;
    margin-bottom: 24px;
    border: 0;
    border-radius: 8px;
    background: linear-gradient(135deg, #0d6879, #1ca3af);
    color: #fff;
    font-size: 16px;
    font-weight: 500;
    box-shadow: 0 14px 28px rgba(24, 167, 184, 0.22);
  }

  .dp-mobile-menu-backdrop {
    position: fixed;
    inset: 0;
    z-index: 94;
    background: rgba(4, 44, 58, 0.45);
    opacity: 0;
    visibility: hidden;
    transition: 0.25s ease;
  }

  .dp-menu-open .dp-mobile-menu-backdrop {
    display: block;
    opacity: 1;
    visibility: visible;
  }

  .dp-sidebar {
    position: fixed;
    top: 0;
    left: 0;
    z-index: 95;
    width: min(360px, 88vw);
    height: 100vh;
    min-height: 100vh;
    overflow-y: auto;
    border-radius: 0;
    transform: translateX(-105%);
    transition: transform 0.3s ease;
  }

  .dp-menu-open .dp-sidebar {
    transform: translateX(0);
  }

  .dp-main {
    min-height: auto;
  }

  .dp-sidebar .db1-menu {
    grid-template-columns: 1fr;
  }

  .dp-sidebar .db1-tab-btn {
    justify-content: flex-start;
  }
}

@media (max-width: 850px) {
  .dp-hero,
  .dp-head-row {
    flex-direction: column;
    align-items: flex-start;
  }

  .dp-section-grid,
  .dp-stats,
  .dp-profile-fields {
  }

  .dp-profile-edit-head,
  .dp-profile-card-foot {
    align-items: flex-start;
    flex-direction: column;
  }

  .dp-profile-summary-card {
    width: 100%;
    max-width: none;
    padding: 32px 24px;
  }

  .dp-profile-summary-top {
    grid-template-columns: 80px 1fr;
    gap: 16px;
  }

  .dp-profile-summary-top img {
    width: 80px;
    height: 80px;
  }

  .dp-feature-card {
    grid-template-columns: repeat;
  }

  .dp-feature-card span {
    grid-column: 2;
  }

  .dashbord-wrp-1 {
  min-height: auto;}

.dashbord-wrp-1 {
  padding: 0px 0 28px;
  z-index: 0;
}
}

@media (max-width: 620px) {
  .dp-sidebar .db1-menu {
    grid-template-columns: 1fr;
  }

  .dp-hero {
    padding: 22px;
  }

  .dp-feature-card {
  }

  .dp-feature-card span {
    grid-column: auto;
  }

  .dp-profile-summary-top {
    grid-template-columns: 1fr;
    text-align: center;
  }

  .dp-profile-summary-top img {
    margin: 0 auto;
  }

  .dp-profile-view-btn {
    width: 100%;
  }
}

/* Site-wide responsive safety layer */
*,
*::before,
*::after {
  box-sizing: border-box;
}

html,
body {
  max-width: 100%;
}

body {
  overflow-x: hidden;
}

img,
video,
iframe {
  max-width: 100%;
}

.preloader {
  animation: tarahumPreloaderFallback 0.01s linear 1.2s forwards;
}

@keyframes tarahumPreloaderFallback {
  to {
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
  }
}

table {
  max-width: 100%;
}

.container {
  width: 100%;
}

@media (max-width: 1199px) {
  .container {
    max-width: 100%;
    padding-left: 20px;
    padding-right: 20px;
  }

  .new-header-wrap .nav-links a {
    font-size: 15px;
    padding-right: 12px;
  }

  .new-header-wrap .header-icons {
    gap: 12px;
  }
}

@media (max-width: 991px) {
  .new-header-wrap .top-header {
    padding: 8px 0;
  }

  .top-header-logos-w {
    gap: 12px;
  }

  .new-header-wrap .logo-section {
    width: auto;
    max-width: 170px;
    flex: 0 1 170px;
  }

  .new-header-wrap .logo-section img {
    width: 100%;
    height: auto;
  }

  .uae-logo-s {
    max-width: 110px;
  }

  .new-header-wrap .nav-bar {
    display: none !important;
    position: static !important;
    width: auto !important;
    height: auto !important;
    transform: none !important;
  }

  .nw-mobile-btn {
    display: block;
    flex: 0 0 auto;
  }

  .nw-mobile-menu {
    width: min(320px, 88vw);
  }

  .mob-menu-show {
    display: block;
  }

  .banner-slider .swiper-slide,
  .banner-slider .banner-item {
    min-height: 420px;
    height: 420px;
  }

  .banner-slider .banner-content {
    left: 20px;
    right: 20px;
    max-width: min(460px, calc(100vw - 40px));
  }

  .banner-slider .banner-content h2 {
    font-size: clamp(30px, 8vw, 42px);
    line-height: 1.1;
  }

  .banner-slider .banner-content p {
    font-size: 16px;
    line-height: 1.5;
  }

  .section-title h2,
  .section-title-center h2 {
    font-size: clamp(28px, 6vw, 42px);
    line-height: 1.1;
  }

  .donation-card,
  .activity-card,
  .services-new-card,
  .policy-list--wrt .policy-card,
  .checkout-wrap-1 .billing-card,
  .checkout-wrap-1 .cart-card,
  .checkout-wrap-1 .payment-card,
  .bakacnt-wrap-1 .bank-card,
  .dashboard-card,
  .profile-card,
  .up-card,
  .db1-card {
    max-width: 100%;
  }

  .donation-table-wrap,
  .table-responsive,
  .cart-table-wrap {
    width: 100%;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
  }

  .donation-table {
    min-width: 780px;
  }

  .main-footer-gold .row,
  .footer-copyright-gold,
  .footer-links-box-gold {
    row-gap: 24px;
  }

  .p-float-icons {
    right: 14px;
  }
}

@media (max-width: 767px) {
  body {
    font-size: 16px;
  }

  .container {
    padding-left: 16px;
    padding-right: 16px;
  }

  .top-header-logos-w {
    align-items: center;
  }

  .uae-logo-s {
    display: none;
  }

  .new-header-wrap .logo-section {
    max-width: 145px;
    flex-basis: 145px;
  }

  .mob-mnu-incs-st {
    display: flex;
    align-items: center;
    gap: 10px;
  }

  .mob-menu-show .header-icons {
    display: flex;
    gap: 2px;
  }

  .mob-menu-show .header-icons a {
    width: 34px;
    height: 34px;
    display: grid;
    place-items: center;
  }

  .banner-slider .swiper-slide,
  .banner-slider .banner-item {
    min-height: 360px;
    height: 360px;
  }

  .banner-slider .banner-content {
    top: 50%;
    transform: translateY(-50%);
  }

  .banner-slider .banner-content button,
  .btn-default,
  .db1-action-btn,
  .donate-now {
    min-height: 38px;
    max-width: 100%;
    white-space: normal;
  }

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

  .row {
    row-gap: 20px;
  }

  .form-control,
  input,
  select,
  textarea {
    max-width: 100%;
  }

  .dntpopups .donation-modal,
  .zakat-popup-card,
  .cookie-popup {
    width: min(94vw, 520px);
    max-height: 90vh;
    overflow-y: auto;
  }

  .dntpopups .modal-body,
  .checkout-wrap-1 .card-head,
  .db1-card-title {
    flex-direction: column;
    align-items: flex-start;
  }

  .p-float-icons {
    right: 10px;
  }

  .p-float-icons .float-btn {
    width: 46px;
    height: 46px;
  }

  .p-float-icons .float-btn span {
    display: none;
  }


  .Critical-Cases-w .donation-card {
  margin: 0px 0;
  border-radius: 8px;
}

.kid-d-wrp .kid-breadcrumb a {
  color: rgba(255,255,255,0.9);
  font-size: 14px;
  text-decoration: none;
  font-weight: 500;
}
.apply-info__hero h1 {
  font-size: clamp(21px, 2vw, 29px);}

.quk-dnt .quick-title {
  font-size: 21px;
  font-weight: 500;
  margin-bottom: 0;
  color: #083344;
}
.quk-dnt .section-title {
  font-size: 16px;
  font-weight: 300;
  margin-bottom: 0;
  color: #114c5c;
  margin-top: 8px;
}
 .quk-dnt .amount-grid{ border-radius: 15px;
    padding: 15px 0;
    margin-bottom: 0px; }

.quk-dnt .amount-grid {
  grid-template-columns: repeat(3, 1fr);
}
.quk-dnt .amount-card strong {
  font-size: 17px;
  font-weight: 500;
}

.quk-dnt .category-grid {
  grid-template-columns: repeat(1, 1fr);
}
.quk-dnt .select-box {
  width: 100%;
  border: 1px solid #15999b3b;
  border-radius: 7px;
  padding: 7px 13px;
  font-size: 16px;
  outline: none;
  margin-bottom: 10px;
  background-color: #15999b12;
}
.quk-dnt .payment-grid {
  grid-template-columns: repeat(3, 1fr);
}


.quk-dnt .donate-btn {
  width: 100%;
  background: linear-gradient(135deg, #0d6679, #17a0b1);
  color: white;
  border: none;
  border-radius: 7px;
  padding: 14px;
  font-size: 18px;
  font-weight: 500;
  cursor: pointer;
  transition: 0.3s ease;
  margin-top: 0;
}
.selection-card {
  background: #f5f4ef;
  padding: 30px;
  border-radius: 15px;
  max-width: 100%;
  width: 100%;
  padding: 15px 10px 0 10px;
  border-radius: 15px;
  background: #e9f6f68f;
    background-color: rgba(233, 246, 246, 0.56);
  border: 1px solid #dceef2;
  margin-bottom: 0;
  box-shadow: rgba(15, 58, 47, 0.06) 0px 12px 35px;
  transition: 0.35s;
  border: 1px solid rgba(21, 153, 155, 0.49);
  margin-top: 15px;
}
 .quk-dnt .amount-grid {
    border-radius: 15px;
    padding: 9px 0;}

    .quk-dnt .stat h2 {
  font-size: 21px;}

  .quk-dnt .stats-box {
    border-radius: 15px;
    padding: 10px;
    display: none;
}


    .quk-dnt .stat p {
  font-size: 15px;
  opacity: 0.85;
  margin-bottom: 0;
  line-height: 14.5px;
  margin-bottom: 0;
}
.dwn-w p{ margin-bottom:0 }

.Critical-Cases-w {
  padding: 20px 0 20px 0;}

 .crtic {
  padding: 0px 0;
}

}

@media (max-width: 640px) {
  .crtic .crtic-amount-grid {
    grid-template-columns: 1fr 1fr;
  }
   .crtic .crtic-title {
    font-size: 19px;
  }

  .crtic .crtic-actions {
    grid-template-columns: 1fr 1fr;
  }
  .crtic .crtic-btn {
  min-height: 40px;
  border-radius: 8px;
  border: 0;
  cursor: pointer;
  font-size: 15px;
  font-weight: 500;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 9px;
  text-decoration: none;
  transition: 0.3s;
  border: solid 1px #118d9a6b;
}
  .abt-re-new {
    padding: 15px;
  }
   .abt-re-new .abt-hero h1 {
    font-size: 22px;
    margin-bottom: 0px;
  }
    .abt-re-new .abt-hero p {
    font-size: 15px;
    line-height: 1.3;
    margin-top: 10px;
    margin-bottom: 10px;
  }


   .k-wraps .pickup-header {
    padding: 0;
    border: 0;
  }


   .abt-re-new .abt-hero {
    padding: 20px 15px;
    min-height: auto;
    border-radius: 22px;
    margin: 15px;
  }
  .k-wraps .pickup-content {
    padding: 0;
  }

    .kid-d-wrp .kid-info {
    padding: 0;
  }
  .h-d-wrp h3 {
  font-size: 17px;
  margin-bottom: 13px;
}

.donation-option {
  background-color: white;
  border-radius: 10px;
  padding: 10px 10px;
  border: solid #c8c5c5 1px;
}


  .donation-options {
  display: grid;
  gap: 8px;}



  .donation-option p {
  font-weight: 500;
  color: #114c5c;
  margin-bottom: 3px;
  line-height: 10px;
  font-size: 16px;
}


.h-d-wrp .upload-card h3 {
  font-size: 18px;
  color: #0d4358;
  margin-bottom: 0px;
}

.additional-fields {
  display: grid;
  margin-top: 19px;
  grid-template-columns: repeat(1, 1fr);
  gap: 10px;
}

.kid-d-wrp {
    padding: 0;
  }

    .abt-re-new {
    padding: 0;
  }

  .kid-d-wrp .kid-card-head h2 {
    font-size: 19px;
  }

  .kid-d-wrp .kid-side-content {
  padding: 10px;
}

  .k-wraps .pickup-card {
    padding: 10px;
  }


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

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


   .kid-d-wrp .kid-hero {
    padding: 20px 15px 0;
    border-radius: 0;
  }
  .kid-d-wrp .kid-hero h1 {
    font-size: 20px;
  }
  .kid-d-wrp .kid-breadcrumb li, .kid-d-wrp .kid-breadcrumb a {
  color: rgba(255,255,255,0.9);
  font-size: 15px;
  text-decoration: none;
  font-weight: 500;
}

 .page-category-list .page-category-list-title {
    padding: 0;
  }


  .service-entry {padding: 15px;}

}

@media (max-width: 575px) {
  .container {
    padding-left: 14px;
    padding-right: 14px;
  }

  .new-header-wrap .logo-section {
    max-width: 200px;
    flex-basis: 200px;
  }

  .banner-slider .swiper-slide,
  .banner-slider .banner-item {
    min-height: auto;
    height: auto;
  }

  .banner-slider .banner-content {
    left: 14px;
    right: 14px;
    max-width: calc(100vw - 28px);
    width: 250px;
  }

  .banner-slider .banner-content h2 {
    font-size: 21px;
  }

  .banner-slider .banner-content p {
    font-size: 14px;
    margin-bottom: 14px;
  }

  .nw-mobile-menu {
    width: 86vw;
    padding: 24px 18px;
  }

  .section-title h2,
  .section-title-center h2 {
    font-size: 20px;
  }

  .footer-copyright-gold,
  .footer-social-links-gold ul,
  .iso-wrap,
  .amounts,
  .donate-row,
  .btn-row {
    flex-wrap: wrap;
  }
}

/* Social Responsibility policy mobile sidebar */
.preloader.policy-loader-hide {
  opacity: 0 !important;
  visibility: hidden !important;
  pointer-events: none !important;
}

.policy-mobile-toggle,
.policy-mobile-backdrop {
  display: none;
}

.policy-sidebar-close {
  display: none;
}

@media (max-width: 991px) {
  .policy-mobile-toggle {
    position: sticky;
    top: 78px;
    z-index: 0;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    min-height: 46px;
    padding: 0 18px;
    margin: 0 0 18px;
    border: 0;
    border-radius: 8px;
    background: linear-gradient(135deg, #0d6879, #1ca3af);
    color: #fff;
    font-size: 15px;
    font-weight: 500;
    box-shadow: 0 14px 28px rgba(24, 167, 184, 0.22);
  }

  .policy-mobile-backdrop {
    position: fixed;
    inset: 0;
    z-index: 99990;
    background: rgba(4, 44, 58, 0.45);
    opacity: 0;
    visibility: hidden;
    transition: 0.25s ease;
  }

  body.policy-menu-open .policy-mobile-backdrop {
    display: block;
    opacity: 1;
    visibility: visible;
  }

  .page-single-sidebar.policy-mobile-sidebar {
    position: fixed;
    top: 0;
    left: 0;
    z-index: 99999;
    width: min(340px, 88vw);
    height: 100vh;
    overflow-y: auto;
    padding: 24px 18px;
    border-radius: 0 18px 18px 0;
    background: #fff;
    box-shadow: 14px 0 35px rgba(13, 64, 84, 0.18);
    transform: translateX(-105%);
    transition: transform 0.3s ease;
    background-color: #9ac6cf;
  }

  .page-single-sidebar.policy-mobile-sidebar.policy-sidebar-open,
  body.policy-menu-open .page-single-sidebar.policy-mobile-sidebar {
    transform: translateX(0) !important;
  }

  .page-single-sidebar.policy-mobile-sidebar .page-category-list {
    margin: 0;
  }

  .policy-sidebar-close {
    position: absolute;
    top: 17px;
    margin-left: auto;
    margin-bottom: 14px;
    width: 33px;
    height: 33px;
    border: 0;
    border-radius: 50%;
    background: #35aaba;
    color: #fff;
    display: grid;
    place-items: center;
    font-size: 18px;
    cursor: pointer;
    box-shadow: 0 10px 22px rgba(13, 64, 84, 0.12);
    right: 5px;
    z-index: 10;
  }

  .service-single-content,
  .service-entry {
    max-width: 100%;
  }

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



.page-category-list {
  border-radius: 9px;
  padding: 13px;}


 .page-single-sidebar.policy-mobile-sidebar {
    padding: 26px 8px;
    border-radius: 0;}
.page-category-list ul li a { font-size:15px; min-height: 48px; }
 .policy-mobile-toggle { margin-bottom:0 }

 .service-entry {
    margin-bottom: 0;
  }

}

@media (max-width: 575px) {
  .policy-mobile-toggle {
    width: auto;
  }

  .kid-hero h1 {
    font-size: 30px;
    line-height: 1.2;
  }

  .kid-breadcrumb {
    flex-wrap: wrap;
    row-gap: 6px;
  }
}

/* Beneficiary dashboard mobile menu drawer */
.beni-mobile-menu-toggle,
.beni-mobile-menu-backdrop {
  display: none;
}

@media (max-width: 991px) {
  .benifi-dash-bord {
    position: relative;
    display: block;
  }

  .beni-mobile-menu-toggle {
    position: sticky;
    top: 76px;
    z-index: 0;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    min-height: 46px;
    padding: 0 18px;
    margin: 10px 0 0px;
    border: 0;
    border-radius: 8px;
    background: linear-gradient(135deg, #0d6879, #1ca3af);
    color: #fff;
    font-size: 15px;
    font-weight: 500;
    box-shadow: 0 14px 28px rgba(24, 167, 184, 0.22);
  }

  .beni-mobile-menu-backdrop {
    position: fixed;
    inset: 0;
    z-index: 99990;
    background: rgba(4, 44, 58, 0.45);
    opacity: 0;
    visibility: hidden;
    transition: 0.25s ease;
  }

  .benifi-dash-bord.beni-menu-open .beni-mobile-menu-backdrop {
    display: block;
    opacity: 1;
    visibility: visible;
  }

  .benifi-dash-bord .beni-sidebar {
    position: fixed;
    top: 0;
    left: 0;
    z-index: 99999;
    width: min(360px, 88vw);
    height: 100vh;
    min-height: 100vh;
    overflow-y: auto;
    border-radius: 0 8px 8px 0 !important;
    transform: translateX(-105%);
    transition: transform 0.3s ease;
  }

  .benifi-dash-bord.beni-menu-open .beni-sidebar {
    transform: translateX(0);
  }

  .benifi-dash-bord .beni-main {
    width: 100%;
  }


.benifi-dash-bord-wrap {
  padding: 0px 0;
}



  .beneficiary-dashboard {
    padding: 15px 0;
  }
  .beneficiary-title h2 {
  font-size: 20px;
  color: #114c5c;
  font-weight: 500;
  margin-bottom: -2px;
}
.beneficiary-actions{ display:none; }
.track-bn-timeline-card h4 {
  font-size: 16px;
  color: #083344;
  margin-bottom: 0px;
}


.track-bn-timeline-card p {
  color: #5f6e6e;
  line-height: 1.2;
  margin-bottom: 6px;
  font-size: 15px;
}
.dashboard-card-header h3 {
  font-size: 17px;}

#dashboard-tab  {
    padding: 0px;
    background: transparent!important;
    border: 0!important;
    border-radius: 0px;
    padding: 0;
    min-height: calc(100vh - 100%);
    box-shadow: none!important;
    backdrop-filter: none!important;
    overflow: hidden;
    height: 100%;
  }

.benifi-dash-bord .content-card { padding:15px; border-radius:9px !important; }
.benifi-dash-bord .beni-tab-content.active { margin:15px 0; border-radius:9px !important; }
.bn-profile-title {
  margin-bottom: 15px;
}

}

@media (max-width: 575px) {
  .beni-mobile-menu-toggle {
    width: auto;
  }
}

/* Dubai font enforcement */
body,
button,
input,
select,
textarea,
a,
p,
span,
li,
label {
  font-family: var(--default-font);
}

h1,
h2,
h3,
h4,
h5,
h6,
strong,
b,
.btn-default,
button {
  font-family: var(--accent-font);
  font-weight: 500;
}

.language-popup-overlay {
  position: fixed;
  inset: 0;
  background: rgba(6, 30, 38, 0.42);
  backdrop-filter: blur(6px);
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 20px;
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  transition: opacity 0.25s ease, visibility 0.25s ease;
  z-index: 99999;
}

.language-popup-overlay.active {
  opacity: 1;
  visibility: visible;
  pointer-events: auto;
}

.language-popup {
  position: relative;
  width: min(420px, 100%);
  background: #ffffff;
  border: 1px solid rgba(17, 76, 92, 0.12);
  border-radius: 12px;
  box-shadow: 0 24px 70px rgba(17, 76, 92, 0.22);
  padding: 13px;
  transform: translateY(14px) scale(0.98);
  transition: transform 0.25s ease;
}

.language-popup-overlay.active .language-popup {
  transform: translateY(0) scale(1);
}

.language-popup-close {
  position: absolute;
  top: 14px;
  right: 14px;
  width: 34px;
  height: 34px;
  border: 0;
  border-radius: 50%;
  background: #eef7f8;
  color: #114c5c;
  font-size: 24px;
  line-height: 1;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
}

.language-popup-head {
  display: flex;
  gap: 14px;
  align-items: center;
  margin-bottom: 22px;
  padding-right: 28px;
}

.language-popup-icon {
  width: 46px;
  height: 46px;
  border-radius: 50%;
  background: linear-gradient(135deg, #114c5c, #15999b);
  color: #ffffff;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex: 0 0 auto;
}

.language-popup-head h3 {
  margin: 0 0 0px;
  color: #114c5c;
  font-size: 18px;
}

.language-popup-head p {
  margin: 0;
  color: #65757b;
  font-size: 15px;
  line-height: 1.35;
}

.language-options {
  display: grid;
  gap: 9px;
  grid-template-columns: repeat(2, 1fr);
}

.language-option {
  width: 100%;
  border: 1px solid rgba(17, 76, 92, 0.14);
  background: #f8fcfc;
  border-radius: 8px;
  padding: 10px;
  display: flex;
  align-items: center;
  gap: 14px;
  text-align: left;
  color: #114c5c;
  cursor: pointer;
  transition: border-color 0.2s ease, background 0.2s ease, transform 0.2s ease;
}

.language-option:hover {
  border-color: #15999b;
  background: #eefafa;
  transform: translateY(-1px);
}

.language-flag {
  width: 48px;
  height: 48px;
  border-radius: 50%;
  background: #ffffff;
  box-shadow: inset 0 0 0 1px rgba(17, 76, 92, 0.08);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;
  flex: 0 0 auto;
}

.language-flag-svg {
  width: 100%;
  height: 100%;
  display: block;
}

.aid-app-page {
  padding: 54px 0;
  background: linear-gradient(0deg, #fff 0%, rgba(159, 206, 207, 0.18) 50%, #fff 100%);
}

.aid-app-hero {
  max-width: 820px;
  margin: 0;
  text-align: left;
}

.aid-app-eyebrow {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  color: #0d697a;
  background: #eefafa;
  border: 1px solid #cde8ec;
  border-radius: 999px;
  padding: 8px 14px;
  font-size: 14px;
  margin-bottom: 12px;
}

.aid-app-hero h1 {
  color: #0d4358;
  font-size: 30px;
  margin-bottom: 1px;
}

.aid-app-hero p {
  color: #607785;
  font-size: 16px;
  line-height: 1.6;
}

.aid-app-shell {
  display: grid;
  grid-template-columns: 330px 1fr;
  gap: 22px;
  align-items: start;
}

.aid-app-steps,
.aid-app-form {
  background: #fff;
  border: 1px solid #dceef2;
  border-radius: 16px;
  box-shadow: 0 18px 42px rgba(13, 64, 84, 0.07);
}

.aid-app-steps {
  display: grid;
  gap: 10px;
  padding: 16px;
  position: sticky;
  top: 100px;
  background: linear-gradient(180deg, #0d6879 0%, #1ca3af 100%);
}

.aid-app-step {
  border: 0px solid #e3eff2;
  border-radius: 12px;
  background: #f8fcfd;
  padding: 13px;
  display: grid;
  grid-template-columns: 38px 1fr;
  gap: 10px;
  text-align: left;
  cursor: pointer;
  color: #244d5f;
  background: rgba(255,255,255,0.10);
  color: rgba(255,255,255,0.92);
}

.aid-app-step span {
  width: 29px;
  height: 29px;
  border-radius: 50%;
  display: grid;
  place-items: center;
  background: #e8f6f8;
  color: #0d697a;
  font-weight: 500;
  grid-row: span 2;
  font-size: 14px;
}

.aid-app-step strong,
.aid-app-step small {
  display: block;
}

.aid-app-step small {
  color: #fff;
  font-size: 12px;
  line-height: 1.35;
}

.aid-app-step.active {
  border-color: transparent;
  background: rgba(255,255,255,0.22);
  color: #fff;
}

.aid-app-step.active span {
  background: rgb(255, 255, 255);
  color: #0e6a7b;
}

.aid-app-step.active small {
  color: rgba(255,255,255,0.78);
}

.aid-app-form {
  padding: 24px;
}

.aid-app-panel {
  display: none;
}

.aid-app-panel.active {
  display: block;
}

.aid-app-panel-head {
  margin-bottom: 20px;
  border-bottom: 1px solid #e4eff2;
  padding-bottom: 14px;
}

.aid-app-panel-head h2 {
  color: #0d4358;
  font-size: 24px;
  margin-bottom: 4px;
}

.aid-app-panel-head p {
  color: #607785;
  margin: 0;
  font-size: 17px;
}

.aid-app-section {
  margin-bottom: 20px;
}

.aid-eligibility-card {
  border: 1px solid #dceef2;
  border-radius: 14px;
  background: linear-gradient(180deg, #f8fcfd 0%, #eff9fb 100%);
  padding: 18px;
}

.aid-eligibility-label {
  display: block;
  margin-bottom: 10px;
  color: #0d4358;
  font-size: 17px;
  font-weight: 700;
}

.aid-eligibility-choice {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
}

.aid-eligibility-choice label {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  min-height: auto;
  cursor: pointer;
  padding: 14px 18px;
  border: 1px solid #d4e5ea;
  border-radius: 16px;
  background: #fff;
  color: #0d4358;
  font-weight: 500;
  transition: 0.2s ease;
  box-shadow: 0 10px 24px rgba(17, 76, 92, 0.04);
}

.aid-eligibility-choice input {
  position: absolute;
  opacity: 0;
  pointer-events: none;
}

.aid-eligibility-choice label:hover {
  border-color: #9bd5d8;
  background: #f5fbfb;
}

.aid-eligibility-choice input:checked + span,
.aid-eligibility-choice label.is-active {
  color: #fff;
}

.aid-eligibility-choice label.is-active {
  border-color: #15999b;
  background: linear-gradient(135deg, #15999b, #114c5c);
  box-shadow: 0 14px 32px rgba(21, 153, 155, 0.28);
}

.aid-eligibility-choice label span {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  line-height: 1.3;
}

.aid-eligibility-help {
  margin: 1px 0 0;
  color: #607785;
  line-height: 1.6;
  font-size: 16px;
}

.aid-dependent-fields[hidden],
.aid-app-message[hidden] {
  display: none !important;
}

.aid-app-message {
  border: 1px solid transparent;
  border-radius: 12px;
  padding: 14px 16px;
  font-weight: 500;
  line-height: 1.6;
}

.aid-app-message.is-info {
  background: #eef7fb;
  border-color: #cfe4ef;
  color: #1f5d75;
  font-size: 16px;
}

.aid-app-message.is-success {
  background: #edf8f4;
  border-color: #cce9dc;
  color: #0c6f47;
}

.aid-app-message.is-warning {
  background: #fff7e8;
  border-color: #f4dfb2;
  color: #8c5b00;
}

.aid-app-message.is-error {
  background: #fff0f2;
  border-color: #f1c7cf;
  color: #b3223d;
}

.aid-app-section h3 {
  color: #0d4358;
  font-size: 18px;
  display: flex;
  align-items: center;
  gap: 9px;
  margin-bottom: 12px;
}

.aid-app-section h3 i {
  color: #15999b;
}

.aid-app-grid,
.aid-upload-grid,
.aid-review-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 14px;
}

.aid-app-grid label,
.aid-upload-grid label,
.aid-review-grid div {
  border: 1px solid #dceef2;
  border-radius: 12px;
  background: #f8fcfd;
  padding: 14px;
  color: #315568;
  font-size: 16px;
}

.aid-app-grid input,
.aid-app-grid select,
.aid-app-grid textarea {
  width: 100%;
  border: 1px solid #cde2e8;
  border-radius: 8px;
  background: #fff;
  color: #0d4358;
  padding: 10px 12px;
  margin-top: 8px;
}

.aid-app-grid textarea {
  min-height: 92px;
  resize: vertical;
}

.aid-app-full {
  grid-column: 1 / -1;
}

.aid-upload-grid label {
  cursor: pointer;
  transition: 0.25s ease;
}

.aid-upload-grid label:hover {
  border-color: #15999b;
  background: #effafa;
}

.aid-upload-grid i {
  font-size: 24px;
  color: #15999b;
  margin-bottom: 10px;
}

.aid-upload-grid strong,
.aid-upload-grid small,
.aid-review-grid strong,
.aid-review-grid span {
  display: block;
}

.aid-upload-grid small,
.aid-review-grid span {
  color: #607785;
  margin-top: 4px;
}

.aid-upload-grid input {
  margin-top: 12px;
  width: 100%;
}

.aid-upload-group-title {
  grid-column: 1 / -1;
  margin: 22px 0 0;
  padding: 14px 0 8px;
  border-bottom: 1px solid rgba(17, 76, 92, 0.18);
  color: #114c5c;
  font-size: 20px;
  line-height: 1.3;
}

.aid-upload-group-title:first-child {
  margin-top: 0;
}

.aid-terms-box,
.aid-reference-card {
  border: 1px solid #dceef2;
  border-radius: 14px;
  background: #f8fcfd;
  padding: 18px;
  color: #315568;
  line-height: 1.65;
}

.aid-app-check {
  display: flex;
  align-items: center;
  gap: 10px;
  margin-top: 16px;
  color: #244d5f;
}

.aid-reference-card {
  text-align: center;
}

.aid-reference-card span,
.aid-reference-card strong {
  display: block;
}

.aid-reference-card strong {
  color: #0d4358;
  font-size: 26px;
  margin: 3px 0 0;
}

.aid-app-actions {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  border-top: 1px solid #e4eff2;
  margin-top: 22px;
  padding-top: 18px;
}

.aid-app-primary,
.aid-app-secondary {
  min-height: 44px;
  border-radius: 8px;
  padding: 0 20px;
  border: 0;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  text-decoration: none;
  cursor: pointer;
}

.aid-app-primary {
  background: linear-gradient(135deg, #15999b, #114c5c);
  color: #fff;
}

.aid-app-secondary {
  background: #eef6f8;
  color: #0d697a;
}

.aid-app-secondary:disabled {
  opacity: 0.45;
  cursor: not-allowed;
}

@media (max-width: 991px) {
  .aid-app-shell {
    grid-template-columns: 1fr;
  }

  .aid-app-steps {
    position: static;
  }
}

@media (max-width: 575px) {
  .aid-app-page {
    padding: 32px 0;
  }

  .aid-app-hero h1 {
    font-size: 28px;
  }

  .aid-app-form {
    padding: 16px;
  }

  .aid-app-grid,
  .aid-upload-grid,
  .aid-review-grid {
    grid-template-columns: 1fr;
  }

  .aid-eligibility-choice {
    flex-direction: column;
  }

  .aid-app-actions {
    flex-direction: column;
  }
}

.language-option strong,
.language-option small {
  display: block;
}

.language-option strong {
  color: #114c5c;
  font-size: 17px;
  line-height: 1.2;
}

.language-option small {
  color: #65757b;
  font-size: 11px;
  line-height: 1.35;
  margin-top: 3px;
}

@media (max-width: 575px) {
  .language-popup {
    border-radius: 8px;
    padding: 20px;
  }

  .language-option {
    border-radius: 8px;
  }
}


@media (max-width: 768px) {
.abt-re-new .abt-hero-card h3 {
  font-size: 20px;
  margin-bottom: 7px;
  color: #fff;
}
.abt-re-new .abt-hero-card {
  padding: 15px;}

.abt-re-new .abt-hero-card-icon {
  width: 65px;
  height: 65px;
  border-radius: 999px;
  background: rgba(255,255,255,0.2);
  display: grid;
  place-items: center;
  font-size: 27px;
  margin-bottom: 8px;
  border: dashed 2px #abcbcb;
}



  .abt-re-new .abt-stat {
    align-items: anchor-center;
  }

.abt-re-new .abt-stat {
  background: rgba(255,255,255,0.86);
  border: 1px solid #cbe5ed;
  border-radius: 12px;
  padding: 13px;
  display: flex;
  gap: 17px;
  box-shadow: 0 12px 30px rgba(11, 82, 100, 0.07);
  transition: 0.3s;
}

.abt-re-new .abt-title-small {
  color: #159aa3;
  font-size: 13px;
  font-weight: 500;
  text-transform: uppercase;
  letter-spacing: 1px;
  margin-bottom: 4px;
}
.abt-re-new .abt-brief-card {
  border-radius: 13px;}


  .abt-re-new .abt-brief-card { padding:10px; gap: 0px;}


.abt-re-new .abt-brief-content h3 {
  font-size: 20px;
  color: #0b425a;
  margin-bottom: 8px;
  font-weight: 500;
}

.abt-re-new .abt-brief-content p {
  color: #556875;
  font-size: 17px;
  line-height: 1.4;
  margin-bottom: 20px;
}

.abt-re-new .abt-info-card {
  border-radius: 10px;
  padding: 17px;}


  .abt-re-new .abt-info-card p {
  color: #5a6f7d;
  font-size: 16px;
  line-height: 1.2;
  position: relative;
  z-index: 2;
  margin-bottom: 0;
}

.abt-re-new .abt-info-icon {
  font-size: 23px;
  margin-bottom: 7px;}

.abt-re-new .abt-section-head p {
  font-size: 16px;
  line-height: 1.3;
}
.abt-re-new .abt-section-head p {
  margin-bottom: 0;}

.abt-re-new .abt-activity-card {
  padding: 15px;}

  .abt-re-new .abt-list li {
  padding: 6px 12px;
  border-radius: 6px;
}
.abt-re-new .abt-card-top h3 {
  color: #0b425a;
  font-size: 19px;
  font-weight: 500;
}
.abt-re-new .abt-project-card {
  padding: 15px;}

  .abt-re-new .abt-project-card p {
  color: #5a6f7d;
  font-size: 17px;
  line-height: 1.35;
  margin-bottom: 0;
}
.policy-list--wrt .policy-breadcrumb { margin-bottom:5px; }
.policy-layout {
  padding: 0px 0 20px 0;
}


.policy-layout h3{
  font-size: 19px;
}

.policy-layout p{
  font-size: 15px;
  line-height: 20px;
  margin-top: 10px;
}

.policy-list--wrt .policy-icon {
  width: 60px;
  height: 60px;
  border-radius: 999px;
  background: linear-gradient(135deg, #116c7a, #1fa7ad);
  color: #fff;
  display: grid;
  place-items: center;
  font-size: 25px;
  flex-shrink: 0;
  box-shadow: 0 12px 24px rgba(17,108,122,0.16);
  border: dashed 1px #fff;
}
  .policy-list--wrt .policy-card h3 {
    font-size: 18px;
  }
.policy-list--wrt .policy-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 9px;
  min-height: 39px;
  padding: 10px 16px;
  border-radius: 7px;
  background: #e8f7f8;
  color: #087489;
  text-decoration: none;
  font-size: 16px;
  font-weight: 500;
  transition: 0.3s;
  position: relative;
  z-index: 2;
  border: solid 1px #9dcdd1;
}

.policy-list--wrt .policy-card p {
  color: #5a6f7d;
  font-size: 16px;
  line-height: 1.25;
  margin-bottom: 14px;
  position: relative;
  z-index: 2;
}
.mb-30 {
  margin-bottom: 10px;
}
.quk-dnt .top-right {
  margin-bottom: 15px;
  color: #334155;
  font-size: 14px;
}

.apply-info__card {
  gap: 5px;}


.apply-info__right {
  position: relative;
  z-index: 1;
  padding: 14px 15px;}


  .quk-dnt .custom-input {
  padding: 10px 20px;
  font-size: 16px;
  outline: none;
  margin-bottom: 13px;}

.quk-dnt .card-option { padding: 9px 9px; }
.crd-imgs-op {
  width: 37px;
  background: #ecf7f7;
  border-radius: 50%;
  padding: 7px;
  border: dashed 1px #11b2b5;
  height: 37px;
}
.quk-dnt .category-grid, .quk-dnt .payment-grid {
  gap: 8px;}

  .quk-dnt .amount-grid, .quk-dnt .category-grid, .quk-dnt .payment-grid {
  gap: 11px;}


  .amount-item span {
  height: 38px;}


.provider-toggle {
  margin-bottom: 0;
}
.quk-dnt .card-option {
  border: 1px solid #c4c4c4;
  border-radius: 7px;}



.abt-re-new .abt-btn {
  min-height: 50px;
  padding: 7px 22px;
  border-radius: 9px;
  border: 0;
  text-decoration: none;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 9px;
  font-size: 16px;
  font-weight: 500;
  cursor: pointer;
  transition: 0.3s;
}


.k-wraps .mobile-timeline {
  padding: 15px 10px;
  background: #f9fcfd;
  border-bottom: 1px solid #edf1f4;
}

.k-wraps .mobile-step p {
  color: #687b89;
  font-size: 13px;
  margin-bottom: 0;
}

.k-wraps .subtitle {
  font-size: 15px;
  margin-bottom: 15px;}


.donation-options {
  grid-template-columns: repeat(2, 2fr);
}


.sdm-s {
  margin-bottom: 9px;
  background-color: #e5f6fa70;
  display: inline-block;
  width: 60px;
  height: 60px;
  border-radius: 50%;
  border: dashed 1px #16808bc4;
  padding: 14px;
}

.donation-option .description {
  font-size: 13px;
  color: #555;
}

.h-d-wrp .upload-card p {
  color: #657f89;
  margin-bottom: 14px;
  font-size: 14px;
}

.h-d-wrp #image-preview {
  margin-top: 0;}

  .camera-btn {
  background-color: #079ca1;
  color: white;
  padding: 11px 20px;
  font-size: 16px;
  border: none;
  border-radius: 5px;
  cursor: pointer;
  transition: 0.3s ease;
}

.upload-card {
    margin-bottom: 15px;
  }


  .additional-field {
  padding: 15px;}

  .k-wraps .step-actions {
  margin-top: 12px;}



.k-wraps .summary-head {
  background: linear-gradient(135deg, #006f7c, #005762);
  color: #fff;
  padding: 12px;
  display: flex;
  gap: 7px;
  align-items: center;
  font-size: 16px;
  font-weight: 500;
}



.k-wraps .summary-body {
	padding: 13px 10px;
  display: grid;
  gap: 0px;
  grid-template-columns: repeat(1, 2fr);
}







}

/* In-kind after-payment responsive */
.pay-afrer-wrap {
  max-width: 100%;
  overflow-x: hidden;
}

.pay-afrer-wrap .container {
  
  width: 100%;
}

.after-payment-layout {
  display: flex;
  gap: 20px;
  align-items: flex-start;
}

.after-payment-message {
  margin-top: 14px;
  padding: 10px 14px;
  border: 1px solid #b7e0de;
  border-radius: 8px;
  background: #edfbfc;
  color: #114c5c;
  font-size: 15px;
  line-height: 1.4;
}

.receipt-popup {
  position: fixed;
  inset: 0;
  z-index: 20000;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 24px;
}

.receipt-popup__overlay {
  position: absolute;
  inset: 0;
  background: rgba(3, 24, 30, 0.72);
  backdrop-filter: blur(7px);
}

.receipt-popup__dialog {
  position: relative;
  z-index: 1;
  width: min(1120px, 100%);
  max-height: 92vh;
  overflow: hidden;
  border-radius: 14px;
  background: #f7fbfc;
  box-shadow: 0 30px 80px rgba(0, 0, 0, 0.35);
}

.receipt-popup__close {
  position: absolute;
  right: 14px;
  top: 12px;
  z-index: 4;
  width: 38px;
  height: 38px;
  border: 1.5px solid #0d7880;
  border-radius: 50%;
  background: #fff;
  color: #0d7880;
  font-size: 27px;
  line-height: 1;
  cursor: pointer;
}

.receipt-popup__scroll {
  max-height: 92vh;
  overflow-y: auto;
  padding: 24px 0;
}

.receipt-popup .print-screens-wrp {
  background: transparent;
}

.receipt-popup .print-screens-wrp .container {
  max-width: 1040px;
}

.print-screens.is-exporting-receipt .print-btn,
.print-screens.is-exporting-receipt .footer-actions {
  display: none !important;
}

.pay-afrer-wrap .donation-summary,
.pay-afrer-wrap .option-box,
.pay-afrer-wrap .impact-box,
.pay-afrer-wrap .secure-box {
  min-width: 0;
}

.pay-afrer-wrap .summary-row {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 16px;
  flex-wrap: wrap;
}

.pay-afrer-wrap .summary-row strong {
  overflow-wrap: anywhere;
  text-align: right;
}

.pay-afrer-wrap .uploaded-images {
  display: flex;
  gap: 10px;
  flex-wrap: wrap;
  margin-top: 10px;
}

.pay-afrer-wrap .uploaded-images img {
  width: 92px;
  height: 92px;
  object-fit: cover;
  border-radius: 8px;
}

.pay-afrer-wrap .action-buttons button,
.pay-afrer-wrap .option-buttons button,
.pay-afrer-wrap .contnu-wrap {
  min-height: 52px;
}

@media (max-width: 991px) {
  .pay-afrer-wrap {
    padding: 32px 0;
  }

  .after-payment-layout {
    flex-direction: column;
  }

  .success-left,
  .success-right {
    width: 100%;
    flex: none;
  }
}

@media (max-width: 575px) {
  .pay-afrer-wrap {
    padding: 22px 0;
  }

  .pay-afrer-wrap .container {
    padding-left: 14px;
    padding-right: 14px;
  }

  .success-left,
  .success-right .option-box,
  .success-right .impact-box {
    border-radius: 8px;
    padding: 16px;
  }

  .success-left h1 {
    font-size: 20px;
    line-height: 1.2;
  }

  .success-left p,
  .option-box p,
  .secure-box {
    font-size: 14px;
    line-height: 1.45;
  }

  .pay-afrer-wrap .summary-row {
    display: block;
    padding: 12px 15px;
  }

  .pay-afrer-wrap .summary-row span,
  .pay-afrer-wrap .summary-row strong {
    display: block;
    text-align: left;
  }

  .pay-afrer-wrap .summary-row strong {
    margin-top: 5px;
  }

  .pay-afrer-wrap .uploaded-images {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  .pay-afrer-wrap .uploaded-images img {
    width: 100%;
    height: auto;
    aspect-ratio: 1;
  }

  .action-buttons,
  .option-buttons,
  .secure-box {
    flex-direction: inherit;
  }

  .action-buttons{
    flex-direction: column;
  }
  .option-buttons button,
  .pay-afrer-wrap .contnu-wrap {
    width: 100%;
  }

  .impact-stats {
    display: grid;
    grid-template-columns: 1fr;
  }

  .impact-stat {
    width: 100%;
  }

.donation-card  .content h3 {
    font-size: 18px;
    text-align: center;
  }
  .donation-card .prog-cntnt p {
  min-height: auto;
  line-height: 19px;
  margin-bottom: 13px;
}
.ptoject-wr .amounts {
  margin-bottom: 11px;
  padding: 10px 10px;}

.donate-row button {
	height: 39px;}



.dn-details-p {
  padding: 16px;
  border-radius: 10px;}



.sr-imgs img {
  border-radius: 10px;
  width: 100%;
}

  .page-single-sidebar {
    position: initial;
    margin-bottom: 0;
  }
.dn-details-p .form-row {
  display: flex;
  gap: 15px;
  flex-wrap: wrap;
  margin-bottom: 20px;
  flex-direction: column;
}


 .dn-details-p .btn-row {
    flex-direction: column;
    gap: 0px;
    margin-top: 0;
  }
.dn-details-p .desc {
  color: #444;
  line-height: 1.3;
  margin-bottom: 17px;
  font-weight: 500;
}



.dn-details-p h1 {
  font-size: 19px;
  margin-bottom: 10px;
}

.dn-details-p .qty-box button {
  width: 33px;
  height: 38px;}



.amounts {
  display: flex;
  justify-content: space-between;
  margin-bottom: 0;
}
.provider-toggle {
  display: grid;
  justify-content: center;
  gap: 9px;
  margin-bottom: 8px;
  grid-template-columns: repeat(4, 1fr);
}




}

/* Submit Aid Request professional responsive */
.sad-hero-new,
.sad-section {
  overflow-x: hidden;
}

.sad-hero-new {
  border-radius: 12px !important;
  margin: 0 auto;
}

.sad-hero-new .container,
.sad-section .container {
  width: 100%;
}

.sad-hero-new-grid {
  grid-template-columns: minmax(0, 1fr) minmax(320px, 0.9fr);
  gap: 42px;
}

.sad-hero-new h1 {
  font-size: 40px;
  line-height: 1.08;
}

.sad-hero-new p,
.sad-section-head p,
.sad-doc-list li,
.sad-notice p,
.sad-check {
  line-height: 1.55;
}

.sad-hero-stats,
.sad-info-grid,
.sad-doc-layout,
.sad-doc-list,
.sad-contact-modern,
.sad-apply-box {
  min-width: 0;
}

.sad-hero-img-card {
  position: relative;
  overflow: hidden;
  border-radius: 12px;
}

.sad-hero-img-card img {
  width: 100%;
  height: auto;
  aspect-ratio: 4 / 3;
  object-fit: cover;
  display: block;
}

.sad-floating-card {
  max-width: calc(100% - 28px);
}

.sad-contact-modern {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 14px;
}

.sad-contact-modern-box,
.sad-info-card,
.sad-doc-group,
.sad-side-card,
.sad-notice,
.sad-apply-box {
  border-radius: 12px;
}

.sad-contact-modern-box strong,
.sad-doc-list li,
.sad-check span {
  overflow-wrap: anywhere;
}

.sad-info-grid {
  grid-template-columns: repeat(4, minmax(0, 1fr));
}

.sad-doc-layout {
  grid-template-columns: minmax(260px, 310px) minmax(0, 1fr);
}

.sad-doc-list {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.sad-apply-box {
  grid-template-columns: minmax(0, 1fr) auto;
}

.sad-btn,
.sad-apply-box .sad-btn {
  text-align: center;
  white-space: normal;
}

@media (max-width: 1199px) {
  .sad-hero-new-grid {
    grid-template-columns: 1fr;
  }

  .sad-hero-new-content {
    max-width: 100%;
  }

  .sad-hero-new-visual {
    max-width: 720px;
    width: 100%;
  }
}

@media (max-width: 991px) {
  .sad-hero-new {
    padding: 44px 0 38px;
  }

  .sad-info-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .sad-doc-layout,
  .sad-apply-box {
    grid-template-columns: 1fr;
  }

  .sad-side-card {
    position: relative;
    top: auto;
  }

  .sad-apply-box .sad-btn {
    width: 100%;
  }
}

@media (max-width: 575px) {
  section:has(.sad-hero-new) {
    padding: 8px !important;
  }

  .sad-hero-new {
    padding: 28px 0 24px;
    border-radius: 8px !important;
  }

  .sad-hero-new .container,
  .sad-section .container {
    padding-left: 14px;
    padding-right: 14px;
  }

  .sad-container {
    width: 100%;
  }

  .sad-hero-badge {
    max-width: 100%;
    border-radius: 999px;
    font-size: 12px;
    padding: 8px 12px;
  }

  .sad-hero-new h1 {
    font-size: 22px;
    line-height: 1.33;
    letter-spacing: 0;
  }

  .sad-hero-new p {
    font-size: 15px;
    margin-top: 14px;
  }

  .sad-hero-stats {
    grid-template-columns: 3f 1fr;
    gap: 10px;
    margin-top: 20px;
  }

  .sad-hero-stats div,
  .sad-info-card,
  .sad-doc-group,
  .sad-side-card,
  .sad-notice,
  .sad-apply-box,
  .sad-contact-modern-box {
    border-radius: 8px;
  }

  .sad-hero-actions,
  .sad-contact-modern,
  .sad-notice {
    display: grid;
    grid-template-columns: 1fr;
  }

  .sad-hero-actions .sad-btn,
  .sad-btn {
    width: 100%;
  }

  .sad-floating-card {
    position: static;
    margin: 10px 0 0;
    display: none;
  }

  .sad-info-grid,
  .sad-doc-list {
    grid-template-columns: 1fr;
  }

  .sad-section {
    padding: 24px 0;
  }

  .sad-section-head {
    text-align: left;
    margin-bottom: 22px;
  }

  .sad-section-head h2 {
    font-size: 21px;
  }

  .sad-info-card,
  .sad-doc-group,
  .sad-side-card,
  .sad-notice,
  .sad-apply-box {
    padding: 16px;
  }

  .sad-info-icon {
    width: 42px;
    height: 42px;
    font-size: 34px;
    margin-bottom: 12px;
  }

  .sad-doc-title {
    display: grid;
    grid-template-columns: 1fr;
    gap: 8px;
  }

  .sad-doc-title h3 {
    font-size: 20px;
  }

  .sad-doc-title span {
    width: fit-content;
    font-size: 14px;
    padding: 7px 12px;
  }

  .sad-doc-list li {
    font-size: 15px;
    padding: 12px;
  }

  .sad-notice-icon {
    width: 40px;
    height: 40px;
    flex-basis: 40px;
  }

  .sad-check {
    font-size: 15px;
  }

.sad-hero-new-visual {
  position: relative;
  border-radius: 20px;
  overflow: hidden;
  border: 00;
}
  
}



@media (max-width: 768px) {

.tabs-min-srv__nav {
  display: grid;
  flex-wrap: wrap;
  gap: 9px;
  margin-bottom: 15px;
  grid-template-columns: repeat(2, 2fr);
}

.tabs-min-srv__btn i {
  font-size: 17px;}



.services-new-card .card-icon {
  width: 70px;
  height: 70px;
  padding: 9px;
}
.services-new-card h3 {
  margin: 0 0 4px;
  color: #114c5c;
  font-size: 18px;
  line-height: 1.35;
  font-weight: 500;
  letter-spacing: 0;
  position: relative;
  z-index: 2;
}

.services-new-card p {
  margin: 0;
  color: #6a7b75;
  font-size: 15px;
  line-height: 19px;
  position: relative;
  z-index: 2;
}


.Merited-wrap .form-subtitle {
  color: #64748b;
  line-height: 1.18;
  margin-bottom: 20px;
  font-size: 15px;
  margin-top: 10px;
}

.apply-info__badge {
  padding: 6px 15px;
  margin-bottom: 15px;
}

.apply-info__hero p {
  color: rgba(255,255,255,0.86);
  font-size: 15px;
  line-height: 1.38;
}

.apply-info__top h2 {
  font-size: clamp(21px, 2vw, 38px);
  color: #07384b;
  font-weight: 500;
  letter-spacing: 0;
  margin-bottom: 0px;
}

.apply-info__top p {
  font-size: 15px;
  line-height: 1.2;
  color: #647985;
  max-width: 650px;
  margin-top: 10px;
}

.apply-info__top {
  margin-bottom: 0;
}


.apply-info__fetch p {
  font-size: 14px;
  color: #647985;
  line-height: 1.3;
  margin-bottom: 0;
}


.dp-profile-view-btn {
  min-height: 48px;}


.db1-avatar {
  width: 80px;
  height: 80px;}
.db1-profile h3 {
  font-size: 20px;}


 .db1-profile p {
  color: rgba(255,255,255,0.82);
  font-size: 15px;
  line-height: 1.5;
  margin-bottom: 0;
}

.benifi-dash-bord .beni-tab-content.active { padding:5px }

.track-wrap .title {
  font-size: 14px;
  color: #333;
  margin-bottom: 15px;
  line-height: 20px;
}

.track-wrap {
  padding: 0px 0px;
  text-align: center;
}
.post-entry h5 {
  font-size: 19px;
}

.post-entry {
  border-bottom: 0;
  padding-bottom: 0;
  margin-bottom: 0;
}
.post-image figure {
  border-radius: 10px;}


.bakacnt-wrap-1 .bank-intro-icon {
  width: 55px;
  height: 55px;
  border-radius: 50%;
  background: linear-gradient(135deg, #0d5262, #19a4a9);
  color: #fff;
  display: grid;
  place-items: center;
  font-size: 24px;}

.bakacnt-wrap-1 .bank-logo {
  width: 60px;
  height: 60px;
  border-radius: 50%;
  background: #fff;
  border: 1px solid #dbeaf0;
  display: grid;
  place-items: center;
  color: #087489;
  font-size: 25px;
  margin-bottom: 7px;}


.bakacnt-wrap-1 .bank-detail {
  background: #f7fbfc;
  border: 1px solid #dbeaf0;
  border-radius: 11px;
  padding: 5px 15px;
  display: grid;
  gap: 0px;
}


.bakacnt-wrap-1 .donate-action {
  width: 100%;
  min-height: 48px;
  border-radius: 7px;
  background: linear-gradient(135deg, #0d5262, #19a4a9);
  color: #fff;
  text-decoration: none;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  font-size: 16px;
  font-weight: 500;
  margin-top: 0px;
  transition: 0.3s;
  box-shadow: 0 14px 28px rgba(21,154,163,.2);
}

}

/* Open data responsive polish */
.open-d-w-1 {
  padding: 44px 0;
  overflow-x: hidden;
}

.open-d-w-1 .container {
  width: 100%;
  
}

.open-d-w-1 .open-container {
  width: 100%;
}

.open-d-w-1 .open-intro {
  display: grid;
  grid-template-columns: 74px minmax(0, 1fr);
  gap: 22px;
  align-items: start;
  padding: 28px;
  border-radius: 14px;
  background: rgba(255, 255, 255, .96);
  border: 1px solid rgba(13, 82, 98, .12);
  box-shadow: 0 14px 34px rgba(13, 82, 98, .08);
}

.open-d-w-1 .open-intro-icon {
  width: 74px;
  height: 74px;
  border-radius: 14px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex: 0 0 auto;
}

.open-d-w-1 .open-intro h2,
.open-d-w-1 .open-section-head h2 {
  overflow-wrap: anywhere;
}

.open-d-w-1 .open-intro p,
.open-d-w-1 .open-point p,
.open-d-w-1 .open-doc-body p {
  line-height: 1.65;
}

.open-d-w-1 .open-points {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 18px;
  margin-top: 22px;
}

.open-d-w-1 .open-point {
  height: 100%;
  min-width: 0;
  border-radius: 14px;
}

.open-d-w-1 .open-section-head {
  display: flex;
  align-items: end;
  justify-content: space-between;
  gap: 20px;
  margin-top: 34px;
}

.open-d-w-1 .open-doc-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 20px;
  align-items: stretch;
}

.open-d-w-1 .open-doc-card {
  display: flex;
  min-width: 0;
  height: 100%;
  overflow: hidden;
  flex-direction: column;
  border-radius: 14px;
}

.open-d-w-1 .open-doc-card > div:first-child {
  aspect-ratio: 16 / 10;
  background: #f2fbfb;
  overflow: hidden;
}

.open-d-w-1 .open-doc-card img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.open-d-w-1 .open-doc-body {
  display: flex;
  min-width: 0;
  flex: 1;
  flex-direction: column;
}

.open-d-w-1 .open-doc-body h3 {
  min-height: 0;
  overflow-wrap: anywhere;
}

.open-d-w-1 .open-actions {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
  margin-top: auto;
}

.open-d-w-1 .open-btn {
  width: 100%;
  min-width: 0;
  justify-content: center;
  white-space: nowrap;
}

@media (max-width: 991px) {
  .open-d-w-1 {
    padding: 38px 0;
  }

  .open-d-w-1 .open-points,
  .open-d-w-1 .open-doc-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 767px) {
  .open-d-w-1 {
    padding: 30px 0;
  }

  .open-d-w-1 .container {
    padding-left: 16px;
    padding-right: 16px;
  }

  .open-d-w-1 .open-intro {
    grid-template-columns: 58px minmax(0, 1fr);
    gap: 16px;
    padding: 20px;
    border-radius: 8px;
  }

  .open-d-w-1 .open-intro-icon {
    width: 58px;
    height: 58px;
    border-radius: 8px;
  }

  .open-d-w-1 .open-intro h2,
  .open-d-w-1 .open-section-head h2 {
    font-size: 24px;
    line-height: 1.25;
  }

  .open-d-w-1 .open-section-head {
    align-items: flex-start;
    margin-top: 26px;
  }

  .open-d-w-1 .open-point,
  .open-d-w-1 .open-doc-card {
    border-radius: 8px;
  }
}

@media (max-width: 575px) {
  .open-d-w-1 {
    padding: 24px 0;
    background-size: 100% 100%, 22px 22px, 22px 22px;
  }

  .open-d-w-1 .container {
    padding-left: 12px;
    padding-right: 12px;
  }

  .open-d-w-1 .open-intro {
    grid-template-columns: 1fr;
    gap: 14px;
    padding: 18px;
  }

  .open-d-w-1 .open-intro-icon {
    width: 52px;
    height: 52px;
  }

  .open-d-w-1 .open-intro h2,
  .open-d-w-1 .open-section-head h2 {
    font-size: 22px;
  }

  .open-d-w-1 .open-intro p,
  .open-d-w-1 .open-point p,
  .open-d-w-1 .open-doc-body p {
    font-size: 14px;
  }

  .open-d-w-1 .open-points,
  .open-d-w-1 .open-doc-grid {
    grid-template-columns: 1fr;
    gap: 14px;
  }

  .open-d-w-1 .open-point {
    padding: 18px;
  }

  .open-d-w-1 .open-section-head {
    display: block;
  }

  .open-d-w-1 .open-doc-body {
    padding: 18px;
  }

  .open-d-w-1 .open-actions {
    grid-template-columns: 1fr;
  }

  .open-d-w-1 .open-btn {
    min-height: 44px;
  }
}

/* Contact page responsive polish */
.contact-wrap {
  padding: 46px 0;
  overflow-x: hidden;
}

.contact-wrap .container,
.google-map .container {
  width: 100%;
  
}

.contact-wrap .contact-container {
  width: 100%;
}

.contact-wrap .contact-box {
  display: grid;
  grid-template-columns: minmax(300px, .9fr) minmax(0, 1.1fr);
  gap: 26px;
  align-items: stretch;
}

.contact-wrap .contact-info-panel,
.contact-wrap .contact-form-panel {
  min-width: 0;
  border-radius: 14px;
  padding: 28px;
}

.contact-wrap .contact-info-panel {
  display: flex;
  flex-direction: column;
}

.contact-wrap .contact-info-panel h2,
.contact-wrap .contact-form-panel h2,
.contact-wrap .contact-sub-title {
  overflow-wrap: anywhere;
}

.contact-wrap .contact-desc {
  max-width: 680px;
  line-height: 1.65;
}

.contact-wrap .contact-list {
  display: grid;
  gap: 16px;
  margin-top: 18px;
}

.contact-wrap .contact-item {
  display: grid;
  grid-template-columns: 52px minmax(0, 1fr);
  gap: 14px;
  align-items: center;
  min-width: 0;
  padding: 16px;
  border-radius: 12px;
  background: rgba(255, 255, 255, .72);
  border: 1px solid rgba(13, 82, 98, .10);
}

.contact-wrap .contact-icon {
  width: 52px;
  height: 52px;
  border-radius: 12px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}

.contact-wrap .contact-item a,
.contact-wrap .contact-item p {
  overflow-wrap: anywhere;
  word-break: break-word;
}

.contact-wrap .contact-form {
  width: 100%;
}

.contact-wrap .contact-form-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 18px;
}

.contact-wrap .contact-field,
.contact-wrap .contact-field input,
.contact-wrap .contact-field textarea {
  min-width: 0;
}

.contact-wrap .contact-field input,
.contact-wrap .contact-field textarea {
  border-radius: 10px;
  font-size: 15px;
}

.contact-wrap .contact-submit {
  width: fit-content;
  min-width: 190px;
  max-width: 100%;
  min-height: 50px;
  border-radius: 10px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  text-align: center;
}

.contact-wrap .contact-note {
  display: flex;
  align-items: flex-start;
  gap: 10px;
  line-height: 1.55;
  border-radius: 10px;
}

.google-map {
  padding: 8px 0 50px;
  overflow-x: hidden;
}

.google-map-iframe {
  height: clamp(320px, 48vw, 560px);
  border-radius: 14px;
  overflow: hidden;
  border: 1px solid rgba(13, 82, 98, .12);
  box-shadow: 0 16px 34px rgba(13, 82, 98, .09);
}

.google-map-iframe iframe {
  display: block;
  border-radius: 14px;
}

@media (max-width: 991px) {
  .contact-wrap {
    padding: 38px 0;
  }

  .contact-wrap .contact-box {
    grid-template-columns: 1fr;
    gap: 20px;
  }

  .contact-wrap .contact-list {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  .contact-wrap .contact-item {
    grid-template-columns: 1fr;
    align-content: start;
  }
}

@media (max-width: 767px) {
  .contact-wrap {
    padding: 30px 0;
  }

  .contact-wrap .container,
  .google-map .container {
    padding-left: 16px;
    padding-right: 16px;
  }

  .contact-wrap .contact-info-panel,
  .contact-wrap .contact-form-panel {
    padding: 22px;
    border-radius: 8px;
  }

  .contact-wrap .contact-info-panel h2,
  .contact-wrap .contact-form-panel h2 {
    font-size: 26px;
    line-height: 1.25;
  }

  .contact-wrap .contact-list {
    grid-template-columns: 1fr;
    gap: 12px;
  }

  .contact-wrap .contact-item {
    grid-template-columns: 46px minmax(0, 1fr);
    padding: 14px;
    border-radius: 8px;
  }

  .contact-wrap .contact-icon {
    width: 46px;
    height: 46px;
    border-radius: 50%;
  }

  .contact-wrap .contact-form-grid {
    grid-template-columns: 1fr;
    gap: 14px;
  }

  .contact-wrap .contact-field input,
  .contact-wrap .contact-field textarea,
  .contact-wrap .contact-submit,
  .contact-wrap .contact-note,
  .google-map-iframe,
  .google-map-iframe iframe {
    border-radius: 8px;
  }

  .contact-wrap .contact-field textarea {
    min-height: 150px;
  }

  .google-map {
    padding: 0 0 34px;
  }

  .google-map-iframe {
    height: 340px;
  }
}

@media (max-width: 480px) {
  .contact-wrap .container,
  .google-map .container {
    padding-left: 12px;
    padding-right: 12px;
  }

  .contact-wrap .contact-info-panel,
  .contact-wrap .contact-form-panel {
    padding: 18px;
  }

  .contact-wrap .contact-badge {
    max-width: 100%;
    white-space: normal;
  }

  .contact-wrap .contact-info-panel h2,
  .contact-wrap .contact-form-panel h2 {
    font-size: 19px;
    margin-bottom: 5px;
  }

  .contact-wrap .contact-desc,
  .contact-wrap .contact-item a,
  .contact-wrap .contact-item p,
  .contact-wrap .contact-note {
    font-size: 14px;
    line-height: 20px;
    margin-bottom: 15px;
  }

  .contact-wrap .contact-submit {
    width: 100%;
  }

  .google-map-iframe {
    height: 300px;
  }
  .contact-wrap .contact-submit { padding:15px; }
  .pb-50 {
  padding-bottom: 20px;
}
}

/* About page responsive polish */
.abt-re-new,
.abt-section,
.pb-50 {
  overflow-x: hidden;
}

.abt-re-new .abt-container,
.abt-section .container,
.pb-50 .container {
  width: 100%;
}

.abt-re-new .abt-hero {
  grid-template-columns: minmax(0, 1.1fr) minmax(280px, .9fr);
  gap: 28px;
}

.abt-re-new .abt-hero-content,
.abt-re-new .abt-hero-card,
.abt-brief-card,
.abt-brief-content,
.abt-info-card,
.abt-activity-card,
.abt-project-card,
.abt-message,
.abt-cta {
  min-width: 0;
}

.abt-section {
  margin-bottom: 34px;
}

.abt-section-head {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 18px;
}

.abt-section-head h2,
.abt-brief-content h3,
.abt-info-card h3,
.abt-message h2,
.abt-card-top h3,
.abt-project-card h3,
.abt-cta h2,
.abt-hero-card h3 {
  font-size: 19px;
  line-height: 1.35;
  overflow-wrap: anywhere;
}

.abt-hero h1,
.abt-section-head p,
.abt-brief-content p,
.abt-info-card p,
.abt-message p,
.abt-project-card p,
.abt-cta p,
.abt-list li {
  overflow-wrap: anywhere;
}

.abt-brief-card {
  display: grid;
  grid-template-columns: minmax(280px, .9fr) minmax(0, 1.1fr);
  gap: 24px;
}

.abt-brief-img {
  min-height: 320px;
}

.abt-info-grid,
.abt-project-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 16px;
}

.abt-list {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 12px;
}

.abt-list li {
  min-width: 0;
}

.abt-message {
  display: grid;
  grid-template-columns: 64px minmax(0, 1fr);
  gap: 20px;
}

.abt-cta {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 22px;
}

.abt-btn {
  max-width: 100%;
  min-width: 0;
  justify-content: center;
  text-align: center;
  white-space: normal;
}

@media (max-width: 1100px) {
  .abt-re-new .abt-hero,
  .abt-brief-card {
    grid-template-columns: 1fr;
  }

  .abt-re-new .abt-hero-card {
    max-width: 620px;
  }

  .abt-brief-img {
    min-height: 300px;
  }
}

@media (max-width: 800px) {
  .abt-re-new .abt-hero {
    padding: 32px 20px;
    min-height: auto;
  }

  .abt-re-new .abt-hero h1 {
    font-size: 28px;
    line-height: 1.2;
  }

  .abt-re-new .abt-hero-card,
  .abt-brief-card,
  .abt-info-card,
  .abt-message,
  .abt-activity-card,
  .abt-project-card,
  .abt-cta {
    border-radius: 8px;
  }

  .abt-section .container,
  .pb-50 .container {
    padding-left: 16px;
    padding-right: 16px;
  }

  .abt-section-head {
    display: block;
    margin-bottom: 18px;
  }

  .abt-section-head p {
    max-width: none;
    margin-top: 10px;
    font-size: 14px;
    line-height: 1.65;
  }

  .abt-brief-card,
  .abt-message,
  .abt-activity-card,
  .abt-project-card,
  .abt-cta {
    padding: 20px;
  }

  .abt-brief-img {
    min-height: 240px;
    border-radius: 8px;
  }

  .abt-info-grid,
  .abt-project-grid {
    grid-template-columns: 1fr;
  }

  .abt-list {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .abt-message {
    grid-template-columns: 52px minmax(0, 1fr);
    gap: 14px;
  }

  .abt-message i,
  .abt-card-icon,
  .abt-info-icon {
    width: 52px;
    height: 52px;
    font-size: 20px;
  }

  .abt-cta {
    align-items: flex-start;
    flex-direction: column;
  }
}

@media (max-width: 575px) {
  .abt-re-new .abt-hero {
    padding: 28px 14px;
    gap: 18px;
  }

  .abt-re-new .abt-badge,
  .abt-title-small {
    font-size: 12px;
  }

  .abt-re-new .abt-hero h1 {
    font-size: 24px;
  }

  .abt-re-new .abt-hero p,
  .abt-brief-content p,
  .abt-info-card p,
  .abt-message p,
  .abt-project-card p,
  .abt-cta p,
  .abt-list li {
    font-size: 14px;
    line-height: 1.6;
  }

  .abt-section {
    margin-bottom: 24px;
  }

  .abt-section .container,
  .pb-50 .container {
    padding-left: 12px;
    padding-right: 12px;
  }

  .abt-hero-actions,
  .abt-cta .abt-btn {
    width: 100%;
  }

  .abt-btn {
    width: 100%;
    min-height: 44px;
  }

  .abt-brief-card,
  .abt-info-card,
  .abt-message,
  .abt-activity-card,
  .abt-project-card,
  .abt-cta {
    padding: 18px;
  }

  .abt-brief-img {
    min-height: 210px;
  }

  .abt-brief-img::after {
    left: 12px;
    bottom: 12px;
    padding: 9px 12px;
    border-radius: 8px;
    font-size: 14px;
  }

  .abt-list {
    grid-template-columns: 1fr;
  }

  .abt-message {
    grid-template-columns: 1fr;
  }

  .abt-card-top {
    align-items: flex-start;
  }
}

/* Directors page modern redesign */
.directors-modern {
  position: relative;
  padding: 50px 0 50px;
  overflow: hidden;
  background:
    linear-gradient(rgba(255, 255, 255, .94), rgba(255, 255, 255, .96)),
    linear-gradient(90deg, rgba(21, 154, 163, .08) 1px, transparent 1px),
    linear-gradient(rgba(21, 154, 163, .08) 1px, transparent 1px);
  background-size: 100% 100%, 28px 28px, 28px 28px;
}

.directors-modern::before {
  content: "";
  position: absolute;
  width: 360px;
  height: 360px;
  left: -180px;
  top: 40px;
  border-radius: 50%;
  background: rgba(31, 167, 173, .08);
  pointer-events: none;
}

.directors-modern::after {
  content: "";
  position: absolute;
  width: 420px;
  height: 420px;
  right: -210px;
  bottom: -180px;
  border-radius: 50%;
  background: rgba(13, 82, 98, .07);
  pointer-events: none;
}

.directors-modern .container {
  position: relative;
  z-index: 2;
  width: 100%;
  /*!  */
}

.directors-intro {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 28px;
  margin-bottom: 28px;
}

.directors-eyebrow {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  color: #159aa3;
  background: #eefafa;
  border: 1px solid rgba(21, 154, 163, .18);
  border-radius: 999px;
  padding: 9px 15px;
  font-size: 13px;
  font-weight: 500;
  text-transform: uppercase;
}

.directors-eyebrow::before {
  content: "";
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: #159aa3;
}

.directors-intro h2 {
  margin: 12px 0 0;
  color: #0b425a;
  font-size: 30px;
  line-height: 1.22;
  font-weight: 500;
  max-width: 620px;
}

.directors-intro p {
  max-width: 470px;
  margin: 0;
  color: #5a6f7d;
  font-size: 16px;
  line-height: 1.7;
}

.directors-modern .row {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 22px;
  margin-left: 0;
  margin-right: 0;
}

.directors-modern .row > [class*="col-"] {
  width: auto;
  max-width: none;
  flex: none;
  padding: 0;
}

.directors-modern .team-item {
  display: flex;
  height: 100%;
  min-width: 0;
  flex-direction: column;
  padding: 0;
  overflow: hidden;
  border: 1px solid rgba(13, 82, 98, .12);
  border-radius: 14px;
  background: rgba(255, 255, 255, .96);
  box-shadow: 0 14px 34px rgba(13, 82, 98, .08);
  transition: transform .25s ease, box-shadow .25s ease, border-color .25s ease;
}

.directors-modern .team-item:hover {
  transform: translateY(-5px);
  border-color: rgba(21, 154, 163, .35);
  box-shadow: 0 18px 42px rgba(13, 82, 98, .13);
}

.directors-modern .team-item-image {
  position: relative;
  width: 100%;
  height: auto;
  margin: 0;
  padding: 18px 18px 0;
  border-radius: 0;
}

.directors-modern .team-item-image a,
.directors-modern .team-item-image figure {
  height: auto;
  margin: 0;
  overflow: hidden;
  border-radius: 12px;
  background: linear-gradient(135deg, #edfafa, #f8fbfb);
}

.directors-modern .team-item-image figure::before {
  display: none;
}

.directors-modern .team-item-image img {
  display: block;
  width: 100%;
  aspect-ratio: 4 / 3;
  height: auto;
  object-fit: cover;
  object-position: center top;
}

.directors-modern .team-item-body {
  display: flex;
  flex: 1;
  flex-direction: column;
  justify-content: flex-start;
  margin: 0;
  padding: 20px;
  text-align: left;
}

.directors-modern .team-item-content {
  display: flex;
  height: 100%;
  min-width: 0;
  flex-direction: column;
}

.directors-modern .team-item-content h2 {
  margin: 0 0 10px;
  color: #0b425a;
  font-size: 19px;
  line-height: 1.35;
  font-weight: 500;
  overflow-wrap: anywhere;
}

.directors-modern .team-item-content h2 a {
  color: inherit;
}

.directors-modern .team-item-content p {
  margin: 0;
  color: #5a6f7d !important;
  font-size: 15px;
  line-height: 1.6;
  overflow-wrap: anywhere;
}

@media (max-width: 991px) {
  .directors-modern {
    padding: 40px 0 48px;
  }

  .directors-intro {
    align-items: flex-start;
    flex-direction: column;
    gap: 14px;
  }

  .directors-intro h2 {
    font-size: 26px;
  }

  .directors-intro p {
    max-width: 760px;
  }

  .directors-modern .row {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 18px;
  }
}

@media (max-width: 767px) {
  .directors-modern {
    padding: 32px 0 40px;
  }

  .directors-modern .container {
    padding-left: 16px;
    padding-right: 16px;
  }

  .directors-intro {
    margin-bottom: 20px;
  }

  .directors-intro h2 {
    font-size: 23px;
  }

  .directors-intro p,
  .directors-modern .team-item-content p {
    font-size: 14px;
  }

  .directors-modern .team-item {
    border-radius: 8px;
  }

  .directors-modern .team-item-image {
    padding: 14px 14px 0;
  }

  .directors-modern .team-item-image a,
  .directors-modern .team-item-image figure {
    border-radius: 8px;
  }

  .directors-modern .team-item-body {
    padding: 16px;
  }
}

@media (max-width: 575px) {
  .directors-modern {
    padding: 26px 0 34px;
    background-size: 100% 100%, 22px 22px, 22px 22px;
  }

  .directors-modern .container {
    padding-left: 12px;
    padding-right: 12px;
  }

  .directors-modern .row {
    grid-template-columns: 1fr;
    gap: 14px;
  }

  .directors-eyebrow {
    font-size: 12px;
    padding: 8px 13px;
  }

  .directors-intro h2 {
    font-size: 21px;
  }

  .directors-modern .team-item-image img {
    aspect-ratio: 16 / 11;
  }

.directors-modern .team-item-content h2 {
  margin: 0 0 1px;}


.nw-mobile-dropdown a {
  padding: 6px 0 6px 0px !important;}

.nw-mobile-top h3{ font-size:20px; }


}

/* Cart page modern redesign */
.cart-wrap-1 {
  position: relative;
  padding: 50px 0 60px;
  overflow: hidden;
  background:
    linear-gradient(rgba(255, 255, 255, .94), rgba(255, 255, 255, .96)),
    linear-gradient(90deg, rgba(21, 154, 163, .08) 1px, transparent 1px),
    linear-gradient(rgba(21, 154, 163, .08) 1px, transparent 1px);
  background-size: 100% 100%, 28px 28px, 28px 28px;
}

.cart-wrap-1::before {
  content: "";
  position: absolute;
  width: 360px;
  height: 360px;
  left: -180px;
  top: 30px;
  border-radius: 50%;
  background: rgba(31, 167, 173, .08);
  pointer-events: none;
}

.cart-wrap-1::after {
  content: "";
  position: absolute;
  width: 430px;
  height: 430px;
  right: -210px;
  bottom: -190px;
  border-radius: 50%;
  background: rgba(13, 82, 98, .07);
  pointer-events: none;
}

.cart-wrap-1 .container {
  position: relative;
  z-index: 2;
  width: 100%;
}

.cart-wrap-1 .cart-container {
  width: 100%;
}

.cart-wrap-1 .cart-head {
  max-width: 720px;
  margin-bottom: 28px;
}

.cart-wrap-1 .cart-head span {
  border-radius: 999px;
  font-size: 13px;
  text-transform: uppercase;
}

.cart-wrap-1 .cart-head h2 {
  font-size: 30px;
  line-height: 1.2;
}

.cart-wrap-1 .cart-head p {
  max-width: 620px;
}

.cart-wrap-1 .cart-layout {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(320px, 390px);
  gap: 24px;
  align-items: start;
}

.cart-wrap-1 .cart-items,
.cart-wrap-1 .cart-item,
.cart-wrap-1 .cart-info,
.cart-wrap-1 .cart-summary {
  min-width: 0;
}

.cart-wrap-1 .cart-item {
  grid-template-columns: 72px minmax(0, 1fr) auto minmax(130px, auto) 44px;
  gap: 18px;
  padding: 22px;
  border-radius: 14px;
  background: rgba(255, 255, 255, .96);
  border: 1px solid rgba(13, 82, 98, .13);
  box-shadow: 0 14px 34px rgba(13, 82, 98, .08);
}

.cart-wrap-1 .cart-icon {
  width: 64px;
  height: 64px;
  border-radius: 14px;
}

.cart-wrap-1 .cart-info h3 {
  font-size: 19px;
  line-height: 1.35;
  overflow-wrap: anywhere;
}

.cart-wrap-1 .cart-info p {
  font-size: 15px;
  line-height: 1.5;
  overflow-wrap: anywhere;
}

.cart-wrap-1 .cart-qty {
  border-radius: 10px;
}

.cart-wrap-1 .cart-qty button {
  border-radius: 8px;
}

.cart-wrap-1 .cart-price {
  min-width: 130px;
}

.cart-wrap-1 .cart-price strong {
  font-size: 20px;
}

.cart-wrap-1 .cart-delete {
  border-radius: 10px;
}

.cart-wrap-1 .cart-summary {
  position: sticky;
  top: 20px;
  padding: 26px;
  border-radius: 14px;
}

.cart-wrap-1 .summary-row,
.cart-wrap-1 .summary-title,
.cart-wrap-1 .summary-total,
.cart-wrap-1 .summary-actions,
.cart-wrap-1 .payment-partners {
  min-width: 0;
}

.cart-wrap-1 .summary-row strong,
.cart-wrap-1 .summary-total strong {
  overflow-wrap: anywhere;
}

.cart-wrap-1 .summary-total {
  border-radius: 12px;
}

.cart-wrap-1 .summary-actions {
  grid-template-columns: 1fr;
}

.cart-wrap-1 .cart-btn {
  width: 100%;
  min-width: 0;
  border-radius: 10px;
  white-space: normal;
  text-align: center;
}

.cart-wrap-1 .payment-logos {
  overflow: hidden;
  border-radius: 10px;
}

.cart-wrap-1 .payment-logos img {
  display: block;
  width: 100%;
  height: auto;
  border-radius: 10px !important;
}

@media (max-width: 1100px) {
  .cart-wrap-1 .cart-layout {
    grid-template-columns: 1fr;
  }

  .cart-wrap-1 .cart-summary {
    position: relative;
    top: auto;
  }
}

@media (max-width: 767px) {
  .cart-wrap-1 {
    padding: 34px 0 42px;
  }

  .cart-wrap-1 .container {
    padding-left: 16px;
    padding-right: 16px;
  }

  .cart-wrap-1 .cart-head {
    margin-bottom: 20px;
  }

  .cart-wrap-1 .cart-head h2 {
    font-size: 20px;
  }

  .cart-wrap-1 .cart-head p {
    font-size: 14px;
  }

  .cart-wrap-1 .cart-item {
    grid-template-columns: 58px minmax(0, 1fr) 40px;
    gap: 14px;
    padding: 18px;
    border-radius: 8px;
  }

  .cart-wrap-1 .cart-icon {
    width: 54px;
    height: 54px;
    border-radius: 8px;
    font-size: 22px;
  }

  .cart-wrap-1 .cart-info {
    padding-right: 0;
  }

  .cart-wrap-1 .cart-info h3 {
    font-size: 17px;
  }

  .cart-wrap-1 .cart-info p,
  .cart-wrap-1 .cart-price span,
  .cart-wrap-1 .summary-row span,
  .cart-wrap-1 .summary-row strong {
    font-size: 14px;
  }

  .cart-wrap-1 .cart-delete {
    width: 40px;
    height: 40px;
    grid-column: 3;
    grid-row: 1;
    justify-self: end;
    border-radius: 8px;
  }

  .cart-wrap-1 .cart-qty {
    grid-column: 1 / 3;
    width: max-content;
    max-width: 100%;
    border-radius: 8px;
  }

  .cart-wrap-1 .cart-qty button,
  .cart-wrap-1 .cart-delete,
  .cart-wrap-1 .summary-total,
  .cart-wrap-1 .cart-btn,
  .cart-wrap-1 .payment-logos,
  .cart-wrap-1 .payment-logos img {
    border-radius: 8px !important;
  }

  .cart-wrap-1 .cart-price {
    grid-column: 1 / 4;
    min-width: 0;
    text-align: left;
  }

  .cart-wrap-1 .cart-price strong {
    font-size: 19px;
  }

  .cart-wrap-1 .cart-summary {
    padding: 20px;
    border-radius: 8px;
  }

  .cart-wrap-1 .summary-title span {
    font-size: 19px;
  }
}

@media (max-width: 480px) {
  .cart-wrap-1 {
    padding: 26px 0 34px;
    background-size: 100% 100%, 22px 22px, 22px 22px;
  }

  .cart-wrap-1 .container {
    padding-left: 12px;
    padding-right: 12px;
  }

  .cart-wrap-1 .cart-item {
    grid-template-columns: 1fr;
  }

  .cart-wrap-1 .cart-delete {
    position: absolute;
    right: 14px;
    top: 14px;
  }

  .cart-wrap-1 .cart-info {
    padding-right: 48px;
  }

  .cart-wrap-1 .cart-qty,
  .cart-wrap-1 .cart-price {
    grid-column: auto;
  }

  .cart-wrap-1 .cart-qty {
    width: 100%;
    justify-content: space-between;
  }

  .cart-wrap-1 .cart-qty input {
    flex: 1;
  }

  .cart-wrap-1 .summary-row {
    padding: 17px;
  }
}

/* Checkout page responsive polish */
.checkout-wrap-1 {
  padding: 50px 0 60px;
  overflow-x: hidden;
}

.checkout-wrap-1 .container {
  width: 100%;
  position: relative;
  z-index: 2;
}

.checkout-wrap-1 .checkout-container {
  width: 100%;
  max-width: none;
}

.checkout-wrap-1 .checkout-head {
  max-width: 760px;
  margin-bottom: 28px;
}

.checkout-wrap-1 .checkout-head span {
  border-radius: 999px;
  font-size: 13px;
  text-transform: uppercase;
}

.checkout-wrap-1 .checkout-head h1 {
  font-size: 30px;
  line-height: 1.2;
}

.checkout-wrap-1 .checkout-layout {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(320px, 400px);
  gap: 24px;
}

.checkout-wrap-1 .billing-card,
.checkout-wrap-1 .cart-card,
.checkout-wrap-1 .payment-card,
.checkout-wrap-1 .checkout-side,
.checkout-wrap-1 .billing-body,
.checkout-wrap-1 .cart-body,
.checkout-wrap-1 .contact-field,
.checkout-wrap-1 .payment-option,
.checkout-wrap-1 .payment-left,
.checkout-wrap-1 .payment-text {
  min-width: 0;
}

.checkout-wrap-1 .billing-card,
.checkout-wrap-1 .cart-card,
.checkout-wrap-1 > .payment-card,
.checkout-wrap-1 .checkout-side > .payment-card {
  border-radius: 14px;
  border-color: rgba(13, 82, 98, .13);
  box-shadow: 0 14px 34px rgba(13, 82, 98, .08);
}

.checkout-wrap-1 .card-head {
  padding: 22px;
  gap: 14px;
}

.checkout-wrap-1 .card-icon {
  width: 52px;
  height: 52px;
  border-radius: 12px;
  font-size: 21px;
}

.checkout-wrap-1 .card-head h2 {
  font-size: 18px;
  overflow-wrap: anywhere;
}

.checkout-wrap-1 .card-head p,
.checkout-wrap-1 .secure-note p,
.checkout-wrap-1 .cart-item h3,
.checkout-wrap-1 .cart-item p,
.checkout-wrap-1 .payment-text h4,
.checkout-wrap-1 .payment-text p {
  overflow-wrap: anywhere;
}

.checkout-wrap-1 .billing-body,
.checkout-wrap-1 .cart-body,
.checkout-wrap-1 .checkout-side > .payment-card {
  padding: 22px;
}

.checkout-wrap-1 .billing-body.contact-wrap {
  width: 100%;
  overflow: visible;
}

.checkout-wrap-1 .contact-form-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 16px;
}

.checkout-wrap-1 .contact-field input,
.checkout-wrap-1 .contact-field textarea {
  width: 100%;
  min-width: 0;
  border-radius: 10px;
  font-size: 15px;
}

.checkout-wrap-1 .contact-field textarea {
  min-height: 150px;
}

.checkout-wrap-1 .secure-note {
  border-radius: 10px;
  align-items: flex-start;
}

.checkout-wrap-1 .checkout-side {
  position: sticky;
  top: 20px;
  display: grid;
  gap: 20px;
}

.checkout-wrap-1 .cart-item {
  border-radius: 10px;
  padding: 16px;
}

.checkout-wrap-1 .cart-item-top,
.checkout-wrap-1 .price-line {
  display: flex;
  gap: 14px;
  justify-content: space-between;
}

.checkout-wrap-1 .cart-item strong,
.checkout-wrap-1 .price-line strong,
.checkout-wrap-1 .total-box strong {
  text-align: right;
  overflow-wrap: anywhere;
}

.checkout-wrap-1 .total-box {
  border-radius: 12px;
}

.checkout-wrap-1 .checkout-side > .payment-card h3 {
  display: flex;
  align-items: center;
  gap: 10px;
  margin-bottom: 16px;
  color: #073f54;
  font-size: 19px;
}

.checkout-wrap-1 .paynt-opt-slct-chckout {
  display: grid;
  gap: 12px;
}

.checkout-wrap-1 .payment-option {
  display: block;
  margin: 0;
}

.checkout-wrap-1 .payment-option > .payment-card {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  padding: 10px;
  border-radius: 10px;
}

.checkout-wrap-1 .payment-left {
  display: flex;
  align-items: center;
  gap: 12px;
}

.checkout-wrap-1 .payment-left img {
  width: 55px;
  height: 55px;
  flex: 0 0 auto;
  object-fit: contain;
}

.checkout-wrap-1 .pay-btn {
  width: 100%;
  min-height: 50px;
  border-radius: 8px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 9px;
  text-align: center;
}

@media (max-width: 1100px) {
  .checkout-wrap-1 .checkout-layout {
    grid-template-columns: 1fr;
  }

  .checkout-wrap-1 .checkout-side {
    position: relative;
    top: auto;
  }
}

@media (max-width: 767px) {
  .checkout-wrap-1 {
    padding: 34px 0 42px;
  }

  .checkout-wrap-1 .container {
    padding-left: 16px;
    padding-right: 16px;
  }

  .checkout-wrap-1 .checkout-head {
    margin-bottom: 20px;
  }

  .checkout-wrap-1 .checkout-head h1 {
    font-size: 20px;
  }

  .checkout-wrap-1 .checkout-head p,
  .checkout-wrap-1 .card-head p,
  .checkout-wrap-1 .secure-note,
  .checkout-wrap-1 .cart-item p,
  .checkout-wrap-1 .price-line,
  .checkout-wrap-1 .payment-text p {
    font-size: 14px;
  }

  .checkout-wrap-1 .billing-card,
  .checkout-wrap-1 .cart-card,
  .checkout-wrap-1 .checkout-side > .payment-card,
  .checkout-wrap-1 .card-icon,
  .checkout-wrap-1 .secure-note,
  .checkout-wrap-1 .cart-item,
  .checkout-wrap-1 .total-box,
  .checkout-wrap-1 .payment-option > .payment-card,
  .checkout-wrap-1 .pay-btn,
  .checkout-wrap-1 .contact-field input,
  .checkout-wrap-1 .contact-field textarea {
    border-radius: 8px;
  }

  .checkout-wrap-1 .card-head {
    padding: 18px;
    align-items: flex-start;
  }

  .checkout-wrap-1 .card-icon {
    width: 46px;
    height: 46px;
    font-size: 19px;
    border-radius: 50%;
  }

  .checkout-wrap-1 .billing-body,
  .checkout-wrap-1 .cart-body,
  .checkout-wrap-1 .checkout-side > .payment-card {
    padding: 18px;
  }

  .checkout-wrap-1 .contact-form-grid {
    grid-template-columns: 1fr;
    gap: 14px;
  }

  .checkout-wrap-1 .cart-item-top,
  .checkout-wrap-1 .price-line {
    align-items: flex-start;
  }

  .checkout-wrap-1 .payment-option > .payment-card {
    padding: 2px 12px;
  }
}

@media (max-width: 480px) {
  .checkout-wrap-1 {
    padding: 26px 0 34px;
    background-size: 100% 100%, 22px 22px, 22px 22px;
  }

  .checkout-wrap-1 .container {
    padding-left: 12px;
    padding-right: 12px;
  }

  .checkout-wrap-1 .card-head {
    display: grid;
    grid-template-columns: 46px minmax(0, 1fr);
  }

  .checkout-wrap-1 .cart-item-top,
  .checkout-wrap-1 .price-line,
  .checkout-wrap-1 .payment-option > .payment-card {
    flex-direction: column;
  }

  .checkout-wrap-1 .cart-item strong,
  .checkout-wrap-1 .price-line strong,
  .checkout-wrap-1 .total-box strong {
    text-align: left;
  }

  .checkout-wrap-1 .payment-left {
    width: 100%;
  }

  .checkout-wrap-1 .check-mark {
    align-self: initial;
    width: 28px;
    height: 27px;
  }
  .checkout-wrap-1 .cart-item p{ margin-bottom:0; }


.checkout-wrap-1 .payment-option > .payment-card {
    flex-direction: inherit;
  }

  
}

/* Booking / aid request responsive polish */
.bokking-wrap {
  padding: 46px 0 58px !important;
  overflow-x: hidden;
}

.bokking-wrap .container {
  width: 100%;
}

.bokking-wrap .form-mn-p {
  max-width: initial;
  margin: 0 auto 26px;
  padding: 20px 22px;
  border: 1px solid rgba(13, 82, 98, .12);
  border-radius: 14px;
  background: rgba(255, 255, 255, .92);
  box-shadow: 0 12px 30px rgba(13, 82, 98, .07);
  color: #4f6472;
  font-size: 16px !important;
  line-height: 1.75;
}

.bokking-wrap .ne-tab-step-form {
  width: 100%;
}

.bokking-wrap .ne-tab-step-form .ne-tsf-box {
  grid-template-columns: minmax(260px, 320px) minmax(0, 1fr);
  min-height: 0;
  border-radius: 14px;
  box-shadow: 0 16px 38px rgba(13, 82, 98, .09);
}

.bokking-wrap .ne-tab-step-form .ne-tsf-sidebar,
.bokking-wrap .ne-tab-step-form .ne-tsf-main,
.bokking-wrap .ne-tab-step-form .ne-tsf-panel,
.bokking-wrap .ne-tab-step-form .ne-tsf-form-grid,
.bokking-wrap .ne-tab-step-form .ne-tsf-upload-grid,
.bokking-wrap .ne-tab-step-form .ne-tsf-review,
.bokking-wrap .ne-tab-step-form .ne-tsf-upload,
.bokking-wrap .ne-tab-step-form .ne-tsf-review-card {
  min-width: 0;
}

.bokking-wrap .ne-tab-step-form .ne-tsf-sidebar {
  padding: 22px 16px;
}

.bokking-wrap .ne-tab-step-form .ne-tsf-steps {
  gap: 22px;
}

.bokking-wrap .ne-tab-step-form .ne-tsf-step {
  grid-template-columns: 34px 22px minmax(0, 1fr);
  gap: 12px;
  padding: 13px 12px;
  border-radius: 10px;
}

.bokking-wrap .ne-tab-step-form .ne-tsf-step-title,
.bokking-wrap .ne-tab-step-form .ne-tsf-step-desc,
.bokking-wrap .ne-tab-step-form label,
.bokking-wrap .ne-tab-step-form .ne-tsf-upload h4,
.bokking-wrap .ne-tab-step-form .ne-tsf-review-item span {
  overflow-wrap: anywhere;
}

.bokking-wrap .ne-tab-step-form .ne-tsf-step-title {
  font-size: 18px;
  line-height: 1.25;
}

.bokking-wrap .ne-tab-step-form .ne-tsf-step-desc {
  font-size: 12px;
  line-height: 1.35;
}

.bokking-wrap .ne-tab-step-form .ne-tsf-form-grid {
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 18px;
}

.bokking-wrap .ne-tab-step-form label {
  font-size: 15px;
  line-height: 1.45;
}

.bokking-wrap .ne-tab-step-form input,
.bokking-wrap .ne-tab-step-form select,
.bokking-wrap .ne-tab-step-form textarea {
  min-width: 0;
  border-radius: 10px !important;
  font-size: 15px;
}

.bokking-wrap .ne-tab-step-form .ne-tsf-radio-options {
  flex-wrap: wrap;
  gap: 10px 16px;
}

.bokking-wrap .ne-tab-step-form .ne-tsf-upload-grid,
.bokking-wrap .ne-tab-step-form .ne-tsf-review {
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 16px;
}

.bokking-wrap .ne-tab-step-form .ne-tsf-upload {
  border-radius: 10px;
}

.bokking-wrap .ne-tab-step-form .ne-tsf-upload input[type="file"] {
  max-width: 100%;
  font-size: 13px;
}

.bokking-wrap .ne-tab-step-form .ne-tsf-review-card {
  border-radius: 12px;
}

.bokking-wrap .ne-tab-step-form .ne-tsf-actions {
  gap: 14px;
}

.bokking-wrap .ne-tab-step-form .ne-tsf-actions-left,
.bokking-wrap .ne-tab-step-form .ne-tsf-actions-right {
  min-width: 0;
}

.bokking-wrap .ne-tab-step-form .ne-tsf-btn {
  max-width: 100%;
  border-radius: 10px;
  white-space: normal;
  text-align: center;
}

@media (max-width: 1100px) {
  .bokking-wrap .ne-tab-step-form .ne-tsf-box {
    grid-template-columns: 1fr;
  }

  .bokking-wrap .ne-tab-step-form .ne-tsf-sidebar {
    border-right: 0;
    border-bottom: 1px solid #eef3f5;
  }

  .bokking-wrap .ne-tab-step-form .ne-tsf-steps {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 12px;
  }

  .bokking-wrap .ne-tab-step-form .ne-tsf-steps::before,
  .bokking-wrap .ne-tab-step-form .ne-tsf-steps::after {
    display: none;
  }

  .bokking-wrap .ne-tab-step-form .ne-tsf-step {
    grid-template-columns: 34px minmax(0, 1fr);
  }

  .bokking-wrap .ne-tab-step-form .ne-tsf-step-icon {
    display: none;
  }
}

@media (max-width: 767px) {
  .bokking-wrap {
    padding: 30px 0 40px !important;
  }

  .bokking-wrap .container {
    padding-left: 16px;
    padding-right: 16px;
  }

  .bokking-wrap .form-mn-p {
    padding: 18px;
    border-radius: 8px;
    font-size: 14px !important;
    line-height: 1.65;
  }

  .bokking-wrap .ne-tab-step-form .ne-tsf-box {
    border-radius: 8px;
  }

  .bokking-wrap .ne-tab-step-form .ne-tsf-sidebar {
    padding: 14px;
  }

  .bokking-wrap .ne-tab-step-form .ne-tsf-steps {
    display: flex;
    gap: 10px;
    overflow-x: auto;
    padding-bottom: 4px;
    scroll-snap-type: x proximity;
  }

  .bokking-wrap .ne-tab-step-form .ne-tsf-step {
    min-width: 210px;
    scroll-snap-align: start;
    border-radius: 8px;
  }

  .bokking-wrap .ne-tab-step-form .ne-tsf-form-grid,
  .bokking-wrap .ne-tab-step-form .ne-tsf-upload-grid,
  .bokking-wrap .ne-tab-step-form .ne-tsf-review {
    grid-template-columns: 1fr;
    gap: 14px;
  }

  .bokking-wrap .ne-tab-step-form input,
  .bokking-wrap .ne-tab-step-form select,
  .bokking-wrap .ne-tab-step-form textarea,
  .bokking-wrap .ne-tab-step-form .ne-tsf-upload,
  .bokking-wrap .ne-tab-step-form .ne-tsf-review-card,
  .bokking-wrap .ne-tab-step-form .ne-tsf-btn {
    border-radius: 8px !important;
  }

  .bokking-wrap .ne-tab-step-form .ne-tsf-upload {
    padding: 15px;
  }

  .bokking-wrap .ne-tab-step-form .ne-tsf-review-item {
    display: grid;
    grid-template-columns: 1fr;
    gap: 4px;
    font-size: 14px;
  }

  .bokking-wrap .ne-tab-step-form .ne-tsf-review-item span:last-child {
    text-align: left;
  }

  .bokking-wrap .ne-tab-step-form .ne-tsf-actions,
  .bokking-wrap .ne-tab-step-form .ne-tsf-actions-left,
  .bokking-wrap .ne-tab-step-form .ne-tsf-actions-right {
    width: 100%;
  }

  .bokking-wrap .ne-tab-step-form .ne-tsf-actions {
    align-items: stretch;
    flex-direction: column;
  }

  .bokking-wrap .ne-tab-step-form .ne-tsf-btn,
  .bokking-wrap .ne-tab-step-form .ne-tsf-actions-left,
  .bokking-wrap .ne-tab-step-form .ne-tsf-actions-right {
    justify-content: center;
  }
}

@media (max-width: 480px) {
  .bokking-wrap {
    padding: 24px 0 34px !important;
  }

  .bokking-wrap .container {
    padding-left: 12px;
    padding-right: 12px;
  }

  .bokking-wrap .form-mn-p {
    margin-bottom: 18px;
  }

  .bokking-wrap .ne-tab-step-form .ne-tsf-step {
    min-width: 190px;
  }

  .bokking-wrap .ne-tab-step-form .ne-tsf-upload {
    display: grid;
    grid-template-columns: 42px minmax(0, 1fr);
  }

  .bokking-wrap .ne-tab-step-form .ne-tsf-btn {
    width: 100%;
    min-height: 44px;
    padding-left: 14px;
    padding-right: 14px;
  }

.ne-tab-step-form .ne-tsf-heading h2 {
  margin: 0 0 6px;
  font-size: 19px;}

.bokking-wrap .ne-tab-step-form .ne-tsf-steps {
    display: none;
  }

  .submit-wraps .card {
  padding: 10px 15px;}


.submit-wraps p{ margin-bottom:0; }
.about-footer-gold {
    margin-bottom: 0;
  }

}

/* Service details responsive polish */
.services-details-wrap-new {
  padding: 46px 0 58px;
  overflow-x: hidden;
}

.services-details-wrap-new .container {
  width: 100%;
}

.services-details-wrap-new .sdn-container,
.services-details-wrap-new .sdn-hero-modern,
.services-details-wrap-new .sdn-hero-left,
.services-details-wrap-new .sdn-hero-right,
.services-details-wrap-new .sdn-summary-card,
.services-details-wrap-new .sdn-content-area,
.services-details-wrap-new .sdn-sidebar-modern,
.services-details-wrap-new .sdn-section-card,
.services-details-wrap-new .sdn-support-panel,
.services-details-wrap-new .sdn-side-panel,
.services-details-wrap-new .ne-tab-menu,
.services-details-wrap-new .ne-tab-btn {
  min-width: 0;
}

.services-details-wrap-new .sdn-hero-modern {
  grid-template-columns: minmax(0, 1.1fr) minmax(280px, .9fr);
  gap: 26px;
  padding: 34px;
  border-radius: 14px;
}

.services-details-wrap-new .sdn-hero-modern h1 {
  font-size: 34px;
  line-height: 1.18;
  letter-spacing: 0;
  overflow-wrap: anywhere;
}

.services-details-wrap-new .sdn-hero-modern p,
.services-details-wrap-new .sdn-summary-card span,
.services-details-wrap-new .sdn-summary-card h3,
.services-details-wrap-new .sdn-section-head h2,
.services-details-wrap-new .sdn-section-head p,
.services-details-wrap-new .sdn-check-list p,
.services-details-wrap-new .sdn-support-panel p,
.services-details-wrap-new .sdn-support-item strong {
  overflow-wrap: anywhere;
}

.services-details-wrap-new .sad-hero-new-visual {
  width: 100%;
  overflow: hidden;
  border-radius: 12px;
}

.services-details-wrap-new .sad-hero-new-visual img {
  display: block;
  width: 100%;
  aspect-ratio: 4 / 3;
  height: auto;
  object-fit: cover;
}

.services-details-wrap-new .sdn-action-row {
  gap: 12px;
}

.services-details-wrap-new .sdn-primary-btn,
.services-details-wrap-new .sdn-secondary-btn,
.services-details-wrap-new .sdn-support-btn,
.services-details-wrap-new .sdn-confirm-modern {
  max-width: 100%;
  min-width: 0;
  border-radius: 10px;
  text-align: center;
  white-space: normal;
}

.services-details-wrap-new > .container > .sdn-container > h4,
.services-details-wrap-new .mb-20 {
  color: #0b425a;
  font-size: 19px;
  font-weight: 500;
}

.services-details-wrap-new .sdn-summary-grid {
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 16px;
}

.services-details-wrap-new .sdn-summary-card {
  padding: 18px;
  border-radius: 14px;
  gap: 16px;
}

.services-details-wrap-new .sdn-summary-icon {
  width: 64px;
  height: 64px;
  flex: 0 0 64px;
}

.services-details-wrap-new .sdn-summary-icon img,
.services-details-wrap-new .sdn-title-mark img,
.services-details-wrap-new .sdn-side-panel img {
  display: block;
  max-width: 100%;
  height: auto;
}

.services-details-wrap-new .sdn-main-layout {
  grid-template-columns: minmax(0, 1fr) minmax(280px, 340px);
  gap: 22px;
}

.services-details-wrap-new .ne-tab-menu {
  align-items: stretch;
  gap: 8px;
  overflow-x: auto;
  scroll-snap-type: x proximity;
}

.services-details-wrap-new .ne-tab-btn {
  flex: 0 0 auto;
  scroll-snap-align: start;
  padding: 13px 18px;
  border-radius: 8px;
}

.services-details-wrap-new .ne-tab-content {
  padding: 0;
}

.services-details-wrap-new .sdn-section-card {
  padding: 22px;
  border-radius: 14px;
  box-shadow: 0 14px 34px rgba(13, 82, 98, .07);
}

.services-details-wrap-new .sdn-section-head {
  align-items: flex-start;
  gap: 14px;
}

.services-details-wrap-new .sdn-title-mark {
  width: 48px;
  height: 48px;
  flex-basis: 48px;
}

.services-details-wrap-new .sdn-section-head h2 {
  font-size: 21px;
  line-height: 1.25;
}

.services-details-wrap-new .sdn-check-list {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.services-details-wrap-new .sdn-check-list div {
  align-items: flex-start;
  border-radius: 10px;
}

.services-details-wrap-new .sdn-check-list p {
  font-size: 15px;
  line-height: 1.5;
}

.services-details-wrap-new .sdn-sidebar-modern {
  position: sticky;
  top: 20px;
}

.services-details-wrap-new .sdn-side-panel,
.services-details-wrap-new .sdn-support-panel {
  padding: 20px;
  border-radius: 14px;
}

.services-details-wrap-new .sdn-side-panel img {
  margin: 0 auto;
}

.services-details-wrap-new .sdn-support-item {
  border-radius: 10px;
}

@media (max-width: 991px) {
  .services-details-wrap-new {
    padding: 38px 0 48px;
  }

  .services-details-wrap-new .sdn-hero-modern,
  .services-details-wrap-new .sdn-main-layout {
    grid-template-columns: 1fr;
  }

  .services-details-wrap-new .sdn-sidebar-modern {
    position: relative;
    top: auto;
    grid-template-columns: minmax(0, .8fr) minmax(0, 1.2fr);
  }

  .services-details-wrap-new .sdn-summary-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 767px) {
  .services-details-wrap-new {
    padding: 30px 0 40px;
  }

  .services-details-wrap-new .container {
    padding-left: 16px;
    padding-right: 16px;
  }

  .services-details-wrap-new .sdn-hero-modern {
    padding: 22px;
    border-radius: 8px;
  }

  .services-details-wrap-new .sdn-hero-modern h1 {
    font-size: 26px;
  }

  .services-details-wrap-new .sdn-hero-modern p,
  .services-details-wrap-new .sdn-check-list p,
  .services-details-wrap-new .sdn-support-panel p {
    font-size: 14px;
    line-height: 1.6;
  }

  .services-details-wrap-new .sad-hero-new-visual,
  .services-details-wrap-new .sdn-primary-btn,
  .services-details-wrap-new .sdn-secondary-btn,
  .services-details-wrap-new .sdn-support-btn,
  .services-details-wrap-new .sdn-confirm-modern,
  .services-details-wrap-new .sdn-summary-card,
  .services-details-wrap-new .ne-tab-menu,
  .services-details-wrap-new .ne-tab-btn,
  .services-details-wrap-new .sdn-section-card,
  .services-details-wrap-new .sdn-check-list div,
  .services-details-wrap-new .sdn-side-panel,
  .services-details-wrap-new .sdn-support-panel,
  .services-details-wrap-new .sdn-support-item {
    border-radius: 8px;
  }

  .services-details-wrap-new .sdn-action-row {
    display: grid;
    grid-template-columns: 1fr;
  }

  .services-details-wrap-new .sdn-primary-btn,
  .services-details-wrap-new .sdn-secondary-btn,
  .services-details-wrap-new .sdn-confirm-modern {
    width: 100%;
    min-height: 44px;
  }

  .services-details-wrap-new .sdn-summary-grid,
  .services-details-wrap-new .sdn-check-list,
  .services-details-wrap-new .sdn-sidebar-modern {
    grid-template-columns: 1fr;
  }

  .services-details-wrap-new .sdn-summary-card {
    padding: 16px;
  }

  .services-details-wrap-new .sdn-summary-icon {
    width: 54px;
    height: 54px;
    flex-basis: 54px;
  }

  .services-details-wrap-new .ne-tab-menu {
    padding: 8px;
    margin-bottom: 18px;
  }

  .services-details-wrap-new .ne-tab-btn {
    padding: 11px 14px;
    font-size: 14px;
  }

  .services-details-wrap-new .sdn-section-card,
  .services-details-wrap-new .sdn-side-panel,
  .services-details-wrap-new .sdn-support-panel {
    padding: 18px;
  }

  .services-details-wrap-new .sdn-section-head h2 {
    font-size: 19px;
  }
}

@media (max-width: 480px) {
  .services-details-wrap-new {
    padding: 24px 0 34px;
  }

  .services-details-wrap-new .container {
    padding-left: 12px;
    padding-right: 12px;
  }

  .services-details-wrap-new .sdn-hero-modern,
  .services-details-wrap-new .sdn-section-card,
  .services-details-wrap-new .sdn-side-panel,
  .services-details-wrap-new .sdn-support-panel {
    padding: 16px;
  }

  .services-details-wrap-new .sdn-section-head {
    display: grid;
    grid-template-columns: 44px minmax(0, 1fr);
  }

  .services-details-wrap-new .sdn-title-mark {
    width: 44px;
    height: 44px;
    flex-basis: 44px;
  }

  .services-details-wrap-new .sdn-summary-card {
    align-items: flex-start;
  }

.dntpopups .field-title {

    margin-bottom: 14px;
  font-size: 16px;}


  .dntpopups .secure-box {
  margin-top: 11px;
  background: #edfbfc;
  border-radius: 8px;
  padding: 9px 18px;
  display: flex;
  align-items: center;
  gap: 19px;
}
.dntpopups .help-text {
  margin: 6px 0 20px;
  color: #5e737a;
  font-size: 14px;}


 .dntpopups .secure-box p {
  margin: 0;
  color: #494c4d;
  font-size: 14px;
  line-height: 1.35;
}
.dntpopups .donation-modal {
    padding: 13px;}


   .dntpopups .close-popup {
    right: 4px;
    top: 4px;
    width: 34px;
    height: 34px;
    font-size: 29px;
  }
.dntpopups .donate-now {
  margin-top: 13px;}

.crtic .crtic-amount-box span {
  display: block;
  color: #5c7180;
  font-size: 14px;
  font-weight: 500;
  margin-bottom: 6px;
}
  .crtic .crtic-amount-grid {
  margin-bottom: 14px;
}

}

/* Home page mobile radius adjustment */
@media (max-width: 767px) {
  .home-page :where(
    .stry-card,
      .crtic-card,
    .crtic-img-wrap,
    .post-item,
    .post-featured-image a,
    .post-featured-image figure,
    .post-featured-image figure img,
    .about-us-image-gold,
    .about-us-image-gold figure,
    .about-us-image-gold img,
    .why-choose-image-gold,
    .why-choose-image-gold figure,
    .why-choose-image-gold img,
    .feature-item-gold,
    .feature-box-image-gold,
    .feature-box-image-gold figure,
    .feature-box-image-gold img,
    .how-it-work-image,
    .how-it-work-image figure,
    .how-it-work-image img,
    .cnt-bx,
    .donation-modal,
    .main-form,
    .method-card,
    .zakat-popup-card,
    .cookie-popup,
    .chat-box
  ) {
    border-radius: 13px !important;
  }
.feature-box-image-gold {
  height: calc(100% - 00px);
  margin-bottom: 0;
  overflow: hidden;
}

  .how-work-content {
    margin-bottom: 0;
  }


}

/* Receipt page responsive polish */
.print-screens-wrp {
  padding: 46px 0 58px;
  overflow-x: hidden;
}

.print-screens-wrp .container {
  width: 100%;
  max-width: 1180px;
}

.print-screens {
  width: 100%;
  max-width: 1000px;
  border-radius: 14px;
  overflow: hidden;
}

.print-screens .ps-header,
.print-screens .ps-body,
.print-screens .top-head,
.print-screens .receipt-top,
.print-screens .receipt-title,
.print-screens .receipt-info,
.print-screens .info-grid,
.print-screens .info-card,
.print-screens .payment-bar,
.print-screens .payment-item,
.print-screens .content-grid,
.print-screens .box,
.print-screens .total-row,
.print-screens .footer-bar,
.print-screens .footer-actions,
.print-screens .footer-btn,
.Payment-time-line-wrap,
.Payment-time-line-wrap .payment-content {
  min-width: 0;
}

.print-screens .ps-header {
  padding: 24px 28px;
}

.print-screens .ps-body {
  padding: 30px;
}

.print-screens .top-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 18px;
}

.print-screens .print-btn,
.print-screens .footer-btn {
  max-width: 100%;
  border-radius: 10px;
  white-space: normal;
  text-align: center;
}

.print-screens .receipt-top {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(260px, auto);
  gap: 24px;
  align-items: start;
}

.print-screens .receipt-title h1 {
  font-size: 28px;
  line-height: 1.2;
  overflow-wrap: anywhere;
}

.print-screens .receipt-title p,
.print-screens .receipt-info strong,
.print-screens .info-card h3,
.print-screens .payment-item strong,
.print-screens .box,
.print-screens .total-row,
.Payment-time-line-wrap .payment-top h4,
.Payment-time-line-wrap .payment-top span,
.Payment-time-line-wrap .payment-content p {
  overflow-wrap: anywhere;
}

.print-screens .receipt-info .info-box {
  margin-bottom: 16px;
}

.print-screens .info-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  border-radius: 14px;
}

.print-screens .info-card {
  padding: 24px 18px;
}

.print-screens .info-icon {
  width: 60px;
  height: 60px;
  margin-bottom: 14px;
}

.print-screens .info-icon img {
  display: block;
  max-width: 100%;
  height: auto;
}

.print-screens .payment-bar {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  border-radius: 14px;
}

.print-screens .payment-item {
  padding: 22px;
}

.print-screens .content-grid {
  display: grid;
  grid-template-columns: minmax(0, 1.1fr) minmax(0, .9fr);
  gap: 20px;
}

.print-screens .box {
  border-radius: 14px;
  padding: 24px;
}

.print-screens .box-title {
  line-height: 1.25;
}

.print-screens .total-row {
  border-radius: 14px;
  gap: 16px;
}

.print-screens .footer-bar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 18px;
}

.print-screens .footer-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
}

.Payment-time-line-wrap {
  border-radius: 14px;
}

.Payment-time-line-wrap .payment-top,
.Payment-time-line-wrap .payment-bottom {
  gap: 12px;
}

@media (max-width: 991px) {
  .print-screens-wrp {
    padding: 38px 0 48px;
  }

  .print-screens .info-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .print-screens .info-card:nth-child(2) {
    border-right: none;
  }

  .print-screens .info-card:nth-child(-n+2) {
    border-bottom: 1px solid #bae2f1;
  }

  .print-screens .payment-bar,
  .print-screens .content-grid {
    grid-template-columns: 1fr;
  }

  .print-screens .payment-item {
    border-right: none;
    border-bottom: 1px solid #bae2f1;
  }

  .print-screens .payment-item:last-child {
    border-bottom: none;
  }
}

@media (max-width: 767px) {
  .print-screens-wrp {
    padding: 30px 0 40px;
  }

  .print-screens-wrp .container {
    padding-left: 16px;
    padding-right: 16px;
  }

  .print-screens,
  .print-screens .info-grid,
  .print-screens .payment-bar,
  .print-screens .box,
  .print-screens .total-row,
  .print-screens .print-btn,
  .print-screens .footer-btn,
  .Payment-time-line-wrap,
  .Payment-time-line-wrap .payment-content {
    border-radius: 8px;
  }

  .print-screens .ps-header,
  .print-screens .ps-body {
    padding: 20px;
  }

  .print-screens .top-head,
  .print-screens .receipt-top,
  .print-screens .footer-bar {
    display: grid;
    grid-template-columns: 1fr;
    text-align: left;
  }

  .print-screens .receipt-info {
    text-align: left;
  }

  .print-screens .receipt-title h1 {
    font-size: 24px;
  }

  .print-screens .receipt-title p,
  .print-screens .receipt-info span,
  .print-screens .receipt-info strong,
  .print-screens .info-card h5,
  .print-screens .payment-item h6,
  .print-screens .payment-item strong,
  .Payment-time-line-wrap .payment-content p {
    font-size: 14px;
  }

  .print-screens .info-grid {
    grid-template-columns: 1fr;
  }

  .print-screens .info-card {
    border-right: none;
    border-bottom: 1px solid #bae2f1;
    padding: 20px;
  }

  .print-screens .info-card:last-child {
    border-bottom: none;
  }

  .print-screens .info-card h3,
  .Payment-time-line-wrap .payment-top h4,
  .Payment-time-line-wrap .payment-top span {
    font-size: 16px;
  }

  .print-screens .box {
    padding: 20px;
  }

  .print-screens .total-row {
    align-items: flex-start;
    flex-direction: column;
  }

  .print-screens .footer-actions,
  .print-screens .print-btn,
  .print-screens .footer-btn {
    width: 100%;
  }

  .print-screens .footer-btn,
  .print-screens .print-btn {
    min-height: 44px;
  }

  .Payment-time-line-wrap .payment-item {
    gap: 14px;
  }

  .Payment-time-line-wrap .payment-top,
  .Payment-time-line-wrap .payment-bottom {
    align-items: flex-start;
    flex-direction: column;
  }
}

@media (max-width: 480px) {
  .print-screens-wrp {
    padding: 24px 0 34px;
  }

  .print-screens-wrp .container {
    padding-left: 12px;
    padding-right: 12px;
  }

  .print-screens .ps-header,
  .print-screens .ps-body,
  .print-screens .box {
    padding: 16px;
  }

  .print-screens .info-icon {
    width: 52px;
    height: 52px;
  }
}

/* Donor dashboard mobile drawer header offset */
@media (max-width: 991px) {
  .dashbord-wrp-1 .dp-mobile-menu-backdrop {
    inset: 0 !important;
    height: 100dvh !important;
    z-index: 99998 !important;
  }

  .dashbord-wrp-1 .dp-sidebar {
    top: 0 !important;
    height: 100dvh !important;
    min-height: 100dvh !important;
    z-index: 99999 !important;
    border-radius: 0 8px 8px 0 !important;
  }
}

/* Donor dashboard full mobile drawer */
.dp-mobile-menu-close {
  display: none;
}

@media (max-width: 991px) {
  body.dp-menu-open-body {
    overflow: hidden !important;
  }

  .dashbord-wrp-1 .dp-mobile-menu-backdrop {
    position: fixed !important;
    inset: 0 !important;
    width: 100vw !important;
    height: 100dvh !important;
    z-index: 99998 !important;
    background: rgba(4, 44, 58, 0.45) !important;
  }

  .dashbord-wrp-1 .dp-sidebar {
    position: fixed !important;
    top: 0 !important;
    left: 0 !important;
    right: auto !important;
    bottom: auto !important;
    z-index: 99999 !important;
    width: min(420px, 100vw) !important;
    height: 100dvh !important;
    min-height: 100dvh !important;
    max-height: 100dvh !important;
    overflow-y: auto !important;
    padding: 58px 16px 22px !important;
    border-radius: 0 !important;
    transform: translateX(-105%) !important;
    box-shadow: 18px 0 45px rgba(3, 42, 54, 0.26) !important;
    -webkit-overflow-scrolling: touch;
  }

  .dashbord-wrp-1.dp-menu-open .dp-sidebar {
    transform: translateX(0) !important;
  }

  .dashbord-wrp-1 .dp-mobile-menu-close {
    position: fixed;
    top: 14px;
    right: 14px;
    z-index: 100000;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 38px;
    height: 38px;
    border: 1px solid rgba(255, 255, 255, 0.32);
    border-radius: 8px;
    background: rgba(255, 255, 255, 0.16);
    color: #fff;
    font-size: 18px;
    cursor: pointer;
    backdrop-filter: blur(8px);
  }

  .dashbord-wrp-1 .dp-profile {
    padding-right: 44px;
  }
}

@media (max-width: 575px) {
  .dashbord-wrp-1 .dp-sidebar {
    width: 100vw !important;
  }
}

/* Donor dashboard linked cards */
a.dp-dashboard-link {
  color: inherit;
  cursor: pointer;
  text-decoration: none;
}

a.dp-dashboard-link:hover,
a.dp-dashboard-link:focus {
  color: inherit;
  text-decoration: none;
}

.dp-dashboard-link:focus-visible {
  outline: 3px solid rgba(21, 153, 155, 0.28);
  outline-offset: 3px;
}



.news-w .post-item {
  margin-bottom: 35px;}


.dp-wallet-panel h3 {
  font-size: 19px;
}


.dp-wallet-panel p {
  font-size: 15px;
}

.dashbord-wrp-1 .dp-bank-details-grid strong {
  color: #173f45;
  font-size: 17px;
}



  @media (max-width: 768px) {
.news-w .post-item {
  margin-bottom: 0px;}

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

  .why-choose-image-box-2-gold {
  display: none;
}
.track-result-page .track-info-box {
  background: #f7fbfc;
  padding: 15px;
  border-radius: 13px;
}
.track-result-page .timeline-content p {
  color: #627783;
  line-height: 1.2;
  margin-bottom: 8px;
  white-space: initial;
}

.track-result-page .timeline-content {
  background: #15999b0f;
  padding: 15px;
  border-radius: 12px;
  width: 100%;
}
.track-result-page .support-message-box p {
  color: #617a86;
  line-height: 1.5;
  font-size: 14px;
  margin-bottom: 0;
}
  .why-choose-image-box-1-gold {
  width: 100%;}
  .wdth {
  width: 100%;
  height: 480px;
}
  .verify-icon {
  width: 40px;
  height: 40px;}

.track-bn-card-icon {
  width: 65px;
  height: 65px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 24px;
  margin-bottom: 20px;
}

  .notify-sec-wrap {
    padding: 0;
  }


}

/* Dashboard detail sections
   Used only by dashboard.html for card drill-down content. */

/* Interactive cards and detail container */
.dashbord-wrp-1 .dp-clickable-card {
  cursor: pointer;
  transition: transform 0.2s ease, border-color 0.2s ease, box-shadow 0.2s ease;
}

.dashbord-wrp-1 .dp-clickable-card:hover,
.dashbord-wrp-1 .dp-clickable-card:focus-visible,
.dashbord-wrp-1 .dp-clickable-card.active {
  border-color: #8fd0da;
  box-shadow: 0 12px 30px rgba(70, 50, 22, 0.12);
  outline: none;
  transform: translateY(-2px);
}

.dashbord-wrp-1 .dp-card-detail {
  display: none;
  margin-top: 24px;
  padding: 20px;
  border: 1px solid #a7d1d7;
  border-radius: 15px;
  background: #f4fbfc;
}

.dashbord-wrp-1 .dp-card-detail.active {
  display: block;
}

.dashbord-wrp-1 .dp-detail-head {
  display: flex;
  align-items: center;
  gap: 16px;
  margin-bottom: 24px;
}

.dashbord-wrp-1 .dp-detail-head > div:nth-child(2) {
  flex: 1;
}

.dashbord-wrp-1 .dp-detail-head h2,
.dashbord-wrp-1 .dp-detail-head p {
  margin: 0;
}

.dashbord-wrp-1 .dp-detail-status {
  padding: 7px 12px;
  border-radius: 999px;
  background: #148492;
  color: #fff;
  font-weight: 400;
  font-size: 15px;
}

.dashbord-wrp-1 .dp-detail-grid,
.dashbord-wrp-1 .dp-upload-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 16px;
  margin-bottom: 20px;
}

.dashbord-wrp-1 .dp-detail-field {
  display: grid;
  gap: 8px;
  color: #312a20;
  font-weight: 700;
}

.dashbord-wrp-1 .dp-detail-field input,
.dashbord-wrp-1 .dp-detail-field select,
.dashbord-wrp-1 .dp-detail-field textarea {
  width: 100%;
  padding: 12px 14px;
  border: 1px solid #c3e0e4;
  border-radius: 10px;
  background: #fff;
}

.dashbord-wrp-1 .dp-detail-check {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 14px;
  border: 1px solid #e7dcc5;
  border-radius: 10px;
  background: #fff;
}

.dashbord-wrp-1 .dp-upload-card {
  display: grid;
  place-items: center;
  min-height: 145px;
  padding: 19px;
  border: 2px dashed #6bbbc4;
  border-radius: 12px;
  background: #fff;
  cursor: pointer;
  text-align: center;
}

.dashbord-wrp-1 .dp-upload-card i {
  margin-bottom: 8px;
  color: #2e9ba7;
  font-size: 28px;
}

.dashbord-wrp-1 .dp-detail-save {
  margin-top: 4px;
}

.dashbord-wrp-1 .dp-donation-summary {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 14px;
  margin-bottom: 22px;
}

.dashbord-wrp-1 .dp-donation-summary > div {
  display: grid;
  gap: 3px;
  padding: 15px;
  border: 1px solid #c3e0e4;
  border-radius: 10px;
  background: #fff;
}

.dashbord-wrp-1 .dp-donation-summary strong {
  color: #173f45;
  font-size: 20px;
}

.dashbord-wrp-1 .dp-donation-summary span {
  color: #688087;
  font-size: 13px;
}

.dashbord-wrp-1 .dp-donation-toolbar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  margin-bottom: 16px;
}

.dashbord-wrp-1 .dp-donation-search {
  display: flex;
  align-items: center;
  gap: 10px;
  width: min(100%, 330px);
  padding: 0 14px;
  border: 1px solid #c3e0e4;
  border-radius: 10px;
  background: #fff;
}

.dashbord-wrp-1 .dp-donation-search input {
  width: 100%;
  padding: 11px 0;
  border: 0;
  outline: 0;
}

.dashbord-wrp-1 .dp-donation-table-wrap {
  overflow-x: auto;
  border: 1px solid #c3e0e4;
  border-radius: 8px;
  background: #fff;
}

.dashbord-wrp-1 .dp-donation-detail-table {
  width: 100%;
  min-width: 760px;
  border-collapse: collapse;
}

.dashbord-wrp-1 .dp-donation-detail-table th,
.dashbord-wrp-1 .dp-donation-detail-table td {
  padding: 10px 16px;
  border-bottom: 1px solid #e1eff1;
  color: #465153;
  text-align: left;
  font-size: 16px;
}

.dashbord-wrp-1 .dp-donation-detail-table th {
  background: #e8f5f7;
  color: #173f45;
  font-size: 16px;
  font-weight: 800;
}

.dashbord-wrp-1 .dp-donation-detail-table tbody tr:last-child td {
  border-bottom: 0;
}

.dashbord-wrp-1 .dp-donation-detail-table tbody tr.is-selected {
  background: #edf9fa;
}

.dashbord-wrp-1 .dp-record-status {
  display: inline-flex;
  padding: 2px 10px;
  border-radius: 999px;
  background: #e3f5ed;
  color: #287054;
  font-size: 12px;
  font-weight: 500;
}

.dashbord-wrp-1 .dp-record-view {
  padding: 4px 11px;
  border: 1px solid #62b2bc;
  border-radius: 4px;
  background: transparent;
  color: #148492;
  font-weight: 500;
  font-size: 15px;
}

.dashbord-wrp-1 .dp-campaign-progress-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 16px;
}

.dashbord-wrp-1 .dp-campaign-progress-card {
  padding: 18px;
  border: 1px solid #c3e0e4;
  border-radius: 12px;
  background: #fff;
}

.dashbord-wrp-1 .dp-campaign-progress-card > div:first-child {
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.dashbord-wrp-1 .dp-campaign-progress-card > div:first-child span,
.dashbord-wrp-1 .dp-campaign-progress-card small {
  color: #688087;
}

.dashbord-wrp-1 .dp-campaign-progress-card > div:first-child strong {
  color: #148492;
}

.dashbord-wrp-1 .dp-campaign-progress-card h3 {
  margin: 5px 0 4px;
  font-size: 18px;
}

.dashbord-wrp-1 .dp-campaign-progress-card p {
  margin-bottom: 7px;
  font-size: 17px;
}

.dashbord-wrp-1 .dp-campaign-progress {
  height: 8px;
  margin-bottom: 10px;
  overflow: hidden;
  border-radius: 999px;
  background: #e1eff1;
}

.dashbord-wrp-1 .dp-campaign-progress i {
  display: block;
  height: 100%;
  border-radius: inherit;
  background: #20a4b2;
}

.dashbord-wrp-1 .dp-campaign-view {
  display: block;
  width: 100%;
  margin-top: 14px;
  padding: 9px 12px;
  border: 1px solid #62b2bc;
  border-radius: 6px;
  background: #edf9fa;
  color: #148492;
  font-weight: 500;
  font-size: 17px;
}

.dashbord-wrp-1 .dp-campaign-updates {
  display: grid;
  gap: 12px;
}

.dashbord-wrp-1 .dp-campaign-updates article {
  display: flex;
  gap: 14px;
  padding: 16px;
  border: 1px solid #c3e0e4;
  border-radius: 12px;
  background: #fff;
}

.dashbord-wrp-1 .dp-campaign-updates h3,
.dashbord-wrp-1 .dp-campaign-updates p {
  margin: 0 0 5px;
}

.dashbord-wrp-1 .dp-campaign-updates small {
  color: #688087;
}

.dashbord-wrp-1 .dp-sponsorship-case-grid,
.dashbord-wrp-1 .dp-sponsorship-plan-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 16px;
}

.dashbord-wrp-1 .dp-sponsorship-case,
.dashbord-wrp-1 .dp-sponsorship-plan {
  padding: 18px;
  border: 1px solid #c3e0e4;
  border-radius: 12px;
  background: #fff;
}

.dashbord-wrp-1 .dp-sponsorship-case-top {
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.dashbord-wrp-1 .dp-sponsorship-case-top span,
.dashbord-wrp-1 .dp-sponsorship-case small,
.dashbord-wrp-1 .dp-sponsorship-plan span {
  color: #688087;
}

.dashbord-wrp-1 .dp-sponsorship-case-top b {
  padding: 4px 8px;
  border-radius: 999px;
  background: #e3f5ed;
  color: #287054;
  font-size: 12px;
}

.dashbord-wrp-1 .dp-sponsorship-case h3,
.dashbord-wrp-1 .dp-sponsorship-plan h3 {
  margin: 14px 0 0px;
  font-size: 18px;
}

.dashbord-wrp-1 .dp-sponsorship-case > strong,
.dashbord-wrp-1 .dp-sponsorship-plan > strong {
  display: block;
  margin-bottom: 10px;
  color: #148492;
  font-size: 18px;
}

.dashbord-wrp-1 .dp-sponsorship-plan ul {
  display: grid;
  gap: 8px;
  margin: 18px 0;
  padding: 0;
  list-style: none;
}

.dashbord-wrp-1 .dp-sponsorship-plan li {
  display: flex;
  align-items: center;
  gap: 8px;
  color: #425a60;
}

.dashbord-wrp-1 .dp-sponsorship-plan li i {
  color: #20a4b2;
}

.dashbord-wrp-1 .dp-sponsorship-view {
  padding: 12px 12px;
  border: 1px solid #62b2bc;
  border-radius: 6px;
  background: #edf9fa;
  color: #148492;
  font-weight: 500;
  font-size: 16px;
}

.dashbord-wrp-1 .dp-sponsorship-case .dp-sponsorship-view,
.dashbord-wrp-1 .dp-sponsorship-plan .dp-sponsorship-view {
  width: 100%;
  margin-top: 14px;
}

.dashbord-wrp-1 .dp-sponsorship-renewals {
  display: grid;
  gap: 12px;
}

.dashbord-wrp-1 .dp-sponsorship-renewals article {
  display: grid;
  grid-template-columns: minmax(220px, 1fr) auto auto auto;
  align-items: center;
  gap: 14px;
  padding: 16px;
  border: 1px solid #c3e0e4;
  border-radius: 12px;
  background: #fff;
}

.dashbord-wrp-1 .dp-sponsorship-renewals h3,
.dashbord-wrp-1 .dp-sponsorship-renewals p {
  margin: 0;
}

.dashbord-wrp-1 .dp-zakat-calculator {
  padding: 20px;
  border: 1px solid #c3e0e4;
  border-radius: 12px;
  background: #fff;
}

.dashbord-wrp-1 .dp-zakat-calculator h3 {
  margin-bottom: 4px;
  color: #173f45;
  font-size: 22px;
}

.dashbord-wrp-1 .dp-zakat-calculator p {
  margin-bottom: 20px;
  color: #688087;
}

.dashbord-wrp-1 .dp-zakat-fields {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 16px;
}

.dashbord-wrp-1 .dp-zakat-result {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  margin: 20px 0;
  padding: 18px;
  border-radius: 12px;
  background: #e8f5f7;
  color: #173f45;
}

.dashbord-wrp-1 .dp-zakat-result strong {
  color: #148492;
  font-size: 25px;
}

.dashbord-wrp-1 .dp-receipt-tools {
  display: grid;
  grid-template-columns: minmax(280px, 1fr) 225px auto;
  align-items: center;
  gap: 16px;
  margin-bottom: 16px;
}

.dashbord-wrp-1 .dp-receipt-tools .dp-donation-search {
  width: 100%;
  min-height: 54px;
}

.dashbord-wrp-1 .dp-receipt-tools .dp-donation-search input {
  height: 52px;
  padding: 0;
}

.dashbord-wrp-1 .dp-receipt-filter {
  display: block;
}

.dashbord-wrp-1 .dp-receipt-filter > span {
  position: absolute;
  width: 1px;
  height: 1px;
  overflow: hidden;
  clip: rect(0 0 0 0);
  white-space: nowrap;
}

.dashbord-wrp-1 .dp-receipt-filter select {
  width: 100%;
  height: 54px;
  padding: 0 16px;
  border: 1px solid #c3e0e4;
  border-radius: 10px;
  background: #fff;
  color: #425a60;
}

.dashbord-wrp-1 .dp-receipt-tools .dp-receipt-action,
.dashbord-wrp-1 .dp-receipt-tools .dp-static-action {
  min-height: 54px;
  margin: 0;
  white-space: nowrap;
}

.dashbord-wrp-1 .dp-receipt-download {
  padding: 4px 11px;
  border: 1px solid #62b2bc;
  border-radius: 6px;
  background: #edf9fa;
  color: #148492;
  font-weight: 500;
  font-size: 15px;
}

.dashbord-wrp-1 .dp-receipt-select,
.dashbord-wrp-1 .dp-receipt-select-all {
  width: 16px;
  height: 16px;
  accent-color: #148492;
}

/* Payment methods */
.dashbord-wrp-1 .dp-payment-summary {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 14px;
  margin-bottom: 20px;
}

.dashbord-wrp-1 .dp-payment-summary > div,
.dashbord-wrp-1 .dp-bank-details-grid > div {
  display: grid;
  gap: 4px;
  padding: 16px;
  border: 1px solid #c3e0e4;
  border-radius: 10px;
  background: #fff;
}

.dashbord-wrp-1 .dp-payment-summary strong,
.dashbord-wrp-1 .dp-bank-details-grid strong {
  color: #173f45;
  font-size: 18px;
}

.dashbord-wrp-1 .dp-payment-summary span,
.dashbord-wrp-1 .dp-bank-details-grid span {
  color: #688087;
  font-size: 13px;
}

.dashbord-wrp-1 .dp-saved-card-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 16px;
  margin-bottom: 20px;
}

.dashbord-wrp-1 .dp-saved-card {
  padding: 20px;
  border: 1px solid #c3e0e4;
  border-radius: 14px;
  background: linear-gradient(135deg, #173f45, #148492);
  color: #fff;
}

.dashbord-wrp-1 .dp-saved-card.is-default {
  background: linear-gradient(135deg, #116d78, #1aa6b4);
}

.dashbord-wrp-1 .dp-saved-card-top,
.dashbord-wrp-1 .dp-payment-actions,
.dashbord-wrp-1 .dp-wallet-panel,
.dashbord-wrp-1 .dp-payment-toggle-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
}

.dashbord-wrp-1 .dp-saved-card-top i {
  font-size: 30px;
}

.dashbord-wrp-1 .dp-saved-card-top span {
  padding: 4px 8px;
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.18);
  font-size: 12px;
}

.dashbord-wrp-1 .dp-saved-card > strong {
  display: block;
  margin-top: 28px;
  font-size: 20px;
  letter-spacing: 1px;
}

.dashbord-wrp-1 .dp-saved-card p {
  color: rgba(255, 255, 255, 0.75);
}

.dashbord-wrp-1 .dp-payment-actions button {
  padding: 6px 10px;
  border: 1px solid rgba(255, 255, 255, 0.45);
  border-radius: 6px;
  background: transparent;
  color: #fff;
  font-size: 16px;
}

.dashbord-wrp-1 .dp-wallet-panel,
.dashbord-wrp-1 .dp-auto-debit-panel,
.dashbord-wrp-1 .dp-bank-transfer-form {
  margin-bottom: 20px;
  padding: 20px;
  border: 1px solid #c3e0e4;
  border-radius: 12px;
  background: #fff;
}

.dashbord-wrp-1 .dp-wallet-icon {
  display: grid;
  flex: 0 0 76px;
  width: 76px;
  height: 58px;
  place-items: center;
  border-radius: 10px;
  background: #111;
  color: #fff;
  font-size: 38px;
}

.dashbord-wrp-1 .dp-wallet-panel > div:nth-child(2) {
  flex: 1;
}

.dashbord-wrp-1 .dp-wallet-panel h3,
.dashbord-wrp-1 .dp-wallet-panel p {
  margin: 0;
}

.dashbord-wrp-1 .dp-payment-toggle {
  position: relative;
  display: inline-flex;
  flex: 0 0 48px;
  width: 48px;
  height: 26px;
}

.dashbord-wrp-1 .dp-payment-toggle input {
  position: absolute;
  opacity: 0;
}

.dashbord-wrp-1 .dp-payment-toggle > span {
  width: 100%;
  border-radius: 999px;
  background: #c8d9dc;
  cursor: pointer;
  transition: background 0.2s ease;
}

.dashbord-wrp-1 .dp-payment-toggle > span::after {
  position: absolute;
  top: 3px;
  left: 3px;
  width: 20px;
  height: 20px;
  border-radius: 50%;
  background: #fff;
  box-shadow: 0 2px 5px rgba(0, 0, 0, 0.2);
  content: "";
  transition: transform 0.2s ease;
}

.dashbord-wrp-1 .dp-payment-toggle input:checked + span {
  background: #1596a5;
}

.dashbord-wrp-1 .dp-payment-toggle input:checked + span::after {
  transform: translateX(22px);
}

.dashbord-wrp-1 .dp-bank-details-grid,
.dashbord-wrp-1 .dp-auto-debit-panel {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 14px;
}

.dashbord-wrp-1 .dp-bank-details-grid {
  margin-bottom: 16px;
}

.dashbord-wrp-1 .dp-bank-transfer-form {
  display: grid;
  grid-template-columns: minmax(240px, 1fr) minmax(240px, 1fr);
  align-items: stretch;
  gap: 16px;
}

.dashbord-wrp-1 .dp-bank-transfer-form .dp-upload-card {
  min-height: 120px;
}

.dashbord-wrp-1 .dp-payment-toggle-row {
  padding: 14px;
  border: 1px solid #c3e0e4;
  border-radius: 10px;
}

.dashbord-wrp-1 .dp-payment-toggle-row > span:first-child {
  display: grid;
  gap: 3px;
}

.dashbord-wrp-1 .dp-payment-toggle-row small {
  color: #688087;
}

/* Notification preferences */
.dashbord-wrp-1 .dp-notification-summary {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 14px;
  margin-bottom: 20px;
}

.dashbord-wrp-1 .dp-notification-summary > div {
  display: grid;
  gap: 4px;
  padding: 16px;
  border: 1px solid #c3e0e4;
  border-radius: 10px;
  background: #fff;
}

.dashbord-wrp-1 .dp-notification-summary strong {
  color: #173f45;
  font-size: 20px;
}

.dashbord-wrp-1 .dp-notification-summary span {
  color: #688087;
  font-size: 13px;
}

.dashbord-wrp-1 .dp-notification-layout {
  display: grid;
  grid-template-columns: minmax(0, 1.25fr) minmax(260px, 0.75fr);
  gap: 16px;
  margin-bottom: 20px;
}

.dashbord-wrp-1 .dp-notification-settings,
.dashbord-wrp-1 .dp-notification-preview,
.dashbord-wrp-1 .dp-notification-controls {
  padding: 20px;
  border: 1px solid #c3e0e4;
  border-radius: 12px;
  background: #fff;
}

.dashbord-wrp-1 .dp-notification-settings h3,
.dashbord-wrp-1 .dp-notification-preview h3 {
  margin-bottom: 14px;
  color: #173f45;
  font-size: 18px;
}

.dashbord-wrp-1 .dp-notification-option {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  padding: 14px 0;
  border-bottom: 1px solid #e1eff1;
}

.dashbord-wrp-1 .dp-notification-option:last-child {
  border-bottom: 0;
}

.dashbord-wrp-1 .dp-notification-option > span:first-child {
  display: grid;
  grid-template-columns: 28px 1fr;
  gap: 2px 8px;
}

.dashbord-wrp-1 .dp-notification-option i {
  grid-row: span 2;
  color: #1596a5;
  font-size: 18px;
}

.dashbord-wrp-1 .dp-notification-option strong {
  color: #173f45;
}

.dashbord-wrp-1 .dp-notification-option small,
.dashbord-wrp-1 .dp-notification-preview small {
  color: #688087;
}

.dashbord-wrp-1 .dp-notification-preview {
  display: grid;
  align-content: start;
  gap: 12px;
}

.dashbord-wrp-1 .dp-notification-preview article {
  display: flex;
  gap: 12px;
  padding: 14px;
  border-radius: 10px;
  background: #edf9fa;
}

.dashbord-wrp-1 .dp-notification-preview article > i {
  color: #1596a5;
  font-size: 20px;
}

.dashbord-wrp-1 .dp-notification-preview strong,
.dashbord-wrp-1 .dp-notification-preview p {
  display: block;
  margin: 0 0 4px;
}

.dashbord-wrp-1 .dp-notification-controls {
  display: grid;
  align-content: start;
  gap: 16px;
}

/* Impact reports */
.dashbord-wrp-1 .dp-impact-summary {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 14px;
  margin-bottom: 20px;
}

.dashbord-wrp-1 .dp-impact-summary > div {
  display: grid;
  gap: 4px;
  padding: 16px;
  border: 1px solid #c3e0e4;
  border-radius: 10px;
  background: #fff;
}

.dashbord-wrp-1 .dp-impact-summary strong {
  color: #173f45;
  font-size: 21px;
}

.dashbord-wrp-1 .dp-impact-summary span {
  color: #688087;
  font-size: 13px;
}

.dashbord-wrp-1 .dp-impact-layout {
  display: grid;
  grid-template-columns: minmax(0, 1.3fr) minmax(250px, 0.7fr);
  gap: 16px;
  margin-bottom: 20px;
}

.dashbord-wrp-1 .dp-impact-breakdown,
.dashbord-wrp-1 .dp-impact-story {
  padding: 20px;
  border: 1px solid #c3e0e4;
  border-radius: 12px;
  background: #fff;
}

.dashbord-wrp-1 .dp-impact-breakdown h3,
.dashbord-wrp-1 .dp-impact-story h3 {
  margin-bottom: 16px;
  color: #173f45;
  font-size: 18px;
}

.dashbord-wrp-1 .dp-impact-breakdown > div {
  display: grid;
  grid-template-columns: 1fr auto;
  gap: 7px 14px;
  margin-bottom: 14px;
}

.dashbord-wrp-1 .dp-impact-breakdown > div:last-child {
  margin-bottom: 0;
}

.dashbord-wrp-1 .dp-impact-breakdown i {
  grid-column: 1 / -1;
  height: 7px;
  overflow: hidden;
  border-radius: 999px;
  background: #e1eff1;
}

.dashbord-wrp-1 .dp-impact-breakdown b {
  display: block;
  height: 100%;
  border-radius: inherit;
  background: #20a4b2;
}

.dashbord-wrp-1 .dp-impact-story {
  display: grid;
  align-content: center;
  text-align: left;
}

.dashbord-wrp-1 .dp-impact-story > i {
  margin-bottom: 12px;
  color: #1596a5;
  font-size: 42px;
}

.dashbord-wrp-1 .dp-impact-story p,
.dashbord-wrp-1 .dp-impact-story small {
  color: #688087;
}

.dashbord-wrp-1 .dp-education-impact-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 16px;
  margin-bottom: 20px;
}

.dashbord-wrp-1 .dp-education-impact-grid article {
  padding: 20px;
  border: 1px solid #c3e0e4;
  border-radius: 12px;
  background: #fff;
}

.dashbord-wrp-1 .dp-education-impact-grid i {
  color: #1596a5;
  font-size: 26px;
}

.dashbord-wrp-1 .dp-education-impact-grid strong {
  display: block;
  margin-top: 14px;
  color: #173f45;
  font-size: 25px;
}

.dashbord-wrp-1 .dp-education-impact-grid h3 {
  margin: 3px 0;
  font-size: 17px;
}

.dashbord-wrp-1 .dp-education-impact-grid p {
  margin: 0;
  color: #688087;
}

.dashbord-wrp-1 .dp-media-toolbar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  margin-bottom: 16px;
  padding: 14px 16px;
  border: 1px solid #c3e0e4;
  border-radius: 10px;
  background: #fff;
}

.dashbord-wrp-1 .dp-media-toolbar > div {
  display: grid;
}

.dashbord-wrp-1 .dp-media-toolbar strong {
  color: #173f45;
  font-size: 20px;
}

.dashbord-wrp-1 .dp-media-toolbar span {
  color: #688087;
}

.dashbord-wrp-1 .dp-media-toolbar select {
  min-width: 190px;
  padding: 10px 12px;
  border: 1px solid #c3e0e4;
  border-radius: 8px;
  background: #fff;
}

.dashbord-wrp-1 .dp-impact-gallery {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 16px;
  margin-bottom: 20px;
}

.dashbord-wrp-1 .dp-impact-gallery article {
  overflow: hidden;
  border: 1px solid #c3e0e4;
  border-radius: 12px;
  background: #fff;
}

.dashbord-wrp-1 .dp-impact-gallery img {
  width: 100%;
  height: 180px;
  object-fit: cover;
}

.dashbord-wrp-1 .dp-impact-gallery article > div {
  display: grid;
  gap: 3px;
  padding: 14px;
}

.dashbord-wrp-1 .dp-impact-gallery span {
  color: #688087;
  font-size: 13px;
}

/* Loyalty and rewards */
.dashbord-wrp-1 .dp-loyalty-hero {
  display: grid;
  grid-template-columns: auto 1fr auto;
  align-items: center;
  gap: 16px;
  margin-bottom: 18px;
  padding: 22px;
  border-radius: 14px;
  background: linear-gradient(135deg, #173f45, #1596a5);
  color: #fff;
}

.dashbord-wrp-1 .dp-loyalty-rank-icon {
  display: grid;
  width: 64px;
  height: 64px;
  place-items: center;
  border-radius: 50%;
  background: rgba(255, 255, 255, 0.16);
  color: #ffd979;
  font-size: 28px;
}

.dashbord-wrp-1 .dp-loyalty-hero h3,
.dashbord-wrp-1 .dp-loyalty-hero p {
  margin: 0;
  color: #fff;
}

.dashbord-wrp-1 .dp-loyalty-hero > strong {
  padding: 7px 12px;
  border-radius: 999px;
  background: #ffd979;
  color: #624c12;
}

.dashbord-wrp-1 .dp-rank-progress,
.dashbord-wrp-1 .dp-rank-benefits,
.dashbord-wrp-1 .dp-vip-levels {
  margin-bottom: 20px;
}

.dashbord-wrp-1 .dp-rank-progress {
  padding: 18px;
  border: 1px solid #c3e0e4;
  border-radius: 12px;
  background: #fff;
}

.dashbord-wrp-1 .dp-rank-progress > div {
  display: flex;
  justify-content: space-between;
  gap: 12px;
}

.dashbord-wrp-1 .dp-rank-progress > i {
  display: block;
  height: 9px;
  margin: 12px 0 7px;
  overflow: hidden;
  border-radius: 999px;
  background: #e1eff1;
}

.dashbord-wrp-1 .dp-rank-progress b {
  display: block;
  height: 100%;
  border-radius: inherit;
  background: linear-gradient(90deg, #d6a629, #ffd979);
}

.dashbord-wrp-1 .dp-rank-labels {
  color: #688087;
  font-size: 12px;
}

.dashbord-wrp-1 .dp-rank-benefits {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 14px;
}

.dashbord-wrp-1 .dp-rank-benefits article,
.dashbord-wrp-1 .dp-vip-next-step {
  display: flex;
  gap: 12px;
  padding: 16px;
  border: 1px solid #c3e0e4;
  border-radius: 10px;
  background: #fff;
}

.dashbord-wrp-1 .dp-rank-benefits i,
.dashbord-wrp-1 .dp-vip-next-step > i {
  color: #1596a5;
  font-size: 21px;
}

.dashbord-wrp-1 .dp-rank-benefits div {
  display: grid;
  gap: 3px;
}

.dashbord-wrp-1 .dp-rank-benefits span,
.dashbord-wrp-1 .dp-vip-next-step p {
  margin: 0;
  color: #688087;
  font-size: 13px;
}

.dashbord-wrp-1 .dp-vip-summary,
.dashbord-wrp-1 .dp-badge-summary {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 14px;
  margin-bottom: 20px;
}

.dashbord-wrp-1 .dp-vip-summary > div,
.dashbord-wrp-1 .dp-badge-summary > div {
  display: grid;
  gap: 4px;
  padding: 16px;
  border: 1px solid #c3e0e4;
  border-radius: 10px;
  background: #fff;
}

.dashbord-wrp-1 .dp-vip-summary strong,
.dashbord-wrp-1 .dp-badge-summary strong {
  color: #173f45;
  font-size: 20px;
}

.dashbord-wrp-1 .dp-vip-summary span,
.dashbord-wrp-1 .dp-badge-summary span {
  color: #688087;
  font-size: 13px;
}

.dashbord-wrp-1 .dp-vip-levels {
  display: grid;
  gap: 12px;
}

.dashbord-wrp-1 .dp-vip-levels article {
  display: grid;
  grid-template-columns: auto 1fr auto;
  align-items: center;
  gap: 14px;
  padding: 16px;
  border: 1px solid #c3e0e4;
  border-radius: 10px;
  background: #fff;
}

.dashbord-wrp-1 .dp-vip-levels article > span {
  display: grid;
  width: 38px;
  height: 38px;
  place-items: center;
  border-radius: 50%;
  background: #e1eff1;
  color: #173f45;
  font-weight: 800;
}

.dashbord-wrp-1 .dp-vip-levels article.active {
  border-color: #d6a629;
  background: #fffaf0;
}

.dashbord-wrp-1 .dp-vip-levels article.completed > span,
.dashbord-wrp-1 .dp-vip-levels article.active > span {
  background: #1596a5;
  color: #fff;
}

.dashbord-wrp-1 .dp-vip-levels h3,
.dashbord-wrp-1 .dp-vip-levels p,
.dashbord-wrp-1 .dp-vip-next-step p {
  margin: 0;
}

.dashbord-wrp-1 .dp-vip-next-step {
  margin-bottom: 20px;
}

.dashbord-wrp-1 .dp-badge-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 16px;
  margin-bottom: 20px;
}

.dashbord-wrp-1 .dp-badge-grid article {
  display: grid;
  justify-items: center;
  gap: 6px;
  padding: 20px;
  border: 1px solid #c3e0e4;
  border-radius: 12px;
  background: #fff;
  text-align: center;
}

.dashbord-wrp-1 .dp-badge-grid article > i {
  display: grid;
  width: 62px;
  height: 62px;
  place-items: center;
  border-radius: 50%;
  background: #e8f5f7;
  color: #1596a5;
  font-size: 25px;
}

.dashbord-wrp-1 .dp-badge-grid .earned {
  border-color: #e0c067;
  background: #fffdf6;
}

.dashbord-wrp-1 .dp-badge-grid .earned > i {
  background: #ffefbd;
  color: #9a7312;
}

.dashbord-wrp-1 .dp-badge-grid .locked {
  opacity: 0.65;
}

.dashbord-wrp-1 .dp-badge-grid span,
.dashbord-wrp-1 .dp-badge-grid small {
  color: #688087;
}

/* Account settings */
.dashbord-wrp-1 .dp-settings-summary {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 14px;
  margin-bottom: 20px;
}

.dashbord-wrp-1 .dp-settings-summary > div {
  display: grid;
  gap: 4px;
  padding: 16px;
  border: 1px solid #c3e0e4;
  border-radius: 10px;
  background: #fff;
}

.dashbord-wrp-1 .dp-settings-summary strong {
  color: #173f45;
  font-size: 20px;
}

.dashbord-wrp-1 .dp-settings-summary span {
  color: #688087;
  font-size: 13px;
}

.dashbord-wrp-1 .dp-settings-layout {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 16px;
  margin-bottom: 20px;
}

.dashbord-wrp-1 .dp-settings-card,
.dashbord-wrp-1 .dp-trusted-devices {
  padding: 20px;
  border: 1px solid #c3e0e4;
  border-radius: 12px;
  background: #fff;
}

.dashbord-wrp-1 .dp-settings-card h3,
.dashbord-wrp-1 .dp-trusted-devices h3 {
  margin-bottom: 16px;
  color: #173f45;
  font-size: 18px;
}

.dashbord-wrp-1 .dp-settings-card .dp-detail-grid {
  grid-template-columns: 1fr;
}

.dashbord-wrp-1 .dp-settings-toggle {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  padding: 14px 0;
  border-bottom: 1px solid #e1eff1;
}

.dashbord-wrp-1 .dp-settings-toggle:last-child {
  border-bottom: 0;
}

.dashbord-wrp-1 .dp-settings-toggle > span:first-child {
  display: grid;
  grid-template-columns: 28px 1fr;
  gap: 2px 8px;
}

.dashbord-wrp-1 .dp-settings-toggle i {
  grid-row: span 2;
  color: #1596a5;
  font-size: 18px;
}

.dashbord-wrp-1 .dp-settings-toggle small,
.dashbord-wrp-1 .dp-trusted-devices span {
  color: #688087;
}

.dashbord-wrp-1 .dp-password-strength {
  display: grid;
  grid-template-columns: 1fr auto;
  gap: 7px 14px;
  color: #425a60;
  font-size: 13px;
}

.dashbord-wrp-1 .dp-password-strength i {
  grid-column: 1 / -1;
  height: 7px;
  overflow: hidden;
  border-radius: 999px;
  background: #e1eff1;
}

.dashbord-wrp-1 .dp-password-strength b {
  display: block;
  height: 100%;
  border-radius: inherit;
  background: #2aaf79;
}

.dashbord-wrp-1 .dp-password-strength strong {
  color: #287054;
}

.dashbord-wrp-1 .dp-trusted-devices {
  display: grid;
  gap: 10px;
  margin-bottom: 20px;
}

.dashbord-wrp-1 .dp-trusted-devices article {
  display: grid;
  grid-template-columns: auto 1fr auto;
  align-items: center;
  gap: 12px;
  padding: 12px;
  border: 1px solid #e1eff1;
  border-radius: 9px;
}

.dashbord-wrp-1 .dp-trusted-devices article > i {
  color: #1596a5;
  font-size: 21px;
}

.dashbord-wrp-1 .dp-trusted-devices article > div {
  display: grid;
  gap: 3px;
}

.dashbord-wrp-1 .dp-trusted-devices button,
.dashbord-wrp-1 .dp-settings-link {
  padding: 7px 11px;
  border: 1px solid #62b2bc;
  border-radius: 6px;
  background: #edf9fa;
  color: #148492;
  font-weight: 500;
  font-size: 15px;
}

.dashbord-wrp-1 .dp-settings-link {
  margin-top: 16px;
}

.dashbord-wrp-1 .dp-language-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 16px;
  margin-bottom: 20px;
}

.dashbord-wrp-1 .dp-language-card {
  display: grid;
  grid-template-columns: auto 1fr auto;
  align-items: center;
  gap: 14px;
  padding: 18px;
  border: 1px solid #c3e0e4;
  border-radius: 12px;
  background: #fff;
  cursor: pointer;
}

.dashbord-wrp-1 .dp-language-card.active {
  border-color: #1596a5;
  background: #edf9fa;
}

.dashbord-wrp-1 .dp-language-card input {
  position: absolute;
  opacity: 0;
}

.dashbord-wrp-1 .dp-language-card > span {
  display: grid;
  width: 46px;
  height: 46px;
  place-items: center;
  border-radius: 50%;
  background: #1596a5;
  color: #fff;
  font-weight: 800;
}

.dashbord-wrp-1 .dp-language-card > div {
  display: grid;
  gap: 3px;
}

.dashbord-wrp-1 .dp-language-card small {
  color: #688087;
}

.dashbord-wrp-1 .dp-language-card > i {
  color: #1596a5;
  font-size: 20px;
}

/* Detail typography */
.dp-detail-head h2 { font-size: 22px; }
.dp-detail-head p { font-size: 16px; }

.dp-campaign-updates h3{ font-size:18px; }
.dp-campaign-updates p{ font-size:15px; }
.dp-campaign-progress-card span{ font-size:15px; }


.dp-sponsorship-renewals h3{ font-size:18px; }
.dp-sponsorship-renewals p{ font-size:15px; }


.dp-sponsorship-case p{ font-size:16px; margin-bottom:10px; }

.dp-sponsorship-case-top span{ font-size:15px; }
.dp-notification-preview p{ font-size:15px; }

.dp-impact-story p{ font-size:15px; line-height:18px; margin-bottom: 11px;}
.dp-impact-story small{ font-size:14px; line-height:16px;}

.dp-impact-breakdown strong{ font-size:18px; }

.dp-loyalty-hero h3{ font-size:19px; }
.dp-loyalty-hero span{ font-size:15px;  }

.dp-detail-field span{ font-weight:500; }


@media (max-width: 767px) {
  .dashbord-wrp-1 .dp-detail-grid,
  .dashbord-wrp-1 .dp-upload-grid {
    grid-template-columns: 1fr;
  }

  .dashbord-wrp-1 .dp-detail-head {
    align-items: flex-start;
    flex-wrap: wrap;
  }

  .dashbord-wrp-1 .dp-donation-summary {
    grid-template-columns: 1fr;
  }

  .dashbord-wrp-1 .dp-donation-toolbar {
    align-items: stretch;
    flex-direction: column;
  }

  .dashbord-wrp-1 .dp-campaign-progress-grid {
    grid-template-columns: 1fr;
  }

  .dashbord-wrp-1 .dp-sponsorship-case-grid,
  .dashbord-wrp-1 .dp-sponsorship-plan-grid {
    grid-template-columns: 1fr;
  }

  .dashbord-wrp-1 .dp-sponsorship-renewals article {
    grid-template-columns: 1fr;
  }

  .dashbord-wrp-1 .dp-zakat-fields {
    grid-template-columns: 1fr;
  }

  .dashbord-wrp-1 .dp-receipt-tools {
    grid-template-columns: 1fr;
  }

  .dashbord-wrp-1 .dp-receipt-tools .dp-receipt-action,
  .dashbord-wrp-1 .dp-receipt-tools .dp-static-action {
    width: 100%;
  }

  .dashbord-wrp-1 .dp-payment-summary,
  .dashbord-wrp-1 .dp-saved-card-grid,
  .dashbord-wrp-1 .dp-bank-details-grid,
  .dashbord-wrp-1 .dp-bank-transfer-form,
  .dashbord-wrp-1 .dp-auto-debit-panel {
    grid-template-columns: 1fr;
  }

  .dashbord-wrp-1 .dp-wallet-panel {
    align-items: flex-start;
    flex-wrap: wrap;
  }

  .dashbord-wrp-1 .dp-notification-summary,
  .dashbord-wrp-1 .dp-notification-layout {
    grid-template-columns: 1fr;
  }

  .dashbord-wrp-1 .dp-impact-summary,
  .dashbord-wrp-1 .dp-impact-layout,
  .dashbord-wrp-1 .dp-education-impact-grid,
  .dashbord-wrp-1 .dp-impact-gallery {
    grid-template-columns: 1fr;
  }

  .dashbord-wrp-1 .dp-media-toolbar {
    align-items: stretch;
    flex-direction: column;
  }

  .dashbord-wrp-1 .dp-media-toolbar select {
    width: 100%;
  }

  .dashbord-wrp-1 .dp-loyalty-hero {
    grid-template-columns: auto 1fr;
  }

  .dashbord-wrp-1 .dp-loyalty-hero > strong {
    grid-column: 1 / -1;
    justify-self: start;
  }

  .dashbord-wrp-1 .dp-rank-benefits,
  .dashbord-wrp-1 .dp-vip-summary,
  .dashbord-wrp-1 .dp-badge-summary,
  .dashbord-wrp-1 .dp-badge-grid {
    grid-template-columns: 1fr;
  }

  .dashbord-wrp-1 .dp-settings-summary,
  .dashbord-wrp-1 .dp-settings-layout,
  .dashbord-wrp-1 .dp-language-grid {
    grid-template-columns: 1fr;
  }

  .dashbord-wrp-1 .dp-trusted-devices article {
    grid-template-columns: auto 1fr;
  }

  .dashbord-wrp-1 .dp-trusted-devices button {
    grid-column: 1 / -1;
    justify-self: start;
  }


}

/* Dashboard responsive layout overrides */
.dashbord-wrp-1,
.dashbord-wrp-1 .db1-layout,
.dashbord-wrp-1 .dp-main,
.dashbord-wrp-1 .db1-panel,
.dashbord-wrp-1 .dp-card-detail {
  min-width: 0;
}

.dashbord-wrp-1 .dp-main {
  overflow: hidden;
}

.dashbord-wrp-1 .dp-card-detail,
.dashbord-wrp-1 .dp-settings-card,
.dashbord-wrp-1 .dp-notification-settings,
.dashbord-wrp-1 .dp-notification-preview,
.dashbord-wrp-1 .dp-impact-breakdown,
.dashbord-wrp-1 .dp-impact-story {
  max-width: 100%;
}

.dashbord-wrp-1 img {
  max-width: 100%;
}

@media (max-width: 1280px) {
  .dashbord-wrp-1 .db1-layout {
    grid-template-columns: minmax(240px, 280px) minmax(0, 1fr);
    gap: 20px;
  }

  .dashbord-wrp-1 .dp-main {
    padding: 22px;
  }

  .dashbord-wrp-1 .dp-section-grid,
  .dashbord-wrp-1 .dp-profile-edit-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 1100px) {
  .dashbord-wrp-1 .db1-layout {
    display: block;
  }

  .dashbord-wrp-1 .dp-main {
    width: 100%;
  }

  .dashbord-wrp-1 .dp-mobile-menu-toggle {
    display: inline-flex;
  }

  .dashbord-wrp-1 .dp-sidebar {
    position: fixed !important;
    top: 0 !important;
    left: 0 !important;
    z-index: 99999 !important;
    width: min(380px, 90vw) !important;
    height: 100dvh !important;
    max-height: 100dvh !important;
    overflow-y: auto !important;
    visibility: hidden !important;
    transform: translate3d(-105%, 0, 0) !important;
    transition: transform 0.28s ease, visibility 0.28s ease !important;
  }

  .dashbord-wrp-1.dp-menu-open .dp-sidebar {
    visibility: visible !important;
    transform: translate3d(0, 0, 0) !important;
  }

  .dashbord-wrp-1 .dp-mobile-menu-backdrop {
    position: fixed !important;
    inset: 0 !important;
    z-index: 99998 !important;
    display: block !important;
    visibility: hidden !important;
    opacity: 0 !important;
    pointer-events: none !important;
  }

  .dashbord-wrp-1.dp-menu-open .dp-mobile-menu-backdrop {
    visibility: visible !important;
    opacity: 1 !important;
    pointer-events: auto !important;
  }
}

@media (max-width: 900px) {
  .dashbord-wrp-1 .dp-main {
    padding: 18px;
  }

  .dashbord-wrp-1 .dp-hero,
  .dashbord-wrp-1 .dp-head-row,
  .dashbord-wrp-1 .dp-detail-head {
    align-items: flex-start;
    flex-direction: column;
  }

  .dashbord-wrp-1 .dp-stats,
  .dashbord-wrp-1 .dp-section-grid,
  .dashbord-wrp-1 .dp-profile-edit-grid,
  .dashbord-wrp-1 .dp-dashboard-grid {
    grid-template-columns: 1fr;
  }

  .dashbord-wrp-1 .dp-detail-status {
    align-self: flex-start;
  }

  .dashbord-wrp-1 .dp-donation-table-wrap {
    width: 100%;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
  }
}

@media (max-width: 767px) {
  .dashbord-wrp-1 .dp-main,
  .dashbord-wrp-1 .dp-card-detail,
  .dashbord-wrp-1 .dp-settings-card,
  .dashbord-wrp-1 .dp-notification-settings,
  .dashbord-wrp-1 .dp-notification-preview,
  .dashbord-wrp-1 .dp-notification-controls,
  .dashbord-wrp-1 .dp-impact-breakdown,
  .dashbord-wrp-1 .dp-impact-story,
  .dashbord-wrp-1 .dp-zakat-calculator {
    padding: 16px;
  }

  .dashbord-wrp-1 .dp-mobile-menu-toggle {
    top: 8px;
    width: 100%;
    margin-bottom: 16px;
  }

  .dashbord-wrp-1 .dp-feature-card {
    grid-template-columns: auto minmax(0, 1fr);
    gap: 12px;
  }

  .dashbord-wrp-1 .dp-feature-card > span {
    grid-column: 2;
    justify-self: start;
  }

  .dashbord-wrp-1 .dp-detail-grid,
  .dashbord-wrp-1 .dp-upload-grid,
  .dashbord-wrp-1 .dp-donation-summary,
  .dashbord-wrp-1 .dp-payment-summary,
  .dashbord-wrp-1 .dp-notification-summary,
  .dashbord-wrp-1 .dp-impact-summary,
  .dashbord-wrp-1 .dp-settings-summary,
  .dashbord-wrp-1 .dp-rank-benefits,
  .dashbord-wrp-1 .dp-vip-summary,
  .dashbord-wrp-1 .dp-badge-summary,
  .dashbord-wrp-1 .dp-badge-grid,
  .dashbord-wrp-1 .dp-campaign-progress-grid,
  .dashbord-wrp-1 .dp-sponsorship-case-grid,
  .dashbord-wrp-1 .dp-sponsorship-plan-grid,
  .dashbord-wrp-1 .dp-education-impact-grid,
  .dashbord-wrp-1 .dp-impact-gallery,
  .dashbord-wrp-1 .dp-settings-layout,
  .dashbord-wrp-1 .dp-language-grid,
  .dashbord-wrp-1 .dp-zakat-fields,
  .dashbord-wrp-1 .dp-saved-card-grid,
  .dashbord-wrp-1 .dp-bank-details-grid,
  .dashbord-wrp-1 .dp-bank-transfer-form,
  .dashbord-wrp-1 .dp-auto-debit-panel {
    grid-template-columns: 1fr;
  }

  .dashbord-wrp-1 .dp-notification-layout,
  .dashbord-wrp-1 .dp-impact-layout {
    grid-template-columns: minmax(0, 1fr);
  }

  .dashbord-wrp-1 .dp-donation-toolbar,
  .dashbord-wrp-1 .dp-receipt-tools,
  .dashbord-wrp-1 .dp-media-toolbar {
    display: grid;
    grid-template-columns: 1fr;
    align-items: stretch;
  }

  .dashbord-wrp-1 .dp-donation-search,
  .dashbord-wrp-1 .dp-receipt-filter,
  .dashbord-wrp-1 .dp-receipt-tools .db1-action-btn,
  .dashbord-wrp-1 .dp-donation-toolbar .db1-action-btn,
  .dashbord-wrp-1 .dp-media-toolbar select {
    width: 100%;
    max-width: none;
  }

  .dashbord-wrp-1 .dp-sponsorship-renewals article,
  .dashbord-wrp-1 .dp-vip-levels article {
    grid-template-columns: 1fr;
    justify-items: start;
  }
}

@media (max-width: 575px) {
  .dashbord-wrp-1 .dp-main {
    padding: 12px;
    border-radius: 12px;
  }

  .dashbord-wrp-1 .dp-hero,
  .dashbord-wrp-1 .dp-card-detail {
    padding: 14px;
  }

  .dashbord-wrp-1 .dp-hero h1,
  .dashbord-wrp-1 .db1-head h1 {
    font-size: clamp(21px, 5.5vw, 32px);
  }

  .dashbord-wrp-1 .dp-feature-card {
    padding: 14px;
  }

  .dashbord-wrp-1 .dp-feature-icon {
    width: 42px;
    height: 42px;
  }

  .dashbord-wrp-1 .dp-detail-head {
    gap: 12px;
  }

  .dashbord-wrp-1 .dp-loyalty-hero,
  .dashbord-wrp-1 .dp-wallet-panel,
  .dashbord-wrp-1 .dp-payment-toggle-row {
    display: grid;
    grid-template-columns: 1fr;
    justify-items: start;
  }

  .dashbord-wrp-1 .dp-rank-progress > div {
    align-items: flex-start;
    flex-direction: column;
  }

  .dashbord-wrp-1 .dp-language-card,
  .dashbord-wrp-1 .dp-trusted-devices article {
    grid-template-columns: auto minmax(0, 1fr);
  }

  .dashbord-wrp-1 .db1-action-btn,
  .dashbord-wrp-1 .dp-static-action {
    width: 100%;
    justify-content: center;
    white-space: normal;
  }

  .dashbord-wrp-1 .dp-donation-detail-table {
    min-width: 680px;
  }
  .db1-head p {
  color: #5d7482;
  font-size: 15px;
  line-height: 1.2;
  margin-bottom: 0;
}
}
/* Policy drawer final state */
.aid-ai-upload-grid .aid-upload-card {
	position: relative;
	display: flex;
	flex-direction: column;
	gap: 8px;
	border: 1px solid rgba(17, 76, 92, 0.12);
	background: #fff;
	transition: 0.25s ease;
	cursor: pointer;
}

.aid-upload-top {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 12px;
	width: 100%;
}

.aid-upload-badge {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	padding: 6px 10px;
	border-radius: 999px;
	background: rgba(13, 104, 121, 0.1);
	color: #0d6879;
	font-size: 12px;
	font-weight: 800;
	white-space: nowrap;
}

.aid-upload-file-name {
	display: block;
	margin-top: 4px;
	padding: 10px 12px;
	border: 1px dashed rgba(17, 76, 92, 0.16);
	border-radius: 10px;
	color: #536a72;
	font-size: 13px;
	background: rgba(245, 250, 251, 0.85);
}

.aid-upload-card.is-ai-loading {
	opacity: 0.78;
}

.aid-upload-card.is-ai-accepted {
	border-color: rgba(0, 166, 90, 0.35);
	background: rgba(0, 166, 90, 0.06);
}

.aid-upload-card.is-ai-accepted .aid-upload-badge {
	background: #dcf8e8;
	color: #059457;
}

.aid-upload-card.is-ai-review {
	border-color: rgba(238, 148, 0, 0.38);
	background: rgba(255, 180, 42, 0.08);
}

.aid-upload-card.is-ai-review .aid-upload-badge {
	background: #fff0d4;
	color: #c97900;
}

.aid-upload-card.is-ai-rejected {
	border-color: rgba(227, 48, 65, 0.34);
	background: rgba(227, 48, 65, 0.06);
}

.aid-upload-card.is-ai-rejected .aid-upload-badge {
	background: #ffe1e5;
	color: #d32035;
}

.aid-required-docs,
.aid-specific-docs {
	margin-top: 28px;
	padding: 20px;
	border: 1px solid rgba(17, 76, 92, 0.1);
	border-radius: 22px;
	background: linear-gradient(180deg, #ffffff 0%, #f5fbfc 100%);
}

.aid-required-docs {
	background: linear-gradient(180deg, #fff 0%, #f2ffff 100%);
}

.aid-required-grid .aid-specific-card {
	border-color: rgb(209, 238, 243);
}

.aid-requirement-note {
	background: #fffdf5;
}

.aid-specific-head {
	display: flex;
	align-items: flex-start;
	gap: 14px;
	margin-bottom: 20px;
}

.aid-specific-head > span {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 46px;
	height: 46px;
	flex: 0 0 46px;
	border-radius: 14px;
	background: linear-gradient(135deg, #0d6879, #1ca3af);
	color: #fff;
}

.aid-specific-head h3 {
	margin: 0 0 4px;
	color: #114c5c;
	font-size: 22px;
}

.aid-specific-head p {
	margin: 0;
	color: #667b84;
}

.aid-specific-grid {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 18px;
}

.aid-specific-card {
	padding: 20px;
	border: 1px solid rgba(17, 76, 92, 0.1);
	border-radius: 18px;
	background: #fff;
	box-shadow: 0 14px 35px rgba(17, 76, 92, 0.06);
}

.aid-specific-card h4 {
	display: flex;
	align-items: center;
	gap: 10px;
	margin: 0 0 16px;
	color: #0d6879;
	font-size: 18px;
}

.aid-specific-card-icon {
	width: 24px;
	height: 24px;
	object-fit: contain;
	flex: 0 0 24px;
}

.aid-specific-card h5 {
	margin: 18px 0 8px;
	color: #114c5c;
	font-size: 17px;
}

.aid-specific-card h5:first-of-type {
	margin-top: 0;
}

.aid-specific-card ul {
	margin: 0;
	padding-left: 18px;
	color: #526a73;
}

.aid-specific-card li {
	margin-bottom: 7px;
	line-height: 1.5;
}

.aid-ai-modal {
	position: fixed;
	inset: 0;
	z-index: 100000;
	display: flex;
	align-items: center;
	justify-content: center;
	padding: 20px;
	background: rgba(5, 45, 58, 0.56);
	backdrop-filter: blur(6px);
	opacity: 0;
	visibility: hidden;
	pointer-events: none;
	transition: 0.25s ease;
}

.aid-ai-modal.is-open {
	opacity: 1;
	visibility: visible;
	pointer-events: auto;
}

.aid-ai-modal-card {
	position: relative;
	width: min(520px, 100%);
	max-height: calc(100vh - 40px);
	overflow-y: auto;
	padding: 34px 19px;
	border: 1px solid rgba(255, 255, 255, 0.78);
	border-radius: 15px;
	background: linear-gradient(180deg, #ffffff 0%, #fbfefe 100%);
	text-align: center;
	box-shadow: 0 32px 90px rgba(5, 45, 58, 0.28);
}

.aid-ai-close {
	position: absolute;
	top: 18px;
	right: 18px;
	width: 44px;
	height: 44px;
	border: 0;
	border-radius: 50%;
	background: #eaf4f6;
	color: #0d6879;
	font-size: 18px;
	transition: 0.2s ease;
}

.aid-ai-close:hover {
	background: #dceff2;
	transform: translateY(-1px);
}

.aid-ai-robot {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 75px;
	height: 75px;
	margin-bottom: 18px;
	border-radius: 50%;
	background: linear-gradient(135deg, #0d6879, #1ca3af);
	color: #fff;
	font-size: 39px;
	box-shadow: none;
	outline: solid 8px #e4f5f6;
}

.aid-ai-modal h3 {
	margin: 0 0 -2px;
	color: #114c5c;
	font-size: 21px;
	line-height: 1.25;
	font-weight: 500;
}

.aid-ai-modal p {
	margin: 0;
	color: #4f6670;
	font-size: 17px;
}

.aid-ai-loader {
	width: 42px;
	height: 42px;
	margin: 0 auto 16px;
	border: 4px solid rgba(28, 163, 175, 0.18);
	border-top-color: #1ca3af;
	border-radius: 50%;
	animation: aidAiSpin 0.9s linear infinite;
}

.aid-ai-checks {
	margin: 26px 0 0;
	padding: 18px 15px;
	list-style: none;
	text-align: left;
	border: 1px solid rgba(17, 76, 92, 0.08);
	border-radius: 15px;
	background: #f8fcfd;
}

.aid-ai-checks li {
	position: relative;
	display: flex;
	align-items: flex-start;
	margin-bottom: 8px;
	padding-left: 36px;
	color: #3f5963;
	font-weight: 500;
	line-height: 1.45;
}

.aid-ai-checks li::before {
	content: "";
	position: absolute;
	left: 0;
	top: 0px;
	width: 22px;
	height: 22px;
	border-radius: 50%;
	background: #149091;
	box-shadow: 0 6px 14px rgba(10, 168, 95, 0.18);
}

.aid-ai-checks li::after {
	content: "";
	position: absolute;
	left: 7px;
	top: 7px;
	width: 8px;
	height: 5px;
	border-left: 2px solid #fff;
	border-bottom: 2px solid #fff;
	transform: rotate(-45deg);
}

.aid-ai-checks li:last-child {
	margin-bottom: 0;
}

.aid-ai-notice {
	margin-top: 22px;
	padding: 11px 20px;
	border: 1px solid rgba(13, 104, 121, 0.08);
	border-radius: 12px;
	background: #edf8f4;
	color: #114c5c;
	font-size: 15px;
	font-weight: 500;
	line-height: 1.3;
	text-align: left;
}

.aid-ai-actions {
	display: flex;
	gap: 12px;
	margin-top: 22px;
}

.aid-ai-primary,
.aid-ai-secondary {
	flex: 1;
	min-height: 56px;
	border-radius: 12px;
	font-weight: 800;
	font-size: 16px;
}

.aid-ai-primary {
	border: 0;
	background: linear-gradient(135deg, #0d6879, #1ca3af);
	color: #fff;
	box-shadow: 0 14px 26px rgba(28, 163, 175, 0.22);
}

.aid-ai-secondary {
	border: 1px solid rgba(17, 76, 92, 0.18);
	background: #fff;
	color: #114c5c;
}

.aid-ai-modal.is-loading .aid-ai-close,
.aid-ai-modal.is-loading .aid-ai-actions {
	display: none;
}

.aid-ai-modal.is-accepted .aid-ai-robot {
	background: #e4f5f6;
	outline-color: none;
}

.aid-ai-modal.is-accepted .aid-ai-notice {
	background: #e7f9ef;
	border-color: rgba(9, 169, 106, 0.14);
	color: #067744;
}

.aid-ai-modal.is-review .aid-ai-robot {
	background: linear-gradient(135deg, #ee9400, #ffc04b);
	outline-color: rgba(238, 148, 0, 0.12);
}

.aid-ai-modal.is-review .aid-ai-notice {
	background: #fff4db;
	border-color: rgba(238, 148, 0, 0.18);
	color: #9b6200;
}

.aid-ai-modal.is-rejected .aid-ai-robot {
	background: linear-gradient(135deg, #d32035, #ff6876);
	outline-color: rgba(211, 32, 53, 0.1);
}

.aid-ai-modal.is-rejected .aid-ai-checks {
	background: #fff9fa;
	border-color: rgba(211, 32, 53, 0.12);
}

.aid-ai-modal.is-rejected .aid-ai-checks li::before {
	background: #d32035;
	box-shadow: 0 6px 14px rgba(211, 32, 53, 0.18);
}

.aid-ai-modal.is-rejected .aid-ai-checks li::after {
	left: 6px;
	top: 6px;
	width: 10px;
	height: 10px;
	border: 0;
	background:
		linear-gradient(45deg, transparent 43%, #fff 43%, #fff 57%, transparent 57%),
		linear-gradient(-45deg, transparent 43%, #fff 43%, #fff 57%, transparent 57%);
	transform: none;
}

.aid-ai-modal.is-rejected .aid-ai-notice {
	background: #ffe9ec;
	border-color: rgba(211, 32, 53, 0.16);
	color: #b51d2d;
}

.aid-ai-modal.is-rejected .aid-ai-primary {
	background: linear-gradient(135deg, #d32035, #ff6876);
}

@keyframes aidAiSpin {
	to {
		transform: rotate(360deg);
	}
}

@media (max-width: 991px) {
	.aid-specific-grid {
		grid-template-columns: 1fr;
	}
}

@media (max-width: 575px) {
	.aid-specific-docs {
		padding: 18px;
	}

	.aid-ai-modal-card {
		padding: 30px 20px 24px;
		border-radius: 20px;
	}

	.aid-ai-actions {
		flex-direction: column;
	}
}

.ai-doc-modal {
	position: fixed;
	inset: 0;
	z-index: 100000;
	display: flex;
	align-items: center;
	justify-content: center;
	padding: 20px;
	background: rgba(5, 45, 58, 0.58);
	backdrop-filter: blur(6px);
	opacity: 0;
	visibility: hidden;
	pointer-events: none;
	transition: 0.25s ease;
}

.ai-doc-modal.is-open {
	opacity: 1;
	visibility: visible;
	pointer-events: auto;
}

.ai-doc-modal-box {
	position: relative;
	width: min(430px, 100%);
	padding: 34px 28px 28px;
	border-radius: 24px;
	background: #fff;
	box-shadow: 0 28px 80px rgba(5, 45, 58, 0.26);
	text-align: center;
}

.ai-doc-modal-close {
	position: absolute;
	top: 14px;
	right: 14px;
	width: 36px;
	height: 36px;
	border: 0;
	border-radius: 50%;
	background: rgba(13, 104, 121, 0.1);
	color: #0d6879;
}

.ai-doc-modal-icon {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 72px;
	height: 72px;
	margin-bottom: 16px;
	border-radius: 24px;
	background: linear-gradient(135deg, #0d6879, #1ca3af);
	color: #fff;
	font-size: 32px;
}

.ai-doc-modal h3 {
	margin: 0 0 8px;
	color: #114c5c;
	font-size: 24px;
	line-height: 1.25;
}

.ai-doc-modal p {
	margin: 0;
	color: #4f6670;
	font-size: 16px;
}

.ai-doc-modal small {
	display: block;
	margin-top: 10px;
	color: #667b84;
	line-height: 1.5;
}

.ai-doc-loader {
	width: 42px;
	height: 42px;
	margin: 0 auto 16px;
	border: 4px solid rgba(28, 163, 175, 0.18);
	border-top-color: #1ca3af;
	border-radius: 50%;
	animation: aiDocSpin 0.9s linear infinite;
}

.ai-doc-modal-ok {
	margin-top: 22px;
	min-width: 120px;
}

.ai-doc-modal.is-loading .ai-doc-modal-ok,
.ai-doc-modal.is-loading .ai-doc-modal-close {
	display: none;
}

.ai-doc-modal.is-success .ai-doc-modal-icon {
	background: linear-gradient(135deg, #0c9f75, #22c18b);
}

.ai-doc-modal.is-review .ai-doc-modal-icon {
	background: linear-gradient(135deg, #c8810b, #f1b84a);
}

.ai-doc-modal.is-error .ai-doc-modal-icon {
	background: linear-gradient(135deg, #b83232, #e85f5f);
}

.dp-upload-card {
	position: relative;
}

.dp-upload-card.is-validating {
	opacity: 0.78;
}

.dp-upload-card.is-validated {
	border-color: rgba(12, 159, 117, 0.45);
	background: rgba(12, 159, 117, 0.08);
}

.dp-upload-card.is-review {
	border-color: rgba(200, 129, 11, 0.45);
	background: rgba(200, 129, 11, 0.08);
}

.dp-upload-card.is-rejected {
	border-color: rgba(184, 50, 50, 0.45);
	background: rgba(184, 50, 50, 0.08);
}

.dp-upload-status {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	margin-top: 10px;
	padding: 6px 10px;
	border-radius: 999px;
	background: rgba(13, 104, 121, 0.1);
	color: #0d6879;
	font-size: 12px;
	font-weight: 700;
}

@keyframes aiDocSpin {
	to {
		transform: rotate(360deg);
	}
}

@media (max-width: 575px) {
	.ai-doc-modal-box {
		padding: 30px 20px 24px;
		border-radius: 20px;
	}

	.ai-doc-modal h3 {
		font-size: 21px;
	}
}

.policy-mobile-toggle,
.policy-mobile-backdrop {
	display: none !important;
}

.page-single-sidebar.policy-mobile-sidebar {
	transform: none !important;
	visibility: visible !important;
	pointer-events: auto !important;
}

@media (max-width: 991px) {
	.policy-mobile-toggle {
		display: inline-flex !important;
	}

	.policy-mobile-backdrop {
		display: block !important;
		opacity: 0 !important;
		visibility: hidden !important;
		pointer-events: none !important;
	}

	body.policy-menu-open .policy-mobile-backdrop {
		opacity: 1 !important;
		visibility: visible !important;
		pointer-events: auto !important;
	}

	.page-single-sidebar.policy-mobile-sidebar {
		position: fixed !important;
		top: 0 !important;
		left: 0 !important;
		right: auto !important;
		width: min(340px, 88vw) !important;
		height: 100dvh !important;
		max-height: 100dvh !important;
		overflow-y: auto !important;
		visibility: hidden !important;
		pointer-events: none !important;
		transform: translate3d(calc(-100% - 32px), 0, 0) !important;
		transition: transform 0.3s ease, visibility 0.3s ease !important;
	}

	.page-single-sidebar.policy-mobile-sidebar.policy-sidebar-open,
	body.policy-menu-open .page-single-sidebar.policy-mobile-sidebar {
		visibility: visible !important;
		pointer-events: auto !important;
		transform: translate3d(0, 0, 0) !important;
	}

	html[dir="rtl"] .page-single-sidebar.policy-mobile-sidebar {
		right: 0 !important;
		left: auto !important;
		transform: translate3d(calc(100% + 32px), 0, 0) !important;
		box-shadow: -14px 0 35px rgba(13, 64, 84, 0.18) !important;
	}

	html[dir="rtl"] .page-single-sidebar.policy-mobile-sidebar.policy-sidebar-open,
	html[dir="rtl"] body.policy-menu-open .page-single-sidebar.policy-mobile-sidebar {
		transform: translate3d(0, 0, 0) !important;
	}
}










.services-section {
  max-width: 100%;
  margin: 0 auto;
  padding: 40px 0px;
  background: linear-gradient(0deg,rgb(255, 255, 255) 0%, rgba(159, 206, 207, 0.2) 50%, rgb(255, 255, 255) 100%);
}

.section-title {
  text-align: ;
  font-size: 32px;
  font-weight: 700;
  color: #1a1a2e;
  margin-bottom: 8px;
}

.section-subtitle {
  text-align: center;
  color: #666;
  font-size: 15px;
  margin-bottom: 36px;
}

/* Tabs */
.tabs-container {
  display: flex;
  justify-content: center;
  flex-wrap: wrap;
  gap: 8px;
  margin-bottom: 36px;
}

input[type="radio"] { display: none; }

.tab-label {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 12px 22px;
  border-radius: 11px;
  cursor: pointer;
  font-size: 18px;
  font-weight: 500;
  background: #fff;
  border: 1px solid #15999b4f;
  color: #114c5c;
  transition: all 0.2s ease;
  background-color: #fff;
}

button.tab-label {
  font: inherit;
  appearance: none;
}

.tab-label:hover {
  border-color: #15999b;
  color: #15999b;
}

.tab-label svg {
  width: 25px;
  height: 25px;
  flex-shrink: 0;
}

/* Active tab styles */
#tab-all:checked ~ .tabs-container label[for="tab-all"],
#tab-housing:checked ~ .tabs-container label[for="tab-housing"],
#tab-health:checked ~ .tabs-container label[for="tab-health"],
#tab-education:checked ~ .tabs-container label[for="tab-education"],
#tab-executive:checked ~ .tabs-container label[for="tab-executive"] {
  color: #fff;
  border-color: transparent;
  box-shadow: 0 14px 28px rgba(25, 167, 199, 0.25);
  background: linear-gradient(135deg, #0d6477, #18a7b8);
  border: 0;
}

.tabs-container .tab-label.active {
  color: #fff;
  border-color: transparent;
  box-shadow: 0 14px 28px rgba(25, 167, 199, 0.25);
  background: linear-gradient(135deg, #0d6477, #18a7b8);
  border: 0;
}

/* Content panels */
.tab-content { display: none; }

#tab-all:checked ~ .content-area .content-all,
#tab-housing:checked ~ .content-area .content-housing,
#tab-health:checked ~ .content-area .content-health,
#tab-education:checked ~ .content-area .content-education,
#tab-executive:checked ~ .content-area .content-executive {
  display: block;
}

/* Category header */
.category-header {
  display: flex;
  align-items: center;
  gap: 12px;
  margin-bottom: 20px;
  margin-top: 32px;
  padding-bottom: 12px;
}

.category-header:first-child {
  margin-top: 0;
}

.category-icon {
  width: 50px;
  height: 50px;
  background: linear-gradient(135deg, #115563, #159295);
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}

.category-icon svg {
  width: 22px;
  height: 22px;
  fill: #fff;
}

.category-title {
  font-size: 24px;
  font-weight: 500;
  color: #114c5c;
}

/* Service cards */
.services-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(320px, 1fr));
  gap: 20px;
  margin-bottom: 16px;
}

.service-card {
  background: #fff;
  border-radius: 12px;
  padding: 24px;
  border: 1px solid #e8e8e8;
  transition: all 0.2s ease;
  position: relative;
  overflow: hidden;
}

.service-card:hover {
  transform: translateY(-3px);
  box-shadow: 0 8px 25px rgba(0,0,0,0.08);
  border-color: #0d7c5f;
}

.service-card::before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  width: 0;
  height: 100%;
  background: 0;
  border-radius: 4px 0 0 4px;
}

.service-card-header {
  display: flex;
  align-items: center;
  gap: 12px;
  margin-bottom: 14px;
}

.service-icon {
  width: 58px;
  height: 36px;
  background: rgba(13, 124, 95, 0.1);
  border-radius: 10px;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  width: 70px;
  height: 70px;
  border-radius: 999px;
  background: #15999b0d;
  border: 2px dashed rgba(21, 153, 155, 0.7);
  display: flex;
  align-items: center;
  justify-content: center;
  transition: 0.35s ease;
  padding: 12px;
}

.service-icon svg {
  width: 38px;
  height: 38px;
  fill: #15999b;
}

.service-name {
  font-size: 20px;
  font-weight: 500;
  color: #414143;
}

.requirements-title {
  font-size: 16px !important;
  font-weight: 600;
  text-transform: initial;
  letter-spacing: 0;
  color: #086c6e !important;
  margin-bottom: 10px !important;
}

.services-new-card ul {
  list-style: none;
  padding: 0;
}

.services-new-card ul li {
  padding-left: 20px;
  color: #6a7b75;
  font-size: 16.5px;
  line-height: 1.5;
  position: relative;
}

.services-new-card ul li::before {
  content: '';
  position: absolute;
  left: 0;
  top: 10px;
  width: 8px;
  height: 8px;
  background: #15999b;
  border-radius: 50%;
  opacity: 0.7;
}

.txt-cnter{ text-align:center; }

.aid-app-page .ne-tab-step-form {
  max-width: inherit;
  margin:0;
}

.ne-tsf-pass-flx{
    display: flex!important;
    justify-content: space-between!important;
    align-items: center!important;
}

@media (max-width: 768px) {
  .services-grid {
    grid-template-columns: 1fr;
  }
  .tabs-container {
    gap: 6px;
  }
  .tab-label {
    padding: 10px 16px;
    font-size: 13px;
  }
  .donate-swiper-card {
  min-height: 200px;}
}






.rm-bx{
  background-color: #e5f5f6;
  padding: 15px;
  border-radius: 15px;
  border: solid 1px #a1dfe2;
  margin-bottom: 25px;
  margin-top: 15px;
}



.page-header {
  text-align: center;
  margin-bottom: 32px;
}

.page-header h1 {
  font-size: 24px;
  font-weight: 700;
  color: #1e293b;
  margin: 0 0 8px 0;
}

.page-header p {
  font-size: 14px;
  color: #64748b;
  margin: 0;
}

.form-section {
  background: #fff;
  border-radius: 12px;
  padding: 24px;
  margin-bottom: 20px;
  border: 1px solid #e2e8f0;
}

.section-header {
  display: flex;
  align-items: center;
  gap: 10px;
  margin-bottom: 20px;
}

.section-icon {
  width: 45px;
  height: 45px;
  background: #15999b14;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #15999b !important;
}

.section-header h2 {
  font-size: 18px;
  font-weight: 500;
  margin: 0;
  color: #114c5c;
}

.form-row {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 16px;
  margin-bottom: 16px;
}

.form-group {
  display: flex;
  flex-direction: column;
  gap: 6px;
}

.form-group.full-width {
  grid-column: 1 / -1;
}

.form-group label {
  font-size: 15px;
  font-weight: 500;
  color: #475569;
}

.form-group input,
.form-group select,
.form-group textarea {
  padding: 10px 12px;
  border: 1px solid #e2e8f0;
  border-radius: 8px;
  font-size: 16px;
  color: #1e293b;
  background: #fff;
  font-family: inherit;
  transition: border-color 0.15s ease;
}

.form-group input:focus,
.form-group select:focus,
.form-group textarea:focus {
  outline: none;
  border-color: #0d9488;
  box-shadow: 0 0 0 3px rgba(13, 148, 136, 0.1);
}

.form-group textarea {
  resize: vertical;
  min-height: 100px;
}

/* RAHEEM AI Assistant Box */
.raheem-box-1 {
  background: linear-gradient(135deg, #15999b14 0%, #15999b12 100%);
  border: 1.5px solid #15999b3d;
  border-radius: 14px;
  padding: 24px;
  margin-bottom: 20px;
  position: relative;
  overflow: hidden;
  margin-top: 20px;
}

.raheem-box-1::before {
  content: '';
  position: absolute;
  top: -40px;
  right: -40px;
  width: 120px;
  height: 120px;
  background: radial-gradient(circle, rgba(13, 148, 136, 0.08) 0%, transparent 70%);
  border-radius: 50%;
}

.raheem-box-1::after {
  content: '';
  position: absolute;
  bottom: -30px;
  left: -30px;
  width: 100px;
  height: 100px;
  background: radial-gradient(circle, rgba(14, 165, 233, 0.06) 0%, transparent 70%);
  border-radius: 50%;
}

.raheem-header {
  display: flex;
  align-items: center;
  gap: 12px;
  margin-bottom: 14px;
  position: relative;
  z-index: 1;
}

.raheem-icon {
  width: 50px;
  height: 50px;
  /*! background: linear-gradient(135deg, #0d9488, #0891b2); */
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 28px;
  /*! box-shadow: 0 4px 12px rgba(13, 148, 136, 0.25); */
}

.raheem-title {
  font-size: 19px;
  font-weight: 500;
  color: #0f766e;
  margin: 0;
}

.raheem-badge {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  background: #ccfbf1;
  color: #0d9488;
  font-size: 11px;
  font-weight: 600;
  padding: 3px 8px;
  border-radius: 20px;
  margin-left: auto;
}

.raheem-description {
  font-size: 17px;
  color: #475569;
  line-height: 1.4;
  margin: 0 0 18px 0;
  position: relative;
  z-index: 1;
}

.raheem-box-1 {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  background: linear-gradient(135deg, #15999b, #0891b2);
  color: #fff;
  border: none;
  border-radius: 10px;
  padding: 16px 22px;
  font-size: 17px;
  font-weight: 500;
  cursor: pointer;
  transition: all 0.2s ease;
  position: relative;
  z-index: 1;
  box-shadow: 0 4px 14px rgba(13, 148, 136, 0.3);
}

.raheem-box-1:hover {
  transform: translateY(-1px);
  box-shadow: 0 6px 20px rgba(13, 148, 136, 0.4);
}

.raheem-box-1 .sparkle {
  font-size: 16px;
}

/* Assistance Details Section */
.assistance-section {
  background: #fff;
  border-radius: 12px;
  padding: 24px;
  border: 1px solid #e2e8f0;
}

@media (prefers-reduced-motion: no-preference) {
  .raheem-box-1 {
    animation: fadeInUp 0.5s ease-out both;
  }
  @keyframes fadeInUp {
    from { opacity: 0; transform: translateY(12px); }
    to { opacity: 1; transform: none; }
  }
  .raheem-box-1 {
    animation: pulse 2s ease-in-out infinite;
    animation-delay: 1s;
  }
  @keyframes pulse {
    0%, 100% { box-shadow: 0 4px 14px rgba(13, 148, 136, 0.3); }
    50% { box-shadow: 0 4px 20px rgba(13, 148, 136, 0.5); }
  }
}





.aid-ai-robot::after {
   content: "\f00c";
  font-family: "Font Awesome 6 Free";
  font-weight: 900;
  background-color: #45d770;
  width: 34px;
  height: 34px;
  position: absolute;
  z-index: 10;
  margin-left: 60px;
  margin-top: 60px;
  border-radius: 50%;
  font-size: 18px;
  padding-top: 9px;}




.floating-action{
    position:fixed;
    right:20px;
    bottom:235px;
    transform:translateY(-50%);
    z-index:9;
}

.robot-btn{
    display:flex;
    align-items:center;
    justify-content:center;
    background:#1297A3;
    border-radius:50%;
    text-decoration:none;
    position:relative;
    box-shadow:0 10px 25px rgba(0,0,0,.15);
    width: 55px;
    height: 55px;
    padding: 3px;
}
.robot-btn i{ color: #fff; font-size: 27px;}

.robot-btn:hover{
    transform:scale(1.08);
}
.chat-header h5{ color:#fff;  }





.raheem-btn{
    position:fixed;
    right:20px;
    bottom:30px;
    width:70px;
    height:70px;
    border-radius:50%;
    background:#18a3a7;
    color:#fff;
    font-size:32px;
    display:flex;
    align-items:center;
    justify-content:center;
    cursor:pointer;
    box-shadow:0 10px 25px rgba(0,0,0,.2);
    z-index:9999;
}

.raheem-chat{
    position:fixed;
    right:20px;
    bottom:20px;
    width:350px;
    background:#fff;
    border-radius:16px;
    box-shadow:0 15px 40px rgba(0,0,0,.15);
    overflow:hidden;
    display:none;
    z-index:9999999;
}

.chat-body h4{ font-size:18px; margin-bottom:10px }
.chat-body p{ font-size:16px; margin-bottom:5px;  line-height:1.2; }

.raheem-chat.show{
    display:block;
}

.chat-header{
    background:#18a3a7;
    color:#fff;
    padding:15px 20px;
    font-weight:600;
    display:flex;
    justify-content:space-between;
}
.robot-btn:hover{ cursor:pointer; }
.chat-body{
    padding:20px ;
    line-height:1.2;
}

.chat-body ul{
    padding-left:18px;

}
.chat-body li{ font-size:15px; }

.tagline{
    margin-top:9px;
    font-weight:700;
    color:#18a3a7;
    font-size: 16px;
    margin-bottom: 15px;
}

.chat-header span:hover{ cursor:pointer; }
.chat-header img{ width:35px; }

.aid-eligibility-card .aid-app-grid label {
  border: 1px solid #159497;
  border-radius: 8px;}

/* Aid Application mobile layout */
@media (max-width: 991px) {
  .aid-app-page {
    padding: 30px 0;
  }

  .aid-app-page .container {
    max-width: 100%;
    padding-left: 14px;
    padding-right: 14px;
  }

  .ne-tsf-pass-flx {
    display: block !important;
  }

  .aid-app-hero {
    max-width: none;
    margin-bottom: 16px;
    text-align: center;
  }

  .aid-app-hero h1 {
    font-size: 30px;
    line-height: 1.2;
  }

  .aid-app-hero p {
    font-size: 15px;
    line-height: 19px;
  }

  .aid-app-page .ne-tab-step-form {
    width: 100%;
  }

  .ne-tab-step-form .ne-tsf-pass {
    width: 100%;
    justify-content: flex-start;
  }

  .aid-app-shell {
    display: block;
  }

  .aid-app-steps {
    position: static;
    display: flex;
    gap: 10px;
    overflow-x: auto;
    padding: 12px;
    margin-bottom: 16px;
    scroll-snap-type: x mandatory;
    -webkit-overflow-scrolling: touch;
  }

  .aid-app-step {
    min-width: 215px;
    grid-template-columns: 34px 1fr;
    padding: 12px;
    scroll-snap-align: start;
  }

  .aid-app-step span {
    width: 28px;
    height: 28px;
  }

  .aid-app-step strong {
    font-size: 15px;
    line-height: 1.25;
  }

  .aid-app-step small {
    font-size: 11px;
  }

  .aid-app-steps .ne-tab-step-form {
    display: none;
  }

  .aid-app-form {
    padding: 18px;
    border-radius: 14px;
  }

  .aid-app-grid,
  .aid-upload-grid,
  .aid-review-grid,
  .aid-dependent-fields .aid-app-grid {
    grid-template-columns: 1fr;
  }

  .aid-app-panel-head h2 {
    font-size: 18px;
  }

  .aid-app-panel-head p,
  .aid-app-grid label,
  .aid-upload-grid label,
  .aid-review-grid div {
    font-size: 15px;
  }

  .aid-eligibility-choice {
    grid-template-columns: 1fr;
  }

  .raheem-header {
    flex-wrap: wrap;
  }

  .raheem-badge {
    margin-left: 0;
  }

  .aid-ai-modal-card {
    width: min(100%, calc(100vw - 24px));
  }
}

@media (max-width: 575px) {
  .aid-app-page {
    padding: 22px 0;
  }

  .aid-app-hero h1 {
    font-size: 20px;
  }

  .ne-tab-step-form .ne-tsf-pass {
    padding: 12px;
    align-items: flex-start;
  }

  .ne-tab-step-form .ne-tsf-pass strong,
  .ne-tab-step-form .ne-tsf-pass span {
    font-size: 14px;
  }

  .aid-app-steps {
    margin-left: -14px;
    margin-right: -14px;
    border-radius: 0;
  }

  .aid-app-step {
    min-width: 188px;
  }

  .aid-app-form {
    padding: 14px;
  }

  .aid-app-section h3 {
    font-size: 17px;
    line-height: 1.3;
  }

  .aid-app-grid label,
  .aid-upload-grid label,
  .aid-review-grid div,
  .aid-terms-box,
  .aid-reference-card,
  .raheem-box {
    padding: 12px;
  }

  .aid-upload-top {
    align-items: flex-start;
    gap: 8px;
  }

  .aid-upload-badge {
    white-space: normal;
    text-align: center;
  }

  .aid-app-actions {
    flex-direction: column;
  }

  .aid-app-actions button,
  .aid-app-primary,
  .aid-app-secondary,
  .raheem-box-1 {
    width: 100%;
  }
}

html[dir="rtl"] .aid-app-hero {
  text-align: right;
}

html[dir="rtl"] .aid-app-step {
  text-align: right;
}
.section-title-center h2{ text-align:center!important; }
.how-work-content .section-title-center h2{ text-align:left!important; }

@media (max-width: 991px) {
  html[dir="rtl"] .aid-app-hero {
    text-align: center;
  }

  html[dir="rtl"] .aid-app-steps {
    direction: rtl;
  }


.robot-btn {
  width: 47px;
  height: 47px;}


.floating-action {
  right: 8px;}



.chat-toggle {
  width: 47px;
  height: 47px;}

.zakat-icon-box {
  width: 57px;
  height: 57px;}

.aid-reference-card strong {
  font-size: 19px;}

}


@media (max-width: 640px) {
  .zakat-popup-head h2 {
    font-size: 21px;
  }
}
.post-entry div{
	padding-top: 10px;
    padding-bottom: 10px;
}
.content-gallery {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(336px, 1fr));
  gap: 14px;
  margin-top: 0px;
  margin-bottom: 0px;
  padding: 0px !important;
}

.content-gallery-inline {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(348px, 320px));
  margin: 5px 0 5px;
}

.content-gallery-item {
  display: block;
  width: 100%;
  aspect-ratio: 4 / 3;
  overflow: hidden;
  padding: 0;
  border: 1px solid rgba(17, 76, 92, 0.12);
  border-radius: 10px;
  background: #fff;
  cursor: pointer;
  box-shadow: 0 10px 24px rgba(17, 76, 92, 0.08);
}

.post-entry p .content-gallery-inline {
  margin: 18px 0;
}

.content-gallery-item img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  transition: transform 0.25s ease;
}

.content-gallery-item:hover img {
  transform: scale(1.04);
}

.content-gallery-lightbox {
  position: fixed;
  inset: 0;
  z-index: 9999;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 28px;
}

.content-gallery-backdrop {
  position: absolute;
  inset: 0;
  border: 0;
  background: rgba(3, 25, 31, 0.78);
  cursor: zoom-out;
}

.content-gallery-modal {
  position: relative;
  z-index: 1;
  max-width: min(1080px, 94vw);
  max-height: 88vh;
  border-radius: 14px;
  background: #fff;
  padding: 10px;
  box-shadow: 0 28px 70px rgba(0, 0, 0, 0.35);
}

.content-gallery-modal img {
  display: block;
  max-width: 100%;
  max-height: calc(88vh - 20px);
  object-fit: contain;
  border-radius: 10px;
}

.content-gallery-close {
  position: absolute;
  right: -14px;
  top: -14px;
  width: 38px;
  height: 38px;
  border: 0;
  border-radius: 50%;
  background: #15999b;
  color: #fff;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  box-shadow: 0 10px 24px rgba(0, 0, 0, 0.24);
}

.content-gallery-nav {
  position: absolute;
  top: 50%;
  z-index: 2;
  width: 44px;
  height: 44px;
  border: 0;
  border-radius: 50%;
  background: rgba(21, 153, 155, 0.94);
  color: #fff;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  transform: translateY(-50%);
  box-shadow: 0 10px 24px rgba(0, 0, 0, 0.24);
}

.content-gallery-prev {
  left: -22px;
}

.content-gallery-next {
  right: -22px;
}

.content-gallery-nav:hover,
.content-gallery-close:hover {
  background: #087489;
}

@media (max-width: 575px) {
  .content-gallery {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px;
  }

  .content-gallery-lightbox {
    padding: 14px;
  }

  .content-gallery-close {
    right: 6px;
    top: 6px;
  }

  .content-gallery-prev {
    left: 8px;
  }

  .content-gallery-next {
    right: 8px;
  }
}

.mag-card .mag-btn {
  width: 100%;
  border: 0;
  text-align: center;
}

.mag-pdf-modal {
  position: fixed;
  inset: 0;
  z-index: 9999;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 24px;
}

.mag-pdf-backdrop {
  position: absolute;
  inset: 0;
  border: 0;
  background: rgba(3, 25, 31, 0.78);
}

.mag-pdf-dialog {
  position: relative;
  z-index: 1;
  width: min(1100px, 96vw);
  height: min(860px, 92vh);
  background: #fff;
  border-radius: 14px;
  overflow: hidden;
  box-shadow: 0 28px 70px rgba(0, 0, 0, 0.35);
  display: flex;
  flex-direction: column;
}

.mag-pdf-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  padding: 16px 18px;
  background: #f6fbfb;
  border-bottom: 1px solid rgba(17, 76, 92, 0.1);
}

.mag-pdf-head h3 {
  margin: 0;
  color: #0b425a;
  font-size: 20px;
}

.mag-pdf-head p {
  margin: 4px 0 0;
  color: #5a6f7d;
}

.mag-pdf-actions {
  display: flex;
  align-items: center;
  gap: 10px;
  flex-shrink: 0;
}

.mag-pdf-actions a,
.mag-pdf-actions button {
  border: 0;
  border-radius: 8px;
  background: #15999b;
  color: #fff;
  min-height: 40px;
  padding: 0 14px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  text-decoration: none;
  font-weight: 600;
}

.mag-pdf-actions button {
  width: 40px;
  padding: 0;
}

.mag-pdf-dialog iframe {
  width: 100%;
  flex: 1;
  border: 0;
  background: #f5f5f5;
}

.project-detail-page {
  min-height: 100vh;
  background:
    radial-gradient(circle at 8% 18%, rgba(21, 153, 155, 0.12), transparent 26%),
    linear-gradient(180deg, #f7fbfb 0%, #f3faf9 100%);
  padding: 0 0 54px;
}

.project-detail-accent {
  height: 24px;
  background: linear-gradient(90deg, #0a6173, #0ba1a4);
  margin-bottom: 40px;
}

.project-detail-container {
  max-width: 1510px;
}

.project-detail-grid {
  display: grid;
  grid-template-columns: minmax(420px, 0.96fr) minmax(520px, 1fr);
  gap: 22px;
  align-items: stretch;
}

.project-visual-card,
.project-donation-card {
  position: relative;
  background: rgba(255, 255, 255, 0.88);
  border: 1px solid rgba(13, 100, 119, 0.14);
  border-radius: 22px;
  box-shadow: 0 24px 70px rgba(18, 72, 82, 0.12);
  overflow: hidden;
}

.project-visual-card {
  min-height: 640px;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 58px;
}

.project-visual-card img {
  width: min(78%, 560px);
  max-height: 430px;
  object-fit: contain;
  position: relative;
  z-index: 2;
  filter: drop-shadow(0 30px 40px rgba(7, 68, 79, 0.14));
}

.project-dot-pattern {
  position: absolute;
  left: 36px;
  top: 42px;
  width: 94px;
  height: 94px;
  background-image: radial-gradient(circle, rgba(21, 153, 155, 0.28) 2.5px, transparent 3px);
  background-size: 18px 18px;
  z-index: 9;
}

.project-line-pattern {
  position: absolute;
  inset: 0; 
}

.project-permit {
  position: absolute;
  left: 54px;
  bottom: 68px;
  z-index: 3;
  display: flex;
  align-items: center;
  gap: 18px;
  color: #111;
}

.project-permit-mark {
  width: 76px;
  height: 76px;
  border-radius: 20px;
  background: linear-gradient(135deg, #15999b, #0c596b);
  color: #fff;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 34px;
  box-shadow: 0 16px 36px rgba(21, 153, 155, 0.24);
  transform: rotate(-10deg);
}

.project-permit span,
.project-permit strong,
.project-permit small {
  display: block;
  line-height: 1.05;
}

.project-permit span {
  font-size: 24px;
  font-weight: 800;
  letter-spacing: 0;
}

.project-permit strong {
  font-size: 42px;
  letter-spacing: 8px;
  margin-top: 3px;
}

.project-permit small {
  font-size: 17px;
  margin-top: 10px;
}

.project-share-main {
  position: absolute;
  right: 22px;
  bottom: 24px;
  z-index: 4;
  width: 54px;
  height: 54px;
  border: 0;
  border-radius: 50%;
  background: linear-gradient(135deg, #15999b, #0a6173);
  color: #fff;
  font-size: 21px;
  box-shadow: 0 16px 30px rgba(10, 97, 115, 0.24);
}

.project-share-list {
  position: absolute;
  right: 24px;
  bottom: 88px;
  z-index: 4;
  display: none;
  flex-direction: column;
  gap: 8px;
}

.project-share-list.active {
  display: flex;
}

.project-share-list a {
  width: 42px;
  height: 42px;
  border-radius: 50%;
  background: #0a6173;
  color: #fff;
  display: flex;
  align-items: center;
  justify-content: center;
  text-decoration: none;
}

.project-donation-card {
  padding: 34px 36px 28px;
}

.project-title-row {
  display: grid;
  grid-template-columns: 70px 1fr;
  gap: 18px;
  align-items: flex-start;
}

.project-title-icon {
  width: 58px;
  height: 58px;
  border-radius: 50%;
  background: linear-gradient(135deg, #0a6173, #15999b);
  color: #fff;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 30px;
  box-shadow: 0 0 0 12px #fff, 0 14px 30px rgba(10, 97, 115, 0.18);
}

.project-title-row h1 {
  margin: 0 0 14px;
  color: #06465b;
  font-size: 29px;
  font-weight: 800;
}

.project-title-row p {
  margin: 0;
  color: #333947;
  font-size: 15.8px;
  line-height: 1.72;
}

.project-divider {
  height: 1px;
  background: rgba(10, 97, 115, 0.18);
  margin: 24px 0 16px;
}

.project-amount-label {
  display: block;
  color: #06465b;
  font-weight: 800;
  margin-bottom: 10px;
}

.project-donate-row {
  display: grid;
  grid-template-columns: 1fr 212px;
  gap: 22px;
  align-items: stretch;
}

.quk-dnt .quick-donate-row {
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
  margin: 16px 0;
}

.quk-dnt .quick-donate-row button {
  padding: 10px;
}

.quk-dnt .quick-donation-alert {
  display: flex;
  align-items: center;
  gap: 10px;
  margin-top: 14px;
  padding: 12px 14px;
  border: 1px solid rgba(213, 92, 92, 0.24);
  border-left: 4px solid #d55c5c;
  border-radius: 9px;
  background: #fff6f3;
  color: #8d2f2a;
  font-size: 14px;
  font-weight: 700;
}

.quk-dnt .quick-donation-alert i {
  color: #d55c5c;
  font-size: 18px;
}

.quk-dnt .quick-other-ways {
  margin-top: 15px;
}

.quk-dnt .quick-other-ways .project-sms-grid {
  grid-template-columns: repeat(3, 1fr);
}

.project-donate-row input {
  min-height: 58px;
  border: 1px solid rgba(21, 153, 155, 0.45);
  border-radius: 9px;
  padding: 0 18px;
  color: #24303d;
  font-size: 20px;
  outline: 0;
  background: #fff;
}

.project-donate-row button {
  border: 0;
  border-radius: 9px;
  background: linear-gradient(135deg, #20aa91, #075b72);
  color: #fff;
  font-size: 21px;
  font-weight: 800;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 14px;
  box-shadow: 0 16px 34px rgba(10, 97, 115, 0.22);
}

.project-donate-row button span {
  width: 42px;
  height: 42px;
  border-radius: 50%;
  background: #fff;
  color: #15999b;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}

.project-secure-note {
  display: flex;
  align-items: center;
  gap: 9px;
  margin: 9px 0 18px;
  color: #475867;
  font-size: 14px;
}

.project-secure-note i {
  color: #15999b;
}

.project-sms-box {
  border: 1px solid rgba(21, 153, 155, 0.28);
  border-radius: 14px;
  padding: 17px 16px 22px;
  background: rgba(255, 255, 255, 0.62);
}

.project-sms-box h2 {
  margin: 0 0 14px;
  color: #06465b;
  font-size: 17px;
  font-weight: 800;
  display: flex;
  align-items: center;
  gap: 10px;
}

.project-sms-box h2 i {
  color: #15999b;
}

.project-provider-row {
  display: flex;
  gap: 16px;
  margin-bottom: 20px;
}

.project-provider-row button {
  width: 188px;
  height: 52px;
  border: 1px solid rgba(10, 97, 115, 0.12);
  border-radius: 8px;
  background: #fff;
  box-shadow: 0 8px 18px rgba(10, 97, 115, 0.07);
}

.project-provider-row img {
  max-height: 36px;
  max-width: 110px;
  object-fit: contain;
}

.project-sms-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 12px 28px;
}

.project-sms-grid button {
  min-height: 60px;
  border: 1px solid rgba(21, 153, 155, 0.26);
  border-radius: 8px;
  background: #fff;
  color: #06465b;
  display: grid;
  grid-template-columns: 36px 1fr;
  grid-template-rows: 1fr 1fr;
  column-gap: 10px;
  align-items: center;
  text-align: left;
  padding: 8px 14px;
}

.project-sms-grid button span {
  grid-row: 1 / span 2;
  width: 34px;
  height: 34px;
  border-radius: 50%;
  background: #fff;
  color: rgb(30, 80, 40);
  border: 1px solid rgba(30, 80, 40, 0.18);
  display: flex;
  align-items: center;
  justify-content: center;
}

.project-sms-grid button strong {
  font-size: 16px;
  line-height: 1;
}

.project-sms-grid button small {
  color: #333947;
  font-size: 13px;
}

.project-trust-strip {
  width: min(980px, calc(100% - 160px));
  margin: 16px auto 0;
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 0;
  background: rgba(255, 255, 255, 0.82);
  border: 1px solid rgba(10, 97, 115, 0.1);
  border-radius: 14px;
  box-shadow: 0 16px 42px rgba(18, 72, 82, 0.1);
  overflow: hidden;
}

.project-trust-item {
  display: grid;
  grid-template-columns: 58px 1fr;
  gap: 12px;
  align-items: center;
  padding: 16px 22px;
  color: #06465b;
}

.project-trust-item:not(:last-child) {
  border-right: 1px solid rgba(10, 97, 115, 0.1);
}

.project-trust-item span {
  width: 50px;
  height: 50px;
  border-radius: 50%;
  background: #fff;
  color: #15999b;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 25px;
  box-shadow: 0 8px 22px rgba(10, 97, 115, 0.12);
}

.project-trust-item strong {
  display: block;
  font-size: 14px;
  margin-bottom: 4px;
}

.project-trust-item p {
  margin: 0;
  color: #333947;
  font-size: 13px;
  line-height: 1.45;
}

@media (max-width: 575px) {
  .mag-pdf-modal {
    padding: 10px;
  }

  .mag-pdf-head {
    align-items: flex-start;
    flex-direction: column;
  }

  .mag-pdf-actions {
    width: 100%;
  }

  .mag-pdf-actions a {
    flex: 1;
  }
}

@media (max-width: 1199px) {
  .project-detail-grid {
    grid-template-columns: 1fr;
  }

  .project-visual-card {
    min-height: 520px;
  }

  .project-trust-strip {
    width: 100%;
    grid-template-columns: repeat(2, 1fr);
  }

  .project-trust-item:nth-child(2) {
    border-right: 0;
  }
}

@media (max-width: 767px) {
  .project-detail-accent {
    margin-bottom: 20px;
  }

  .project-visual-card {
    min-height: 420px;
    padding: 32px;
  }

  .project-visual-card img {
    width: 82%;
  }

  .project-permit {
    left: 26px;
    bottom: 34px;
    transform: scale(0.78);
    transform-origin: left bottom;
  }

  .project-donation-card {
    padding: 24px 18px;
  }

  .project-title-row {
    grid-template-columns: 1fr;
  }

  .project-donate-row {
    grid-template-columns: 1fr;
    gap: 12px;
  }

  .project-donate-row button {
    min-height: 58px;
  }

  .project-provider-row {
    flex-wrap: wrap;
  }

  .project-provider-row button {
    flex: 1 1 130px;
  }

  .project-sms-grid,
  .project-trust-strip {
    grid-template-columns: 1fr;
  }

  .project-trust-item,
  .project-trust-item:not(:last-child) {
    border-right: 0;
    border-bottom: 1px solid rgba(10, 97, 115, 0.1);
  }
}

.pickup-map-picker {
  margin: 18px 0 8px;
  border: 1px solid rgba(21, 153, 155, 0.18);
  border-radius: 12px;
  overflow: hidden;
  background: #fff;
  box-shadow: 0 12px 30px rgba(10, 97, 115, 0.08);
}

.pickup-map-search {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 12px 14px;
  margin: 0;
  border-bottom: 1px solid rgba(21, 153, 155, 0.16);
  background: #f7fbfc;
  color: #0d6679;
}

.pickup-map-search input {
  width: 100%;
  border: 0;
  outline: 0;
  background: transparent;
  color: #24303d;
  font-size: 15px;
}

.pickup-map-search input::placeholder {
  color: #7e8b96;
}

.pickup-map-canvas {
  min-height: 300px;
  position: relative;
  background: #eaf5f7;
}

.pickup-map-placeholder {
  position: absolute;
  inset: 0;
  display: grid;
  place-items: center;
  align-content: center;
  gap: 8px;
  padding: 24px;
  text-align: center;
  color: #0d6679;
  font-weight: 600;
}

.pickup-map-placeholder i {
  font-size: 30px;
}

.pickup-map-meta {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  align-items: center;
  padding: 11px 14px;
  border-top: 1px solid rgba(21, 153, 155, 0.16);
  background: #fff;
  color: #06465b;
  font-size: 13px;
}

.pickup-map-meta span {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  font-weight: 700;
}

.pickup-map-meta strong {
  color: #15999b;
  font-weight: 700;
}

@media (max-width: 640px) {
  .pickup-map-canvas {
    min-height: 240px;
  }

  .pickup-map-meta {
    align-items: flex-start;
    flex-direction: column;
  }
}

.in-kind-alert {
  display: grid;
  grid-template-columns: 42px 1fr;
  gap: 12px;
  align-items: center;
  margin: 0 0 22px;
  padding: 14px 16px;
  border: 1px solid rgba(219, 128, 30, 0.26);
  border-left: 4px solid #db801e;
  border-radius: 10px;
  background: linear-gradient(135deg, rgba(255, 248, 239, 0.98), rgba(255, 255, 255, 0.98));
  box-shadow: 0 12px 28px rgba(96, 63, 21, 0.08);
  color: #57350f;
}

.in-kind-alert-icon {
  width: 42px;
  height: 42px;
  border-radius: 50%;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: rgba(219, 128, 30, 0.12);
  color: #db801e;
  font-size: 18px;
}

.in-kind-alert strong,
.in-kind-alert small {
  display: block;
}

.in-kind-alert strong {
  margin-bottom: 3px;
  color: #06465b;
  font-size: 15px;
  font-weight: 800;
}

.in-kind-alert small {
  color: #57350f;
  font-size: 14px;
  line-height: 1.45;
}

@media (max-width: 575px) {
  .in-kind-alert {
    grid-template-columns: 36px 1fr;
    padding: 12px;
  }

  .in-kind-alert-icon {
    width: 36px;
    height: 36px;
  }
}