#typed-text {
    min-height: 1.2em; /* Adjust as needed based on font size */
    display: inline-block;
}

#typed-text::after {
    content: '.';
    animation: blink 1s infinite;
}

@keyframes blink {
    50% {
        opacity: 0;
    }
}

.loading-container {
            text-align: center;
            position: fixed;
            top: 0;
            left: 0;
            width: 100%;
            height: 100%;
            display: flex;
            justify-content: center;
            align-items: center;
            background-color: #F3EEE6;
            z-index: 1000;
            transition: opacity 0.5s ease-out, visibility 0.5s ease-out;
        }

        .loading-container.hidden {
            opacity: 0;
            visibility: hidden;
            pointer-events: none;
        }



        .brand-container {
            position: relative;
            display: inline-block;
            margin-bottom: 30px;
        }

        /* Bird container with parabolic flight animation */
        .bird-container {
            position: absolute;
            top: -50px;
            left: 50%;
            z-index: 2;
            width: 80px;
            height: 80px;
            display: flex;
            justify-content: center;
            perspective: 1000px;
            animation: flyIn 1.8s cubic-bezier(0.2, 0.5, 0.3, 1) forwards;
        }

        /* Shadow effect for the bird */
        .bird-container::after {
            content: '';
            position: absolute;
            bottom: -10px;
            left: 50%;
            transform: translateX(-50%);
            width: 30px;
            height: 5px;
            background: rgba(0, 0, 0, 0.1);
            border-radius: 50%;
            filter: blur(2px);
            opacity: 0;
            animation: shadowAppear 0.3s 1.5s forwards;
        }

        /* Bird image */
        .loader-image.bird {
            height: 50px;
            width: auto;
            transform-origin: center;
            transition: all 0.3s ease;
            position: relative;
        }

        /* Brand image styling */
        .loader-image.brand {
            max-height: 80px;
            width: auto;
            position: relative;
            z-index: 1;
            opacity: 0;
            animation: fadeIn 0.3s 1.5s forwards;
            position: relative;
        }

        @keyframes flyIn {
            0% {
                transform: translateX(-100vw) translateY(60vh) rotate(-30deg) scale(0.8);
                opacity: 0;
            }

            100% {
                transform: translateX(-92.5%) translateY(47.5%) rotate(0deg) scale(0.9);
            }
        }

        @keyframes shadowAppear {
            to {
                opacity: 0.3;
                transform: translateX(-50%) scale(1);
            }
        }

        @keyframes fadeIn {
            to {
                opacity: 1;
            }
        }

        /* Animasi halus untuk kemunculan modal */
        .modal-animate-in {
            animation: modal-show 0.3s ease-out forwards;
        }

        @keyframes modal-show {
            from {
                opacity: 0;
                transform: scale(0.95) translateY(20px);
            }

            to {
                opacity: 1;
                transform: scale(1) translateY(0);
            }
        }

        /* Animasi untuk overlay hitam transparan */
        .overlay-fade-in {
            animation: fade-in 0.3s ease-out forwards;
        }

        @keyframes fade-in {
            from {
                opacity: 0;
            }

            to {
                opacity: 1;
            }
        }