@import '_vars'

footer
    padding-top: 4rem
    margin: 4rem auto
    max-width: $main-width

    &.wide
        max-width: $more-width

    div.rows
        display: grid
        grid-auto-flow: column
        // justify-content: space-between
        margin-bottom: 2rem

        div.row
            margin-right: 1.5rem
            margin-bottom: 0.5rem

            &:last-child
                margin-right: 0
                margin-bottom: 0

            h2
                opacity: 1
                font-size: 1rem
                font-weight: 500
                margin: 1rem 0
                line-height: normal

            a
                width: fit-content
                font-size: 14px
                opacity: 0.6
                display: block
                text-decoration: none
                margin-bottom: 1rem

                &:hover
                    opacity: 0.8

    p
        opacity: 0.7

@media (max-width: 1000px)
    footer
        div.rows
            grid-auto-flow: row
            grid-template-columns: repeat(2, 1fr)

            div.row
                margin-bottom: 1rem

@media (max-width: 600px)
    footer
        div.rows
            grid-template-columns: 1fr