/* Footer Section */
footer {
    padding: 20px; /* Padding for the footer */
    background-color: #333; /* Dark background for the footer */
    color: #fff; /* White text color */
}

.footer-container {
    display: flex; /* Use flexbox for layout */
    justify-content: space-between; /* Space items evenly */
    align-items: center; /* Center align items vertically */
    max-width: 1200px; /* Limit the width of the container */
    margin: auto; /* Center the container */
}

.footer-info p {
    margin: 20px 0; /* Space between paragraphs */
    text-align: left; /* Center the text */
    font-weight: bold;
    font-size: 1.2rem;
}

.social-media {
    display: flex; /* Use flexbox for social media icons */
    gap: 20px; /* Space between icons */
}

.social-media img {
    width: 40px; /* Size of the social media icons */
    height: auto; /* Maintain aspect ratio */
    transition: transform 0.3s; /* Transition for hover effect */
}

.social-media img:hover {
    transform: scale(1.1); /* Slightly enlarge icons on hover */
}

/* Small screens: stack footer info and social media */
@media (max-width: 768px) {
    .footer-container {
        flex-direction: column; /* stack content vertically */
        align-items: center;    /* center horizontally */
        text-align: center;     /* center text */
        gap: 20px;              /* spacing between info and icons */
    }

    .footer-info p {
        text-align: center;     /* center each line */
        margin: 5px 0;          /* reduce vertical spacing */
        font-size: 1rem;        /* slightly smaller font */
    }

    .social-media {
        justify-content: center; /* center icons */
        gap: 15px;               /* slightly smaller gap for mobile */
    }

    .social-media img {
        width: 35px;             /* slightly smaller icons */
    }
}
