.vshp-community > .container {
    max-width: 1280px;
}

.vshp-community .vshp-community__card {
    max-width: 1200px;
}

.vshp-community .vshp-community__layout {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    grid-template-areas:
        "heading photo"
        "intro photo"
        "story story"
        "invitation invitation";
    gap: 1.5rem 2rem;
    align-items: start;
}

.vshp-community .vshp-community__heading {
    grid-area: heading;
}

.vshp-community .vshp-community__photo {
    grid-area: photo;
    align-self: center;
    width: 100%;
    aspect-ratio: 16 / 4;
    min-height: 150px;
    background: #eaf1f8;
    border-radius: .5rem 1.5rem;
    overflow: hidden;
}

.vshp-community .vshp-community__image,
.vshp-community .vshp-community__photo-placeholder {
    display: block;
    width: 100%;
    height: 100%;
    aspect-ratio: 16 / 4;
    min-height: 150px;
    object-fit: cover;
}

.vshp-community .vshp-community__photo-placeholder {
    display: grid;
    place-items: center;
    background: linear-gradient(120deg, #eaf1f8, #f5f8fc);
    color: #9cb5cf;
    font-size: 3.5rem;
}

.vshp-community .vshp-community__photo--filled {
    aspect-ratio: auto;
    min-height: 0;
}

.vshp-community .vshp-community__image {
    height: auto;
    min-height: 0;
    aspect-ratio: auto;
    object-position: 50% 38%;
}

.vshp-community .vshp-community__title {
    max-width: 760px;
    color: var(--rnx-primary);
    font-size: clamp(1.45rem, 3.5vw, 2.15rem);
    line-height: 1.2;
    overflow-wrap: anywhere;
}

.vshp-community .vshp-community__content {
    display: contents;
}

.vshp-community .vshp-community__intro {
    grid-area: intro;
    padding: 1.2rem 1.5rem;
    margin-bottom: 0;
    border-left: 3px solid var(--rnx-secondary);
    border-radius: 0 .75rem .75rem 0;
    background: #f4f7fb;
    color: var(--rnx-primary);
    line-height: 1.65;
}

.vshp-community .vshp-community__intro p {
    margin-bottom: .6rem;
}

.vshp-community .vshp-community__story {
    grid-area: story;
    display: grid;
    gap: 1rem;
    width: 100%;
    max-width: 900px;
    margin: .5rem auto;
    text-align: center;
    line-height: 1.65;
}

.vshp-community .vshp-community__intro p:last-child,
.vshp-community .vshp-community__story p:last-child {
    margin-bottom: 0;
}

.vshp-community .vshp-community__invitation {
    grid-area: invitation;
    display: flex;
    align-items: center;
    gap: 1.5rem;
    padding: 1.5rem;
    color: #fff;
    line-height: 1.65;
}

.vshp-community .vshp-community__invitation-text {
    flex: 1;
}

.vshp-community .vshp-community__actions {
    display: flex;
    flex-direction: column;
    gap: .5rem;
    flex-shrink: 0;
    margin: 0;
}

.vshp-community .vshp-community__subscribe {
    flex-shrink: 0;
    width: 100%;
    min-height: 48px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: .6rem;
    font-weight: 600;
}

.vshp-community .vshp-community__subscribe:focus-visible {
    outline: 3px solid #fff;
    outline-offset: 4px;
}

@media (max-width: 991.98px) {
    .vshp-community .vshp-community__layout {
        grid-template-columns: minmax(0, 1fr);
        grid-template-areas: "heading" "intro" "photo" "story" "invitation";
    }
}

@media (max-width: 767.98px) {
    .vshp-community .vshp-community__invitation {
        align-items: stretch;
        flex-direction: column;
        gap: 1rem;
    }

}
