/* General Styling */
.container {
    display: flex;
    flex-wrap: wrap; /* Ensures wrapping on smaller screens */
    align-items: center;
    justify-content: center; /* Centers items horizontally */
    padding: 20px;
    gap: 20px; /* Adds space between the form and the image */
}

.info-section {
    flex: 1; /* Allow equal space on desktop */
    text-align: center; /* Center align the content */
}

.info-image {
    max-width: 100%;
    height: auto;
}

.form-section {
    flex: 1; /* Allow equal space on desktop */
    max-width: 400px; /* Limit the width of the form */
    padding: 20px;
    box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1); /* Optional: Add shadow for better visibility */
    border-radius: 10px;
    background: #f9f9f9; /* Optional: Light background for form */
}

/* Mobile View */
@media screen and (max-width: 768px) {
    .container {
        flex-direction: column; /* Stack items vertically */
    }

    .info-section, .form-section {
        flex: none;
        max-width: 100%; /* Full width on mobile */
        text-align: center; /* Center align content */
    }

    .form-section {
        margin-top: 20px; /* Add spacing between the image and the form */
    }
}