footer {
    background-color: var(--color-08);

    display: flex;
    flex-direction: column;
    justify-content: center;

    padding: var(--space-xxl);
}

.footer-main {
    display: flex;
    flex-direction: column;
    gap: var(--space-xxl);
}

.footer-main-top {
    display: flex;
    align-items: center;

    gap: var(--space-xxl);
}

.footer-main-top-link {
    width: calc((100% / 3) - ((2 * var(--space-xxl)) / 3));
    
    border-radius: var(--radius-l);

    background-color: #1c2436;

    display: flex;
    align-items: center;
    justify-content: space-between;
    
    padding: var(--space-xs) var(--space-xs) var(--space-xs) var(--space-m);
}

.footer-main-top-link-left {
    display: flex;
    flex-direction: column;
}

.footer-main-top-link-left > span:first-child {
    color: var(--color-05);
}

.footer-main-top-link-left > span:last-child {
    color: var(--color-03);
}

.footer-main-top-link-icon-wrapper {
    width: 43px;
    height: 43px;

    border-radius: var(--radius-l);

    background-color: var(--color-01);

    display: flex;
    align-items: center;
    justify-content: center;
}

.footer-main-top-link-icon-wrapper > img {
    height: 18px;
}

.footer-main-bottom {
    display: flex;

    gap: var(--space-xxl);
}

.footer-main-bottom-col {
    width: calc((100% / 3) - ((2 * var(--space-xxl)) / 3));

    display: flex;
    flex-direction: column;
    gap: var(--space-m);
}

.footer-main-bottom-col > .c-heading {
    color: var(--color-03);
}

.footer-main-bottom-col > p {
    color: var(--color-05);
}

.footer-main-bottom-col > ul {
    display: flex;
    flex-direction: column;
    gap: var(--space-xs);
}

.footer-main-bottom-col > ul > li > a {
    color: var(--color-05);

    transition: var(--transition-02);
    -webkit-transition: var(--transition-02);
}

.footer-main-bottom-col > ul > li > a:hover {
    color: var(--color-03);
}

.footer-main-bottom-col > ul.footer-social-media-links > li._mobile-only {
    display: none;
}

.footer-main-bottom-col > ul.footer-social-media-links > li._mobile-only > a {
    height: 18px;
    
    display: flex;
    align-items: center;
    justify-content: center;
}

.footer-main-bottom-col > ul.footer-social-media-links > li._mobile-only > a > img {
    height: 100%;
}

.footer-horizontal-separator {
    width: 100%;
    height: 1px;

    background-color: var(--color-07);
    
    margin: var(--space-xxl) 0;
}

.footer-bottom {
    width: 100%;

    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: var(--space-xs);
}

.footer-bottom > span {
    color: var(--color-05);
}

.footer-bottom > a {
    color: var(--color-05);

    transition: var(--transition-02);
    -webkit-transition: var(--transition-02);
}

.footer-bottom > a:hover {
    color: var(--color-03);
}

@media only screen and (max-width: 1000px) {
    .footer-main-top {
        flex-direction: column;
    }

    .footer-main-top-link {
        width: 100%;
    }
}

@media only screen and (max-width: 800px) {
    .footer-main-bottom {
        flex-direction: column;
    }

    .footer-main-bottom-col {
        width: 100%;
    }

    .footer-main-bottom-col > ul.footer-social-media-links {
        flex-direction: row;
    }
    
    .footer-main-bottom-col > ul.footer-social-media-links > li._desktop-only {
        display: none;
    }
    
    .footer-main-bottom-col > ul.footer-social-media-links > li._mobile-only {
        display: block;
    }
}

@media only screen and (max-width: 600px) {
    .footer-bottom {
        flex-direction: column;
        align-items: flex-start;
    }
}