/*========================================================================

	Template Name: 

========================================================================*/

/*----------------------------------

	Table of contents
	
	01. Common
	02. Header
	03. Slider
	04. Counter area
	05. About area
	06. Services area
	07. Call to action
	08. Portfolio
	09. Call us area
	10. Testimonial
	11. Team
	12. Subscribe area
	13. Blog
	14. Footer
	15. Inner page header
	16. Gallery
	17. Faq
	18. Pricing area
	19. Error page 404
	20. Contact us
			
----------------------------------*/

/* Theme Font Use */
/*
	注意：不引入任何外部文件。
	原模板通过 Google Fonts 的 @import 已移除，站点统一使用系统字体栈（见 --bs-font-family）。
*/

/* ========== CSS Variables ========== */
:root {
    --bs-gutter-x: 1.5rem;
    --bs-gutter-y: 0;
    --bs-body-font-family: system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", "Noto Sans", "Liberation Sans", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
    --bs-body-font-size: 1rem;
    --bs-body-font-weight: 400;
    --bs-body-line-height: 1.5;
    --bs-body-color: #212529;
    --bs-body-bg: #fff;
    --bs-primary: #0d6efd;
    --bs-link-color: #0d6efd;
    --bs-link-hover-color: #0a58ca;
	--bs-font-family: -apple-system, BlinkMacSystemFont, "Microsoft YaHei", "Segoe UI", "PingFang SC", "Hiragino Sans GB", "Helvetica Neue", Helvetica, Arial, sans-serif;

	/* Demo-compatible theme tokens (scoped usage in sections below) */
	/* Match demo tokens (main.css :root) */
	--primary-color: rgb(41 35 237);
	--section-bg: #efefff;
	--headding-color: #010742;
	--headding-font: "Jost", sans-serif;
	--white-bg: #ffffff;
	--body-color:#445658;
	--white-color: #ffffff;
	--ct-border-color: #e2e8f0;
	--ct-border-color2: #e1e1e1;
	--no-change-color1: #010742;
}


/* ===================================
	01. Common
=================================== */
*,
*::before,
*::after {
    box-sizing: border-box;
}

::selection {
	background-color: #08b5f9;
	color: #fff;
}
::-moz-selection {
 background-color: #08b5f9;
 color: #fff;
}
img {
	max-width: 100%;
}
body {
	margin: 0;
	padding: 0;
	font-size: 12px;
	font-family: var(--bs-font-family);
	color: var(--body-color);
	letter-spacing: 1px;
}
p {
	line-height: 24px;
	font-size: 14px;
	color: #333;
	font-family: var(--bs-font-family);
}
h1, h2, h3, h4, h5, h6 {
	margin: 0px;
	color: #202020;
	padding: 0px;
	line-height: 1.2;
	letter-spacing: 1px;
	font-family: var(--bs-font-family);
}
h1 {
	font-size: 60px;
	font-weight: 700;
}
h2 {
	font-size: 36px;
	font-weight: 700;
}
h3 {
	font-size: 26px;
	font-weight: 700;
}
h4 {
	font-size: 24px;
	font-weight: 700;
}
h5 {
	font-size: 18px;
	font-weight: 700;
}
h6 {
	font-size: 16px;
	font-weight: 700;
}
ul, ol, li {
	margin: 0px;
	padding: 0px;
	list-style: none;
}
a {
	text-decoration: none;
	cursor: pointer;
}
a:hover {
	text-decoration: none;
}
/* --- Top Scroll --- */
.scroll-top {
	display: none;
	position: fixed;
	bottom: 2px;
	text-align: center;
	right: 2%;
	width: 40px;
	height: 40px;
	line-height: 40px;
	font-size: 12px;
	color: #fff;
	background-color: #333;
	text-decoration: none;
	border-radius: 100%;
	z-index: 9999;
}
.scroll-top:hover {
	color: #fff !important;
	text-decoration: none;
	background-color: #08b5f9;
}
/* --- Buttons --- */
.btn-style-1 {
	color: #fff;
	border: 1px solid #08b5f9;
	border-radius: 6px;
	position: relative;
	padding: 16px 30px;
	font-size: 14px;
	text-align: center;
	z-index: 0;
	text-transform: uppercase;
	font-weight: 600;
	line-height: 22px;
	overflow: hidden;
	text-decoration: none;
	display: inline-block;
	background-color: #08b5f9;
}
.btn-style-1:before {
	content: "";
	position: absolute;
	z-index: -1;
	top: 0;
	bottom: 0;
	left: 0;
	right: 0;
	background-color: #151515;
	-webkit-transform: scaleY(0);
	transform: scaleY(0);
	-webkit-transform-origin: 50%;
	transform-origin: 50%;
	-webkit-transition-property: transform;
	transition-property: transform;
	-webkit-transition: all 0.3s ease-in-out;
	-moz-transition: all 0.3s ease-in-out;
	-o-transition: all 0.3s ease-in-out;
	transition: all 0.3s ease-in-out;
}
.btn-style-1:hover:before {
	-webkit-transform: scaleY(1);
	transform: scaleY(1);
}
.btn-style-1:hover {
	color: #fff;
}
.btn-style-1.btn-sm {
	font-size: 11px;
	padding: 8px 20px;
}
.btn-style-2 {
	color: #fff;
	border: 1px solid #000;
	border-radius: 6px;
	position: relative;
	padding: 16px 30px;
	font-size: 14px;
	text-align: center;
	z-index: 0;
	text-transform: uppercase;
	font-weight: 600;
	line-height: 22px;
	overflow: hidden;
	text-decoration: none;
	display: inline-block;
	background-color: #000;
}
.btn-style-2:before {
	content: "";
	position: absolute;
	z-index: -1;
	top: 0;
	bottom: 0;
	left: 0;
	right: 0;
	background-color: #08b5f9;
	-webkit-transform: scaleY(0);
	transform: scaleY(0);
	-webkit-transform-origin: 50%;
	transform-origin: 50%;
	-webkit-transition-property: transform;
	transition-property: transform;
	-webkit-transition: all 0.3s ease-in-out;
	-moz-transition: all 0.3s ease-in-out;
	-o-transition: all 0.3s ease-in-out;
	transition: all 0.3s ease-in-out;
}
.btn-style-2:hover:before {
	-webkit-transform: scaleY(1);
	transform: scaleY(1);
}
.btn-style-2:hover {
	color: #fff;
}
.btn-style-2.btn-sm {
	font-size: 11px;
	padding: 8px 20px;
}
/* --- Loading --- */
#preloader {
	position: fixed;
	left: 0;
	top: 0;
	z-index: 99999;
	width: 100%;
	text-align: center;
	height: 100%;
	vertical-align: middle;
	height: 100%;
	overflow: visible;
	background-color: #fff;
}
#preloader .spinner-grow {
	top: 50%;
	position: relative;
}
/* --- section title --- */
.section-title .small-title {
	font-size: 12px;
	color: #08b5f9;
}
.section-title h2 {
	position: relative;
	color: #000;
	font-size: 40px;
	text-decoration: underline;
	font-weight: 500;
	font-family: 'Big Shoulders Display', cursive;
}
.section-title h2::first-letter {
	color: #08b5f9;
}
/* ===================================
	02. Header
=================================== */
/* Page Header + RD Navbar
	- 仅作用于 header：统一收敛到 .page-header 作用域，避免影响其他区域
	- 尽量不改结构，只做选择器作用域化
*/

/* 2. .page-header */
.page-header {
	position: sticky;
	top: 0;
	z-index: 1100;
	background: #ffffff;
	transition: box-shadow .25s ease, background-color .25s ease, border-color .25s ease;
	overflow: visible;
    /* min-height: 100vh; */
    /* opacity: 0; */
	/* height: 140.875px; */
	border-bottom: solid 1px #ebebeb;
}

.page-header.is-stuck {
	background-color: rgba(255, 255, 255, 0.85);
	-webkit-backdrop-filter: saturate(180%) blur(12px);
	backdrop-filter: saturate(180%) blur(12px);
	box-shadow: 0 10px 30px rgba(0, 0, 0, 0.08);
	border-bottom-color: rgba(235, 235, 235, 0.9);
}

@media (prefers-reduced-motion: reduce) {
	.page-header {
		transition: none;
	}
}

/* 3. .rd-navbar-wrap */
.page-header .rd-navbar-wrap {
    transition: 0.35s all cubic-bezier(0.65, 0.05, 0.36, 1);
}

/* 4. .rd-navbar */
.page-header .rd-navbar {
    display: none;
	background: transparent;
}

/* 5. .rd-navbar-static */
.page-header .rd-navbar-static {
    display: block;
	background: transparent;
    border-bottom: 1px solid transparent;
}

/* 6. .rd-navbar-original - 无样式，JS用 */

/* 7. .rd-navbar-collapse-toggle */
.page-header .rd-navbar-collapse-toggle {
    display: inline-block;
    position: relative;
    width: 48px;
    height: 48px;
    line-height: 48px;
    cursor: pointer;
    color: #7B8095;
    display: none;
}

/* 8. .rd-navbar-fixed-element-1 */
.page-header .rd-navbar-fixed-element-1 {
    position: fixed;
    top: 4px;
    z-index: 1082;
    right: 0;
}

/* 9. .toggle-original - 无样式，JS用 */

/* 10. .rd-navbar-main-outer */
.page-header .rd-navbar-static .rd-navbar-main-outer {
    padding-left: 15px;
    padding-right: 15px;
}

/* rd-navbar-main */
.page-header .rd-navbar-static .rd-navbar-main {
    max-width: 1170px;
    margin-left: auto;
    margin-right: auto;
    position: relative;
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 9px 0;
}

/* rd-navbar-brand */
.page-header .rd-navbar-static .rd-navbar-brand img {
    max-width: 270px;
	text-align: center;
}

/* .brand */
.page-header .brand {
    display: inline-flex;
    align-items: center;
    text-decoration: none;
}

.page-header .brand img {
    height: 58px;
    width: auto;
    margin-right: 12px;
}

.page-header .brand span {
    font-size: 24px;
    color: #343C5C;
    white-space: nowrap;
}

/* rd-navbar-nav-wrap */
.page-header .rd-navbar-nav-wrap {
    display: flex;
    align-items: center;
	text-decoration: none;
	margin-top: 0;
    margin-left: 40px;
}

.page-header .rd-navbar-nav-wrap > * + * {
    margin-top: 0;
    margin-left: 40px;
}

/* 17. .toggle-original-elements - 无样式，JS用 */

/* 18. .rd-navbar-nav */
.page-header .rd-navbar-nav {
	list-style: none;
	margin: 0;
	padding: 0;
	display: flex;
	align-items: center;
}

/* 19. .rd-nav-item */
.page-header .rd-navbar-static .rd-nav-item {
    display: inline-block;
	position: relative;
}

.page-header .rd-navbar-static .rd-nav-item + .rd-nav-item {
    margin-left: 28px;
}

.page-header .rd-navbar-static .rd-nav-item.active .rd-nav-link {
    color: #343C5C;
    background: transparent;
}

.page-header .rd-navbar-static .rd-nav-item.active .rd-nav-link::before {
    width: 100%;
}

/* 20. .rd-nav-link */
.page-header .rd-navbar-static .rd-nav-link {
    position: relative;
    display: inline-block;
    font-size: 16px;
    font-weight: 600;
    transition: all 0.3s ease-in-out;
    line-height: 32px;
    color: #7B8095;
}

.page-header .rd-navbar-static .rd-nav-link:hover {
    color: #343C5C;
}

.page-header .rd-navbar-static .rd-nav-link:hover::before {
    width: 100%;
}

.page-header .rd-navbar-static .rd-nav-link::before {
    content: '';
    position: absolute;
    left: 0;
    bottom: 0;
    height: 3px;
    width: 0;
    background-color: #FF6229;
    transition: all 0.3s ease-in-out;
}

/* 21. .rd-navbar--has-dropdown */

/* 22. .rd-navbar-submenu */

/* 23. .rd-navbar-submenu-toggle */
.page-header .rd-navbar-static .rd-nav-item > .rd-navbar-submenu-toggle {
    margin-left: 4px;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 18px;
	height: 32px;
	vertical-align: middle;
	font-size: 0;
	color: #7B8095;
    cursor: pointer;
}

/* In case RDNavbar injects a duplicate toggle, keep only one */
.page-header .rd-navbar-static .rd-nav-item > .rd-navbar-submenu-toggle + .rd-navbar-submenu-toggle {
	display: none !important;
}

.page-header .rd-navbar-static .rd-nav-item > .rd-navbar-submenu-toggle::before {
	content: '';
	display: inline-block;
	width: 0;
	height: 0;
	border-left: 5px solid transparent;
	border-right: 5px solid transparent;
	border-top: 6px solid currentColor;
	transition: transform .22s ease, color .22s ease;
	transform-origin: 50% 50%;
	transform: translateY(1px);
}

/* 24. .rd-menu */
.page-header .rd-navbar-static .rd-menu {
    z-index: 15;
    position: absolute;
    display: block;
    margin-top: 22px;
    visibility: hidden;
    opacity: 0;
    text-align: left;
    border: 1px solid #EBEBEB;
    transform: translate3d(0, 30px, 0);
	transition: opacity .2s ease, transform .2s ease, visibility 0s linear .2s;
}

/* Dropdown open state (desktop hover + JS-driven open) */
.page-header .rd-navbar-static .rd-nav-item:hover > .rd-menu,
.page-header .rd-navbar-static .rd-nav-item.opened > .rd-menu,
.page-header .rd-navbar-static .rd-nav-item.focus > .rd-menu {
	visibility: visible;
	opacity: 1;
	transform: translate3d(0, 0, 0);
	transition-delay: 0s;
}

.page-header .rd-navbar-static .rd-nav-item:hover > .rd-navbar-submenu-toggle::before,
.page-header .rd-navbar-static .rd-nav-item.opened > .rd-navbar-submenu-toggle::before,
.page-header .rd-navbar-static .rd-nav-item.focus > .rd-navbar-submenu-toggle::before {
	transform: translateY(1px) rotate(180deg);
}

.page-header .rd-navbar-static .rd-nav-item:hover > .rd-navbar-submenu-toggle,
.page-header .rd-navbar-static .rd-nav-item.opened > .rd-navbar-submenu-toggle,
.page-header .rd-navbar-static .rd-nav-item.focus > .rd-navbar-submenu-toggle {
	color: #343C5C;
}

/* RD Navbar panel + toggle (mobile) */
.page-header .rd-navbar-panel {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 12px;
}

.page-header .rd-navbar-toggle {
	position: relative;
	width: 48px;
	height: 48px;
	background: transparent;
	border: 0;
	cursor: pointer;
}

.page-header .rd-navbar-toggle span,
.page-header .rd-navbar-toggle span::before,
.page-header .rd-navbar-toggle span::after {
	position: absolute;
	left: 12px;
	right: 12px;
	height: 2px;
	background: #343C5C;
	content: '';
	transition: transform .25s ease, top .25s ease, opacity .25s ease;
}

.page-header .rd-navbar-toggle span {
	top: 23px;
}

.page-header .rd-navbar-toggle span::before {
	top: -8px;
}

.page-header .rd-navbar-toggle span::after {
	top: 8px;
}

.page-header .rd-navbar-toggle.active span {
	opacity: 0;
}

.page-header .rd-navbar-toggle.active span::before {
	top: 0;
	transform: rotate(45deg);
}

.page-header .rd-navbar-toggle.active span::after {
	top: 0;
	transform: rotate(-45deg);
}

@media (max-width: 991.98px) {
	.page-header .rd-navbar-static .rd-navbar-main {
		padding: 12px 0;
	}

	.page-header .rd-navbar-static .rd-navbar-toggle {
		display: none;
	}

	.page-header .rd-navbar-static .rd-navbar-nav-wrap {
		position: static;
		top: auto;
		right: auto;
		bottom: auto;
		width: auto;
		padding: 0;
		background: transparent;
		box-shadow: none;
		transform: none;
		transition: none;
		z-index: auto;
		margin-left: 0;
	}

	.page-header .rd-navbar-static .rd-navbar-nav {
		display: flex;
		flex-direction: row;
		flex-wrap: wrap;
		gap: 14px 18px;
	}

	.page-header .rd-navbar-static .rd-nav-item {
		display: inline-block;
	}

	.page-header .rd-navbar-static .rd-nav-item + .rd-nav-item {
		margin-left: 0;
	}

	.page-header .rd-navbar-static .rd-nav-link {
		display: inline-flex;
		align-items: center;
		padding: 8px 0;
	}

	.page-header .rd-navbar-static .rd-menu {
		position: static;
		margin-top: 8px;
		border: 1px solid #EBEBEB;
		transform: none;
		opacity: 1;
		visibility: visible;
		display: none;
	}

	.page-header .rd-navbar-static .rd-nav-item.opened > .rd-menu,
	.page-header .rd-navbar-static .rd-nav-item.focus > .rd-menu {
		display: block;
	}

	.page-header .rd-navbar-static .rd-navbar-dropdown {
		width: 100%;
		padding: 12px;
	}
}

/* 25. .rd-navbar-dropdown */
.page-header .rd-navbar-static .rd-navbar-dropdown {
    position: absolute;
    left: 0;
    width: 270px;
    padding: 15px;
    background: #ffffff;
    z-index: 5;
	font-size: 14px;
}

/* 26. .rd-dropdown-item */

/* 27. .rd-dropdown-link (match demo Blog dropdown style) */
.page-header .rd-navbar-static .rd-navbar-dropdown .rd-dropdown-link {
	position: relative;
	left: -3px;
	display: flex;
	align-items: center;
	padding: 6px 14px 6px 0;
	text-align: left;
	color: #7B8095;
	transition: .15s ease-in-out;
}

.page-header .rd-navbar-static .rd-navbar-dropdown .rd-dropdown-link::before {
	position: relative;
	top: -1px;
	left: -6px;
	display: inline-block;
	content: '➤';
	font-size: inherit;
	line-height: inherit;
	color: #FF6229;
	opacity: 0;
	visibility: hidden;
	transition: .15s ease-in-out;
}

.page-header .rd-navbar-static .rd-dropdown-item.focus > .rd-dropdown-link,
.page-header .rd-navbar-static .rd-dropdown-item.opened > .rd-dropdown-link {
	color: #FF6229;
}

.page-header .rd-navbar-static .rd-dropdown-item:hover > .rd-dropdown-link,
.page-header .rd-navbar-static .rd-dropdown-item:focus-within > .rd-dropdown-link {
	left: 0;
	padding-left: 14px;
	padding-right: 0;
	color: #FF6229;
}

.page-header .rd-navbar-static .rd-dropdown-item:hover > .rd-dropdown-link::before,
.page-header .rd-navbar-static .rd-dropdown-item:focus-within > .rd-dropdown-link::before,
.page-header .rd-navbar-static .rd-dropdown-item.focus > .rd-dropdown-link::before,
.page-header .rd-navbar-static .rd-dropdown-item.opened > .rd-dropdown-link::before {
	left: -7px;
	opacity: 1;
	visibility: visible;
}

/* 28. .button */
.page-header .button {
    position: relative;
    overflow: hidden;
    display: inline-block;
    padding: 12px 30px;
    font-size: 16px;
    line-height: 1.25;
    font-weight: 700;
    white-space: nowrap;
    text-overflow: ellipsis;
    text-align: center;
    cursor: pointer;
    vertical-align: middle;
    user-select: none;
    transition: all 0.3s ease-in-out;
    border-radius: 5px;
    border: none;
}

/* 29. .button-primary-gradient */
.page-header .button-primary-gradient {
    color: #ffffff;
    background: linear-gradient(to right,#FF9060,#f04e12);
    box-shadow: 0px 4px 12px rgba(255, 98, 41, 0.4);
	transition: box-shadow .25s ease-in-out, background-color .25s ease-in-out, color .25s ease-in-out;
}

.page-header .button-primary-gradient::before {
    content: '';
    position: absolute;
    right: 0;
    top: 0;
    left: 0;
    bottom: 0;
	transform: translateY(0);
    background: linear-gradient(90deg, #FE5403 0%, #FF8500 100%);
    z-index: 0;
    border-radius: 5px;
	transition: background .25s ease-in-out, opacity .25s ease-in-out, transform .25s ease-in-out;
}

.page-header .button-primary-gradient:hover,
.page-header .button-primary-gradient:focus-visible {
	filter: brightness(1.05);
	color: #ffffff;
	box-shadow: 0px 4px 5px rgba(255, 98, 41, 0.4);
}

.page-header .button-primary-gradient.active {
	color: #ffffff;
	box-shadow: 0px 4px 5px rgba(255, 98, 41, 0.4);
}

.page-header .button-primary-gradient:hover::before,
.page-header .button-primary-gradient:focus-visible::before {
	background: #FF8052;
	filter: brightness(1.05);
}

.page-header .button-primary-gradient.active::before {
	background: #FF8052;
}

.page-header .button-primary-gradient span {
    position: relative;
}



/* ===================================
	03. Slider
=================================== */
.slider .carousel-caption {
	top: 0;
	bottom: auto;
	left: 0px;
	right: 0px;
	padding: 120px 0;
	z-index: 1;
	text-align: left;
	position: relative;
}
.slider .carousel-item:before {
	position: absolute;
	content: "";
	width: 100%;
	height: 100%;
	top: 0px;
	left: 0px;
	z-index: 0;
	background-color: rgba(0,0,0,0.2);
}
.slider .carousel-item {
	background-position: center center;
	-webkit-background-size: cover;
	background-size: cover;
	position: relative;
	background-image: url("../images/slider-blur.jpg"); /*edit image*/
}
.banner-img img {
	border-radius: 8px;
	border: 2px solid #08b5f9;
}
.slider .carousel-caption h4 {
	margin-bottom: 15px;
	font-size: 42px;
	color: #fff;
	position: relative;
	font-weight: normal;
	line-height: 65px;
}
.slider .carousel-caption h5 {
	margin-bottom: 15px;
	font-size: 60px;
	color: #fff;
	position: relative;
	font-weight: 600;
	line-height: 65px;
	font-family: 'Big Shoulders Display', cursive;
}
.slider .carousel-caption h6 {
	display: inline-block;
	font-size: 16px;
	font-weight: normal;
	color: #fff;
	margin-bottom: 10px;
}
.slider .carousel-caption p {
	color: #fff;
	font-style: italic;
}
.slider .carousel-control-next, .slider .carousel-control-prev {
	border-radius: 6px;
	color: #fff;
	text-align: center;
	background-color: rgba(0,0,0,0.6);
	font-size: 14px;
	top: 50%;
	width: 44px;
	height: 44px;
	line-height: 44px;
	bottom: auto;
	display: inline-block;
	transform: translateY(-50%);
}
.slider .carousel-control-next {
	right: 10px;
}
.slider .carousel-control-prev {
	left: 10px;
}


/*!
 * Bootstrap Extract for Carousel Slider
 * Based on Bootstrap v5.3.3
 * Includes: Reboot + Grid + Carousel
 */

/* ========== Container ========== */
.container, .container-fluid, .container-lg, .container-md, .container-sm, .container-xl, .container-xxl {
    --bs-gutter-x: 1.5rem;
    --bs-gutter-y: 0;
    width: 100%;
    padding-right: calc(var(--bs-gutter-x) * .5);
    padding-left: calc(var(--bs-gutter-x) * .5);
    margin-right: auto;
    margin-left: auto;
}

@media (min-width: 576px) {
    .container, .container-sm {
        max-width: 540px;
    }
}

@media (min-width: 768px) {
    .container, .container-md, .container-sm {
        max-width: 720px;
    }
}

@media (min-width: 992px) {
    .container, .container-lg, .container-md, .container-sm {
        max-width: 960px;
    }
}

@media (min-width: 1200px) {
    .container, .container-lg, .container-md, .container-sm, .container-xl {
        max-width: 1140px;
    }
}

@media (min-width: 1400px) {
    .container, .container-lg, .container-md, .container-sm, .container-xl, .container-xxl {
        max-width: 1320px;
    }
}

/* ========== Row ========== */
.row {
    --bs-gutter-x: 1.5rem;
    --bs-gutter-y: 0;
    display: flex;
    flex-wrap: wrap;
    margin-top: calc(-1 * var(--bs-gutter-y));
    margin-right: calc(-.5 * var(--bs-gutter-x));
    margin-left: calc(-.5 * var(--bs-gutter-x));
}

.row > * {
    flex-shrink: 0;
    width: 100%;
    max-width: 100%;
    padding-right: calc(var(--bs-gutter-x) * .5);
    padding-left: calc(var(--bs-gutter-x) * .5);
    margin-top: var(--bs-gutter-y);
}

/* ========== Columns ========== */
.col-12 {
	flex: 0 0 auto;
	width: 100%;
}

/* Extra grid helpers used by the footer markup */
.col-6 {
	flex: 0 0 auto;
	width: 50%;
}

/* Bootstrap-like breakpoint columns:
   - col-* applies to all widths
   - col-sm-* applies >=576px
   - col-md-* applies >=768px
   - col-lg-* applies >=992px */
@media (min-width: 576px) {
	.col-sm-4 {
		flex: 0 0 auto;
		width: 33.33333333%;
	}

	.col-sm-6 {
		flex: 0 0 auto;
		width: 50%;
	}

	.col-sm-8 {
		flex: 0 0 auto;
		width: 66.66666667%;
	}
}

.col-md-4,
.col-md-10 {
	flex: 0 0 auto;
	width: 100%;
}

@media (min-width: 768px) {
	.col-md-4 {
		width: 33.33333333%;
	}

	.col-md-10 {
		width: 83.33333333%;
	}
}

.col-md-6 {
	flex: 0 0 auto;
	width: 100%;
}

@media (min-width: 768px) {
	.col-md-6 {
		width: 50%;
	}
}

.col-lg-6 {
	flex: 0 0 auto;
	width: 100%;
}

.col-lg-4 {
	flex: 0 0 auto;
	width: 100%;
}

@media (min-width: 992px) {
	.col-lg-6 {
		width: 50%;
	}

	.col-lg-4 {
		width: 33.33333333%;
	}
}

/* ========== Offsets (subset used by markup) ========== */
.offset-md-1,
.offset-lg-3 {
	margin-left: 0;
}

@media (min-width: 768px) {
	.offset-md-1 {
		margin-left: 8.33333333%;
	}
}

@media (min-width: 992px) {
	.offset-lg-3 {
		margin-left: 25%;
	}
}

@media (min-width: 992px) {
	.col-lg-5 {
		flex: 0 0 auto;
		width: 41.66666667%;
	}

	.col-lg-2 {
		flex: 0 0 auto;
		width: 16.66666667%;
	}

	.col-lg-7 {
		flex: 0 0 auto;
		width: 58.33333333%;
	}

	.col-lg-12 {
		flex: 0 0 auto;
		width: 100%;
	}
}

/* Utility classes used by the demo markup */
.mb-30 {
	margin-bottom: 30px !important;
}

.pt-30 {
	padding-top: 30px !important;
}

.pb-30 {
	padding-bottom: 30px !important;
}

.text-white {
	color: #fff !important;
}

.text-left {
	text-align: left !important;
}

.text-center {
	text-align: center !important;
}

/* Ensure breakpoint columns override base cols (e.g. col-6) */
@media (min-width: 992px) {
	.col-lg-2 {
		flex: 0 0 auto;
		width: 16.66666667%;
	}
}

@media (min-width: 992px) {
	.col-lg-3 {
		flex: 0 0 auto;
		width: 25%;
	}

	/* Custom helper: 5 columns in one row (used by footer widgets) */
	.col-lg-20 {
		flex: 0 0 auto;
		width: 20%;
	}
}

/* ========== Alignment ========== */
.align-items-center {
    align-items: center !important;
}

.justify-content-center {
	justify-content: center !important;
}

.align-self-center {
	align-self: center !important;
}

.align-self-end {
	align-self: flex-end !important;
}

.position-relative {
	position: relative !important;
}

/* ========== Offsets (used by demo inner pages) ========== */
@media (min-width: 768px) {
	.offset-md-1 {
		margin-left: 8.33333333%;
	}
}

@media (min-width: 992px) {
	.offset-lg-3 {
		margin-left: 25%;
	}
}

/* ========== Carousel ========== */
.carousel {
    position: relative;
}

.carousel.pointer-event {
    touch-action: pan-y;
}

.carousel-inner {
    position: relative;
    width: 100%;
    overflow: hidden;
}

.carousel-inner::after {
    display: block;
    clear: both;
    content: "";
}

.carousel-item {
    position: relative;
    display: none;
    float: left;
    width: 100%;
    margin-right: -100%;
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
    transition: transform .6s ease-in-out;
}

@media (prefers-reduced-motion: reduce) {
    .carousel-item {
        transition: none;
    }
}

.carousel-item-next,
.carousel-item-prev,
.carousel-item.active {
    display: block;
}

.active.carousel-item-end,
.carousel-item-next:not(.carousel-item-start) {
    transform: translateX(100%);
}

.active.carousel-item-start,
.carousel-item-prev:not(.carousel-item-end) {
    transform: translateX(-100%);
}

/* Carousel Fade */
.carousel-fade .carousel-item {
    opacity: 0;
    transition-property: opacity;
    transform: none;
}

.carousel-fade .carousel-item-next.carousel-item-start,
.carousel-fade .carousel-item-prev.carousel-item-end,
.carousel-fade .carousel-item.active {
    z-index: 1;
    opacity: 1;
}

.carousel-fade .active.carousel-item-end,
.carousel-fade .active.carousel-item-start {
    z-index: 0;
    opacity: 0;
    transition: opacity 0s .6s;
}

@media (prefers-reduced-motion: reduce) {
    .carousel-fade .active.carousel-item-end,
    .carousel-fade .active.carousel-item-start {
        transition: none;
    }
}

/* ========== Carousel Controls ========== */
.carousel-control-prev,
.carousel-control-next {
    position: absolute;
    top: 0;
    bottom: 0;
    z-index: 1;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 15%;
    padding: 0;
    color: #fff;
    text-align: center;
    background: 0 0;
    border: 0;
    opacity: 0.5;
    transition: opacity 0.15s ease;
}

@media (prefers-reduced-motion: reduce) {
    .carousel-control-prev,
    .carousel-control-next {
        transition: none;
    }
}

.carousel-control-prev:hover,
.carousel-control-prev:focus,
.carousel-control-next:hover,
.carousel-control-next:focus {
    color: #fff;
    text-decoration: none;
    outline: 0;
    opacity: 0.9;
}

.carousel-control-prev {
    left: 0;
}

.carousel-control-next {
    right: 0;
}

/* Carousel Control Icons（可选，如果使用Bootstrap默认图标） */
.carousel-control-prev-icon,
.carousel-control-next-icon {
    display: inline-block;
    width: 2rem;
    height: 2rem;
    background-repeat: no-repeat;
    background-position: 50%;
    background-size: 100% 100%;
}

.carousel-control-prev-icon {
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23fff'%3e%3cpath d='M11.354 1.646a.5.5 0 0 1 0 .708L5.707 8l5.647 5.646a.5.5 0 0 1-.708.708l-6-6a.5.5 0 0 1 0-.708l6-6a.5.5 0 0 1 .708 0z'/%3e%3c/svg%3e");
}

.carousel-control-next-icon {
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23fff'%3e%3cpath d='M4.646 1.646a.5.5 0 0 1 .708 0l6 6a.5.5 0 0 1 0 .708l-6 6a.5.5 0 0 1-.708-.708L10.293 8 4.646 2.354a.5.5 0 0 1 0-.708z'/%3e%3c/svg%3e");
}

/* ========== Carousel Caption ========== */
.carousel-caption {
    position: absolute;
    right: 15%;
    bottom: 1.25rem;
    left: 15%;
    padding-top: 1.25rem;
    padding-bottom: 1.25rem;
    color: #fff;
    text-align: center;
}


/* ===== 完美匹配的左右箭头（旋转方案） ===== */

/* ===== Bootstrap Icons 简化版（无需字体文件）===== */

/* 基础 <i> 标签样式 */
.bi-arrow-left,
.bi-arrow-right {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 40px;
  height: 40px;
  font-size: 1.2em;
  font-style: normal;        /* 覆盖默认斜体 */
  line-height: 1;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

/* 左箭头 */
.bi-arrow-left::before {
  content: "➤";
  transform: rotate(180deg);
}

/* 右箭头 */
.bi-arrow-right::before {
  content: "➤";
}



/* ===================================
	04. Counter area
=================================== */
.counter-area .row .col {
	border-right: 1px solid rgba(0,0,0,0.1);
	background: rgb(232,232,232); /* Old browsers */
	background: -moz-linear-gradient(left, rgba(232,232,232,1) 2%, rgba(245,245,245,1) 100%); /* FF3.6-15 */
	background: -webkit-linear-gradient(left, rgba(232,232,232,1) 2%, rgba(245,245,245,1) 100%); /* Chrome10-25,Safari5.1-6 */
	background: linear-gradient(to right, rgba(232,232,232,1) 2%, rgba(245,245,245,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
 filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#e8e8e8', endColorstr='#f5f5f5', GradientType=1 ); /* IE6-9 */
}
.counter-c {
	position: relative;
	border: 1px solid rgba(0,0,0,0.1);
	border-radius: 6px;
	overflow: hidden;
}
.counter-box {
	text-align: center;
	position: relative;
	padding: 50px 20px;
}
.counter-box h3 {
	font-size: 28px;
	color: #000;
	padding-bottom: 6px;
	font-weight: 600;
	font-family: 'Big Shoulders Display', cursive;
}
.counter-box span {
	color: #08b5f9;
	font-size: 24px;
	font-weight: 600;
}
/* ===================================
	05. About area
=================================== */
.about-text h4 {
	color: #08b5f9;
	display: inline-block;
	font-style: italic;
	font-size: 12px;
	font-weight: 600;
	text-transform: uppercase;
	margin-bottom: 15px;
}
.about-text h2 {
	font-size: 55px;
	line-height: 65px;
	font-weight: 700;
	color: #000;
	font-family: 'Big Shoulders Display', cursive;
}
.about-img {
	border-radius: 6px;
	overflow: hidden;
	position: relative;
	display: inline-block;
	z-index: 1;
}
.experience-div {
	position: absolute;
	top: 22px;
	right: 32px;
	background-color: #08b5f9;
	text-align: center;
	padding: 15px;
	z-index: 2;
	border-radius: 6px;
}
.experience-div strong {
	color: #fff;
	font-size: 50px;
	line-height: 55px;
	margin-bottom: 10px;
	display: inline-block;
}
.experience-div p {
	color: #fff;
	font-size: 15px;
	line-height: 20px;
	font-weight: 600;
}
.about-text ul li {
	margin-bottom: 12px;
	color: #333;
	font-size: 14px;
	text-transform: capitalize;
}
.about-text ul li:last-child {
	margin-bottom: 0px;
}
.about-text ul li i {
	font-size: 14px;
	color: #08b5f9;
	padding-right: 4px;
}

/* ===== About Us Section (ct-about-us-section5) ===== */
.section-padding-2 {
	padding: 90px 0;
}

/* ===== Utility (template spacing helpers) ===== */
.pt-160 {
	padding-top: 160px;
}

.pb-160 {
	padding-bottom: 160px;
}

.mb-50 {
	margin-bottom: 50px;
}

.mb-45 {
	margin-bottom: 45px;
}

.mb-25 {
	margin-bottom: 25px;
}

.mb-20 {
	margin-bottom: 20px;
}

.col-pl-0 {
	padding-left: 0;
}

@media (min-width: 992px) {
	.pl-20-992 {
		padding-left: 20px;
	}
}

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


.section-white-bg {
	background-color: #fff;
}


@media (max-width: 991.98px) {
	.pt-160 {
		padding-top: 110px;
	}
	.pb-160 {
		padding-bottom: 110px;
	}
}

@media (max-width: 991.98px) {
	.section-padding-2 {
		padding: 60px 0;
	}
}

.ct-section-title {
	margin-bottom: 30px;
}

/* Home-only title style (used in ct-about-us-section5). */
.ct-about-us-section5 .ct-section-title h4.style-1 {
	display: inline-block;
	font-size: 28px;
	font-weight: 700;
	letter-spacing: .08em;
	text-transform: uppercase;
	color: var(--bs-primary);
	margin-bottom: 12px;
}

.ct-about-us-section5 {
	position: relative;
	background: #ffffff;
}

.ct-about-us-section5 .ct-section-title h2 {
	font-size: 28px;
	margin-bottom: 15px;
	font-weight: 400;
	line-height: 44px;
}

@media (max-width: 991.98px) {
	.ct-about-us-section5 .ct-section-title h2 {
		font-size: 24px;
		line-height: 34px;
	}
}

.ct-about-us-section5 .image-1,
.ct-about-us-section5 .content .image-2 {
	overflow: hidden;
	border-radius: 10px;
}

.ct-about-us-section5 .image-1 img,
.ct-about-us-section5 .content .image-2 img {
	display: block;
	width: 100%;
	height: auto;
}

.ct-about-us-section5 .content .image-2 {
	margin-top: 10px;
}

.ct-about-us-section5 .content p.text {
	font-size: 18px;
	line-height: 32px;
	margin-bottom: 25px;
	color: #333;
}

@media (max-width: 991.98px) {
	.ct-about-us-section5 .content p.text {
		font-size: 16px;
		line-height: 28px;
	}
}

.ct-about-us-section5 .content .ab-info {
	display: flex;
	align-items: flex-start;
	gap: 15px;
}

.ct-about-us-section5 .content .ab-info .icon {
	width: 60px;
	height: 60px;
	flex: 0 0 60px;
	display: flex;
	justify-content: center;
	align-items: center;
	background: rgba(13, 110, 253, 0.18);
	font-size: 22px;
	color: var(--bs-primary);
	border-radius: 6px;
}

.ct-about-us-section5 .content .ab-info .info {
	overflow: hidden;
}

.ct-about-us-section5 .content .ab-info .info h4 {
	font-size: 20px;
	margin-bottom: 4px;
}

.ct-about-us-section5 .content .ab-info .info p {
	font-size: 16px;
	margin-top: 2px;
	display: inline-block;
}

.ct-about-us-section5 .content .ab-info:hover .icon {
	background: var(--bs-primary);
	color: #ffffff;
}

.ct-about-us-section5 .content .ab-info .icon i {
	transform: rotate(0);
	transition: transform .3s ease-out;
}

.ct-about-us-section5 .content .ab-info:hover .icon i {
	transform: rotate(360deg);
}

/* ===== Section Title (demo: main.css) ===== */
.ct-section-title h4 {
	position: relative;
	font-size: 18px;
	font-weight: 600;
	letter-spacing: 0px;
	display: inline-block;
	padding: 0px 80px;
	margin-bottom: 15px;
	color: rgb(0, 71, 157);
}

.ct-section-title h4:after {
	content: "";
	clear: both;
	display: block;
	position: absolute;
	width: 70px;
	height: 3px;
	background: rgb(0, 71, 157);
	top: calc(50% - 1.5px);
	left: 0;
}

.ct-section-title h4:before {
	content: "";
	clear: both;
	display: block;
	position: absolute;
	width: 70px;
	height: 3px;
	background: rgb(0, 71, 157);
	top: calc(50% - 1.5px);
	right: 0;
}

.ct-section-title.text-left h4 {
	padding-left: 0;
}

.ct-section-title.text-left h4:after {
	display: none;
}

.ct-section-title h2 {
	font-size: 42px;
	margin-bottom: 15px;
}

.ct-section-title h2 span {
	color: var(--primary-color);
	position: relative;
	z-index: 1;
}

.ct-section-title p {
	font-size: 16px;
	font-weight: 500;
}

.button-1 {
	display: inline-flex;
	align-items: center;
	gap: 10px;
	padding: 14px 20px;
	border-radius: 999px;
	border: 0;
	background: var(--bs-primary);
	color: #ffffff;
	text-decoration: none;
	cursor: pointer;
	font-weight: normal;
	letter-spacing: .02em;
	box-shadow: 0 14px 30px rgba(13, 110, 253, 0.25);
	transition: transform .18s ease, box-shadow .18s ease, background .18s ease;
}

.button-1 svg {
	width: 18px;
	height: 18px;
	display: block;
}

.button-1:hover {
	transform: translateY(-1px);
	box-shadow: 0 18px 40px rgba(13, 110, 253, 0.30);
}



/* ===== Work Process (ct-workin-progress) ===== */
.ct-workin-progress {
	position: relative;
}


.ct-workin-progress .process-line {
	position: absolute;
	left: 0;
	bottom: 50px;
	width: 100%;
	text-align: center;
}


.ct-workin-progress .process-line img {
	width: 100%;
}


@media (max-width:991px) {
	.ct-workin-progress .process-line {
		display: none;
	}
}

.work-in-progress-card {
	position: relative;
	box-shadow: 0px 10px 15px rgb(8 14 28 / 1%);
	border-radius: 5px;
	/* background-color: var(--white-bg); */
	text-align: center;
	padding: 30px 20px;
	max-width: 230px;
	margin-left: auto;
	margin-right: auto;
	height: 100%;
	border: 1px solid var(--ct-border-color);
}

.work-in-progress-card:hover {
	border-color: var(--primary-color);
}

.work-in-progress-card .card-num {
	height: 60px;
	width: 60px;
	line-height: 60px;
	background-color: var(--primary-color);
	border-radius: 50%;
	text-align: center;
	position: absolute;
	top: -30px;
	left: -30px;
	z-index: 2;
	font-size: 26px;
	font-weight: 700;
	color: var(--white-color);
	transition: 0.5s;
	-webkit-animation: ripple-blue-18 1s linear infinite;
	animation: ripple-blue-18 1s linear infinite;
}

.work-in-progress-card .icon {
	margin-bottom: 20px;
	font-size: 38px;
	line-height: 1;
	color: var(--primary-color);
}

.work-in-progress-card .icon p{
	font-size: 14px;
	color: #000000;
	margin: 0;
	line-height: normal;
}

.work-in-progress-card .icon svg {
	width: 40px;
	fill: var(--primary-color);
}

.work-in-progress-card .icon img {
	width: 140px;
	height: auto;
}

.work-in-progress-card .content h3 {
	font-size: 22px;
	font-weight: 700;
	margin-bottom: 10px;
}

.work-in-progress-card .content p {
	margin: 0;
}

@-webkit-keyframes ripple-blue-18 {
	0% {
		-webkit-box-shadow: 0 0 0 0 rgba(54, 48, 255, 0.3), 0 0 0 6px rgba(54, 48, 255, 0.3),
			0 0 0 12px rgba(54, 48, 255, 0.3);
		box-shadow: 0 0 0 0 rgba(54, 48, 255, 0.3), 0 0 0 6px rgba(54, 48, 255, 0.3), 0 0 0 12px rgba(54, 48, 255, 0.3);
	}

	100% {
		-webkit-box-shadow: 0 0 0 6px rgba(54, 48, 255, 0.3), 0 0 0 12px rgba(54, 48, 255, 0.3),
			0 0 0 18px rgba(54, 48, 255, 0);
		box-shadow: 0 0 0 6px rgba(54, 48, 255, 0.3), 0 0 0 12px rgba(54, 48, 255, 0.3), 0 0 0 18px rgba(54, 48, 255, 0);
	}
}

@keyframes ripple-blue-18 {
	0% {
		box-shadow: 0 0 0 0 rgba(54, 48, 255, 0.3), 0 0 0 6px rgba(54, 48, 255, 0.3), 0 0 0 12px rgba(54, 48, 255, 0.3);
	}

	100% {
		box-shadow: 0 0 0 6px rgba(54, 48, 255, 0.3), 0 0 0 12px rgba(54, 48, 255, 0.3), 0 0 0 18px rgba(54, 48, 255, 0);
	}
}

/* ===== Client Logo ===== */
.ct-client-logo-section {
	padding: 80px 0px 40px 0px;
}

.ct-client-logo-section .row {
	--bs-gutter-y: 0;
}

.ct-client-logo-section .ct-l-text p {
	margin: 0;
	color: var(--headding-color);
	font-weight: 500;
	font-size: 28px;
	font-family: var(--headding-font);
}

.ct-client-logo-section .ct-l-text p span {
	color: var(--primary-color);
}

.single-logo-item2 {
	border-radius: 4px;
	background-color: #efefff;
	padding: 14px 14px 14px 14px;
	height: 100%;
	display: flex;
	align-items: center;
	justify-content: center;
}

/* ===== Image slide/reveal expand (match demo) ===== */
.wow {
	will-change: transform, clip-path, opacity;
}

/* ===== WOW basic fades (no external animate.css) ===== */
.wow.fadeInUp,
.wow.fadeInRight,
.wow.fadeInLeft {
	opacity: 1;
	transform: none;
}

html.js.reveal .wow.fadeInUp:not(.is-inview),
html.js.reveal .wow.fadeInRight:not(.is-inview),
html.js.reveal .wow.fadeInLeft:not(.is-inview) {
	opacity: 0;
	animation: none;
}

html.js.reveal .wow.fadeInUp:not(.is-inview) {
	transform: translateY(18px);
}

html.js.reveal .wow.fadeInRight:not(.is-inview) {
	transform: translateX(18px);
}

html.js.reveal .wow.fadeInLeft:not(.is-inview) {
	transform: translateX(-18px);
}

html.js.reveal .wow.fadeInUp.is-inview,
.wow.fadeInUp.is-inview {
	animation: wow-fade-in-up 900ms cubic-bezier(0.22, 1, 0.36, 1) forwards;
	animation-fill-mode: both;
	opacity: 1;
}

html.js.reveal .wow.fadeInRight.is-inview,
.wow.fadeInRight.is-inview {
	animation: wow-fade-in-right 900ms cubic-bezier(0.22, 1, 0.36, 1) forwards;
	animation-fill-mode: both;
	opacity: 1;
}

html.js.reveal .wow.fadeInLeft.is-inview,
.wow.fadeInLeft.is-inview {
	animation: wow-fade-in-left 900ms cubic-bezier(0.22, 1, 0.36, 1) forwards;
	animation-fill-mode: both;
	opacity: 1;
}

/* Reduced motion: never keep content hidden */
@media (prefers-reduced-motion: reduce) {
	html.js.reveal .wow.fadeInUp,
	html.js.reveal .wow.fadeInRight,
	html.js.reveal .wow.fadeInLeft {
		opacity: 1;
		transform: none;
		animation: none;
	}

	html.js.reveal [data-cues="slideInUp"] > * {
		opacity: 1;
		transform: none;
		transition: none;
	}
}

@keyframes wow-fade-in-up {
	from {
		opacity: 0;
		transform: translateY(18px);
	}
	to {
		opacity: 1;
		transform: translateY(0);
	}
}

@keyframes wow-fade-in-right {
	from {
		opacity: 0;
		transform: translateX(18px);
	}
	to {
		opacity: 1;
		transform: translateX(0);
	}
}

@keyframes wow-fade-in-left {
	from {
		opacity: 0;
		transform: translateX(-18px);
	}
	to {
		opacity: 1;
		transform: translateX(0);
	}
}

/* ITGen demo animate.css (subset) */
@-webkit-keyframes fadeInLeft {
	0% {
		opacity: 0;
		-webkit-transform: translateX(-20px);
		transform: translateX(-20px);
	}
	100% {
		opacity: 1;
		-webkit-transform: translateX(0);
		transform: translateX(0);
	}
}

@keyframes fadeInLeft {
	0% {
		opacity: 0;
		-webkit-transform: translateX(-20px);
		-ms-transform: translateX(-20px);
		transform: translateX(-20px);
	}
	100% {
		opacity: 1;
		-webkit-transform: translateX(0);
		-ms-transform: translateX(0);
		transform: translateX(0);
	}
}

@-webkit-keyframes fadeInRight {
	0% {
		opacity: 0;
		-webkit-transform: translateX(20px);
		transform: translateX(20px);
	}
	100% {
		opacity: 1;
		-webkit-transform: translateX(0);
		transform: translateX(0);
	}
}

@keyframes fadeInRight {
	0% {
		opacity: 0;
		-webkit-transform: translateX(20px);
		-ms-transform: translateX(20px);
		transform: translateX(20px);
	}
	100% {
		opacity: 1;
		-webkit-transform: translateX(0);
		-ms-transform: translateX(0);
		transform: translateX(0);
	}
}

/* ===== Cues (match demo data-cues="slideInUp") ===== */
html.js.reveal [data-cues="slideInUp"] > * {
	opacity: 0;
	transform: translateY(18px);
	will-change: transform, opacity;
	transition-property: transform, opacity;
	transition-duration: var(--cues-duration, 650ms);
	transition-timing-function: cubic-bezier(0.22, 1, 0.36, 1);
	transition-delay: var(--cues-delay, 0ms);
}

html.js.reveal [data-cues="slideInUp"].cues-inview > * {
	opacity: 1;
	transform: translateY(0);
}

/* ===== Single cue (match demo data-cue="slideInUp") ===== */
html.js.reveal [data-cue="slideInUp"] {
	opacity: 0;
	transform: translateY(18px);
	will-change: transform, opacity;
	transition-property: transform, opacity;
	transition-duration: var(--cues-duration, 650ms);
	transition-timing-function: cubic-bezier(0.22, 1, 0.36, 1);
	transition-delay: var(--cues-delay, 0ms);
}

html.js.reveal [data-cue="slideInUp"].cue-inview {
	opacity: 1;
	transform: translateY(0);
}

/* No-JS fallback: keep media visible */
.wow.img-custom-anim-left,
.wow.img-custom-anim-right,
.wow.img-custom-anim-top {
	opacity: 1;
	transform: none;
	clip-path: inset(0 0 0 0);
}

/* JS enabled: hide until in-view, then animate reveal */
html.js.reveal .wow.img-custom-anim-left,
html.js.reveal .wow.img-custom-anim-right,
html.js.reveal .wow.img-custom-anim-top {
	opacity: 0;
}

html.js.reveal .wow.img-custom-anim-left {
	transform: translateX(-5%);
	clip-path: inset(0 100% 0 0);
}

html.js.reveal .wow.img-custom-anim-right {
	transform: translateX(5%);
	clip-path: inset(0 0 0 100%);
}

html.js.reveal .wow.img-custom-anim-top {
	transform: translateY(-5%);
	clip-path: inset(0 0 100% 0);
}

.wow.img-custom-anim-left.is-inview {
	animation: img-anim-left 1.3s forwards cubic-bezier(0.645, 0.045, 0.355, 1) 0.4s;
}

.wow.img-custom-anim-right.is-inview {
	animation: img-anim-right 1.3s forwards cubic-bezier(0.645, 0.045, 0.355, 1) 0.4s;
}

.wow.img-custom-anim-top.is-inview {
	animation: img-anim-top 1.3s forwards cubic-bezier(0.645, 0.045, 0.355, 1) 0.2s;
}

@keyframes img-anim-left {
	0% {
		transform: translateX(-5%);
		clip-path: inset(0 100% 0 0);
		opacity: 0;
	}
	100% {
		transform: translateX(0);
		clip-path: inset(0 0 0 0);
		opacity: 1;
	}
}

@keyframes img-anim-right {
	0% {
		transform: translateX(5%);
		clip-path: inset(0 0 0 100%);
		opacity: 0;
	}
	100% {
		transform: translateX(0);
		clip-path: inset(0 0 0 0);
		opacity: 1;
	}
}

@keyframes img-anim-top {
	0% {
		transform: translateY(-5%);
		clip-path: inset(0 0 100% 0);
		opacity: 0;
	}
	100% {
		transform: translateY(0);
		clip-path: inset(0 0 0 0);
		opacity: 1;
	}
}

@media (prefers-reduced-motion: reduce) {
	.wow.img-custom-anim-left,
	.wow.img-custom-anim-right,
	.wow.img-custom-anim-top {
		opacity: 1;
		transform: none;
		clip-path: inset(0 0 0 0);
		animation: none !important;
	}

	.wow.fadeInUp,
	.wow.fadeInRight,
	.wow.fadeInLeft {
		opacity: 1;
		transform: none;
		animation: none !important;
	}
}
/* ===================================
	06. Services area
=================================== */
.service-box .caption {
	border: 1px solid rgba(0,0,0,0.2);
	padding: 15px;
	border-radius: 6px;
}
.service-box .image {
	position: relative;
	overflow: hidden;
	margin-bottom: 10px;
}
.service-box .image:before {
	content: "";
	width: calc(100% - 20px);
	height: calc(100% - 20px);
	border: 1px solid #08b5f9;
	position: absolute;
	left: 10px;
	top: 10px;
	z-index: 2;
	opacity: 0;
	border-radius: 6px;
	-webkit-transition: all 0.3s ease-in-out;
	-moz-transition: all 0.3s ease-in-out;
	-o-transition: all 0.3s ease-in-out;
	transition: all 0.3s ease-in-out;
}
.service-box .image:after {
	position: absolute;
	content: "";
	background-color: rgba(0, 0, 0, 0.5);
	width: 100%;
	height: 100%;
	top: 0px;
	left: 0px;
	z-index: 0;
	border-radius: 6px;
	opacity: 0;
	-webkit-transition: all 0.3s ease-in-out;
	-moz-transition: all 0.3s ease-in-out;
	-o-transition: all 0.3s ease-in-out;
	transition: all 0.3s ease-in-out;
}
.service-box:hover .image:after, .service-box:hover .image:before {
	opacity: 1;
}
.service-box .image .btn-style-1 {
	position: absolute;
	top: 10px;
	right: 10px;
	z-index: 2;
	-webkit-transition: all 0.3s ease-in-out;
	-moz-transition: all 0.3s ease-in-out;
	-o-transition: all 0.3s ease-in-out;
	transition: all 0.3s ease-in-out;
}
.service-box .image img {
	position: relative;
	border-radius: 6px;
	width: 100%;
	display: block;
	-webkit-transition: all 0.3s ease-in-out;
	-moz-transition: all 0.3s ease-in-out;
	-o-transition: all 0.3s ease-in-out;
	transition: all 0.3s ease-in-out;
}
.service-box h4 {
	font-weight: 500;
	margin-bottom: 8px;
	font-size: 26px;
	letter-spacing: 1px;
	font-family: 'Big Shoulders Display', cursive;
	border-bottom: 1px dashed rgba(0,0,0,0.2);
	padding-bottom: 8px;
}
.service-box h4 a {
	color: #000;
	-webkit-transition: all 0.3s ease-in-out;
	-moz-transition: all 0.3s ease-in-out;
	-o-transition: all 0.3s ease-in-out;
	transition: all 0.3s ease-in-out;
}
.service-box h4 a:hover {
	color: #08b5f9;
}
.service-box p {
	margin-bottom: 0px;
}
/* single service content */
.single-service-img img {
	border-radius: 6px;
}
.single-service-content h3 {
	position: relative;
	color: #08b5f9;
	font-weight: 600;
	font-size: 34px;
	font-family: 'Big Shoulders Display', cursive;
}
.single-service-content .p-quote {
	font-size: 30px;
	line-height: 70px;
	height: 70px;
	width: 70px;
	display: inline-block;
	border: 1px solid #08b5f9;
	text-align: center;
	border-radius: 100%;
	float: left;
	margin: 8px 20px 10px 0px;
	box-shadow: 0px 16px 32px 0px rgba(0, 0, 0, 0.06);
}
/* s-sidebar-widget */
.s-sidebar-widget {
	background-image: url(../img/bg/sidebar-bg.jpg);
	border: 1px solid rgba(0,0,0,0.2);
	border-radius: 6px;
	padding: 20px;
	position: relative;
}
.s-sidebar-widget:after {
	position: absolute;
	content: "";
	width: 2px;
	height: 80%;
	background-color: #08b5f9;
	top: 50%;
	left: 0px;
	transform: translateY(-50%);
}
.s-sidebar-widget:before {
	position: absolute;
	content: "";
	width: 2px;
	height: 80%;
	background-color: #08b5f9;
	top: 50%;
	right: 0px;
	transform: translateY(-50%);
}
/* s-sidebar-widget title */
.s-sidebar-widget h3 {
	font-weight: 500;
	font-size: 24px;
	margin-bottom: 20px;
	font-family: 'Big Shoulders Display', cursive;
}
/* service sidebar link */
.service-sidebar-link li a {
	color: #000;
	text-decoration: none;
	padding: 0px 10px 0px 15px;
	height: 50px;
	background-color: #fff;
	line-height: 50px;
	font-size: 12px;
	border-top: 1px solid rgba(0,0,0,0.1);
	border-left: 1px solid rgba(0,0,0,0.1);
	border-right: 1px solid rgba(0,0,0,0.1);
	position: relative;
	width: 100%;
	align-items: center;
	display: flex;
	-webkit-transition: all 0.3s ease-in-out;
	-moz-transition: all 0.3s ease-in-out;
	-o-transition: all 0.3s ease-in-out;
	transition: all 0.3s ease-in-out;
}
.service-sidebar-link li.active a, .service-sidebar-link li a:hover {
	background-color: #fff;
	padding-left: 30px;
	color: #08b5f9;
	border-right: 2px solid #08b5f9;
}
.service-sidebar-link li:last-child a {
	border-bottom: 1px solid rgba(0,0,0,0.1);
}
.service-sidebar-link li a i {
	opacity: 0;
	padding-left: 10px;
	padding-top: 3px;
	-webkit-transition: all 0.3s ease-in-out;
	-moz-transition: all 0.3s ease-in-out;
	-o-transition: all 0.3s ease-in-out;
	transition: all 0.3s ease-in-out;
}
.service-sidebar-link li a:hover i, .service-sidebar-link li.active a i {
	opacity: 1;
}
/* sidebar contcat */
.sidebar-contcat {
	position: relative;
}
.sidebar-contcat form input {
	height: 50px;
	border: 0px;
	border-radius: 6px;
	font-size: 12px;
	color: #000;
	border: 1px solid rgba(0,0,0,0.1);
}
.sidebar-contcat form textarea {
	border: 0px;
	border-radius: 6px;
	color: #000;
	font-size: 12px;
	border: 1px solid rgba(0,0,0,0.1);
}
/* download brochures widget */
.download-brochure-bg {
	position: relative;
}
.download-brochure-bg h3 {
	color: #fff;
}
/* call us widget */
.call-us-widget {
	position: relative;
}
.call-us-widget ul li {
	padding-bottom: 6px;
	font-size: 14px;
	color: #000;
	font-style: italic;
}
.call-us-widget ul li.call {
	font-size: 20px;
	color: #08b5f9;
	font-weight: 600;
	font-style: normal;
}
.call-us-widget ul li:last-child {
	padding-bottom: 0px;
}
/* tab box */
.tab-box .nav-pills {
	margin-bottom: 0px;
}
.tab-box .nav-pills .nav-link {
	border: 1px solid #08b5f9;
	margin-right: 2px;
	color: #000;
	font-size: 12px;
	border-radius: 0px;
	font-weight: 600;
}
.tab-box .nav-pills .nav-item:last-child .nav-link {
	margin-right: 0px;
}
.tab-box .nav-pills .nav-link.active {
	background-color: #08b5f9;
	color: #fff;
}
.tab-box .tab-content .tab-pane {
	background-color: #e1f4fb;
	padding: 20px;
}
.tab-box .tab-content .tab-pane p {
	margin-bottom: 0px;
	color: #000;
}
/* ===================================
	07. Call to action
=================================== */
.call-to-action-area {
	z-index: 0;
	position: relative;
	background-image: url(../img/bg/call-to-action-bg.jpg);
	background-repeat: no-repeat;
	background-size: cover;
	background-position: top center;
}
.call-to-action-area:after {
	position: absolute;
	content: "";
	background-color: rgba(8,181,249,0.8);
	width: 100%;
	height: 100%;
	top: 0px;
	left: 0px;
	z-index: -1;
}
.cta-text {
	text-align: center;
}
.cta-text h2 {
	text-transform: capitalize;
	font-size: 50px;
	color: #fff;
	font-weight: 700;
	margin-bottom: 10px;
	letter-spacing: 1px;
	font-family: 'Big Shoulders Display', cursive;
	text-shadow: 1px 2px 1px rgba(0, 0, 0, 0.8);
}
.cta-text p {
	font-style: italic;
	font-size: 16px;
	line-height: 26px;
	color: #fff;
}
/* ===================================
	08. Portfolio
=================================== */
.portfolio-box {
	position: relative;
	overflow: hidden;
	border-radius: 6px;
	border: 1px solid rgba(0,0,0,0.1);
	-webkit-transition: all 0.3s ease-in-out;
	-moz-transition: all 0.3s ease-in-out;
	-o-transition: all 0.3s ease-in-out;
	transition: all 0.3s ease-in-out;
}
.portfolio-box:hover {
	border: 1px solid #08b5f9;
}
.portfolio-box .portfolio-box-img {
	position: relative;
	overflow: hidden;
	background-color: #f2efef;
}
.portfolio-box .portfolio-box-img:after {
	position: absolute;
	content: "";
	width: 100%;
	height: 100%;
	z-index: 0;
	top: 0px;
	left: 0px;
	/* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#08b5f9+0,7db9e8+99&0.8+0,0+50 */
	background: -moz-linear-gradient(top, rgba(8,181,249,0.8) 0%, rgba(67,183,240,0) 50%, rgba(125,185,232,0) 99%); /* FF3.6-15 */
	background: -webkit-linear-gradient(top, rgba(8,181,249,0.8) 0%, rgba(67,183,240,0) 50%, rgba(125,185,232,0) 99%); /* Chrome10-25,Safari5.1-6 */
	background: linear-gradient(to bottom, rgba(8,181,249,0.8) 0%, rgba(67,183,240,0) 50%, rgba(125,185,232,0) 99%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#cc08b5f9', endColorstr='#007db9e8', GradientType=0 ); /* IE6-9 */
	-webkit-transition: all 0.3s ease-in-out;
	-moz-transition: all 0.3s ease-in-out;
	-o-transition: all 0.3s ease-in-out;
	transition: all 0.3s ease-in-out;
}
.portfolio-box:hover .portfolio-box-img:after {
	background-color: rgba(0,0,0,0.2);
}
.portfolio-box .des {
	position: absolute;
	top: 15px;
	left: 15px;
	z-index: 5;
}
.portfolio-box .portfolio-box-img .readmore {
	color: #fff;
	font-size: 30px;
	position: absolute;
	left: 0px;
	top: 50%;
	opacity: 0;
	right: 0;
	transform: translateY(-50%);
	z-index: 3;
	text-align: center;
	-webkit-transition: all 0.3s ease-in-out;
	-moz-transition: all 0.3s ease-in-out;
	-o-transition: all 0.3s ease-in-out;
	transition: all 0.3s ease-in-out;
}
.portfolio-box:hover .readmore {
	opacity: 1;
}
.portfolio-box h5 {
	color: #fff;
	font-size: 20px;
	font-weight: 500;
	font-family: 'Big Shoulders Display', cursive;
	text-transform: capitalize;
	text-shadow: 1px 2px 1px rgba(0, 0, 0, 0.6);
	-webkit-transition: all 0.3s ease-in-out;
	-moz-transition: all 0.3s ease-in-out;
	-o-transition: all 0.3s ease-in-out;
	transition: all 0.3s ease-in-out;
}
/* portfolio single title */
.portfolio-single-title {
	position: relative;
	color: #08b5f9;
	font-weight: 600;
	font-size: 34px;
	font-family: 'Big Shoulders Display', cursive;
}
/* portfolio img */
.portfolio-single-img img {
	border-radius: 6px;
}
/* project info */
.project-info {
	background-image: url(../img/bg/sidebar-bg.jpg);
	border: 1px solid rgba(0,0,0,0.2);
	border-radius: 6px;
	padding: 20px 30px;
	position: relative;
}
.project-info:after {
	position: absolute;
	content: "";
	width: 2px;
	height: 80%;
	background-color: #08b5f9;
	top: 50%;
	left: 0px;
	transform: translateY(-50%);
}
.project-info:before {
	position: absolute;
	content: "";
	width: 2px;
	height: 80%;
	background-color: #08b5f9;
	top: 50%;
	right: 0px;
	transform: translateY(-50%);
}
.project-info .table tr th, .project-info .table tr td {
	padding: 14px 0px 14px 0px;
	color: #000;
	font-size: 12px;
}
.project-info .table tr:last-child th, .project-info .table tr:last-child td {
	border-bottom: 0px;
}
.project-info .table > :not(caption) > * > * {
	border-bottom: 1px dashed rgba(0,0,0,0.1);
}
/* ===================================
	09. Call us area
=================================== */
.call-us-area {
	background-color: #08b5f9;
	padding: 50px 0;
}
.call-us-text {
	text-align: center;
	color: #fff;
	font-size: 50px;
	font-weight: 500;
	font-family: 'Big Shoulders Display', cursive;
	text-transform: capitalize;
	text-shadow: 1px 2px 1px rgba(0, 0, 0, 0.6);
	-webkit-transition: all 0.3s ease-in-out;
	-moz-transition: all 0.3s ease-in-out;
	-o-transition: all 0.3s ease-in-out;
	transition: all 0.3s ease-in-out;
}
.call-us-text a {
	color: #000;
	display: inline-block;
}
.phone-icon-animate {
	animation: phone-icon-animate 1s ease-in-out infinite;
	display: inline-block;
}
@-webkit-keyframes phone-icon-animate {
 0%, 100% {
 transform: rotate(0)scale(1)skew(1deg);
}
 10% {
 transform: rotate(-25deg)scale(1)skew(1deg);
}
 20%, 40% {
 transform: rotate(25deg)scale(1)skew(1deg);
}
 30% {
 transform: rotate(-25deg)scale(1)skew(1deg);
}
 50% {
 transform: rotate(0)scale(1)skew(1deg);
}
}
@keyframes phone-icon-animate {
 0%, 100% {
 transform: rotate(0)scale(1)skew(1deg);
}
 10% {
 transform: rotate(-25deg)scale(1)skew(1deg);
}
 20%, 40% {
 transform: rotate(25deg)scale(1)skew(1deg);
}
 30% {
 transform: rotate(-25deg)scale(1)skew(1deg);
}
 50% {
 transform: rotate(0)scale(1)skew(1deg);
}
}
/* ===================================
	10. Testimonial
=================================== */
.testimonial-box {
	border-radius: 6px;
	background-color: #f5f5f5;
	padding: 25px;
	position: relative;
}
.testimonial-box .author-img {
	position: absolute;
	right: 1px;
	bottom: 0px;
	margin-left: 10px;
}
.testimonial-box .author-img img {
	max-width: 70px;
	border-radius: 100% 100% 0 100%;
	border: 1px solid #08b5f9;
}
.testimonial-box .profile-info {
	margin-top: 15px;
	position: relative;
	display: flex;
	align-items: center;
	justify-content: space-between;
}
.testimonial-box .profile-info h3 {
	color: #000;
	padding-bottom: 6px;
	font-size: 24px;
	font-weight: 500;
	font-family: 'Big Shoulders Display', cursive;
}
.testimonial-box p {
	font-style: italic;
}
.testimonial-box .profile-info span {
	color: #333;
}
/* ===================================
	11. Team
=================================== */
.team-item {
	overflow: hidden;
	position: relative;
	border-radius: 6px;
	text-align: center;
	background-color: #fff;
	padding: 30px;
	border: 1px solid rgba(0,0,0,0.1);
}
.team-item .image {
	position: relative;
	margin-bottom: 15px;
}
.team-item .image img {
	border-radius: 100% 100% 100% 0%;
	border: 2px solid rgba(0,0,0,0.2);
	-webkit-transition: all 0.3s ease-in-out;
	-moz-transition: all 0.3s ease-in-out;
	-o-transition: all 0.3s ease-in-out;
	transition: all 0.3s ease-in-out;
}
.team-item:hover .image img {
	border: 2px solid #08b5f9;
	border-radius: 100% 100% 0% 100%;
}
.team-item .team-item-caption {
	text-align: center;
}
.team-item .team-item-caption p {
	color: #000;
	font-size: 12px;
}
.team-item .team-item-caption h4 {
	font-size: 22px;
	letter-spacing: 1px;
	text-transform: capitalize;
	font-weight: 500;
	color: #000;
	font-family: 'Big Shoulders Display', cursive;
	position: relative;
	-webkit-transition: all 0.3s ease-in-out;
	-moz-transition: all 0.3s ease-in-out;
	-o-transition: all 0.3s ease-in-out;
	transition: all 0.3s ease-in-out;
}
.team-item .team-social {
	text-align: center;
	margin-top: 8px;
	-webkit-transition: all 0.3s ease-in-out;
	-moz-transition: all 0.3s ease-in-out;
	-o-transition: all 0.3s ease-in-out;
	transition: all 0.3s ease-in-out;
}
.team-item .team-social li {
	display: inline-block;
}
.team-item .team-social li a {
	color: #000;
	padding: 0px 14px 0px 0px;
	display: block;
	text-align: center;
	width: 100%;
	font-size: 14px;
	-webkit-transition: all 0.3s ease-in-out;
	-moz-transition: all 0.3s ease-in-out;
	-o-transition: all 0.3s ease-in-out;
	transition: all 0.3s ease-in-out;
}
.team-item .team-social li:last-child a {
	border-bottom: 0px;
	padding-right:0px;
}
.team-item .team-social li a:hover, .team-item:hover .team-item-caption h4 {
	color: #08b5f9;
}
.team-item:hover .overlay, .team-item:hover .team-social, .team-item:hover:after {
	opacity: 1;
}
/* ===================================
	12. Subscribe area
=================================== */
.subscribe-c {
	border-radius: 6px;
	overflow: hidden;
 box-shadow: 0 .5rem 1rem rgba(0,0,0,.15);
}
.subscribe-content {
	padding: 30px;
}
.subscribe-content h2 {
	font-weight: 300;
	font-size: 40px;
	color: #000;
	font-family: 'Big Shoulders Display', cursive;
}
.subscribe-form input {
	height: 54px;
	border: 1px solid #e9e9e9;
	font-size: 14px;
}
/* ===================================
	13. Blog
=================================== */
.blog-item {
	border: 1px solid rgba(0,0,0,0.1);
	overflow: hidden;
	position: relative;
	background-color: #fff;
	border-radius: 6px;
	-webkit-transition: all 0.3s ease-in-out;
	-moz-transition: all 0.3s ease-in-out;
	-o-transition: all 0.3s ease-in-out;
	transition: all 0.3s ease-in-out;
}
.blog-item:hover {
	border: 1px solid #08b5f9;
}
.blog-item .blog-item-img {
	position: relative;
}
.blog-item-content {
	padding: 20px;
	position: relative;
}
.blog-item-content h6 {
	margin-bottom: 10px;
}
.blog-item-content h6 a {
	color: #000;
	font-weight: 600;
	font-size: 28px;
	display: inline-block;
	font-family: 'Big Shoulders Display', cursive;
	-webkit-transition: all 0.3s ease-in-out;
	-moz-transition: all 0.3s ease-in-out;
	-o-transition: all 0.3s ease-in-out;
	transition: all 0.3s ease-in-out;
}
.blog-item-content h6 a:hover {
	color: #08b5f9;
}
.blog-item ul {
	padding: 0px 0;
}
.blog-item ul li {
	font-style: italic;
}
.blog-item ul li a {
	color: #000;
	font-size: 12px;
	font-weight: 400;
	-webkit-transition: all 0.3s ease-in-out;
	-moz-transition: all 0.3s ease-in-out;
	-o-transition: all 0.3s ease-in-out;
	transition: all 0.3s ease-in-out;
}
.blog-item ul li a:hover {
	color: #333;
}
.blog-item ul li a strong {
	color: #08b5f9;
}
.blog-item .read-more {
	position: absolute;
	right: 0px;
	bottom: 0px;
	font-size: 16px;
	color: #fff;
	width: 50px;
	height: 50px;
	line-height: 50px;
	border-radius: 100% 100% 0 100%;
	background-color: #000;
	text-align: center;
	display: inline-block;
	z-index: 4;
	-webkit-transition: all 0.3s ease-in-out;
	-moz-transition: all 0.3s ease-in-out;
	-o-transition: all 0.3s ease-in-out;
	transition: all 0.3s ease-in-out;
}
.blog-item:hover .read-more {
	background-color: #08b5f9;
}
/* sidebar search */
.sidebar-search {
	position: relative;
}
.sidebar-search input {
	position: relative;
	display: block;
	background-color: #fff;
	border: 1px solid #08b5f9;
	color: #333;
	font-size: 15px;
	font-weight: 400;
	height: 60px;
	width: 100%;
	border-radius: 6px;
	padding-left: 20px;
	padding-right: 65px;
}
.sidebar-search button {
	position: absolute;
	top: 50%;
	right: 0px;
	border: 0px;
	transform: translateY(-50%);
	font-size: 12px;
	height: 100%;
	width: 50px;
	text-align: center;
	line-height: 50px;
	background-color: #08b5f9;
	color: #fff;
	border-radius: 0px 6px 6px 0px;
}
/* sidebar categories */
.sidebar-categories li a {
	color: #000;
	text-decoration: none;
	padding: 0px 10px 0px 15px;
	height: 50px;
	background-color: #fff;
	line-height: 50px;
	font-size: 12px;
	border-top: 1px solid rgba(0,0,0,0.1);
	border-left: 1px solid rgba(0,0,0,0.1);
	border-right: 1px solid rgba(0,0,0,0.1);
	position: relative;
	width: 100%;
	align-items: center;
	display: flex;
	-webkit-transition: all 0.3s ease-in-out;
	-moz-transition: all 0.3s ease-in-out;
	-o-transition: all 0.3s ease-in-out;
	transition: all 0.3s ease-in-out;
}
.sidebar-categories li.active a, .sidebar-categories li a:hover {
	background-color: #fff;
	padding-left: 30px;
	color: #08b5f9;
	border-right: 2px solid #08b5f9;
}
.sidebar-categories li:last-child a {
	border-bottom: 1px solid rgba(0,0,0,0.1);
}
.sidebar-categories li a i {
	opacity: 0;
	padding-left: 10px;
	padding-top: 3px;
	-webkit-transition: all 0.3s ease-in-out;
	-moz-transition: all 0.3s ease-in-out;
	-o-transition: all 0.3s ease-in-out;
	transition: all 0.3s ease-in-out;
}
.sidebar-categories li a:hover i, .sidebar-categories li.active a i {
	opacity: 1;
}
/* sidebar widget */
.sidebar-widget {
	background-image: url(../img/bg/sidebar-bg.jpg);
	border: 1px solid rgba(0,0,0,0.2);
	border-radius: 6px;
	padding: 20px;
	position: relative;
}
.sidebar-widget:after {
	position: absolute;
	content: "";
	width: 2px;
	height: 80%;
	background-color: #08b5f9;
	top: 50%;
	left: 0px;
	transform: translateY(-50%);
}
.sidebar-widget:before {
	position: absolute;
	content: "";
	width: 2px;
	height: 80%;
	background-color: #08b5f9;
	top: 50%;
	right: 0px;
	transform: translateY(-50%);
}
/* widget title */
.sidebar-widget .sidebar-widget-title {
	font-size: 24px;
	margin-bottom: 20px;
	font-family: 'Big Shoulders Display', cursive;
}
/* recent post */
.sidebar-recent-post li {
	border-bottom: 1px dashed rgba(0,0,0,0.2);
	margin: 0px 0px 15px 0px;
	padding: 0px 0px 15px 0px;
	display: flex;
	align-items: center;
	justify-content: space-between;
}
.sidebar-recent-post li .recent-post-img {
	margin-left: 12px;
	float: left;
}
.sidebar-recent-post li .recent-post-img img {
	border-radius: 6px;
	border: 2px solid #08b5f9;
}
.sidebar-recent-post li:last-child {
	padding-bottom: 0;
	margin-bottom: 0;
	border-bottom: none;
}
.sidebar-recent-post li .post-date {
	color: #08b5f9;
	display: inline-block;
	font-size: 10px;
	font-style: italic;
}
.sidebar-recent-post li .post-date strong {
	color: #08b5f9;
}
.sidebar-recent-post li .post-title {
	font-size: 14px;
	line-height: 20px;
	font-weight: 500;
}
.sidebar-recent-post li .post-title a {
	color: #333;
	-webkit-transition: all 0.3s ease-in-out;
	-moz-transition: all 0.3s ease-in-out;
	-o-transition: all 0.3s ease-in-out;
	transition: all 0.3s ease-in-out;
}
.sidebar-recent-post li .post-title a:hover {
	color: #08b5f9;
}
/* popular tag */
.popular-tag li {
	display: inline-block;
	margin: 2px;
}
.popular-tag li a {
	display: inline-block;
	background-color: #333;
	border-radius: 4px;
	padding: 4px 10px;
	color: #fff;
	font-size: 12px;
	-webkit-transition: all 0.3s ease-in-out;
	-moz-transition: all 0.3s ease-in-out;
	-o-transition: all 0.3s ease-in-out;
	transition: all 0.3s ease-in-out;
}
.popular-tag li a:hover {
	color: #fff;
	background-color: #08b5f9;
}
/* blog post */
.blog-post-img {
	position: relative;
}
.blog-post-img img {
	border-radius: 6px;
}
.blog-post-content h6 {
	color: #000;
	font-size: 30px;
	display: inline-block;
	font-family: 'Big Shoulders Display', cursive;
}
.blog-post-content .heightlight-text .p-quote {
	font-size: 30px;
	line-height: 70px;
	height: 70px;
	width: 70px;
	display: inline-block;
	border: 1px solid #08b5f9;
	text-align: center;
	border-radius: 100%;
	float: left;
	margin: 8px 20px 10px 0px;
	box-shadow: 0px 16px 32px 0px rgba(0, 0, 0, 0.06);
}
/* blog post list */
.blog-post-list {
	margin-left: 15px;
}
.blog-post-list li {
	color: #333;
	font-size: 14px;
	list-style: disc;
	padding-bottom: 10px;
}
.blog-post-list li:last-child {
	padding-bottom: 0px;
}
/* blog post meta */
.blog-post-meta {
	position: absolute;
	left: 15px;
	bottom: 15px;
	background-color: #08b5f9;
	padding: 16px 20px;
	border-radius: 6px;
}
.blog-post-meta li {
	position: relative;
	margin-right: 20px !important;
}
.blog-post-meta li:last-child {
	margin-right: 0px !important;
}
.blog-post-meta li a {
	color: #fff;
	font-size: 12px;
	font-weight: 500;
}
.blog-post-meta li a i {
	color: #fff;
}
.blog-post-meta li a:hover {
	color: #000;
}
.blog-post-meta li:after {
	position: absolute;
	content: "-";
	border-radius: 100%;
	top: 50%;
	transform: translateY(-50%);
	right: -15px;
	color: #fff;
	font-size: 10px;
}
.blog-post-meta li:last-child:after {
	display: none;
}
.blog-single-social li:first-child {
	font-weight: 600;
	font-size: 14px;
	color: #08b5f9;
}
.blog-single-social li a {
	color: #959595;
	font-size: 14px;
}
.blog-single-social li a:hover {
	color: #08b5f9;
}
/* comments title */
.blog-post-subtitle {
	color: #000;
	font-size: 28px;
	display: inline-block;
	position: relative;
	font-family: 'Big Shoulders Display', cursive;
}
.blog-post-subtitle:first-letter {
	color: #08b5f9;
}
/* Comments block */
.comments-block ul li {
	width: 100%;
	margin-bottom: 30px;
}
.comments-block ul li:last-child {
	margin-bottom: 0px;
	padding-bottom: 0px;
	border-bottom: 0px;
}
.comments-block ul li ul {
	margin-top: 30px;
	margin-left: 30px;
}
.comments-block ul li .d-flex {
	position: relative;
}
.comments-block ul li .d-flex .flex-grow-1 {
	background-color: #f5f5f5;
	padding: 15px;
	border-radius: 6px;
}
.comments-block ul li .d-flex .flex-shrink-0 {
	position: relative;
	padding-right: 15px;
}
.comments-block ul li .d-flex .flex-shrink-0 img {
	border-radius: 6px;
	border: 1px solid rgba(0,0,0,0.1);
}
.comments-block ul li ul li:last-child {
	margin-bottom: 0px !important;
}
.comments-block ul li h5 {
	font-size: 18px;
	color: #000;
	margin-bottom: 4px;
	font-family: 'Big Shoulders Display', cursive;
}
.comments-block ul li h5 small {
	font-size: 12px;
	color: #08b5f9;
	width: 100%;
	font-weight: 500;
	display: inline-block;
	font-family: 'Montserrat', sans-serif;
}
.comments-block ul li a.reply {
	color: #08b5f9;
	font-size: 18px;
	text-transform: uppercase;
	display: inline-block;
	font-weight: 600;
	width: 40px;
	height: 40px;
	line-height: 38px;
	border: 1px solid #08b5f9;
	border-radius: 100%;
	text-align: center;
	-webkit-transition: all 0.3s ease-in-out;
	-moz-transition: all 0.3s ease-in-out;
	-o-transition: all 0.3s ease-in-out;
	transition: all 0.3s ease-in-out;
}
.comments-block ul li .d-flex:hover a.reply {
	background-color: #08b5f9;
	color: #fff;
}
/* leave a comments block */
.leave-reply-form input {
	background-color: #fff;
	border: 1px solid rgba(0,0,0,0.2);
	height: 55px;
	border-radius: 6px;
	font-size: 14px;
	color: #000;
}
.leave-reply-form textarea {
	background-color: #fff;
	border: 1px solid rgba(0,0,0,0.2);
	padding: 20px;
	border-radius: 6px;
	font-size: 14px;
	color: #000;
}
.leave-reply-form input:focus, .leave-reply-form textarea:focus {
	border: 1px solid #08b5f9 !important;
	color: #000;
	box-shadow: none;
 box-shadow: 0 .5rem 1rem rgba(0,0,0,.15);
}
/* ===================================
	14. Footer
=================================== */

/* New footer (match demo lo202506/202506031) */
.footer {
	--footer-bg: #111827;
	--footer-text: #d1d5db;
	--footer-muted: #9ca3af;
	--footer-surface: #1f2937;
	--footer-primary: var(--bs-primary, #0d6efd);
	--footer-radius-lg: 12px;
	--footer-transition-fast: 160ms ease-in-out;

	background-color: var(--footer-bg);
	color: var(--footer-text);
	padding: 48px 0 32px;
}

.footer a {
	color: inherit;
	text-decoration: none;
}

.footer__content {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 48px;
	margin-bottom: 32px;
}

.footer__logo {
	font-size: 20px;
	font-weight: 700;
	color: #ffffff;
	margin-bottom: 16px;
}

.footer__description {
	color: var(--footer-muted);
	margin-bottom: 24px;
	line-height: 1.6;
}

.footer__description a {
	color: #ffffff;
	text-decoration: underline;
	text-underline-offset: 3px;
}

.footer__social {
	display: flex;
	gap: 16px;
}

.footer__social-link {
	width: 40px;
	height: 40px;
	background-color: var(--footer-surface);
	border-radius: var(--footer-radius-lg);
	display: inline-flex;
	align-items: center;
	justify-content: center;
	transition: background-color var(--footer-transition-fast), transform var(--footer-transition-fast);
}

.footer__social-link:hover {
	background-color: var(--footer-primary);
	transform: translateY(-2px);
}

.footer__social-link:focus-visible {
	outline: 2px solid rgba(255, 255, 255, 0.75);
	outline-offset: 2px;
}

.footer__social-link img {
	width: 20px;
	height: 20px;
	filter: brightness(0) invert(1);
}

.footer__links {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 32px;
}

.footer__column-title {
	font-weight: 600;
	color: #ffffff;
	margin-bottom: 16px;
}

.footer__list {
	list-style: none;
	padding: 0;
	margin: 0;
	display: flex;
	flex-direction: column;
	gap: 8px;
}

.footer__link {
	color: var(--footer-muted);
	transition: color var(--footer-transition-fast);
}

.footer__link:hover {
	color: #ffffff;
}

@media (max-width: 768px) {
	.footer {
		padding: 40px 0 28px;
	}
	.footer__content {
		grid-template-columns: 1fr;
		gap: 28px;
	}
}

/* Footer markup used by BaseLayout.astro (match mobanwang about.html style) */
.site-footer {
	/* Isolation reset: keep footer styles self-contained */
	box-sizing: border-box;
	font-size: 16px;
	line-height: 1.5;

	position: relative;
	overflow: hidden;
	background: radial-gradient(1200px 600px at 15% 20%, rgba(8,181,249,0.18) 0%, rgba(17,24,39,0) 55%),
		linear-gradient(180deg, #0b1220 0%, #070b14 100%);
	color: #d1d5db;
}

.site-footer *,
.site-footer *::before,
.site-footer *::after {
	box-sizing: inherit;
}

.site-footer :where(h1, h2, h3, h4, h5, h6, p) {
	margin: 0;
}

.site-footer :where(ul, ol) {
	margin: 0;
	padding: 0;
	list-style: none;
	font-size: 14px;
}

.site-footer :where(img) {
	max-width: 100%;
	height: auto;
}

.site-footer a {
	color: inherit;
	text-decoration: none;
}

.site-footer .footer-bg-dot {
	position: absolute;
	inset: 0;
	background-repeat: repeat;
	background-size: 420px auto;
	opacity: 0.07;
	pointer-events: none;
	transform: translateZ(0);
}

.site-footer .footer-top {
	position: relative;
	padding: 72px 0 48px;
}

.site-footer .footer-widgets-item {
	position: relative;
	padding-right: 10px;
}

.site-footer .footer-widgets-item h2 {
	font-size: 16px;
	line-height: 1.2;
	font-weight: normal;
	color: #ffffff;
	margin-bottom: 18px;
	letter-spacing: 0.4px;
}

.site-footer .footer-widgets-item .f-logo img {
	max-width: 170px;
	height: auto;
}

.site-footer .footer-widgets-item p.content {
	margin-top: 16px;
	margin-bottom: 20px;
	color: rgba(255,255,255,0.72);
	line-height: 1.7;
}

.site-footer .footer-widgets-item .menu {
	display: grid;
	gap: 10px;
}

.site-footer .footer-widgets-item .menu a {
	color: rgba(255,255,255,0.72);
	transition: color 160ms ease, transform 160ms ease;
	display: inline-flex;
	align-items: center;
}

.site-footer .footer-widgets-item .menu a:hover {
	color: #ffffff;
	transform: translateX(2px);
}

.site-footer .footer-widgets-item .menu img{
	width: 142px;
	height: auto;
}


.site-footer .footer-social {
	display: flex;
	gap: 12px;
}

.site-footer .footer-social span {
	display: inline-flex;
}

.site-footer .footer-social a {
	width: 42px;
	height: 42px;
	border-radius: 12px;
	background: rgba(255,255,255,0.08);
	border: 1px solid rgba(255,255,255,0.12);
	display: inline-flex;
	align-items: center;
	justify-content: center;
	transition: background-color 160ms ease, transform 160ms ease, border-color 160ms ease;
}

.site-footer .footer-social a:hover {
	background: rgba(8,181,249,0.22);
	border-color: rgba(8,181,249,0.35);
	transform: translateY(-2px);
}

.site-footer .footer-social svg {
	width: 18px;
	height: 18px;
	color: #ffffff;
	display: block;
}

.site-footer .contact-info {
	display: grid;
	gap: 14px;
}

.site-footer .contact-info li {
	display: grid;
	grid-template-columns: 44px 1fr;
	gap: 12px;
	align-items: center;
}

.site-footer .contact-info .icon {
	width: 44px;
	height: 44px;
	border-radius: 12px;
	background: rgba(255,255,255,0.08);
	border: 1px solid rgba(255,255,255,0.12);
	display: inline-flex;
	align-items: center;
	justify-content: center;
}

.site-footer .contact-info .icon svg {
	width: 18px;
	height: 18px;
	color: #ffffff;
	display: block;
}

.site-footer .contact-info .icon img {
	width: 18px;
	height: 18px;
	color: #ffffff;
	display: block;
}

.site-footer .contact-info .content h4 {
	font-size: 14px;
	letter-spacing: 1px;
	text-transform: uppercase;
	color: #ffffff;
	margin: 0;
	font-weight: normal;
}

.site-footer .contact-info .content p {
	color: #d2d2d4;
	margin-top: 4px;
	margin-bottom: 0;
	line-height: 24px;
	font-size: 14px;
}

.site-footer .footer-bottom {
	position: relative;
	border-top: 1px solid rgba(255,255,255,0.12);
	background: rgba(0,0,0,0.12);
}

.site-footer .copy-text {
	text-align: center;
}

.site-footer .copy-text p {
	margin: 0;
	color: rgba(255,255,255,0.72);
}

.site-footer .copy-text a {
	color: #ffffff;
	text-decoration: underline;
	text-underline-offset: 3px;
}

@media (max-width: 991.98px) {
	.site-footer .footer-top {
		padding: 56px 0 40px;
	}
}

@media (max-width: 575.98px) {
	.site-footer .footer-top {
		padding: 44px 0 34px;
	}
	.site-footer .footer-social a {
		width: 40px;
		height: 40px;
		border-radius: 10px;
	}
}
/* ===================================
	15. Inner page header
=================================== */
.inner-page-header-bg {
	background-image: url(../img/bg/inner-page-header-bg.jpg);
	background-position: center top;
	background-repeat: no-repeat;
	position: relative;
	z-index: 0;
	background-size: cover;
	padding: 150px 0;
}
.inner-page-header-bg:after {
	position: absolute;
	content: "";
	width: 100%;
	height: 100%;
	left: 0px;
	top: 0px;
	z-index: -1;
	background-color: rgba(8,181,249,0.7);
}
.inner-page-title h1 {
	color: #fff;
	font-size: 50px;
	display: inline-block;
	position: relative;
	font-weight: 500;
	font-family: 'Big Shoulders Display', cursive;
	margin-bottom: 10px;
}
.inner-page-title-c {
	text-align: center;
}
/* breadcrumb */
.breadcrumb-box {
	padding: 0;
}
.breadcrumb-box .breadcrumb {
	margin: auto;
	display: inline-block;
}
.breadcrumb-box .breadcrumb li {
	display: inline-block;
	color: #fff;
	font-size: 12px;
}
.breadcrumb-box .breadcrumb-item + .breadcrumb-item:before {
	content: ".";
	font-size: 40px;
	line-height: 1px;
	color: #fff;
}
.breadcrumb-box .breadcrumb li a {
	color: #000;
	font-weight: 600;
}
/* ===================================
	16. Gallery
=================================== */
.gallery-box {
	border-radius: 8px;
	overflow: hidden;
	position: relative;
	border: 1px solid rgba(0,0,0,0.1)
}
.gallery-box:before {
	height: 0;
	width: 0;
	bottom: 0;
	right: 0;
	content: '';
	background-color: rgba(0,0,0,0.2);
	z-index: 2;
	position: absolute;
	-webkit-transition: all 0.3s ease-in-out;
	-moz-transition: all 0.3s ease-in-out;
	-o-transition: all 0.3s ease-in-out;
	transition: all 0.3s ease-in-out;
}
.gallery-box:hover:before {
	height: 100%;
	width: 100%;
}
.gallery-box .zoom {
	position: absolute;
	right: 0px;
	bottom: 0px;
	font-size: 16px;
	color: #fff;
	width: 50px;
	height: 50px;
	line-height: 50px;
	border-radius: 100% 100% 0 100%;
	background-color: #000;
	text-align: center;
	display: inline-block;
	z-index: 4;
	-webkit-transition: all 0.3s ease-in-out;
	-moz-transition: all 0.3s ease-in-out;
	-o-transition: all 0.3s ease-in-out;
	transition: all 0.3s ease-in-out;
}
.gallery-box:hover .zoom {
	opacity: 1;
	background-color: #08b5f9;
}
/* ===================================
	17. Faq
=================================== */
.faq-box .accordion-item .accordion-header .accordion-button {
	color: #fff !important;
	padding: 20px 15px !important;
	border-bottom: 0;
	font-size: 20px;
	letter-spacing: 1px;
	border-radius: 6px;
	background-color: #08b5f9 !important;
	position: relative;
	text-align: left;
	font-family: 'Big Shoulders Display', cursive;
	box-shadow: none;
}
.faq-box .accordion-item .accordion-header .accordion-button.collapsed:after, .faq-box .accordion-item .accordion-header .accordion-button:after {
	display: none;
}
.faq-box .accordion-item .accordion-header .accordion-button {
	display: flex;
}
.faq-box .accordion-item .accordion-header .accordion-button i {
	font-size: 14px;
	margin-right: 10px;
	-webkit-transition: all 0.3s ease-in-out;
	-moz-transition: all 0.3s ease-in-out;
	-o-transition: all 0.3s ease-in-out;
	transition: all 0.3s ease-in-out;
}
.faq-box .accordion-item .accordion-header .accordion-button[aria-expanded=true] i {
	-webkit-transform: rotate(45deg);
	-moz-transform: rotate(45deg);
	-ms-transform: rotate(45deg);
	-o-transform: rotate(45deg);
	transform: rotate(45deg);
}
.faq-box .accordion-item .accordion-header .accordion-button:focus {
	border-color: transparent;
	box-shadow: none;
}
.faq-box .accordion-item .accordion-header {
	padding: 0px;
	border: 1px solid rgba(0,0,0,0.2);
	border-radius: 6px;
	background-color: transparent;
}
.faq-box .accordion-item .accordion-header .accordion-button.collapsed {
	color: #000 !important;
	padding: 20px 15px !important;
	font-size: 20px;
	background-color: #fff !important;
	letter-spacing: 1px;
	font-family: 'Big Shoulders Display', cursive;
}
.faq-box .accordion-item {
	background-color: transparent;
	border-radius: 0px !important;
	border-bottom: 0px;
	overflow: hidden;
	border-left: 0;
	border-right: 0;
	border-top: 0;
	margin-bottom: 10px;
}
.faq-box .accordion-item:last-child {
	border-bottom: 0px;
	margin-bottom: 0px;
}
.faq-box .accordion-item .accordion-body {
	line-height: 24px;
	padding: 20px;
	color: #333;
	background-color: #e1f4fb;
	margin-top: 1px;
	border-radius: 6px;
	border: 0px;
	position: relative;
}
.faq-box .accordion-item .accordion-body:after {
	position: absolute;
	content: "";
	width: 2px;
	height: 80%;
	background-color: #08b5f9;
	top: 50%;
	left: 0px;
	transform: translateY(-50%);
}
.faq-box .accordion-item .accordion-body:before {
	position: absolute;
	content: "";
	width: 2px;
	height: 80%;
	background-color: #08b5f9;
	top: 50%;
	right: 0px;
	transform: translateY(-50%);
}
.faq-box .accordion-item .accordion-body p {
	color: #000;
}
/* ===================================
	18. Pricing area
=================================== */
.single-pricing {
	background-image: url(../img/bg/sidebar-bg.jpg);
	border: 1px solid rgba(0,0,0,0.2);
	border-radius: 6px;
	overflow: hidden;
	position: relative;
	text-align: center;
	-webkit-transition: all 0.3s ease-in-out;
	-moz-transition: all 0.3s ease-in-out;
	-o-transition: all 0.3s ease-in-out;
	transition: all 0.3s ease-in-out;
}
.single-pricing:after {
	position: absolute;
	content: "";
	width: 2px;
	height: 80%;
	background-color: #08b5f9;
	top: 50%;
	left: 0px;
	transform: translateY(-50%);
}
.single-pricing:before {
	position: absolute;
	content: "";
	width: 2px;
	height: 80%;
	background-color: #08b5f9;
	top: 50%;
	right: 0px;
	transform: translateY(-50%);
}
.single-pricing .pricing-head {
	position: relative;
	padding: 20px;
}
.single-pricing .pricing-head h3 {
	color: #000;
	font-size: 30px;
	margin-bottom: 4px;
	font-family: 'Big Shoulders Display', cursive;
	display: inline-block;
	-webkit-transition: all 0.3s ease-in-out;
	-moz-transition: all 0.3s ease-in-out;
	-o-transition: all 0.3s ease-in-out;
	transition: all 0.3s ease-in-out;
}
.single-pricing .pricing-head .plan {
	color: #333;
	margin-bottom: 20px;
}
.single-pricing .pricing-classic-price {
	font-weight: 400;
	letter-spacing: 0;
	color: #08b5f9;
	font-size: 30px;
	line-height: 25px;
}
.single-pricing .pricing-body {
	margin-top: 0px;
	padding: 10px 20px 20px 20px;
}
.single-pricing ul.feature {
	-webkit-transition: all 0.3s ease-in-out;
	-moz-transition: all 0.3s ease-in-out;
	-o-transition: all 0.3s ease-in-out;
	transition: all 0.3s ease-in-out;
}
.single-pricing ul.feature li {
	display: block;
	font-size: 14px;
	padding: 10px 0px;
	text-transform: capitalize;
	color: #000;
}
.single-pricing ul.feature li:last-child {
	padding-bottom: 0px;
}
.single-pricing ul.feature li i {
	color: #08b5f9;
	margin-right: 6px;
}
.single-pricing:hover, .single-pricing.active {
	border-color: #08b5f9;
}
.single-pricing:hover .pricing-head h3, .single-pricing.active .pricing-head h3 {
	background-color: #08b5f9;
	color: #fff;
	padding: 2px 4px;
}

/* --- ITGen demo: Pricing Plan --- */
.ct-pricing-plan-section ul.nav li button::after,
.ct-pricing-plan-section ul.nav li button,
.ct-price-card,
.button-2 {
	-webkit-transition: all 0.3s ease-out 0s;
	-moz-transition: all 0.3s ease-out 0s;
	-ms-transition: all 0.3s ease-out 0s;
	-o-transition: all 0.3s ease-out 0s;
	transition: all 0.3s ease-out 0s;
}

.ct-pricing-plan-section .fade {
	transition: opacity 0.15s linear;
}
@media (prefers-reduced-motion: reduce) {
	.ct-pricing-plan-section .fade {
		transition: none;
	}
}
.ct-pricing-plan-section .fade:not(.show) {
	opacity: 0;
}

.ct-pricing-plan-section .tab-content > .tab-pane {
	display: none;
}
.ct-pricing-plan-section .tab-content > .active {
	display: block;
}

/*
 * #-Pricing Plan (from ITGen_files/main.css)
*/
.ct-pricing-plan-section .tab-pane.fade.show {
	transform: translateY(0rem);
}

.ct-pricing-plan-section .tab-pane.fade {
	transition: all 0.3s ease-out;
	transform: translateY(1rem);
}

.ct-pricing-plan-section p.save-txt {
	color: var(--headding-color);
	font-size: 16px;
	font-weight: 600;
	margin-bottom: 10px;
	text-align: center;
}

.ct-pricing-plan-section ul.nav {
	border-bottom: none;
	display: inline-block;
}

.ct-pricing-plan-section ul.nav li.nav-item {
	display: inline-block;
}

.ct-pricing-plan-section ul.nav li.nav-item button {
	text-transform: capitalize;
	padding: 5px 30px;
	position: relative;
	color: var(--headding-color);
	background: transparent;
	border: none;
	font-size: 18px;
	width: auto;
	border: none !important;
	font-family: var(--headding-font);
	font-weight: 500;
}

.ct-pricing-plan-section ul.nav li:first-child button {
	padding-left: 0 !important;
}

.ct-pricing-plan-section ul.nav li:nth-child(2) button {
	padding-right: 0px;
}

.ct-pricing-plan-section ul.nav li button::before {
	position: absolute;
	content: "";
	width: 47px;
	height: 25px;
	background: var(--white-bg);
	-webkit-border-radius: 20px;
	-moz-border-radius: 20px;
	border-radius: 20px;
	right: -27px;
	top: 68%;
	margin-top: -20px;
	border: 1px solid var(--primary-color) !important;
	z-index: 1;
}

.ct-pricing-plan-section ul.nav li button::after {
	position: absolute;
	content: "";
	width: 16px;
	height: 16px;
	background: var(--primary-color);
	-webkit-border-radius: 15px;
	-moz-border-radius: 15px;
	border-radius: 15px;
	margin-top: -15px;
	z-index: 1;
	top: 66.5%;
	right: -22px;
	animation-name: fadeInLeft;
	-webkit-animation-name: fadeInLeft;
	-moz-animation-name: fadeInLeft;
	animation-duration: 0.3s;
	-webkit-animation-duration: 0.3s;
	-moz-animation-duration: 0.3s;
}

.ct-pricing-plan-section ul.nav li:nth-child(even) button {
	text-align: right;
}

.ct-pricing-plan-section ul.nav li:nth-child(even) button::before {
	left: -27px;
	right: auto;
}

.ct-pricing-plan-section ul.nav li:nth-child(even) button::after {
	right: auto;
	left: -22px;
	animation-name: fadeInRight;
	-webkit-animation-name: fadeInRight;
	-moz-animation-name: fadeInRight;
	animation-duration: 0.3s;
	-webkit-animation-duration: 0.3s;
	-moz-animation-duration: 0.3s;
}

.ct-pricing-plan-section ul.nav li button.active::after,
.ct-pricing-plan-section ul.nav li button.active::before {
	display: none;
	z-index: -9;
}

.ct-pricing-plan-section ul.nav li button.active {
	color: var(--primary-color);
	font-weight: 600;
}

.ct-price-card {
	height: 100%;
	border: 1px solid var(--ct-border-color2);
	position: relative;
	padding: 30px;
}

.ct-price-card h4 {
	font-size: 20px;
	font-weight: 500;
	letter-spacing: 1px;
	margin-bottom: 10px;
}

.ct-price-card .price {
	margin-bottom: 15px;
}

.ct-price-card .price h2 {
	font-weight: 600;
	font-size: 40px;
}

.ct-price-card .price h2 sub {
	font-size: 16px;
	line-height: 1;
}

.ct-price-card .s-content p {
	margin-bottom: 15px;
	font-weight: 600;
	color: var(--headding-color);
}

.ct-price-card .badge-text {
	position: absolute;
	top: 20px;
	z-index: 1;
	right: -12px;
	background: var(--no-change-color1);
	padding: 6px 16px;
	display: inline-block;
	box-sizing: border-box;
	padding-left: 32px;
	clip-path: polygon(100% 0%, 100% 50%, 100% 100%, 0 100%, 18% 51%, 0 0);
}

.ct-price-card .badge-text p {
	color: var(--white-color);
	line-height: 1;
	display: inline-block;
	font-size: 14px;
	font-weight: 600;
	letter-spacing: 1px;
}

.ct-price-card .p-con ul li {
	display: inline-block;
	width: 100%;
	line-height: 30px;
	font-size: 15px;
	font-weight: 400;
	padding: 5px 0px;
}

.ct-inline-icon {
	width: 1em;
	height: 1em;
	display: inline-block;
	flex-shrink: 0;
	vertical-align: -0.125em;
	color: inherit;
}

.ct-price-card .p-con ul li i,
.ct-price-card .p-con ul li .ct-inline-icon {
	color: var(--headding-color);
	padding-right: 3px;
}

.ct-price-card .p-con ul li.no i,
.ct-price-card .p-con ul li.no .ct-inline-icon {
	color: #ff8b8b;
}

.ct-price-card .p-con ul li.no {
	opacity: 0.8;
}

.ct-price-card .p-button {
	margin-top: 20px;
}

.button-2 {
	background: var(--white-bg);
	padding: 16px 30px 16px;
	border: 2px solid var(--ct-border-color2);
	font-weight: 600;
	font-size: 16px;
	color: var(--headding-color);
	display: inline-flex;
	align-items: center;
	line-height: 25px;
}

.button-2 i {
	padding-left: 8px;
}

.button-2 .ct-inline-icon {
	padding-left: 8px;
}

.button-2:hover {
	background: var(--primary-color);
	color: var(--white-color);
	border-color: var(--primary-color);
}

.ct-price-card .button-2 {
	padding: 10px 30px 10px;
}

.ct-price-card.active {
	border-color: var(--headding-color);
}
/* ===================================
	19. Error page 404
=================================== */
.error-page-item h2 {
	margin-bottom: 12px;
	font-size: 30px;
	color: #000;
	font-family: 'Big Shoulders Display', cursive;
}
/* ===================================
	20. Contact us
=================================== */
.contact-img img {
	border-radius: 6px;
}
.contact-box-main {
	background-image: url(../img/bg/sidebar-bg.jpg);
	border: 1px solid rgba(0,0,0,0.2);
	border-radius: 6px;
	padding: 30px;
	position: relative;
}
.contact-box-main:after {
	position: absolute;
	content: "";
	width: 2px;
	height: 80%;
	background-color: #08b5f9;
	top: 50%;
	left: 0px;
	transform: translateY(-50%);
}
.contact-box-main:before {
	position: absolute;
	content: "";
	width: 2px;
	height: 80%;
	background-color: #08b5f9;
	top: 50%;
	right: 0px;
	transform: translateY(-50%);
}
.contact-box {
	margin-bottom: 15px;
	padding-bottom: 15px;
	border-bottom: 1px dashed rgba(0,0,0,0.2);
}
.contact-box:last-child {
	margin-bottom: 0px;
	padding-bottom: 0px;
	border-bottom: 0px;
}
.contact-box .icon {
	font-size: 18px;
	margin-bottom: 6px;
	color: #08b5f9;
	position: relative;
	display: inline-block;
	text-align: center;
}
.contact-box h4 {
	line-height: 22px;
	color: #000;
	font-size: 18px;
	font-weight: 500;
	display: inline-block;
	margin-left: 10px;
	font-family: 'Big Shoulders Display', cursive;
}
.contact-box p {
	font-size: 14px;
	margin-bottom: 0px;
	color: #000;
	width: 100%;
	display: inline-block;
}
.contact-form-map {
	background-color: #111;
}
/* contact form */
.contact-form input {
	background-color: #fff;
	border: 1px solid rgba(0,0,0,0.2);
	height: 55px;
	border-radius: 6px;
	font-size: 14px;
	color: #000;
}
.contact-form textarea {
	background-color: #fff;
	border: 1px solid rgba(0,0,0,0.2);
	padding: 20px;
	border-radius: 6px;
	font-size: 14px;
	color: #000;
}
.contact-form input:focus, .contact-form textarea:focus {
	border: 1px solid #08b5f9 !important;
	color: #000;
	box-shadow: none;
 box-shadow: 0 .5rem 1rem rgba(0,0,0,.15);
}
.help-block ul {
	color: #842029;
	background-color: #f8d7da;
	border-color: #f5c2c7;
	padding: 10px;
	border-radius: 4px;
}
/* map */
.map-box iframe {
	width: 100%;
	border: 0px;
	height: 380px;
	border-radius: 6px;
	overflow: hidden;
}

/* =====================================================================
	Section styles (shared)
	- No page-specific selectors
===================================================================== */

/* ===== Breadcrumb Section (shared; match demo about header) ===== */
.breadcrumb-section {
	position: relative;
	background-size: cover;
	background-position: center;
	background-repeat: no-repeat;
	color: #ffffff;
	overflow: hidden;
}

.breadcrumb-section:before {
	content: '';
	position: absolute;
	inset: 0;
	background: linear-gradient(90deg, rgba(10, 18, 34, 0.82) 0%, rgba(10, 18, 34, 0.68) 55%, rgba(10, 18, 34, 0.45) 100%);
}

.breadcrumb-section .container,
.breadcrumb-section .row,
.breadcrumb-section .col-lg-12 {
	position: relative;
	z-index: 1;
}

.breadcrumb-section .content h2 {
	color: #ffffff;
	font-size: 56px;
	line-height: 1.1;
	font-weight: 800;
	margin: 0 0 14px;
}

.breadcrumb-section .content ul {
	list-style: none;
	padding: 0;
	margin: 0;
	display: inline-flex;
	gap: 18px;
	align-items: center;
	justify-content: center;
}

.breadcrumb-section .content ul li {
	position: relative;
	font-size: 16px;
	color: rgba(255, 255, 255, 0.92);
}

.breadcrumb-section .content ul li + li:before {
	content: '';
	position: absolute;
	left: -10px;
	top: 50%;
	width: 4px;
	height: 4px;
	border-radius: 999px;
	background: rgba(255, 255, 255, 0.8);
	transform: translateY(-50%);
}

.breadcrumb-section .content ul li a {
	color: rgba(255, 255, 255, 0.92);
	text-decoration: none;
	transition: color .2s ease;
}

.breadcrumb-section .content ul li a:hover {
	color: #ffffff;
}

@media (max-width: 767.98px) {
	.breadcrumb-section .content h2 {
		font-size: 40px;
	}
}

/* ===== About Us Section (ct-about-us-section2) ===== */
.ct-about-us-section2 {
	position: relative;
	/* background: #ffffff; */
}

.ct-about-us-section2 .order-first {
    order: -1 !important;
}

.ct-about-us-section2 .content p.text {
	font-size: 16px;
	line-height: 28px;
	margin-top: 0;
	margin-bottom: 20px;
}

/* Avoid title/paragraph visual overlap when reveal transforms are active */
.ct-about-us-section2 .ct-section-title {
	margin-bottom: 30px;
}

.ct-about-us-section2 .ct-section-title .wow.fadeInUp {
	opacity: 1;
	transform: none;
	animation: none;
}

.ct-about-us-section2 .ct-section-title h2 span {
	font-weight: 500;
}

.ct-about-us-section2 .ct-about-us-image img {
	display: block;
	max-width: 100%;
	height: auto;
	border-radius: 6px !important;
	-webkit-border-radius: 6px;
	-moz-border-radius: 6px;
	-ms-border-radius: 6px;
	-o-border-radius: 6px;
}

/* Match demo: keep the image group as a stable styling scope. */
.ct-about-us-section2 .ct-about-us-image {
	position: relative;
}

/* Keep demo utility behaviour. */
.ct-about-us-section2 .ct-about-us-image .col-sm-4.position-relative {
	position: relative !important;
}

.ct-about-us-section2 .ab-im-content {
	background: var(--white-bg);
	padding: 25px 25px 25px 20px;
	border-left: 10px solid rgb(0, 71, 157);
	box-shadow: 0 2px 40px 0 rgba(21, 24, 32, 0.06);
	margin-left: -100px;
	margin-top: 40px;
	overflow: hidden;
}

/* Match demo: in section2 the card stays in flow (no absolute positioning). */
.ct-about-us-section2 .ct-about-us-image .ab-im-content {
	position: static;
	right: auto;
	bottom: auto;
}

.ct-about-us-section2 .ab-im-content .icon {
	float: left;
	margin-right: 20px;
	width: 60px;
	height: 60px;
	padding: 15px;
	display: flex;
	justify-content: center;
	align-items: center;
	color: transparent;
	font-size: 20px;
	background: #f4f5f8;
	border-radius: 50%;
	-webkit-text-stroke-width: 1px;
	-webkit-text-stroke-color: var(--primary-color);
}

.ct-about-us-section2 .ab-im-content .con {
	overflow: hidden;
}

.ct-about-us-section2 .ab-im-content .con strong {
	display: block;
	font-size: 14px;
	margin-top: 2px;
	font-weight: 400;
	margin-bottom: 5px;
	color: rgb(68, 86, 88);
}

.ct-about-us-section2 .ab-im-content .con a {
	color: var(--headding-color);
	font-size: 16px;
	font-weight: 600;
	line-height: 30px;
}

.ct-about-us-section2 .content .ab-list ul li {
	line-height: 32px;
	color: var(--headding-color);
	font-weight: normal;
    font-size: 14px;
}

.ct-about-us-section2 .content .ab-list ul li i,
.ct-about-us-section2 .content .ab-list ul li svg {
	color: var(--primary-color);
	margin-right: 4px;
}

.ct-about-us-section2 .content .ab-list ul li svg {
	display: inline-block;
	vertical-align: -0.125em;
}

@media (max-width:1200px) {
	.ct-about-us-section2 .ab-im-content {
		padding: 25px 15px 25px 15px;
	}
}

@media (max-width:767px) {
	.ct-about-us-section2 .ab-im-content {
		padding: 25px 15px 25px 10px;
	}
}

@media (max-width:576px) {
	.ct-about-us-section2 .ab-im-content {
		padding: 15px 15px 15px 10px;
	}
}

@media (max-width: 991.98px) {
	.ct-about-us-section2 .ct-section-title h2 {
		font-size: 32px;
	}
}

/* ===== About reveal fallbacks (scoped) ===== */
html.js.reveal .ct-about-us-section2 [data-cues="slideInUp"] > * {
	opacity: 1;
	transform: none;
	transition: none;
}
