/* ============================================================
   Cloudeli — Modern UI Layer
   Loaded last; refreshes the look while keeping the brand palette
   Brand: #1a76d1 (blue) · #2889e4 (light blue) · #2c2d3f (navy)
   ============================================================ */

:root{
	--brand:#1a76d1;
	--brand-2:#2889e4;
	--brand-dark:#155fa8;
	--ink:#2c2d3f;
	--body:#5b6172;
	--muted:#8b90a0;
	--soft:#eef4fc;
	--line:#e8eef7;
	--grad:linear-gradient(135deg,#2889e4 0%,#1a76d1 100%);
	--grad-soft:linear-gradient(135deg,rgba(40,137,228,.12),rgba(26,118,209,.12));
	--shadow-sm:0 6px 20px rgba(26,118,209,.08);
	--shadow:0 16px 44px rgba(26,118,209,.13);
	--shadow-lg:0 28px 64px rgba(26,118,209,.20);
	--radius:20px;
	--radius-sm:14px;
}

/* ---------- Base ---------- */
html{scroll-behavior:smooth;}
body{
	color:var(--body);
	font-size:15px;
	line-height:1.75;
	-webkit-font-smoothing:antialiased;
	-moz-osx-font-smoothing:grayscale;
	letter-spacing:.1px;
}
h1,h2,h3,h4,h5,h6{color:var(--ink);font-weight:700;letter-spacing:-.02em;}
a{transition:color .25s ease;}
img{max-width:100%;}
::selection{background:rgba(26,118,209,.18);}

/* ---------- Buttons ---------- */
.btn,
.get-quote .btn,
.slider .single-slider .btn,
.pricing-table .btn,
.error-page .btn,
.contact-us .form .btn{
	display:inline-flex;
	align-items:center;
	justify-content:center;
	gap:8px;
	padding:14px 34px !important;
	border-radius:50px !important;
	background:var(--grad) !important;
	color:#fff !important;
	font-weight:600 !important;
	font-size:14px !important;
	letter-spacing:.3px;
	text-transform:none !important;
	border:none !important;
	box-shadow:0 10px 26px rgba(26,118,209,.30);
	transition:transform .35s ease, box-shadow .35s ease, filter .35s ease !important;
	overflow:hidden;
}
.btn:hover,
.get-quote .btn:hover,
.slider .single-slider .btn:hover,
.pricing-table .btn:hover{
	color:#fff !important;
	transform:translateY(-3px);
	box-shadow:0 18px 38px rgba(26,118,209,.42);
	filter:brightness(1.05);
}
.slider .single-slider .btn.primary{background:var(--ink) !important;}
.btn::before,.pricing-table .btn::before{display:none !important;}

/* ---------- Top bar ---------- */
.header .topbar{
	background:var(--ink) !important;
	border:none !important;
	padding:11px 0 !important;
}
.header .topbar .top-link li,
.header .topbar .top-link li a,
.header .topbar .top-contact li,
.header .topbar .top-contact li a{
	color:rgba(255,255,255,.82) !important;
	font-size:13px !important;
}
.header .topbar i{color:var(--brand-2) !important;margin-right:7px;}
.header .topbar .top-contact li a:hover,
.header .topbar .top-link li:hover a{color:#fff !important;}

/* ---------- Header / Nav ---------- */
.header{background:transparent;}
.header .header-inner{
	background:#fff;
	box-shadow:0 4px 24px rgba(20,40,80,.06);
}
.header.sticky .header-inner{
	background:rgba(255,255,255,.85) !important;
	-webkit-backdrop-filter:saturate(180%) blur(14px);
	backdrop-filter:saturate(180%) blur(14px);
	box-shadow:0 8px 30px rgba(20,40,80,.10) !important;
}
.header .nav li a{
	color:var(--ink) !important;
	font-weight:500 !important;
	font-size:15px !important;
}
.header .nav li a:hover,
.header .nav li.active > a{color:var(--brand) !important;}
.header .nav li a::before{
	background:var(--grad) !important;
	height:3px !important;
	border-radius:3px;
}
.logo img{
	max-height:52px;width:auto;height:auto;display:block;
	transition:transform .35s ease;
}
.logo a:hover img{transform:scale(1.03);}

/* ---------- Hero / Slider ---------- */
.slider .single-slider{
	height:680px;
	position:relative;
}
.slider .single-slider::before{
	content:"";
	position:absolute;inset:0;
	background:linear-gradient(90deg,rgba(245,249,254,.96) 0%,rgba(245,249,254,.80) 42%,rgba(245,249,254,.20) 100%);
	z-index:1;
}
.slider .single-slider .container{position:relative;z-index:2;}
.slider .single-slider h1{
	font-size:54px;
	line-height:1.12;
	font-weight:800;
	letter-spacing:-.025em;
	color:var(--ink);
}
.slider .single-slider h1 span{
	color:var(--brand);
	background:var(--grad);
	-webkit-background-clip:text;
	background-clip:text;
	-webkit-text-fill-color:transparent;
}
.slider .single-slider p{
	font-size:17px;
	line-height:1.8;
	color:var(--ink);
	opacity:.78;
	max-width:580px;
	margin-top:22px;
}
.slider .single-slider .text{animation:cdlFadeUp .9s ease both;}
.slider .owl-carousel .owl-nav div{
	background:rgba(255,255,255,.9) !important;
	color:var(--brand) !important;
	border-radius:50% !important;
	box-shadow:var(--shadow-sm);
	transition:all .3s ease;
}
.slider .owl-carousel .owl-nav div:hover{background:var(--grad) !important;color:#fff !important;}

@keyframes cdlFadeUp{from{opacity:0;transform:translateY(26px);}to{opacity:1;transform:none;}}

/* ---------- Section rhythm & titles ---------- */
.section{padding:110px 0;}
.section-title{margin-bottom:58px;}
.section-title h2{
	font-size:38px;
	font-weight:800;
	letter-spacing:-.02em;
	color:var(--ink);
	margin-bottom:14px;
}
.section-title p{
	color:var(--body);
	font-size:16px;
	max-width:640px;
	margin:16px auto 0;
}

/* ---------- Schedule cards ---------- */
.schedule{position:relative;z-index:5;margin-top:-70px;}
.schedule .single-schedule{
	border-radius:var(--radius) !important;
	background:var(--grad) !important;
	box-shadow:var(--shadow);
	overflow:hidden;
}
.schedule .single-schedule .inner{padding:38px 32px;}
.schedule .single-schedule:hover{transform:translateY(-8px);}
.schedule .single-schedule h4{color:#fff;font-size:21px;margin-bottom:8px;}
.schedule .single-schedule span{color:rgba(255,255,255,.92);font-weight:500;}
.schedule .single-schedule p{color:rgba(255,255,255,.85);}
.schedule .single-schedule .icon i{opacity:.16;}

/* ---------- Feature cards ---------- */
.Feautes .single-features{
	background:#fff;
	border:1px solid var(--line);
	border-radius:var(--radius);
	padding:44px 30px;
	box-shadow:var(--shadow-sm);
	text-align:center;
	transition:transform .35s ease, box-shadow .35s ease, border-color .35s ease;
	height:100%;
	margin-bottom:24px;
}
.Feautes .single-features::before,
.Feautes .single-features.last::before{display:none !important;}
.Feautes .single-features:hover{
	transform:translateY(-10px);
	box-shadow:var(--shadow);
	border-color:transparent;
}
.Feautes .single-features .signle-icon{
	width:86px;height:86px;
	margin:0 auto 26px;
	display:flex;align-items:center;justify-content:center;
	border-radius:22px;
	background:var(--grad-soft);
	color:var(--brand);
	font-size:36px;
	transition:all .35s ease;
}
.Feautes .single-features:hover .signle-icon{
	background:var(--grad);
	color:#fff;
	transform:rotate(-6deg);
}
.Feautes .single-features h3{font-size:20px;margin-bottom:10px;}
.Feautes .single-features p{color:var(--body);}

/* ---------- Service / pricing cards ---------- */
.pricing-table{background:var(--soft);}
.pricing-table .single-table{
	background:#fff;
	border:1px solid var(--line);
	border-radius:22px;
	padding:42px 34px;
	box-shadow:var(--shadow-sm);
	position:relative;
	overflow:hidden;
	height:100%;
	margin-bottom:30px;
	transition:transform .35s ease, box-shadow .35s ease, border-color .35s ease;
}
.pricing-table .single-table::before{
	content:"";
	position:absolute;top:0;left:0;right:0;height:5px;
	background:var(--grad);
	transform:scaleX(0);
	transform-origin:left;
	transition:transform .4s ease;
}
.pricing-table .single-table:hover{
	transform:translateY(-10px);
	box-shadow:var(--shadow-lg);
	border-color:transparent;
}
.pricing-table .single-table:hover::before{transform:scaleX(1);}
.pricing-table .single-table .icon{margin-bottom:22px;}
.pricing-table .single-table .icon i{
	width:74px;height:74px;
	display:inline-flex;align-items:center;justify-content:center;
	border-radius:20px;
	background:var(--grad-soft);
	color:var(--brand);
	font-size:34px;
	transition:all .35s ease;
}
.pricing-table .single-table:hover .icon i{background:var(--grad);color:#fff;}
.pricing-table .single-table .title{font-size:22px;font-weight:700;margin-bottom:12px;}
.pricing-table .single-table .price p{color:var(--body);}
.pricing-table .single-table .table-list{margin-top:18px;}
.pricing-table .single-table .table-list li{
	color:var(--body);
	padding:7px 0;
	border-bottom:1px dashed var(--line);
	display:flex;align-items:flex-start;gap:10px;
}
.pricing-table .single-table .table-list li:last-child{border-bottom:none;}
.pricing-table .single-table .table-list li i{
	color:var(--brand);
	background:rgba(26,118,209,.10);
	border-radius:50%;
	width:22px;height:22px;
	display:inline-flex;align-items:center;justify-content:center;
	font-size:11px;flex:0 0 22px;margin-top:3px;
}

/* ---------- Clients ---------- */
.clients.overlay{background:#fff;padding:60px 0;border-top:1px solid var(--line);}
.clients .single-clients img{
	filter:grayscale(100%);
	opacity:.55;
	max-height:64px;
	width:auto;margin:0 auto;
	transition:filter .35s ease, opacity .35s ease, transform .35s ease;
}
.clients .single-clients:hover img{filter:none;opacity:1;transform:scale(1.06);}

/* ---------- Scroll-to-top ---------- */
#scrollUp{
	background:var(--grad) !important;
	border-radius:50% !important;
	box-shadow:var(--shadow) !important;
	width:48px !important;height:48px !important;line-height:48px !important;
}

/* ---------- Footer ---------- */
.footer{
	background:linear-gradient(180deg,#262835 0%,#2c2d3f 100%) !important;
	color:rgba(255,255,255,.66);
}
.footer .footer-top{padding:80px 0 50px;}
.footer .single-footer h2{
	color:#fff;
	font-size:20px;
	margin-bottom:26px;
	position:relative;
	padding-bottom:14px;
}
.footer .single-footer h2::after{
	content:"";
	position:absolute;left:0;bottom:0;
	width:42px;height:3px;border-radius:3px;
	background:var(--grad);
}
.footer .single-footer p,
.footer .single-footer li a{color:rgba(255,255,255,.66) !important;}
.footer .single-footer p b{color:#fff;}
.footer .single-footer li a:hover{color:var(--brand-2) !important;padding-left:4px;}
.footer .single-footer li a i{color:var(--brand-2);}
.footer .single-footer .social li a{
	width:40px;height:40px;line-height:40px;
	display:inline-flex;align-items:center;justify-content:center;
	border-radius:50%;
	background:rgba(255,255,255,.08);
	color:#fff !important;
	transition:all .3s ease;
}
.footer .single-footer .social li a:hover{background:var(--grad);transform:translateY(-3px);}
.footer #mc_embed_signup{background:transparent !important;width:100% !important;}
.footer #mc_embed_signup .mc-field-group label{color:rgba(255,255,255,.66);font-size:13px;}
.footer #mce-EMAIL{
	width:100%;border:1px solid rgba(255,255,255,.16);
	background:rgba(255,255,255,.06);
	color:#fff;border-radius:50px;padding:12px 18px;margin:8px 0 12px;
}
.footer #mce-EMAIL::placeholder{color:rgba(255,255,255,.4);}
.footer #mc-embedded-subscribe{
	background:var(--grad) !important;color:#fff !important;
	border:none;border-radius:50px;padding:12px 28px;font-weight:600;cursor:pointer;
	transition:transform .3s ease, box-shadow .3s ease;
}
.footer #mc-embedded-subscribe:hover{transform:translateY(-2px);box-shadow:0 12px 24px rgba(26,118,209,.4);}
.footer .copyright{background:rgba(0,0,0,.22) !important;border-top:1px solid rgba(255,255,255,.07);}
.footer .copyright .copyright-content p{color:rgba(255,255,255,.6);}

/* ---------- Breadcrumbs / 404 ---------- */
.breadcrumbs{background:var(--grad) !important;}
.breadcrumbs h2,.breadcrumbs .bread-list li,.breadcrumbs .bread-list li a{color:#fff !important;}
.error-page .error-inner h1{
	color:var(--brand);
	background:var(--grad);
	-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;
	font-size:120px;font-weight:800;
}
.error-page .error-inner p{color:var(--body);}

/* ---------- Mobile menu (slicknav) ---------- */
.slicknav_menu{background:transparent;padding:0;}
.slicknav_btn{
	background:transparent !important;
	border:0;
	border-radius:0;
	box-shadow:none !important;
	text-shadow:none !important;
	padding:10px;
	margin:0;
	line-height:1;
	float:right;
}
.slicknav_btn .slicknav_icon{margin:0;float:none;width:auto;height:auto;}
.slicknav_menu .slicknav_icon-bar{
	display:block;
	width:24px;
	height:2px;
	margin:0;
	border-radius:2px;
	background-color:var(--ink) !important;
	box-shadow:none !important;
}
.slicknav_btn .slicknav_icon-bar + .slicknav_icon-bar{margin-top:6px;}
.slicknav_nav{background:#fff;border-radius:12px;box-shadow:var(--shadow);padding:8px;}
.slicknav_nav a{color:var(--ink) !important;border-radius:8px;padding:10px 14px !important;}
.slicknav_nav a:hover{background:var(--soft) !important;color:var(--brand) !important;}

/* ---------- Responsive ---------- */
html{overflow-x:clip;}
body{overflow-x:clip;}

@media (max-width:991px){
	.header .main-menu{display:none !important;}
	.slicknav_menu{display:block !important;}
	.header .header-inner .get-quote{display:none;}
	.header .header-inner{padding-bottom:14px;}
	.header .header-inner .inner > .row > [class*="col-"]:first-child{
		display:flex;
		align-items:center;
		justify-content:space-between;
		gap:12px;
		flex-wrap:wrap;
		position:relative;
	}
	.header .logo{
		float:none !important;
		margin-top:0 !important;
		flex:1 1 auto;
		min-width:0;
	}
	.header .mobile-nav{
		flex:0 0 auto;
		margin-left:auto;
	}
	.header .mobile-nav .slicknav_menu{width:100%;max-width:100%;}
	.slicknav_btn{
		float:none !important;
		margin:0 !important;
		padding:8px;
		display:inline-flex;
		align-items:center;
		justify-content:center;
	}
	.header .slicknav_nav{
		position:absolute;
		left:0;
		right:0;
		top:100%;
		margin-top:8px !important;
		width:auto;
		flex:none;
		z-index:1002;
	}
	.slider .single-slider{height:560px;}
	.slider .single-slider h1{font-size:40px;}
	.section{padding:80px 0;}
	.section-title h2{font-size:30px;}
	.section-title{padding-left:16px;padding-right:16px;}
	.schedule{margin-top:0;}
	.schedule .single-schedule{margin-bottom:24px;}
	.header .nav li a{font-size:14px !important;padding:20px 8px !important;}
}
@media (max-width:575px){
	.logo img{max-height:44px;}
	.slider .single-slider{height:520px;}
	.slider .single-slider h1{font-size:32px;}
	.slider .single-slider::before{background:linear-gradient(90deg,rgba(245,249,254,.96),rgba(245,249,254,.85));}
	.section-title h2{font-size:26px;}
	.error-page .error-inner h1{font-size:84px;}
	.hero-cta .btn,.hero-cta .btn-ghost-light{width:100%;justify-content:center;text-align:center;}
	.cta-band{padding:64px 0;}
	.cta-band .btns{flex-direction:column;align-items:stretch;}
	.cta-band .btns .btn,.cta-band .btns .btn-ghost{justify-content:center;width:100%;}
	.pricing-table .single-table .price p{min-height:0;}
	.footer-top .single-footer{margin-bottom:36px;}
}
