/**********************************
 ** Golden Sparrow Technology - premium theme layer
 ** Carries the home banner's blue-to-cyan gradient across the whole site.
 ** Loaded after style.css and responsive.css.
 **********************************/
:root {
	--gs-blue: #5b86e5;
	--gs-cyan: #36d1dc;
	--gs-deep: #3f6fd8;
	--gs-navy: #0b1736;
	--gs-navy-2: #10224d;
	--gs-tint: #f3f7fd;
	--gs-gradient: linear-gradient(135deg, #5b86e5 0%, #36d1dc 100%);
	--gs-gradient-dark: linear-gradient(135deg, #0b1736 0%, #10224d 60%, #143067 100%);
	--gs-shadow: 0 10px 30px rgba(63, 111, 216, 0.12);
	--gs-shadow-hover: 0 18px 40px rgba(63, 111, 216, 0.22);
}

::selection {
	background: var(--gs-blue);
	color: #ffffff;
}

h1, h2, h3, h4, h5, h6 {
	color: var(--gs-navy);
}

/* Serif display headings echo the logo's classic lettering; body and card titles stay sans */
h1, h2 {
	font-family: 'Playfair Display', Georgia, serif;
	font-weight: 700;
	letter-spacing: -0.3px;
}

/* Banner highlight ("IT Solutions"): gold instead of the template's yellow-green */
.gradient-color-text {
	color: #f6cf6a;
	background-image: linear-gradient(90deg, #fff3c4 0%, #f6cf6a 45%, #e8b04a 100%);
}

.bg-grey {
	background-color: var(--gs-tint);
}

/* Section titles */
.sub-title {
	display: inline-block;
	background: var(--gs-gradient);
	-webkit-background-clip: text;
	background-clip: text;
	-webkit-text-fill-color: transparent;
	letter-spacing: 2px;
}

/* On dark or image backgrounds gradient text fades out; use solid light cyan */
.hire-section .sub-title,
.home-section .sub-title,
.footer-subscribe-wrapper .sub-title {
	background: none;
	-webkit-text-fill-color: #9bf1f6;
	color: #9bf1f6;
}

.section-title h2::after {
	content: "";
	display: block;
	width: 60px;
	height: 3px;
	margin: 18px auto 0;
	border-radius: 3px;
	background: var(--gs-gradient);
}

/* Buttons */
.default-btn {
	background: var(--gs-gradient);
	box-shadow: 0 10px 25px rgba(54, 140, 220, 0.35);
}

.default-btn:hover, .default-btn:focus {
	transform: translateY(-2px);
	box-shadow: 0 14px 30px rgba(54, 140, 220, 0.45);
}

/* On the gradient banner a gradient button disappears, so use deep navy */
.home-section .default-btn {
	background: var(--gs-navy);
	box-shadow: 0 10px 25px rgba(11, 23, 54, 0.35);
}

.default-btn span, .default-btn-one span {
	background-color: var(--gs-navy);
}

.default-btn-one {
	color: var(--gs-deep);
	box-shadow: 0 10px 25px rgba(11, 23, 54, 0.15);
}

.newsletter-form button {
	background: var(--gs-gradient);
}

.newsletter-form button:hover {
	background: var(--gs-navy);
}

.go-top {
	background: var(--gs-gradient);
	box-shadow: 0 8px 20px rgba(54, 140, 220, 0.35);
}

.go-top::before {
	background: var(--gs-navy);
}

/* Header: frosted white bar once the page scrolls */
.navbar-area.is-sticky {
	background-color: rgba(255, 255, 255, 0.92) !important;
	-webkit-backdrop-filter: blur(12px);
	backdrop-filter: blur(12px);
	box-shadow: 0 6px 30px rgba(11, 23, 54, 0.08);
}

/* Cards */
.single-services-item {
	border-radius: 14px;
	border: 1px solid rgba(91, 134, 229, 0.08);
	box-shadow: var(--gs-shadow);
	overflow: hidden;
}

.single-services-item::after {
	content: "";
	position: absolute;
	left: 0;
	top: 0;
	width: 100%;
	height: 4px;
	background: var(--gs-gradient);
	transform: scaleX(0);
	transform-origin: left;
	transition: transform 0.4s ease;
}

.single-services-item:hover {
	box-shadow: var(--gs-shadow-hover);
}

.single-services-item:hover::after {
	transform: scaleX(1);
}

.services-icon i {
	background: var(--gs-gradient);
	-webkit-background-clip: text;
	background-clip: text;
	-webkit-text-fill-color: transparent;
}

.blog-item {
	border-radius: 14px;
	box-shadow: var(--gs-shadow);
}

.blog-item:hover {
	box-shadow: var(--gs-shadow-hover);
}

.single-testimonial {
	border-radius: 14px;
}

/* Work process tabs */
.process-list-tab .tabs li.current a,
.process-list-tab .tabs li:hover a {
	background: var(--gs-gradient) !important;
	color: #ffffff !important;
	box-shadow: 0 10px 25px rgba(54, 140, 220, 0.3);
}

/* Image banners: tint them with the brand gradient */
.hire-section::before,
.page-title-area::before {
	opacity: 0.88;
	background: linear-gradient(135deg, rgba(11, 23, 54, 0.95) 0%, rgba(63, 111, 216, 0.85) 60%, rgba(54, 209, 220, 0.8) 100%);
}

/* Footer */
.footer-subscribe-wrapper {
	background: var(--gs-gradient-dark);
}

.copyright-area {
	background-color: #08112a;
	border-top: 1px solid rgba(255, 255, 255, 0.06);
}

/* Footer animation: slow-moving gradient, drifting glows, a light sweep along the top edge */
.footer-subscribe-wrapper {
	overflow: hidden;
	background: linear-gradient(120deg, #0b1736, #10224d, #143067, #0d1d45, #0b1736);
	background-size: 300% 300%;
	animation: gs-footer-shift 18s ease-in-out infinite;
}

.footer-subscribe-wrapper::before,
.footer-subscribe-wrapper::after {
	content: "";
	position: absolute;
	z-index: -1;
	border-radius: 50%;
	filter: blur(70px);
	opacity: 0.45;
	pointer-events: none;
}

.footer-subscribe-wrapper::before {
	width: 380px;
	height: 380px;
	left: -100px;
	top: 25%;
	background: radial-gradient(circle, #5b86e5 0%, transparent 70%);
	animation: gs-footer-drift 16s ease-in-out infinite;
}

.footer-subscribe-wrapper::after {
	width: 320px;
	height: 320px;
	right: -80px;
	bottom: -60px;
	background: radial-gradient(circle, #36d1dc 0%, transparent 70%);
	animation: gs-footer-drift 20s ease-in-out infinite reverse;
}

.footer-area {
	position: relative;
}

.footer-area::before {
	content: "";
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 1px;
	background: linear-gradient(90deg, transparent 0%, rgba(54, 209, 220, 0.9) 50%, transparent 100%);
	background-size: 40% 100%;
	background-repeat: no-repeat;
	animation: gs-footer-sweep 6s linear infinite;
}

/* Logo light sweep */
.footer-logo {
	position: relative;
	overflow: hidden;
}

.footer-logo::after {
	content: "";
	position: absolute;
	top: 0;
	left: -60%;
	width: 40%;
	height: 100%;
	background: linear-gradient(100deg, transparent 0%, rgba(255, 255, 255, 0.55) 50%, transparent 100%);
	transform: skewX(-20deg);
	animation: gs-footer-shine 5s ease-in-out infinite;
}

/* Links slide and gain a cyan dash on hover */
.single-footer-widget .footer-quick-links li a {
	position: relative;
	display: inline-block;
	transition: color 0.3s, transform 0.3s;
}

.single-footer-widget .footer-quick-links li a::before {
	content: "";
	position: absolute;
	left: -16px;
	top: 50%;
	width: 0;
	height: 2px;
	background: var(--gs-cyan);
	transition: width 0.3s;
}

.single-footer-widget .footer-quick-links li a:hover {
	transform: translateX(14px);
	color: var(--gs-cyan);
}

.single-footer-widget .footer-quick-links li a:hover::before {
	width: 10px;
}

/* Social icons lift; contact icons glow softly */
.single-footer-widget .footer-social i:hover {
	transform: translateY(-4px);
	box-shadow: 0 8px 20px rgba(54, 209, 220, 0.4);
}

.footer-info-contact i {
	background: var(--gs-gradient);
	-webkit-background-clip: text;
	background-clip: text;
	-webkit-text-fill-color: transparent;
	animation: gs-footer-glow 3s ease-in-out infinite;
}

.footer-info-contact:nth-child(3) i { animation-delay: 0.6s; }
.footer-info-contact:nth-child(4) i { animation-delay: 1.2s; }

@keyframes gs-footer-shift {
	0%, 100% { background-position: 0% 50%; }
	50% { background-position: 100% 50%; }
}

@keyframes gs-footer-drift {
	0%, 100% { transform: translate(0, 0) scale(1); }
	50% { transform: translate(120px, -60px) scale(1.15); }
}

@keyframes gs-footer-sweep {
	0% { background-position: -40% 0; }
	100% { background-position: 140% 0; }
}

@keyframes gs-footer-shine {
	0%, 60% { left: -60%; }
	100% { left: 130%; }
}

@keyframes gs-footer-glow {
	0%, 100% { filter: drop-shadow(0 0 0 rgba(54, 209, 220, 0)); }
	50% { filter: drop-shadow(0 0 8px rgba(54, 209, 220, 0.7)); }
}

@media (prefers-reduced-motion: reduce) {
	.footer-subscribe-wrapper,
	.footer-subscribe-wrapper::before,
	.footer-subscribe-wrapper::after,
	.footer-area::before,
	.footer-logo::after,
	.footer-info-contact i {
		animation: none;
	}
}

.single-footer-widget .footer-social i {
	border-radius: 50%;
	transition: 0.3s;
}

.single-footer-widget .footer-social i:hover {
	background: var(--gs-gradient);
	color: #ffffff;
}

.copyright-area p a:hover,
.single-footer-widget a:hover {
	color: var(--gs-cyan);
}

/* Contact form */
.main-form .form-control,
.contact-form .form-control {
	border-radius: 10px;
	border: 1px solid rgba(91, 134, 229, 0.18);
	background-color: var(--gs-tint);
}

.main-form .form-control:focus,
.contact-form .form-control:focus {
	border-color: var(--gs-blue);
	background-color: #ffffff;
	box-shadow: 0 0 0 4px rgba(91, 134, 229, 0.12);
}

/* Suppliers & Clients tags */
.network-section .network-tag {
	background-color: rgba(91, 134, 229, 0.1);
	color: var(--gs-deep);
}