@media screen and (max-width: 992px) {
    .banner-title {
        font-size: 50px;
    }

    .banner-description {
        font-size: 1.2rem;
    }

    .about-images .main-image {
        width: 100%;
    }

    .about-images .secondary-image {
        width: 70%;
    }
}



/* Responsive Adjustments */
@media (max-width: 768px) {
    .image-grid {
        height: 400px;
    }

    .contact-form-wrapper,
    .contact-info-wrapper {
        padding: 1.5rem;
    }

    .method-grid {
        grid-template-columns: 1fr;
    }

    .contact-details .value {
        font-size: 1.2rem;
    }

    .section-title {
        font-size: 2rem;
    }

    .contact-info {
        padding: 0;
    }

    .about-images {
        margin-bottom: 60px;
    }
}

@media screen and (max-width: 767px) {

    .banner-title {
        font-size: 30px;
        text-align: center;
    }

    .banner-description {
        font-size: 1rem;
        text-align: center;
    }

    .logo-mozeny {
        width: 100%;
    }
}

@media screen and (max-width: 667px) {
    .banner-padding::after {
        background-repeat: no-repeat;
        bottom: -25px;
    }
}

@media screen and (max-width: 650px) {
}

@media screen and (max-width: 400px) {
    .login-section .form-box {
        padding: 20px;
    }

    .login-section .toggle-panel h1 {
        font-size: 30px;
    }
}


@media screen and (max-width: 650px) {
    .login-section .container {
        height: calc(100vh - 40px);
    }

    .login-section .form-box {
        bottom: 0;
        width: 100%;
        height: 70%;
    }

    .login-section .container.active .form-box {
        right: 0;
        bottom: 30%;
    }

    .login-section .toggle-box::before {
        left: 0;
        top: -270%;
        width: 100%;
        height: 300%;
    }

    .login-section .container.login .toggle-box::before {
        left: 0;
    }

    .login-section .container.login .form-box {
        right: 0;
    }

    .login-section .container.active .toggle-box::before {
        left: 0;
        top: 70%;
    }

    .login-section .container.active .toggle-panel.toggle-left {
        left: 0;
        top: -30%;
    }

    .login-section .toggle-panel {
        width: 100%;
        height: 30%;
    }

        .login-section .toggle-panel.toggle-left {
            top: 0;
        }

        .login-section .toggle-panel.toggle-right {
            right: 0;
            /* bottom: 0%; */
        }

    .login-section .container.active .toggle-panel.toggle-right {
        bottom: 0;
    }
}

@media screen and (max-width: 400px) {
    .login-section .form-box {
        padding: 20px;
    }

    .login-section .toggle-panel h1 {
        font-size: 30px;
    }
}