/* Global styles */
 :root {
     --primary-color: #3bb6b6;
     /* Changed to your first branding color */
     --secondary-color: #40e298;
     /* Changed to your second branding color */
     --accent-color: #439321;
     /* Added your third branding color */
     --dark: #1f2937;
     --light: #f3f4f6;
 }

 /* ... existing code ... */

 /* Navigation */
 .navbar {
     transition: all 0.3s ease;
     backdrop-filter: blur(10px);
     -webkit-backdrop-filter: blur(10px);
     background: rgba(255, 255, 255, 0.95) !important;
     z-index: 1030;
 }

 .navbar.scrolled {
     background: rgba(59, 182, 182, 0.85) !important;
     /* Updated to use primary color */
     box-shadow: 0 4px 20px rgba(0, 0, 0, 0.08);
 }

 /* Modern button styles */
 .btn {
     padding: 0.8rem 1.5rem;
     border-radius: 8px;
     transition: transform 0.2s ease, box-shadow 0.2s ease;
 }

 .btn:hover {
     transform: translateY(-2px);
     box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
 }

 /* Card styles */
 .card {
     border: none;
     border-radius: 12px;
     transition: transform 0.3s ease, box-shadow 0.3s ease;
     background: rgba(255, 255, 255, 0.95);
     backdrop-filter: blur(10px);
 }

 .card:hover {
     transform: translateY(-5px);
     box-shadow: 0 8px 24px rgba(0, 0, 0, 0.12);
 }

 /* Modern form elements */
 input, textarea, select {
     border: 1.5px solid #e5e7eb;
     border-radius: 8px;
     padding: 0.75rem 1rem;
     transition: border-color 0.3s ease, box-shadow 0.3s ease;
 }

 input:focus, textarea:focus, select:focus {
     border-color: var(--primary-color);
     box-shadow: 0 0 0 4px rgba(59, 182, 182, 0.1);
     outline: none;
 }

 /* Footer */
 .footer {
     background: linear-gradient(to right, var(--dark), #2d3748);
     color: var(--light);
 }

 .footer-links a {
     transition: all 0.3s ease;
     position: relative;
     padding-bottom: 2px;
 }

 .footer-links a:hover {
     color: var(--secondary-color) !important;
     transform: translateX(5px);
 }

 .footer-links a::after {
     content: '';
     position: absolute;
     width: 0;
     height: 2px;
     bottom: 0;
     left: 0;
     background-color: var(--secondary-color);
     transition: width 0.3s ease;
 }

 .footer-links a:hover::after {
     width: 100%;
 }

 /* Modern layout utilities */
 .glass-effect {
     background: rgba(255, 255, 255, 0.7);
     backdrop-filter: blur(10px);
     border: 1px solid rgba(255, 255, 255, 0.2);
     border-radius: 16px;
 }

 /* Animations */
 @keyframes fadeIn {
     from { opacity: 0; transform: translateY(20px); }
     to { opacity: 1; transform: translateY(0); }
 }

 .animate-fade-in {
     animation: fadeIn 0.6s ease forwards;
 }

 /* Responsive text */
 html {
     font-size: 16px;
 }

 @media (max-width: 768px) {
     html {
         font-size: 14px;
     }
 }

 /* Modern scrollbar */
 ::-webkit-scrollbar {
     width: 8px;
 }

 ::-webkit-scrollbar-track {
     background: #f1f1f1;
 }

 ::-webkit-scrollbar-thumb {
     background: var(--primary-color);
     border-radius: 4px;
 }

 ::-webkit-scrollbar-thumb:hover {
     background: var(--secondary-color);
 }

 /* Hero Section Styles */
 .hero-section {
     background-image: url('img/banner.jpg');
     background-size: cover;
     background-position: center;
     padding: 6rem 0;
 }

.slogan{
    font-size: 3rem;
    font-weight: bold;
    font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
    color: #fff;
    text-shadow: 4px 4px 4px rgba(0, 0, 0, 0.5);
}

 .z-2 {
     z-index: 2;
 }

 .py-7 {
     padding-top: 7rem;
     padding-bottom: 7rem;
 }

 .min-vh-75 {
     min-height: 75vh;
 }

 .text-white-75 {
     color: rgba(255, 255, 255, 0.75);
 }

 .animation-delay-1 {
     animation-delay: 0.2s;
 }

 .animation-delay-2 {
     animation-delay: 0.4s;
 }

 .animation-delay-3 {
     animation-delay: 0.6s;
 }

 .floating-animation {
     animation: floating 3s ease-in-out infinite;
 }

 @keyframes floating {
     0% { transform: translateY(0px); }
     50% { transform: translateY(-20px); }
     100% { transform: translateY(0px); }
 }

 .hero-shape {
     position: absolute;
     bottom: 0;
     left: 0;
     width: 100%;
     overflow: hidden;
     line-height: 0;
 }

 .navbar-brand img {
     height: 50px;
     padding-left: 10px;
 }
 .slogan-text{
    font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
    font-size: 1.5rem;
    font-weight: bold;
        color: #fff;
            text-shadow: 4px 4px 4px rgba(0, 0, 0, 0.5);
 }
 .h2{
    font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
    font-size: 1.5rem;
    font-weight: bold;
 }

 .nav-link{
    font-weight: 500;
    font-size: 1.1rem;
    font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
 }

 /* Navbar text color and dropdown positioning */
 .navbar-dark .navbar-nav .nav-link {
     color: var(--dark) !important;
     font-weight: 500;
 }

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

 /* Ensure dropdowns appear above banner */
 .dropdown-menu {
     z-index: 1030;
     margin-top: 0;
 }

 /* Active link style */
 .navbar-dark .navbar-nav .nav-link.active {
     color: var(--primary-color) !important;
 }

 /* Dropdown hover effect */
 .dropdown:hover .dropdown-menu {
     display: block;
     animation: fadeIn 0.3s ease;
 }

 /* Responsive Styles */
 @media (max-width: 1200px) {
     .container {
         max-width: 95%;
     }
 }

 @media (max-width: 992px) {
     .navbar-brand img {
         height: 40px;
     }
     
     .hero-section {
         padding: 4rem 0;
     }
     
     .slogan {
         font-size: 2.5rem;
     }
     
     .slogan-text {
         font-size: 1.2rem;
     }
     
     .card {
         margin-bottom: 2rem;
     }
 }

 @media (max-width: 768px) {
     html {
         font-size: 14px;
     }
     
     .navbar {
         padding: 0.5rem 1rem;
     }
     
     .navbar-brand img {
         height: 35px;
     }
     
     .hero-section {
         padding: 3rem 0;
     }
     
     .slogan {
         font-size: 2rem;
     }
     
     .slogan-text {
         font-size: 1rem;
     }
     
     .btn {
         padding: 0.6rem 1.2rem;
     }
     
     .contact-form-wrapper,
     .contact-info {
         padding: 1.5rem !important;
     }
     
     .min-vh-75 {
         min-height: 60vh;
     }
 }

 @media (max-width: 576px) {
     .navbar-brand img {
         height: 30px;
     }
     
     .hero-section {
         padding: 2rem 0;
     }
     
     .slogan {
         font-size: 1.75rem;
     }
     
     .btn-lg {
         padding: 0.5rem 1rem;
         font-size: 0.9rem;
     }
     
     .card {
         margin: 1rem 0;
     }
     
     .contact-section .col-lg-6,
     .contact-section .col-lg-4 {
         padding: 0 1rem;
     }
     
     .py-7 {
         padding-top: 4rem;
         padding-bottom: 4rem;
     }
 }

 /* Responsive Navigation */
 @media (max-width: 992px) {
     .navbar-collapse {
         background: rgba(255, 255, 255, 0.98);
         padding: 1rem;
         border-radius: 8px;
         margin-top: 0.5rem;
     }
     
     .dropdown-menu {
         border: none;
         background: transparent;
         padding-left: 1rem;
     }
     
     .navbar-nav .nav-item {
         margin: 0.5rem 0;
     }
 }

 /* Responsive Cards */
 @media (max-width: 768px) {
     .card-img-top {
         height: 200px;
         object-fit: cover;
     }
     
     .card-body {
         padding: 1.25rem;
     }
     
     .card-text {
         font-size: 0.9rem;
     }
 }

 /* Responsive Contact Form */
 @media (max-width: 768px) {
     .contact-form input,
     .contact-form textarea,
     .contact-form select {
         font-size: 0.9rem;
         padding: 0.5rem 0.75rem;
     }
     
     .contact-info-item {
         padding: 0.75rem 0;
     }
     
     .icon-wrapper {
         margin-bottom: 0.5rem !important;
     }
 }