

/* header */

  .nav-link {
                        padding: .75rem 0;
                        font-weight: 500;
                        color: #4b5563;
                        position: relative;
                        transition: color .2s ease;
                        white-space: nowrap
                    }

                    .nav-link::after {
                        content: '';
                        position: absolute;
                        left: .75rem;
                        right: .75rem;
                        bottom: 0;
                        height: 2px;
                        background: linear-gradient(to right,#1e4b8e,#00c896);
                        transform: scaleX(0);
                        transition: transform .3s ease
                    }

                    .nav-link:hover::after {
                        transform: scaleX(1)
                    }

                    .nav-btn {
                        display: flex;
                        align-items: center;
                        gap: .25rem;
                        padding: .75rem 0;
                        font-weight: 500;
                        color: #4b5563;
                        position: relative;
                        transition: color .2s ease;
                        white-space: nowrap
                    }

                    .nav-btn::after {
                        content: '';
                        position: absolute;
                        left: .75rem;
                        right: .75rem;
                        bottom: 0;
                        height: 2px;
                        background: linear-gradient(to right,#1e4b8e,#00c896);
                        transform: scaleX(0);
                        transition: transform .3s ease
                    }

                    .nav-btn:hover::after {
                        transform: scaleX(1)
                    }

                    .dropdown-menu {
                        position: absolute;
                        top: 100%;
                        left: .5rem;
                        background: #fff;
                        border-radius: .75rem;
                        box-shadow: 0 20px 40px rgba(0,0,0,.1),0 0 20px rgba(30,75,142,.1);
                        min-width: 200px;
                        padding: .5rem 0;
                        transition: all .3s cubic-bezier(.4,0,.2,1);
                        transform-origin: top center;
                        border: 1px solid #f3f4f6
                    }

                    .dropdown-item {
                        display: block;
                        padding: .625rem 1.25rem;
                        color: #374151;
                        position: relative;
                        overflow: hidden;
                        transition: background-color .2s ease;
                        font-size: .9375rem
                    }

                    .dropdown-item:hover {
                        background-color: #f8fafc;
                        color: #1e4b8e
                    }

                    .mega-menu {
                        position: absolute;
                        top: 100%;
                        left: 50%;
                        transform: translateX(-50%);
                        background: #fff;
                        border-radius: 1rem;
                        box-shadow: 0 25px 50px rgba(0,0,0,.15),0 0 30px rgba(30,75,142,.1);
                        width: 1140px;
                        padding: 1.5rem;
                        margin-top:10px;
                        transition: all .3s cubic-bezier(.4,0,.2,1);
                        transform-origin: top center;
                        border: 1px solid #f3f4f6;
                        max-height: 600px
                    }

                    .mega-scroll {
                        scrollbar-width: thin;
                        scrollbar-color: #cbd5e1 #f1f5f9;
                        max-height: 350px
                    }

                    .mega-scroll::-webkit-scrollbar {
                        width: 5px
                    }

                    .mega-scroll::-webkit-scrollbar-track {
                        background: #f1f5f9;
                        border-radius: 8px
                    }

                    .mega-scroll::-webkit-scrollbar-thumb {
                        background: #cbd5e1;
                        border-radius: 8px
                    }

                    .mega-scroll::-webkit-scrollbar-thumb:hover {
                        background: #94a3b8
                    }

                    .mega-menu-item {
                        display: block;
                        padding: .5rem .5rem;
                        color: #4b5563;
                        position: relative;
                        overflow: hidden;
                        transition: all .2s ease;
                        border-radius: .375rem;
                        font-size: .875rem
                    }

                    .mega-menu-item:hover {
                        background-color: #f0f9ff;
                        color: #1e4b8e;
                        padding-left: .75rem
                    }

                    .mobile-nav-link {
                        display: block;
                        padding: 1rem 1.5rem;
                        font-weight: 500;
                        color: #374151;
                        border-bottom: 1px solid #f3f4f6;
                        transition: all .2s ease
                    }

                    .mobile-nav-link:hover {
                        background-color: #f8fafc;
                        color: #1e4b8e
                    }

                    .mobile-nav-btn {
                        display: flex;
                        justify-content: space-between;
                        align-items: center;
                        width: 100%;
                        padding: 1rem 1.5rem;
                        font-weight: 500;
                        color: #374151;
                        border-bottom: 1px solid #f3f4f6;
                        transition: all .2s ease
                    }

                    .mobile-nav-btn:hover {
                        background-color: #f8fafc;
                        color: #1e4b8e
                    }

                    .mobile-dropdown-link {
                        display: block;
                        padding: .875rem 1.5rem;
                        color: #6b7280;
                        font-size: .9375rem;
                        transition: all .2s ease
                    }

                    .mobile-dropdown-link:hover {
                        background-color: #f0f9ff;
                        color: #1e4b8e;
                        padding-left: 2rem
                    }

                    .mobile-menu-scroll {
                        scrollbar-width: thin;
                        scrollbar-color: #cbd5e1 #f1f5f9
                    }

                    .mobile-menu-scroll::-webkit-scrollbar {
                        width: 4px
                    }

                    .mobile-menu-scroll::-webkit-scrollbar-track {
                        background: #f1f5f9
                    }

                    .mobile-menu-scroll::-webkit-scrollbar-thumb {
                        background: #cbd5e1;
                        border-radius: 4px
                    }

                    @keyframes ping-slow {
                        0% {
                            transform: scale(1);
                            opacity: .3
                        }

                        100%,70% {
                            transform: scale(1.4);
                            opacity: 0
                        }
                    }

                    .animate-ping-slow {
                        animation: ping-slow 1.5s cubic-bezier(0,0,.2,1) infinite
                    }

                    /* header end */


                    /* about page */

@keyframes fadeIn {
                                from {
                                    opacity: 0;
                                    transform: translateY(-8px)
                                }

                                to {
                                    opacity: 1;
                                    transform: translateY(0)
                                }
                            }

                            @keyframes scaleIn {
                                from {
                                    opacity: 0;
                                    transform: scale(.9)
                                }

                                to {
                                    opacity: 1;
                                    transform: scale(1)
                                }
                            }

                            @keyframes fadeUp {
                                from {
                                    opacity: 0;
                                    transform: translateY(10px)
                                }

                                to {
                                    opacity: 1;
                                    transform: translateY(0)
                                }
                            }

                            @keyframes ping {
                                100%,75% {
                                    transform: scale(2);
                                    opacity: 0
                                }
                            }

                            .animate-fadeIn {
                                animation: fadeIn .3s ease-out
                            }
                       