/* ═══════════════════════════════════════════
   CheckNow Design System — News Card
   全站唯一资讯卡片 · Apple / Stripe 风格
   ═══════════════════════════════════════════ */

.cn-news-card {
    display: flex;
    flex-direction: column;
    border-radius: var(--cn-home-radius, 16px);
    overflow: hidden;
    background: var(--cn-surface);
    border: 1px solid var(--cn-border);
    box-shadow: none;
    transition: transform .25s ease, box-shadow .25s ease, border-color .25s ease;
    text-decoration: none;
    color: inherit;
}
.cn-news-card:hover {
    transform: translateY(-3px);
    box-shadow: 0 8px 24px rgba(10,25,47,.08);
    border-color: var(--cn-home-gold-light, #e8d49a);
}

/* ── 封面图 16:10 ── */
.cn-news-card__media { overflow: hidden; aspect-ratio: 16 / 10; background: var(--cn-navy-700, #10233f); }
.cn-news-card__media-link { display: block; height: 100%; }
.cn-news-card__media video,
.cn-news-card__media iframe { display: block; width: 100%; height: 100%; border: 0; object-fit: cover; }
.cn-news-card__image {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
    transition: transform .5s ease;
}
.cn-news-card:hover .cn-news-card__image {
    transform: scale(1.05);
}
.cn-news-card__image--placeholder {
    display: flex;
    align-items: center;
    justify-content: center;
    aspect-ratio: 16 / 10;
    background: linear-gradient(135deg, var(--cn-home-navy, #0a192f), #1a2d4a);
    color: rgba(240,212,149,.5);
    font-size: 48px;
    font-weight: var(--cn-font-bold);
}

/* ── 正文区 ── */
.cn-news-card__body {
    display: flex;
    flex-direction: column;
    flex: 1;
    padding: 18px;
}

/* ── 分类 Badge ── */
.cn-news-card__category {
    display: inline-block;
    align-self: flex-start;
    font-size: 10px;
    font-weight: 700;
    color: var(--cn-home-gold, #b69035);
    text-transform: uppercase;
    letter-spacing: .12em;
    margin-bottom: 6px;
}

/* ── 标题 ── */
.cn-news-card__title {
    font-size: 17px;
    font-weight: 700;
    color: var(--cn-home-navy, #0a192f);
    line-height: 1.3;
    margin: 0 0 6px;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    transition: color .2s;
}
.cn-news-card:hover .cn-news-card__title {
    color: var(--cn-home-gold, #b69035);
}

/* ── 摘要（3行）── */
.cn-news-card__excerpt {
    font-size: 14px;
    line-height: 1.55;
    color: var(--cn-home-text-muted, #64748b);
    margin: 0 0 10px;
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
    flex: 1;
}

/* ── 底部 Meta（分隔线 + 日期 + 阅读时间）── */
.cn-news-card__meta {
    display: flex;
    align-items: center;
    gap: 6px;
    margin-top: 0;
    padding-top: 0;
    border-top: 0;
    font-size: 12px;
    color: #9ca3af;
}
.cn-news-card__content { display: flex; flex-direction: column; flex: 1; }
.cn-news-card__footer { display: flex; justify-content: space-between; align-items: flex-end; gap: 16px; width: 100%; margin-top: auto; }
.cn-news-card__title a { color: inherit; text-decoration: none; }
.cn-news-card__meta-dot { color: var(--cn-border); }

.cn-news-card__cta {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    margin-top: 12px;
    margin-left: auto;
    color: var(--cn-home-gold, #b69035);
    font-size: 12px;
    font-weight: 700;
    letter-spacing: .05em;
    text-decoration: none;
}
.cn-news-card__cta > span { transition: transform .25s ease; }
.cn-news-card:hover .cn-news-card__cta > span,
.cn-news-card:focus-visible .cn-news-card__cta > span { transform: translateX(5px); }

/* 资讯列表页保留横向密度，但视觉语言与标准卡片一致。 */
.cn-news-card--horizontal {
    display: grid;
    grid-template-columns: minmax(220px, 38%) 1fr;
}
.cn-news-card--horizontal .cn-news-card__media,
.cn-news-card--horizontal .cn-news-card__image--placeholder {
    aspect-ratio: auto;
    min-height: 100%;
}

/* ── 响应式 ── */
@media (max-width: 768px) {
    .cn-news-card--horizontal { display: flex; }
    .cn-news-card--horizontal .cn-news-card__media,
    .cn-news-card--horizontal .cn-news-card__image--placeholder { aspect-ratio: 16 / 10; min-height: 0; }
    .cn-news-card__body { padding: 16px; }
    .cn-news-card__title { font-size: 18px; }
    .cn-news-card__excerpt { font-size: 14px; }
}