.loader {
            max-width: 200px;
            width: 100%;
        }

        .zoom-in {
            animation-delay: 0.3s;
            animation: zoomIn 0.6s ease-out   alternate;
        }
        @keyframes zoomIn {
            from {
                transform: scale(0.5);
            }
            to {
                transform: scale(1);
            }
        }

        .zoom-in-txt {
            animation-delay:0.7s;
            animation: zoomIn 0.6s ease-out  alternate;
        }
        @keyframes zoomIn {
            from {
                transform: scale(0);
            }
            to {
                transform: scale(1);
            }
        }

        .zoom-in-big {
            animation: zoomInBig 0.6s ease-out forwards;
        }
        @keyframes zoomInBig {
            from {
                transform: scale(1);
            }
            to {
                transform: scale(2);
            }
        }

        .zoom-out {
            animation: zoomOut 2s forwards;
        }
        @keyframes zoomOut {
            from {
                transform: scale(2) translate(0, 0);
                /* transform: scale(2) ; */
            }
            to {
                /* transform: scale(1) translate(-500px, -180px); */
                transform: scale(1) translate(-150%, -50%);
                /* transform: scale(1) ; */
            }
        }

      
    .bg-gradient-animate {
        animation: bgGradient 0.6s forwards;
    }
    @keyframes bgGradient {
        from {
            background: #000000;
        }
        to {
            background: linear-gradient(to bottom, #001B32 43%, #000000 100%);
        }
    }

    .second-logo {
        position: fixed; 
        top: 0;
        right: 0;
        width: 100vw;
        height: 100vh; 
        display: flex;
        justify-content: center;
        align-items: center;
        transform: translate(100%, -100%); 
        z-index: 20;
        opacity: 0;
    }
    .second-logo img {
        position: absolute;
        /* max-width: 300px; */
        opacity: 0;
        /* transition: opacity 0.3s ease-in; */
    }

    .second-logo img.active {
        opacity: 1;
    }

    .second-logo.animate-logo {
        animation: logoMoveToCenter 2s ease-in forwards;
    }
    


    /* @keyframes logoMoveToCenter {
        from {
            transform: translate(100%, -100) scale(0);
            background: #001B32;
          
        }
        to {
            transform: translate(0%, 0%) scale(1); 
            opacity: 1;
            background: #001B32;
        }
    } */

     @keyframes logoMoveToCenter {
        from {
            transform:  scale(0);
            /* background: #001B32; */
            /* opacity: 0;  */
        }
        to {
            transform: scale(1); 
            opacity: 1;
            /* background: #001B32; */
        }
    }





    .typewriter p {
        overflow: hidden;
        border-right: .15em solid orange;
        white-space: pre-wrap;
        margin: 0 auto;
        letter-spacing: .15em;
        max-width: 100%;
        word-wrap: break-word;
    }

    .typewriter p.typing {
        animation: blink-caret .75s step-end infinite;
    }

    /* The typewriter cursor effect */
    @keyframes blink-caret {
        from, to { border-color: transparent }
        50% { border-color: orange; }
    }

    /* Logo zoom-in from left animation */
    .logo-zoom-in-left {
        animation: logoZoomInLeft 0.4s ease-out forwards;
    }

    @keyframes logoZoomInLeft {
        from {
            transform: scale(0.5) translateX(-100px);
            opacity: 0;
        }
        to {
            transform: scale(1) translateX(0);
            opacity: 1;
        }
    }

    .website-title-animation{
        animation: websiteTitle 0.6s ease-out forwards;
    }

    @keyframes websiteTitle {
        from {
            transform: scale(2) translateX(0);
            opacity: 1;
        }
        to {
            transform: scale(1) translateX(0);
            opacity: 1;
        }
    }


    /* Tech icons fade-in animation */
    .tech-icons {
        opacity: 0;
        transition: opacity 0.6s ease-out, transform 0.6s ease-out;
    }

    .tech-icons.icons-fade-in {
        opacity: 1;
    }

    /* Contact Us Animation */
    .contactUs-animation {
        opacity:1;
        background-color: #06273E;
        border: 2px solid #06273E0D;
    }

    .contactUs-animation.animate-row {
        opacity:1;
        background: #06273E;
        border: 2px solid #06273E0D;
        transition: all 1s ease-in;
    }
 
    .contactUs-animation .col-md-6 {
        opacity: 0;
    }

    .contactUs-animation.animate {
        border: none;
        filter: blur(0px);
    }
    .contact-bg{
        background: #FFFEFE12;
    }
    .contactUs-animation.animate .col-md-6 {
        opacity: 1;
        
        transition: all 0.8s ease-in;
    } 
 
    .header-animation{
        animation: logoZoomInRight 0.4s ease-out forwards;
    }
    @keyframes logoZoomInRight {
        from {
            transform: scale(0.5) translateX(100px);
            opacity: 0;
        }
        to {
            transform: scale(1) translateX(0);
            opacity: 1;
        }
    }

    .logo-animation{
        /* width: 100vw !important; */
        animation: logoZoomInLeft 0.4s ease-out forwards;
    }

    @keyframes logoZoomInLeft {
        from {
            transform:   translate(-50px, -10px);
            opacity: 0;
        }
        to {
            transform:  translate(0,0);
            opacity: 1;
        }
    }

   


    .zoom-in-bottom {
        animation: zoomInBottom 0.4s ease-out forwards;
    }
   

    @keyframes zoomInBottom {
        from {
            transform: scale(0) translateY(200px);
            opacity: 0;
        }
        to {
            transform: scale(1) translateY(1);
            opacity: 1;
        }
    }

    .zoom-title {
        animation: zoomTitle 0.8s ease-out forwards;
    }

    @keyframes zoomTitle {
        from {
            transform: scale(0.5) translateY(-100px);
            opacity: 0;
        }
        to {
            transform: scale(1) translateY(1);
            opacity: 1;
        }
    }

    .zoom-in-top {
      animation: zoomInFromTop 1s ease-out forwards;
    }

    /* Animation keyframes */
    @keyframes zoomInFromTop {
      0% {
        transform: scale(1.5) translateY(-100px); /* Start small and above the viewport */
        opacity: 0;
      }
      100% {
        transform: scale(1) translateY(0); /* End at normal size and position */
        opacity: 1;
      }
    }


    
    .from-bottom {
        animation: fromBottom 0.6s ease-out forwards;
    }

    @keyframes fromBottom {
        from {
            transform: scale(0.5) translateY(350px);
            opacity: 0;
        }
        to {
            transform: scale(1) translateY(0);
            opacity: 1;
        }
    }

    

    .social-media.animate {
        animation: socialMediaAnimation 0.6s ease-out forwards;
    }

      @keyframes socialMediaAnimation {
        from {
            transform:  translateX(200px);
            opacity: 0;
        }
        to {
            transform: translateX(0);
            opacity: 1;
        }
    }


    @keyframes rotateOnce {
    from {
      transform: rotateY(-90deg);
    }
    to {
      transform: rotateY(0deg);
    }
  }

  .rotate-once {
    animation: rotateOnce 0.4s ease-out 1;
    transform-style: preserve-3d;
  }

    .footer-icons.animate {
        animation: slideUpFromBottom 1.2s cubic-bezier(0.25, 0.46, 0.45, 0.94) forwards;
        transform: translateY(100vh);
        opacity: 0;
    }

    @keyframes slideUpFromBottom {
        0% {
            transform: translateY(100vh);
            opacity: 0;
        }
        20% {
            opacity: 1;
        }
        100% {
            transform: translateY(0);
            opacity: 1;
        }
    }

    .footer-icons.animate a {
        display: inline-block;
        transition: transform 0.3s ease;
        animation: iconFadeIn 0.6s ease forwards;
        opacity: 0;
    }

    .footer-icons.animate a:nth-child(1) { animation-delay: 0.3s; }
    .footer-icons.animate a:nth-child(2) { animation-delay: 0.45s; }
    .footer-icons.animate a:nth-child(3) { animation-delay: 0.6s; }
    .footer-icons.animate a:nth-child(4) { animation-delay: 0.75s; }
    .footer-icons.animate a:nth-child(5) { animation-delay: 0.9s; }

    @keyframes iconFadeIn {
        0% {
            opacity: 0;
            transform: translateY(20px) scale(0.8);
        }
        100% {
            opacity: 1;
            transform: translateY(0) scale(1);
        }
    }




.section-fade-out {
    opacity: 0;
    transition: opacity 0.8s ease-in-out;
}

.description-animate {
    animation: descriptionZoomOut 0.8s ease-out forwards;
}

@keyframes descriptionZoomOut {
    0% {
        transform: scale(1);
        opacity: 1;
    }
    100% {
        transform: scale(1.5); /* Scale down to half size */
        opacity: 0; /* Fade out completely */
    }
}