/* ============================================================
   首页「使用流程」区块（2026-09-13 新增）
   目的：原来首页只有 hero + 商品列表，完全没解释「买完还要去
   兑换页、还要准备 Session」这个两步流程，很多人卡在中间。
   这里只加样式，不改原有类。追加在 liuneng.v2.css 末尾。
   ============================================================ */

/* 三步卡片：桌面三列，窄屏单列 */
.ln-steps {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 14px;
}

@media (max-width: 900px) {
    .ln-steps { grid-template-columns: 1fr; }
}

/* ln-quick 已存在（hover 浮起 + 白卡），这里只补正文段落 */
.ln-quick-note {
    color: var(--muted);
    font-size: 13px;
    line-height: 1.7;
    margin-top: 10px;
}

.ln-quick-note code {
    background: #f3f4f6;
    border: 1px solid var(--line);
    border-radius: 6px;
    padding: 1px 6px;
    font-size: 12px;
    word-break: break-all;
}

.ln-quick-note a { color: #2563eb; font-weight: 600; }

/* 「要准备」提示条：复用 ln-notice，换成琥珀色引起注意 */
.ln-notice-warn {
    background: #fffbeb;
    border-color: #fde68a;
    margin-top: 18px;
}

.ln-notice-warn .ln-notice-tag { background: #b45309; }
.ln-notice-warn a { color: #b45309; font-weight: 600; }

/* FAQ */
.ln-faq {
    margin-top: 18px;
    display: grid;
    gap: 8px;
}

.ln-faq details {
    background: #fff;
    border: 1px solid var(--line);
    border-radius: var(--r);
    padding: 14px 18px;
    box-shadow: var(--shadow);
}

.ln-faq summary {
    cursor: pointer;
    font-weight: 600;
    font-size: 14px;
    list-style: none;
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.ln-faq summary::-webkit-details-marker { display: none; }

.ln-faq summary::after {
    content: '＋';
    color: var(--muted);
    font-weight: 400;
    margin-left: 12px;
}

.ln-faq details[open] summary::after { content: '－'; }

.ln-faq p {
    color: var(--muted);
    font-size: 13px;
    line-height: 1.75;
    margin: 10px 0 0;
}

.ln-faq a { color: #2563eb; font-weight: 600; }

/* hero 按钮组在窄屏换行 */
@media (max-width: 640px) {
    .ln-hero-actions { flex-direction: column; align-items: stretch; }
    .ln-hero-actions .ln-btn { text-align: center; }
}