/* Footer Styles */
body {
    min-height: 100vh;
    display: flex;
    flex-direction: column;
    margin: 0;
}

main {
    flex: 1 0 auto;
}

/* Base footer styles */
footer {
    background-color: var(--indigo-blue);
    color: var(--rice-white);
    padding: 2rem;
    margin-top: 4rem;
    height: 15rem;
    width: 100%;
    flex-shrink: 0;
    box-sizing: border-box;
    clip-path: polygon(
        0% 0%,                  /* Top left corner */
        0% 100%,               /* Left line */
        100% 100%,             /* Bottom right corner */
        100% 7%,              /* Right line */
        55% 7%,               /* Top right notch */
        52% 0%                 /* Top line */
    );
}

.footer-content {
    display: flex;
    justify-content: space-between;
    place-self: center;
    gap: 40rem;
    align-items: flex-start;
    max-width: 1200px;
}

.social-links {
    margin-top: 1rem;
    text-align: left;
}

.social-links h4 {
    margin-bottom: 1rem;
    font-size: 1.1rem;
}

.social-icons {
    display: flex;
    gap: 1.5rem;
}

.social-icons a {
    color: var(--rice-white);
    font-size: 1.5rem;
    transition: transform 0.3s ease;
}

.social-icons a:hover {
    transform: scale(1.1);
}

.footer-links {
    margin-top: 1rem;
    display: flex;
    gap: 2rem;
}

.footer-links a {
    color: var(--rice-white);
    text-decoration: none;
    font-size: 1.2rem;
    transition: opacity 0.3s ease;
}

.footer-links a:hover {
    opacity: 0.8;
}

.copyright-info {
    padding-right: 5rem;
    margin-top: 2rem;
}

.copyright-info a {
    color: var(--rice-white);
    text-decoration: none;
    transition: opacity 0.3s ease;
}

.copyright-info a:hover {
    opacity: 0.8;
}

.copyright {
    text-align: right;
    font-size: 0.75em;
    padding-top: 1rem;
    padding-right: 7rem;
    border-top: 1px solid rgba(255, 255, 255, 0.1);
}

/* Responsive Adjustments */
@media (max-width: 768px) {
    footer {
        padding: 1.5rem 1.5rem 6rem 1.5rem;
        height: 20rem;
        margin-top: 1rem;
    }

    footer::before {
        bottom: 18rem;
    }

    .footer-content {
        gap: 4rem;
        text-align: right;
    }

    .social-links {
        text-align: center;
    }

    .social-icons {
        justify-content: center;
    }

    .footer-links {
        padding-left: 2rem;
        font-size: 8px;
        flex-direction: column;
        gap: 1rem;
    }

    .footer-links a {
        font-size: 0.9rem;
    }

    .copyright-info {
        padding-right: 0;
    }

    .copyright {
        text-align: right;
        padding-right: 1rem;
    }
}
