/* Top navigation header CSS start */

body {
	padding-top: 0;
}

/* DEFAULT (BEFORE SCROLL) */

#mainHeader {
	background: transparent;
}

#navBar {
	border-radius: 0;
}

#mainHeader ul {
	display: flex;
	align-items: center;
	gap: 40px;
}

#mainHeader li {
	list-style: none;
}

/* AFTER SCROLL */
.header-scrolled #navBar {
	background: #3c5366;
	border-radius: 999px;
	padding: 12px 30px;
	margin-top: 10px;
	box-shadow: 0 10px 25px rgba(0, 0, 0, 0.2);
	backdrop-filter: blur(10px);
}

.headerLogo .custom-logo-link img,
.footerLogo img {
	width: 100px;
}

#mobileMenu ul {
	display: flex;
	align-items: unset;
	gap: 0;
}

#mobileMenu li {
	transition-property:
		color, background-color, border-color, text-decoration-color, fill,
		stroke;
	transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
	transition-duration: 0.15s;
	--tw-text-opacity: 1;
	color: rgb(255 255 255 / var(--tw-text-opacity, 1));
	font-weight: 700;
	font-size: 1.5rem;
	line-height: 2rem;
	padding-top: 0.75rem;
	padding-bottom: 0.75rem;
	border-color: #ffffff1a;
	border-bottom-width: 1px;
}

#mobileMenu {
	transition: all 0.3s ease;
}

#mainHeader.header-scrolled #navBar {
	max-width: 64rem;
	margin: 0 auto;
	margin-top: 0.5rem;
	margin-bottom: 0.5rem;
}

/* Top navigation header CSS end */

.swiper-pagination-bullet {
	background: #ccc;
	opacity: 1;
}

.swiper-pagination-bullet-active {
	background: #14b8a6;
	/* teal */
	width: 20px;
	border-radius: 10px;
}

.swiper-button-prev-custom,
.swiper-button-next-custom {
	transition: all 0.3s ease;
}

.swiper-button-prev-custom:hover,
.swiper-button-next-custom:hover {
	background: #14b8a6;
	color: #fff;
	border-color: #14b8a6;
}

.hero-stats {
	display: flex;
	gap: 40px;
	margin-top: 60px;
}

.hero-stats div strong {
	font-size: 24px;
	display: block;
}

/* Pagination style */
.swiper-pagination {
	display: flex;
	align-items: center;
	gap: 6px;
}

.swiper-pagination-bullet {
	background: #d1d5db;
	opacity: 1;
	width: 8px;
	height: 8px;
}

.swiper-pagination-bullet-active {
	background: #14b8a6;
	width: 20px;
	border-radius: 10px;
}

/* Subscribe Section CSS start */
.subscribe-section {
	background: linear-gradient(135deg, #0b2c44, #123d5c);
}
/* Subscribe Section CSS end */

/* Destination sections Initial hidden state start */
.card-content {
	transform: translateY(60%);
	transition: all 0.5s ease;
}

/* Hidden content */
.card-hidden {
	opacity: 0;
	transform: translateY(20px);
	transition: all 0.5s ease;
}

/* Hover Effect */
.card:hover .card-content {
	transform: translateY(0%);
}

.card:hover .card-hidden {
	opacity: 1;
	transform: translateY(0);
}

/* Image zoom */
.card img {
	transition: transform 0.6s ease;
}

.card:hover img {
	transform: scale(1.1);
}

.top-filter-cat.active {
	background: #0a2540;
	color: #fff;
}
/* Destination sections Initial hidden state end */

/* Single Destination CSS start */
.package-detail {
	padding: 60px 20px;
	background: #f5f7f9;
}

.package-hero {
	position: relative;
	border-radius: 20px;
	overflow: hidden;
}

.package-hero img {
	width: 100%;
	height: 450px;
	object-fit: cover;
}

.badge {
	position: absolute;
	top: 20px;
	left: 20px;
	background: #fff;
	padding: 8px 16px;
	border-radius: 20px;
	font-weight: 600;
}

.package-content {
	margin-top: 30px;
}

.package-content h1 {
	font-size: 36px;
	color: #0f2a3f;
}

.desc {
	color: #6b7b8c;
	margin: 15px 0;
}

.meta {
	margin: 10px 0 20px;
	color: #8898aa;
}

.features {
	display: flex;
	gap: 20px;
	margin: 20px 0;
}

.features div {
	background: #e6f2ef;
	padding: 15px;
	border-radius: 12px;
}

.bottom-bar {
	display: flex;
	justify-content: space-between;
	align-items: center;
	margin-top: 30px;
}

.price span {
	color: #8898aa;
}

.price h2 {
	font-size: 32px;
	color: #0f2a3f;
}

.btn-book {
	background: #0f2a3f;
	color: #fff;
	padding: 14px 28px;
	border-radius: 30px;
	text-decoration: none;
}
/* Single Destination CSS end */

/* Subscribe form CSS start */
.subscribe-section .wpforms-field input[type="email"] {
	outline: 2px solid transparent;
	outline-offset: 2px;
	--tw-text-opacity: 1;
	color: rgb(255 255 255 / var(--tw-text-opacity, 1));
	padding-top: 1rem;
	padding-bottom: 1rem;
	padding-left: 1.5rem;
	padding-right: 1.5rem;
	background-color: rgb(255 255 255 / 0.1);
	border-color: rgb(255 255 255 / 0.2);
	border-width: 1px;
	border-radius: 9999px;
	transition-property: all;
	transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
	transition-duration: 150ms;
	max-width: 100%;
	height: 60px;
	width: 500px;
}

.subscribe-section .wpforms-container.wpforms-container-full {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 20px;
}

.subscribe-section .wpforms-submit-container {
	margin-top: 11px;
}

.wpforms-field-label,
.wpforms-field-sublabel.after {
	color: #ffffff !important;
}

.subscribe-section .wpforms-submit-container .wpforms-submit,
#wpforms-submit-304 {
	transition-property: all;
	transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
	transition-duration: 150ms;
	--tw-text-opacity: 1;
	color: rgb(255 255 255 / var(--tw-text-opacity, 1));
	padding-top: 1rem;
	padding-bottom: 1rem;
	padding-left: 2rem;
	padding-right: 2rem;
	--tw-bg-opacity: 1;
	background-color: rgb(255 122 89 / var(--tw-bg-opacity, 1)) !important;
	border-radius: 9999px;
	gap: 0.5rem;
	height: 60px;
}
/* Subscribe form CSS start*/

.wp-singular.page-template
	.elementor-89
	.elementor-element.elementor-element-2be70090:not(
		.elementor-motion-effects-element-type-background
	),
.wp-singular.page-template
	.elementor-89
	.elementor-element.elementor-element-2be70090
	> .elementor-motion-effects-container
	> .elementor-motion-effects-layer,
.wp-singular.page-template
	.elementor-89
	.elementor-element.elementor-element-52487550:not(
		.elementor-motion-effects-element-type-background
	),
.wp-singular.page-template
	.elementor-89
	.elementor-element.elementor-element-52487550
	> .elementor-motion-effects-container
	> .elementor-motion-effects-layer {
	background-color: transparent;
	background-image: linear-gradient(130deg, rgb(10 37 64) 0%, #0a2540 89%);
}

/* Footer CSS start */
#menu-footer-services-menu li a {
	color: #fff6;
}
/* Footer CSS end */