/* My Building block — the Image and Text layout with the animation as the media */

.block-my-building {
    --my-building-gap: 30px;
}

.block-my-building__inner {
    display: grid;
    grid-template-columns: 1fr;
    gap: var(--my-building-gap);
    align-items: center;
}

/* Media — the animation brings its own ratio through the SVG viewBox, and its
   cards and tooltips are drawn outside that box on purpose, so nothing here
   clips or rounds it the way the Image and Text block does with a photo. */

.block-my-building__media {
    min-width: 0;
}

/* Content */

.block-my-building__content {
    display: flex;
    flex-direction: column;
    gap: 16px;
    align-items: center;
    text-align: center;
}

.block-my-building__title,
.block-my-building__subtitle {
    margin: 0;
}

.block-my-building__text > :first-child {
    margin-top: 0;
}

.block-my-building__text > :last-child {
    margin-bottom: 0;
}

.block-my-building__button {
    margin-top: 14px;
}

/* Desktop */

@media (min-width: 782px) {
    .block-my-building {
        --my-building-gap: 50px;
    }

    .block-my-building__inner {
        grid-template-columns: 1fr 1fr;
    }
}