/* ---------- mobile ---------- */

.list-module-wrap {
    padding: 0 var(--space-md);
    margin-bottom: var(--space-xxxl);
}

.list-module-wrap .list-module-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    grid-template-rows: 1fr;
    grid-column-gap: var(--space-md);
    max-width: 80rem;
    margin: 0 auto;
}

.list-module-wrap .list-module-grid h2 {
    grid-column: span 4;
    text-align: center;
    margin-bottom: var(--space-xxl);
}

.list-module-wrap .list-module-grid p {
    grid-column: span 4;
    text-align: center;
}

.list-module-wrap .list-module-grid ul {
    list-style: none;
    grid-column: span 4;
    text-align: center;
    margin-top: var(--space-xxl);
    display: flex;
    flex-direction: column;
    row-gap: var(--space-md);
}

.list-module-wrap .list-module-grid ul li a {
    color: var(--black);
}

.list-module-wrap .list-module-grid ul li a h3 {
    line-height: var(--lh-default);
}   

/* ---------- tablet ---------- */

@media screen and (min-width: 48rem) {
    .list-module-wrap .list-module-grid {
        grid-template-columns: repeat(6, 1fr);
    }

    .list-module-wrap .list-module-grid h2 {
        grid-column: span 6;
    }

    .list-module-wrap .list-module-grid p {
        grid-column: span 6;
    }

    .list-module-wrap .list-module-grid ul {
        grid-column: 2 / 6;
    }
}

/* ---------- laptop ---------- */

@media screen and (min-width: 80rem) {
    .list-module-wrap {
        margin-bottom: var(--space-xxxxl);
    }

    .list-module-wrap .list-module-grid {
        grid-template-columns: repeat(12, 1fr);
    }

    .list-module-wrap .list-module-grid h2 {
        grid-column: 2 / span 10;
    }

    .list-module-wrap .list-module-grid p {
        grid-column: 2 / span 10;
    }

    .list-module-wrap .list-module-grid ul {
        grid-column: 2 / span 10;
    }

    .list-module-wrap .list-module-grid ul li a h3 {
        font-size: var(--fs-md);
    }
}