.article-share{
    margin-top:30px;
    padding:22px;
    border:1px solid var(--border);
    border-radius:var(--r);
    background:var(--grad-soft);
}
.article-share__heading{margin-bottom:16px}
.article-share__eyebrow{
    display:block;
    margin-bottom:4px;
    color:var(--brand);
    font-size:.72rem;
    font-weight:800;
    letter-spacing:.1em;
    text-transform:uppercase;
}
.article-share h2{
    margin:0;
    font-size:1.15rem;
    line-height:1.25;
    letter-spacing:-.01em;
}
.article-share__heading p{
    margin:5px 0 0;
    color:var(--muted);
    font-size:.88rem;
}
.article-share__actions{
    display:flex;
    flex-wrap:wrap;
    gap:9px;
}
.share-button{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    gap:8px;
    min-height:42px;
    padding:9px 14px;
    border:1px solid var(--border);
    border-radius:999px;
    background:var(--surface);
    color:var(--text);
    cursor:pointer;
    font:600 .82rem var(--sans);
    text-decoration:none;
    transition:transform .18s ease, box-shadow .18s ease, border-color .18s ease;
}
.share-button:hover{
    transform:translateY(-2px);
    border-color:transparent;
    box-shadow:0 7px 16px rgba(20,18,33,.14);
}
.share-button:focus-visible{
    outline:0;
    box-shadow:var(--ring);
}
.share-button__icon{
    display:grid;
    width:21px;
    height:21px;
    place-items:center;
    border-radius:50%;
    background:currentColor;
    color:var(--surface);
    font-size:.82rem;
    line-height:1;
}
.share-button__icon--bold{font-weight:900;font-size:.73rem}
.share-button--x{background:#111827;color:#fff;border-color:#111827}
.share-button--facebook{background:#1877f2;color:#fff;border-color:#1877f2}
.share-button--linkedin{background:#0a66c2;color:#fff;border-color:#0a66c2}
.share-button--whatsapp{background:#16a34a;color:#fff;border-color:#16a34a}
.share-button--x .share-button__icon,
.share-button--facebook .share-button__icon,
.share-button--linkedin .share-button__icon,
.share-button--whatsapp .share-button__icon{background:rgba(255,255,255,.95);color:inherit}
.share-button--copy{color:var(--brand)}
.share-button--native{color:var(--accent)}
.article-share__status{
    margin:12px 0 0;
    color:var(--ok);
    font-size:.82rem;
    font-weight:700;
}
.article-share__status[hidden]{display:none}
@media(max-width:560px){
    .article-share{padding:18px}
    .share-button{flex:1 1 calc(50% - 9px)}
}