/* Integration articles: one card per section instead of a single content block.
   Pages: zoom, google-meet, microsoft-teams, discord, ringcentral. */

/* The page-level card gives up its skin — each section carries it now */
.blog-content.earlyseo-article {
    padding: 0;
    background: none;
    border: 0;
    border-radius: 0;
}

.earlyseo-article .article-block {
    padding: 30px;
    background: #fff;
    border: 1px solid var(--line);
    border-radius: 5px;
}

.earlyseo-article .article-block > :first-child {
    margin-top: 0;
}

.earlyseo-article .article-block > :last-child {
    margin-bottom: 0;
}

/* Divider sitting in the gap between two cards: the line now runs edge to edge
   of the frame, so the markers land on its vertical rules. */
.earlyseo-article .frame-sep {
    margin: 13px -13px;
}

.earlyseo-article .frame-sep::before {
    background: rgba(132, 140, 161, .5);
}

/* Inline download link in step 1 — same chip as usage.html's routing steps */
.earlyseo-article .dl-chip {
    padding: 0px 8px !important;
    border-radius: 8px;
    background: #0000001c;
    color: var(--blue);
    font-weight: 700;
    text-decoration: none;
    transition: background .15s ease;
}

.earlyseo-article .dl-chip:hover {
    background: rgba(63, 81, 181, .18);
}

/* Real arrows inside the setup breadcrumbs, instead of the "→" character */
.earlyseo-article .step-arrow {
    display: inline-block;
    width: 1em;
    height: 1em;
    margin: 0 .12em;
    vertical-align: -.16em;
    color: #6b7280;
    stroke-width: 2.4;
}

/* Demo buttons live inside their step */
.earlyseo-article li > .demo-launch {
    margin: 16px 0 4px;
}

/* Closing block reads as the quieter, secondary part */
.earlyseo-article .article-outro {
    background: #fafafb;
}

.earlyseo-article .article-outro .article-related {
    margin-bottom: 0;
}

@media (max-width: 860px) {
    .earlyseo-article .article-block {
        padding: 26px 20px;
    }

    .earlyseo-article .frame-sep {
        margin: 30px -18px;
    }
}