.about-follow {
        background: radial-gradient(ellipse at 78% 10%, #1c4b362e, transparent 62%), var(--forest-950);
    }

    .about-follow__lead {
        margin: 1.6rem 0 0;
        max-width: 32rem;
        font-size: clamp(0.95rem, 1.15vw, 1.06rem);
        line-height: 1.95;
        color: #bccbc0;
    }

    .about-follow__points {
        list-style: none;
        margin: 2.2rem 0 0;
        padding: 0;
        max-width: 32rem;
        border-top: 1px solid var(--line);
    }

    .about-follow__points li {
        display: flex;
        gap: 0.9rem;
        align-items: baseline;
        padding: 0.85rem 0;
        border-bottom: 1px solid var(--line);
        font-size: 0.88rem;
        line-height: 1.7;
        color: #a9bcae;
    }

    .about-follow__points li::before {
        content: '';
        flex: 0 0 auto;
        width: 5px;
        height: 5px;
        border-radius: 50%;
        background: var(--jade);
    }

    .about-follow__stage {
        display: flex;
        align-items: center;
        justify-content: center;
    }

    /* about 页里各小节标题被页面内的 scoped 规则统一压到 clamp(2rem,3.7vw,4.2rem)/
       line-height 1.3；本组件的样式是全局的、拿不到那个 scoped 属性，所以这里显式
       对齐同样的值，否则这一节标题会比同页其他标题明显偏大。 */
    .about-follow .section-title {
        font-size: clamp(2rem, 3.7vw, 4.2rem);
        line-height: 1.3;
    }

    .follow-card {
        --card-face: #ffffff;
        --card-ink: #1d1d1d;
        --card-muted: #9c9c9c;
        --card-body: #4c4c4c;
        --card-line: rgba(20, 20, 20, 0.08);
        --card-red: #ff2442;
        width: 100%;
        max-width: 22rem;
        margin-inline: auto;
    }

    .follow-card__stage {
        display: block;
        width: 100%;
        padding: 0;
        border: 0;
        background: none;
        color: inherit;
        text-align: left;
        cursor: pointer;
        perspective: 1400px;
        -webkit-tap-highlight-color: transparent;
    }

    .follow-card__inner {
        position: relative;
        display: block;
        width: 100%;
        aspect-ratio: 11 / 14;
        transform-style: preserve-3d;
        transform: rotateY(0deg);
        /* 与 GSAP power3.inOut 等价的缓动，起手更果断、落定更稳。 */
        transition: transform 0.9s cubic-bezier(0.645, 0.045, 0.355, 1);
    }

    .follow-card.is-flipped .follow-card__inner {
        transform: rotateY(180deg);
    }

    .follow-card__face {
        position: absolute;
        inset: 0;
        display: flex;
        flex-direction: column;
        border-radius: 22px;
        background: var(--card-face);
        box-shadow: 0 26px 60px rgba(3, 12, 7, 0.42);
        backface-visibility: hidden;
        -webkit-backface-visibility: hidden;
    }

    .follow-card__face--front {
        transform: rotateY(0deg);
    }

    .follow-card__face--back {
        transform: rotateY(180deg);
        padding: 1.5rem 1.5rem 1.6rem;
        text-align: center;
        align-items: center;
    }

    /* 封面用参考图实测的竖向剖面复刻。方向由区域梯度拟合得出（177°，近乎竖直），
       色标为逐行均值；实测与原图平均通道差 2.7/255。参考图本身是纯渐变，没有纹理。 */
    .follow-card__cover {
        flex: 0 0 auto;
        height: 34%;
        border-radius: 22px 22px 0 0;
        background: linear-gradient(177deg, #bab2b0 0%, #c1b2a7 20%, #d2bca6 40%, #e6c9a6 60%, #f2d9ac 80%, #f9e9bd 100%);
    }

    .follow-card__avatar {
        position: relative;
        z-index: 1;
        flex: 0 0 auto;
        display: grid;
        place-items: center;
        width: 4.7rem;
        height: 4.7rem;
        margin: -2.35rem 0 0 1.35rem;
        border-radius: 50%;
        background: #fff;
        box-shadow: 0 0 0 4px var(--card-face);
    }

    .follow-card__avatar img {
        width: 74%;
        height: auto;
    }

    .follow-card__body {
        display: flex;
        flex-direction: column;
        padding: 0.85rem 1.35rem 0;
    }

    .follow-card__name {
        font-size: 1.32rem;
        font-weight: 500;
        letter-spacing: -0.02em;
        color: var(--card-ink);
    }

    .follow-card__handle {
        margin-top: 0.25rem;
        font-size: 0.78rem;
        color: var(--card-muted);
    }

    .follow-card__rule {
        height: 1px;
        margin: 1.1rem 0;
        background: var(--card-line);
    }

    .follow-card__bio {
        font-size: 0.85rem;
        line-height: 1.75;
        color: var(--card-body);
    }

    .follow-card__foot {
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: 0.75rem;
        margin-top: auto;
        padding: 1.05rem 1.35rem 1.15rem;
        border-top: 1px solid var(--card-line);
        border-radius: 0 0 22px 22px;
    }

    .follow-card__badge {
        display: inline-flex;
        align-items: center;
        padding: 0.24rem 0.62rem;
        border-radius: 999px;
        background: var(--card-red);
        color: #fff;
        font-size: 0.72rem;
        font-weight: 500;
        letter-spacing: 0.01em;
    }

    .follow-card__cue {
        font-size: 0.74rem;
        color: var(--card-muted);
        white-space: nowrap;
    }

    .follow-card__flip-icon {
        display: inline-block;
        margin-left: 0.15rem;
    }

    .follow-card__back-head {
        display: flex;
        align-items: center;
        justify-content: space-between;
        width: 100%;
    }

    .follow-card__back-label {
        font: 500 0.56rem/1.2 'JetBrains Mono', monospace;
        letter-spacing: 0.18em;
        color: #bdbdbd;
    }

    .follow-card__qr {
        display: block;
        width: 80%;
        margin: 0.7rem auto 0.3rem;
    }

    .follow-card__qr img {
        width: 100%;
        height: auto;
    }

    .follow-card__face--back .follow-card__name {
        margin-top: auto;
    }

    .follow-card__scan {
        margin-top: 0.2rem;
        font-size: 0.76rem;
        color: var(--card-muted);
    }

    .follow-card__hint {
        margin: 1.15rem 0 0;
        color: #8ba394;
        font: 500 0.58rem/1.7 'JetBrains Mono', monospace;
        letter-spacing: 0.09em;
        text-align: center;
    }

    .follow-card__stage:hover .follow-card__face {
        box-shadow: 0 32px 70px rgba(3, 12, 7, 0.5);
    }

    .follow-card__stage:focus-visible {
        outline: 2px solid var(--jade);
        outline-offset: 6px;
        border-radius: 24px;
    }

    .follow-card :focus-visible {
        outline: none;
    }

    @media (max-width: 820px) {
        .about-follow__stage {
            margin-top: 2.6rem;
        }
    }

    @media (max-width: 760px) {
        .follow-card {
            max-width: 19rem;
        }

        .follow-card__name {
            font-size: 1.18rem;
        }

        .follow-card__avatar {
            width: 4.1rem;
            height: 4.1rem;
            margin: -2.05rem 0 0 1.1rem;
        }
    }

    @media (prefers-reduced-motion: reduce) {
        .follow-card__inner {
            transition: none;
        }
    }