.footer {
    color: $color--white;

    @include media-query(tablet-portrait) {
        background: linear-gradient(to right, $color--dark-blue 50%, $color--light-blue 50%);
    }

    a {
        color: inherit;
    }

    &__inner {
        padding: 20px;

        @include media-query(tablet-portrait) {
            padding: 40px 80px;
        }

        &:first-child {
            background: $color--dark-blue;
        }

        &:last-child {
            background: $color--light-blue;
        }
    }

    &__heading {
        display: none;

        @include media-query(tablet-portrait) {
            display: block;
            margin: 0 20px 0 0;
        }
    }

    &__social-links {
        a {
            display: flex;
            align-items: center;
        }

        h4 {
            margin: 0;
        }
    }

    input {
        &[type='text'],
        &[type='email'] {
            width: 100%;
            max-width: 390px;
            margin-bottom: 1rem;
            color: $color--white;
            background: transparent;
            border-top: 0;
            border-right: 0;
            border-bottom: 4px solid $color--light-blue;
            border-left: 0;
        }
    }

    label {
        display: block;
    }

    &__credits {
        display: flex;
        align-items: center;
        justify-content: space-between;
        flex-wrap: wrap;
        margin: 3rem 0;
    }
}