.crag-list {
    display: grid;
    gap: 1.5rem;
}

.crag-card {
    overflow: hidden;
}

.crag-card-image {
    width: 100%;
    height: 220px;
    object-fit: cover;
}

.crag-meta {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem 1.5rem;
}

.area {
    color: var(--pico-muted-color);
}

.photo-gallery {
    display: grid;
    gap: 1rem;
}

.photo-gallery img {
    width: 100%;
    border-radius: var(--pico-border-radius);
}


/* Brand */

.brand {
    text-decoration: none;
}


/* Homepage */

.hero {
    max-width: 750px;
    margin-inline: auto;
    padding-block: 4rem 3rem;
    text-align: center;
}

.hero > p {
    color: var(--pico-muted-color);
}


.home-actions {
    display: grid;
    gap: 1.5rem;
    margin-bottom: 4rem;
}

.home-actions article {
    display: flex;
    flex-direction: column;
}

.home-actions article > p:last-of-type {
    flex-grow: 1;
}

.home-actions footer a {
    width: 100%;
}


.home-about {
    max-width: 750px;
    margin-inline: auto;
    margin-bottom: 4rem;
}


/* Footer */

.site-footer {
    padding-bottom: 2rem;
}

.footer-content {
    display: flex;
    flex-direction: column;
    gap: 1rem;
}


/* Desktop */

@media (min-width: 768px) {

    .home-actions {
        grid-template-columns: repeat(2, 1fr);
    }

    .footer-content {
        flex-direction: row;
        justify-content: space-between;
        align-items: end;
    }

}

.nav-form { margin: 0; }
.nav-form button { margin: 0; padding: 0.4rem 0.9rem; }


.message { padding: 0.75rem 1rem; margin-bottom: 1rem; }
.message.success { border-left: 4px solid #2e7d32; }
.message.error   { border-left: 4px solid #c62828; }
.message.warning { border-left: 4px solid #ef6c00; }
.message.info    { border-left: 4px solid #1565c0; }