:root { --cws-orange: #f5821f; --cws-blue: #083c5d; }
body { font-family: "Segoe UI", sans-serif; background: #f9f9f9; }
.navbar {
    background-color: #e6f0fa; /* very light blue */
	transition: all 0.3s ease; /* smooth transition */
  padding: 1rem 1rem !important; /* original padding */
}
/* Shrunk navbar on scroll */
.navbar-shrink {
  padding: 0rem 1rem !important; /* smaller padding */
  box-shadow: 0 2px 6px rgba(0,0,0,0.2); /* optional, emphasize shrink */
}
/* Navbar link hover effect */
.navbar .nav-link {
    position: relative;
    transition: color 0.3s;
	    color: var(--cws-blue);
}

.navbar .nav-link::after {
    content: '';
    position: absolute;
    width: 0;
    height: 2px;
    bottom: 0;
    left: 0;
    background-color: var(--cws-orange);
    transition: width 0.3s;
}

.navbar .nav-link:hover::after {
    width: 100%;
}

.navbar .nav-link:hover {
    color: var(--cws-orange) !important;
}

/* Active link highlighting on scroll */
.navbar .nav-link.active {
    color: var(--cws-orange) !important;
}

/* Mobile menu transition */
.navbar-collapse {
    transition: all 0.5s ease-in-out;
}

.logo-img {
    
	height: 58px; 
}

.hero-btn { background: var(--cws-orange); border: none; }
.hero-btn:hover { background: #d46c17; }

.service-card { border-radius: 12px; transition: 0.3s; padding: 40px; cursor: pointer; text-align: center; background: #fff; box-shadow: 0 5px 15px rgba(0,0,0,0.1);height: 100%;}
.service-card:hover { transform: translateY(-10px); box-shadow: 0 12px 25px rgba(0,0,0,0.2); }
.service-icon { font-size: 70px; color: var(--cws-orange); margin-bottom: 20px; transition: transform 0.3s, color 0.3s;}
.service-card:hover .service-icon { transform: scale(1.2) rotate(10deg); color: var(--cws-blue); }

.project-card { border-radius: 12px; overflow: hidden; transition: 0.3s; margin-bottom: 30px; }
.project-card:hover { transform: scale(1.03); }
.project-card img { width: 100%; height: 220px; object-fit: cover; }

#about { background: var(--cws-blue); color: white; }
.contact-btn { background: var(--cws-blue); color: white; }
.contact-btn:hover { background: #062c45; }
footer { background: var(--cws-blue); color: white; padding: 20px 0; }

.stats-box { text-align: center; padding: 20px; background: rgba(255,255,255,0.1); margin: 10px 0; border-radius: 12px; transition: 0.3s; }
.stats-box:hover { transform: translateY(-5px); background: rgba(255,255,255,0.15); }
.stats-icon { font-size: 40px; color: var(--cws-orange); }
/* Ensure navbar stays above other content */
.sticky-top { z-index: 1020; }
/* Portfolio card hover */
.project-card {
    border-radius: 12px;
    overflow: hidden;
    transition: transform 0.3s, box-shadow 0.3s;
    cursor: pointer;
}
.project-card:hover {
    transform: scale(1.05) translateY(-5px);
    box-shadow: 0 15px 35px rgba(0,0,0,0.25);
}

/* View More Projects button hover */
.btn-hero {
    background: var(--cws-orange);
    color: white;
    transition: transform 0.3s, box-shadow 0.3s;
}
.btn-hero:hover {
    background: #d46c17;
    transform: scale(1.05);
    box-shadow: 0 10px 25px rgba(0,0,0,0.2);
}

@media (max-width: 600px) {
.logo-img{
	width:80%;
	height:auto;
}
}