.hero {
    position: relative;
    background-image: linear-gradient(90deg, rgba(3, 37, 31, .96) 0%, rgba(4, 53, 44, .83) 42%, rgba(4, 53, 44, .25) 75%), url('../images/katabi-hero.webp');
    background-size: cover;
    background-position: center;
}

.hero .container { position: relative; z-index: 1; }

.card-image {
    display: block;
    width: 100%;
    height: 215px;
    object-fit: cover;
}

.project-photo {
    display: block;
    width: 100%;
    height: 330px;
    object-fit: cover;
    border-radius: .9rem;
    margin-bottom: 1rem;
    box-shadow: 0 18px 45px rgba(5, 50, 42, .12);
}

.community-feature { padding: 0 0 6rem; background: #f3f6f2; }
.community-feature .row { border-radius: 1rem; overflow: hidden; box-shadow: 0 20px 55px rgba(5, 50, 42, .14); }
.community-feature img { display: block; width: 100%; height: 100%; min-height: 430px; object-fit: cover; }
.community-feature .feature-copy { display: flex; flex-direction: column; justify-content: center; padding: 3.5rem; background: #073f35; color: #fff; }
.community-feature h2 { margin: .7rem 0 1rem; font-size: clamp(2rem, 3.5vw, 3.1rem); font-weight: 800; letter-spacing: -.04em; }
.community-feature p { color: #cfe0db; }
.community-feature a { color: #f4bc45; font-weight: 700; }

.about-photo {
    display: block;
    width: 100%;
    height: min(52vw, 560px);
    min-height: 320px;
    object-fit: cover;
    border-radius: 1rem;
    margin-bottom: 4rem;
}

.detail-image { display: block; width: 100%; max-height: 560px; object-fit: cover; border-radius: 1rem; margin-bottom: 2.5rem; }
.prose-copy { max-width: 780px; margin: 0 auto; }

@media (max-width: 991px) {
    .hero { background-position: 65% center; }
    .community-feature .feature-copy { padding: 2.5rem; }
    .community-feature img { min-height: 340px; }
}

@media (max-width: 600px) {
    .hero { background-image: linear-gradient(rgba(3, 37, 31, .88), rgba(4, 53, 44, .9)), url('../images/katabi-hero.webp'); }
    .card-image { height: 200px; }
    .project-photo { height: 240px; }
    .community-feature { padding-bottom: 3.5rem; }
    .community-feature img { min-height: 260px; }
    .community-feature .feature-copy { padding: 2rem; }
    .about-photo { height: 320px; margin-bottom: 2.5rem; }
}
